:root{
  --bg:#0c0c0d;
  --bg-soft:#141416;
  --fg:#f2f0ec;
  --muted:#9a958c;
  --line:#26262a;
  --accent:#c9a96a;
  --header-h:64px;
  --maxw:1500px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  font-weight:300;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* ---------- Header ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;height:var(--header-h);z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(18px,4vw,44px);
  background:rgba(12,12,13,.72);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.brand{
  font-family:'Cormorant Garamond',serif;font-size:1.42rem;letter-spacing:.06em;
  font-weight:500;white-space:nowrap;
}
.site-nav{display:flex;flex-wrap:nowrap;gap:clamp(10px,1.4vw,22px);align-items:center}
.site-nav a{
  font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
  font-weight:400;padding:6px 0;position:relative;transition:color .25s;white-space:nowrap;
}
.site-nav a:hover,.site-nav a.active{color:var(--fg)}
.site-nav a.active::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--accent);
}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;width:30px;height:24px;padding:0;position:relative}
.nav-toggle span{display:block;height:1.5px;background:var(--fg);margin:5px 0;transition:.3s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

@media(max-width:1024px){
  /* backdrop-filter on the header would create a containing block for the
     fixed nav overlay (clamping it to header height) — disable it here. */
  .site-header{backdrop-filter:none;background:rgba(12,12,13,.94)}
  .nav-toggle{display:block;z-index:60}
  .site-nav{
    position:fixed;inset:0;z-index:55;flex-direction:column;justify-content:center;gap:24px;
    background:#0a0a0b;
    transform:translateX(100%);transition:transform .4s cubic-bezier(.4,0,.2,1);
  }
  .site-nav.open{transform:none}
  .site-nav a{font-size:1.05rem;letter-spacing:.18em}
}

/* ---------- Layout ---------- */
main{padding-top:var(--header-h);min-height:60vh}
.loading{padding:30vh 0;text-align:center;color:var(--muted);letter-spacing:.2em;font-size:.8rem}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(14px,4vw,44px)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- Hero / Home ---------- */
.hero{
  position:relative;height:calc(100vh - var(--header-h));min-height:480px;
  display:flex;align-items:flex-end;overflow:hidden;
}
.hero-bg{position:absolute;inset:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.62)}
.hero-grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,12,13,.25),rgba(12,12,13,.1) 40%,var(--bg))}
.hero-inner{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,4vw,44px) clamp(40px,8vh,90px)}
.hero h1{
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:clamp(2.6rem,7vw,5.6rem);line-height:1.02;margin:0 0 .2em;letter-spacing:.01em;
}
.hero p{max-width:30ch;color:var(--fg);opacity:.9;font-size:clamp(.95rem,2vw,1.1rem);margin:0}
.hero .scroll-cue{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:2;color:var(--muted);font-size:.7rem;letter-spacing:.3em;text-transform:uppercase}

section.block{padding:clamp(54px,9vh,110px) 0}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:34px}
.section-head h2{
  font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(1.7rem,4vw,2.6rem);margin:0;letter-spacing:.02em;
}
.eyebrow{color:var(--accent);letter-spacing:.28em;text-transform:uppercase;font-size:.7rem;margin-bottom:14px}

/* category cards */
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,1.4vw,18px)}
@media(max-width:880px){.cats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.cats{grid-template-columns:1fr}}
.cat{position:relative;display:block;overflow:hidden;aspect-ratio:4/5;background:var(--bg-soft)}
.cat img{
  width:100%;height:100%;object-fit:cover;
  /* soft bokeh-style blur + darken so the title reads clearly on top */
  filter:blur(5px) brightness(.52) saturate(1.05);
  transform:scale(1.12);
  transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter 1s ease;
}
.cat:hover img{transform:scale(1.06);filter:blur(0) brightness(.66) saturate(1.05)}
.cat-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:18px}
.cat-label .t{
  font-family:'Cormorant Garamond',serif;font-weight:600;
  font-size:clamp(2.1rem,4.4vw,3.4rem);line-height:1.04;letter-spacing:.04em;
  text-shadow:0 2px 34px rgba(0,0,0,.55),0 1px 4px rgba(0,0,0,.4);
}
.cat-label .c{
  font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(242,240,236,.78);
  text-shadow:0 1px 10px rgba(0,0,0,.5);
}

