:root{
  --stone:#EAE3D3;
  --stone-deep:#DFD3B4;
  --paper:#F7F2E6;
  --ink:#241F17;
  --ink-soft:#5C5240;
  --ink-faint:#8C816B;
  --moss:#4B5A3E;
  --moss-deep:#333E29;
  --terracotta:#BE5C34;
  --terracotta-deep:#8F4526;
  --ochre:#D3A03E;
  --ochre-soft:#F1DFAE;
  --river:#6E827C;
  --river-soft:#D7DFD6;
  --clover:#93A16E;
  --line:rgba(36,31,23,0.14);
  --line-on-dark:rgba(247,242,230,0.2);
  --ease-organic: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; scroll-padding-top:90px;}
body{
  background:var(--stone);
  color:var(--ink);
  font-family:'Inter', sans-serif;
  font-weight:400;
  line-height:1.65;
  overflow-x:hidden;
  font-size:16px;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;}
}

.display{ font-family:'Instrument Serif', serif; font-weight:400; letter-spacing:-0.01em; color:var(--ink); }
.hand{ font-family:'Caveat', cursive; font-weight:600; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ list-style:none; }
section{ position:relative; }

.eyebrow{
  font-family:'Space Grotesk', sans-serif;
  font-size:11.5px; letter-spacing:0.24em; text-transform:uppercase;
  color:var(--terracotta-deep); font-weight:600;
  display:inline-flex; align-items:center; gap:10px;
}
.eyebrow::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--ochre); display:inline-block; }
.eyebrow.on-dark{ color:var(--ochre-soft); }
.eyebrow.on-dark::before{ background:var(--ochre); }

.wrap{ max-width:1280px; margin:0 auto; padding:0 48px; }
@media (max-width:640px){ .wrap{ padding:0 22px; } }
a:focus-visible, button:focus-visible{ outline:2px solid var(--terracotta); outline-offset:3px; }

@keyframes floatDrift{
  0%{   transform:translate3d(0,0,0) rotate(0deg) scale(1); }
  22%{  transform:translate3d(14px,-22px,0) rotate(7deg) scale(1.04); }
  48%{  transform:translate3d(-10px,-38px,0) rotate(-5deg) scale(0.97); }
  74%{  transform:translate3d(-18px,-14px,0) rotate(4deg) scale(1.02); }
  100%{ transform:translate3d(0,0,0) rotate(0deg) scale(1); }
}
.float-pebble{
  position:absolute; border-radius:60% 40% 55% 45% / 45% 55% 40% 60%;
  opacity:0.45; animation:floatDrift 11s ease-in-out infinite;
  pointer-events:none; z-index:0; filter:blur(0.2px);
}
.float-pebble.slow{ animation-duration:16s; }
.float-pebble.fast{ animation-duration:8s; }
@keyframes dotPulse{ 0%,100%{ opacity:0.4; transform:scale(1);} 50%{ opacity:0.95; transform:scale(1.3);} }
.pebble-bubbles{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.pebble-bubbles .float-pebble{ box-shadow:0 10px 24px rgba(36,31,23,0.08); }

.announce{
  background:var(--moss-deep); color:var(--stone); text-align:center;
  font-family:'Space Grotesk', sans-serif; font-size:12px; letter-spacing:0.06em;
  padding:9px 20px; position:relative; z-index:120;
}
.announce span{ opacity:0.82; }
/* Hidden on mobile — it was pushing the fixed header (and everything below
   it) down and eating into the hero's visible space on small screens. */
@media (max-width:900px){ .announce{ display:none; } }

header{
  position:fixed; top:16px; left:0; right:0; z-index:110;   /* after */
  transition:background .4s ease, top .4s ease, box-shadow .4s ease, transform .35s ease;
}
header.scrolled{
  top:0; background:rgba(234,227,211,0.95); backdrop-filter:blur(10px);
  box-shadow:0 1px 0 var(--line);
}
/* No announcement bar above the header on mobile, so the header itself
   should sit flush at the very top, scrolled or not. */
@media (max-width:900px){ header{ top:10px; } }
header.hide-nav{ transform:translateY(-100%); }
nav{ display:flex; align-items:center; justify-content:space-between; padding:28px 48px; max-width:1280px; margin:0 auto; }   /* after */
.logo-lockup{ display:flex; align-items:center; gap:12px; }
.logo-mark-img{ height:68px; width:auto; display:block; filter:drop-shadow(0 2px 6px rgba(0,0,0,0.28)); transition:height .3s ease; }   /* after */
header.scrolled .logo-mark-img{ height:54px; }   /* after */
.logo-word{ font-family:'Instrument Serif', serif; font-style:italic; font-size:34px;color:var(--stone); transition:color .4s ease; }
header.scrolled .logo-word{ color:var(--ink); }
.logo-word b{ font-style:normal; font-weight:400; color:var(--ochre); }
header.scrolled .logo-word b{ color:var(--terracotta); }
@media (max-width:640px){ .logo-mark-img{ height:44px; } .logo-word{ font-size:20px; } nav{ padding:14px 20px; } }

.nav-links{ display:flex; gap:34px; font-family:'Space Grotesk',sans-serif; font-size:13px; letter-spacing:0.06em; text-transform:uppercase; }
.nav-links a{ position:relative; padding-bottom:5px; color:var(--stone); opacity:0.9; transition:opacity .3s ease, color .4s ease; }
header.scrolled .nav-links a{ color:var(--ink-soft); }
.nav-links a.active{ opacity:1; }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:1.5px; background:var(--ochre); transition:width .3s ease; }
header.scrolled .nav-links a::after{ background:var(--terracotta); }
.nav-links a:hover::after, .nav-links a.active::after{ width:100%; }
.nav-links a:hover{ opacity:1; }

