/* =================================================================
   STUDIO NAULEAU  ·  Interior Design, San Francisco
   Bespoke design system  ·  Editorial luxury
   Display: Fraunces  ·  Text: Hanken Grotesk
   ================================================================= */

/* ---------- Design tokens ---------- */
:root{
  /* Warm brand palette (kept from the studio, refined) */
  --cream:      #F7F2E8;   /* primary canvas */
  --cream-deep: #EFE6D4;   /* alternate sections */
  --paper:      #FCF9F2;   /* light cards */
  --ink:        #29241F;   /* primary text */
  --ink-2:      #4C443B;   /* secondary text, still high contrast */
  --muted:      #6E6457;   /* tertiary text / captions */

  --wine:       #5E2A2E;   /* deep oxblood, primary brand */
  --wine-deep:  #461F22;
  --clay:       #BC6A4B;   /* terracotta */
  --clay-soft:  #D9A488;
  --olive:      #4F5C39;   /* forest green */
  --sage:       #87906F;
  --gold:       #B08A45;   /* refined gold for rules + accents */
  --gold-soft:  #CDB079;

  --line:       rgba(41,36,31,0.14);
  --line-soft:  rgba(41,36,31,0.08);
  --shadow-lg:  0 40px 90px -50px rgba(41,28,20,0.55);
  --shadow-md:  0 24px 50px -30px rgba(41,28,20,0.45);

  --font-display:'Fraunces', 'Times New Roman', serif;
  --font-body:'Hanken Grotesk', ui-sans-serif, system-ui, sans-serif;

  --maxw: 1320px;
  --gutter: clamp(20px, 5vw, 80px);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--ink);
  font-size:1.075rem;          /* ~17.2px base, larger for readability */
  line-height:1.78;
  font-weight:380;
  letter-spacing:0.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
::selection{ background:var(--wine); color:var(--cream); }

/* ---------- Typography ---------- */
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:430;
  line-height:1.06;
  letter-spacing:-0.012em;
  color:var(--ink);
  font-optical-sizing:auto;
}
.display{
  font-size:clamp(2.9rem, 8vw, 6.6rem);
  font-weight:380;
  line-height:0.98;
  letter-spacing:-0.02em;
}
.h-xl{ font-size:clamp(2.3rem, 5.2vw, 4.3rem); }
.h-lg{ font-size:clamp(1.95rem, 4vw, 3.2rem); }
.h-md{ font-size:clamp(1.5rem, 2.6vw, 2.1rem); }
em, .italic{ font-style:italic; }

p{ max-width:62ch; }
.lead{
  font-size:clamp(1.18rem, 1.9vw, 1.5rem);
  line-height:1.62;
  color:var(--ink-2);
  font-weight:380;
  letter-spacing:0.002em;
}

/* Eyebrow / kicker label */
.eyebrow{
  font-family:var(--font-body);
  font-size:0.74rem;
  font-weight:600;
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--clay);
  display:inline-flex;
  align-items:center;
  gap:0.85em;
}
.eyebrow::before{
  content:"";
  width:34px; height:1px;
  background:var(--gold);
  display:inline-block;
}
.eyebrow.center::after{
  content:"";
  width:34px; height:1px;
  background:var(--gold);
  display:inline-block;
}

/* ---------- Layout helpers ---------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.section{ padding-block:clamp(72px, 11vw, 168px); }
.section-sm{ padding-block:clamp(54px, 7vw, 100px); }
.bg-deep{ background:var(--cream-deep); }
.bg-wine{ background:var(--wine); color:var(--cream); }
.bg-ink{ background:#211D19; color:var(--cream); }
.center{ text-align:center; }
.mt-1{ margin-top:1rem; } .mt-2{ margin-top:2rem; } .mt-3{ margin-top:3rem; }

/* ---------- Buttons ---------- */
.btn{
  --c:var(--ink);
  position:relative;
  display:inline-flex; align-items:center; gap:0.8em;
  font-size:0.78rem; font-weight:600;
  letter-spacing:0.22em; text-transform:uppercase;
  padding:1.1em 2.2em;
  border:1px solid var(--c);
  color:var(--c);
  border-radius:100px;
  overflow:hidden;
  transition:color .55s var(--ease), border-color .55s var(--ease);
  z-index:0;
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:var(--c);
  transform:translateY(101%);
  transition:transform .55s var(--ease);
}
.btn:hover{ color:var(--cream); }
.btn:hover::before{ transform:translateY(0); }
.btn .arrow{ transition:transform .55s var(--ease); }
.btn:hover .arrow{ transform:translateX(4px); }
.btn--wine{ --c:var(--wine); }
.btn--light{ --c:var(--cream); color:var(--cream); }
.btn--light:hover{ color:var(--wine); }
.btn--light::before{ background:var(--cream); }
.btn--solid{ background:var(--wine); color:var(--cream); border-color:var(--wine); }
.btn--solid::before{ background:var(--wine-deep); }
.btn--solid:hover{ color:var(--cream); border-color:var(--wine-deep); }

/* Text link with underline sweep */
.link-u{
  position:relative; font-weight:500; color:var(--ink);
  display:inline-flex; align-items:center; gap:.5em;
}
.link-u::after{
  content:""; position:absolute; left:0; bottom:-3px; height:1px; width:100%;
  background:currentColor; transform:scaleX(0); transform-origin:left;
  transition:transform .5s var(--ease);
}
.link-u:hover::after{ transform:scaleX(1); }

/* =================================================================
   HEADER / NAV
   ================================================================= */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:90;
  padding-block:clamp(16px,2vw,26px);
  transition:background .5s var(--ease), padding .5s var(--ease), box-shadow .5s var(--ease);
}
.site-header.solid{
  background:rgba(247,242,232,0.86);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:0 1px 0 var(--line-soft);
  padding-block:13px;
}
.site-header.hide{ transform:translateY(-100%); }
.nav{ display:flex; align-items:center; justify-content:space-between; gap:2rem; }

