:root{
  --paper:   #F7F4EA;
  --ink:     #17160F;
  --dim:     rgba(23,22,15,0.52);
  --hairline:rgba(23,22,15,0.14);
}
*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:-apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; } }

/* ---------- header / nav ---------- */
header{
  padding:32px 40px 0;
  display:flex; flex-direction:column; gap:6px;
  align-items:flex-start;
}
@media (max-width:640px){ header{ padding:24px 24px 0; } }

.mark{
  font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase;
  font-weight:500; margin-bottom:10px;
}
nav{ display:flex; flex-direction:column; gap:6px; }
nav a{
  font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--ink); opacity:0.72; transition:opacity .2s ease;
}
nav a:hover, nav a.active{ opacity:1; }

/* ---------- homepage cover ---------- */
.cover-wrap{
  display:flex; justify-content:center; align-items:center;
  padding:90px 40px 120px;
}
@media (max-width:640px){ .cover-wrap{ padding:56px 20px 80px; } }

.cover-link{ display:inline-flex; flex-direction:column; align-items:center; gap:16px; }
.cover-frame{
  width:min(30vw, 460px);
  overflow:hidden;
}
.cover-frame img{
  display:block; width:100%; height:auto;
  transition:opacity .3s ease;
}
.cover-link:hover .cover-frame img{ opacity:0.88; }
.cover-cap{
  font-size:0.78rem; letter-spacing:0.06em; color:var(--ink);
}
@media (max-width:640px){ .cover-frame{ width:100%; } }

/* ---------- gallery mosaic (varied sizes, click to enlarge) ---------- */
main{ padding:70px 0 140px; }
.mosaic{
  padding:0 56px;
  column-count:3; column-gap:56px;
}
@media (max-width:1000px){ .mosaic{ column-count:2; padding:0 32px; column-gap:36px; } }
@media (max-width:640px){ .mosaic{ column-count:1; padding:0 20px; } }

.shoot-divider{
  height:1px; background:var(--hairline);
  margin:14vh 96px;
}
@media (max-width:1000px){ .shoot-divider{ margin:10vh 56px; } }
@media (max-width:640px){ .shoot-divider{ margin:8vh 24px; } }

.g-item{
  break-inside:avoid; margin-bottom:56px;
  overflow:hidden; cursor:zoom-in;
  background:#0000000a;
}
.g-item img{
  display:block; width:100%; height:auto;
  transition:transform .4s ease, opacity .3s ease;
}
.g-item:hover img{ transform:scale(1.02); opacity:0.92; }

/* stagger vertical rhythm so items don't line up too neatly, mirroring the reference layout */
.g-a{ margin-top:0; }
.g-b{ margin-top:16vh; }
.g-c{ margin-top:5vh; }
.g-d{ margin-top:22vh; }
@media (max-width:1000px){ .g-b,.g-c,.g-d{ margin-top:0; } }

/* lightbox */
.lightbox{
  position:fixed; inset:0; z-index:200;
  background:rgba(23,22,15,0.92);
  display:none; align-items:center; justify-content:center;
  padding:6vh 6vw; cursor:zoom-out;
}
.lightbox.open{ display:flex; }
.lightbox img{
  max-width:100%; max-height:100%; object-fit:contain;
  box-shadow:0 20px 60px rgba(0,0,0,0.3);
}
.lightbox-close{
  position:fixed; top:28px; right:40px; z-index:201;
  font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--paper); background:none; border:none; cursor:pointer;
}
@media (max-width:640px){ .lightbox-close{ top:18px; right:20px; } }


/* ---------- text pages (info / book) ---------- */
.text-page{
  max-width:560px; margin:0 auto;
  padding:20vh 40px 20vh;
}
@media (max-width:640px){ .text-page{ padding:14vh 24px 14vh; } }

.text-page p{
  font-size:1.15rem; line-height:1.7; font-weight:400; color:var(--ink);
  margin-bottom:22px;
}
.text-page p.sub{ font-size:0.82rem; color:var(--dim); margin-top:10px; }

.facts{
  margin-top:48px; display:grid; grid-template-columns:1fr 1fr; gap:20px 32px;
  border-top:1px solid var(--hairline); padding-top:24px;
}
.facts div{ font-size:0.7rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--dim); }
.facts div b{
  display:block; color:var(--ink); font-weight:400; text-transform:none;
  letter-spacing:0; font-size:0.98rem; margin-top:6px; font-family:inherit;
}

.big-link{
  display:block; font-size:clamp(1.5rem,4vw,2.1rem); font-weight:400;
  margin-bottom:14px; transition:opacity .2s ease;
}
.big-link:hover{ opacity:0.55; }

/* ---------- contact form ---------- */
.contact-form{
  display:flex; flex-direction:column; gap:20px;
}
.contact-form label{ display:flex; flex-direction:column; gap:8px; }
.contact-form span{
  font-size:0.7rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--dim);
}
.contact-form input, .contact-form textarea{
  font-family:inherit; font-size:1rem; color:var(--ink);
  background:transparent; border:none; border-bottom:1px solid var(--hairline);
  padding:8px 2px; resize:vertical; outline:none;
  transition:border-color .2s ease;
}
.contact-form input:focus, .contact-form textarea:focus{ border-color:var(--ink); }
.contact-form button{
  align-self:flex-start; margin-top:8px;
  font-family:inherit; font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase;
  background:var(--ink); color:var(--paper); border:none;
  padding:12px 28px; cursor:pointer; transition:opacity .2s ease;
}
.contact-form button:hover{ opacity:0.8; }