.nav-cta{ font-family:'Space Grotesk',sans-serif; display:flex; align-items:center; gap:8px; border:1px solid var(--line-on-dark); color:var(--stone); padding:9px 20px; border-radius:2px; font-size:12px; letter-spacing:0.05em; text-transform:uppercase; transition:all .3s ease; }
header.scrolled .nav-cta{ border-color:var(--ink); color:var(--ink); }
.nav-cta:hover{ background:var(--ochre); border-color:var(--ochre); color:var(--ink); }

.nav-toggle{ display:none; background:none; border:none; cursor:pointer; }
.nav-toggle svg path{ stroke:var(--stone); transition:stroke .4s ease; }
header.scrolled .nav-toggle svg path{ stroke:var(--ink); }
@media (max-width:900px){ .nav-links{ display:none; } .nav-toggle{ display:block; } .nav-cta{ display:none; } }

.art-frame{
  position:relative; overflow:hidden;
  background:radial-gradient(circle at 25% 15%, #DED0AC, transparent 55%), linear-gradient(150deg,#D3C299 0%,#B4A276 45%,#7C8968 100%);
  display:flex; align-items:center; justify-content:center;
}
.art-frame img{ width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.art-frame .ph-caption{ position:relative; z-index:2; text-align:center; padding:20px; color:rgba(36,31,23,0.5); font-family:'Space Grotesk',sans-serif; font-size:11px; letter-spacing:0.05em; max-width:200px; }
.blob-a{ border-radius:62% 38% 51% 49% / 41% 44% 56% 59%; }
.blob-b{ border-radius:38% 62% 57% 43% / 55% 41% 59% 45%; }

.btn{ font-family:'Space Grotesk',sans-serif; display:inline-flex; align-items:center; gap:10px; padding:15px 30px; border-radius:2px; font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase; font-weight:600; cursor:pointer; border:1px solid transparent; transition:transform .55s var(--ease-spring), background-color .35s var(--ease-out), color .35s var(--ease-out), border-color .35s var(--ease-out), box-shadow .45s var(--ease-out); will-change:transform; }
.btn:hover{ transform:translate3d(0,-3px,0); box-shadow:0 14px 28px rgba(36,31,23,0.18); }
.btn:active{ transform:translate3d(0,-1px,0) scale(0.98); transition-duration:.15s; }
.btn-cream{ background:var(--stone); color:var(--ink); }
.btn-cream:hover{ background:var(--ochre); }
.btn-outline-cream{ border-color:var(--stone); color:var(--stone); }
.btn-outline-cream:hover{ background:var(--stone); color:var(--ink); }
.btn-outline-dark{ border-color:var(--ink); color:var(--ink); }
.btn-outline-dark:hover{ background:var(--ink); color:var(--stone); }

.reveal{ opacity:0; transform:translate3d(0,44px,0) scale(0.97); transition:opacity 0.8s var(--ease-organic), transform 0.8s var(--ease-organic); will-change:opacity, transform; }
.reveal.in{ opacity:1; transform:translate3d(0,0,0) scale(1); }
.reveal.in.settled{ will-change:auto; }
.reveal-left{ transform:translate3d(-42px,0,0) scale(0.985); }
.reveal-left.in{ transform:translate3d(0,0,0) scale(1); }
.reveal-right{ transform:translate3d(42px,0,0) scale(0.985); }
.reveal-right.in{ transform:translate3d(0,0,0) scale(1); }
.reveal-fade-only{ opacity:0; transition:opacity 0.8s var(--ease-organic); will-change:opacity; }
.reveal-fade-only.in{ opacity:1; }
.reveal-fade-only.in.settled{ will-change:auto; }
.reveal-group > *{ transition-delay:calc(var(--stagger-i, 0) * 110ms); }

.marquee-band{ background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0; overflow:hidden; }
.marquee-track{ display:flex; white-space:nowrap; width:max-content; animation:marquee 32s linear infinite; will-change:transform; }
.marquee-track:hover{ animation-play-state:paused; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.marquee-track span{ font-family:'Space Grotesk',sans-serif; font-size:15px; letter-spacing:0.03em; text-transform:uppercase; color:var(--ink-soft); padding:0 28px; display:inline-flex; align-items:center; gap:28px; }
.marquee-track span::after{ content:"◦"; color:var(--terracotta); font-size:14px; }

.ticket-strip{ background:var(--stone-deep); padding:0; }
.ticket-grid{ display:grid; grid-template-columns:repeat(4,1fr); }
@media (max-width:860px){ .ticket-grid{ grid-template-columns:repeat(2,1fr); } }
.ticket-item{ padding:38px 30px; border-right:1px dashed var(--ink-faint); text-align:left; transition:transform 0.6s var(--ease-spring), box-shadow 0.5s var(--ease-out); }
.ticket-item:last-child{ border-right:none; }
@media (max-width:860px){ .ticket-item:nth-child(2n){ border-right:none; } .ticket-item{ border-bottom:1px dashed var(--ink-faint); } }
.ticket-item:hover{ transform:translate3d(0,-5px,0); background:rgba(247,242,230,0.5); }
.ticket-num{ font-family:'Space Grotesk',sans-serif; font-size:11px; letter-spacing:0.14em; color:var(--terracotta); margin-bottom:10px; display:block; }
.ticket-item h4{ font-family:'Instrument Serif',serif; font-size:22px; font-weight:400; margin-bottom:8px; }
.ticket-item p{ font-size:13.5px; color:var(--ink-faint); }

.section{ padding:130px 0; }
.section.tight{ padding:100px 0; }
.section.top-clear{ padding-top:180px; }
@media (max-width:640px){ .section{ padding:80px 0; } .section.top-clear{ padding-top:150px; } }
.section-head{ max-width:640px; margin-bottom:56px; }
.section-head h2{ font-family:'Instrument Serif',serif; font-size:clamp(32px,3.8vw,48px); margin-top:16px; line-height:1.12; font-weight:400; }
.section-head p{ color:var(--ink-soft); margin-top:16px; font-size:16px; max-width:520px; }
.section-head .hint-line{ display:flex; align-items:center; gap:8px; margin-top:10px; font-family:'Space Grotesk',sans-serif; font-size:12.5px; color:var(--terracotta-deep); font-weight:600; }
.center{ margin-left:auto; margin-right:auto; text-align:center; }

.page-hero{ background:var(--moss); color:var(--stone); padding:200px 0 80px; text-align:center; position:relative; overflow:hidden; }
@media (max-width:640px){ .page-hero{ padding:160px 0 60px; } }
.page-hero h1{ font-family:'Instrument Serif',serif; font-weight:400; font-style:italic; font-size:clamp(38px,5vw,64px); margin-top:16px; }
.page-hero p{ color:rgba(247,242,230,0.82); max-width:560px; margin:16px auto 0; font-size:16.5px; }

.about-grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:80px; align-items:start; }
@media (max-width:900px){ .about-grid{ grid-template-columns:1fr; } }
.about-media{ position:sticky; top:120px; }
.about-media .art-frame{ aspect-ratio:4/5; }
@media (max-width:900px){ .about-media{ position:static; } }
.about-copy .dropcap{ font-family:'Instrument Serif',serif; font-style:italic; font-size:88px; line-height:0.7; float:left; margin:8px 12px -8px 0; color:var(--terracotta); }
.about-copy p{ color:var(--ink-soft); margin-bottom:18px; font-size:17px; }
.about-copy p strong{ color:var(--ink); font-weight:600; }
.about-copy .signoff{ font-family:'Caveat',cursive; font-size:26px; color:var(--terracotta-deep); margin-top:8px; }
.about-stat{ display:inline-flex; align-items:baseline; gap:10px; margin:4px 0 20px; font-family:'Space Grotesk',sans-serif; }
.about-stat .num{ font-family:'Instrument Serif',serif; font-style:italic; font-size:44px; color:var(--terracotta-deep); line-height:1; }
.about-stat .label{ font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); font-weight:600; }

.artist-section{ background:var(--moss); color:var(--stone); padding:100px 0 130px; overflow:hidden; }
.artist-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:70px; align-items:center; }
@media (max-width:900px){ .artist-grid{ grid-template-columns:1fr; } }
.artist-media{ position:relative; }
.artist-media .art-frame{ aspect-ratio:3/4; margin-left:10%; }
@media (max-width:900px){ .artist-media .art-frame{ margin-left:0; } }
.artist-media .stamp{
  position:absolute; top:-24px; left:0; width:96px; height:96px; border-radius:50%;
  background:var(--ochre); color:var(--moss-deep); display:flex; align-items:center; justify-content:center;
  font-family:'Space Grotesk',sans-serif; font-size:10.5px; text-align:center; letter-spacing:0.06em; text-transform:uppercase;
  transform:rotate(-10deg); box-shadow:0 10px 24px rgba(0,0,0,0.25);
}
.artist-section h2{ font-family:'Instrument Serif',serif; font-weight:400; font-size:clamp(30px,3.4vw,44px); margin-top:14px; }
.artist-role{ font-family:'Caveat',cursive; font-weight:600; font-size:22px; color:var(--ochre-soft); margin:8px 0 26px; }
.artist-copy p{ color:rgba(247,242,230,0.82); margin-bottom:16px; font-size:16.5px; }
.artist-quote{ font-family:'Caveat',cursive; font-weight:600; font-size:30px; line-height:1.35; margin-top:26px; color:var(--stone); border-left:2px solid var(--ochre); padding-left:22px; }
.artist-credentials{ display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
.artist-credentials span{
  font-family:'Space Grotesk',sans-serif; font-size:11px; letter-spacing:0.04em; text-transform:uppercase;
  color:var(--ochre-soft); background:rgba(247,242,230,0.07); border:1px solid var(--line-on-dark);
  padding:8px 14px; border-radius:20px; white-space:nowrap;
}
.artist-credentials.skills span{ color:var(--moss-deep); background:var(--ochre-soft); border-color:transparent; font-weight:700; }
.artist-hobbies{ font-family:'Caveat',cursive; font-weight:500; font-size:18px; color:rgba(247,242,230,0.65); margin-top:20px; }
.artist-subhead{ font-family:'Space Grotesk',sans-serif; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ochre-soft); opacity:0.75; margin:22px 0 4px; }