.brand{ display:flex; flex-direction:column; line-height:1; gap:3px; z-index:2; }
.brand__name{
  font-family:var(--font-display);
  font-size:clamp(1.15rem,1.7vw,1.5rem);
  letter-spacing:0.04em; font-weight:430; color:var(--ink);
}
.brand__tag{
  font-size:0.56rem; letter-spacing:0.42em; text-transform:uppercase;
  color:var(--muted); font-weight:600; padding-left:2px;
}
.is-light .brand__name{ color:var(--cream); }
.is-light .brand__tag{ color:rgba(247,242,232,0.7); }
.is-light .nav-links a{ color:var(--cream); }
.is-light .nav-toggle span{ background:var(--cream); }
.site-header.solid.is-light .brand__name,
.site-header.solid.is-light .nav-links a{ color:var(--ink); }
.site-header.solid.is-light .brand__tag{ color:var(--muted); }
.site-header.solid.is-light .nav-toggle span{ background:var(--ink); }

.nav-links{ display:flex; align-items:center; gap:clamp(1.4rem,2.6vw,2.8rem); }
.nav-links a{
  position:relative; font-size:0.82rem; font-weight:500;
  letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-2);
  padding-block:6px;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:currentColor; transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--ease);
}
.nav-links a:hover::after,.nav-links a.active::after{ transform:scaleX(1); transform-origin:left; }
.nav-links a.active{ color:var(--ink); }
.nav-cta{ margin-left:0.6rem; }
.nav-cta.btn{ padding:0.85em 1.7em; }

/* Hamburger */
.nav-toggle{ display:none; width:34px; height:24px; position:relative; z-index:120; }
.nav-toggle span{
  position:absolute; left:0; height:1.5px; width:100%; background:var(--ink);
  transition:transform .45s var(--ease), opacity .3s var(--ease), top .45s var(--ease);
}
.nav-toggle span:nth-child(1){ top:3px; }
.nav-toggle span:nth-child(2){ top:11px; }
.nav-toggle span:nth-child(3){ top:19px; }
body.menu-open .nav-toggle span:nth-child(1){ top:11px; transform:rotate(45deg); }
body.menu-open .nav-toggle span:nth-child(2){ opacity:0; }
body.menu-open .nav-toggle span:nth-child(3){ top:11px; transform:rotate(-45deg); }
body.menu-open .nav-toggle span{ background:var(--cream); }

/* Mobile overlay menu */
.mobile-menu{
  position:fixed; inset:0; z-index:110;
  background:var(--wine); color:var(--cream);
  display:flex; flex-direction:column; justify-content:center;
  padding:var(--gutter);
  clip-path:circle(0% at calc(100% - 40px) 40px);
  transition:clip-path .7s var(--ease);
  pointer-events:none;
}
body.menu-open .mobile-menu{ clip-path:circle(150% at calc(100% - 40px) 40px); pointer-events:auto; }
.mobile-menu nav{ display:flex; flex-direction:column; gap:0.5rem; }
.mobile-menu a.m-link{
  display:block;
  font-family:var(--font-display); font-size:clamp(2.6rem,13vw,4rem);
  line-height:1.18; color:var(--cream); opacity:0; transform:translateY(24px);
  transition:opacity .5s var(--ease), transform .5s var(--ease);
}
.mobile-menu a.m-link .idx{
  font-family:var(--font-body); font-size:0.8rem; letter-spacing:0.2em;
  color:var(--clay-soft); vertical-align:super; margin-right:.6em; font-weight:600;
}
body.menu-open .mobile-menu a.m-link{ opacity:1; transform:none; }
body.menu-open .mobile-menu a.m-link:nth-child(1){ transition-delay:.18s; }
body.menu-open .mobile-menu a.m-link:nth-child(2){ transition-delay:.26s; }
body.menu-open .mobile-menu a.m-link:nth-child(3){ transition-delay:.34s; }
body.menu-open .mobile-menu a.m-link:nth-child(4){ transition-delay:.42s; }
.mobile-menu__foot{
  margin-top:auto; padding-top:2.2rem; border-top:1px solid rgba(247,242,232,0.2);
  display:flex; flex-direction:column; gap:0.7rem;
  font-size:0.92rem; letter-spacing:0.04em; color:rgba(247,242,232,0.8);
  opacity:0; transition:opacity .5s var(--ease) .5s;
}
.mobile-menu__foot a{ color:rgba(247,242,232,0.8); }
body.menu-open .mobile-menu__foot{ opacity:1; }

/* =================================================================
   HERO
   ================================================================= */
.hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end;
  overflow:hidden; color:var(--cream); }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media img{ width:100%; height:120%; object-fit:cover; will-change:transform; }
.hero__media::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(24,15,13,0.5) 0%, rgba(24,15,13,0.22) 30%, rgba(24,15,13,0.45) 64%, rgba(24,15,13,0.82) 100%),
    linear-gradient(96deg, rgba(24,15,13,0.5) 0%, rgba(24,15,13,0.12) 48%, rgba(24,15,13,0) 70%);
}
.hero__inner{ position:relative; z-index:2; width:100%; padding-bottom:clamp(48px,7vw,96px); }
.hero__eyebrow{ color:var(--clay-soft); margin-bottom:1.4rem; }
.hero__eyebrow::before{ background:var(--clay-soft); }
.hero h1{ color:var(--cream); max-width:15ch; }
.hero h1 .reveal-line{ display:block; overflow:hidden; }
.hero h1 .reveal-line > span{ display:block; transform:translateY(106%); }
.hero__sub{ max-width:46ch; margin-top:1.8rem; color:rgba(247,242,232,0.9);
  font-size:clamp(1.05rem,1.5vw,1.3rem); line-height:1.6; }
