/* Self-hosted fonts (SIL Open Font License) */
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/playfair-display-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/playfair-display-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/playfair-display-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:500;font-display:swap;src:url(../fonts/playfair-display-latin-500-italic.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/jost-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/jost-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/jost-latin-500-normal.woff2) format('woff2')}

/* ==========================================================
   HOUSE OF KINKINI – design tokens
   Palette drawn from the photography: sandstone, handloom
   maroon, indigo, oxidised silver and antique gold.
   ========================================================== */
:root{
  --paper:#FBF7F1;
  --ivory:#F6F0E6;
  --sand:#EDE3D3;
  --stone:#CDBBA0;
  --ink:#1D1814;
  --ink-2:#4A4038;
  --muted:#7D7166;
  --maroon:#5A1B22;
  --maroon-2:#3B1116;
  --indigo:#121931;
  --indigo-2:#1C2442;
  --gold:#A88449;
  --gold-2:#C9AA70;
  --line:rgba(29,24,20,.14);
  --line-light:rgba(246,240,230,.22);

  --serif:'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans:'Jost', 'Helvetica Neue', Arial, sans-serif;

  --pad:clamp(20px, 5vw, 72px);
  --maxw:1320px;
  --announce-h:36px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-weight:300;font-size:17px;line-height:1.75;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
body.is-locked{overflow:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
::selection{background:var(--gold-2);color:var(--ink)}
:focus-visible{outline:1px solid var(--gold);outline-offset:4px}
section[id]{scroll-margin-top:72px}

.container{width:100%;max-width:calc(var(--maxw) + var(--pad)*2);margin:0 auto;padding:0 var(--pad)}

/* ---------- type ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--sans);font-weight:500;font-size:11.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);
}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor;opacity:.7}
.eyebrow.is-center::after{content:"";width:28px;height:1px;background:currentColor;opacity:.7}
.display{
  font-family:var(--serif);font-weight:400;letter-spacing:-.012em;line-height:1.04;margin:0;
  font-size:clamp(44px, 6.4vw, 98px);
}
.h2{
  font-family:var(--serif);font-weight:400;letter-spacing:-.01em;line-height:1.12;margin:0;
  font-size:clamp(34px, 4.2vw, 62px);
}
.display em,.h2 em,.serif-em{font-style:italic;font-weight:400}
.h2,.lede,.display,.story__pull,.inspire__quote,.making__soon,.closer__sub{text-wrap:balance}
.body{text-wrap:pretty}
.lede{font-family:var(--serif);font-size:clamp(21px, 2vw, 27px);line-height:1.55;color:var(--ink);margin:0}
.body{color:var(--ink-2);margin:0 0 1.1em;max-width:54ch}
.body:last-child{margin-bottom:0}

.link-line{
  display:inline-flex;align-items:center;gap:14px;
  font-weight:500;font-size:12px;letter-spacing:.24em;text-transform:uppercase;
  padding-bottom:8px;position:relative;
}
.link-line::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;
  transform-origin:right;transition:transform .6s var(--ease-out);
}
.link-line:hover::after{transform:scaleX(.35)}
.link-line svg{width:18px;height:10px;transition:transform .5s var(--ease-out)}
.link-line:hover svg{transform:translateX(6px)}

/* ---------- reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity 1.2s var(--ease-out), transform 1.2s var(--ease-out)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal="fade"]{transform:none}
[data-delay="1"]{transition-delay:.12s}[data-delay="2"]{transition-delay:.24s}
[data-delay="3"]{transition-delay:.36s}[data-delay="4"]{transition-delay:.48s}
[data-delay="5"]{transition-delay:.6s}

/* the clip sits on the image, not the observed frame – a fully clipped
   element never reports as intersecting, so the reveal would never fire */
.img-reveal{position:relative;overflow:hidden}
.img-reveal img{clip-path:inset(100% 0 0 0);transform:scale(1.18);transition:clip-path 1.6s var(--ease-out), transform 2.2s var(--ease-out)}
.img-reveal.is-in img{clip-path:inset(0 0 0 0);transform:scale(1)}

/* ==========================================================
   LOADER
   ========================================================== */
.loader{
  position:fixed;inset:0;z-index:999;background:var(--ivory);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;
  transition:transform 1.1s var(--ease-out) .1s;
}
.loader__mark{width:64px;opacity:0;transform:translateY(10px);animation:loaderIn 1s var(--ease-out) .15s forwards}
.loader__line{width:120px;height:1px;background:var(--line);position:relative;overflow:hidden}
.loader__line::after{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;animation:loaderLine 1.4s var(--ease) .3s forwards}
@keyframes loaderIn{to{opacity:1;transform:none}}
@keyframes loaderLine{to{transform:scaleX(1)}}
body.is-loaded .loader{transform:translateY(-100%)}

/* ==========================================================
   ANNOUNCEMENT + HEADER
   ========================================================== */
.announce{
  position:relative;z-index:60;height:var(--announce-h);
  background:var(--maroon-2);color:rgba(246,240,230,.86);
  display:flex;align-items:center;justify-content:center;gap:12px;
  font-size:11px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;text-align:center;padding:0 16px;
}
.announce a{color:var(--gold-2);border-bottom:1px solid rgba(201,170,112,.5);padding-bottom:1px}
.announce .dot{opacity:.5}

.header{
  position:fixed;left:0;right:0;top:var(--announce-h);z-index:50;
  color:var(--ivory);
  transition:top .5s var(--ease), background-color .5s var(--ease), color .5s var(--ease), transform .6s var(--ease-out), box-shadow .5s var(--ease);
}
.header__inner{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding-top:18px;padding-bottom:18px;transition:padding .5s var(--ease);
}
.header.is-solid{top:0;background:rgba(251,247,241,.94);color:var(--ink);box-shadow:0 1px 0 var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.header.is-solid .header__inner{padding-top:10px;padding-bottom:10px}
.header.is-hidden{transform:translateY(-100%)}

.brand{display:block;position:relative;width:102px;transition:width .5s var(--ease)}
.brand img{width:100%;height:auto}
.brand .logo-dark{position:absolute;inset:0;opacity:0;transition:opacity .4s var(--ease)}
.brand .logo-light{transition:opacity .4s var(--ease)}
.header.is-solid .brand{width:72px}
.header.is-solid .brand .logo-dark{opacity:1}
.header.is-solid .brand .logo-light{opacity:0}

.nav{display:flex;gap:clamp(22px,2.6vw,40px);align-items:center}
.nav a{font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;position:relative;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease-out)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.header__right{justify-self:end;display:flex;align-items:center;gap:26px}
.icon-link{display:inline-flex;width:22px;height:22px}
.icon-link svg{width:100%;height:100%}
.pill{
  font-size:11.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid currentColor;padding:11px 20px;transition:background-color .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease);
}
.header:not(.is-solid) .pill:hover{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.header.is-solid .pill:hover{background:var(--ink);color:var(--ivory);border-color:var(--ink)}

.menu-btn{display:none;width:30px;height:22px;position:relative}
.menu-btn span{position:absolute;left:0;height:1.5px;background:currentColor;transition:width .4s var(--ease)}
.menu-btn span:nth-child(1){top:6px;width:30px}
.menu-btn span:nth-child(2){top:15px;width:20px}
.menu-btn:hover span:nth-child(2){width:30px}

/* ==========================================================
   MOBILE MENU – compact logo, list-first (client feedback)
   ========================================================== */
.drawer{
  position:fixed;inset:0;z-index:80;background:var(--paper);color:var(--ink);
  display:flex;flex-direction:column;
  transform:translateX(-100%);visibility:hidden;
  transition:transform .7s var(--ease-out), visibility 0s linear .7s;
}
.drawer.is-open{transform:none;visibility:visible;transition:transform .7s var(--ease-out), visibility 0s}
.drawer__top{
  display:grid;grid-template-columns:44px 1fr 44px;align-items:center;
  height:72px;padding:0 16px;border-bottom:1px solid var(--line);
}
.drawer__close{width:44px;height:44px;display:flex;align-items:center;justify-content:flex-start}
.drawer__close svg{width:22px;height:22px}
.drawer__brand{justify-self:center;display:flex;align-items:center;gap:10px}
.drawer__brand img{width:30px}
.drawer__brand span{font-family:var(--serif);font-size:12px;letter-spacing:.26em;text-transform:uppercase;white-space:nowrap}
.drawer__top .icon-link{justify-self:end}
.drawer__nav{display:flex;flex-direction:column;padding:8px 0}
.drawer__nav a{
  display:flex;align-items:center;justify-content:space-between;
  padding:17px 24px;font-size:16px;font-weight:400;letter-spacing:.02em;
  border-bottom:1px solid rgba(29,24,20,.07);
  opacity:0;transform:translateX(-14px);transition:opacity .5s var(--ease), transform .6s var(--ease-out), background-color .3s var(--ease);
}
.drawer__nav a:active,.drawer__nav a:hover{background:var(--ivory)}
.drawer__nav a svg{width:18px;height:10px;color:var(--muted)}
.drawer.is-open .drawer__nav a{opacity:1;transform:none}
.drawer.is-open .drawer__nav a:nth-child(1){transition-delay:.18s}
.drawer.is-open .drawer__nav a:nth-child(2){transition-delay:.23s}
.drawer.is-open .drawer__nav a:nth-child(3){transition-delay:.28s}
.drawer.is-open .drawer__nav a:nth-child(4){transition-delay:.33s}
.drawer.is-open .drawer__nav a:nth-child(5){transition-delay:.38s}
.drawer.is-open .drawer__nav a:nth-child(6){transition-delay:.43s}
.drawer.is-open .drawer__nav a:nth-child(7){transition-delay:.48s}
.drawer.is-open .drawer__nav a:nth-child(8){transition-delay:.53s}
.drawer__foot{margin-top:auto;padding:28px 24px calc(28px + env(safe-area-inset-bottom));background:var(--ivory)}
.drawer__foot p{margin:0 0 6px;font-family:var(--serif);font-style:italic;font-size:20px}
.drawer__foot .small{font-size:14px;color:var(--muted);margin:0 0 18px}
.drawer__foot .row{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--ink-2)}

/* ==========================================================
   HERO SLIDER
   ========================================================== */
.hero{
  position:relative;height:calc(100vh - var(--announce-h));height:calc(100svh - var(--announce-h));
  min-height:560px;overflow:hidden;background:#17110d;color:var(--ivory);
}
.slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.6s var(--ease);z-index:1}
.slide.is-active{opacity:1;z-index:2}
.slide.is-leaving{opacity:0;z-index:1}
.slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform 7s var(--ease)}
.slide.is-active img{transform:scale(1)}
.slide[data-focus="right"] img{object-position:70% 50%}
.hero__scrim{
  position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(14,10,8,.62) 0%, rgba(14,10,8,.32) 38%, rgba(14,10,8,0) 64%),
    linear-gradient(0deg, rgba(14,10,8,.55) 0%, rgba(14,10,8,0) 42%),
    linear-gradient(180deg, rgba(14,10,8,.38) 0%, rgba(14,10,8,0) 22%);
}
.hero__content{position:absolute;inset:0;z-index:4;display:flex;align-items:flex-end;padding-bottom:clamp(120px, 17vh, 170px)}
.hero__copy{position:absolute;left:var(--pad);bottom:0;max-width:640px;pointer-events:none}
.hero__copy.is-active{pointer-events:auto}
.hero__copy .eyebrow{color:#E3C88F}
.hero__copy .display,.hero__copy p,.hero__copy .eyebrow,.hero__copy .link-line{text-shadow:0 1px 18px rgba(10,7,5,.45)}
.hero__copy .display{margin:22px 0 22px}
.hero__copy p:not(.display){margin:0 0 34px;max-width:42ch;color:rgba(246,240,230,.86);font-size:17px}
.mask{display:block;overflow:hidden;padding-bottom:.06em}
.mask > span{display:block;transform:translateY(110%);transition:transform 1.3s var(--ease-out)}
.hero__copy .fade{opacity:0;transform:translateY(16px);transition:opacity 1s var(--ease-out), transform 1s var(--ease-out)}
.hero__copy.is-active .mask > span{transform:none}
.hero__copy.is-active .fade{opacity:1;transform:none}
.hero__copy.is-active .eyebrow.fade{transition-delay:.15s}
.hero__copy.is-active .mask:nth-of-type(1) > span{transition-delay:.25s}
.hero__copy.is-active .mask:nth-of-type(2) > span{transition-delay:.38s}
.hero__copy.is-active p.fade{transition-delay:.6s}
.hero__copy p.display{color:var(--ivory)}
.hero__copy.is-active a.fade{transition-delay:.75s}
.hero__copy:not(.is-active) .mask > span{transition:transform .6s var(--ease)}
.hero__copy:not(.is-active) .fade{transition:opacity .5s var(--ease), transform .5s var(--ease)}
body:not(.is-loaded) .hero__copy .mask > span{transform:translateY(110%)}
body:not(.is-loaded) .hero__copy .fade{opacity:0}

.hero__ui{position:absolute;left:0;right:0;bottom:clamp(36px, 6vh, 56px);z-index:5}
.hero__ui .container{display:flex;align-items:center;gap:36px}
.hero__scroll{margin-left:auto}
.hero__count{font-family:var(--serif);font-size:15px;letter-spacing:.06em;display:flex;align-items:baseline;gap:10px;min-width:90px}
.hero__count .cur{font-size:22px}
.hero__count .sep{display:inline-block;width:26px;height:1px;background:rgba(246,240,230,.5);transform:translateY(-5px)}
.hero__bars{display:flex;gap:10px;flex:0 1 320px}
.hero__bar{flex:1;height:22px;position:relative}
.hero__bar::before,.hero__bar i{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(246,240,230,.3)}
.hero__bar i{background:var(--ivory);transform:scaleX(0);transform-origin:left}
.hero__bar.is-done i{transform:scaleX(1)}
.hero__scroll{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:rgba(246,240,230,.8)}
.hero__scroll span.l{width:1px;height:38px;background:rgba(246,240,230,.3);position:relative;overflow:hidden}
.hero__scroll span.l::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:var(--ivory);animation:scrollCue 2.4s var(--ease) infinite}
@keyframes scrollCue{0%{top:-100%}55%{top:100%}100%{top:100%}}