.coll-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px 26px; }
@media (max-width:900px){ .coll-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .coll-grid{ grid-template-columns:1fr; } }
.coll-item{ text-align:center; animation:floatDrift 10s ease-in-out infinite; }
.coll-item:nth-child(4n+1){ animation-duration:11s; animation-delay:0s; }
.coll-item:nth-child(4n+2){ animation-duration:9s;  animation-delay:1.2s; }
.coll-item:nth-child(4n+3){ animation-duration:12s; animation-delay:.5s; }
.coll-item:nth-child(4n+4){ animation-duration:10s; animation-delay:1.8s; }
.coll-item .art-frame{ aspect-ratio:1/1.02; margin-bottom:16px; transition:transform .35s ease, box-shadow .35s ease; border:1px solid var(--line); cursor:pointer; position:relative; }
.coll-item:nth-child(4n+1) .art-frame{ border-radius:62% 38% 51% 49% / 41% 44% 56% 59%; }
.coll-item:nth-child(4n+2) .art-frame{ border-radius:38% 62% 57% 43% / 55% 41% 59% 45%; }
.coll-item:nth-child(4n+3) .art-frame{ border-radius:48% 52% 63% 37% / 52% 38% 62% 48%; }
.coll-item:nth-child(4n+4) .art-frame{ border-radius:55% 45% 40% 60% / 60% 48% 52% 40%; }
.coll-item:hover .art-frame{ transform:translateY(-6px) rotate(-1.5deg); box-shadow:0 20px 34px rgba(36,31,23,0.16); }
.coll-item h4{ font-family:'Space Grotesk',sans-serif; font-size:13.5px; letter-spacing:0.04em; text-transform:uppercase; font-weight:500; }
.coll-item .art-frame::after{
  content:"+"; position:absolute; bottom:10px; right:10px; width:30px; height:30px; border-radius:50%;
  background:rgba(247,242,230,0.9); color:var(--ink); display:flex; align-items:center; justify-content:center;
  font-family:'Space Grotesk',sans-serif; font-size:18px; font-weight:600; z-index:3;
  opacity:0; transform:scale(0.7); transition:opacity .3s ease, transform .3s var(--ease-spring);
}
.coll-item:hover .art-frame::after{ opacity:1; transform:scale(1); }
.coll-view-tag{
  position:absolute; top:10px; left:10px; z-index:3;
  background:rgba(36,31,23,0.68); color:var(--paper);
  font-family:'Space Grotesk',sans-serif; font-size:10px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase;
  padding:5px 10px; border-radius:20px; display:flex; align-items:center; gap:5px; pointer-events:none;
}
.coll-empty{ text-align:center; color:var(--ink-faint); font-family:'Space Grotesk',sans-serif; font-size:13px; padding:40px 0; grid-column:1/-1; }