.hero__actions{ margin-top:2.6rem; display:flex; flex-wrap:wrap; gap:1rem 1.4rem; align-items:center; }
.hero__scroll{
  position:absolute; bottom:30px; right:var(--gutter); z-index:2;
  display:flex; align-items:center; gap:.8em; font-size:0.68rem;
  letter-spacing:0.26em; text-transform:uppercase; color:rgba(247,242,232,0.8);
  writing-mode:vertical-rl;
}
.hero__scroll .dot{ writing-mode:horizontal-tb; }
.scroll-line{ width:1px; height:54px; background:rgba(247,242,232,0.4); position:relative; overflow:hidden; }
.scroll-line::after{ content:""; position:absolute; top:-54px; left:0; width:100%; height:54px;
  background:var(--cream); animation:scrollPulse 2.4s var(--ease) infinite; }
@keyframes scrollPulse{ 0%{ transform:translateY(0); } 60%,100%{ transform:translateY(108px); } }

/* monogram watermark */
.monogram-wm{ position:absolute; z-index:1; font-family:var(--font-display);
  color:rgba(247,242,232,0.10); line-height:1; pointer-events:none; user-select:none; }

/* =================================================================
   MARQUEE
   ================================================================= */
.marquee{ background:var(--wine); color:var(--cream); padding-block:18px; overflow:hidden;
  border-top:1px solid rgba(247,242,232,0.12); border-bottom:1px solid rgba(247,242,232,0.12); }
.marquee__track{ display:flex; width:max-content; gap:0; animation:marquee 38s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__item{ display:inline-flex; align-items:center; font-family:var(--font-display);
  font-size:clamp(1.1rem,2vw,1.7rem); font-weight:360; letter-spacing:0.01em;
  padding-inline:1.6rem; white-space:nowrap; font-style:italic; }
.marquee__item::after{ content:"·"; margin-left:3.2rem; color:var(--clay-soft); font-style:normal; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* =================================================================
   REVEAL / SPLIT BLOCKS
   ================================================================= */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,6vw,96px); align-items:center; }
.split--reverse .split__media{ order:2; }
.split__body{ max-width:46ch; }
.split__media{ position:relative; }
.frame{ position:relative; overflow:hidden; border-radius:3px; }
.frame img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease); }
.frame.tall{ aspect-ratio:4/5; }
.frame.taller{ aspect-ratio:3/4; }
.frame.wide{ aspect-ratio:3/2; }
.media-cluster{ position:relative; }
.media-cluster .frame.float{
  position:absolute; width:46%; bottom:-9%; right:-7%; box-shadow:var(--shadow-lg);
  border:6px solid var(--cream); aspect-ratio:3/4;
}
.caption{ margin-top:1rem; font-size:0.82rem; color:var(--muted); letter-spacing:0.04em;
  font-style:italic; display:flex; align-items:center; gap:.7em; }
.caption::before{ content:""; width:18px; height:1px; background:var(--gold); }

/* number index */
.idx-big{ font-family:var(--font-display); font-size:clamp(3rem,7vw,5.5rem);
  color:transparent; -webkit-text-stroke:1px var(--gold); line-height:1; opacity:.8; }

/* =================================================================
   STATS / CREDENTIALS
   ================================================================= */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(20px,3vw,40px); }
.stat{ border-top:1px solid var(--line); padding-top:1.4rem; }
.stat__num{ font-family:var(--font-display); font-size:clamp(2.4rem,4.4vw,3.6rem);
  line-height:1; color:var(--wine); display:flex; align-items:baseline; gap:.06em; }
.stat__num .suffix{ font-size:0.42em; color:var(--clay); }
.stat__label{ margin-top:.7rem; font-size:0.82rem; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--ink-2); font-weight:500; }

/* =================================================================
   SERVICES
   ================================================================= */
.services{ display:grid; grid-template-columns:repeat(2,1fr); gap:0; border-top:1px solid var(--line); }
.service{ padding:clamp(28px,3.4vw,46px) clamp(20px,2.6vw,40px);
  border-bottom:1px solid var(--line); position:relative;
  transition:background .5s var(--ease); }
.service:nth-child(odd){ border-right:1px solid var(--line); }
.service:hover{ background:var(--paper); }
.service__n{ font-size:0.74rem; letter-spacing:0.18em; color:var(--gold); font-weight:600; }
.service h3{ font-size:clamp(1.4rem,2.2vw,1.95rem); margin-top:1rem; }
.service p{ margin-top:.85rem; color:var(--ink-2); font-size:1rem; max-width:42ch; }
.service__arrow{ position:absolute; top:clamp(28px,3.4vw,46px); right:clamp(20px,2.6vw,40px);
  opacity:0; transform:translate(-6px,6px); transition:.5s var(--ease); color:var(--clay); }
.service:hover .service__arrow{ opacity:1; transform:none; }

/* =================================================================
   PORTFOLIO  (featured projects)
   ================================================================= */
.projects{ display:flex; flex-direction:column; gap:clamp(60px,9vw,140px); }
.project-row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,80px); align-items:center; }
.project-row:nth-child(even) .project-row__media{ order:2; }
.project-row__media{ position:relative; }
.project-link{ display:block; position:relative; overflow:hidden; border-radius:3px;
  aspect-ratio:4/3; box-shadow:var(--shadow-md); }