/* ==========================================================
   STORY
   ========================================================== */
.story{padding:clamp(100px, 13vw, 190px) 0;background:var(--paper)}
.story__grid{display:grid;grid-template-columns:5fr 1fr 6fr;align-items:center}
.story__media{grid-column:1;position:relative}
.story__media .img-reveal{aspect-ratio:4/5}
.story__media img{width:100%;height:100%;object-fit:cover}
.story__media figcaption{margin-top:16px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between}
.story__text{grid-column:3}
.story__text .lede{margin:28px 0 34px;font-size:clamp(26px,2.7vw,38px);line-height:1.3}
.story__pull{
  margin:40px 0;padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  font-family:var(--serif);font-style:italic;font-size:clamp(24px,2.3vw,32px);line-height:1.35;color:var(--maroon);
}
.story__sign{margin-top:36px;display:flex;align-items:center;gap:16px;font-family:var(--serif);font-style:italic;font-size:19px;color:var(--ink)}
.story__sign img{width:34px}

/* ==========================================================
   WHY KINKINI
   ========================================================== */
.why{background:var(--indigo);color:var(--ivory);position:relative;overflow:hidden}
.why__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-height:min(92vh, 900px)}
.why__text{padding:clamp(90px,11vw,160px) clamp(28px,5vw,80px) clamp(90px,11vw,160px) max(var(--pad), calc((100vw - var(--maxw))/2));display:flex;flex-direction:column;justify-content:center}
.why__text .eyebrow{color:var(--gold-2)}
.why__text .h2{margin:24px 0 30px}
.why__text .lede{color:var(--ivory);font-style:italic;margin-bottom:26px}
.why__lines{list-style:none;margin:0 0 34px;padding:0}
.why__lines li{color:rgba(246,240,230,.74);font-size:17px;line-height:1.9}
.why__close{font-family:var(--serif);font-size:clamp(22px,2vw,28px);line-height:1.45;margin:0;padding-top:30px;border-top:1px solid var(--line-light)}
.why__close em{color:var(--gold-2)}
.why__media{position:relative;overflow:hidden}
.why__media img{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;object-position:50% 35%}
.why__media::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(90deg, var(--indigo) 0%, rgba(18,25,49,0) 28%)}
.why__media::after{
  content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(105deg, transparent 35%, rgba(255,236,200,.22) 50%, transparent 65%);
  transform:translateX(-120%);
}
.why.is-in .why__media::after{animation:chime 2.6s var(--ease) .6s 1}
@keyframes chime{to{transform:translateX(120%)}}
.rings{display:inline-flex;position:relative;width:46px;height:46px;margin-bottom:28px;color:var(--gold-2)}
.rings svg{width:20px;height:22px;margin:auto;position:relative;z-index:2;transform-origin:50% 10%;animation:sway 5s var(--ease) infinite}
.rings i{position:absolute;inset:0;border:1px solid currentColor;border-radius:50%;opacity:0;animation:ring 3.6s ease-out infinite}
.rings i:nth-child(2){animation-delay:1.2s}.rings i:nth-child(3){animation-delay:2.4s}
@keyframes ring{0%{transform:scale(.4);opacity:0}20%{opacity:.6}100%{transform:scale(1.9);opacity:0}}
@keyframes sway{0%,82%,100%{transform:rotate(0)}86%{transform:rotate(-9deg)}90%{transform:rotate(7deg)}94%{transform:rotate(-4deg)}}

