/* ==========================================================================
   MEDIUM RARE DISTRIBUTION
   One ink (oxblood) on butcher-paper blush. Stamps mark every door.
   Type: Mona Sans, slightly expanded (display) + Schibsted Grotesk (text). Both OFL, self-hosted.
   ========================================================================== */

@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/SchibstedGrotesk-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/SchibstedGrotesk-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Mona Sans";font-style:normal;font-weight:200 900;font-stretch:75% 125%;font-display:swap;src:url(../fonts/MonaSans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Mona Sans";font-style:normal;font-weight:200 900;font-stretch:75% 125%;font-display:swap;src:url(../fonts/MonaSans-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"MR Kufi";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/NotoKufiArabic-cities.woff2) format("woff2");unicode-range:U+0600-06FF, U+FE70-FEFF}

:root{--u:min(2px,max(1px,calc(100vw / 1440 * .85 + .15px)));
  color-scheme:light;
  --paper:#EEDCD1;
  --paper-2:#E6CEC1;
  --stamp:#FBF4EC;
  --ink:#3B0A06;
  --ink-soft:#6E3F37;
  --oxblood:#840F03;
  --rust:#BA7D32;
  --gold:#E0AC57;
  --rule:rgba(59,10,6,.16);
  --display:"Mona Sans",ui-sans-serif,system-ui,sans-serif;
  --text:"Schibsted Grotesk",ui-sans-serif,system-ui,sans-serif;
  --gutter:clamp(calc(20*var(--u)),4.2vw,calc(64*var(--u)));
  --max:calc(1440*var(--u));
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-io:cubic-bezier(.77,0,.175,1);
  --ease-stamp:cubic-bezier(.34,1.5,.64,1);
}

*,*::before,*::after{box-sizing:border-box}
:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + calc(24*var(--u)));-webkit-text-size-adjust:100%;background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--text);font-size:calc(18*var(--u));line-height:1.55;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01" 0}
img{max-width:100%;display:block}