.project-link img{ width:100%; height:100%; object-fit:cover; transition:transform 1.5s var(--ease); }
.project-link:hover img{ transform:scale(1.06); }
.project-link__veil{ position:absolute; inset:0; background:rgba(40,25,20,0); transition:background .6s var(--ease); }
.project-link:hover .project-link__veil{ background:rgba(40,25,20,0.18); }
.project-link__view{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(.8);
  width:106px; height:106px; border-radius:50%; background:var(--cream); color:var(--wine);
  display:grid; place-items:center; text-align:center; font-size:0.7rem; letter-spacing:0.18em;
  text-transform:uppercase; font-weight:600; opacity:0; transition:.55s var(--ease); pointer-events:none;
}
.project-link:hover .project-link__view{ opacity:1; transform:translate(-50%,-50%) scale(1); }
.project-meta__index{ font-family:var(--font-display); font-size:1rem; color:var(--clay); letter-spacing:.1em; }
.project-meta h3{ font-size:clamp(2.4rem,5vw,4.2rem); margin-top:.6rem; line-height:0.98; }
.project-meta__loc{ margin-top:1.1rem; display:flex; flex-wrap:wrap; gap:.6em 1.4em;
  font-size:0.78rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); }
.project-meta__loc span{ display:inline-flex; align-items:center; gap:.5em; }
.project-meta p{ margin-top:1.5rem; color:var(--ink-2); }
.project-meta .link-u{ margin-top:1.8rem; font-size:0.82rem; letter-spacing:0.14em;
  text-transform:uppercase; font-weight:600; }

/* =================================================================
   TESTIMONIAL
   ================================================================= */
.quote{ text-align:center; max-width:60ch; margin-inline:auto; }
.quote__mark{ font-family:var(--font-display); font-size:5rem; line-height:.4; color:var(--gold-soft); }
.quote blockquote{ font-family:var(--font-display); font-weight:360; font-style:italic;
  font-size:clamp(1.5rem,3.2vw,2.6rem); line-height:1.3; letter-spacing:-0.01em; color:var(--ink); }
.quote__cite{ margin-top:2rem; font-size:0.82rem; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--clay); font-weight:600; }
.quote__stars{ color:var(--gold); letter-spacing:.3em; font-size:.9rem; margin-bottom:1.8rem; }

/* =================================================================
   CTA STRIP
   ================================================================= */
.cta{ position:relative; overflow:hidden; }
.cta__media{ position:absolute; inset:0; z-index:0; }
.cta__media img{ width:100%; height:100%; object-fit:cover; }
.cta__media::after{ content:""; position:absolute; inset:0; background:rgba(40,22,20,0.62); }
.cta__inner{ position:relative; z-index:2; text-align:center; color:var(--cream);
  padding-block:clamp(90px,14vw,200px); }
.cta h2{ color:var(--cream); }

/* =================================================================
   FOOTER
   ================================================================= */
.site-footer{ background:#211D19; color:rgba(247,242,232,0.82); padding-top:clamp(64px,8vw,110px); }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:clamp(32px,4vw,60px);
  padding-bottom:clamp(48px,6vw,80px); border-bottom:1px solid rgba(247,242,232,0.13); }
.footer-brand .brand__name{ color:var(--cream); font-size:1.7rem; }
.footer-brand p{ margin-top:1.3rem; color:rgba(247,242,232,0.62); font-size:0.98rem; max-width:34ch; }
.footer-col h4{ font-family:var(--font-body); font-size:0.74rem; letter-spacing:0.22em;
  text-transform:uppercase; color:var(--clay-soft); font-weight:600; margin-bottom:1.3rem; }
.footer-col ul{ list-style:none; display:flex; flex-direction:column; gap:.85rem; }
.footer-col a, .footer-col address{ color:rgba(247,242,232,0.82); font-style:normal; font-size:0.98rem; line-height:1.6; }
.footer-col a:hover{ color:var(--cream); }
.footer-bottom{ display:flex; flex-wrap:wrap; gap:1rem 2rem; justify-content:space-between;
  align-items:center; padding-block:2rem; font-size:0.78rem; letter-spacing:0.04em;
  color:rgba(247,242,232,0.5); }
.footer-social{ display:flex; gap:1.4rem; }
.footer-social a{ display:inline-flex; align-items:center; gap:.5em; }

/* =================================================================
   PAGE HEADER (interior pages)
   ================================================================= */
.page-head{ position:relative; padding-top:clamp(160px,20vh,230px); padding-bottom:clamp(40px,6vw,70px); }
.page-head .eyebrow{ margin-bottom:1.4rem; }
.page-head h1{ font-size:clamp(2.8rem,7vw,5.6rem); line-height:0.98; }
.breadcrumb{ display:flex; gap:.6em; font-size:0.74rem; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--muted); margin-bottom:2rem; }
.breadcrumb a:hover{ color:var(--ink); }
.breadcrumb span{ color:var(--gold); }

/* =================================================================
   PROJECT DETAIL  (galleries)
   ================================================================= */
.project-hero{ position:relative; height:clamp(60vh,82vh,860px); overflow:hidden; }
.project-hero img{ width:100%; height:108%; object-fit:cover; }
.project-hero::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(24,15,13,0.62) 0%,rgba(24,15,13,0.16) 30%,rgba(24,15,13,0.04) 50%,rgba(24,15,13,0.7) 100%); }
.project-hero__cap{ position:absolute; left:0; right:0; bottom:0; z-index:2; color:var(--cream);
  padding-bottom:clamp(36px,5vw,64px); }