/* ==========================================================
   INSPIRATION
   ========================================================== */
.inspire{background:var(--ivory);padding:clamp(100px,13vw,190px) 0}
.inspire__head{display:grid;grid-template-columns:7fr 5fr;gap:clamp(30px,6vw,100px);align-items:end;margin-bottom:clamp(60px,7vw,100px)}
.inspire__head .h2{margin-top:24px}
.inspire__head .body{margin:0}
.inspire__grid{display:grid;grid-template-columns:6fr 1fr 5fr;align-items:start}
.inspire__list{grid-column:1;list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.inspire__list li{
  display:flex;align-items:baseline;gap:24px;padding:22px 0;border-bottom:1px solid var(--line);
  font-family:var(--serif);font-size:clamp(26px,2.9vw,42px);line-height:1.2;
  transition:color .5s var(--ease), padding-left .6s var(--ease-out);
}
.inspire__list li small{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.2em;color:var(--gold);min-width:26px}
.inspire__list li:hover{color:var(--maroon);padding-left:12px}
.inspire__list li.last{font-style:italic;font-size:clamp(19px,1.8vw,24px);color:var(--ink-2)}
.inspire__collage{grid-column:3;position:relative;padding-bottom:22%}
.inspire__collage .big{aspect-ratio:4/5}
.inspire__collage .big img,.inspire__collage .small img{width:100%;height:100%;object-fit:cover}
.inspire__collage .small{position:absolute;left:-12%;bottom:0;width:54%;aspect-ratio:1;border:10px solid var(--ivory)}
.inspire__collage .small .img-reveal{height:100%}
.inspire__more{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:clamp(30px,6vw,100px);margin-top:clamp(70px,8vw,120px);padding-top:clamp(50px,6vw,80px);border-top:1px solid var(--line)}
.inspire__quote{grid-column:1 / -1;text-align:center;margin:clamp(40px,5vw,70px) auto 0;max-width:24ch;font-family:var(--serif);font-size:clamp(30px,3.6vw,54px);line-height:1.2}
.inspire__quote em{color:var(--maroon)}

/* ---------- marquee ---------- */
.marquee{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:30px 0}
.marquee__track{display:flex;width:max-content;animation:marquee 46s linear infinite}
.marquee__track span{display:inline-flex;align-items:center;gap:44px;padding-right:44px;font-family:var(--serif);font-style:italic;font-size:clamp(24px,2.6vw,38px);color:var(--maroon);white-space:nowrap}
.marquee__track span i{font-style:normal;color:var(--gold);font-size:.55em}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ==========================================================
   JOURNEY
   ========================================================== */
.journey{background:var(--paper);padding:clamp(100px,13vw,190px) 0}
.journey__intro{max-width:880px;margin:0 auto clamp(70px,9vw,130px);text-align:center}
.journey__intro .h2{margin:24px 0 30px}
.journey__intro .lede{max-width:34ch;margin:0 auto}
.journey__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(30px,5vw,70px);text-align:left;margin-top:clamp(44px,5vw,64px)}
.journey__cols h3{font-family:var(--sans);font-weight:500;font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:0 0 14px}
.journey__body{display:grid;grid-template-columns:5fr 1fr 6fr}
.journey__media{grid-column:1;position:sticky;top:110px;align-self:start}
.journey__media .frame{position:relative;aspect-ratio:5/6;overflow:hidden}
.journey__media .j-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;scale:1.06;
  transition:opacity 1.1s var(--ease), scale 2.6s var(--ease-out), clip-path 1.6s var(--ease-out), transform 2.2s var(--ease-out)}