.why-band{ text-align:center; padding:150px 0; }
.why-fade{ font-family:'Caveat',cursive; font-weight:600; font-size:clamp(22px,2.6vw,30px); color:var(--ink-faint); margin-bottom:2px; }
.why-fade.strike{ text-decoration:line-through; text-decoration-color:var(--terracotta); text-decoration-thickness:2px; }
.why-main{ font-family:'Instrument Serif',serif; font-weight:400; font-size:clamp(34px,4.6vw,58px); max-width:800px; margin:30px auto 0; line-height:1.16; }
.why-main em{ font-style:italic; color:var(--terracotta-deep); }
.why-body{ max-width:560px; margin:26px auto 0; color:var(--ink-soft); font-size:16.5px; }

.river-divider{ width:100%; height:64px; display:block; }
.river-divider path{ fill:none; stroke:var(--terracotta); stroke-width:2; opacity:0.5; }

.gallery-grid{ column-count:4; column-gap:16px; }
@media (max-width:1100px){ .gallery-grid{ column-count:3; } }
@media (max-width:760px){ .gallery-grid{ column-count:2; } }
@media (max-width:480px){ .gallery-grid{ column-count:2; column-gap:10px; } }
.g-tile{ break-inside:avoid; margin-bottom:16px; cursor:pointer; }
.g-tile .art-frame{ border-radius:10px; transition:transform .4s ease, box-shadow .4s ease; }
.g-tile:nth-child(odd):hover .art-frame{ transform:translateY(-4px) rotate(-0.6deg); box-shadow:0 16px 26px rgba(36,31,23,0.14); }
.g-tile:nth-child(even):hover .art-frame{ transform:translateY(-4px) rotate(0.6deg); box-shadow:0 16px 26px rgba(36,31,23,0.14); }
.g-tile .art-frame{ aspect-ratio:1/1.15; }
.g-tile .art-frame img{ opacity:0; transition:opacity .4s ease; }
.g-tile .art-frame img.gloaded{ opacity:1; }
.gallery-more{ display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:34px; }
.gallery-more .muted-count{ font-family:'Space Grotesk',sans-serif; font-size:12px; color:var(--ink-faint); }
.gallery-empty{ text-align:center; color:var(--ink-faint); font-family:'Space Grotesk',sans-serif; font-size:13px; padding:60px 0; }