.project-hero__cap h1{ color:var(--cream); font-size:clamp(3rem,9vw,7rem); line-height:0.95; }
.project-facts{ display:grid; grid-template-columns:0.8fr 1.2fr; gap:clamp(28px,5vw,70px); }
.fact-list{ display:flex; flex-direction:column; gap:1.5rem; }
.fact{ border-top:1px solid var(--line); padding-top:1rem; }
.fact dt{ font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.fact dd{ margin-top:.5rem; font-size:1.05rem; color:var(--ink); font-weight:450; }

/* masonry gallery */
.gallery{ columns:3; column-gap:clamp(12px,1.6vw,22px); }
.gallery .g-item{ break-inside:avoid; margin-bottom:clamp(12px,1.6vw,22px);
  position:relative; overflow:hidden; border-radius:3px; cursor:zoom-in; }
.gallery .g-item img{ width:100%; transition:transform 1.3s var(--ease), filter .6s var(--ease); }
.gallery .g-item:hover img{ transform:scale(1.045); }
.gallery .g-item::after{ content:""; position:absolute; inset:0; background:rgba(40,25,20,0);
  transition:background .5s var(--ease); }
.gallery .g-item:hover::after{ background:rgba(40,25,20,0.1); }

.project-nav{ display:flex; justify-content:space-between; gap:2rem; flex-wrap:wrap; align-items:center;
  border-top:1px solid var(--line); padding-top:2.6rem; }
.project-nav a{ display:flex; flex-direction:column; gap:.3rem; }
.project-nav .lbl{ font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--muted); }
.project-nav .nm{ font-family:var(--font-display); font-size:clamp(1.6rem,3vw,2.4rem); color:var(--ink);
  transition:color .4s var(--ease); }
.project-nav a:hover .nm{ color:var(--wine); }
.project-nav a.next{ text-align:right; align-items:flex-end; }

/* =================================================================
   LIGHTBOX
   ================================================================= */
.lightbox{ position:fixed; inset:0; z-index:200; background:rgba(24,17,14,0.95);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; padding:clamp(16px,5vw,70px);
  opacity:0; visibility:hidden; transition:opacity .5s var(--ease), visibility .5s; }
.lightbox.open{ opacity:1; visibility:visible; }
.lightbox img{ max-width:100%; max-height:88vh; object-fit:contain; border-radius:2px;
  box-shadow:0 30px 80px rgba(0,0,0,.5); transform:scale(.96); transition:transform .5s var(--ease); }
.lightbox.open img{ transform:scale(1); }
.lb-btn{ position:absolute; top:50%; transform:translateY(-50%); width:56px; height:56px;
  border-radius:50%; border:1px solid rgba(247,242,232,0.3); color:var(--cream);
  display:grid; place-items:center; transition:.4s var(--ease); z-index:3; }
.lb-btn:hover{ background:rgba(247,242,232,0.12); border-color:var(--cream); }
.lb-prev{ left:clamp(12px,3vw,40px); }
.lb-next{ right:clamp(12px,3vw,40px); }
.lb-close{ position:absolute; top:clamp(16px,3vw,34px); right:clamp(16px,3vw,34px);
  width:50px; height:50px; border-radius:50%; border:1px solid rgba(247,242,232,0.3); color:var(--cream);
  display:grid; place-items:center; transition:.4s var(--ease); z-index:3; }
.lb-close:hover{ background:rgba(247,242,232,0.12); transform:rotate(90deg); }
.lb-count{ position:absolute; bottom:clamp(16px,3vw,34px); left:50%; transform:translateX(-50%);
  color:rgba(247,242,232,0.7); font-size:0.8rem; letter-spacing:0.2em; }

/* =================================================================
   CONTACT
   ================================================================= */
.contact-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(36px,6vw,90px); align-items:start; }
.form{ display:grid; gap:1.6rem; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; }
.field{ position:relative; }
.field label{ display:block; font-size:0.74rem; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--muted); font-weight:600; margin-bottom:.7rem; }
.field input{ width:100%; background:transparent; border:none; border-bottom:1px solid var(--line);
  padding:.7rem 0; font-family:var(--font-body); font-size:1.05rem; color:var(--ink);
  transition:border-color .4s var(--ease); }
.field input:focus{ outline:none; border-color:var(--wine); }
.field input::placeholder{ color:rgba(110,100,87,0.5); }
.checks{ display:flex; flex-wrap:wrap; gap:.8rem; }
.check{ position:relative; }
.check input{ position:absolute; opacity:0; }
.check label{ display:inline-block; padding:.7em 1.4em; border:1px solid var(--line); border-radius:100px;
  font-size:0.82rem; letter-spacing:0.06em; text-transform:none; color:var(--ink-2); margin:0;
  cursor:pointer; transition:.4s var(--ease); font-weight:500; }
.check input:checked + label{ background:var(--wine); color:var(--cream); border-color:var(--wine); }
.check input:focus-visible + label{ outline:2px solid var(--gold); outline-offset:2px; }
.contact-aside{ position:relative; }
.contact-aside .frame{ aspect-ratio:3/4; }
.contact-info{ display:flex; flex-direction:column; gap:1.4rem; margin-top:2.4rem; }
.contact-info .ci{ border-top:1px solid var(--line); padding-top:1rem; }
.contact-info .ci .k{ font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.contact-info .ci .v{ margin-top:.4rem; font-size:1.1rem; color:var(--ink); }
.contact-info .ci .v a:hover{ color:var(--wine); }
.form__note{ font-size:0.84rem; color:var(--muted); }

/* =================================================================
   REVEAL ANIMATIONS
   ================================================================= */
[data-reveal]{ opacity:0; transform:translateY(34px); transition:opacity 1s var(--ease-out), transform 1s var(--ease-out); }
[data-reveal].in{ opacity:1; transform:none; }
[data-reveal="fade"]{ transform:none; }
[data-reveal="left"]{ transform:translateX(-40px); }
[data-reveal="right"]{ transform:translateX(40px); }
[data-reveal].in{ transform:none; }
[data-stagger] > *{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease-out), transform .9s var(--ease-out); }
[data-stagger].in > *{ opacity:1; transform:none; }
[data-stagger].in > *:nth-child(1){ transition-delay:.05s; }
[data-stagger].in > *:nth-child(2){ transition-delay:.13s; }
[data-stagger].in > *:nth-child(3){ transition-delay:.21s; }
[data-stagger].in > *:nth-child(4){ transition-delay:.29s; }
[data-stagger].in > *:nth-child(5){ transition-delay:.37s; }
[data-stagger].in > *:nth-child(6){ transition-delay:.45s; }