.journey__media .j-img.is-active{opacity:1;scale:1}
.step__img{display:none;margin:0 0 24px;aspect-ratio:4/5;overflow:hidden}
.step__img img{width:100%;height:100%;object-fit:cover}
.journey__media .frame::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg, rgba(20,12,10,.6) 0%, rgba(20,12,10,0) 45%)}
.journey__num{position:absolute;left:28px;bottom:22px;z-index:2;color:var(--ivory);display:flex;align-items:baseline;gap:16px}
.journey__num .n{font-family:var(--serif);font-style:italic;font-size:clamp(64px,7vw,104px);line-height:1;display:inline-block;transition:opacity .5s var(--ease), transform .6s var(--ease-out)}
.journey__num .t{font-size:12px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;transition:opacity .5s var(--ease)}
.journey__num.is-swapping .n,.journey__num.is-swapping .t{opacity:0;transform:translateY(10px)}
.journey__steps{grid-column:3;position:relative;padding-left:46px}
.journey__track{position:absolute;left:0;top:10px;bottom:10px;width:1px;background:var(--line)}
.journey__fill{position:absolute;left:0;top:10px;width:1px;height:0;background:var(--gold)}
.step{position:relative;padding:0 0 clamp(70px,9vh,110px);opacity:.32;transition:opacity .7s var(--ease)}
.step:last-child{padding-bottom:0}
.step.is-active,.step.is-past{opacity:1}
.step::before{content:"";position:absolute;left:-50px;top:13px;width:9px;height:9px;border-radius:50%;background:var(--paper);border:1px solid var(--gold);transition:background-color .5s var(--ease), transform .5s var(--ease)}
.step.is-active::before{background:var(--gold);transform:scale(1.25);box-shadow:0 0 0 6px rgba(168,132,73,.14)}
.step.is-past::before{background:var(--gold)}
.step .k{font-size:11.5px;font-weight:500;letter-spacing:.24em;color:var(--gold);text-transform:uppercase}
.step h3{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3vw,44px);line-height:1.15;margin:10px 0 18px}
.step h3 em{font-style:italic}
.step p{margin:0 0 .8em;color:var(--ink-2);max-width:46ch}
.step .beats{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--ink);line-height:1.6;margin:0 0 .8em}

/* ==========================================================
   WHAT AM I MAKING
   ========================================================== */
.making{background:var(--sand);padding:clamp(100px,13vw,190px) 0}
.making__grid{display:grid;grid-template-columns:6fr 1fr 5fr;align-items:center}
.making__text{grid-column:1}
.making__text .h2{margin:24px 0 28px}
.making__list{list-style:none;margin:40px 0 44px;padding:0;border-top:1px solid rgba(29,24,20,.18)}
.making__list li{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;border-bottom:1px solid rgba(29,24,20,.18);font-family:var(--serif);font-size:clamp(21px,2vw,27px);transition:padding .6s var(--ease-out), color .5s var(--ease)}
.making__list li span{display:flex;align-items:baseline;gap:22px}
.making__list li small{font-family:var(--sans);font-size:11px;font-weight:500;letter-spacing:.2em;color:var(--gold)}
.making__list li svg{width:20px;height:10px;opacity:0;transform:translateX(-10px);transition:opacity .5s var(--ease), transform .5s var(--ease-out);color:var(--maroon)}
.making__list li:hover{color:var(--maroon);padding-left:10px}
.making__list li:hover svg{opacity:1;transform:none}
.making__list li.only{font-style:italic}
.making__soon{font-family:var(--serif);font-size:clamp(20px,1.8vw,24px);line-height:1.5;margin:0 0 30px}
.making__soon em{color:var(--maroon)}
.making__media{grid-column:3}
.making__media .img-reveal{aspect-ratio:4/5}
.making__media img{width:100%;height:100%;object-fit:cover}