.lightbox{ position:fixed; inset:0; z-index:300; background:rgba(36,31,23,0.94); display:none; align-items:center; justify-content:center; flex-direction:column; padding:60px 24px; opacity:0; transition:opacity 0.4s var(--ease-out); pointer-events:none; }
.lightbox.open{ display:flex; opacity:1; pointer-events:auto; }
.lb-frame{ width:min(640px,84vw); aspect-ratio:4/5; border-radius:10px; overflow:hidden; position:relative; transform:scale(0.96); transition:transform 0.5s var(--ease-spring); }
.lightbox.open .lb-frame{ transform:scale(1); }
.lb-frame .art-frame{ width:100%; height:100%; }
.lb-caption{ font-family:'Space Grotesk',sans-serif; color:var(--stone); font-size:13px; letter-spacing:0.05em; margin-top:20px; opacity:0.9; font-weight:600; }
.lb-close{ position:absolute; top:28px; right:32px; background:none; border:none; cursor:pointer; }
.lb-nav{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(247,242,230,0.12); border:none; width:48px; height:48px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:transform 0.4s var(--ease-spring), background .25s ease; }
.lb-nav:hover{ background:rgba(247,242,230,0.24); transform:translateY(-50%) scale(1.08); }
.lb-prev{ left:28px; } .lb-next{ right:28px; }
@media (max-width:640px){ .lb-nav{ width:40px; height:40px; } .lb-prev{ left:12px; } .lb-next{ right:12px; } }
.lb-hint{
  position:absolute; top:16px; left:50%; transform:translateX(-50%);
  background:rgba(247,242,230,0.95); color:var(--ink);
  font-family:'Space Grotesk',sans-serif; font-size:12px; font-weight:600;
  padding:9px 16px; border-radius:20px; white-space:nowrap; z-index:4;
  display:flex; align-items:center; gap:8px; opacity:0; transition:opacity .5s ease; pointer-events:none;
}
.lb-hint.show{ opacity:1; }

.process-wrap{ max-width:760px; margin:0 auto; position:relative; padding-left:52px; }
.process-wrap::before{ content:""; position:absolute; left:13px; top:6px; bottom:6px; width:2px; background:repeating-linear-gradient(180deg, var(--river) 0 8px, transparent 8px 16px); }
.process-fill{ position:absolute; left:13px; top:6px; width:2px; height:0%; background:linear-gradient(180deg, var(--terracotta) 0%, var(--ochre) 100%); transition:height 0.25s linear; z-index:1; }
.process-row{ position:relative; padding:0 0 52px; z-index:2; opacity:0; transform:translate3d(0,34px,0); transition:opacity 1s var(--ease-organic), transform 1s var(--ease-organic); will-change:opacity, transform; }
.process-row:last-child{ padding-bottom:0; }
.process-row::before{
  content:""; position:absolute; left:-52px; top:2px; width:26px; height:26px; border-radius:50%;
  background:var(--paper); border:2px solid var(--terracotta);
  transition:background 0.5s var(--ease-out), border-color 0.5s var(--ease-out), box-shadow 0.5s var(--ease-out), transform 0.5s var(--ease-spring);
}
.process-row.in::before{ background:var(--terracotta); border-color:var(--terracotta); box-shadow:0 0 0 5px rgba(190,92,52,0.15); transform:scale(1.08); }
.process-num{ font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:12px; color:var(--terracotta-deep); position:absolute; left:-47px; top:8px; width:16px; text-align:center; transition:color .5s ease; z-index:2; }
.process-row.in .process-num{ color:var(--paper); }
.process-row h4{ font-family:'Instrument Serif',serif; font-weight:400; font-size:23px; margin-bottom:6px; }
.process-row p{ color:var(--ink-soft); font-size:15px; max-width:480px; }
.process-row.in{ opacity:1; transform:translate3d(0,0,0); }
.process-row.in.settled{ will-change:auto; }