/* ---------- About ---------- */
.about{display:grid;grid-template-columns:0.85fr 1.15fr;gap:clamp(24px,5vw,72px);align-items:start}
@media(max-width:820px){.about{grid-template-columns:1fr}}
.about .portrait{width:100%;aspect-ratio:3/4;object-fit:cover}
.about h1{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(2rem,5vw,3.2rem);margin:0 0 .4em}
.about p{color:#d9d6cf;margin:0 0 1.1em;max-width:60ch}
.about p.ru{color:var(--muted);font-size:.95rem}
.contact-list{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:10px}
.contact-list a,.contact-list span{color:var(--fg)}
.contact-list .k{color:var(--accent);letter-spacing:.18em;text-transform:uppercase;font-size:.66rem;display:inline-block;width:108px}

/* ---------- Gallery (masonry) ---------- */
.gallery-head{padding:clamp(40px,7vh,86px) 0 26px}
.gallery-head h1{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(2rem,5.5vw,3.4rem);margin:0}
.gallery-head .count{color:var(--muted);letter-spacing:.2em;text-transform:uppercase;font-size:.7rem;margin-top:8px}
.masonry{column-count:3;column-gap:clamp(8px,1.2vw,16px)}
@media(max-width:980px){.masonry{column-count:2}}
@media(max-width:560px){.masonry{column-count:1}}
.masonry .tile{break-inside:avoid;margin:0 0 clamp(8px,1.2vw,16px);position:relative;cursor:zoom-in;background:var(--bg-soft);overflow:hidden}
.masonry .tile img{width:100%;height:auto;transition:opacity .6s,transform 1s cubic-bezier(.2,.7,.2,1);opacity:0}
.masonry .tile img.loaded{opacity:1}
.masonry .tile:hover img{transform:scale(1.03)}

/* videos */
.videos{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(10px,2vw,26px)}
@media(max-width:760px){.videos{grid-template-columns:1fr}}
.video-fig{margin:0}
.vid{position:relative;aspect-ratio:16/9;background:#000;border:1px solid var(--line);overflow:hidden}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-cap{margin-top:10px;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px}
.video-cap .vt{font-family:'Cormorant Garamond',serif;font-size:1.15rem;letter-spacing:.02em;color:var(--fg);text-transform:none}
.video-cap a{color:var(--muted);transition:color .25s;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.video-cap a:hover{color:var(--accent)}

/* ---------- Footer ---------- */
.site-footer{border-top:1px solid var(--line);margin-top:40px;padding:clamp(40px,7vh,80px) clamp(18px,4vw,44px)}
.footer-inner{max-width:var(--maxw);margin:0 auto;display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:flex-start}
.footer-inner .fname{font-family:'Cormorant Garamond',serif;font-size:1.7rem;letter-spacing:.04em}
.footer-links{display:flex;flex-wrap:wrap;gap:10px 26px;font-size:.8rem;color:var(--muted);letter-spacing:.08em}
.footer-links a:hover{color:var(--fg)}
.copyright{width:100%;color:#56544f;font-size:.7rem;letter-spacing:.12em;margin-top:30px}

/* ---------- Lightbox ---------- */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(8,8,9,.97);display:none;align-items:center;justify-content:center;touch-action:none}
.lightbox.open{display:flex}
.lb-stage{margin:0;max-width:94vw;max-height:88vh;display:flex;align-items:center;justify-content:center}
.lb-stage img{max-width:94vw;max-height:88vh;width:auto;height:auto;object-fit:contain;box-shadow:0 20px 70px rgba(0,0,0,.6)}
.lb-close{position:absolute;top:14px;right:20px;background:none;border:0;color:#fff;font-size:2.4rem;line-height:1;cursor:pointer;opacity:.8}
.lb-close:hover{opacity:1}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;font-size:3rem;cursor:pointer;opacity:.6;padding:20px;user-select:none}
.lb-nav:hover{opacity:1}
.lb-prev{left:6px}.lb-next{right:6px}
.lb-counter{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:var(--muted);font-size:.74rem;letter-spacing:.2em}
@media(max-width:620px){.lb-nav{font-size:2rem;padding:10px}}