/* ==========================================================
   CLOSER + NOTIFY
   ========================================================== */
.closer{position:relative;overflow:hidden;background:var(--maroon-2);color:var(--ivory);padding:clamp(110px,14vw,200px) 0;text-align:center}
/* tint lives inside the same box as the photo so the two can never drift apart */
.closer__bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.closer__bg img{position:absolute;left:0;top:-12%;width:100%;height:124%;object-fit:cover}
.closer__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(36,10,14,.86) 0%, rgba(36,10,14,.8) 50%, rgba(28,8,11,.92) 100%)}
.closer .container{position:relative;z-index:2}
.closer__mark{width:58px;margin:0 auto 34px}
.closer .h2{margin:0 auto 22px;max-width:16ch}
.closer__sub{font-family:var(--serif);font-style:italic;font-size:clamp(19px,1.7vw,23px);color:rgba(246,240,230,.8);max-width:40ch;margin:0 auto 38px}
.btn-outline{
  display:inline-flex;align-items:center;gap:12px;padding:16px 30px;border:1px solid rgba(246,240,230,.5);
  font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  transition:background-color .5s var(--ease), color .5s var(--ease), border-color .5s var(--ease);
}
.btn-outline svg{width:16px;height:16px}
.btn-outline:hover{background:var(--ivory);color:var(--maroon-2);border-color:var(--ivory)}
.closer__divider{width:1px;height:70px;background:rgba(246,240,230,.3);margin:clamp(56px,7vw,90px) auto}
.closer .eyebrow{color:var(--gold-2)}
.closer__note{color:rgba(246,240,230,.76);max-width:44ch;margin:18px auto 40px}
.notify{display:flex;max-width:520px;margin:0 auto;border-bottom:1px solid rgba(246,240,230,.45);transition:border-color .4s var(--ease)}
.notify:focus-within{border-color:var(--gold-2)}
.notify input[type=email]{flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--ivory);font:inherit;font-size:17px;padding:16px 4px}
.notify input::placeholder{color:rgba(246,240,230,.5)}
.notify button{display:inline-flex;align-items:center;gap:12px;padding:16px 4px 16px 18px;font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-2);transition:color .4s var(--ease)}
.notify button svg{width:18px;height:10px;transition:transform .5s var(--ease-out)}
.notify button:hover{color:var(--ivory)}
.notify button:hover svg{transform:translateX(6px)}
.notify button:disabled{opacity:.5;cursor:default}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{min-height:1.4em;margin-top:16px;font-size:14px;color:rgba(246,240,230,.7)}
.thanks{display:none;font-family:var(--serif);font-style:italic;font-size:clamp(21px,2vw,26px);line-height:1.5}
.is-sent .notify{display:none}
.is-sent .thanks{display:block}

/* ==========================================================
   FOOTER
   ========================================================== */
.footer{background:#15100D;color:rgba(246,240,230,.72);padding:clamp(80px,9vw,120px) 0 36px}
.footer__top{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(40px,6vw,110px);padding-bottom:clamp(56px,7vw,90px);border-bottom:1px solid rgba(246,240,230,.12)}
.footer__logo{width:128px;margin-bottom:30px}
.footer__tag{font-family:var(--serif);font-style:italic;font-size:clamp(19px,1.6vw,22px);line-height:1.55;color:var(--ivory);margin:0}
.footer__social{display:flex;gap:12px;margin-top:30px}
.footer__social a{width:42px;height:42px;border:1px solid rgba(246,240,230,.24);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background-color .4s var(--ease), border-color .4s var(--ease), color .4s var(--ease)}
.footer__social a:hover{background:var(--ivory);border-color:var(--ivory);color:#15100D}
.footer__social svg{width:17px;height:17px}
.footer__mail{display:inline-block;margin-top:22px;font-size:15px;border-bottom:1px solid rgba(246,240,230,.25);padding-bottom:3px;transition:color .3s var(--ease), border-color .3s var(--ease)}
.footer__mail:hover{color:var(--ivory);border-color:var(--ivory)}
.footer__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.footer__cols h4{margin:0 0 20px;font-size:11px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-2)}
.footer__cols ul{list-style:none;margin:0;padding:0}
.footer__cols li{margin-bottom:12px;font-size:15px;line-height:1.5}
.footer__cols a{transition:color .3s var(--ease)}
.footer__cols a:hover,.footer__cols a[aria-current="page"]{color:var(--ivory)}
.footer__bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:30px;font-size:12.5px;letter-spacing:.06em}
.footer__bottom button{font-size:11px;letter-spacing:.24em;text-transform:uppercase;display:inline-flex;gap:10px;align-items:center;transition:color .3s var(--ease)}
.footer__bottom button:hover{color:var(--ivory)}
.footer__bottom svg{width:10px;height:14px}

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width:1100px){
  .nav,.header__right .pill{display:none}
  .menu-btn{display:block}
  .header__inner{grid-template-columns:44px 1fr 44px}
  .brand{justify-self:center}
  .header__right{gap:0}
}
@media (max-width:900px){
  body{font-size:16px}
  .story__grid,.inspire__head,.inspire__grid,.making__grid,.journey__body{grid-template-columns:1fr}
  .story__media,.story__text,.inspire__list,.inspire__collage,.making__text,.making__media,.journey__media,.journey__steps{grid-column:1}
  .story__text{margin-top:56px}
  .why__grid{grid-template-columns:1fr;min-height:0}
  .why__media{order:-1;aspect-ratio:5/4;max-height:60vh}
  .why__media img{object-position:50% 12%}
  .why__text{padding-top:36px}
  .why__media::before{background:linear-gradient(0deg, var(--indigo) 0%, rgba(18,25,49,0) 30%)}
  .why__text{padding:56px var(--pad) 96px}
  .inspire__head{align-items:start}
  .inspire__collage{margin-top:70px;padding-bottom:0;padding-left:18%}
  .inspire__collage .small{left:0;bottom:-40px;width:46%;border-width:8px}
  .inspire__more{grid-template-columns:1fr;gap:0;margin-top:110px}
  .journey__cols{grid-template-columns:1fr;gap:24px}
  .journey__media{display:none}
  .step__img{display:block}
  .step{opacity:1}
  .making__media{margin-top:60px;order:-1}
  .making__text{order:1}
}
@media (max-width:767px){
  :root{--announce-h:34px}
  .announce{font-size:9.5px;letter-spacing:.18em}
  .announce .hide-sm{display:none}
  .header__inner{padding-top:12px;padding-bottom:12px}
  .hero{min-height:520px}
  .hero__scrim{
    background:
      linear-gradient(0deg, rgba(14,10,8,.92) 0%, rgba(14,10,8,.78) 34%, rgba(14,10,8,.5) 52%, rgba(14,10,8,0) 72%),
      linear-gradient(180deg, rgba(14,10,8,.5) 0%, rgba(14,10,8,0) 24%);
  }
  .hero__content{padding-bottom:118px}
  .hero__copy{right:var(--pad)}
  .hero__copy .display{font-size:clamp(40px,11.5vw,54px);margin:16px 0}
  .hero__copy p:not(.display){font-size:15.5px;margin-bottom:26px}
  .hero__scroll{display:none}
  .hero__bars{max-width:none}
  .story__pull{margin:32px 0}
  .inspire__list li{gap:16px;padding:18px 0}
  .step h3{font-size:30px}
  .journey__steps{padding-left:36px}
  .step::before{left:-40px}
  .notify{flex-direction:column;border-bottom:0}
  .notify input[type=email]{border-bottom:1px solid rgba(246,240,230,.45);text-align:center}
  .notify button{justify-content:center;padding:22px 0 0}
}