.cat-constellation{ background:var(--paper); padding:40px 0 150px; overflow:hidden; position:relative; }
.cat-water-bg{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.cat-water-bg svg{ position:absolute; left:0; width:100%; height:auto; display:block; }
.cat-water-bg .wave-back{ bottom:-4%; fill:var(--river-soft); opacity:0.55; animation:waterDriftA 20s ease-in-out infinite; }
.cat-water-bg .wave-mid{ bottom:-6%; fill:var(--river); opacity:0.22; animation:waterDriftB 15s ease-in-out infinite; }
.cat-water-bg .wave-front{ bottom:-8%; fill:var(--clover); opacity:0.14; animation:waterDriftA 11s ease-in-out infinite reverse; }
@keyframes waterDriftA{ 0%,100%{ transform:translate3d(0,0,0); } 50%{ transform:translate3d(-3%,6px,0); } }
@keyframes waterDriftB{ 0%,100%{ transform:translate3d(0,0,0); } 50%{ transform:translate3d(3%,-4px,0); } }
.cat-water-bg .ripple{ fill:none; stroke:var(--river); opacity:0.3; animation:dotPulse 4.5s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
.cat-water-bg .ripple:nth-of-type(2){ animation-delay:1.3s; }
.cat-water-bg .ripple:nth-of-type(3){ animation-delay:2.6s; }
.cat-scatter{ display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-start; gap:26px 22px; max-width:1080px; margin:0 auto; padding:30px 20px 0; position:relative; z-index:2; }
.cat-pebble{
  position:relative; width:172px; height:172px; padding:20px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
  text-align:center; cursor:pointer; border:none; font-family:inherit; color:var(--ink);
  box-shadow:0 14px 30px rgba(36,31,23,0.12);
  transition:transform .5s var(--ease-spring), box-shadow .4s ease;
}
.cat-pebble:hover{ transform:translateY(-10px) scale(1.06); box-shadow:0 26px 46px rgba(36,31,23,0.2); }
.cat-pebble:nth-child(2n){ margin-top:34px; }
.cat-pebble:nth-child(3n){ margin-top:-16px; }
.cat-pebble:nth-child(5n){ margin-top:18px; }
.cat-pebble .cat-emoji{ font-size:30px; line-height:1; }
.cat-pebble .cat-label{ font-family:'Space Grotesk',sans-serif; font-size:12.5px; letter-spacing:0.04em; text-transform:uppercase; font-weight:600; }
.cat-pebble .cat-count{ font-family:'Caveat',cursive; font-weight:600; font-size:13px; opacity:0.65; }
.cat-constellation .section-head{ position:relative; z-index:2; }

.clients-band{ background:var(--stone-deep); padding:60px 0; overflow:hidden; }
.clients-head{ text-align:center; margin-bottom:34px; }
.clients-track-wrap{ overflow:hidden; }
.clients-track{ display:flex; align-items:center; width:max-content; gap:40px; animation:clientsScroll 26s linear infinite; will-change:transform; }
.clients-track:hover{ animation-play-state:paused; }
@keyframes clientsScroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.client-logo{
  width:130px; height:76px; background:var(--paper); border:1px solid var(--line);
  border-radius:8px; display:flex; align-items:center; justify-content:center;
  padding:14px; filter:grayscale(1) opacity(0.75); transition:filter .3s ease, transform .3s ease; flex:0 0 auto;
}
.client-logo:hover{ filter:grayscale(0) opacity(1); transform:translateY(-3px); }
.client-logo img{ width:100%; height:100%; object-fit:contain; }

.testi-slider{ position:relative; padding:22px 54px 34px; }
@media (max-width:640px){ .testi-slider{ padding:22px 8px 34px; } }
.postcard-grid{
  display:flex; gap:36px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch; scrollbar-width:none; -ms-overflow-style:none;
  padding:4px 4px 10px; user-select:none; cursor:grab;
}
.postcard-grid::-webkit-scrollbar{ display:none; height:0; }
.postcard-grid.dragging{ cursor:grabbing; scroll-snap-type:none; }
.postcard-grid .postcard{ flex:0 0 calc((100% - 72px) / 3); scroll-snap-align:start; min-width:0; }
@media (max-width:900px){ .postcard-grid .postcard{ flex:0 0 78%; scroll-snap-align:center; } }
@media (max-width:640px){ .postcard-grid{ gap:20px; } .postcard-grid .postcard{ flex:0 0 88%; } }
.testi-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:5;
  width:44px; height:44px; border-radius:50%; border:none; cursor:pointer;
  background:var(--stone); color:var(--ink); display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 22px rgba(36,31,23,0.18); transition:background .25s ease, transform .4s var(--ease-spring);
}
.testi-arrow:hover{ background:var(--ochre); transform:translateY(-50%) scale(1.08); }
.testi-prev{ left:6px; } .testi-next{ right:6px; }
@media (max-width:640px){ .testi-arrow{ width:36px; height:36px; } .testi-prev{ left:0; } .testi-next{ right:0; } }
.postcard{ background:var(--paper); padding:0 0 32px; position:relative; box-shadow:0 10px 26px rgba(36,31,23,0.1); transition:transform .3s ease, box-shadow .3s ease; overflow:hidden; border-radius:4px; }
.postcard:nth-child(3n+1){ transform:rotate(-2deg); }
.postcard:nth-child(3n+2){ transform:rotate(1.4deg); }
.postcard:nth-child(3n+3){ transform:rotate(-1deg); }
.postcard:hover{ transform:rotate(0deg) translateY(-6px); box-shadow:0 22px 40px rgba(36,31,23,0.16); }
.postcard-media{ position:relative; width:100%; aspect-ratio:4/5; background:var(--stone-deep); }
.postcard-media .art-frame{ width:100%; height:100%; border-radius:0; }
.postcard-media video{ width:100%; height:100%; object-fit:cover; display:block; }
.postcard-media .play-badge{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(36,31,23,0.18); pointer-events:none; }
.postcard-media .play-badge svg{ filter:drop-shadow(0 4px 10px rgba(0,0,0,0.35)); }
.postcard-media .ig-badge{
  position:absolute; top:12px; right:12px; z-index:3;
  background:rgba(255,255,255,0.92); color:var(--terracotta-deep);
  font-family:'Space Grotesk',sans-serif; font-size:10px; font-weight:700; letter-spacing:0.04em;
  text-transform:uppercase; padding:5px 10px; border-radius:20px; display:flex; align-items:center; gap:5px;
}
.postcard-media.is-clickable{ cursor:pointer; }
.postcard-body{ padding:24px 26px 0; }
/* reels: gold ring on the reel being watched — see testimonialSlider in js/main.js */
.postcard.reel-open{ box-shadow:0 0 0 2px var(--ochre), 0 18px 34px rgba(36,31,23,0.18); }
.testi-count{ text-align:center; font-family:'Space Grotesk',sans-serif; font-size:12px; letter-spacing:0.14em; color:var(--ink-faint); margin-top:6px; }

/* home page collections teaser — phones and tablets only (≤900px) */
.home-collections{ display:none; }
@media (max-width:900px){ .home-collections{ display:block; padding-bottom:30px; } }
@media (max-width:480px){ .home-collections .coll-grid{ grid-template-columns:repeat(2,1fr); } }
.postcard p{ font-family:'Instrument Serif',serif; font-style:italic; font-size:18px; line-height:1.5; color:var(--ink); margin-bottom:14px; }
.postcard .who{ font-family:'Caveat',cursive; font-weight:600; font-size:19px; color:var(--terracotta-deep); display:block; }
.testi-lead-line{ text-align:center; font-family:'Space Grotesk',sans-serif; font-size:13.5px; letter-spacing:0.04em; color:var(--terracotta-deep); font-weight:600; margin-top:14px; }

/* ---------- CTA — two-column split: pebble mosaic beside the message.
     Sits on --moss so it reads a shade lighter than the --moss-deep footer. ---------- */
.cta-section{ position:relative; padding:120px 0; background:var(--moss); overflow:hidden; }
@media (max-width:900px){ .cta-section{ padding:90px 0; } }
.cta-split{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
@media (max-width:900px){ .cta-split{ grid-template-columns:1fr; gap:52px; } }

/* mosaic — nine fixed squares, gently stepped column to column */
.cta-collage{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:900px){ .cta-collage{ max-width:440px; margin:0 auto; width:100%; gap:10px; } }
.cta-shot{
  position:relative; margin:0; aspect-ratio:1/1; overflow:hidden; border-radius:12px;
  box-shadow:0 12px 26px rgba(36,31,23,0.28);
}
.cta-shot .art-frame{ width:100%; height:100%; }
.cta-collage .cta-shot:nth-child(3n+2){ transform:translateY(20px); }
@media (max-width:900px){ .cta-collage .cta-shot:nth-child(3n+2){ transform:translateY(12px); } }
.cta-shot img{ transition:transform 1.1s var(--ease-organic); }
.cta-shot:hover img{ transform:scale(1.07); }

/* message side */
.cta-inner{ position:relative; z-index:2; color:var(--stone); text-align:left; }
.cta-inner h2{ font-family:'Instrument Serif',serif; font-weight:400; font-style:italic; color:var(--stone); font-size:clamp(32px,3.6vw,50px); max-width:520px; margin:18px 0 20px; line-height:1.15; }
.cta-inner p{ color:rgba(247,242,230,0.85); max-width:470px; margin:0 0 34px; font-size:16.5px; }
.cta-btns{ display:flex; gap:16px; justify-content:flex-start; flex-wrap:wrap; }
@media (max-width:900px){
  .cta-inner{ text-align:center; }
  .cta-inner h2, .cta-inner p{ margin-left:auto; margin-right:auto; }
  .cta-btns{ justify-content:center; }
}

footer{ background:var(--moss-deep); color:var(--stone); padding:80px 0 30px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:50px; padding-bottom:50px; border-bottom:1px solid var(--line-on-dark); }
@media (max-width:860px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer-grid{ grid-template-columns:1fr 1fr; gap:28px 20px; } }   /* after */
footer .logo-word{ color:var(--stone); }
footer .logo-mark-img{ filter:drop-shadow(0 2px 6px rgba(0,0,0,0.3)); }
.footer-tag{ font-size:14px; color:rgba(247,242,230,0.6); max-width:280px; margin-top:16px; }
.footer-col h5{ font-family:'Space Grotesk',sans-serif; font-size:11.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ochre); margin-bottom:18px; }
.footer-col a{ display:block; color:rgba(247,242,230,0.75); font-size:14px; margin-bottom:12px; transition:color .25s ease; }
.footer-col a:hover{ color:var(--stone); }
.footer-bottom{ padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-family:'Space Grotesk',sans-serif; font-size:11.5px; color:rgba(247,242,230,0.45); }

.footer-social{ display:flex; gap:14px; margin-top:4px; }
.footer-col .footer-social-icon{
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:0;
  background:rgba(247,242,230,0.08); border:1px solid var(--line-on-dark);
  color:rgba(247,242,230,0.75);
  transition:color .25s ease, background .25s ease, transform .25s ease;
}
.footer-col .footer-social-icon svg{ display:block; }
.footer-social-icon:hover{ color:var(--stone); background:rgba(247,242,230,0.16); transform:translateY(-2px); }

.mobile-sheet{ position:fixed; inset:0; z-index:200; background:var(--stone); display:none; flex-direction:column; padding:26px; }
.mobile-sheet.open{ display:flex; }
.mobile-sheet-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:50px; }
.mobile-sheet a{ font-family:'Instrument Serif',serif; font-style:italic; font-size:30px; padding:14px 0; border-bottom:1px solid var(--line); color:var(--ink); }

