/*
Theme Name: czarnykolor fotografia
Theme URI: https://example.com/
Author: czarnykolor fotografia
Description: Minimalistyczny motyw portfolio fotograficznego z trzema szerokimi kafelkami i edycją zdjęć przez Personalizuj.
Version: 2.0
Requires at least: 6.0
Text Domain: czarnykolor
*/
:root{--black:#111;--muted:#777;--red:#a51f2a;--bg:#fff;--max:1500px;--gap:18px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--black);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}.site{min-height:100vh}.site-header{max-width:var(--max);width:94%;margin:0 auto;padding:34px 0 24px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px}.brand{display:block}.brand-name{font-size:34px;line-height:1;font-weight:700;letter-spacing:-.05em}.brand-name .dot{color:var(--red)}.brand-sub{margin-top:8px;color:#666;font-size:12px;letter-spacing:.12em;text-transform:uppercase}.site-nav{display:flex;gap:28px;font-size:12px;letter-spacing:.13em;text-transform:uppercase}.site-nav a{transition:color .2s}.site-nav a:hover{color:var(--red)}.hero{max-width:var(--max);width:94%;margin:46px auto 0}.eyebrow{display:flex;align-items:center;gap:13px;color:#777;font-size:11px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:20px}.eyebrow:before{content:"";width:32px;height:1px;background:var(--red)}.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}.tile{position:relative;display:block;overflow:hidden;background:#eee;aspect-ratio:1.48/1}.tile-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s ease}.tile:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.62),rgba(0,0,0,0) 62%);opacity:.9;transition:opacity .3s}.tile:hover .tile-image{transform:scale(1.045)}.tile:hover:after{opacity:1}.tile-content{position:absolute;z-index:2;left:28px;right:28px;bottom:25px;color:#fff}.tile-title{font-size:20px;line-height:1.15;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.tile-arrow{display:inline-block;margin-top:9px;color:#fff;font-size:11px;letter-spacing:.14em;text-transform:uppercase}.about,.contact{max-width:900px;width:94%;margin:105px auto 0}.section-title{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#777;margin-bottom:18px}.about h1,.contact h1{font-size:32px;line-height:1.2;margin:0 0 18px}.about p,.contact p{color:#555;max-width:760px}.contact a:hover{color:var(--red)}.site-footer{max-width:var(--max);width:94%;margin:100px auto 0;padding:25px 0 40px;border-top:1px solid #eee;color:#888;font-size:12px}.gallery-page{max-width:var(--max);width:94%;margin:60px auto}.gallery-page h1{font-size:32px}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.gallery-grid img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}.placeholder{height:100%;display:flex;align-items:center;justify-content:center;color:#999;font-size:12px;letter-spacing:.1em;text-transform:uppercase;background:#eee}
@media(max-width:900px){.site-header{align-items:flex-start}.tiles{grid-template-columns:1fr 1fr}.tile{aspect-ratio:1.35/1}.tile:last-child{grid-column:1/-1}.site-nav{gap:15px}}
@media(max-width:620px){.site-header{display:block;padding-top:25px}.site-nav{margin-top:22px}.hero{margin-top:40px}.tiles{grid-template-columns:1fr}.tile,.tile:last-child{grid-column:auto;aspect-ratio:1.25/1}.tile-content{left:20px;right:20px;bottom:20px}.about,.contact{margin-top:70px}.about h1,.contact h1{font-size:26px}.gallery-grid{grid-template-columns:repeat(2,1fr)}}