@media (min-width:768px) and (max-width:1100px) and (orientation:portrait){
  .hero__scrim{
    background:
      linear-gradient(0deg, rgba(14,10,8,.9) 0%, rgba(14,10,8,.7) 30%, rgba(14,10,8,.35) 48%, rgba(14,10,8,0) 64%),
      linear-gradient(180deg, rgba(14,10,8,.45) 0%, rgba(14,10,8,0) 22%);
  }
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
  .marquee__track{animation:none}
}

/* ==========================================================
   SHARED NAV STATES
   ========================================================== */
.nav a[aria-current="page"]::after{transform:scaleX(1)}
.drawer__nav a{padding:15px 24px}
.drawer__nav a[aria-current="page"]{color:var(--maroon)}
.drawer__nav a.is-cta{color:var(--maroon);font-family:var(--serif);font-style:italic;font-size:17px}
.drawer__label{padding:20px 24px 6px;font-size:10.5px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}

/* ==========================================================
   INNER PAGES
   ========================================================== */
.page main{padding-top:var(--hdr,118px)}
.page .header{top:var(--announce-h)}
.page .header.is-scrolled{top:0}
.page .header:not(.is-scrolled) .brand{width:102px}
.page .header:not(.is-scrolled) .header__inner{padding-top:12px;padding-bottom:12px}

.crumbs{display:flex;gap:10px;align-items:center;font-size:11.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0 0 34px}
.crumbs a{transition:color .3s var(--ease)}
.crumbs a:hover{color:var(--ink)}
.crumbs span[aria-hidden]{opacity:.5}

/* split hero */
.phero{background:var(--ivory);padding:clamp(50px,6vw,90px) 0 clamp(70px,8vw,120px)}
.phero__grid{display:grid;grid-template-columns:7fr 1fr 5fr;align-items:center}
.phero__text{grid-column:1}
.phero__media{grid-column:3;margin:0}
.phero__media .img-reveal{aspect-ratio:4/5}
.phero__media img{width:100%;height:100%;object-fit:cover}
.phero__title{font-family:var(--serif);font-weight:400;letter-spacing:-.012em;line-height:1.08;margin:24px 0 28px;font-size:clamp(40px,5vw,74px);text-wrap:balance}
.phero__title em,.pband__title em{font-style:italic}
.phero .lede{max-width:34ch}

/* centred band hero */
.pband{background:var(--ivory);padding:clamp(50px,6vw,90px) 0 clamp(70px,8vw,110px);text-align:center;border-bottom:1px solid var(--line)}
.pband .crumbs{justify-content:center}
.pband__title{font-family:var(--serif);font-weight:400;letter-spacing:-.012em;line-height:1.1;margin:22px auto 26px;max-width:18ch;font-size:clamp(40px,5vw,72px);text-wrap:balance}
.pband .lede{max-width:44ch;margin:0 auto;font-size:clamp(19px,1.7vw,23px);color:var(--ink-2)}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:40px}
.chips a{padding:11px 20px;border:1px solid var(--line);font-size:11.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;transition:background-color .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease)}
.chips a:hover{background:var(--ink);color:var(--ivory);border-color:var(--ink)}

.section{padding:clamp(80px,10vw,150px) 0}
.section--paper{background:var(--paper)}
.section--sand{background:var(--sand)}

/* long-form prose */
.prose{max-width:690px;margin:0 auto}
.prose p{color:var(--ink-2);margin:0 0 1.4em;text-wrap:pretty}
.prose p:last-child{margin-bottom:0}
.prose .first{font-family:var(--serif);font-size:clamp(22px,2.1vw,28px);line-height:1.5;color:var(--ink)}
.prose .drop::first-letter{font-family:var(--serif);float:left;font-size:4.6em;line-height:.8;padding:8px 14px 0 0;color:var(--maroon)}
.pull{font-family:var(--serif);font-style:italic;font-size:clamp(26px,2.8vw,40px);line-height:1.32;color:var(--maroon);text-align:center;max-width:24ch;margin:clamp(56px,7vw,96px) auto;text-wrap:balance;position:relative;padding-top:42px}
.pull::before{content:"";position:absolute;top:0;left:50%;width:1px;height:26px;background:var(--gold)}
.statement{font-family:var(--serif);font-size:clamp(30px,3.4vw,50px);line-height:1.22;text-align:center;max-width:22ch;margin:0 auto;text-wrap:balance}
.statement em{font-style:italic;color:var(--maroon)}