/* image clip reveal */
.clip-reveal{ clip-path:inset(0 0 100% 0); transition:clip-path 1.3s var(--ease); }
.clip-reveal.in{ clip-path:inset(0 0 0 0); }

/* page intro curtain */
.intro{ position:fixed; inset:0; z-index:300; background:var(--wine); display:grid; place-items:center;
  transition:transform 1s var(--ease) .2s; }
.intro.done{ transform:translateY(-100%); }
.intro__mark{ font-family:var(--font-display); color:var(--cream); font-size:clamp(2.4rem,7vw,4.6rem);
  letter-spacing:.1em; opacity:0; animation:introIn 1s var(--ease) forwards; }
.intro__mark .sub{ display:block; font-family:var(--font-body); font-size:0.7rem; letter-spacing:0.5em;
  text-transform:uppercase; text-align:center; margin-top:.8rem; color:var(--clay-soft); }
@keyframes introIn{ to{ opacity:1; } }
body.loaded{ overflow:visible; }

/* =================================================================
   RESPONSIVE
   ================================================================= */
@media (max-width: 980px){
  .split, .project-row, .project-facts, .contact-grid, .footer-top{ grid-template-columns:1fr; }
  .split--reverse .split__media, .project-row:nth-child(even) .project-row__media{ order:0; }
  .stats{ grid-template-columns:repeat(2,1fr); row-gap:30px; }
  .gallery{ columns:2; }
  .media-cluster .frame.float{ position:relative; width:62%; bottom:0; right:0; margin-top:-18%;
    margin-left:auto; }
  .footer-top{ gap:40px; }
}
@media (max-width: 720px){
  .nav-links{ display:none; }
  .nav-toggle{ display:block; }
  .services{ grid-template-columns:1fr; }
  .service:nth-child(odd){ border-right:none; }
  .form-row{ grid-template-columns:1fr; }
  .project-meta h3{ font-size:clamp(2.6rem,12vw,3.6rem); }
  body{ font-size:1.04rem; }
}
@media (max-width: 460px){
  .stats{ grid-template-columns:1fr; }
  .gallery{ columns:1; }
}

/* =================================================================
   PREMIUM LAYER  ·  tactile depth, refined type, signature motion
   (appended; later source order intentionally overrides base rules)
   ================================================================= */

/* ---- Typography: real weights, readable measure, numerals ---- */
body{
  font-weight:400;
  line-height:1.72;
  letter-spacing:0;
  font-feature-settings:"kern" 1,"liga" 1,"calt" 1;
}
h1,h2,h3,h4{ font-weight:440; }
h1 em,h2 em,h3 em{ font-weight:425; font-style:italic; }
.display{ font-weight:395; }
p{ max-width:66ch; }
.lead{ line-height:1.66; max-width:60ch; letter-spacing:0; }
.hero__sub{ line-height:1.66; }
.stat__num,.lb-count,.project-meta__index,.service__n,.fact dd,.fact dt{
  font-variant-numeric:lining-nums tabular-nums;
}
.stat__num{ font-feature-settings:"kern" 1,"tnum" 1,"lnum" 1; }
.display,.marquee__item,.quote blockquote,.quote__mark,.idx-big,.stat__num,
.project-meta__index,.brand__name,.project-nav .nm,.intro__mark,.mobile-menu a.m-link,
.page-head h1,.project-hero__cap h1{ font-optical-sizing:auto; }

/* ---- Small-label legibility floor ---- */
.eyebrow{ font-size:0.78rem; letter-spacing:0.28em; }
.brand__tag{ font-size:0.62rem; letter-spacing:0.3em; }
.fact dt,.project-nav .lbl,.contact-info .ci .k,.field label,.footer-col h4{ font-size:0.8rem; }
.field input::placeholder{ color:rgba(110,100,87,0.85); }
.caption,.form__note{ color:var(--ink-2); }
.project-meta h3{ font-size:clamp(2.2rem,4.4vw,3.8rem); }

/* ---- Paper grain + warm vignette (no external asset, file:// safe) ---- */
body::before{
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px 200px; opacity:0.05; mix-blend-mode:multiply;
}
body::after{
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(120% 85% at 50% 0%, transparent 52%, rgba(70,31,34,0.07) 100%);
}
main,.site-footer{ position:relative; z-index:2; }

/* ---- Tonal depth instead of flat fills ---- */
.bg-deep{
  background:linear-gradient(180deg,#EFE6D4 0%,#EADFC9 100%);
  box-shadow:inset 0 1px 0 rgba(176,138,69,0.18), inset 0 -1px 0 rgba(176,138,69,0.12);
}
.section:not(.bg-deep):not(.bg-wine):not(.bg-ink):not(.cta):not(.bg-night){
  background-image:radial-gradient(150% 62% at 50% 100%, rgba(188,106,75,0.05), transparent 62%);
}
/* Olive band: activate the full five-colour brand story */
.bg-olive{
  background:linear-gradient(180deg,#4F5C39 0%,#434E30 100%); color:var(--cream);
  box-shadow:inset 0 1px 0 rgba(205,176,121,0.22), inset 0 -1px 0 rgba(0,0,0,0.12);
}
.bg-olive .stat{ border-top-color:rgba(247,242,232,0.28); }
.bg-olive .stat__num{ color:var(--gold-soft); }
.bg-olive .stat__num .suffix{ color:var(--clay-soft); }
.bg-olive .stat__label{ color:rgba(247,242,232,0.82); }

/* ---- Physical weight on framed images + cards ---- */
.frame{
  box-shadow:0 2px 5px rgba(41,28,20,0.06), 0 24px 50px -32px rgba(41,28,20,0.5);
}
.frame::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.10), inset 0 -50px 70px -56px rgba(41,28,20,0.55);
}
.project-link{ box-shadow:0 3px 8px rgba(41,28,20,0.07), 0 34px 60px -38px rgba(41,28,20,0.5); }
.service{ transition:background .5s var(--ease), box-shadow .5s var(--ease), transform .5s var(--ease); }
.service:hover{ background:var(--paper); box-shadow:var(--shadow-md); transform:translateY(-3px); z-index:1; }