/* ---- Terrain: faint dune contours behind the top of every page ------------ */
body{position:relative;z-index:0}
.terrain{position:absolute;left:0;right:0;top:0;height:var(--terrain-h,calc(980*var(--u)));z-index:-1;pointer-events:none;overflow:hidden}
.terrain::before{content:"";position:absolute;inset:calc(-24*var(--u));background:var(--oxblood);opacity:.075;
  -webkit-mask:url(../assets/terrain.svg) var(--tpos,100% 0)/calc(2400*var(--u)) calc(1600*var(--u)) no-repeat,linear-gradient(to bottom,#000 80%,transparent);
  -webkit-mask-composite:source-in;
          mask:url(../assets/terrain.svg) var(--tpos,100% 0)/calc(2400*var(--u)) calc(1600*var(--u)) no-repeat,linear-gradient(to bottom,#000 80%,transparent);
          mask-composite:intersect;
  transform:translate3d(var(--tx,0px),var(--ty,0px),0)}
body[data-p=home]{--terrain-h:100svh;--tpos:100% 0}
body[data-p=we]{--tpos:20% 10%}
body[data-p=brands]{--tpos:60% 85%}
body[data-p=stores]{--tpos:0% 60%}
body[data-p=middle-east]{--tpos:45% 35%}
body[data-p^=brand-]{--tpos:85% 45%;--terrain-h:calc(720*var(--u))}
@media (max-width:860px){.terrain{--terrain-h:calc(620*var(--u))}.terrain::before{-webkit-mask-size:calc(1800*var(--u)) calc(1200*var(--u)),auto;mask-size:calc(1800*var(--u)) calc(1200*var(--u)),auto;opacity:.075}body[data-p=home] .terrain{--terrain-h:100svh}}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul{padding:0;list-style:none}
::selection{background:var(--oxblood);color:var(--stamp)}
:focus-visible{outline:2px solid var(--oxblood);outline-offset:calc(4*var(--u));border-radius:2px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.num{font-variant-numeric:tabular-nums lining-nums}

/* ---- Type ---------------------------------------------------------------- */
.display{font-family:var(--display);font-weight:620;font-stretch:110%;letter-spacing:-.025em;line-height:1}
.h-page{font-family:var(--display);font-weight:720;font-stretch:112%;font-size:clamp(calc(54*var(--u)),9.2vw,calc(158*var(--u)));line-height:.9;letter-spacing:-.045em;color:var(--oxblood)}
.h-sec{font-family:var(--display);font-weight:680;font-stretch:110%;font-size:clamp(calc(32*var(--u)),3.9vw,calc(58*var(--u)));line-height:1;letter-spacing:-.035em}
.h-item{font-family:var(--display);font-weight:640;font-stretch:108%;font-size:clamp(calc(24*var(--u)),2.1vw,calc(31*var(--u)));line-height:1.05;letter-spacing:-.025em}
.lead{font-size:clamp(calc(19*var(--u)),1.55vw,calc(23*var(--u)));line-height:1.45;max-width:34em;text-wrap:pretty}
.prose p{max-width:36em;text-wrap:pretty}
.prose p+p{margin-top:.8em}
.soft{color:var(--ink-soft)}
.small{font-size:calc(15*var(--u));line-height:1.5}

/* Links in running text: the same underline everywhere, so the signal is learned once */
.ul{color:var(--oxblood);text-decoration:underline;text-decoration-thickness:.075em;text-underline-offset:.18em;text-decoration-skip-ink:auto;transition:text-decoration-thickness 160ms ease,color 160ms ease}
@media (hover:hover) and (pointer:fine){.ul:hover{text-decoration-thickness:.14em}}
.ext::after{content:"";display:inline-block;width:.62em;height:.62em;margin-left:.28em;vertical-align:.05em;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 1.5h7.5V9M10.5 1.5 1.5 10.5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 1.5h7.5V9M10.5 1.5 1.5 10.5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---- Buttons ------------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:calc(46*var(--u));padding:0 calc(22*var(--u));border-radius:calc(999*var(--u));border:0;background:var(--oxblood);color:var(--stamp);font:600 calc(16*var(--u))/1 var(--text);text-decoration:none;cursor:pointer;white-space:nowrap;transition:transform 160ms var(--ease-out),background-color 160ms ease,color 160ms ease}
.btn:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.btn:hover{background:var(--ink)}}
.btn.ghost{background:transparent;color:var(--oxblood);box-shadow:inset 0 0 0 1.5px currentColor}
@media (hover:hover) and (pointer:fine){.btn.ghost:hover{background:var(--oxblood);color:var(--stamp)}}
.btn.paper{background:var(--stamp);color:var(--oxblood)}
.foot .btn.paper{background:var(--f-btn);color:var(--f-btn-ink)}
@media (hover:hover) and (pointer:fine){.btn.paper:hover{background:var(--paper)}}

/* ---- Lockup: the unicorn stamp, cancelled by the word "Distribution" -------- */
.lockup{--lk-w:clamp(calc(150*var(--u)),13.4vw,calc(184*var(--u)));--lk-stamp:calc(46*var(--u));display:inline-flex;align-items:center;gap:calc(14*var(--u));text-decoration:none;color:var(--ink);view-transition-name:vt-logo;-webkit-tap-highlight-color:transparent}
.lk-stamp{display:block;flex:none;line-height:0}
.lk-stamp img{height:var(--lk-stamp);width:auto;transform:rotate(-6deg);filter:drop-shadow(0 2px calc(3*var(--u)) rgba(59,10,6,.22)) drop-shadow(0 .5px .5px rgba(59,10,6,.2));transition:transform 320ms var(--ease-out)}
.lk-words{display:flex;flex-direction:column;gap:0;width:var(--lk-w)}
.lk-words svg{display:block;width:100%;height:auto}
.lk-words .lg-a{fill:var(--oxblood)}.lk-words .lg-b{fill:var(--rust)}
.lk-sub{display:flex;align-items:center;gap:calc(9*var(--u))}
.lk-dist{font-family:var(--display);font-weight:620;font-stretch:115%;font-size:calc(var(--lk-w) * .074);line-height:1;letter-spacing:.01em;color:var(--ink);white-space:nowrap}
.lk-waves{flex:1;height:.62em;min-width:calc(24*var(--u));font-size:calc(var(--lk-w) * .088);background:var(--oxblood);opacity:.75;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 10'%3E%3Cpath d='M0 2q4.5-2.4 9 0t9 0M0 5q4.5-2.4 9 0t9 0M0 8q4.5-2.4 9 0t9 0' fill='none' stroke='%23000' stroke-width='1.05'/%3E%3C/svg%3E") 0 50%/1.1em .62em repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 10'%3E%3Cpath d='M0 2q4.5-2.4 9 0t9 0M0 5q4.5-2.4 9 0t9 0M0 8q4.5-2.4 9 0t9 0' fill='none' stroke='%23000' stroke-width='1.05'/%3E%3C/svg%3E") 0 50%/1.1em .62em repeat-x}
.lockup:active .lk-stamp img{transform:rotate(-7deg) scale(.95)}
@media (hover:hover) and (pointer:fine){
  .lockup:hover .lk-stamp img{transform:rotate(0deg) translateY(-2px) scale(1.06)}
  .lockup:hover .lk-waves{animation:frank 700ms linear infinite}
}
@keyframes frank{to{-webkit-mask-position:-1.1em 50%;mask-position:-1.1em 50%}}
.lk-home{--lk-w:clamp(calc(168*var(--u)),15.5vw,calc(214*var(--u)));--lk-stamp:calc(52*var(--u))}

/* ---- Postmark ------------------------------------------------------------ */
.pm{display:block;overflow:visible}
.pm circle{fill:none;stroke:currentColor}
.pm .pm-o{stroke-width:2.2}.pm .pm-i{stroke-width:1.2}
.pm text{fill:currentColor;font-family:var(--text);font-weight:600}
.pm .pm-ring{font-size:calc(10.5*var(--u));letter-spacing:.06em}
.pm .pm-c{font-family:var(--display);font-weight:760;font-stretch:118%;font-size:calc(18*var(--u));letter-spacing:.02em}
.pm .pm-s{font-size:calc(7.5*var(--u));letter-spacing:.14em}
.pm .pm-w{fill:none;stroke:currentColor;stroke-width:2}

/* ---- Stamp --------------------------------------------------------------- */
/* A perforated paper frame drawn with a mask: holes centred on every edge. */
.stamp{
  --r:max(1.4px,.034em);        /* hole radius */
  --t:max(calc(5*var(--u)),.105em);          /* hole spacing */
  --pad:max(calc(3*var(--u)),.07em);
  position:relative;display:inline-block;vertical-align:middle;
  padding:var(--pad);background:var(--stamp);
  -webkit-mask:linear-gradient(#000 0 0) center/calc(100% - 2*var(--r)) calc(100% - 2*var(--r)) no-repeat,
               radial-gradient(circle var(--r) at center,#0000 calc(100% - .5px),#000) calc(var(--t)/-2) calc(var(--t)/-2)/var(--t) var(--t) round;
          mask:linear-gradient(#000 0 0) center/calc(100% - 2*var(--r)) calc(100% - 2*var(--r)) no-repeat,
               radial-gradient(circle var(--r) at center,#0000 calc(100% - .5px),#000) calc(var(--t)/-2) calc(var(--t)/-2)/var(--t) var(--t) round;
}
.stamp-face{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:var(--paper-2)}
.stamp-face img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stamp-face .mark{position:absolute;inset:18% 14%;background:var(--ink);-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.stamp-face.on-stamp{background:var(--stamp);box-shadow:inset 0 0 0 1px var(--rule)}
/* cycling faces */
.stamp-face [data-f]{opacity:0;filter:blur(calc(3*var(--u)));transition:opacity 520ms ease,filter 520ms ease}
.stamp-face [data-f].on{opacity:1;filter:blur(0)}
/* shadow lives on a wrapper because the mask clips box-shadow */
.stamp-wrap{display:inline-block;filter:drop-shadow(0 .06em .07em rgba(59,10,6,.22)) drop-shadow(0 .015em .02em rgba(59,10,6,.18))}
/* painted stamps that come with their own perforations */
.stamp-art{display:block;filter:drop-shadow(0 .06em .08em rgba(59,10,6,.24))}

/* ==========================================================================
   THE SENTENCE (home hero, inner nav, footer)
   ========================================================================== */
.sentence{font-family:var(--display);font-weight:660;font-stretch:110%;letter-spacing:-.04em;color:var(--ink);text-wrap:balance}
.sentence .w{color:#9C726A;transition:opacity 220ms ease,color 220ms ease}
.s-link{
  --uh:.072em;
  position:relative;color:var(--oxblood);text-decoration:none;white-space:nowrap;
  transition:opacity 220ms ease,color 220ms ease;
  -webkit-tap-highlight-color:transparent;
}
.s-txt{--lift:.19em;position:relative;padding-bottom:.08em}
/* the rule under each door: straight at rest, a flowing franking wave on hover */
.s-txt::before,.s-txt::after{content:"";position:absolute;left:0;right:0;pointer-events:none}
.s-txt::before{bottom:calc(.015em + var(--lift));height:var(--uh);background:currentColor;transform-origin:right center;transition:transform 300ms var(--ease-out) 40ms}
.s-txt::after{bottom:calc(var(--lift) - .1em);height:.26em;background:var(--wave,var(--rust));-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 8'%3E%3Cpath d='M-10 4q5-3.4 10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0' fill='none' stroke='%23000' stroke-width='1.7'/%3E%3C/svg%3E") 0 50%/6.4em .26em repeat-x;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 8'%3E%3Cpath d='M-10 4q5-3.4 10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0t10 0' fill='none' stroke='%23000' stroke-width='1.7'/%3E%3C/svg%3E") 0 50%/6.4em .26em repeat-x;clip-path:inset(0 100% 0 0);transition:clip-path 420ms var(--ease-out)}
@keyframes flow{to{-webkit-mask-position:-.64em 50%;mask-position:-.64em 50%}}
@media (hover:hover) and (pointer:fine){
  .s-link:hover .s-txt::before{transform:scaleX(0)}
  .s-link:hover .s-txt::after{clip-path:inset(0 0 0 0);animation:flow 1.1s linear infinite}
}
.s-link:focus-visible .s-txt::before{transform:scaleX(0)}
.s-link:focus-visible .s-txt::after{clip-path:inset(0 0 0 0)}
/* once, after the intro: a wave runs along each rule in turn, so you know they're alive */
.cue .hero-sentence .s-txt::before{animation:cueRule 1500ms var(--ease-io) both;animation-delay:calc(var(--i)*220ms)}
.cue .hero-sentence .s-txt::after{animation:cueWave 1500ms var(--ease-io) both,flow 1.1s linear infinite;animation-delay:calc(var(--i)*220ms),0s}
@keyframes cueRule{0%{transform:scaleX(1);transform-origin:right}25%,72%{transform:scaleX(0);transform-origin:right}73%{transform:scaleX(0);transform-origin:left}100%{transform:scaleX(1);transform-origin:left}}
@keyframes cueWave{0%{clip-path:inset(0 100% 0 0)}28%,70%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 100%)}}
.s-link .slot{display:inline-block;margin-left:.12em;vertical-align:-.04em;transform:rotate(var(--tilt,-4deg));transition:transform 260ms var(--ease-out)}
.s-link:active .slot{transform:rotate(var(--tilt,-4deg)) scale(.94)}
.s-link:active{opacity:.85}

/* Hero size */
.hero-sentence{font-size:clamp(calc(40*var(--u)),7.2vw,calc(104*var(--u)));line-height:1.2;letter-spacing:-.03em;word-spacing:.04em}
.hero-sentence .stamp-wrap .stamp{height:.74em}
.hero-sentence .s-link{--uh:.05em}

/* hover: the hovered door lifts, the rest of the sentence steps back */
@media (hover:hover) and (pointer:fine){
  .sentence:has(.s-link:hover) .w,
  .sentence:has(.s-link:hover) .s-link:not(:hover){opacity:.38}
  .s-link:hover .slot{transform:translateY(-.08em) rotate(0deg) scale(1.1)}
}

/* stamp sizes inside the hero sentence */
.st-photo{width:1.04em}
.st-mark{width:1.04em}
/* the three founders: a small fan, every face visible, all the same size */
.st-we{position:relative;display:inline-block;width:1.56em;height:.88em;vertical-align:middle}
.st-we img{position:absolute;top:0;height:.88em;width:auto;left:var(--x);z-index:var(--z);transform:translateY(var(--y,0)) rotate(var(--r));transition:transform 420ms var(--ease-out)}
.st-we img:nth-child(1){--x:0em;--r:-9deg;--y:.03em;--z:1}
.st-we img:nth-child(2){--x:.39em;--r:-1deg;--y:-.02em;--z:2}
.st-we img:nth-child(3){--x:.78em;--r:8deg;--y:.03em;--z:3}
@media (hover:hover) and (pointer:fine){
  .s-link:hover .st-we img:nth-child(1){transform:translate(-.02em,-.04em) rotate(-10deg)}
  .s-link:hover .st-we img:nth-child(2){transform:translateY(-.1em) rotate(0deg) scale(1.04)}
  .s-link:hover .st-we img:nth-child(3){transform:translate(.16em,-.04em) rotate(11deg)}
}

/* view-transition names for the morph between big and small sentence */
.vt .p1{view-transition-name:vt-p1}.vt .p2{view-transition-name:vt-p2}.vt .p3{view-transition-name:vt-p3}.vt .p4{view-transition-name:vt-p4}
.vt .p5{view-transition-name:vt-p5}.vt .p6{view-transition-name:vt-p6}.vt .p7{view-transition-name:vt-p7}.vt .p8{view-transition-name:vt-p8}
.vt-we{view-transition-name:vt-stamp-we}.vt-brands{view-transition-name:vt-stamp-brands}.vt-stores{view-transition-name:vt-stamp-stores}.vt-me{view-transition-name:vt-stamp-me}

/* ---- Intro: stamps get stuck on, underlines get ruled in. Once per visit. */
.intro .hero-sentence .slot{opacity:0;transform:scale(1.5) rotate(-18deg)}
.intro .hero-sentence .s-txt::before{transform:scaleX(0);transform-origin:left}
.intro.go .hero-sentence .slot{animation:stampIn 560ms var(--ease-stamp) forwards;animation-delay:calc(var(--i)*190ms + 380ms)}
.intro.go .hero-sentence .s-txt::before{animation:ruleIn 520ms var(--ease-out) forwards;animation-delay:calc(var(--i)*190ms + 300ms)}
@keyframes stampIn{0%{opacity:0;transform:scale(1.5) rotate(-18deg)}35%{opacity:1}100%{opacity:1;transform:scale(1) rotate(var(--tilt,-4deg))}}
@keyframes ruleIn{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}

/* ==========================================================================
   HOME
   ========================================================================== */
.home{min-height:100svh;display:flex;flex-direction:column}
.bar{display:flex;align-items:center;justify-content:space-between;gap:calc(24*var(--u));padding-block:calc(22*var(--u))}
.home-hero{flex:1;display:flex;flex-direction:column;justify-content:center;padding-block:clamp(calc(28*var(--u)),5vh,calc(72*var(--u))) clamp(calc(36*var(--u)),6vh,calc(88*var(--u)))}
.home-hero h1{max-width:13.2em}
.hint{margin-top:clamp(calc(22*var(--u)),3.2vh,calc(40*var(--u)));display:flex;align-items:center;gap:calc(12*var(--u));font-size:calc(16*var(--u));color:var(--ink-soft)}
.hint .tick{width:calc(30*var(--u));height:calc(2.5*var(--u));background:var(--oxblood);border-radius:2px;flex:none}
.carry{border-top:1px solid var(--rule);padding-block:clamp(calc(36*var(--u)),4vw,calc(64*var(--u))) clamp(calc(56*var(--u)),6vw,calc(96*var(--u)));display:grid;gap:clamp(calc(28*var(--u)),3vw,calc(44*var(--u)))}
.carry-row{display:grid;grid-template-columns:clamp(calc(110*var(--u)),11vw,calc(160*var(--u))) minmax(0,1fr);gap:calc(20*var(--u));align-items:start}
.carry-lab{font-family:var(--display);font-weight:600;font-stretch:110%;font-size:clamp(calc(20*var(--u)),1.7vw,calc(26*var(--u)));line-height:1;letter-spacing:-.025em;color:var(--ink-soft);padding-top:calc(34*var(--u))}
.logo-grid{--perf:rgba(132,15,3,.32);display:grid;overflow:hidden;margin:0;padding:0}
.logo-grid.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.logo-grid.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.logo-grid li{position:relative}
/* perforations between cells, never on the outer edge */
.logo-grid li::before,.logo-grid li::after{content:"";position:absolute;pointer-events:none}
.logo-grid li::before{left:-2px;top:12%;bottom:12%;width:calc(3*var(--u));background:radial-gradient(circle,var(--perf) 1.15px,transparent 1.6px) center top/calc(3*var(--u)) calc(7*var(--u)) repeat-y}
.logo-grid li::after{top:-2px;left:8%;right:8%;height:calc(3*var(--u));background:radial-gradient(circle,var(--perf) 1.15px,transparent 1.6px) left center/calc(7*var(--u)) calc(3*var(--u)) repeat-x}
.logo-grid .cta-cell{grid-column:span 2}
.logo-grid .cta-cell.solo{grid-column:span 1}
.logo-grid.g5 li:nth-child(5n+1)::before,.logo-grid.g4 li:nth-child(4n+1)::before{display:none}
.logo-grid.g5 li:nth-child(-n+5)::after,.logo-grid.g4 li:nth-child(-n+4)::after{display:none}
.cell{position:relative;display:flex;align-items:center;justify-content:center;height:clamp(calc(92*var(--u)),7.8vw,calc(112*var(--u)));border-radius:calc(10*var(--u));text-decoration:none;color:var(--oxblood);transition:background-color 220ms ease}
.cell .wm{width:var(--w);max-width:76%;height:auto;aspect-ratio:var(--ar);opacity:.86;transition:opacity 220ms ease,background-color 220ms ease,transform 320ms var(--ease-out)}
/* hover: the logo lifts and turns oxblood, the Instagram handle rises in underneath */
.cell .ig{position:absolute;left:0;right:0;bottom:14%;display:flex;align-items:center;justify-content:center;gap:calc(6*var(--u));font:500 calc(13*var(--u))/1 var(--text);letter-spacing:.01em;opacity:0;transform:translateY(calc(8*var(--u)));filter:blur(2px);transition:opacity 200ms ease,transform 320ms var(--ease-out),filter 200ms ease;pointer-events:none}
.cell .ig svg{width:calc(13*var(--u));height:calc(13*var(--u));flex:none}
@media (hover:hover) and (pointer:fine){
  .cell:hover{background:rgba(251,244,236,.65)}
  .cell:hover .wm{opacity:1;background:var(--oxblood);transform:translateY(calc(-11*var(--u)))}
  .cell:hover .ig{opacity:1;transform:none;filter:none}
}
.cell:focus-visible .wm{opacity:1;background:var(--oxblood);transform:translateY(calc(-11*var(--u)))}
.cell:focus-visible .ig{opacity:1;transform:none;filter:none}
.cell:active .wm{transform:translateY(calc(-11*var(--u))) scale(.96)}
.cell.cta{flex-direction:column;gap:calc(6*var(--u));text-align:center;color:var(--ink)}
.cta-t{font-family:var(--display);font-weight:660;font-stretch:110%;font-size:clamp(calc(17*var(--u)),1.4vw,calc(21*var(--u)));letter-spacing:-.025em;color:var(--oxblood);background:linear-gradient(currentColor,currentColor) 0 100%/0% 1.5px no-repeat;padding-bottom:2px;transition:background-size 280ms var(--ease-out)}
.cta-s{font-size:calc(14*var(--u));color:var(--ink-soft)}
@media (hover:hover) and (pointer:fine){.cell.cta:hover .cta-t{background-size:100% 1.5px}}
.wm{display:block;height:var(--h,calc(22*var(--u)));aspect-ratio:var(--ar);background:var(--ink);opacity:.82;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;transition:opacity 160ms ease,background-color 160ms ease,transform 160ms var(--ease-out)}

/* ==========================================================================
   INNER PAGES
   ========================================================================== */
.hdr{position:sticky;top:0;z-index:30;background:transparent;transition:transform 300ms var(--ease-out),box-shadow 200ms ease,background-color 200ms ease}
.hdr.stuck,.hdr.open{background:var(--paper)}
.hdr.stuck{box-shadow:0 1px 0 var(--rule)}
.hdr.tucked{transform:translateY(-100%)}
.nav-toggle{display:none;align-items:center;gap:calc(8*var(--u));white-space:nowrap;min-height:calc(44*var(--u));padding:0 calc(16*var(--u));border:0;border-radius:calc(999*var(--u));background:var(--stamp);box-shadow:inset 0 0 0 1px var(--rule);color:var(--oxblood);font:600 calc(15*var(--u))/1 var(--display);font-stretch:108%;letter-spacing:-.01em;cursor:pointer;transition:transform 160ms var(--ease-out)}
.nav-toggle:active{transform:scale(.97)}
.nav-toggle svg{width:calc(12*var(--u));height:calc(12*var(--u));transition:transform 260ms var(--ease-out)}
.hdr.open .nav-toggle svg{transform:rotate(180deg)}
.nav-sheet{display:grid;grid-template-rows:0fr;transition:grid-template-rows 320ms var(--ease-out)}
.ns-clip{overflow:hidden;min-height:0}
.ns-inner{padding-block:calc(6*var(--u)) calc(26*var(--u));visibility:hidden;transition:visibility 0s linear 320ms}
.hdr.open .nav-sheet{grid-template-rows:1fr}
.hdr.open .ns-inner{visibility:visible;transition-delay:0s}
.sheetline{font-size:clamp(calc(30*var(--u)),8.4vw,calc(40*var(--u)));line-height:1.25;margin-bottom:calc(22*var(--u))}
.sheetline .w{color:#80544C}
.sheetline .s-link{--uh:.06em;--wave:var(--oxblood)}
.sheetline .stamp-wrap .stamp{height:.8em}
.top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:calc(20*var(--u)) calc(36*var(--u));padding-block:calc(20*var(--u))}
.navline .w{color:#80544C}
.navline{font-size:clamp(calc(15*var(--u)),1.25vw,calc(19*var(--u)));line-height:1.5;text-align:center;justify-self:center;max-width:none}
.navline .s-link{--uh:.07em;padding-block:.35em .12em;--wave:var(--oxblood)}
.navline .s-txt{--lift:.08em}
.navline .s-txt::after{height:.34em;bottom:calc(var(--lift) - .16em);-webkit-mask-size:8em .34em;mask-size:8em .34em}
.navline .s-link[aria-current=page]{--uh:.1em}
.navline .slot{display:none}
.navline .s-link[aria-current=page] .slot{display:inline-block;margin-left:.3em}
.navline .stamp-wrap .stamp{height:1.15em;--r:1.5px;--t:calc(5*var(--u));--pad:calc(2.5*var(--u))}
.navline .st-we{height:1.15em;width:2.05em}.navline .st-we img{height:1.15em;left:calc(var(--x) * 1.3)}

.page-hero{padding-block:clamp(calc(28*var(--u)),6vw,calc(96*var(--u))) clamp(calc(40*var(--u)),6vw,calc(96*var(--u)));display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:calc(32*var(--u)) clamp(calc(32*var(--u)),5vw,calc(96*var(--u)));align-items:end}
.page-hero .lead{margin-top:clamp(calc(20*var(--u)),2.4vw,calc(36*var(--u)))}
.hero-stamp{justify-self:end;align-self:center;font-size:clamp(calc(150*var(--u)),19vw,calc(290*var(--u)));transform:rotate(var(--tilt,4deg))}
.hero-stamp .stamp{height:1em;width:1.42em;--r:calc(5*var(--u));--t:calc(15*var(--u));--pad:calc(11*var(--u))}
.hero-stamp .stamp-wrap{filter:drop-shadow(0 calc(14*var(--u)) calc(18*var(--u)) rgba(59,10,6,.2)) drop-shadow(0 2px calc(3*var(--u)) rgba(59,10,6,.2))}

section.block{padding-block:clamp(calc(56*var(--u)),7vw,calc(120*var(--u)))}
section.block.tint{background:var(--paper-2)}
.rule-top{border-top:1px solid var(--rule)}

/* ---- WE ------------------------------------------------------------------ */
.we-hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:calc(40*var(--u)) clamp(calc(32*var(--u)),5vw,calc(96*var(--u)));align-items:end;padding-block:clamp(calc(28*var(--u)),5vw,calc(88*var(--u))) clamp(calc(48*var(--u)),6vw,calc(104*var(--u)))}
.we-intro .lead{margin-top:clamp(calc(18*var(--u)),2vw,calc(30*var(--u)))}
.founders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(calc(18*var(--u)),2.4vw,calc(40*var(--u)));align-items:start}
.founders figure{display:flex;flex-direction:column;gap:calc(18*var(--u))}
.founders .ph{display:flex;align-items:flex-end;justify-content:center;aspect-ratio:1984/2144}
.founders img{width:100%;height:auto;object-fit:contain;transform:rotate(var(--tilt));filter:drop-shadow(0 calc(10*var(--u)) calc(14*var(--u)) rgba(59,10,6,.18)) drop-shadow(0 1px 2px rgba(59,10,6,.2));transition:transform 360ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.founders figure:hover img{transform:rotate(0deg) translateY(calc(-8*var(--u)))}}
.f-name{display:block;font-family:var(--display);font-weight:680;font-stretch:110%;font-size:clamp(calc(17*var(--u)),1.45vw,calc(21*var(--u)));line-height:1.1;letter-spacing:-.025em;color:var(--ink)}
.f-line{display:block;margin-top:calc(6*var(--u));font-size:calc(15*var(--u));line-height:1.45;color:var(--ink-soft);max-width:22em}
.facts{font-family:var(--display);font-weight:660;font-stretch:110%;font-size:clamp(calc(30*var(--u)),4.6vw,calc(74*var(--u)));line-height:1.08;letter-spacing:-.04em;max-width:15em}
.facts .f{white-space:nowrap;cursor:default}
.odo{display:inline-flex;color:var(--oxblood);font-variant-numeric:tabular-nums lining-nums;vertical-align:bottom}
.dg{display:inline-block;height:1.08em;overflow:hidden}
.strip{display:flex;flex-direction:column;transform:translateY(calc((var(--d) + 10) * -1.08em))}
.strip span{display:block;height:1.08em;line-height:1.08em}
.odo.roll .strip{transition:transform var(--dur,1100ms) cubic-bezier(.16,1,.3,1)}
.odo.reset .strip{transition:none;transform:translateY(calc(var(--d) * -1.08em))}
.facts-note{margin-top:calc(28*var(--u))}
.ways{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(40*var(--u)) clamp(calc(28*var(--u)),3.5vw,calc(56*var(--u)));margin-top:clamp(calc(36*var(--u)),4vw,calc(64*var(--u)))}
.ways li{border-top:2px solid var(--ink);padding-top:calc(28*var(--u));outline:none}
.h-way{font-family:var(--display);font-weight:680;font-stretch:110%;font-size:clamp(calc(26*var(--u)),2.3vw,calc(34*var(--u)));line-height:1.04;letter-spacing:-.035em;color:var(--oxblood);margin:calc(22*var(--u)) 0 calc(18*var(--u))}
.ico{display:block;width:calc(64*var(--u));height:calc(64*var(--u));overflow:visible}
.ico .ln{fill:none;stroke:var(--oxblood);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.ico .knob,.ico .dotc{fill:var(--oxblood)}
/* first time the section is seen, each icon draws itself in */
.ways.pre .ln{stroke-dashoffset:1}
.ways.pre .knob,.ways.pre .dotc{opacity:0}
.ways.drawn .ln{transition:stroke-dashoffset 1100ms var(--ease-io);transition-delay:calc(var(--k,0) * 180ms + var(--j,0) * 90ms)}
.ways.drawn .knob,.ways.drawn .dotc{transition:opacity 300ms ease calc(var(--k,0) * 180ms + 700ms)}
.ways li:nth-child(2){--k:1}.ways li:nth-child(3){--k:2}
/* door: swings open, light spills out */
.ico-door .light{fill:var(--oxblood);opacity:0;transition:opacity 360ms ease}
.ico-door .spill{fill:var(--oxblood);opacity:0;transition:opacity 360ms ease}
.ico-door .panel{transform-box:fill-box;transform-origin:left center;transition:transform 520ms var(--ease-out)}
/* chart: bars climb, heart beats */
.ico-chart .bar{transform-box:fill-box;transform-origin:bottom center;transition:transform 520ms var(--ease-out)}
.ico-chart .b2{transition-delay:70ms}.ico-chart .b3{transition-delay:140ms}
.ico-chart .heart{transform-box:fill-box;transform-origin:center}
/* table: the three chairs pull in */
.ico-table .chair{transition:transform 420ms var(--ease-out)}
.ico-table .c2{transition-delay:60ms}.ico-table .c3{transition-delay:120ms}
@keyframes climb{0%{transform:scaleY(.2)}100%{transform:scaleY(1)}}
@keyframes beat{0%,100%{transform:scale(1)}20%{transform:scale(1.22)}40%{transform:scale(.96)}60%{transform:scale(1.12)}}
.ways p{font-size:calc(17*var(--u))}
.ways p+p{margin-top:.75em}
/* contact */
.contact{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:calc(40*var(--u)) clamp(calc(40*var(--u)),6vw,calc(120*var(--u)));align-items:start}
.contact .lead{margin-top:calc(20*var(--u))}
.contact .small{margin-top:calc(24*var(--u))}
.form{display:grid;grid-template-columns:1fr 1fr;gap:calc(18*var(--u)) calc(20*var(--u))}
.form .full{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:calc(8*var(--u));font-size:calc(15*var(--u));font-weight:500}
.field .req{color:var(--oxblood)}
.field .lbl{display:flex;gap:calc(8*var(--u));align-items:baseline}
.who{border:0;padding:0;margin:0 0 calc(4*var(--u));display:flex;flex-wrap:wrap;gap:calc(8*var(--u))}
.who-opt,.tick-chip{position:relative;display:inline-flex;cursor:pointer}
.who-opt input,.tick-chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.who-opt span{display:inline-flex;align-items:center;min-height:calc(46*var(--u));padding:0 calc(20*var(--u));border-radius:calc(999*var(--u));box-shadow:inset 0 0 0 1.5px var(--rule);font:600 calc(16*var(--u))/1 var(--text);transition:background-color 180ms ease,color 180ms ease,box-shadow 180ms ease}
.who-opt input:checked+span{background:var(--oxblood);color:var(--stamp);box-shadow:none}
.who-opt input:focus-visible+span,.tick-chip input:focus-visible+span{outline:2px solid var(--oxblood);outline-offset:calc(3*var(--u))}
.interest{border:0;padding:0;margin:0}
.ticks{display:flex;flex-wrap:wrap;gap:calc(8*var(--u));margin-top:2px}
.tick-chip span{display:inline-flex;align-items:center;gap:calc(8*var(--u));min-height:calc(40*var(--u));padding:0 calc(14*var(--u));border-radius:calc(999*var(--u));background:var(--stamp);box-shadow:inset 0 0 0 1px var(--rule);font:500 calc(15*var(--u))/1 var(--text);transition:background-color 160ms ease,color 160ms ease}
.tick-chip span::before{content:"";width:calc(14*var(--u));height:calc(14*var(--u));border-radius:calc(4*var(--u));box-shadow:inset 0 0 0 1.5px currentColor;opacity:.5;transition:all 160ms ease}
.tick-chip input:checked+span{background:var(--ink);color:var(--stamp)}
.tick-chip input:checked+span::before{opacity:1;background:var(--stamp) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7.2 6 9.6l4.5-5' fill='none' stroke='%233B0A06' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat;box-shadow:none}
.err{min-height:0;font-size:calc(14*var(--u));font-weight:500;color:var(--oxblood)}
.err:empty{display:none}
.field.bad input{border-color:var(--oxblood);background:#FFF2EE}
[data-for][hidden]{display:none!important}
.field .opt{font-weight:400;color:var(--ink-soft)}
.field input{font:400 calc(18*var(--u))/1.3 var(--text);color:var(--ink);background:var(--stamp);border:1.5px solid transparent;border-radius:calc(10*var(--u));padding:calc(14*var(--u)) calc(16*var(--u));min-height:calc(52*var(--u));width:100%;box-shadow:inset 0 0 0 1px var(--rule);transition:border-color 160ms ease,box-shadow 160ms ease}
.field input::placeholder{color:#82564D}
.field input:focus{outline:none;border-color:var(--oxblood);box-shadow:none}
.field input:user-invalid{border-color:var(--oxblood);background:#FFF0EC}
.form-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:calc(16*var(--u)) calc(24*var(--u));margin-top:calc(6*var(--u))}
.form-foot p{font-size:calc(14*var(--u));color:var(--ink-soft);max-width:30em}
.sent{display:none;grid-column:1/-1;background:var(--stamp);border-radius:calc(14*var(--u));padding:calc(28*var(--u));box-shadow:inset 0 0 0 1px var(--rule)}
.sent{position:relative}
.sent-pm{position:absolute;top:calc(-26*var(--u));right:calc(-12*var(--u));width:calc(170*var(--u));color:var(--oxblood);opacity:0;transform:rotate(-12deg)}
.sent-pm .pm-w{display:none}
.form.is-sent .sent-pm{animation:thunk 480ms var(--ease-stamp) 160ms forwards}
.sent h3{font-family:var(--display);font-weight:680;font-stretch:110%;font-size:calc(30*var(--u));letter-spacing:-.03em;line-height:1.05;color:var(--oxblood);margin-bottom:calc(10*var(--u))}
.form.is-sent>*:not(.sent){display:none}
.form.is-sent .sent{display:block;animation:rise 360ms var(--ease-out)}
.form.is-sending button[type=submit]{opacity:.6;pointer-events:none}
@keyframes rise{from{opacity:0;transform:translateY(calc(8*var(--u)))}to{opacity:1;transform:none}}

/* ---- BRANDS -------------------------------------------------------------- */
.brands-wrap{display:grid;grid-template-columns:calc(220*var(--u)) minmax(0,1fr);gap:clamp(calc(32*var(--u)),5vw,calc(96*var(--u)));padding-bottom:clamp(calc(56*var(--u)),7vw,calc(120*var(--u)))}
.b-index{position:sticky;z-index:5;top:calc(var(--hdr-offset,0px) + calc(28*var(--u)));transition:top 300ms var(--ease-out);align-self:start;display:flex;flex-direction:column;gap:2px}
.b-index a{display:flex;align-items:center;gap:calc(12*var(--u));min-height:calc(44*var(--u));font-family:var(--display);font-weight:600;font-stretch:108%;font-size:calc(21*var(--u));letter-spacing:-.025em;color:var(--ink-soft);text-decoration:none;transition:color 200ms ease}
.b-index a::before{content:"";width:0;height:2px;background:var(--oxblood);transition:width 260ms var(--ease-out)}
.b-index a[aria-current=true]{color:var(--oxblood)}
.b-index a[aria-current=true]::before{width:calc(22*var(--u))}
@media (hover:hover) and (pointer:fine){.b-index a:hover{color:var(--oxblood)}}
.brand{scroll-margin-top:calc(24*var(--u));padding-bottom:clamp(calc(64*var(--u)),8vw,calc(128*var(--u)))}
.brand+.brand{border-top:1px solid var(--rule);padding-top:clamp(calc(40*var(--u)),5vw,calc(72*var(--u)))}
.brand-photo{position:relative;aspect-ratio:3/2;background:var(--paper-2);border-radius:calc(3*var(--u))}
.bp-link{display:block;width:100%;height:100%;overflow:hidden;border-radius:calc(3*var(--u))}
.brand-photo img,.bp-photo img{width:100%;height:100%;object-fit:cover}
.detail{position:absolute;right:clamp(calc(-28*var(--u)),-1.6vw,calc(-14*var(--u)));bottom:clamp(calc(-30*var(--u)),-2vw,calc(-18*var(--u)));font-size:clamp(calc(96*var(--u)),10vw,calc(148*var(--u)));transform:rotate(5deg);transition:transform 380ms var(--ease-out);z-index:2}
.detail .stamp{height:1.25em;width:1em;--r:calc(3.5*var(--u));--t:calc(11*var(--u));--pad:calc(7*var(--u))}
.detail .stamp-wrap{filter:drop-shadow(0 calc(10*var(--u)) calc(14*var(--u)) rgba(59,10,6,.25)) drop-shadow(0 1px 2px rgba(59,10,6,.25))}
@media (hover:hover) and (pointer:fine){.detail:hover{transform:rotate(0deg) translateY(calc(-8*var(--u))) scale(1.35)}}
.detail:active{transform:rotate(0deg) scale(.96)}
.brand-name a{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0% .05em no-repeat;transition:background-size 300ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.brand-name a:hover{background-size:100% .05em}}
.more{margin-top:calc(18*var(--u));font-size:calc(16*var(--u))}
.b-index a{position:relative}
.bi-thumb{position:absolute;left:calc(100% + calc(10*var(--u)));top:50%;width:calc(64*var(--u));aspect-ratio:3/2;border-radius:calc(3*var(--u));overflow:hidden;opacity:0;transform:translate(calc(-6*var(--u)),-50%) scale(.92) rotate(-3deg);transition:opacity 180ms ease,transform 260ms var(--ease-out);pointer-events:none;box-shadow:0 calc(6*var(--u)) calc(14*var(--u)) calc(-6*var(--u)) rgba(59,10,6,.4)}
.bi-thumb img{width:100%;height:100%;object-fit:cover}
@media (hover:hover) and (pointer:fine){.b-index a:hover .bi-thumb{opacity:1;transform:translate(0,-50%) scale(1) rotate(-3deg)}}
.brand-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(24*var(--u)) clamp(calc(28*var(--u)),4vw,calc(64*var(--u)));margin-top:clamp(calc(24*var(--u)),3vw,calc(40*var(--u)))}
.brand-name{font-family:var(--display);font-weight:720;font-stretch:112%;font-size:clamp(calc(42*var(--u)),4.8vw,calc(76*var(--u)));line-height:.92;letter-spacing:-.045em;color:var(--oxblood)}
.brand-kind{margin-top:calc(12*var(--u));font-size:calc(16*var(--u));color:var(--ink-soft)}
.brand-links{display:flex;flex-wrap:wrap;gap:calc(6*var(--u)) calc(22*var(--u));margin-top:calc(22*var(--u));font-size:calc(16*var(--u))}
.brand-links a{min-height:calc(44*var(--u));display:inline-flex;align-items:center}
.why{margin-top:calc(22*var(--u));padding-top:calc(18*var(--u));border-top:1px solid var(--rule)}
.why b{display:block;font-weight:600;font-size:calc(15*var(--u));margin-bottom:calc(6*var(--u))}
.vacancy{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(calc(28*var(--u)),4vw,calc(64*var(--u)));align-items:center;background:var(--paper-2);border-radius:calc(20*var(--u));padding:clamp(calc(28*var(--u)),4vw,calc(56*var(--u)))}
.empty-stamp{font-size:clamp(calc(120*var(--u)),13vw,calc(190*var(--u)));transform:rotate(-5deg)}
.empty-stamp .stamp{height:1em;width:.82em;--r:calc(4*var(--u));--t:calc(13*var(--u));--pad:calc(9*var(--u))}
.empty-stamp .stamp-face{background:transparent;display:grid;place-items:center;box-shadow:inset 0 0 0 2px var(--rule);outline:2px dashed rgba(132,15,3,.45);outline-offset:calc(-12*var(--u))}
.empty-stamp .stamp-face span{font-family:var(--display);font-weight:680;font-stretch:110%;font-size:calc(18*var(--u));line-height:1;color:var(--oxblood);text-align:center;letter-spacing:-.01em}
.vacancy .lead{margin-top:calc(14*var(--u))}
.vacancy .btn{margin-top:calc(24*var(--u))}

/* ---- BRAND PAGE --------------------------------------------------------- */
.bp-hero{padding-block:clamp(calc(16*var(--u)),2.5vw,calc(40*var(--u))) clamp(calc(48*var(--u)),6vw,calc(96*var(--u)))}
.back{font-size:calc(16*var(--u));margin-bottom:calc(18*var(--u))}
.bp-photo{aspect-ratio:16/9;border-radius:calc(4*var(--u));overflow:hidden;background:var(--paper-2)}
.bp-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:calc(24*var(--u)) clamp(calc(32*var(--u)),5vw,calc(96*var(--u)));margin-top:clamp(calc(28*var(--u)),3.5vw,calc(56*var(--u)))}
.bp-head .brand-name{font-size:clamp(calc(52*var(--u)),7vw,calc(120*var(--u)))}
.bp-gallery{display:flex;gap:clamp(calc(12*var(--u)),1.4vw,calc(22*var(--u)));padding-bottom:clamp(calc(56*var(--u)),7vw,calc(112*var(--u)))}
.bp-gallery figure{flex:var(--ar) 1 0%;aspect-ratio:var(--ar);border-radius:calc(4*var(--u));overflow:hidden;background:var(--paper-2)}
.bp-gallery img{width:100%;height:100%;object-fit:cover}
.bp-next{padding-block:clamp(calc(40*var(--u)),5vw,calc(80*var(--u)))}
.bp-next a{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:calc(6*var(--u)) calc(24*var(--u));align-items:center;text-decoration:none;color:var(--ink);border-top:2px solid var(--ink);padding-top:calc(24*var(--u))}
.bn-k{font-size:calc(15*var(--u));color:var(--ink-soft)}
.bn-name{grid-row:2;font-family:var(--display);font-weight:720;font-stretch:112%;font-size:clamp(calc(40*var(--u)),6vw,calc(96*var(--u)));line-height:.95;letter-spacing:-.045em;color:var(--oxblood)}
.bn-stamp{grid-column:2;grid-row:1/3;font-size:clamp(calc(70*var(--u)),8vw,calc(120*var(--u)));transform:rotate(-5deg);transition:transform 380ms var(--ease-out)}
.bn-stamp .stamp{height:.8em;width:1.2em;--r:calc(3*var(--u));--t:calc(10*var(--u));--pad:calc(6*var(--u))}
@media (hover:hover) and (pointer:fine){.bp-next a:hover .bn-stamp{transform:rotate(0deg) translateX(calc(-10*var(--u))) scale(1.06)}.bp-next a:hover .bn-name{text-decoration:underline;text-decoration-thickness:.04em;text-underline-offset:.12em}}

/* ---- STORES -------------------------------------------------------------- */
.filter{display:flex;flex-wrap:wrap;gap:calc(8*var(--u));margin-bottom:calc(28*var(--u))}
.chip{min-height:calc(44*var(--u));padding:0 calc(18*var(--u));border-radius:calc(999*var(--u));border:0;background:transparent;box-shadow:inset 0 0 0 1.5px var(--rule);font:500 calc(16*var(--u))/1 var(--text);color:var(--ink);cursor:pointer;transition:background-color 160ms ease,color 160ms ease,box-shadow 160ms ease,transform 160ms var(--ease-out)}
.chip:active{transform:scale(.97)}
.chip[aria-pressed=true]{background:var(--oxblood);color:var(--stamp);box-shadow:none}
.chip .n{font-size:calc(12*var(--u));font-weight:600;opacity:.6;margin-left:calc(3*var(--u));font-variant-numeric:tabular-nums}
.city-link{color:inherit;text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:.07em;text-underline-offset:.18em;transition:text-decoration-color 200ms ease,color 200ms ease}
@media (hover:hover) and (pointer:fine){.city-link:hover{color:var(--oxblood);text-decoration-color:currentColor}}
::view-transition-group(*.store){animation-duration:300ms;animation-timing-function:var(--ease-out)}
::view-transition-old(*.store),::view-transition-new(*.store){animation-duration:200ms}
@media (hover:hover) and (pointer:fine){.chip:not([aria-pressed=true]):hover{box-shadow:inset 0 0 0 1.5px var(--oxblood)}}
.count{font-size:calc(15*var(--u));color:var(--ink-soft);margin:calc(-12*var(--u)) 0 calc(20*var(--u))}
.stores{border-top:2px solid var(--ink)}
.store{display:grid;grid-template-columns:calc(260*var(--u)) minmax(0,1fr) auto;gap:calc(16*var(--u)) calc(40*var(--u));align-items:center;padding:calc(30*var(--u)) calc(8*var(--u));border-bottom:1px solid var(--rule);transition:background-color 200ms ease}
.store[hidden]{display:none}
@media (hover:hover) and (pointer:fine){.store:hover{background:rgba(251,244,236,.5)}.store:hover .wm{background:var(--oxblood)}}
.store-mark{margin:0;display:flex;align-items:center;height:calc(56*var(--u))}
.store-mark .wm{width:var(--w);height:auto;aspect-ratio:var(--ar);opacity:1;max-width:100%}
.store .where{font-family:var(--display);font-weight:600;font-stretch:108%;font-size:clamp(calc(19*var(--u)),1.6vw,calc(23*var(--u)));line-height:1.25;letter-spacing:-.02em;color:var(--ink)}
.store .links{display:flex;gap:calc(6*var(--u)) calc(22*var(--u));font-size:calc(16*var(--u))}
.store .links a{min-height:calc(44*var(--u));display:inline-flex;align-items:center}

/* ---- MIDDLE-EAST --------------------------------------------------------- */
.me{display:grid;grid-template-columns:minmax(calc(330*var(--u)),calc(400*var(--u))) minmax(0,1fr);grid-template-areas:'head head' 'card map';gap:clamp(calc(28*var(--u)),3vw,calc(48*var(--u))) clamp(calc(28*var(--u)),4vw,calc(72*var(--u)));align-items:start;padding-block:clamp(calc(28*var(--u)),5vw,calc(80*var(--u))) clamp(calc(56*var(--u)),7vw,calc(120*var(--u)))}
.me-head{grid-area:head;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:calc(24*var(--u)) clamp(calc(32*var(--u)),5vw,calc(96*var(--u)));align-items:end}
.me .h-page{font-size:clamp(calc(60*var(--u)),8.6vw,calc(150*var(--u)))}
.me .lead{margin-top:0;padding-bottom:.6em}
.city-chips{grid-area:chips;display:none;flex-wrap:wrap;gap:calc(8*var(--u))}

/* the city card is a postcard: unicorn stamp in the corner, cancelled with that city's postmark */
.pc-handle{display:none}
.pc-link{display:inline-block;margin-top:calc(10*var(--u));font-size:calc(15*var(--u))}
.postcard{grid-area:card;position:sticky;top:calc(var(--hdr-offset,0px) + calc(24*var(--u)));transition:top 300ms var(--ease-out);background:var(--stamp);border-radius:calc(6*var(--u));padding:clamp(calc(24*var(--u)),2.4vw,calc(34*var(--u)));box-shadow:0 1px 0 rgba(59,10,6,.06),0 calc(18*var(--u)) calc(40*var(--u)) calc(-22*var(--u)) rgba(59,10,6,.4);color:var(--ink)}
.postcard::before{content:"";position:absolute;inset:calc(8*var(--u));border:1px solid var(--rule);border-radius:calc(3*var(--u));pointer-events:none}
.pc-corner{position:absolute;top:calc(18*var(--u));right:calc(18*var(--u));width:calc(72*var(--u))}
.pc-stamp{width:calc(64*var(--u));height:auto;margin-left:auto;transform:rotate(4deg);filter:drop-shadow(0 2px calc(3*var(--u)) rgba(59,10,6,.2))}
.pc-pm{position:absolute;color:var(--oxblood);opacity:.82;transform:rotate(-11deg);mix-blend-mode:multiply}
.pc-pm .pm-w{display:none}
.pc-pm.thunk{animation:thunk 420ms var(--ease-stamp)}
@keyframes thunk{0%{opacity:0;transform:rotate(calc(var(--rot,-11deg) - 13deg)) scale(1.45)}40%{opacity:.9}100%{opacity:.86;transform:rotate(var(--rot,-11deg)) scale(1)}}
.postcard h2{font-family:var(--display);font-weight:720;font-stretch:112%;font-size:clamp(calc(34*var(--u)),3.1vw,calc(48*var(--u)));line-height:.95;letter-spacing:-.04em;color:var(--oxblood);max-width:calc(100% - calc(96*var(--u)));position:relative}
.postcard .country{margin-top:calc(8*var(--u));font-size:calc(15*var(--u));color:var(--ink-soft)}
.pc-facts{display:grid;grid-template-columns:1fr 1fr;gap:calc(12*var(--u));margin:calc(24*var(--u)) 0 calc(4*var(--u));padding:calc(16*var(--u)) 0;border-block:1px solid var(--rule)}
.pc-facts dt{font-size:calc(13*var(--u));color:var(--ink-soft)}
.pc-facts dd{margin:2px 0 0;font-family:var(--display);font-weight:660;font-stretch:110%;font-size:calc(25*var(--u));line-height:1.1;letter-spacing:-.03em}
.postcard h3{margin-top:calc(20*var(--u));font-size:calc(14*var(--u));font-weight:600}
.postcard ul{margin-top:calc(6*var(--u))}
.postcard li{padding:calc(7*var(--u)) 0;border-bottom:1px solid var(--rule);font-size:calc(17*var(--u))}
.postcard li:last-child{border-bottom:0}
.postcard .none{margin-top:calc(6*var(--u));color:var(--ink-soft)}
.postcard .eat{margin-top:calc(6*var(--u));font-family:var(--display);font-weight:560;font-stretch:104%;font-size:calc(19*var(--u));line-height:1.3;letter-spacing:-.015em}
.city-body{position:relative;transition:opacity 200ms ease,filter 200ms ease}
.city-body.swap{opacity:0;filter:blur(calc(3*var(--u)))}

/* the map is printed on a big stamp */
.map-stamp{grid-area:map;transform:rotate(.6deg)}
.map-stamp .stamp-wrap{display:block;filter:drop-shadow(0 calc(18*var(--u)) calc(24*var(--u)) rgba(59,10,6,.18)) drop-shadow(0 2px calc(3*var(--u)) rgba(59,10,6,.18))}
.map-paper{display:block;width:100%;--r:calc(5*var(--u));--t:calc(15*var(--u));--pad:calc(16*var(--u))}
.map-inner{position:relative;display:block;aspect-ratio:1000/702;overflow:hidden;background:#EBD4C7}
.chart{position:absolute;inset:0;display:block;width:100%;height:100%}
.chart .sea{fill:#EBD4C7}
.chart .grat{stroke:var(--oxblood);stroke-opacity:.09;stroke-width:.6}
.chart .wl{fill:none;stroke:var(--oxblood);stroke-width:.7}
.chart .wl0{stroke-opacity:.34}.chart .wl1{stroke-opacity:.22}.chart .wl2{stroke-opacity:.14}.chart .wl3{stroke-opacity:.08}
.chart .land-other{fill:#F2E4DB}
.chart .land-hatch{fill:url(#hatch)}
.chart .hatch-line{stroke:var(--oxblood);stroke-opacity:.13;stroke-width:1}
.chart .land-gcc{fill:var(--stamp)}
.chart .coast{fill:none;stroke:var(--oxblood);stroke-width:1.1;stroke-linejoin:round}
.chart .border{fill:none;stroke:var(--oxblood);stroke-opacity:.55;stroke-width:.9;stroke-dasharray:4 3}
.chart text{font-family:var(--display);font-weight:620;font-stretch:112%;letter-spacing:-.01em;fill:var(--ink-soft)}
.chart .lb-country{font-size:calc(16*var(--u));text-anchor:middle}
.chart .lb-big{font-size:calc(25*var(--u));letter-spacing:-.02em}
.chart .lb-sm{font-size:calc(13*var(--u))}
.chart .lb-other{font-size:calc(13.5*var(--u));text-anchor:middle;fill:#9A6E66}
.chart .lb-sea{font-family:var(--text);font-size:calc(10.5*var(--u));font-weight:600;letter-spacing:.24em;text-transform:uppercase;text-anchor:middle;fill:var(--oxblood);fill-opacity:.55}
.chart .lb-grat{font-family:var(--text);font-size:calc(9.5*var(--u));fill:var(--oxblood);fill-opacity:.45}
.chart .lb-ref{font-family:var(--text);font-size:calc(11*var(--u));font-weight:500;fill:#9A6E66}
.chart .ref-dot{fill:#9A6E66}
.chart .frame-line{fill:none;stroke:var(--oxblood);stroke-width:1.2}
/* airmail routes: oxblood and rust dashes, like a par avion envelope */
.chart .route path{fill:none;stroke-width:2.2;stroke-dasharray:7 7}
.chart .r-a{stroke:var(--oxblood)}.chart .r-b{stroke:var(--rust);stroke-dashoffset:7}
.chart .r-base{opacity:.22;transition:opacity 220ms ease}
.chart .r-live{opacity:0}
.chart .route.is-hover .r-base{opacity:.55}
.chart .route.is-on .r-live{opacity:1}
.chart .route.is-on .r-base{opacity:0}
.chart .reveal{fill:none;stroke:#fff;stroke-width:10;stroke-dasharray:1;stroke-dashoffset:0}
.chart .route.is-on.draw .reveal{animation:reveal 900ms var(--ease-io) both}
@keyframes reveal{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.map-stamp.is-home .r-base{opacity:.5}

.pin{position:absolute;left:var(--x);top:var(--y);display:flex;align-items:center;gap:calc(7*var(--u));padding:0;border:0;background:none;cursor:pointer;font:600 calc(13.5*var(--u))/1 var(--text);color:var(--ink);-webkit-tap-highlight-color:transparent}
.pin::before{content:"";position:absolute;left:calc(-14*var(--u));top:50%;width:calc(44*var(--u));height:calc(44*var(--u));margin-top:calc(-22*var(--u));border-radius:50%}
.pin .dot{position:relative;width:calc(14*var(--u));height:calc(14*var(--u));border-radius:50%;background:var(--stamp);box-shadow:0 0 0 2px var(--oxblood);transition:transform 220ms var(--ease-out),background-color 200ms ease;flex:none}
.pin .dot::after{content:"";position:absolute;inset:calc(4*var(--u));border-radius:50%;background:var(--oxblood);transition:transform 220ms var(--ease-out)}
.pin .tag{padding:calc(5*var(--u)) calc(8*var(--u));border-radius:calc(999*var(--u));white-space:nowrap;text-shadow:0 0 calc(3*var(--u)) var(--stamp),0 0 calc(3*var(--u)) var(--stamp),0 0 calc(6*var(--u)) var(--stamp);transition:background-color 200ms ease,color 200ms ease}
.pin[data-side=right]{transform:translate(calc(-7*var(--u)),-50%)}
.pin[data-side=left]{flex-direction:row-reverse;transform:translate(calc(-100% + calc(7*var(--u))),-50%)}
.pin[data-side=below]{flex-direction:column;gap:2px;transform:translate(-50%,calc(-7*var(--u)))}
.pin[aria-pressed=true] .dot{transform:scale(1.3);background:var(--oxblood)}
.pin[aria-pressed=true] .dot::after{background:var(--stamp);transform:scale(.6)}
.pin[aria-pressed=true] .tag{background:var(--oxblood);color:var(--stamp);text-shadow:none}
@media (hover:hover) and (pointer:fine){.pin:hover .dot{transform:scale(1.25)}.pin:not([aria-pressed=true]):hover .tag{color:var(--oxblood)}}

.rts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:calc(40*var(--u)) clamp(calc(40*var(--u)),6vw,calc(120*var(--u)));align-items:center;padding-block:clamp(calc(48*var(--u)),8vw,calc(140*var(--u)))}
.rts-stamp{position:relative;width:clamp(calc(150*var(--u)),18vw,calc(250*var(--u)))}
.rts-stamp img{width:100%;height:auto;transform:rotate(-6deg);filter:drop-shadow(0 calc(14*var(--u)) calc(20*var(--u)) rgba(59,10,6,.22))}
.rts-pm{position:absolute;left:40%;top:50%;width:150%;color:var(--oxblood);opacity:.85;transform:rotate(-14deg);mix-blend-mode:multiply}
.rts-pm .pm-w{display:none}
.rts-copy .lead{margin-top:calc(22*var(--u))}
.rts-links{display:flex;flex-wrap:wrap;align-items:center;gap:calc(16*var(--u)) calc(28*var(--u));margin-top:calc(30*var(--u));font-size:calc(17*var(--u))}

/* ---- LEGAL --------------------------------------------------------------- */
.legal{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:calc(32*var(--u)) clamp(calc(32*var(--u)),6vw,calc(120*var(--u)));padding-block:clamp(calc(28*var(--u)),5vw,calc(80*var(--u))) clamp(calc(56*var(--u)),7vw,calc(120*var(--u)))}
.legal .h-page{font-size:clamp(calc(56*var(--u)),7vw,calc(120*var(--u)))}
.legal h2{font-family:var(--display);font-weight:680;font-stretch:110%;font-size:calc(23*var(--u));letter-spacing:-.025em;margin:calc(36*var(--u)) 0 calc(10*var(--u));color:var(--oxblood)}
.legal h2:first-child{margin-top:0}
.legal p{max-width:38em}
.legal p+p{margin-top:.7em}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.foot{--f-bg:var(--oxblood);--f-text:var(--paper);--f-soft:rgba(238,220,209,.72);--f-rule:rgba(238,220,209,.24);--f-link:var(--stamp);--f-wave:var(--gold);--f-word-a:var(--paper);--f-word-b:var(--gold);--f-btn:var(--stamp);--f-btn-ink:var(--oxblood)}
.foot-navy{--f-bg:#0A0A29;--f-text:#EEDCD1;--f-soft:rgba(205,192,150,.78);--f-rule:rgba(205,192,150,.25);--f-link:#FBF4EC;--f-wave:#CDC096;--f-word-a:#CDC096;--f-word-b:#BA7D32;--f-btn:#CDC096;--f-btn-ink:#0A0A29}
.foot{background:var(--f-bg);color:var(--f-text);padding-block:clamp(calc(48*var(--u)),6vw,calc(96*var(--u))) calc(28*var(--u));overflow:hidden}
.foot ::selection{background:var(--stamp);color:var(--oxblood)}
.foot :focus-visible{outline-color:var(--stamp)}
.foot .sentence{font-size:clamp(calc(30*var(--u)),4vw,calc(62*var(--u)));line-height:1.28;color:var(--paper);max-width:16em}
.foot .sentence .w{color:var(--f-soft)}
.foot .s-link{color:var(--f-link);--wave:var(--f-wave)}
.foot .slot{display:none}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:calc(40*var(--u));margin-top:clamp(calc(48*var(--u)),6vw,calc(88*var(--u)));padding-top:calc(32*var(--u));border-top:1px solid var(--f-rule)}
.foot h2{font-family:var(--display);font-weight:660;font-stretch:110%;font-size:clamp(calc(24*var(--u)),2vw,calc(32*var(--u)));line-height:1.1;letter-spacing:-.03em;max-width:12em}
.foot .btn{margin-top:calc(22*var(--u))}
.foot h3{font-size:calc(14*var(--u));font-weight:600;color:var(--f-soft);margin-bottom:calc(10*var(--u))}
.foot li a{display:inline-flex;align-items:center;min-height:calc(40*var(--u));color:var(--paper);text-decoration:none;font-size:calc(17*var(--u));background:linear-gradient(currentColor,currentColor) 0 calc(100% - calc(8*var(--u)))/0% 1.5px no-repeat;transition:background-size 240ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.foot li a:hover{background-size:100% 1.5px}}
.foot-base{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:calc(28*var(--u));margin-top:clamp(calc(56*var(--u)),7vw,calc(110*var(--u)))}
.foot-mark{display:flex;align-items:center;gap:clamp(calc(18*var(--u)),2.4vw,calc(36*var(--u)))}
.fm-stamp{position:relative;flex:none;width:clamp(calc(78*var(--u)),8.4vw,calc(124*var(--u)));line-height:0}
.fm-stamp img{width:100%;height:auto;transform:rotate(-6deg);filter:drop-shadow(0 calc(6*var(--u)) calc(10*var(--u)) rgba(0,0,0,.25))}
.foot-mark.pre .fm-stamp img{opacity:0}
.foot-mark.pre .lk-waves{clip-path:inset(0 100% 0 0)}
.foot-mark.drop .fm-stamp img{animation:drop 820ms var(--ease-out) both}
.foot-mark.drop .lk-waves{clip-path:inset(0 0 0 0);transition:clip-path 700ms var(--ease-out) 560ms}
@keyframes drop{0%{opacity:0;transform:translateY(calc(-180*var(--u))) rotate(-32deg) scale(1.22)}40%{opacity:1}60%{transform:translateY(calc(6*var(--u))) rotate(-3deg) scale(.96)}78%{transform:translateY(calc(-3*var(--u))) rotate(-7deg) scale(1.01)}100%{opacity:1;transform:rotate(-6deg)}}
.fm-words{display:flex;flex-direction:column;gap:calc(12*var(--u));width:clamp(calc(220*var(--u)),34vw,calc(520*var(--u)))}
.fm-words svg{width:100%;height:auto}
.fm-words .lg-a{fill:var(--f-word-a)}.fm-words .lg-b{fill:var(--f-word-b)}
.fm-words .lk-dist{color:var(--paper);font-size:clamp(calc(20*var(--u)),2.9vw,calc(46*var(--u)))}
.fm-words .lk-waves{background:var(--paper);opacity:.55;font-size:clamp(calc(20*var(--u)),2.9vw,calc(46*var(--u)))}
.fm-words .lk-sub{gap:clamp(calc(10*var(--u)),1.2vw,calc(18*var(--u)))}
.foot-legal{font-size:calc(14*var(--u));color:var(--f-soft);text-align:right;line-height:1.6}

/* ==========================================================================
   VIEW TRANSITIONS (cross-document, progressive)
   ========================================================================== */
@view-transition{navigation:auto}
::view-transition-group(*){animation-duration:460ms;animation-timing-function:var(--ease-io)}
::view-transition-old(root){animation:220ms ease both vt-out}
::view-transition-new(root){animation:320ms var(--ease-out) 80ms both vt-in}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0;transform:translateY(calc(10*var(--u)))}}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1080px){
  .top{grid-template-columns:auto auto;justify-content:space-between}
  .top>.nav-full{grid-column:1/-1;grid-row:2;justify-self:start}
  .navline{text-align:left;font-size:calc(20*var(--u));line-height:1.75}
  .brands-wrap{grid-template-columns:1fr}
  .b-index{position:sticky;top:0;z-index:5;flex-direction:row;gap:calc(4*var(--u)) calc(22*var(--u));overflow-x:auto;margin-inline:calc(var(--gutter)*-1);padding:calc(6*var(--u)) var(--gutter);background:var(--paper);border-bottom:1px solid var(--rule);scrollbar-width:none}
  .b-index::-webkit-scrollbar{display:none}
  .b-index a{font-size:calc(20*var(--u));white-space:nowrap}
  .b-index a::before{display:none}
  .brand{scroll-margin-top:calc(72*var(--u))}
  .contact,.legal{grid-template-columns:1fr}
  .me{grid-template-columns:1fr;grid-template-areas:'head' 'chips' 'map' 'card'}
  .me-head{grid-template-columns:1fr}
  .postcard{position:relative;top:0}
  .city-chips{display:flex}
  .map-stamp{transform:none}
}
@media (max-width:860px){
  .top{grid-template-columns:auto auto;justify-content:space-between;padding-block:calc(12*var(--u))}
  .top>.nav-full,.top>.top-cta{display:none}
  .nav-toggle{display:inline-flex}
  .bp-head{grid-template-columns:1fr}
  .bp-gallery{flex-direction:column}
  .bp-gallery figure{flex:none;width:100%}
  .rts{grid-template-columns:1fr}
  /* the postcard docks to the bottom of the screen while the map is in view */
  .me .postcard{position:sticky;top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + calc(10*var(--u)));z-index:6;padding-top:calc(8*var(--u));max-height:72vh;overflow:auto;overscroll-behavior:contain;box-shadow:0 calc(-10*var(--u)) calc(30*var(--u)) calc(-12*var(--u)) rgba(59,10,6,.35),0 1px 0 rgba(59,10,6,.06)}
  .pc-handle{display:flex;flex-direction:column;align-items:center;gap:calc(6*var(--u));width:100%;min-height:calc(44*var(--u));margin:0 0 calc(6*var(--u));padding:calc(4*var(--u)) 0 calc(6*var(--u));border:0;background:none;cursor:grab;touch-action:none;font:600 calc(13*var(--u))/1 var(--text);color:var(--ink-soft)}
  .pc-handle .grab{width:calc(40*var(--u));height:calc(4*var(--u));border-radius:2px;background:var(--rule)}
  .pc-handle{align-items:flex-start;padding-left:calc(4*var(--u))}
  .pc-handle .grab{align-self:center}
  .postcard:not(.open) .pc-more{display:none}
  .detail{right:calc(10*var(--u));bottom:calc(-22*var(--u))}
  .page-hero{grid-template-columns:1fr;align-items:start}
  .hero-stamp{justify-self:start;font-size:clamp(calc(120*var(--u)),36vw,calc(200*var(--u)));order:-1}
  .ways{grid-template-columns:1fr}
  .we-hero{grid-template-columns:1fr;align-items:start}
  .h-way br{display:none}
  .brand-body{grid-template-columns:1fr}
  .store{grid-template-columns:1fr;gap:calc(10*var(--u));padding:calc(22*var(--u)) 0}
  .store-mark{height:calc(48*var(--u))}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid>div:first-child{grid-column:1/-1}
  .foot-legal{text-align:left}
  .vacancy{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:calc(17*var(--u))}
  .hero-sentence{font-size:10.4vw;line-height:1.24}
  .bar .btn{min-height:calc(42*var(--u));padding:0 calc(16*var(--u));font-size:calc(15*var(--u))}
  .top .btn{min-height:calc(42*var(--u));padding:0 calc(16*var(--u));font-size:calc(15*var(--u))}
  .carry-row{grid-template-columns:1fr;gap:calc(6*var(--u))}
  .carry-lab{padding-top:0}
  .logo-grid.g5,.logo-grid.g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .logo-grid.g5 li:last-child{grid-column:1/-1}
  .founders{grid-template-columns:1fr;gap:calc(22*var(--u))}
  .founders figure{flex-direction:row;align-items:center;gap:calc(18*var(--u))}
  .founders .ph{width:calc(104*var(--u));flex:none}
  .logo-grid.g5 li::before,.logo-grid.g4 li::before,.logo-grid.g5 li::after,.logo-grid.g4 li::after{display:block}
  .logo-grid.g5 li:nth-child(odd)::before,.logo-grid.g4 li:nth-child(odd)::before{display:none}
  .logo-grid.g5 li:nth-child(n+3)::after,.logo-grid.g4 li:nth-child(n+3)::after{display:block}
  .logo-grid.g5 li:nth-child(-n+2)::after,.logo-grid.g4 li:nth-child(-n+2)::after{display:none}
  .home{min-height:auto}
  .home-hero{padding-block:calc(44*var(--u)) calc(56*var(--u))}
  .cell{height:calc(80*var(--u))}
  .lockup{--lk-w:calc(132*var(--u));--lk-stamp:calc(42*var(--u));gap:calc(10*var(--u))}
  .pin .tag{display:none}.pin[aria-pressed=true] .tag{display:block}
  .map-paper{--pad:calc(9*var(--u));--t:calc(11*var(--u));--r:calc(3.5*var(--u))}
  .chart .lb-sea,.chart .lb-grat,.chart .lb-ref{display:none}
  .pc-corner{top:calc(14*var(--u));right:calc(14*var(--u));width:calc(56*var(--u))}.pc-stamp{width:calc(50*var(--u))}.pc-pm{width:calc(116*var(--u));left:calc(-52*var(--u));top:calc(18*var(--u))}
  .foot-mark{gap:calc(16*var(--u))}  .form{grid-template-columns:1fr}
  .navline{font-size:calc(18*var(--u))}
  .hint{font-size:calc(15*var(--u))}
  .pin .tag{font-size:calc(12*var(--u));padding:calc(5*var(--u)) calc(7*var(--u))}
  .pin .dot{width:calc(15*var(--u));height:calc(15*var(--u))}.pin .dot::after{inset:calc(4*var(--u))}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-delay:0ms!important;transition-duration:1ms!important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .intro .hero-sentence .slot{opacity:1;transform:rotate(var(--tilt,-4deg))}
  .intro .hero-sentence .s-txt::before{transform:none}
  .cue .hero-sentence .s-txt::before,.cue .hero-sentence .s-txt::after{animation:none}
  .intro .hint{opacity:1}
}

/* ---- How we work: the house menu, as an index ---------------------------- */
.hw{background:var(--oxblood);color:#EEDCD1;padding:clamp(calc(56*var(--u)),6vw,calc(88*var(--u))) 0}
.hw-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:calc(32*var(--u)) clamp(calc(40*var(--u)),6vw,calc(104*var(--u)));align-items:start}
.hw-side{position:sticky;top:calc(var(--hdr-offset,0px) + calc(40*var(--u)));transition:top 300ms var(--ease-out)}
.hw-kick{font:600 calc(12*var(--u))/1 var(--text);letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.hw-title{font-family:var(--display);font-weight:720;font-stretch:112%;font-size:clamp(calc(48*var(--u)),5.8vw,calc(96*var(--u)));line-height:.88;letter-spacing:-.05em;color:#FBF4EC;margin-top:calc(14*var(--u))}
.hw-note{margin-top:calc(18*var(--u));font-size:calc(17*var(--u));line-height:1.5;color:rgba(238,220,209,.78);max-width:17em}
.hw-cta{margin-top:calc(24*var(--u));font-size:calc(18*var(--u));color:#EEDCD1}
.hw-cta a{color:#FBF4EC;font-weight:600;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:calc(5*var(--u));transition:color 160ms ease}
@media (hover:hover) and (pointer:fine){.hw-cta a:hover{color:var(--gold)}}
.hw .ways.rows{display:block;gap:0;margin:0;border-top:2px solid rgba(238,220,209,.9)}
.row{border-bottom:1px solid rgba(238,220,209,.28)}
.row-hd{margin:0}
.row-top{display:grid;grid-template-columns:calc(110*var(--u)) minmax(0,1fr) calc(96*var(--u));align-items:center;gap:calc(20*var(--u));width:100%;padding:calc(20*var(--u)) 0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.row-top:focus-visible{outline:2px solid #FBF4EC;outline-offset:calc(4*var(--u))}
.row .lab{font:600 calc(11.5*var(--u))/1.3 var(--text);letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.row-h{font-family:var(--display);font-weight:720;font-stretch:112%;font-size:clamp(calc(28*var(--u)),2.8vw,calc(44*var(--u)));line-height:1.02;letter-spacing:-.04em;color:#FBF4EC;transition:color 200ms ease}
.row.open .row-h{color:var(--gold)}
@media (hover:hover) and (pointer:fine){.row-top:hover .row-h{color:var(--gold)}}
.row .ico{width:calc(92*var(--u));height:calc(92*var(--u));justify-self:end;overflow:visible}
.row .ico .ln{stroke:#EEDCD1;stroke-width:var(--icon-w,3.2)}
.row .ico .knob,.row .ico .dotc{fill:var(--gold)}
.row .ico .heart{fill:var(--gold);stroke:var(--gold)}
.row .ico-door .light,.row .ico-door .spill{fill:var(--gold)}
.row .ico-table .chair rect{fill:rgba(224,172,87,.28)}
.row .ico.pl{display:block;object-fit:contain}
.pl-door{transform-origin:22% 50%}
.hw .way.play .pl-door{animation:plDoor 1300ms var(--ease-io)}
.hw .way.play .pl-chart{animation:plRise 950ms var(--ease-out) both}
.hw .way.play .pl-table{animation:plSeat 1150ms var(--ease-out)}
@keyframes plDoor{0%,100%{transform:perspective(calc(260*var(--u))) rotateY(0deg)}35%{transform:perspective(calc(260*var(--u))) rotateY(-34deg)}68%{transform:perspective(calc(260*var(--u))) rotateY(7deg)}}
@keyframes plRise{0%{clip-path:inset(100% 0 0 0);transform:translateY(calc(6*var(--u)))}70%{clip-path:inset(0 0 0 0)}86%{transform:translateY(calc(-3*var(--u)))}100%{clip-path:inset(0 0 0 0);transform:none}}
@keyframes plSeat{0%,100%{transform:none}24%{transform:translateY(calc(-9*var(--u))) scale(1.05)}48%{transform:translateY(0) scale(.97)}70%{transform:translateY(calc(-3*var(--u)))}}
.row .ico.solid .fill{fill:#EEDCD1}
.row .ico.solid .knob{fill:var(--gold)}
.row .ico-chart.solid .heart{fill:var(--gold);stroke:none}
.row .ico-table.solid .chair rect.seat{fill:var(--gold)}
.row .ico-table.solid .dotc{fill:var(--oxblood)}
.hw .ways.pre .ico.solid .fill,.hw .ways.pre .ico.solid .seat,.hw .ways.pre .ico.solid .heart{opacity:0}
.hw .ways.drawn .ico.solid .fill,.hw .ways.drawn .ico.solid .seat,.hw .ways.drawn .ico.solid .heart{transition:opacity 500ms ease 450ms}
.body{display:grid;grid-template-rows:0fr;transition:grid-template-rows 380ms var(--ease-out)}
.body>div{overflow:hidden;min-height:0}
.row.open .body{grid-template-rows:1fr}
.body p{margin:0;padding:0 calc(116*var(--u)) calc(24*var(--u)) calc(130*var(--u));font-size:calc(18*var(--u));line-height:1.6;color:rgba(238,220,209,.9);opacity:0;transform:translateY(calc(-6*var(--u)));transition:opacity 260ms ease,transform 380ms var(--ease-out)}
.row.open .body p{opacity:1;transform:none;transition-delay:80ms}
/* reveal: rows rise in turn, icons draw; an icon plays its move when its course opens, and on hover */
.hw .ways.pre .way{opacity:0;transform:translateY(calc(18*var(--u)))}
.hw .ways.drawn .way{transition:opacity 600ms ease,transform 760ms var(--ease-out);transition-delay:calc(var(--k,0) * 140ms)}
.hw .way:nth-child(2){--k:1}.hw .way:nth-child(3){--k:2}
.hw .way.play .ico-door .panel{animation:doorPlay 1700ms var(--ease-io)}
.hw .way.play .ico-door .light,.hw .way.play .ico-door .spill{animation:lightPlay 1700ms var(--ease-io)}
.hw .way.play .ico-chart .bar{animation:climb 700ms var(--ease-out) both}
.hw .way.play .ico-chart .b2{animation-delay:100ms}.hw .way.play .ico-chart .b3{animation-delay:200ms}
.hw .way.play .ico-chart .heart{animation:beat 900ms var(--ease-out) 500ms 2}
.hw .way.play .ico-table .c1{animation:pullY 1500ms var(--ease-io)}
.hw .way.play .ico-table .c2{animation:pullL 1500ms var(--ease-io) 80ms}
.hw .way.play .ico-table .c3{animation:pullR 1500ms var(--ease-io) 160ms}
@keyframes doorPlay{0%,100%{transform:scaleX(1)}35%,65%{transform:scaleX(.42)}}
@keyframes lightPlay{0%,100%{opacity:0}35%,65%{opacity:.22}}
@keyframes pullY{0%,100%{transform:none}35%,65%{transform:translateY(calc(5*var(--u)))}}
@keyframes pullL{0%,100%{transform:none}35%,65%{transform:translate(calc(-4.3*var(--u)),calc(-2.5*var(--u)))}}
@keyframes pullR{0%,100%{transform:none}35%,65%{transform:translate(calc(4.3*var(--u)),calc(-2.5*var(--u)))}}
@media (max-width:860px){
  .hw-grid{grid-template-columns:1fr}
  .hw-side{position:static}
  .row-top{grid-template-columns:minmax(0,1fr) calc(64*var(--u));gap:calc(8*var(--u)) calc(16*var(--u));padding:calc(18*var(--u)) 0}
  .row .lab{grid-column:1/-1}
  .row .ico{width:calc(64*var(--u));height:calc(64*var(--u));grid-row:2;grid-column:2}
  .body p{padding:0 0 calc(22*var(--u))}
}

/* ---- Rubber stamps: "Received" and "Return to sender" ----------------------- */
.rubber{display:inline-flex;flex-direction:column;align-items:center;gap:calc(5*var(--u));padding:calc(10*var(--u)) calc(16*var(--u));border:calc(2.5*var(--u)) solid currentColor;border-radius:calc(6*var(--u));outline:1px solid currentColor;outline-offset:calc(3*var(--u));color:var(--oxblood);background:rgba(251,244,236,.7);white-space:nowrap}
.rubber b{font-family:var(--display);font-weight:760;font-stretch:115%;font-size:calc(22*var(--u));line-height:1;letter-spacing:.06em;text-transform:uppercase}
.rubber i{font:600 calc(11*var(--u))/1 var(--text);font-style:normal;letter-spacing:.1em;text-transform:uppercase}
.sent-pm.rubber{--rot:-7deg;width:auto;top:calc(-20*var(--u));right:calc(-8*var(--u));transform:rotate(var(--rot));mix-blend-mode:normal}
.rts-rubber{position:absolute;left:24%;top:62%;transform:rotate(-12deg);opacity:0;animation:thunk2 520ms var(--ease-stamp) 500ms forwards}
.rts-rubber b{font-size:calc(18*var(--u))}
@keyframes thunk2{0%{opacity:0;transform:rotate(-24deg) scale(1.4)}40%{opacity:.95}100%{opacity:.92;transform:rotate(-12deg) scale(1)}}

/* ---- Where to buy, by city -------------------------------------------------- */
.wtb{padding-bottom:clamp(calc(56*var(--u)),7vw,calc(104*var(--u)))}
.wtb-h{font-family:var(--display);font-weight:700;font-stretch:110%;font-size:clamp(calc(26*var(--u)),2.4vw,calc(32*var(--u)));line-height:1;letter-spacing:-.035em;color:var(--ink)}
.wtb-sub{margin-top:calc(8*var(--u));font-size:calc(15*var(--u));color:var(--ink-soft)}
.wtb-grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));margin-top:calc(24*var(--u));border-top:2px solid var(--ink)}
.wtb-col{padding:calc(24*var(--u)) clamp(calc(16*var(--u)),2vw,calc(28*var(--u))) calc(30*var(--u));border-left:1px solid var(--rule)}
.wtb-col:first-child{border-left:0;padding-left:calc(4*var(--u))}
.wtb-col h3{font-family:var(--display);font-weight:700;font-stretch:110%;font-size:calc(21*var(--u));line-height:1;letter-spacing:-.025em;color:var(--oxblood);margin-bottom:calc(26*var(--u))}
.wtb-city-link{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0% 1.5px no-repeat;padding-bottom:2px;transition:background-size 260ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.wtb-city-link:hover{background-size:100% 1.5px}}
.wtb-col ul{display:flex;flex-direction:column;gap:calc(26*var(--u));align-items:flex-start}
.wtb-col li{display:flex;flex-wrap:wrap;align-items:center;gap:calc(8*var(--u)) calc(12*var(--u));min-height:calc(30*var(--u));max-width:100%}
.wtb-col .wm{max-width:100%}
.wtb-col .wm{width:var(--w);height:auto;aspect-ratio:var(--ar);opacity:1}
.wtb-col li.soon .wm{opacity:.36}
.wtb-col li.soon b{font:700 calc(9.5*var(--u))/1 var(--text);letter-spacing:.14em;text-transform:uppercase;color:var(--rust);padding:calc(5*var(--u)) calc(8*var(--u));border:1px solid rgba(186,125,50,.6);border-radius:calc(999*var(--u));white-space:nowrap}
@media (max-width:860px){.wtb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wtb-col{border-left:0;border-top:1px solid var(--rule);padding-left:calc(4*var(--u))}.wtb-col:nth-child(-n+2){border-top:0}.wtb-col:nth-child(2n){border-left:1px solid var(--rule);padding-left:calc(18*var(--u))}}
.pc-pm.pm-round{--rot:-10deg;width:calc(112*var(--u));top:0;left:calc(-104*var(--u));transform:rotate(var(--rot))}
.pc-pm.pm-arch{--rot:-6deg;width:calc(76*var(--u));top:calc(-6*var(--u));left:calc(-86*var(--u));transform:rotate(var(--rot))}
.pc-pm .pmx{display:block;width:100%;height:auto}
.postcard h2{max-width:calc(100% - calc(200*var(--u)))}

@media (max-width:560px){.pc-pm.pm-round{width:calc(88*var(--u));left:calc(-82*var(--u))}.pc-pm.pm-arch{width:calc(60*var(--u));left:calc(-66*var(--u))}.postcard h2{max-width:calc(100% - calc(150*var(--u)))}}

/* wordmark masks */
.m-bloomingdales{--m:url(../assets/marks/bloomingdales.webp)}.m-boutiqaat{--m:url(../assets/marks/boutiqaat.webp)}.m-carl-friedrik{--m:url(../assets/marks/carl-friedrik.webp)}.m-cvrgrm{--m:url(../assets/marks/cvrgrm.webp)}.m-galeries-lafayette{--m:url(../assets/marks/galeries-lafayette.webp)}.m-grams28{--m:url(../assets/marks/grams28.webp)}.m-harvey-nichols{--m:url(../assets/marks/harvey-nichols.webp)}.m-level-shoes{--m:url(../assets/marks/level-shoes.webp)}.m-ounass{--m:url(../assets/marks/ounass.webp)}.m-p448{--m:url(../assets/marks/p448.webp)}.m-printemps{--m:url(../assets/marks/printemps.webp)}.m-scarosso{--m:url(../assets/marks/scarosso.webp)}.m-tryano{--m:url(../assets/marks/tryano.webp)}

@supports not (width:max(1px,2px)){:root{--u:1px}}