.duo{display:grid;grid-template-columns:5fr 4fr;gap:clamp(18px,2.4vw,36px);align-items:end;max-width:1040px;margin:clamp(56px,7vw,100px) auto}
.duo .img-reveal{aspect-ratio:4/5}
.duo figure{margin:0}
.duo figure:nth-child(2) .img-reveal{aspect-ratio:1}
.duo figure:nth-child(2){margin-bottom:clamp(30px,6vw,90px)}
.duo img{width:100%;height:100%;object-fit:cover}
.duo figcaption{margin-top:14px;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* promise */
.intro2{display:grid;grid-template-columns:5fr 1fr 6fr;align-items:end;margin-bottom:clamp(60px,7vw,100px)}
.intro2 > :first-child{grid-column:1}
.intro2 > :last-child{grid-column:3}
.intro2 .h2{margin-top:22px}
.pillars{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.pillar{padding:clamp(40px,4.5vw,64px) 0;border-bottom:1px solid var(--line);position:relative}
.pillar:nth-child(odd){padding-right:clamp(24px,4.5vw,70px);border-right:1px solid var(--line)}
.pillar:nth-child(even){padding-left:clamp(24px,4.5vw,70px)}
.pillar .num{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--gold)}
.pillar h3{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.5vw,36px);line-height:1.18;margin:16px 0 18px}
.pillar p{margin:0;color:var(--ink-2);max-width:46ch}
.pillar::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--gold);transition:width .9s var(--ease-out)}
.pillar:nth-child(even)::after{left:clamp(24px,4.5vw,70px)}
.pillar:hover::after{width:60%}

/* letter */
.sign{margin-top:64px;padding-top:44px;border-top:1px solid var(--line);display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.sign .love{font-family:var(--serif);font-style:italic;font-size:23px;margin:0 0 12px}
.sign .names{font-family:var(--serif);font-size:clamp(28px,3vw,40px);line-height:1.15;margin:0 0 10px}
.sign .role{font-size:11.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0}
.sign img{width:58px;opacity:.85}

/* care + policy two-column */
.split{display:grid;grid-template-columns:4fr 1fr 7fr}
.split__head{grid-column:1;position:sticky;top:120px;align-self:start}
.split__head .h2{margin:22px 0 22px;font-size:clamp(32px,3.4vw,50px)}
.split__head .body{margin:0}
.split__body{grid-column:3}
.split + .split{margin-top:clamp(90px,11vw,160px);padding-top:clamp(90px,11vw,160px);border-top:1px solid var(--line)}
.item{display:grid;grid-template-columns:64px 1fr;padding:34px 0;border-bottom:1px solid var(--line)}
.item:first-child{padding-top:0}
.item .num{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--gold);line-height:1.6}
.item h3{font-family:var(--serif);font-weight:400;font-size:clamp(23px,2.1vw,30px);line-height:1.25;margin:0 0 12px}
.item p{margin:0 0 .9em;color:var(--ink-2)}
.item p:last-child{margin-bottom:0}
.item a,.prose a,.note a{color:var(--maroon);border-bottom:1px solid rgba(90,27,34,.35);transition:border-color .3s var(--ease)}
.item a:hover,.prose a:hover,.note a:hover{border-color:var(--maroon)}
.note{background:var(--ivory);border-left:2px solid var(--gold);padding:28px 32px;margin:34px 0 0}
.note h3{font-family:var(--sans);font-weight:500;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0 0 10px}
.note p{margin:0;color:var(--ink-2)}
.pnav{list-style:none;margin:36px 0 0;padding:0;border-top:1px solid var(--line)}
.pnav a{display:flex;justify-content:space-between;align-items:center;padding:15px 0;border-bottom:1px solid var(--line);font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);transition:color .3s var(--ease), padding .5s var(--ease-out)}
.pnav a::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);opacity:0;transition:opacity .3s var(--ease)}
.pnav a:hover{color:var(--ink);padding-left:8px}
.pnav a.is-active{color:var(--maroon)}
.pnav a.is-active::after{opacity:1}

/* dark reminder band */
.band-dark{background:var(--maroon-2);color:var(--ivory);text-align:center;padding:clamp(90px,11vw,160px) 0}
.band-dark .eyebrow{color:var(--gold-2)}
.band-dark .statement{color:var(--ivory);margin-top:26px}
.band-dark .signoff{margin-top:34px;font-family:var(--serif);font-style:italic;font-size:21px;color:rgba(246,240,230,.8)}