.art-frame{ overflow:hidden; }
.art-frame img{ transition:transform 1.1s var(--ease-organic), opacity 0.4s ease; transform:scale(1); will-change:transform; }
.coll-item:hover .art-frame img, .g-tile:hover .art-frame img, .about-media:hover .art-frame img, .artist-media:hover .art-frame img{ transform:scale(1.06); }

/* ---------- HERO: asymmetric split with rotating banner slides ---------- */
.hero{ position:relative; min-height:100vh; display:grid; grid-template-columns:1.05fr 0.95fr; align-items:stretch; background:var(--moss-deep); }
@media (max-width:960px){ .hero{ grid-template-columns:1fr; min-height:auto; } }
.hero-left{ padding:200px 5vw 90px 48px; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; }
@media (max-width:960px){ .hero-left{ padding:120px 28px 50px; } }
@media (max-width:640px){ .hero-left{ padding:84px 20px 40px; } }
.hero-tagline{ font-family:'Instrument Serif',serif; font-style:italic; color:var(--ochre); font-size:18px; margin-top:10px; }
@media (max-width:640px){ .hero-tagline{ font-size:15px; margin-top:6px; } }
.hero-left h1{ color:var(--stone); font-size:clamp(46px,6.2vw,84px); line-height:1.02; margin:22px 0 26px; }
@media (max-width:640px){ .hero-left h1{ font-size:clamp(34px,9vw,48px); margin:14px 0 16px; line-height:1.06; } }
.hero-left h1 .hand{ color:var(--ochre); font-size:1.18em; display:inline-block; transform:rotate(-3deg); }
.hero-left p{ font-family:'Inter',sans-serif; color:rgba(247,242,230,0.82); font-size:17.5px; max-width:420px; margin-bottom:34px; }
@media (max-width:640px){ .hero-left p{ font-size:15px; margin-bottom:22px; } }
.hero-ctas{ display:flex; gap:16px; flex-wrap:wrap; }
.hero-right{ position:relative; overflow:hidden; }
.hero-right::before{
  content:""; position:absolute; inset:0; z-index:4;
  background:linear-gradient(100deg, var(--moss-deep) 0%, rgba(51,62,41,0.35) 16%, transparent 40%);
  pointer-events:none;
}
.hero-slides{ position:absolute; inset:0; }
.hero-slide{ position:absolute; inset:0; transform:translateY(105%); transition:transform 1.1s cubic-bezier(.65,0,.35,1); }
.hero-slide .art-frame{ width:100%; height:100%; }
.hero-slide.active{ transform:translateY(0); z-index:2; }
.hero-slide.leaving{ transform:translateY(-105%); z-index:1; }
.hero-dots{ position:absolute; right:22px; top:50%; transform:translateY(-50%); z-index:5; display:flex; flex-direction:column; gap:10px; }
.hero-dots .dot{ width:6px; height:6px; border-radius:50%; background:rgba(247,242,230,0.4); transition:background .3s ease, transform .3s ease; }
.hero-dots .dot.active{ background:var(--ochre); transform:scale(1.4); }
.hero-river{ position:absolute; left:-2px; top:0; bottom:0; width:70px; z-index:3; }
@media (max-width:960px){
  /* golden river line stays on small screens: slimmer, full hero height, text inset to clear it */
  .hero-river{ left:-4px; width:48px; height:100%; }
  .hero-right{ order:-1; aspect-ratio:4/3; }
  .hero-right::before{ background:linear-gradient(180deg, rgba(51,62,41,0.7) 0%, transparent 30%, transparent 60%, var(--moss-deep) 100%); }
  .hero-left{ padding-top:36px; padding-left:56px; }
}
@media (max-width:640px){
  .hero-right{ aspect-ratio:1/1; }
  .hero-left{ padding-top:24px; padding-left:44px; }
}
.hero-river circle{ animation:dotPulse 3.2s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
.hero-river circle:nth-child(2){ animation-delay:1s; }
.hero-river circle:nth-child(3){ animation-delay:2s; }
.hero-river circle:nth-child(4){ animation-delay:0.5s; }
.scroll-cue{ position:absolute; bottom:30px; left:48px; z-index:4; color:var(--stone); font-family:'Space Grotesk',sans-serif; font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; display:flex; align-items:center; gap:10px; opacity:0.75; }
.scroll-cue .line{ width:1px; height:30px; background:var(--ochre); animation:scrollLine 1.8s ease infinite; }
@keyframes scrollLine{ 0%{ transform:scaleY(0); transform-origin:top;} 50%{ transform:scaleY(1); transform-origin:top;} 51%{transform-origin:bottom;} 100%{ transform:scaleY(0); transform-origin:bottom;} }
@media (max-width:640px){ .scroll-cue{ display:none; } }

@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-left, .reveal-right{ transition:opacity 0.4s linear !important; transform:none !important; }
  .btn:hover, .coll-item:hover .art-frame, .postcard:hover, .ticket-item:hover, .art-frame img{ transform:none !important; }
}

/* ---------- Floating WhatsApp button ---------- */
.whatsapp-float{
  position:fixed; right:20px; bottom:20px; z-index:150;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 26px rgba(36,31,23,0.3);
  transition:transform 0.4s var(--ease-spring), box-shadow 0.3s ease;
}
.whatsapp-float:hover{ transform:scale(1.08); box-shadow:0 14px 32px rgba(36,31,23,0.38); }
.whatsapp-float svg{ width:30px; height:30px; }
@media (max-width:640px){
  .whatsapp-float{ right:14px; bottom:14px; width:52px; height:52px; }
  .whatsapp-float svg{ width:26px; height:26px; }
}

/* reel cards: no caption below, so no bottom gap */
.postcard[data-media-type="reel-embed"]{ padding-bottom:0; }
.postcard[data-media-type="reel-embed"] .instagram-media{ margin-bottom:0 !important; }
.postcard-media.reel-embed{ aspect-ratio:auto; }