/* ---- Gold catches light ---- */
.eyebrow::before,.eyebrow.center::after{
  background:linear-gradient(90deg,var(--gold),var(--gold-soft)); height:1.5px;
}
.idx-big{
  -webkit-text-stroke:0; color:transparent;
  background:linear-gradient(135deg,#9C7836,#CDB079); -webkit-background-clip:text; background-clip:text;
}

/* ---- Gallery: signature image mask reveal (aspect-ratio reserves height) ---- */
.gallery .g-item[data-reveal]{
  opacity:1; transform:none; clip-path:inset(100% 0 0 0);
  transition:clip-path 1.1s var(--ease);
}
.gallery .g-item[data-reveal].in{ clip-path:inset(0 0 0 0); }
.gallery .g-item img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Safety net: if JS never runs, never leave gallery clipped */
html:not(.js) .gallery .g-item[data-reveal]{ clip-path:none; }

/* ---- Line-mask reveal for headings ---- */
.line-mask{ display:block; overflow:hidden; }
.line-inner{ display:block; transform:translateY(110%); transition:transform 0.95s var(--ease); }
.reveal-lines.in .line-inner{ transform:translateY(0); }

/* ---- Magnetic targets need a transform transition ---- */
.btn,.nav-cta{ transition:color .55s var(--ease), border-color .55s var(--ease), background .55s var(--ease), transform .55s var(--ease); }
.project-nav a{ transition:transform .55s var(--ease); }

/* ---- Custom cursor ---- */
.cursor-dot,.cursor-ring{ position:fixed; top:0; left:0; border-radius:50%;
  pointer-events:none; z-index:240; will-change:transform; }
.cursor-dot{ width:7px; height:7px; margin:-3.5px 0 0 -3.5px; background:var(--wine);
  mix-blend-mode:difference; }
.cursor-ring{ width:40px; height:40px; margin:-20px 0 0 -20px;
  border:1px solid rgba(94,42,46,0.45); display:grid; place-items:center; text-align:center;
  transition:width .4s var(--ease), height .4s var(--ease), border-color .4s var(--ease), background .4s var(--ease); }
.cursor-ring.is-active{ width:92px; height:92px; background:rgba(94,42,46,0.92);
  border-color:transparent; }
.cursor-label{ font-family:var(--font-body); font-size:0.58rem; letter-spacing:0.2em;
  text-transform:uppercase; font-weight:600; color:var(--cream); opacity:0;
  transform:translateY(3px); transition:opacity .3s var(--ease), transform .3s var(--ease); }
.cursor-ring.is-active .cursor-label{ opacity:1; transform:none; }
body.has-cursor{ cursor:none; }
body.has-cursor a, body.has-cursor button, body.has-cursor .project-link,
body.has-cursor .g-item, body.has-cursor input, body.has-cursor label{ cursor:none; }

/* ---- Live clock in footer ---- */
.footer-clock{ font-variant-numeric:tabular-nums; }

/* ---- Hero background video ---- */
.hero__media video{ width:100%; height:120%; object-fit:cover; will-change:transform; }
.hero__media video.hero__video{ display:block; }

/* ---- Mobile: do not shrink body type for 50+ readers ---- */
@media (max-width: 720px){
  body{ font-size:1.06rem; }
}
@media (prefers-reduced-motion: reduce){
  .gallery .g-item[data-reveal]{ clip-path:none; }
  .line-inner{ transform:none; }
}

/* =================================================================
   PREMIUM LAYER II  ·  CINEMATIC DIRECTION
   Inertia scroll, page wipes, oversized hero, night-section,
   full-bleed interstitial, chaptered pacing, couture reveals.
   ================================================================= */

:root{
  --ease-couture:cubic-bezier(0.16,1,0.3,1);
  --ease-overshoot:cubic-bezier(0.34,1.56,0.64,1);
  --ease-cine:cubic-bezier(0.16,1,0.3,1);
  --dur-cine:1.5s;
  --veil:0.5;
}

/* ---- Lenis inertia scroll (owns scrolling) ---- */
html{ scroll-behavior:auto; }
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }
.lenis.lenis-stopped{ overflow:hidden; }
body{ transition:background-color .8s ease; }

/* ---- Wine curtain page transition ---- */
.page-exit{
  position:fixed; inset:0; z-index:300; background:var(--wine);
  transform:translateY(100%); transition:transform .62s var(--ease-out);
  pointer-events:none; display:grid; place-items:center;
}
.page-exit.on{ transform:translateY(0); }
.page-exit__mark{
  font-family:var(--font-display); color:var(--cream); font-size:clamp(2.2rem,6vw,3.8rem);
  letter-spacing:.12em; opacity:0; transform:translateY(10px);
  transition:opacity .4s ease .12s, transform .5s var(--ease) .12s;
}
.page-exit.on .page-exit__mark{ opacity:1; transform:none; }

/* ---- Oversized, full-canvas hero ---- */
.hero{ align-items:stretch; }
.hero__inner{
  display:flex; flex-direction:column; align-items:flex-start;
  min-height:100svh; padding-top:clamp(116px,15vh,176px);
  will-change:transform, opacity;
}
.hero__eyebrow{ margin-bottom:auto; }
.hero h1.display{
  font-size:clamp(3.3rem,12vw,9.6rem); line-height:0.9; letter-spacing:-0.032em;
  max-width:none;
}
.hero__media{ will-change:transform; }
.hero__media::after{
  background:
    linear-gradient(180deg, rgba(24,15,13,0.5) 0%, rgba(24,15,13,0.2) 28%, rgba(24,15,13,0.42) 60%, rgba(24,15,13,var(--veil,0.5)) 100%),
    linear-gradient(96deg, rgba(24,15,13,0.52) 0%, rgba(24,15,13,0.12) 46%, rgba(24,15,13,0) 70%);
}