/* contact */
.cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.ccard{background:var(--paper);padding:clamp(36px,4.5vw,64px);display:flex;flex-direction:column;align-items:flex-start;gap:14px;transition:background-color .5s var(--ease)}
.ccard:hover{background:var(--ivory)}
.ccard__icon{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold);margin-bottom:10px}
.ccard__icon svg{width:18px;height:18px}
.ccard .k{font-size:11.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.ccard .v{font-family:var(--serif);font-size:clamp(23px,2.2vw,32px);line-height:1.3;overflow-wrap:anywhere}
.ccard p{margin:0;color:var(--ink-2)}
.ccard .link-line{margin-top:auto;padding-top:18px}

/* continue reading */
.next{background:var(--paper);border-top:1px solid var(--line)}
.next__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.next a{display:block;padding:clamp(50px,6vw,90px) var(--pad);transition:background-color .5s var(--ease)}
.next a + a{border-left:1px solid var(--line)}
.next a:hover{background:var(--ivory)}
.next .k{font-size:11.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.next .t{display:flex;align-items:center;justify-content:space-between;gap:20px;font-family:var(--serif);font-size:clamp(26px,2.8vw,40px);line-height:1.2;margin-top:14px}
.next .t svg{width:26px;height:12px;flex:none;transition:transform .5s var(--ease-out)}
.next a:hover .t svg{transform:translateX(8px)}

/* holding pages */
.soon{padding:clamp(60px,8vw,110px) 0 clamp(100px,12vw,170px);text-align:center;background:var(--paper)}
.soon__mark{width:56px;margin:0 auto 30px;opacity:.85}
.soon p{max-width:46ch;margin:0 auto 34px;color:var(--ink-2)}
.soon .btns{display:flex;gap:28px;justify-content:center;flex-wrap:wrap}

@media (max-width:900px){
  .phero__grid,.intro2,.split{grid-template-columns:minmax(0,1fr)}
  .phero__text,.phero__media,.intro2 > :first-child,.intro2 > :last-child,.split__head,.split__body{grid-column:1}
  .phero__media{margin-top:50px}
  .intro2 > :last-child{margin-top:22px}
  .split__head{position:relative;top:0;margin-bottom:44px}
  .footer__top{grid-template-columns:1fr}
  .duo{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  .pillars{grid-template-columns:1fr}
  .pillar:nth-child(odd),.pillar:nth-child(even){padding-left:0;padding-right:0;border-right:0}
  .pillar:nth-child(even)::after{left:0}
  .item{grid-template-columns:44px 1fr;padding:28px 0}
  .cgrid,.next__grid{grid-template-columns:1fr}
  .next a + a{border-left:0;border-top:1px solid var(--line)}
  .sign{flex-direction:column;align-items:flex-start}
  .note{padding:24px 22px}
  .footer__cols{grid-template-columns:1fr 1fr;row-gap:44px}
  .footer__cols > div:last-child{grid-column:1 / -1}
  .footer__bottom{flex-direction:column-reverse;align-items:flex-start}
  .crumbs{margin-bottom:26px}
}

/* policy parts */
.item--plain{grid-template-columns:1fr}
.ppart{scroll-margin-top:110px}
.ppart + .ppart{margin-top:clamp(70px,8vw,110px);padding-top:clamp(70px,8vw,110px);border-top:1px solid var(--line)}
.ppart > .h2{font-size:clamp(32px,3.2vw,46px);margin:0 0 22px}
.ppart__intro{color:var(--ink-2);margin:0 0 30px;max-width:60ch}
.ppart__thanks{font-family:var(--serif);font-style:italic;font-size:22px;margin:22px 0 0;color:var(--maroon)}
.split[id]{scroll-margin-top:110px}
.band-dark .closer__note{margin-left:auto;margin-right:auto}
@media (max-width:900px){
  .pnav{display:flex;gap:8px;overflow-x:auto;border-top:0;margin-top:18px;padding-bottom:4px;scrollbar-width:none}
  .pnav::-webkit-scrollbar{display:none}
  .pnav a{white-space:nowrap;border:1px solid var(--line);padding:11px 16px}
  .pnav a::after{display:none}
  .pnav a:hover{padding-left:16px}
  .pnav a.is-active{background:var(--ink);color:var(--ivory);border-color:var(--ink)}
}
.band-dark .statement em{color:var(--gold-2)}
.items > .item:last-child{border-bottom:0;padding-bottom:0}
.ppart > .h2 + .items{margin-top:44px}
.ppart__intro + .items{margin-top:40px}
@media (max-width:767px){
  .ccard{padding:30px 26px}
  .ccard .v--email{font-size:clamp(17px,5vw,22px);overflow-wrap:normal}
}

/* ==========================================================
   BANNER HERO (inner pages)
   ========================================================== */
.bhero{position:relative;overflow:hidden;isolation:isolate;
  height:clamp(520px, calc(100vh - var(--hdr,118px) - var(--announce-h)), 820px);
  height:clamp(520px, calc(100svh - var(--hdr,118px) - var(--announce-h)), 820px);
  display:flex;align-items:center}
.bhero__media{position:absolute;inset:0;z-index:-2}
.bhero__media img{width:100%;height:100%;object-fit:cover;object-position:72% 50%;transform:scale(1.06);transition:transform 2.4s var(--ease-out)}
.bhero.is-in .bhero__media img{transform:scale(1)}
.bhero__scrim{position:absolute;inset:0;z-index:-1;pointer-events:none}
.bhero--dark{background:#17110d;color:var(--ivory)}
.bhero--dark .bhero__scrim{background:linear-gradient(90deg, rgba(14,10,8,.74) 0%, rgba(14,10,8,.52) 32%, rgba(14,10,8,.12) 55%, rgba(14,10,8,0) 66%)}
.bhero--light{background:var(--ivory);color:var(--ink)}
.bhero--light .bhero__scrim{background:linear-gradient(90deg, rgba(251,247,241,.9) 0%, rgba(251,247,241,.72) 34%, rgba(251,247,241,.2) 56%, rgba(251,247,241,0) 66%)}
.bhero__inner{width:100%}
.bhero__text{max-width:600px}
.bhero__title{font-family:var(--serif);font-weight:400;letter-spacing:-.012em;line-height:1.08;margin:22px 0 24px;font-size:clamp(40px,4.8vw,72px);text-wrap:balance}
.bhero__title em{font-style:italic}
.bhero .lede{font-size:clamp(18px,1.5vw,21px);line-height:1.6;max-width:44ch;margin:0}
.bhero .chips{justify-content:flex-start;margin-top:32px}
.bhero--dark .crumbs,.bhero--dark .crumbs a{color:rgba(246,240,230,.72)}
.bhero--dark .crumbs a:hover{color:var(--ivory)}
.bhero--dark .eyebrow{color:#E3C88F}
.bhero--dark .lede{color:rgba(246,240,230,.86)}
.bhero--dark .bhero__title,.bhero--dark .lede,.bhero--dark .eyebrow{text-shadow:0 1px 20px rgba(10,7,5,.4)}
.bhero--dark .chips a{border-color:rgba(246,240,230,.45);color:var(--ivory)}
.bhero--dark .chips a:hover{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.bhero--light .lede{color:var(--ink-2)}
.bhero--light .chips a{border-color:rgba(29,24,20,.3)}

@media (max-width:767px){
  .bhero{height:auto;display:block}
  .bhero__media{position:relative;inset:auto;display:block;aspect-ratio:1/1}
  .bhero__media img{object-position:50% 50%}
  .bhero__scrim{display:none}
  .bhero__inner{padding-top:34px;padding-bottom:52px}
  .bhero__title{font-size:clamp(36px,10vw,48px);margin:16px 0 18px}
  .bhero--dark .bhero__title,.bhero--dark .lede,.bhero--dark .eyebrow{text-shadow:none}
  .bhero .crumbs{margin-bottom:22px}
  .bhero--dark{background:var(--maroon-2)}
}