/* ---- Marquee becomes a deliberate scale event ---- */
.marquee{ padding-block:clamp(22px,3vw,40px); }
.marquee__item{ font-size:clamp(1.4rem,3vw,2.6rem); }

/* ---- Full-bleed cinematic interstitial ---- */
.cinema{
  position:relative; height:92vh; min-height:560px; width:100vw;
  margin-inline:calc(50% - 50vw); overflow:hidden;
  display:flex; align-items:flex-end; color:var(--cream);
}
.cinema__media{ position:absolute; inset:-12% 0; z-index:0; will-change:transform; }
.cinema__media img{ width:100%; height:100%; object-fit:cover; }
.cinema::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(24,15,13,0.12), rgba(24,15,13,0.32) 45%, rgba(24,15,13,0.8)); }
.cinema__line{
  position:relative; z-index:2; padding-bottom:clamp(40px,7vw,96px);
  font-family:var(--font-display); font-size:clamp(2.8rem,8.5vw,7.5rem);
  line-height:0.96; letter-spacing:-0.02em; color:var(--cream);
}
.cinema__eyebrow{ position:relative; z-index:2; color:var(--clay-soft); }

/* ---- Dark atmospheric night-section ---- */
.bg-night{
  background:linear-gradient(180deg,#2C1619 0%,#1E1012 100%); color:var(--cream);
  box-shadow:inset 0 1px 0 rgba(176,138,69,0.22), inset 0 -1px 0 rgba(0,0,0,0.3);
}
.bg-night h2, .bg-night h3{ color:var(--cream); }
.bg-night .project-meta p{ color:rgba(247,242,232,0.8); }
.bg-night .project-meta__loc{ color:rgba(247,242,232,0.6); }
.bg-night .project-meta__index{ color:var(--clay-soft); }
.bg-night .link-u, .bg-night .eyebrow{ color:var(--clay-soft); }
.bg-night .eyebrow::before, .bg-night .eyebrow.center::after{ background:linear-gradient(90deg,var(--gold-soft),var(--clay-soft)); }
.bg-night .chapter-no{ color:var(--gold-soft); }
.bg-night .section{ background-image:none; }
.bg-night .btn--wine{ --c:var(--cream); color:var(--cream); }
.bg-night .btn--wine::before{ background:var(--cream); }
.bg-night .btn--wine:hover{ color:var(--wine); }

/* ---- Chaptered editorial numbering ---- */
.chapter-no{
  display:block; font-family:var(--font-body); font-size:0.8rem; letter-spacing:0.28em;
  text-transform:uppercase; color:var(--gold); margin-bottom:clamp(22px,3.4vw,48px);
  font-variant-numeric:tabular-nums; font-weight:600;
}
.chapter-no .sep{ color:var(--clay); margin-inline:0.5em; }
.cta .chapter-no{ color:var(--gold-soft); }

/* ---- Compression and expansion of pacing ---- */
.section--tight{ padding-block:clamp(40px,5vw,76px); }
.section--air{ padding-block:clamp(108px,15vw,232px); }

/* ---- Cinematic flagship project + secondary tier ---- */
.project-meta{ position:relative; }
.project-row--feature{ grid-template-columns:1.5fr 1fr; gap:clamp(40px,6vw,100px); }
.project-row--feature .project-link{ aspect-ratio:16/10; }
.project-row--feature .project-row__media{ margin-left:calc(var(--gutter) * -0.7); }
.project-row--feature .idx-big{
  position:absolute; right:-0.02em; top:-0.62em; font-size:clamp(5rem,11vw,10rem);
  line-height:1; z-index:0; pointer-events:none; opacity:0.85;
}
.project-row--feature .project-meta > *:not(.idx-big){ position:relative; z-index:1; }
.projects .project-row:not(.project-row--feature){ grid-template-columns:1fr 0.85fr; }
.projects .project-row:nth-child(3){ transform:translateY(clamp(0px,5vw,68px)); }

/* ---- Couture image reveal: frame opens onto the photo ---- */
.clip-reveal{ clip-path:inset(100% 0 0 0); transition:clip-path var(--dur-cine) var(--ease-cine); }
.clip-reveal img{ transform:scale(1.12); transition:transform calc(var(--dur-cine) + 0.25s) var(--ease-cine); }
.clip-reveal.in{ clip-path:inset(0 0 0 0); }
.clip-reveal.in img{ transform:scale(1); }

/* ---- Sharper type scale contrast (body untouched) ---- */
.h-xl{ font-size:clamp(2.6rem,6vw,5.2rem); line-height:0.96; letter-spacing:-0.025em; }
.display,.project-meta h3,.cinema__line,.quote blockquote{
  font-feature-settings:"liga" 1,"dlig" 1;
}
.reveal-lines.in .line-mask:nth-child(2) .line-inner{ transition-delay:.09s; }
.reveal-lines.in .line-mask:nth-child(3) .line-inner{ transition-delay:.18s; }

@media (max-width: 980px){
  .project-row--feature{ grid-template-columns:1fr; }
  .project-row--feature .project-row__media{ margin-left:0; }
  .projects .project-row:not(.project-row--feature){ grid-template-columns:1fr; }
  .projects .project-row:nth-child(3){ transform:none; }
  .project-row--feature .idx-big{ font-size:clamp(4rem,16vw,7rem); top:-0.5em; }
}
@media (prefers-reduced-motion: reduce){
  .clip-reveal{ clip-path:none; }
  .clip-reveal img{ transform:none; }
  .page-exit{ display:none; }
}