/* Standard — shared design system (sub-pages). Matches homepage tokens. */
:root{
  --navy:      oklch(0.32 0.088 264);
  --navy-deep: oklch(0.26 0.078 264);
  --ink:       oklch(0.28 0.03 264);
  --ink-soft:  oklch(0.52 0.02 264);
  --line:      oklch(0.9 0.006 264);
  --paper:     oklch(0.995 0.0015 264);
  --paper-2:   oklch(0.975 0.004 264);
  --white:     oklch(0.985 0.003 264);
  --gold:      oklch(0.74 0.11 84);
  --rust:      oklch(0.585 0.14 45);
  --rust-soft: oklch(0.72 0.115 48);
  --d-bg:      oklch(0.205 0.052 264);
  --d-bg-2:    oklch(0.18 0.048 264);
  --d-tile:    oklch(0.285 0.045 264);
  --d-line:    oklch(1 0 0 / .14);
  --d-text:    oklch(0.86 0.02 264);
  --d-text-soft: oklch(0.7 0.02 264);
  --f:  "Karla", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --fs: "Merriweather", Georgia, serif;
  --edge: clamp(1.25rem, 0.4rem + 3.4vw, 4.5rem);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --maxw: 82rem;
  /* Height of the sticky .site-head. Tracks its clamped padding + tallest child, rounded UP by ~1px
     so any full-screen section that subtracts it lands just inside the fold rather than just outside.
     Measured: 56px at 500w, 67px at 1280w, 69px at 1440w. */
  --head-h: clamp(4.1rem, 3.5rem + 1.6vw, 5.1rem);

  /* Type scale — ONE source of truth. These are the sizes already in use (.h-xl/.h-lg/.h-md/.lead
     and the homepage display size). Nothing in this stylesheet should invent its own font-size;
     pick a step. Where a block must fit a fixed height, cap a step with svh rather than inventing
     a new value: font-size:min(var(--fs-lg), 4svh). */
  --fs-display: clamp(3rem, 2rem + 3.5vw, 5.5rem);   /* homepage hero */
  --fs-xl:      clamp(2.2rem, 1rem + 4vw, 4.4rem);   /* .h-xl */
  --fs-lg:      clamp(1.7rem, 1.1rem + 2vw, 2.9rem); /* .h-lg */
  --fs-md:      clamp(1.25rem, 1rem + 1vw, 1.7rem);  /* .h-md */
  --fs-lead:    clamp(1.05rem, 1rem + 0.4vw, 1.3rem);/* .lead */
  --fs-eyebrow: 0.74rem;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth}
html.leaving{opacity:0;transition:opacity .42s cubic-bezier(.16,1,.3,1)}
body{font-family:var(--f);background:var(--paper);color:var(--ink);font-size:clamp(0.95rem, 0.9rem + 0.2vw, 1.02rem);line-height:1.6}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--navy);color:var(--white)}

/* ===== dark navy page theme (tumesinine) — Standard Lab ===== */
body.theme-dark{background:var(--d-bg);color:var(--d-text)}
body.theme-dark .page{background:var(--d-bg)}
body.theme-dark ::selection{background:var(--rust);color:#fff}
body.theme-dark .site-head{background:var(--d-bg);border-bottom-color:var(--d-line)}
body.theme-dark .site-head .logo,body.theme-dark .site-nav a,body.theme-dark .icon-btn,body.theme-dark .lang,body.theme-dark .menu-toggle{color:#fff}
body.theme-dark .site-nav a{opacity:.78}
body.theme-dark .site-nav a.active,body.theme-dark .site-nav a:hover{opacity:1}
body.theme-dark .site-nav a::after{background:var(--rust)}
body.theme-dark .eyebrow{color:var(--rust-soft)}
body.theme-dark #preload{background:var(--d-bg);color:#fff}
body.theme-dark #preload .pl-logo{color:#fff}
body.theme-dark #preload .pl-line{background:oklch(1 0 0 / .16)}
body.theme-dark #preload .pl-line i{background:var(--rust)}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--edge)}
.eyebrow{font-size:var(--fs-eyebrow);letter-spacing:0.22em;text-transform:uppercase;font-weight:700;color:var(--ink-soft)}
.serif{font-family:var(--fs);font-weight:300}
h1,h2,h3{letter-spacing:-0.015em;line-height:1.06;font-weight:400}
h1 em,h2 em,h3 em{font-family:var(--fs);font-style:italic;font-weight:300}
.h-xl{font-size:var(--fs-xl)}
.h-lg{font-size:var(--fs-lg)}
.h-md{font-size:var(--fs-md)}
.lead{font-size:var(--fs-lead);color:var(--ink-soft);max-width:60ch}
.muted{color:var(--ink-soft)}
section{padding-block:clamp(3rem, 2rem + 4vw, 7rem)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.7em;font-weight:700;font-size:0.82rem;letter-spacing:0.06em;padding:0.85em 1.6em;border-radius:3px;border:1px solid transparent;transition:background .35s var(--ease),color .35s var(--ease),transform .5s var(--ease);white-space:nowrap}
.btn .arw{transition:transform .5s var(--ease)}
.btn:hover .arw{transform:translateX(4px)}
.btn--navy{background:var(--navy);color:var(--white)}
.btn--navy:hover{background:var(--navy-deep);transform:translateY(-2px)}
.btn--ghost{border-color:currentColor;color:var(--navy)}
.btn--ghost:hover{background:var(--navy);color:var(--white)}
.arrow-link{display:inline-flex;align-items:center;gap:.7rem;font-weight:700;font-size:0.8rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--navy)}
.arrow-link .ar{width:2.4rem;height:1px;background:currentColor;position:relative;transition:width .45s var(--ease)}
.arrow-link .ar::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-inline-end:1px solid currentColor;transform:rotate(45deg)}
.arrow-link:hover .ar{width:3.2rem}

/* header */
.site-head{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:2rem;
  padding:clamp(0.8rem, 0.6rem + 0.5vw, 1.1rem) var(--edge);background:var(--paper);border-bottom:1px solid var(--line)}
.logo{height:clamp(1.05rem, 0.95rem + 0.5vw, 1.4rem);width:auto;color:var(--navy);display:block}
.logo path{fill:currentColor}
.site-nav{display:flex;gap:clamp(0.9rem, 0.2rem + 1.7vw, 2.6rem)}
.site-nav a{font-size:clamp(0.66rem, 0.6rem + 0.15vw, 0.78rem);letter-spacing:0.12em;text-transform:uppercase;font-weight:700;color:var(--ink);position:relative;padding-block:.5rem;opacity:.85;transition:opacity .3s}
.site-nav a.active,.site-nav a:hover{opacity:1}
.site-nav a::after{content:"";position:absolute;left:0;bottom:.12rem;height:1px;width:100%;background:var(--navy);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.site-nav a.active::after,.site-nav a:hover::after{transform:scaleX(1)}
.head-right{display:flex;align-items:center;gap:clamp(0.8rem, 0.4rem + 1vw, 1.5rem)}
.icon-btn{background:none;border:none;cursor:pointer;color:var(--navy);display:grid;place-items:center;padding:.3rem;border-radius:3px;transition:opacity .3s;opacity:.85}
.icon-btn:hover{opacity:1}
.lang{font-size:0.78rem;font-weight:700;letter-spacing:0.14em;color:var(--ink)}

/* ---- language switcher ---- */
.langsw{position:relative}
.langsw-t{display:inline-flex;align-items:center;gap:.34rem;background:none;border:0;padding:.2rem .1rem;cursor:pointer;color:inherit;font:inherit;font-size:.78rem;font-weight:700;letter-spacing:.14em;line-height:1}
.langsw-c{width:9px;height:6px;opacity:.55;transition:transform .4s var(--ease),opacity .3s var(--ease)}
.langsw-t:hover .langsw-c{opacity:1}
.langsw.open .langsw-c{transform:rotate(180deg);opacity:1}
.langsw-p{position:absolute;top:calc(100% + .85rem);right:0;min-width:11.5rem;background:var(--paper);border:1px solid var(--line);box-shadow:0 18px 44px oklch(0.2 0.05 264/.13);padding:.4rem;opacity:0;visibility:hidden;transform:translateY(-.4rem);transition:opacity .34s var(--ease),transform .44s var(--ease),visibility .34s;z-index:40}
.langsw.open .langsw-p{opacity:1;visibility:visible;transform:none}
.langsw-o{display:flex;align-items:baseline;gap:.7rem;width:100%;background:none;border:0;padding:.5rem .7rem;cursor:pointer;font:inherit;text-align:start;color:var(--ink-soft);transition:color .28s var(--ease),background .28s var(--ease)}
.langsw-o:hover{background:var(--paper-2);color:var(--navy)}
.langsw-o.on{color:var(--navy)}
.langsw-code{font-size:.66rem;font-weight:700;letter-spacing:.14em;min-width:1.7rem;opacity:.55}
.langsw-o.on .langsw-code{opacity:1}
.langsw-name{font-size:.88rem;letter-spacing:0}
.langsw-o.on .langsw-name{font-weight:600}
body.theme-dark .langsw-p{background:var(--d-tile);border-color:var(--d-line);box-shadow:0 18px 44px oklch(0 0 0/.4)}
body.theme-dark .langsw-o{color:var(--d-text-soft)}
body.theme-dark .langsw-o:hover{background:oklch(1 0 0/.06);color:#fff}
body.theme-dark .langsw-o.on{color:#fff}
.menu-toggle{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;gap:5px;padding:6px 0;color:var(--navy)}
.menu-toggle span{display:block;width:26px;height:1.5px;background:currentColor}
body.menu-open{overflow:hidden}
.page{position:fixed;inset:0;z-index:2;background:var(--paper);overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none;transition:inset .8s cubic-bezier(.76,0,.24,1),border-radius .8s cubic-bezier(.76,0,.24,1),box-shadow .8s cubic-bezier(.76,0,.24,1),transform .95s cubic-bezier(.76,0,.24,1)}
.page::-webkit-scrollbar{width:0;height:0;display:none}
.page.pl-enter{transform:translateY(46px)}
body.menu-open .page{inset:0 min(33vw,540px) 0 0;border-radius:0 40px 40px 0;box-shadow:0 30px 90px oklch(0.2 0.05 264 / .18)}
.menu-panel{position:fixed;inset:0;z-index:1;background:var(--paper);overflow:hidden}
.menu-inner{position:absolute;top:0;right:0;bottom:0;width:min(33vw,540px);display:flex;flex-direction:column;padding:clamp(4rem,2rem + 7vw,7.5rem) clamp(2rem,1rem + 3.2vw,4.5rem) clamp(2rem,1rem + 3vw,3.5rem)}
.menu-mono{position:absolute;right:-3%;bottom:clamp(5rem,13vh,10rem);width:clamp(14rem,20vw,24rem);pointer-events:none;user-select:none;z-index:0}
.menu-mono img{width:100%;height:auto;display:block;opacity:.1}
.menu-x{position:fixed;top:clamp(1.8rem,1rem + 1.6vw,2.8rem);right:clamp(1.8rem,1rem + 2vw,3rem);z-index:5;background:none;border:none;cursor:pointer;font-size:1.7rem;line-height:1;color:var(--navy);opacity:0;visibility:hidden;transition:opacity .4s var(--ease) .15s,visibility 0s .55s}
body.menu-open .menu-x{opacity:1;visibility:visible;transition:opacity .4s var(--ease) .35s}
.menu-list{list-style:none}
.menu-list li{overflow:hidden}
.menu-list li a{display:block;font-size:clamp(1.5rem,1rem + 1.8vw,2.4rem);font-weight:600;letter-spacing:0.01em;text-transform:uppercase;color:var(--navy);line-height:1.75;transform:translateY(110%);transition:transform .7s cubic-bezier(.76,0,.24,1),color .3s var(--ease)}
body.menu-open .menu-list li a{transform:none}
body.menu-open .menu-list li:nth-child(1) a{transition-delay:.32s}body.menu-open .menu-list li:nth-child(2) a{transition-delay:.38s}body.menu-open .menu-list li:nth-child(3) a{transition-delay:.44s}body.menu-open .menu-list li:nth-child(4) a{transition-delay:.5s}body.menu-open .menu-list li:nth-child(5) a{transition-delay:.56s}body.menu-open .menu-list li:nth-child(6) a{transition-delay:.62s}
.menu-list a:hover,.menu-list a.active{color:oklch(0.56 0.11 264)}
.menu-bottom{margin-top:auto;width:100%;display:flex;gap:clamp(2rem,1rem + 3vw,4rem);opacity:0;transition:opacity .5s .55s}
body.menu-open .menu-bottom{opacity:1}
.menu-col{display:flex;flex-direction:column;gap:.35rem}
.menu-lbl{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.35rem}
.menu-col a,.menu-col span{font-size:.9rem;color:var(--ink);transition:color .3s}.menu-col a:hover{color:var(--navy)}
@media(max-width:820px){body.menu-open .page{inset:0 84vw 0 0;border-radius:0 28px 28px 0}.menu-inner{width:84vw}}

/* search overlay */
.search-ov{position:fixed;inset:0;z-index:100;background:oklch(0.26 0.078 264 / .97);display:grid;place-items:start center;padding-top:18vh;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility 0s .4s}
.search-ov.open{opacity:1;visibility:visible;transition:opacity .4s var(--ease)}
.search-ov .box{width:min(46rem,90vw);color:var(--white)}
.search-ov label{font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;color:oklch(0.8 0.02 264);font-weight:700}
.search-ov input{width:100%;background:transparent;border:none;border-bottom:1px solid oklch(0.6 0.03 264);color:var(--white);font-family:var(--f);font-size:clamp(1.5rem,1rem + 2.5vw,2.6rem);font-weight:300;padding:.6rem 0;margin-top:.8rem;outline:none}
.search-ov input::placeholder{color:oklch(0.6 0.03 264)}
.search-ov .hint{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.6rem}
.search-ov .hint a{font-size:0.82rem;color:oklch(0.82 0.02 264);border:1px solid oklch(0.5 0.03 264);border-radius:2rem;padding:.4em 1em;transition:background .3s,color .3s}
.search-ov .hint a:hover{background:var(--white);color:var(--navy)}
.search-ov .close{position:absolute;top:2rem;right:var(--edge);background:none;border:none;color:var(--white);cursor:pointer;font-size:0.8rem;letter-spacing:0.14em;text-transform:uppercase;display:flex;align-items:center;gap:.5rem}

/* breadcrumb */
.crumbs{padding-top:clamp(1rem,0.6rem + 1vw,1.6rem);font-size:0.76rem;letter-spacing:0.04em;color:var(--ink-soft)}
.crumbs a{color:var(--ink-soft);transition:color .3s}.crumbs a:hover{color:var(--navy)}
.crumbs span{margin-inline:.5rem;opacity:.5}

/* page hero — cinematic */
.phero{position:relative;overflow:hidden;color:var(--white);min-height:clamp(26rem,72vh,44rem);display:flex;align-items:flex-end}
.phero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,oklch(0.18 0.05 264 / .6) 0%,oklch(0.18 0.05 264 / .18) 46%,transparent 74%),linear-gradient(0deg,oklch(0.16 0.05 264 / .62),transparent 42%)}
.phero .inner{position:relative;z-index:2;padding-block:clamp(2rem,1.5rem + 3vw,4rem);display:grid;gap:1rem;max-width:64rem}
.phero h1{font-size:clamp(2.4rem,1rem + 5.2vw,5.4rem);font-weight:300;line-height:0.98;letter-spacing:-0.02em;max-width:15ch}
.phero h1 em{font-family:var(--fs);font-style:italic;font-weight:300}
.phero .eyebrow{color:oklch(0.9 0.02 264)}
.phero .lead{color:oklch(0.88 0.02 264)}
.phero .pside{position:absolute;top:50%;right:calc(var(--edge) - .6rem);transform:translateY(-50%);z-index:2;writing-mode:vertical-rl;font-size:0.7rem;letter-spacing:0.3em;text-transform:uppercase;color:oklch(0.9 0.02 264 / .75);display:flex;gap:1.6rem;align-items:center}
@media(max-width:820px){.phero .pside{display:none}}
/* editorial statement (shared) */
.estatement{padding-block:clamp(3.5rem,2.5rem + 4vw,7rem)}
.estatement .big{font-family:var(--fs);font-weight:300;font-style:italic;font-size:clamp(1.5rem,1rem + 2.4vw,2.8rem);line-height:1.24;letter-spacing:-0.01em;max-width:24ch;color:var(--ink)}
.estatement .sub{margin-top:1.4rem;max-width:52ch;color:var(--ink-soft)}

/* generic cards */
.grid{display:grid;gap:clamp(1rem,0.5rem + 1.4vw,2rem)}
.g-2{grid-template-columns:repeat(2,1fr)}.g-3{grid-template-columns:repeat(3,1fr)}.g-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:860px){.g-3,.g-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.g-2,.g-3,.g-4{grid-template-columns:1fr}}
.card{display:block;background:var(--paper);overflow:hidden}
.card .fr{overflow:hidden;aspect-ratio:4/3;background:var(--paper-2)}
.card .fr img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 1s var(--ease)}
.card:hover .fr img{transform:scale(1.09)}
.card .cap{padding-top:.9rem;display:flex;flex-direction:column;gap:.25rem}
.card .cap .t{font-weight:700;font-size:1.05rem}
.card .cap .s{font-size:0.85rem;color:var(--ink-soft)}

/* stat row */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,0.5rem + 1.5vw,2.5rem)}
@media(max-width:720px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat .n{font-family:var(--fs);font-weight:300;font-size:clamp(2.4rem,1.5rem + 2.5vw,3.6rem);color:var(--navy);line-height:1}
.stat .l{font-size:0.8rem;color:var(--ink-soft);letter-spacing:0.02em;margin-top:.4rem}

/* footer */
.site-foot{background:var(--paper);color:var(--ink);padding:clamp(3rem,2rem + 3vw,5rem) 0 0;margin-top:0;overflow:hidden;border-top:1px solid var(--line)}
.site-foot .logo{color:var(--navy);height:1.4rem;margin-bottom:1rem}
.foot-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:clamp(1.5rem,1rem + 2vw,3rem)}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr 1fr}}
.site-foot h4{font-size:0.68rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:1rem;font-weight:700}
.site-foot .fcol a,.site-foot .fcol p{display:block;font-size:0.9rem;color:var(--ink-soft);padding-block:.28rem;transition:color .3s}
.site-foot .fcol a:hover{color:var(--navy)}
.site-foot .tag{font-size:0.9rem;max-width:28ch;color:var(--ink-soft)}
.news{margin-top:1.4rem;display:flex;gap:.5rem;flex-wrap:wrap;max-width:22rem}
.news input{flex:1 1 12rem;background:var(--white);border:1px solid var(--line);border-radius:3px;color:var(--ink);padding:.7em .9em;font:inherit;font-size:0.88rem}
.news input::placeholder{color:var(--ink-soft)}
.news input:focus{outline:none;border-color:var(--navy)}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:clamp(2rem,4vw,3rem);padding-top:1.4rem;border-top:1px solid var(--line);font-size:0.8rem;color:var(--ink-soft)}
.foot-word{margin:clamp(1.5rem,3vw,2.6rem) 0 0;line-height:0;padding:0 clamp(0rem,2vw,3rem);overflow:hidden}
.foot-word svg{width:100%;height:auto;display:block;color:oklch(0.85 0.008 264)}

/* Sisustus: gateway and dedicated sector pages */
.interiors-selector main>:not(.interiors-gateway),
.sector-detail-page main>:not(.sector-subhero):not(.sector-detail){display:none}
.interiors-gateway{min-height:100svh;padding:clamp(8rem,15vh,12rem) var(--edge) clamp(4rem,8vh,7rem);display:flex;align-items:center}
.interiors-gateway-head{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.interiors-options{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,4vw,6rem)}
.interiors-option{min-height:clamp(22rem,42vw,34rem);display:flex;flex-direction:column;padding:clamp(1.8rem,3vw,3rem);background:var(--paper-2);color:var(--ink);border:1px solid transparent;transition:background .4s var(--ease),border-color .4s,color .3s,transform .5s var(--ease)}
.interiors-option:hover{background:#fff;border-color:var(--line);color:var(--navy);transform:translateY(-5px)}
.interiors-option-no{font-family:var(--fs);font-size:.8rem;color:var(--ink-soft)}
.interiors-option-icon{width:clamp(2.7rem,4vw,4rem);height:clamp(2.7rem,4vw,4rem);margin:auto 0;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.interiors-option h2{font-size:clamp(1.5rem,1.1rem + 1.1vw,2.3rem);font-weight:400;letter-spacing:-.025em;margin-bottom:.8rem}
.interiors-option p{max-width:29ch;color:var(--ink-soft);font-size:.9rem;line-height:1.55}
.interiors-option-arrow{align-self:flex-end;margin-top:1.5rem;font-size:1.2rem;transition:transform .4s var(--ease)}
.interiors-option:hover .interiors-option-arrow{transform:translateX(6px)}
/* Sector opener — locked to exactly one screen. The section is a fixed 100svh grid; the media row
   takes whatever height is left (minmax(0,1fr)), and every type size is capped in svh as well as vw,
   so the wordmark and the sector switcher are always visible without scrolling at any viewport. */
.sector-subhero{height:calc(100svh - var(--head-h) - 1.4rem);min-height:26rem;padding:clamp(1.1rem,2.6svh,2rem) var(--edge) 0;background:#fff;display:grid;grid-template-rows:minmax(0,1fr) auto;overflow:hidden}
.sector-subhero>div{display:grid;grid-template-rows:minmax(0,1fr) auto;min-height:0}
.sector-subhero-main{display:grid;grid-template-columns:minmax(16rem,.8fr) minmax(0,1.7fr);gap:clamp(1.5rem,3.5vw,4rem);align-items:center;min-height:0;height:100%;padding-bottom:clamp(1rem,3.4svh,2.6rem)}
.sector-subhero-copy{min-width:0}
.sector-subhero-copy .eyebrow{display:flex;align-items:center;gap:1.1rem;color:var(--navy)}
.sector-subhero-copy .eyebrow::after{content:"";width:2.4rem;height:1px;background:currentColor;opacity:.45}
.sector-subhero h1{font-family:var(--fs);font-size:min(var(--fs-display),8svh);font-weight:300;line-height:.95;letter-spacing:-.04em;margin:clamp(.5rem,1.3svh,1.1rem) 0}
.sector-subhero h1 em{font-weight:300;color:var(--navy)}
.sector-subhero-copy p{max-width:34ch;color:var(--ink-soft);font-size:min(var(--fs-lead),2.2svh);line-height:1.45}
.sector-subhero-cta{margin-top:clamp(1rem,2.4svh,1.7rem)}
.sector-subhero-right{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:clamp(.7rem,1.8svh,1.3rem);height:100%;min-height:0}
.sector-subhero-media{display:grid;grid-template-columns:.62fr 1.6fr;grid-template-rows:1fr 1fr;gap:clamp(.4rem,.8vw,.85rem);height:100%;min-height:0}
/* Sector figures, set flush right under the images so the eye lands on them after the photography. */
.sector-subhero-stats{display:flex;justify-content:flex-end;gap:clamp(1.4rem,3.5vw,3.6rem);border-top:1px solid var(--line);padding-top:clamp(.55rem,1.4svh,.95rem)}
.sector-subhero-stats dt{font-size:var(--fs-eyebrow);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.15rem;white-space:nowrap}
.sector-subhero-stats dd{font-family:var(--fs);font-weight:300;font-size:min(var(--fs-lg),4svh);line-height:1;letter-spacing:-.03em;color:var(--navy)}
.sector-subhero-media figure{overflow:hidden;background:var(--paper-2)}
.sector-subhero-media figure:first-child{grid-column:1;grid-row:1}
.sector-subhero-media figure:nth-child(2){grid-column:1;grid-row:2}
.sector-subhero-media figure:last-child{grid-column:2;grid-row:1/3}
.sector-subhero-media img{width:100%;height:100%;object-fit:cover}
.sector-subhero-word{font-size:min(calc(var(--fs-display) * 2),17svh);font-weight:600;line-height:.94;letter-spacing:.09em;color:var(--navy);text-transform:uppercase;white-space:nowrap;overflow:hidden;padding:clamp(.4rem,1.3svh,1.1rem) 0}
.sector-subnav{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-bottom:0;background:#fff}
.sector-subnav a{display:flex;justify-content:center;align-items:center;gap:.9rem;padding:clamp(1.2rem,2.6svh,1.9rem) 1.5rem;border-inline-end:1px solid var(--line);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);transition:color .3s var(--ease)}
.sector-subnav a:hover{color:var(--navy)}
.sector-subnav a:last-child{border-inline-end:0}.sector-subnav a.active{color:var(--navy);box-shadow:inset 0 -2px var(--navy)}
.sector-subnav svg{width:1.5rem;height:1.5rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.3}

/* Short viewports (most laptops once browser chrome is subtracted): shrink further so the wordmark
   and the sector switcher keep clear air beneath them rather than sitting on the fold. */
@media(max-height:640px){
  /* Very short windows: the lead is the one thing that can go without breaking the composition. */
  .sector-subhero-copy p{display:none}
}

.sector-detail{padding:clamp(7rem,12vh,10rem) var(--edge) clamp(5rem,9vw,9rem);background:#fff}
.sector-detail-grid{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(20rem,1fr);gap:clamp(3rem,6vw,7rem)}
.sector-detail-main{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(2.5rem,5vw,6rem);align-content:start}
.sector-detail-kicker{grid-column:1/-1;font-size:.7rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft)}
.sector-detail h1{font-size:clamp(2.8rem,2rem + 2.5vw,5.4rem);font-weight:300;line-height:1.04;letter-spacing:-.04em}
.sector-detail h1 em{display:block;font-family:var(--fs);font-weight:300}
.sector-detail-copy{font-size:clamp(1rem,.9rem + .3vw,1.16rem);line-height:1.65;color:var(--ink-soft)}
.sector-detail-copy p+p{margin-top:1.5rem}
.sector-detail-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:clamp(2.5rem,5vw,5rem)}
.sector-detail-stat small{display:block;margin-bottom:.8rem;font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}
.sector-detail-stat strong{font-family:var(--fs);font-size:clamp(2.7rem,2rem + 2vw,4.4rem);font-weight:300;color:var(--navy)}
.sector-detail-trust{grid-column:1/-1;margin-top:clamp(2.5rem,5vw,4.5rem);padding-top:2rem;border-top:1px solid var(--line)}
.sector-detail-trust>span{display:block;margin-bottom:1.8rem;font-size:.66rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}
.sector-detail-logos{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(1.2rem,2.5vw,3rem);align-items:center}
.sector-detail-logos img{width:100%;max-width:8rem;max-height:2.2rem;object-fit:contain;filter:grayscale(1);opacity:.38}
.sector-detail-image{min-height:44rem;overflow:hidden;background:var(--paper-2)}
.sector-detail-image img{width:100%;height:100%;object-fit:cover}
@media(max-width:850px){
  .interiors-options{grid-template-columns:1fr}.interiors-option{min-height:20rem}
  .sector-subhero{padding-top:4.75rem}
  .sector-subhero-main{grid-template-columns:1fr;gap:clamp(.8rem,2svh,1.6rem);align-content:center}
  /* `height:100%` alone trusts whatever the copy column above it leaves in a fixed-height section
     — on a short, narrow phone with the full lead paragraph still showing (that only drops below
     640px of *height*, not width), the leftover space can get thin enough to squeeze the three
     photographs to near-nothing. A modest floor keeps them legible; kept small on purpose because
     `.sector-subhero` is `overflow:hidden`, so pushing this too high risks clipping the sector
     switcher below it instead — this needs checking on an actual short/narrow phone, not just
     read off the CSS, before trusting the number. */
  .sector-subhero-media{height:100%;min-height:7rem;aspect-ratio:auto}
  .sector-subhero-word{font-size:min(calc(var(--fs-display) * 1.7),13svh,15vw);padding:clamp(.5rem,1.4svh,1.1rem) 0}
  .sector-subnav a{flex-direction:column;gap:.5rem;font-size:.66rem;text-align:center;padding:1.3rem .6rem}
  .sector-subhero-stats{justify-content:space-between;gap:.8rem}
  .sector-subhero-stats dd{font-size:min(var(--fs-md),3svh)}
  .sector-detail-grid{grid-template-columns:1fr}.sector-detail-image{grid-row:1;min-height:0;aspect-ratio:16/10}
}

/* Portrait above the phone breakpoint: stack instead of splitting into two narrow columns.
   Height stays locked to one screen — the media row simply absorbs the extra space. */
@media(min-width:851px) and (max-aspect-ratio:1/1){
  .sector-subhero-main{grid-template-columns:1fr;gap:clamp(1rem,2.4svh,2rem);align-content:center}
  .sector-subhero-media{height:100%}
  .sector-subhero h1{font-size:min(var(--fs-display),7.6svh)}
  .sector-subhero-copy p{max-width:52ch}
}

@media(max-width:580px){
  .sector-detail-main{grid-template-columns:1fr}.sector-detail-kicker,.sector-detail-stats,.sector-detail-trust{grid-column:1}
  .sector-detail-stats{grid-template-columns:repeat(2,1fr)}.sector-detail-logos{grid-template-columns:repeat(3,1fr)}
}

/* reveal — slower, more deliberate */
[data-rise]{opacity:0;transform:translateY(42px);transition:opacity 1.15s var(--ease),transform 1.25s var(--ease)}
[data-rise].show{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition-duration:.01ms!important}[data-rise]{opacity:1!important;transform:none!important}#preload{display:none!important}}

/* preloader — white, editorial: logo right, counter bottom-left */
#preload{position:fixed;inset:0;z-index:1000;background:var(--paper);color:var(--navy);display:grid;place-items:center;transition:transform 1s cubic-bezier(0.76,0,0.24,1)}
#preload.done{transform:translateY(-100%)}
#preload .pl-center{display:flex;flex-direction:column;align-items:center;gap:clamp(1.5rem,3.4vh,2.6rem)}
#preload .pl-logo-mask{overflow:hidden;line-height:0;padding:.14em 0}
#preload .pl-logo{width:clamp(11rem,26vw,19rem);height:auto;color:var(--navy);display:block;transform:translateY(118%);transition:transform 1.05s cubic-bezier(0.76,0,0.24,1)}
#preload.reveal .pl-logo{transform:translateY(0)}
#preload .pl-logo path{fill:currentColor}
#preload .pl-line{width:clamp(6rem,15vw,9.5rem);height:1px;background:oklch(0.5 0.05 264 / .18);position:relative;overflow:hidden;opacity:0;transform:translateY(6px);transition:opacity .7s .35s var(--ease),transform .7s .35s var(--ease)}
#preload.reveal .pl-line{opacity:1;transform:none}
#preload .pl-line i{position:absolute;inset:0;background:var(--navy);transform:scaleX(0);transform-origin:left;transition:transform 1.4s cubic-bezier(.35,0,.15,1)}
#preload.filling .pl-line i{transform:scaleX(1)}
@media(max-width:640px){#preload .pl-logo{width:52vw}}

/* ================= TOOTED / catalog (shop) ================= */
.shop-top{padding:clamp(1.6rem,1rem + 1.6vw,2.6rem) var(--edge) clamp(2rem,1.5rem + 2.5vw,3.5rem);position:relative;z-index:2}
.shop-top .crumb{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.shop-top h1{font-size:clamp(2rem,1.4rem + 2.4vw,3.2rem);font-weight:300;letter-spacing:-0.02em;color:var(--navy);margin-top:.5rem}
.shop-top p{color:var(--ink-soft);margin-top:.4rem;max-width:56ch;font-size:.92rem}
.shopA{position:relative;display:grid;grid-template-columns:clamp(12rem,15vw,14rem) 1fr;gap:clamp(2.5rem,1.5rem + 4vw,6rem);padding:0 var(--edge) 4rem;align-items:start;z-index:2}
.filters{position:sticky;top:5rem;display:flex;flex-direction:column}
.facc{border-bottom:1px solid var(--line)}
.facc-h{width:100%;display:flex;justify-content:space-between;align-items:center;background:none;border:none;cursor:pointer;padding:.95rem 0;font-size:.82rem;font-weight:600;color:var(--navy);letter-spacing:.02em;text-align:start}
.facc-h .pm{color:var(--ink-soft);font-size:.9rem;transition:transform .3s}
.facc.open .facc-h .pm{transform:rotate(45deg)}
.facc-b{list-style:none;max-height:0;overflow:hidden;transition:max-height .4s var(--ease),padding .4s var(--ease)}
.facc.open .facc-b{max-height:26rem;padding-bottom:.9rem}
.facc-b li{display:flex;justify-content:space-between;padding:.28rem 0;font-size:.84rem}
.facc-b a{color:var(--ink-soft);transition:color .3s var(--ease)}.facc-b a:hover{color:var(--navy)}
.facc-b a.on{color:var(--navy);font-weight:600}
.pgrid-empty{margin-top:2rem;padding:2.5rem 0;border-top:1px solid var(--line);color:var(--ink-soft);font-size:.92rem;max-width:44ch}
.pgrid-empty[hidden]{display:none}
.facc-b span{color:var(--ink-soft);font-size:.72rem}
.fbrand{padding-top:1.4rem}
.fbrand-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.9rem}
.fbrand-head h4{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);font-weight:700}
.sw-toggle{position:relative;width:38px;height:20px;border-radius:100px;background:var(--line);border:none;cursor:pointer;transition:background .3s;flex:0 0 auto}
.sw-toggle::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .3s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.sw-toggle.on{background:var(--navy)}.sw-toggle.on::after{transform:translateX(18px)}
.fbrand-note{font-size:.72rem;color:var(--ink-soft);margin-bottom:1rem;line-height:1.4}
.fbrand-logos{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;opacity:.4;pointer-events:none;transition:opacity .3s;filter:grayscale(1)}
.fbrand-logos.active{opacity:1;pointer-events:auto;filter:none}
.blogo{background:var(--paper-2);border:1px solid var(--line);border-radius:3px;height:2.6rem;display:grid;place-items:center;cursor:pointer;padding:.35rem;transition:border-color .3s}
.blogo:hover{border-color:var(--navy)}
.blogo img{max-width:100%;max-height:100%;object-fit:contain;opacity:.85}
.mtop{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.4rem}
.viewtog{display:flex;gap:.4rem}
.viewtog button{background:none;border:1px solid var(--line);border-radius:3px;width:2rem;height:2rem;display:grid;place-items:center;cursor:pointer;color:var(--ink-soft)}
.viewtog button.on{border-color:var(--navy);color:var(--navy)}
.viewtog svg{width:15px;height:15px}
.sortsel{border:1px solid var(--line);border-radius:3px;padding:.5rem 2rem .5rem .9rem;font-size:.8rem;color:var(--navy);font-family:var(--f);background:var(--paper);cursor:pointer}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,.6rem + 1vw,1.9rem) clamp(.9rem,.5rem + 1vw,1.5rem)}
@media(max-width:1200px){.pgrid{grid-template-columns:repeat(3,1fr)}}
.pcard{display:flex;flex-direction:column}
.pcard-img{position:relative;aspect-ratio:1/1;overflow:hidden;background:oklch(0.975 0.003 264);display:block}
.pcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.pcard:hover .pcard-img img{transform:scale(1.04)}
.pcard-add{position:absolute;right:.6rem;bottom:.6rem;width:2.2rem;height:2.2rem;border-radius:50%;border:none;background:var(--navy);color:#fff;font-size:1.25rem;line-height:1;cursor:pointer;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.pcard:hover .pcard-add{opacity:1;transform:none}
.pcard-meta{display:flex;flex-direction:column;gap:.15rem;padding:.85rem .1rem 0}
.pcard-brand{font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-soft);font-weight:600}
.pcard-title{font-size:.96rem;font-weight:500;color:var(--navy);line-height:1.2}
.pcard-cat{font-size:.78rem;color:var(--ink-soft)}
.pcard-foot{display:flex;align-items:center;justify-content:space-between;margin-top:.6rem}
.swatches{display:flex;gap:.35rem}
.swatches span{width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.wish{background:none;border:none;cursor:pointer;color:var(--ink-soft);padding:0;display:grid;place-items:center}
.wish svg{width:19px;height:19px}
.wish.on{color:#c0392b}.wish.on svg{fill:currentColor}
.pager{display:flex;align-items:center;justify-content:center;gap:.4rem;margin-top:clamp(2rem,3vw,3.5rem)}
.pager button{min-width:2.2rem;height:2.2rem;border:1px solid var(--line);background:none;border-radius:3px;font-size:.85rem;color:var(--ink-soft);cursor:pointer;font-family:var(--f)}
.pager button.on{border-color:var(--navy);color:var(--navy);font-weight:600}
.pager button:hover{border-color:var(--navy)}
.globe-wm{position:absolute;left:-8rem;bottom:-6rem;width:32rem;height:32rem;opacity:.5;pointer-events:none;z-index:0}
.globe-wm svg{width:100%;height:100%}
.globe-wm .ln{fill:none;stroke:oklch(0.86 0.008 264);stroke-width:.6}
.active-brand{display:flex;align-items:center;gap:.6rem;width:max-content;margin-top:1.2rem;padding:.45rem .55rem .45rem .8rem;background:var(--navy);color:#fff;font-size:.72rem;letter-spacing:.04em}
.active-brand[hidden]{display:none}.active-brand button{border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;font:inherit;padding:.3rem .55rem;cursor:pointer}
@media(max-width:900px){.shopA{grid-template-columns:1fr}.filters{position:static}.pgrid{grid-template-columns:repeat(2,1fr)}.globe-wm{display:none}}
/* catalog list view */
.pgrid.list{grid-template-columns:1fr!important;gap:0}
.pgrid.list .pcard{flex-direction:row;align-items:center;gap:clamp(1rem,2vw,2rem);border-bottom:1px solid var(--line);padding:1.1rem 0}
.pgrid.list .pcard-img{width:clamp(6rem,10vw,9rem);flex:0 0 auto;aspect-ratio:1/1}
.pgrid.list .pcard-meta{padding:0;flex:1}
.pgrid.list .pcard-foot{margin-top:.5rem;max-width:16rem}
/* ================= PRODUCT DETAIL (pdp) ================= */
.pdp{max-width:100rem;margin-inline:auto;padding:clamp(1.5rem,3vh,3rem) var(--edge) 4rem}
.pdp-crumb{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:clamp(1.5rem,3vw,2.5rem)}
.pdp-crumb a{color:var(--ink-soft)}.pdp-crumb a:hover{color:var(--navy)}
.pdp-top{display:grid;grid-template-columns:1.1fr 0.9fr;gap:clamp(2rem,4vw,5rem);align-items:start}
.pdp-gallery{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start}
.pdp-thumbs{display:flex;flex-direction:column;gap:.7rem}
.pdp-thumb{width:4.5rem;height:4.5rem;background:oklch(0.975 0.003 264);border:1px solid var(--line);cursor:pointer;overflow:hidden;padding:0}
.pdp-thumb.on{border-color:var(--navy)}
.pdp-thumb img{width:100%;height:100%;object-fit:cover}
.pdp-main{position:relative;aspect-ratio:1/1;background:oklch(0.975 0.003 264);overflow:hidden}
.pdp-main img{width:100%;height:100%;object-fit:cover}
.pdp-brand{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);font-weight:600;margin-bottom:.6rem}
.pdp-info h1{font-size:clamp(1.8rem,1.2rem + 2vw,2.8rem);font-weight:300;letter-spacing:-0.02em;color:var(--navy);line-height:1.05}
.pdp-desc{color:var(--ink-soft);line-height:1.6;margin-top:1.2rem;max-width:46ch}
.pdp-form{display:flex;gap:.8rem;margin-top:clamp(1.5rem,3vw,2.2rem)}
.pdp-qty{width:4.5rem;border:1px solid var(--line);border-radius:3px;padding:.7rem;font-family:var(--f);font-size:1rem;text-align:center;color:var(--navy)}
.pdp-add{background:var(--navy);color:#fff;border:none;border-radius:3px;padding:.7rem 2rem;font-weight:700;letter-spacing:.08em;font-size:.85rem;cursor:pointer;transition:filter .3s}
.pdp-add:hover{filter:brightness(1.15)}
.pdp-meta{margin-top:clamp(1.5rem,3vw,2.2rem);padding-top:1.2rem;border-top:1px solid var(--line);font-size:.88rem}
.pdp-meta a{color:var(--navy)}
.pdp-specs{margin-top:clamp(2.5rem,5vw,4.5rem);max-width:60rem}
.spec{border-top:1px solid var(--line)}.spec:last-child{border-bottom:1px solid var(--line)}
.spec-h{width:100%;display:flex;justify-content:space-between;align-items:center;background:none;border:none;cursor:pointer;padding:1.2rem 0;font-size:1.05rem;font-weight:500;color:var(--navy);text-align:start}
.spec-h .pm{color:var(--ink-soft);transition:transform .3s;font-size:1.1rem}
.spec.open .spec-h .pm{transform:rotate(45deg)}
.spec-b{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.spec.open .spec-b{max-height:60rem;padding-bottom:1.4rem}
.spec-b p{color:var(--ink-soft);line-height:1.6;max-width:60ch}
.spec-b img{max-width:22rem;margin-top:.5rem}
.pdp-sim{margin-top:clamp(3rem,6vw,6rem)}
.pdp-sim h3{font-size:clamp(1.3rem,1rem + 1.4vw,2rem);font-weight:300;color:var(--navy);margin-bottom:clamp(1.2rem,2.5vw,2rem)}
.pdp-sim .pgrid{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.pdp-top{grid-template-columns:1fr}.pdp-gallery{grid-template-columns:1fr}.pdp-thumbs{flex-direction:row;order:2}.pdp-sim .pgrid{grid-template-columns:repeat(2,1fr)}}
/* pdp color switcher + lightbox */
.pdp-colors{margin-top:1.5rem}
.pdp-colors .lbl{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.6rem;display:block}
.pdp-swatches{display:flex;gap:.6rem}
.pdp-sw{width:2rem;height:2rem;border-radius:50%;border:1px solid rgba(0,0,0,.12);cursor:pointer;padding:0}
.pdp-sw.on{box-shadow:0 0 0 2px var(--paper),0 0 0 3.5px var(--navy)}
.pdp-main{cursor:zoom-in}
.lbox{position:fixed;inset:0;z-index:120;background:oklch(0.18 0.055 264 / .97);display:grid;grid-template-columns:clamp(3rem,7vw,7rem) minmax(0,1fr) clamp(3rem,7vw,7rem);grid-template-rows:minmax(0,1fr) auto;align-items:center;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s .35s;padding:clamp(4.5rem,7vh,6rem) clamp(.5rem,2vw,2rem) 1.25rem}
.lbox.open{opacity:1;visibility:visible;transition:opacity .35s var(--ease)}
.lbox-stage{grid-column:2;grid-row:1;min-width:0;min-height:0;width:100%;height:100%;overflow:hidden;display:grid;place-items:center}
.lbox-stage>img{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}
.lbox-x{position:fixed;top:1.4rem;right:2rem;background:none;border:none;color:#fff;font-size:1.9rem;line-height:1;cursor:pointer;opacity:.85}
.lbox-x:hover{opacity:1}
.lbox-nav{z-index:2;width:100%;height:100%;border:0;background:transparent;color:#fff;font:300 clamp(2.5rem,5vw,4rem)/1 var(--f);cursor:pointer;display:grid;place-items:center;opacity:.72;transition:opacity .25s,background .25s}
.lbox-nav:hover,.lbox-nav:focus-visible{opacity:1;background:rgba(255,255,255,.06);outline:none}
.lbox-prev{grid-column:1;grid-row:1}
.lbox-next{grid-column:3;grid-row:1}
.lbox-count{position:absolute;top:1.8rem;left:2rem;color:rgba(255,255,255,.72);font-size:.68rem;letter-spacing:.16em}
.lbox-thumbs{grid-column:1/-1;grid-row:2;display:flex;justify-content:center;gap:.55rem;padding-top:1rem;overflow-x:auto;scrollbar-width:none}
.lbox-thumbs::-webkit-scrollbar{display:none}
.lbox-thumb{flex:0 0 auto;width:3.4rem;height:3.4rem;padding:0;border:1px solid transparent;background:rgba(255,255,255,.08);cursor:pointer;opacity:.52;transition:opacity .25s,border-color .25s}
.lbox-thumb:hover{opacity:.82}
.lbox-thumb.on{opacity:1;border-color:#fff}
.lbox-thumb img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:640px){
  .lbox{grid-template-columns:2.7rem minmax(0,1fr) 2.7rem;padding:4.5rem .25rem 1rem}
  .lbox-nav{font-size:2.6rem}
  .lbox-x{top:1rem;right:1.15rem}
  .lbox-count{top:1.45rem;left:1.15rem}
  .lbox-thumbs{justify-content:flex-start;padding-inline:.75rem}
  .lbox-thumb{width:3rem;height:3rem}
}

/* ================= STANDARD LAB ================= */
.lab-hero{min-height:calc(100svh - 3.8rem);position:relative;display:flex;align-items:stretch;overflow:hidden;background:var(--navy-deep);color:#fff}
.lab-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.05)}
.lab-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,oklch(.12 .045 264 / .88) 0%,oklch(.15 .045 264 / .58) 48%,oklch(.15 .04 264 / .12) 78%),linear-gradient(0deg,oklch(.12 .04 264 / .55),transparent 52%)}
.lab-hero-inner{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;padding-block:clamp(1.5rem,4vh,3.5rem)}
.lab-hero .crumbs,.lab-hero .crumbs a{color:rgba(255,255,255,.68)}
.lab-hero-copy{margin-top:auto;padding-top:12vh;max-width:55rem}
.lab-hero-copy .eyebrow{color:var(--rust-soft)}
.lab-hero h1{font-size:clamp(3.1rem,1.2rem + 7vw,7.4rem);font-weight:300;line-height:.91;letter-spacing:-.045em;max-width:11ch}
.lab-hero h1 em{font-family:var(--fs);font-weight:300}
.lab-hero .lead{margin-top:1.5rem;max-width:53ch;color:rgba(255,255,255,.8);font-size:clamp(1rem,.88rem + .45vw,1.25rem)}
.lab-hero-cta{margin-top:1.8rem;background:var(--navy);color:#fff}
.lab-hero-cta:hover{background:var(--navy-deep)}
.lab-hero-index{position:absolute;right:var(--edge);bottom:clamp(2rem,5vh,4rem);display:flex;flex-direction:column;align-items:flex-end;color:rgba(255,255,255,.65);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase}
.lab-hero-index strong{font-family:var(--fs);font-size:clamp(2rem,4vw,4rem);font-weight:300;letter-spacing:0;color:#fff;line-height:1}

.lab-definition{display:grid;grid-template-columns:.65fr 1.6fr .75fr;gap:clamp(2rem,4vw,6rem);align-items:start}
.lab-kicker{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);font-weight:700}
.lab-definition h2{font-size:clamp(1.75rem,1rem + 2.4vw,3rem);font-weight:300;line-height:1.12;letter-spacing:-.025em;color:var(--navy);max-width:20ch}
.lab-definition p{margin-top:1.4rem;color:var(--ink-soft);max-width:59ch;font-size:1rem;line-height:1.7}
.lab-def-focus{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,3rem);margin-top:clamp(2.5rem,4vw,4.5rem);grid-column:1/-1}
.lab-def-focus article{border-top:1px solid var(--rust);padding-top:1rem}
.lab-def-focus-icon{display:block;color:var(--rust);margin-bottom:.9rem}
.lab-def-focus h3{font-size:1.15rem;font-weight:400;color:var(--navy);margin-top:0}
.lab-def-focus p{font-size:.9rem;color:var(--ink-soft);margin-top:.5rem;max-width:32ch}
.lab-definition-list{display:flex;flex-direction:column;border-top:1px solid var(--rust)}
.lab-definition-list span{padding:.75rem 0;border-bottom:1px solid var(--d-line);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--d-text)}

.lab-concepts{background:var(--d-bg-2);padding-block:clamp(4rem,7vw,8rem)}
.lab-section-head{display:grid;grid-template-columns:1.25fr .75fr;gap:3rem;align-items:end;margin-bottom:clamp(2rem,4vw,4rem)}
.lab-section-head h2{font-size:clamp(2rem,1rem + 3.2vw,4rem);font-weight:300;letter-spacing:-.035em;color:var(--navy);line-height:1;margin-top:.55rem}
.lab-section-head>p{color:var(--ink-soft);max-width:42ch;justify-self:end}
.lab-concept-grid{display:grid;grid-template-columns:1.45fr .78fr .78fr;gap:clamp(1rem,2vw,2rem);align-items:start}
.lab-concept-image{display:block;overflow:hidden;background:var(--d-tile);aspect-ratio:4/5}
.lab-concept--lead .lab-concept-image{aspect-ratio:4/3}
.lab-concept-image img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.lab-concept:hover .lab-concept-image img{transform:scale(1.035)}
.lab-concept-meta{display:flex;justify-content:space-between;gap:1rem;margin-top:1rem;padding-bottom:.65rem;border-bottom:1px solid var(--d-line);color:var(--d-text-soft);font-size:.61rem;letter-spacing:.12em;text-transform:uppercase}
.lab-concept h3{font-size:clamp(1.15rem,1rem + .5vw,1.55rem);font-weight:400;line-height:1.15;color:#fff;margin-top:.8rem}
.lab-concept p{font-size:.87rem;color:var(--d-text-soft);margin-top:.5rem;max-width:40ch}
.lab-demo-note{font-size:.68rem;color:var(--d-text-soft);margin-top:2.5rem;opacity:.75}

.lab-process-list{--proc-num:2.6rem;list-style:none;position:relative;margin:0;padding:0;max-width:54rem}
.lab-process-list::before{content:"";position:absolute;top:.3rem;bottom:.3rem;left:calc(var(--proc-num) / 2);width:1px;background:var(--line)}
.lab-process-step{list-style:none;display:grid;grid-template-columns:var(--proc-num) 1fr;column-gap:clamp(1.25rem,3vw,2.5rem);align-items:start;padding-block:clamp(1.5rem,2.6vw,2.2rem)}
.lab-process-step:first-child{padding-top:0}
.lab-process-step:last-child{padding-bottom:0}
.lab-process-num{position:relative;z-index:1;width:var(--proc-num);height:var(--proc-num);border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--paper);border:1px solid var(--rust);color:var(--rust);font-family:var(--fs);font-size:.9rem}
.lab-process-body h3{font-size:clamp(1.15rem,1rem + .6vw,1.5rem);font-weight:400;color:var(--navy)}
.lab-process-body p{color:var(--ink-soft);max-width:55ch;margin-top:.5rem}

.lab-publishing{background:var(--paper-2);color:var(--ink);padding-block:clamp(4rem,7vw,8rem)}
.lab-section-head--light h2{color:var(--navy)}.lab-section-head--light .eyebrow{color:var(--ink-soft)}.lab-section-head--light>p{color:var(--ink-soft)}
.lab-stories{display:grid;grid-template-columns:1.5fr .75fr .75fr;gap:clamp(1rem,2vw,2rem)}
.lab-story>a:first-child{display:block;overflow:hidden;aspect-ratio:4/3;background:rgba(0,0,0,.05)}
.lab-story--feature>a:first-child{aspect-ratio:16/10}
/* esiloo banner on lai ja logo vasakul - ankurda vasakusse serva */
.lab-story--feature img{object-position:left center}
.lab-story img{width:100%;height:100%;object-fit:cover;filter:saturate(.72);transition:transform .9s var(--ease),filter .5s}
.lab-story:hover img{transform:scale(1.035);filter:saturate(1)}
.lab-story>div{padding-top:1rem}
.lab-story>div>span{font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.lab-story h3{font-size:clamp(1.15rem,1rem + .8vw,1.75rem);font-weight:400;line-height:1.15;margin-top:.55rem;color:var(--navy)}
.lab-story p{color:var(--ink-soft);font-size:.88rem;margin-top:.7rem;max-width:48ch}
.lab-story .arrow-link{color:var(--navy);margin-top:1.2rem}
/* Loe veel nupp labi lugude all - tume sektsioon, seega valge kontuur */
.lab-stories-more{display:flex;justify-content:center;margin-top:clamp(2.5rem,4vw,4rem)}
body.page-template-template-lab .lab-stories-more a{display:inline-flex;align-items:center;gap:.7rem;padding:.95rem 2.1rem;border:1px solid rgba(255,255,255,.45);color:#fff;font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}
body.page-template-template-lab .lab-stories-more a:hover{background:#fff;color:var(--navy);border-color:#fff}
body.page-template-template-lab .lab-stories-more a .ar{color:inherit;width:2.4rem;height:1px;background:currentColor;position:relative;transition:width .45s var(--ease)}
body.page-template-template-lab .lab-stories-more a .ar::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-inline-end:1px solid currentColor;transform:rotate(45deg)}
body.page-template-template-lab .lab-stories-more a:hover .ar{width:3.2rem}
@media (max-width:640px){.lab-stories-more a{width:100%;justify-content:center}}
.lab-demo-note--dark{color:var(--ink-soft)}

.lab-for>h2{font-size:clamp(2rem,1rem + 3vw,3.8rem);font-weight:300;line-height:1.05;letter-spacing:-.035em;color:var(--navy);max-width:17ch;margin-top:.7rem}
.lab-for-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,3rem);margin-top:clamp(2.5rem,5vw,5rem)}
.lab-for-grid article{border-top:1px solid var(--rust);padding-top:1rem}
.lab-for-grid span{font-family:var(--fs);color:var(--rust)}
.lab-for-grid h3{font-size:1.25rem;color:var(--navy);margin-top:2.5rem}
.lab-for-grid p{font-size:.9rem;color:var(--ink-soft);margin-top:.55rem;max-width:36ch}

.lab-cta{padding-top:0}
.lab-cta>div{position:relative;overflow:hidden;background:var(--paper-2);color:var(--ink);padding:clamp(2.5rem,6vw,6rem)}
.lab-cta>div::after{content:"LAB";position:absolute;right:-.04em;bottom:-.28em;font-family:var(--fs);font-size:clamp(8rem,22vw,21rem);line-height:1;color:rgba(0,0,0,.045);pointer-events:none}
.lab-cta .eyebrow{color:var(--ink-soft)}
.lab-cta h2{font-size:clamp(2rem,1rem + 3.4vw,4.2rem);font-weight:300;line-height:1.02;letter-spacing:-.035em;max-width:16ch;margin-top:.65rem;color:var(--navy)}
.lab-cta p{color:var(--ink-soft);max-width:52ch;margin-top:1rem}
.lab-cta .btn{background:var(--navy);color:#fff;margin-top:1.7rem;position:relative;z-index:1}
.lab-cta .btn:hover{background:var(--navy-deep)}

@media(max-width:900px){
  .lab-definition{grid-template-columns:1fr 2fr}.lab-definition-list{grid-column:2}
  .lab-concept-grid{grid-template-columns:1fr 1fr}.lab-concept--lead{grid-column:1/-1}
  .lab-stories{grid-template-columns:1fr 1fr}.lab-story--feature{grid-column:1/-1}
}
@media(max-width:640px){
  .lab-hero{min-height:calc(100svh - 3.4rem)}.lab-hero-copy{padding-top:6rem}.lab-hero-index{display:none}
  .lab-definition{grid-template-columns:1fr}.lab-definition-list{grid-column:auto}
  .lab-section-head{grid-template-columns:1fr;gap:1rem;align-items:start}.lab-section-head>p{justify-self:start}
  .lab-concept-grid,.lab-stories,.lab-for-grid,.lab-def-focus{grid-template-columns:1fr}.lab-concept--lead,.lab-story--feature{grid-column:auto}
  .lab-concept-image,.lab-concept--lead .lab-concept-image,.lab-story>a:first-child,.lab-story--feature>a:first-child{aspect-ratio:4/3}
  .lab-process-list{--proc-num:2.2rem}
}

/* ================= REFERENTSID / TEHTUD TÖÖD ================= */
.ref-layout{display:grid;grid-template-columns:minmax(19rem,31vw) 1fr;min-height:100vh;background:var(--paper)}
.ref-side{border-inline-end:1px solid var(--line);position:relative}
.ref-side-inner{position:sticky;top:3.8rem;height:calc(100svh - 3.8rem);padding:clamp(3rem,6vh,6rem) clamp(2rem,3.4vw,4rem) clamp(2rem,4vh,3rem);display:flex;flex-direction:column}
.ref-intro .eyebrow{display:block;margin-bottom:clamp(1rem,2vh,1.7rem)}
.ref-intro h1{font-size:clamp(2.2rem,1.25rem + 3vw,4.2rem);font-weight:300;line-height:1.06;letter-spacing:-.035em;color:var(--navy)}
.ref-intro h1 em{font-family:var(--fs);font-weight:300}
.ref-intro p{font-size:clamp(.86rem,.8rem + .18vw,.98rem);line-height:1.65;color:var(--ink-soft);max-width:38ch;margin-top:clamp(1.4rem,3vh,2.2rem)}
.ref-filters{margin-top:clamp(2rem,5vh,4.5rem);display:flex;flex-direction:column}
.ref-filter{display:grid;grid-template-columns:1fr auto 1.5rem;align-items:center;gap:1rem;width:100%;border:0;border-bottom:1px solid transparent;background:none;padding:.75rem 0;text-align:start;color:var(--ink-soft);font-family:var(--f);font-size:.82rem;cursor:pointer;transition:color .25s,border-color .25s}
.ref-filter span:nth-child(2){font-variant-numeric:tabular-nums}
.ref-filter i{font-style:normal;font-size:1rem;opacity:0;transform:translateX(-5px);transition:opacity .25s,transform .25s}
.ref-filter:hover,.ref-filter.on{color:var(--navy)}
.ref-filter.on{border-bottom-color:var(--navy);font-weight:600}
.ref-filter:hover i,.ref-filter.on i{opacity:1;transform:none}
.ref-download{display:flex;align-items:center;gap:1rem;margin-top:auto;color:var(--navy)}
.ref-download>span:first-child{width:2.4rem;height:2.4rem;border:1px solid var(--navy);border-radius:50%;display:grid;place-items:center;font-size:1.1rem}
.ref-download>span:last-child{font-size:.65rem;letter-spacing:.11em;text-transform:uppercase;font-weight:700}
.ref-download i{display:block;width:3rem;height:1px;background:var(--navy);margin-top:.5rem;transition:width .3s}
.ref-download:hover i{width:5rem}

.ref-results{min-width:0}
.ref-results-top{height:3.3rem;padding:0 clamp(1rem,2vw,2rem);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft)}
.ref-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.ref-card{min-width:0;border-bottom:1px solid var(--line);transition:opacity .25s}
.ref-card:nth-child(odd){border-inline-end:1px solid var(--line)}
.ref-card[hidden]{display:none}
.ref-image{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--paper-2)}
.ref-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease),filter .5s}
.ref-card:hover .ref-image img{transform:scale(1.025);filter:saturate(1.06)}
.ref-meta{min-height:5.5rem;display:grid;grid-template-columns:1fr auto 2rem;align-items:center;gap:1.2rem;padding:1rem clamp(1rem,2vw,1.6rem)}
.ref-meta h2{font-size:.72rem;line-height:1.25;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:var(--navy)}
.ref-meta p{font-size:.72rem;color:var(--ink-soft);margin-top:.32rem}
.ref-year{font-size:.72rem;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.ref-arrow{font-size:1.15rem;color:var(--navy);transition:transform .3s}
.ref-card:hover .ref-arrow{transform:translateX(5px)}
.ref-more{display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:clamp(2rem,4vw,4rem) clamp(1rem,2vw,2rem);background:var(--paper-2);font-size:.86rem;color:var(--ink-soft)}
.ref-more a{color:var(--navy);font-weight:600}

@media(max-width:980px){
  .ref-layout{grid-template-columns:17rem 1fr}.ref-side-inner{padding-inline:1.5rem}
  .ref-grid{grid-template-columns:1fr}.ref-card:nth-child(odd){border-inline-end:0}
}
@media(max-width:700px){
  .ref-layout{display:block}.ref-side{border-inline-end:0}
  .ref-side-inner{position:static;height:auto;padding:3rem var(--edge) 1.5rem}
  .ref-intro h1{font-size:clamp(2.5rem,11vw,3.7rem)}
  .ref-filters{margin-top:2rem;display:flex;flex-direction:row;overflow-x:auto;gap:.5rem;padding-bottom:.4rem;scrollbar-width:none}
  .ref-filters::-webkit-scrollbar{display:none}
  .ref-filter{display:flex;flex:0 0 auto;width:auto;border:1px solid var(--line);border-radius:3rem;padding:.6rem 1rem;gap:.5rem;white-space:nowrap}
  .ref-filter.on{background:var(--navy);border-color:var(--navy);color:#fff}.ref-filter i{display:none}
  .ref-download{margin-top:2rem}.ref-results-top{height:auto;padding-block:1rem}
  .ref-grid{grid-template-columns:1fr}.ref-meta{min-height:5rem}
  .ref-more{align-items:flex-start;flex-direction:column}
}

/* Interactive work index — editorial grid / list / gallery */
.work-index{position:relative;padding:clamp(4rem,8vw,8rem) 0 9rem;min-height:100vh}
.work-intro{padding-bottom:clamp(5rem,12vw,11rem)}
.work-intro .eyebrow{display:block}
.work-intro h1{font-size:clamp(3rem,1rem + 6.4vw,7rem);font-weight:300;line-height:.94;letter-spacing:-.045em;color:var(--navy);margin-top:1.2rem}
.work-intro h1>span{display:block;overflow:hidden}
.work-intro h1 em{font-family:var(--fs);font-weight:300}
.work-intro p{max-width:46ch;color:var(--ink-soft);margin-top:1.5rem;font-size:clamp(.9rem,.82rem + .25vw,1.05rem)}
.work-grid{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));column-gap:clamp(.8rem,1.6vw,1.8rem);row-gap:0;align-items:start;transition:opacity .3s}
.work-card{display:flex;flex-direction:column;gap:.8rem;min-width:0}
.work-card:nth-child(8n+1){grid-column:1/8}
.work-card:nth-child(8n+2){grid-column:9/-1;margin-top:10rem}
.work-card:nth-child(8n+3){grid-column:1/5;margin-top:20rem}
.work-card:nth-child(8n+4){grid-column:6/12;margin-top:8rem}
.work-card:nth-child(8n+5){grid-column:9/-1;margin-top:-7rem}
.work-card:nth-child(8n+6){grid-column:4/9;margin-top:12rem}
.work-card:nth-child(8n+7){grid-column:1/8;margin-top:17rem}
.work-card:nth-child(8n+8){grid-column:9/-1;margin-top:7rem}
.work-media{height:clamp(20rem,38vw,34rem);overflow:hidden;background:var(--paper-2)}
.work-card:nth-child(8n+3) .work-media,.work-card:nth-child(8n+5) .work-media,.work-card:nth-child(8n+6) .work-media{height:clamp(22rem,43vw,38rem)}
.work-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.17,.84,.44,1)}
.work-card:hover .work-media img{transform:scale(1.035)}
.work-info{display:flex;justify-content:space-between;gap:1.5rem;color:var(--navy)}
.work-title-mask,.work-side-mask{overflow:hidden}
.work-info h2{font-size:clamp(.9rem,.8rem + .35vw,1.15rem);font-weight:400;line-height:1.15}
.work-side{font-family:var(--fs);font-size:.8rem;text-align:end;position:relative}
.work-side span{display:block;transition:transform .6s cubic-bezier(.17,.84,.44,1)}
.work-side span:last-child{position:absolute;right:0;top:0;transform:translateY(110%)}
.work-card:hover .work-side span:first-child{transform:translateY(-110%)}
.work-card:hover .work-side span:last-child{transform:none}

.work-view{position:fixed;right:clamp(1rem,2vw,2rem);bottom:clamp(1rem,2vw,2rem);z-index:45;display:flex;gap:.25rem;padding:.3rem;background:rgba(250,250,249,.9);border:1px solid var(--line);backdrop-filter:blur(12px)}
.work-view button{display:flex;align-items:center;gap:.45rem;border:0;background:none;color:var(--ink-soft);font:600 .66rem/1 var(--f);padding:.65rem .75rem;cursor:pointer;transition:background .25s,color .25s}
.work-view button.on{background:var(--navy);color:#fff}
.work-view svg{width:16px;height:11px;fill:currentColor}
.work-list-preview{position:fixed;z-index:0;inset:12vh 8vw 12vh auto;width:min(42vw,42rem);pointer-events:none;opacity:0;visibility:hidden;overflow:hidden;background:var(--paper-2)}
.work-list-preview img{width:100%;height:100%;object-fit:cover}

/* List view */
.work-index[data-view="list"] .work-intro{padding-bottom:4rem}
.work-index[data-view="list"] .work-grid{display:flex;flex-direction:column;position:relative;z-index:1;padding-inline-end:48vw}
.work-index[data-view="list"] .work-card{width:100%;display:grid;grid-template-columns:1fr;margin:0!important;border-top:1px solid var(--line);padding:1rem 0}
.work-index[data-view="list"] .work-card:last-child{border-bottom:1px solid var(--line)}
.work-index[data-view="list"] .work-media{display:none}
.work-index[data-view="list"] .work-info h2{font-size:clamp(1.25rem,1rem + 1.3vw,2.1rem)}
.work-index[data-view="list"] .work-list-preview{opacity:1;visibility:visible}

/* Gallery view */
.work-index[data-view="gallery"]{padding-bottom:6rem;overflow:hidden}
.work-index[data-view="gallery"] .work-intro{padding-bottom:4rem}
.work-index[data-view="gallery"] .work-grid{display:flex;gap:clamp(1rem,2vw,2rem);overflow-x:auto;padding:0 var(--edge) 2rem;max-width:none;scroll-snap-type:x mandatory;scrollbar-width:none}
.work-index[data-view="gallery"] .work-grid::-webkit-scrollbar{display:none}
.work-index[data-view="gallery"] .work-card{flex:0 0 min(68vw,58rem);margin:0!important;scroll-snap-align:center}
.work-index[data-view="gallery"] .work-card:nth-child(even){flex-basis:min(42vw,36rem);padding-top:10vh}
.work-index[data-view="gallery"] .work-media,.work-index[data-view="gallery"] .work-card:nth-child(n) .work-media{height:min(62vh,43rem)}

@media(max-width:767px){
  .work-index{padding-top:3rem}.work-intro{padding-bottom:4rem}
  .work-intro h1{font-size:clamp(2.8rem,13vw,4.2rem)}
  .work-grid{display:flex;flex-direction:column;gap:3.5rem}
  .work-card,.work-card:nth-child(n){width:100%;margin:0;display:flex}
  .work-media,.work-card:nth-child(n) .work-media{height:auto;aspect-ratio:4/3}
  .work-info{align-items:start}.work-info h2{font-size:1rem}.work-side{font-size:.72rem}
  .work-view{right:.75rem;bottom:.75rem}.work-view button{padding:.62rem}.work-view button span{display:none}
  .work-index[data-view="list"] .work-grid{padding-inline-end:var(--edge)}
  .work-index[data-view="list"] .work-list-preview{display:none}
  .work-index[data-view="gallery"] .work-grid{flex-direction:row}
  .work-index[data-view="gallery"] .work-card,.work-index[data-view="gallery"] .work-card:nth-child(even){flex:0 0 82vw;padding-top:0}
  .work-index[data-view="gallery"] .work-media,.work-index[data-view="gallery"] .work-card:nth-child(n) .work-media{height:58vh;aspect-ratio:auto}
}

/* Work index v2 — video-matched three-view system */
.work-page-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.work-index{padding:clamp(6rem,13vh,10rem) 0 10rem}
.work-index .work-grid{min-height:100vh}
.work-images{width:100%}
.work-shot{display:none;overflow:hidden;background:#f4f4f2}
.work-shot:first-child{display:block;height:100%}
.work-shot img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.17,.84,.44,1),opacity .35s}
.work-card:hover .work-shot:first-child img{transform:scale(1.035)}
.work-card:nth-child(8n+1) .work-images,.work-card:nth-child(8n+2) .work-images{height:clamp(22rem,39vw,39rem)}
.work-card:nth-child(8n+3) .work-images,.work-card:nth-child(8n+5) .work-images,.work-card:nth-child(8n+6) .work-images{height:clamp(24rem,44vw,43rem)}
.work-card:nth-child(8n+4) .work-images,.work-card:nth-child(8n+7) .work-images,.work-card:nth-child(8n+8) .work-images{height:clamp(21rem,36vw,36rem)}
.work-view{left:50%;right:auto;bottom:1rem;transform:translateX(-50%);border:0;border-radius:4px;background:rgba(245,245,243,.9);box-shadow:0 1px 8px rgba(20,28,43,.06)}
.work-view button{padding:.55rem .65rem;font-weight:400;color:#929292}
.work-view button.on{background:transparent;color:#111;font-weight:600}

/* List: project names at left, each project's image contact sheet at right */
.work-index[data-view="list"]{padding-top:clamp(7rem,15vh,11rem)}
.work-index[data-view="list"] .work-grid{display:flex;flex-direction:column;padding-inline-end:var(--edge)}
.work-index[data-view="list"] .work-card{display:grid;grid-template-columns:minmax(15rem,1fr) minmax(30rem,1.35fr);gap:clamp(3rem,8vw,9rem);align-items:start;width:100%;margin:0!important;padding:0 0 clamp(4rem,8vw,8rem);border:0}
.work-index[data-view="list"] .work-info{grid-column:1;grid-row:1;display:block}
.work-index[data-view="list"] .work-title-mask{overflow:visible}
.work-index[data-view="list"] .work-info h2{font-size:clamp(2rem,1.2rem + 2.3vw,4rem);font-weight:300;line-height:.92;letter-spacing:-.045em;max-width:10ch}
.work-index[data-view="list"] .work-side-mask{margin-top:1rem;color:var(--ink-soft)}
.work-index[data-view="list"] .work-side{text-align:start;font-family:var(--f);font-size:.72rem}
.work-index[data-view="list"] .work-images{grid-column:2;grid-row:1;display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(.55rem,1vw,1rem);height:auto}
.work-index[data-view="list"] .work-shot{display:block;height:auto;aspect-ratio:4/3}
.work-index[data-view="list"] .work-shot:nth-child(1){grid-column:span 2}
.work-index[data-view="list"] .work-shot:nth-child(2){grid-column:span 2}
.work-index[data-view="list"] .work-shot:nth-child(3){grid-column:span 2}
.work-index[data-view="list"] .work-card:hover .work-shot img{transform:scale(1.035)}

/* Gallery: all images become one free-form contact sheet */
.work-index[data-view="gallery"]{padding:clamp(5rem,9vh,7rem) 0 7rem;overflow:visible}
.work-index[data-view="gallery"] .work-grid{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));grid-auto-rows:clamp(1.7rem,3vw,3.4rem);gap:clamp(.45rem,.8vw,.9rem);padding-inline:var(--edge);overflow:visible;max-width:none}
.work-index[data-view="gallery"] .work-card{display:contents}
.work-index[data-view="gallery"] .work-images{display:contents}
.work-index[data-view="gallery"] .work-shot{display:block;height:auto!important;aspect-ratio:auto;margin:0!important}
.work-index[data-view="gallery"] .work-info{display:none}
.work-index[data-view="gallery"] .work-card:nth-child(1) .work-shot:nth-child(1){grid-column:2/8;grid-row:2/7}
.work-index[data-view="gallery"] .work-card:nth-child(1) .work-shot:nth-child(2){grid-column:9/13;grid-row:1/5}
.work-index[data-view="gallery"] .work-card:nth-child(1) .work-shot:nth-child(3){grid-column:14/20;grid-row:3/9}
.work-index[data-view="gallery"] .work-card:nth-child(2) .work-shot:nth-child(1){grid-column:20/24;grid-row:1/5}
.work-index[data-view="gallery"] .work-card:nth-child(2) .work-shot:nth-child(2){grid-column:4/10;grid-row:8/14}
.work-index[data-view="gallery"] .work-card:nth-child(2) .work-shot:nth-child(3){grid-column:11/15;grid-row:10/14}
.work-index[data-view="gallery"] .work-card:nth-child(3) .work-shot:nth-child(1){grid-column:16/23;grid-row:10/17}
.work-index[data-view="gallery"] .work-card:nth-child(3) .work-shot:nth-child(2){grid-column:1/5;grid-row:15/20}
.work-index[data-view="gallery"] .work-card:nth-child(3) .work-shot:nth-child(3){grid-column:6/11;grid-row:16/22}
.work-index[data-view="gallery"] .work-card:nth-child(4) .work-shot:nth-child(1){grid-column:12/18;grid-row:18/24}
.work-index[data-view="gallery"] .work-card:nth-child(4) .work-shot:nth-child(2){grid-column:19/24;grid-row:19/25}
.work-index[data-view="gallery"] .work-card:nth-child(4) .work-shot:nth-child(3){grid-column:2/8;grid-row:23/29}
.work-index[data-view="gallery"] .work-card:nth-child(5) .work-shot:nth-child(1){grid-column:9/14;grid-row:25/31}
.work-index[data-view="gallery"] .work-card:nth-child(5) .work-shot:nth-child(2){grid-column:15/21;grid-row:27/34}
.work-index[data-view="gallery"] .work-card:nth-child(5) .work-shot:nth-child(3){grid-column:21/25;grid-row:27/32}
.work-index[data-view="gallery"] .work-card:nth-child(6) .work-shot:nth-child(1){grid-column:1/7;grid-row:32/39}
.work-index[data-view="gallery"] .work-card:nth-child(6) .work-shot:nth-child(2){grid-column:8/12;grid-row:34/39}
.work-index[data-view="gallery"] .work-card:nth-child(6) .work-shot:nth-child(3){grid-column:13/19;grid-row:35/42}
.work-index[data-view="gallery"] .work-card:nth-child(7) .work-shot:nth-child(1){grid-column:19/24;grid-row:35/41}
.work-index[data-view="gallery"] .work-card:nth-child(7) .work-shot:nth-child(2){grid-column:3/9;grid-row:41/47}
.work-index[data-view="gallery"] .work-card:nth-child(7) .work-shot:nth-child(3){grid-column:10/14;grid-row:43/48}
.work-index[data-view="gallery"] .work-card:nth-child(8) .work-shot:nth-child(1){grid-column:15/22;grid-row:44/51}
.work-index[data-view="gallery"] .work-card:nth-child(8) .work-shot:nth-child(2){grid-column:1/6;grid-row:49/55}
.work-index[data-view="gallery"] .work-card:nth-child(8) .work-shot:nth-child(3){grid-column:7/13;grid-row:50/56}

@media(max-width:767px){
  .work-index{padding-top:4rem}
  .work-card:nth-child(n) .work-images{height:auto;aspect-ratio:4/3}
  .work-shot:first-child{height:100%}
  .work-index[data-view="list"] .work-card{grid-template-columns:1fr;gap:1.5rem;padding-bottom:4rem}
  .work-index[data-view="list"] .work-info,.work-index[data-view="list"] .work-images{grid-column:1}
  .work-index[data-view="list"] .work-info{grid-row:1}.work-index[data-view="list"] .work-images{grid-row:2}
  .work-index[data-view="list"] .work-info h2{font-size:2.25rem}
  .work-index[data-view="gallery"] .work-grid{grid-auto-rows:1.15rem}
}

/* Wider work canvas + filtering */
.work-index .work-grid{max-width:none;width:100%;padding-inline:clamp(1.25rem,2.1vw,2.25rem)}
.work-filters{position:fixed;z-index:44;top:clamp(4.6rem,7vh,5.6rem);left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:.2rem;padding:.25rem;background:rgba(250,250,249,.88);backdrop-filter:blur(12px);border-radius:3px}
.work-filters button{border:0;background:transparent;color:var(--ink-soft);font:500 .63rem/1 var(--f);letter-spacing:.04em;padding:.55rem .7rem;white-space:nowrap;cursor:pointer;transition:color .25s,background .25s}
.work-filters button:hover{color:var(--navy)}
.work-filters button.on{background:var(--navy);color:#fff}
.work-card[hidden]{display:none!important}
.work-index[data-view="gallery"] .work-grid{grid-auto-flow:dense}
.work-index[data-view="gallery"] .work-card:nth-child(n) .work-shot:nth-child(n){grid-column:auto;grid-row:auto}
.work-index[data-view="gallery"] .work-card:nth-child(4n+1) .work-shot:nth-child(1){grid-column:span 6;grid-row:span 5}
.work-index[data-view="gallery"] .work-card:nth-child(4n+1) .work-shot:nth-child(2){grid-column:span 4;grid-row:span 4}
.work-index[data-view="gallery"] .work-card:nth-child(4n+1) .work-shot:nth-child(3){grid-column:span 6;grid-row:span 6}
.work-index[data-view="gallery"] .work-card:nth-child(4n+2) .work-shot:nth-child(1){grid-column:span 5;grid-row:span 4}
.work-index[data-view="gallery"] .work-card:nth-child(4n+2) .work-shot:nth-child(2){grid-column:span 7;grid-row:span 6}
.work-index[data-view="gallery"] .work-card:nth-child(4n+2) .work-shot:nth-child(3){grid-column:span 4;grid-row:span 5}
.work-index[data-view="gallery"] .work-card:nth-child(4n+3) .work-shot:nth-child(1){grid-column:span 7;grid-row:span 7}
.work-index[data-view="gallery"] .work-card:nth-child(4n+3) .work-shot:nth-child(2){grid-column:span 4;grid-row:span 4}
.work-index[data-view="gallery"] .work-card:nth-child(4n+3) .work-shot:nth-child(3){grid-column:span 5;grid-row:span 6}
.work-index[data-view="gallery"] .work-card:nth-child(4n+4) .work-shot:nth-child(1){grid-column:span 6;grid-row:span 5}
.work-index[data-view="gallery"] .work-card:nth-child(4n+4) .work-shot:nth-child(2){grid-column:span 5;grid-row:span 6}
.work-index[data-view="gallery"] .work-card:nth-child(4n+4) .work-shot:nth-child(3){grid-column:span 7;grid-row:span 6}

/* ================= SINGLE REFERENCE ================= */
.case{background:var(--paper)}
.case-hero{position:relative;height:calc(100svh - 3.8rem);min-height:38rem;color:#fff;overflow:hidden;padding:0}
.case-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case-hero-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,18,39,.62),transparent 50%),linear-gradient(180deg,rgba(8,18,39,.26),transparent 24%)}
.case-hero-head{position:absolute;z-index:2;left:var(--edge);right:var(--edge);top:1.5rem;display:flex;justify-content:space-between;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}
.case-hero-title{position:absolute;z-index:2;left:var(--edge);right:var(--edge);bottom:clamp(2rem,5vh,4rem);display:flex;align-items:end;justify-content:space-between;gap:2rem}
.case-hero-title h1{font-size:clamp(3.5rem,1rem + 8vw,9rem);font-weight:300;line-height:.82;letter-spacing:-.055em}
.case-hero-title>div{display:flex;align-items:end;gap:clamp(2rem,5vw,5rem)}
.case-hero-title>div>span{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}
.case-hero-title strong{font-family:var(--fs);font-size:clamp(4rem,8vw,8rem);font-weight:300;line-height:.72}
.case-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(3rem,8vw,9rem);align-items:start}
.case-intro h2{font-size:clamp(2rem,1rem + 3vw,4rem);font-weight:300;line-height:1.05;color:var(--navy);margin-top:.8rem;max-width:17ch}
.case-intro p{color:var(--ink-soft);font-size:1.05rem;line-height:1.7;max-width:52ch}
.case-intro dl{margin-top:2.5rem;border-top:1px solid var(--line)}
.case-intro dl div{display:grid;grid-template-columns:8rem 1fr;padding:.75rem 0;border-bottom:1px solid var(--line);font-size:.78rem}
.case-intro dt{color:var(--ink-soft)}.case-intro dd{color:var(--navy)}
.case-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(.7rem,1.4vw,1.5rem);padding:0 clamp(1rem,2vw,2rem) clamp(4rem,8vw,8rem)}
.case-gallery figure{overflow:hidden;aspect-ratio:4/3}.case-gallery .case-wide{grid-column:1/-1;aspect-ratio:16/9}
.case-gallery img{width:100%;height:100%;object-fit:cover}
.case-gallery blockquote{display:grid;place-items:center;min-height:24rem;padding:3rem;background:var(--navy);color:#fff}
.case-gallery blockquote p{font-family:var(--fs);font-style:italic;font-size:clamp(1.5rem,1rem + 2vw,3rem);line-height:1.25;max-width:18ch}
.case-next{padding:0 var(--edge) clamp(4rem,8vw,8rem)}
.case-next a{display:grid;grid-template-columns:1fr auto;gap:1rem;border-top:1px solid var(--navy);padding-top:1.2rem;color:var(--navy)}
.case-next a>span:first-child{grid-column:1/-1;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase}
.case-next h2{font-size:clamp(2rem,1rem + 3vw,4rem);font-weight:300}
.case-next a>span:last-child{font-size:2rem}

@media(max-width:767px){
  .work-filters{position:sticky;top:3.5rem;left:auto;transform:none;justify-content:flex-start;overflow-x:auto;margin:0 var(--edge) 2rem;z-index:44}
  .work-index{padding-top:1rem}.work-index .work-grid{padding-inline:var(--edge)}
  .case-hero{height:calc(100svh - 3.4rem);min-height:34rem}
  .case-hero-title{display:block}.case-hero-title h1{font-size:clamp(3.5rem,15vw,5.5rem)}
  .case-hero-title>div{margin-top:2rem;justify-content:space-between}
  .case-intro{grid-template-columns:1fr}.case-gallery{grid-template-columns:1fr}
  .case-gallery .case-wide{grid-column:auto;aspect-ratio:4/3}
}

/* Single reference v2 — Detail / Masonry / Slider */
.page:has(.case) .site-head{position:absolute;inset:0 0 auto 0;background:transparent;border-bottom:0;color:#fff}
.page:has(.case) .site-head .logo,.page:has(.case) .site-head .icon-btn,.page:has(.case) .site-head .menu-toggle,.page:has(.case) .site-head .lang{color:#fff}
.page:has(.case) .site-head .site-nav a{color:#fff}.page:has(.case) .site-head .site-nav a::after{background:#fff}
.page:has(.case[data-case-view="masonry"]) .site-head .logo,.page:has(.case[data-case-view="masonry"]) .site-head .icon-btn,.page:has(.case[data-case-view="masonry"]) .site-head .menu-toggle,.page:has(.case[data-case-view="masonry"]) .site-head .lang{color:var(--navy)}
.case{min-height:100vh}
.case-mode[aria-hidden="true"]{display:none}
.case .case-hero{height:100svh;min-height:42rem}
.case-hero-title{bottom:1.6rem}
.case-hero-title .case-title-mask{overflow:hidden}
.case-hero-title .case-title-mask>span{display:block;font-size:clamp(3.2rem,1rem + 6vw,7rem);font-weight:300;line-height:.86;letter-spacing:-.055em}
.case-detail-flow{padding:clamp(7rem,13vw,14rem) clamp(1rem,2vw,2rem);display:flex;flex-direction:column;gap:clamp(6rem,12vw,13rem)}
.case-detail-flow figure{overflow:hidden}
.case-detail-flow img{width:100%;height:100%;object-fit:cover}
.case-detail-wide{width:min(82vw,88rem);height:min(72vh,50rem);align-self:center}
.case-detail-pair{display:grid;grid-template-columns:.75fr 1.1fr;gap:clamp(4rem,12vw,14rem);align-items:end;padding-inline:clamp(1rem,6vw,7rem)}
.case-detail-pair figure:first-child{height:min(52vh,35rem)}.case-detail-pair figure:last-child{height:min(68vh,46rem)}
.case-detail-copy{display:grid;grid-template-columns:.55fr 1fr;gap:4rem;width:min(68rem,82vw);margin-inline:auto;border-top:1px solid var(--line);padding-top:1rem}
.case-detail-copy span{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.case-detail-copy p{font-family:var(--fs);font-size:clamp(1rem,.94rem + .3vw,1.15rem);line-height:1.65;color:var(--navy)}
.case-detail-triplet{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,3vw,3rem);align-items:center}
.case-detail-triplet figure:nth-child(1){height:38vw}.case-detail-triplet figure:nth-child(2){height:26vw}.case-detail-triplet figure:nth-child(3){height:34vw}

.case-masonry{min-height:100vh;padding:clamp(6rem,10vh,8rem) clamp(1rem,2vw,2rem) 7rem}
.case-masonry-grid{display:grid;grid-template-columns:repeat(24,1fr);grid-auto-rows:clamp(1.7rem,3vw,3.4rem);gap:clamp(.5rem,.9vw,1rem);grid-auto-flow:dense}
.case-masonry-grid figure{overflow:hidden;background:var(--paper-2)}
.case-masonry-grid img{width:100%;height:100%;object-fit:cover}
.case-masonry-grid figure:nth-child(1){grid-column:2/9;grid-row:2/9}
.case-masonry-grid figure:nth-child(2){grid-column:11/16;grid-row:1/6}
.case-masonry-grid figure:nth-child(3){grid-column:17/23;grid-row:3/10}
.case-masonry-grid figure:nth-child(4){grid-column:1/6;grid-row:11/17}
.case-masonry-grid figure:nth-child(5){grid-column:7/14;grid-row:10/18}
.case-masonry-grid figure:nth-child(6){grid-column:16/24;grid-row:12/20}
.case-masonry-grid figure:nth-child(7){grid-column:3/10;grid-row:20/27}
.case-masonry-grid figure:nth-child(8){grid-column:12/17;grid-row:21/27}
.case-masonry-grid figure:nth-child(9){grid-column:18/23;grid-row:22/29}

.case-slider{position:relative;height:100svh;min-height:38rem;background:#111;color:#fff;overflow:hidden}
.page:has(.case[data-case-view="slider"]){overflow:hidden}
.case[data-case-view="slider"] .case-slider{position:fixed;inset:0;z-index:50;height:auto;min-height:0}
.case-slides,.case-slides figure{position:absolute;inset:0}
.case-slides figure{opacity:0;visibility:hidden}
.case-slides figure.on{opacity:1;visibility:visible}
.case-slides img{width:100%;height:100%;object-fit:cover}
.case-slider::after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,rgba(5,12,24,.55));pointer-events:none}
.case-slider-title{position:absolute;z-index:2;left:var(--edge);right:var(--edge);bottom:1.5rem;display:flex;justify-content:space-between;align-items:end}
.case-slider-title>span{font-size:clamp(3rem,1rem + 5vw,6.5rem);line-height:.86;letter-spacing:-.05em}
.case-slider-title strong{font-family:var(--fs);font-size:clamp(3.5rem,7vw,7rem);font-weight:300;line-height:.75}.case-slider-title strong i{font-style:normal}
.case-prev,.case-next-btn{position:absolute;z-index:3;top:50%;transform:translateY(-50%);border:0;background:rgba(8,18,39,.24);color:#fff;font:500 .68rem/1 var(--f);padding:1rem .8rem;cursor:pointer}
.case-prev{left:var(--edge)}.case-next-btn{right:var(--edge)}
.case-view{position:fixed;z-index:80;left:50%;bottom:1rem;transform:translateX(-50%);display:flex;padding:.28rem;background:rgba(245,245,243,.9);backdrop-filter:blur(10px);border-radius:3px;box-shadow:0 1px 8px rgba(20,28,43,.08)}
.case-view button{border:0;background:none;color:#999;font:500 .64rem/1 var(--f);padding:.55rem .7rem;cursor:pointer}
.case-view button.on{color:#111;font-weight:700}

@media(max-width:767px){
  .case .case-hero{min-height:36rem}
  .case-detail-wide{width:100%;height:58vh}
  .case-detail-pair{grid-template-columns:1fr;gap:2rem;padding-inline:0}.case-detail-pair figure:first-child,.case-detail-pair figure:last-child{height:auto;aspect-ratio:4/3}
  .case-detail-copy{grid-template-columns:1fr;gap:1rem;width:100%}
  .case-detail-triplet{grid-template-columns:1fr}.case-detail-triplet figure:nth-child(n){height:auto;aspect-ratio:4/3}
  .case-masonry-grid{grid-template-columns:repeat(12,1fr);grid-auto-rows:1.3rem}.case-masonry-grid figure:nth-child(n){grid-column:auto / span 6;grid-row:auto / span 6}.case-masonry-grid figure:nth-child(3n){grid-column:span 8;grid-row:span 7}
  .case-slider-title>span{font-size:3.2rem}
}

/* ================= BRANDS ================= */
.brand-intro{padding:clamp(7rem,12vw,12rem) var(--edge) clamp(5rem,9vw,9rem);background:var(--paper)}
.brand-intro .crumbs{color:var(--ink-soft);padding:0 0 clamp(5rem,10vw,10rem)}
.brand-intro h1{font-family:var(--fs);font-size:clamp(4rem,1rem + 7vw,10rem);font-weight:300;line-height:.88;letter-spacing:-.055em;color:var(--navy);margin-top:1.5rem}
.brand-intro h1 em{color:var(--ink-soft);font-weight:300}
.brand-intro>div:last-child{display:flex;justify-content:space-between;align-items:end;gap:3rem;margin:clamp(4rem,7vw,7rem) 0 0 auto;width:min(65rem,78%)}
.brand-intro>div:last-child p{max-width:43ch;color:var(--ink-soft);font-size:clamp(1rem,.8rem + .5vw,1.35rem);line-height:1.6}
.brand-intro>div:last-child span{font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap}
.brand-directory{padding:0 var(--edge) clamp(7rem,12vw,12rem);background:var(--paper)}
.brand-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-inline-start:1px solid var(--line)}
.brand-tile{position:relative;aspect-ratio:1/1;border-inline-end:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:#fff}
.brand-face{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff;padding:clamp(1rem,2vw,2rem);display:grid;grid-template-rows:1fr auto;place-items:center;cursor:pointer;color:var(--navy);transition:background .4s var(--ease)}
.brand-face img{width:72%;height:58%;object-fit:contain;filter:grayscale(1);mix-blend-mode:multiply;transition:transform .6s var(--ease),filter .4s}
.brand-face>span{justify-self:start;font:600 .65rem/1 var(--f);letter-spacing:.1em;text-transform:uppercase}
.brand-face i{position:absolute;right:1rem;bottom:1rem;font-size:1.1rem;font-style:normal;font-weight:300;transition:transform .4s}
.brand-tile:hover .brand-face{background:var(--paper-2)}.brand-tile:hover .brand-face img{filter:grayscale(0);transform:scale(1.04)}
.brand-actions{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;padding:clamp(1.2rem,2vw,2rem);background:var(--navy-deep);color:#fff;transform:translateY(101%);transition:transform .55s var(--ease)}
.brand-tile.open .brand-actions{transform:none}.brand-actions strong{font-family:var(--fs);font-size:clamp(1.4rem,1rem + 1vw,2.2rem);font-weight:300;margin-bottom:auto}
.brand-close{position:absolute;right:1rem;top:1rem;border:0;background:none;color:#fff;font-size:1.5rem;line-height:1;cursor:pointer}
.brand-actions a{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.25);padding:1rem 0;font-size:.78rem;letter-spacing:.04em}
.brand-actions a:last-child{border-bottom:1px solid rgba(255,255,255,.25)}.brand-actions a:hover{color:#bfcbe1}
.brand-end{padding:clamp(7rem,12vw,12rem) var(--edge);background:var(--navy-deep);color:#fff}
.brand-end>p{font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:#9ba8c0}
.brand-end h2{font-family:var(--fs);font-size:clamp(3.2rem,1rem + 6vw,8rem);font-weight:300;line-height:.92;letter-spacing:-.05em;margin:clamp(3rem,6vw,6rem) 0}
.brand-end h2 em{font-weight:300;color:#9ba8c0}.brand-end>a{display:flex;justify-content:space-between;width:min(42rem,70%);margin-inline-start:auto;border-top:1px solid rgba(255,255,255,.35);border-bottom:1px solid rgba(255,255,255,.35);padding:1.2rem 0}

@media(max-width:900px){.brand-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){
  .brand-intro{padding-top:6rem}.brand-intro .crumbs{padding-bottom:5rem}.brand-intro h1{font-size:15vw}
  .brand-intro>div:last-child{display:block;width:100%;margin-top:3rem}.brand-intro>div:last-child span{display:block;margin-top:2rem}
  .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-face{padding:1rem}.brand-face img{width:82%;height:55%}
  .brand-face>span{font-size:.56rem}.brand-actions{padding:1rem}.brand-actions strong{font-size:1.2rem}.brand-actions a{font-size:.68rem;padding:.75rem 0}
  .brand-end>a{width:100%}
}

/* ================= ABOUT ================= */
.page:has(.about-page) .site-head{position:absolute;inset:0 0 auto;z-index:60;background:transparent;border:0;color:#fff}
.page:has(.about-page) .site-head .logo,.page:has(.about-page) .site-head .icon-btn,.page:has(.about-page) .site-head .menu-toggle,.page:has(.about-page) .site-head .lang{color:#fff}
.page:has(.about-page) .site-head .site-nav a{color:#fff}.page:has(.about-page) .site-head .site-nav a::after{background:#fff}
@media(max-width:1050px){.site-head .site-nav{display:none}}
.about-page{background:var(--navy-deep);color:#f4f3ef}
.about-hero{position:relative;height:100svh;min-height:42rem;overflow:hidden;color:#fff}
.about-hero>img{position:absolute;inset:0;width:100%;height:110%;object-fit:cover;object-position:center 42%;will-change:transform}
.about-hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.06) 42%,rgba(0,0,0,.65)),linear-gradient(90deg,rgba(0,0,0,.24),transparent 55%)}
.about-hero-kicker{position:absolute;z-index:2;top:clamp(6rem,14vh,9rem);left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase}
.about-hero h1{position:absolute;z-index:2;left:var(--edge);bottom:clamp(4.2rem,8vh,7rem);font-family:var(--fs);font-size:clamp(3.3rem,1rem + 6.2vw,8.2rem);font-weight:300;line-height:.9;letter-spacing:-.055em;max-width:12.5ch}
.about-hero h1 em{font-weight:300}
.about-scroll{position:absolute;z-index:2;right:var(--edge);bottom:2rem;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase}
.about-scroll i{display:inline-block;margin-inline-start:.7rem;font-size:1rem;font-style:normal}
.about-dark{position:relative;background:var(--navy-deep);color:#f4f3ef;overflow:hidden}
.about-section{padding:clamp(7rem,13vw,14rem) var(--edge)}
.about-label{font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;color:#8f8f8d}
.about-manifest{display:grid;grid-template-columns:1fr 4fr;gap:3rem;min-height:100svh;align-items:start}
.about-manifest h2{font-family:var(--fs);font-size:clamp(2.4rem,1rem + 4.4vw,6.3rem);font-weight:300;line-height:1.08;letter-spacing:-.035em;max-width:15ch}
.about-manifest h2 em,.about-contact h2 em{color:#a8a8a3;font-weight:300}
.about-manifest-copy{margin:clamp(3rem,7vw,7rem) 0 0 auto;max-width:45ch;color:#aaa;font-size:clamp(1rem,.8rem + .35vw,1.25rem);line-height:1.65}
.about-facts{padding-top:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.about-facts>div:not(.about-office-list){border-top:1px solid #383838;padding:1.2rem 1rem 5rem 0}
.about-facts strong{display:block;font-family:var(--fs);font-size:clamp(4rem,8vw,9rem);font-weight:300;line-height:1}
.about-facts span{color:#8f8f8d;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em}
.about-office-list{grid-column:2/-1;margin-top:4rem;border-top:1px solid #383838}
.about-office-list p{display:grid;grid-template-columns:3rem 1fr 1fr;gap:1rem;padding:1.05rem 0;border-bottom:1px solid #383838;font-size:clamp(1.1rem,1rem + .55vw,1.6rem)}
.about-office-list p span{padding-top:.3rem}.about-office-list p i{font-style:normal;color:#747472;font-size:.8rem;padding-top:.45rem}
.about-story{display:grid;grid-template-columns:1.1fr .7fr .8fr;grid-template-rows:auto auto;gap:clamp(2rem,5vw,6rem);align-items:start}
.about-story>.about-label{grid-column:1/-1}
.about-story figure{overflow:hidden}.about-story img{width:100%;height:100%;object-fit:cover}
.about-story-main{aspect-ratio:4/5}.about-story-side{aspect-ratio:3/4;margin-top:clamp(8rem,15vw,16rem)}
.about-story-copy{padding-top:clamp(2rem,5vw,6rem)}
.about-story-copy>span{color:#777;font-size:.65rem;letter-spacing:.12em;text-transform:uppercase}
.about-story-copy h2{font-family:var(--fs);font-size:clamp(1.9rem,1rem + 2vw,3.6rem);font-weight:300;line-height:1.12;margin:2rem 0}
.about-story-copy p,.about-sustain>div>p:last-child{color:#999;line-height:1.7}
.about-team{padding-bottom:clamp(10rem,17vw,18rem)}
.about-team header>h2{font-family:var(--fs);font-size:clamp(7rem,18vw,22rem);font-weight:300;line-height:.62;letter-spacing:-.075em;margin:clamp(7rem,11vw,11rem) 0}
.about-team header>h2 span{display:block}.about-team header>h2 span:last-child{text-align:end}.about-team header>h2 em{font-weight:300;color:#777}
.about-team header>p:last-child{width:min(32rem,80%);margin:0 8% clamp(6rem,12vw,12rem) auto;color:#999;font-size:clamp(1rem,.8rem + .7vw,1.5rem);line-height:1.55}
.about-people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(4rem,8vw,8rem) clamp(1rem,3vw,3rem);align-items:start}
.about-person{min-width:0}
.about-person figure{overflow:hidden;background:#e8e5df;aspect-ratio:4/5}
.about-person img{width:100%;height:100%;object-fit:cover;filter:saturate(.84)}
.about-person>div{display:grid;grid-template-columns:1fr auto;gap:.2rem 1rem;padding-top:.75rem;font-size:.67rem}
.about-person h3{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}.about-person p{grid-column:2;color:#777;text-align:end}
.about-person a{grid-column:1;color:#8d8d8a}.about-person a:last-child{grid-column:2;text-align:end}
.about-person a:hover{color:#fff}
.about-values>.about-label{margin-bottom:clamp(4rem,8vw,8rem)}
.about-value{display:grid;grid-template-columns:5rem 1.6fr 1fr;gap:2rem;align-items:baseline;padding:1.8rem 0;border-top:1px solid #353535}
.about-value:last-child{border-bottom:1px solid #353535}
.about-value>span{color:#666;font-size:.65rem}.about-value h2{font-family:var(--fs);font-size:clamp(2rem,1rem + 2.8vw,4.5rem);font-weight:300}
.about-value p{color:#888;max-width:34ch;line-height:1.5}
.about-sustain{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(3rem,8vw,9rem);align-items:center}
.about-sustain figure{height:min(74vh,52rem);overflow:hidden}.about-sustain img{width:100%;height:100%;object-fit:cover}
.about-sustain h2{font-family:var(--fs);font-size:clamp(2rem,1rem + 2.7vw,4.5rem);font-weight:300;line-height:1.08;margin:2rem 0}
.about-contact{padding-bottom:clamp(7rem,10vw,11rem)}
.about-contact h2{font-family:var(--fs);font-size:clamp(4rem,1rem + 7.5vw,10rem);font-weight:300;line-height:.88;letter-spacing:-.055em;margin:clamp(4rem,7vw,7rem) 0}
.about-contact>div{margin-inline-start:auto;width:min(45rem,70%)}
.about-contact a{display:flex;justify-content:space-between;padding:1.1rem 0;border-top:1px solid #3a3a3a;font-size:clamp(1rem,.8rem + .7vw,1.5rem)}
.about-contact a:last-child{border-bottom:1px solid #3a3a3a}.about-contact a:hover{color:#aaa}

@media(max-width:767px){
  .about-hero{min-height:42rem}.about-hero>img{object-position:59% center}
  .about-hero-kicker span:last-child{display:none}.about-hero h1{width:calc(100% - var(--edge) * 2);max-width:none;font-size:10.8vw;bottom:5rem;overflow-wrap:normal}
  .about-scroll{left:var(--edge);right:auto}
  .about-section{padding-block:7rem}
  .about-manifest{grid-template-columns:1fr;min-height:0}.about-manifest h2{font-size:2.65rem}
  .about-facts{grid-template-columns:1fr}.about-facts>div:not(.about-office-list){padding-bottom:2.5rem}
  .about-office-list{grid-column:auto;margin-top:3rem}.about-office-list p{grid-template-columns:2rem 1fr}.about-office-list p i{grid-column:2}
  .about-story{grid-template-columns:1fr}.about-story>.about-label{grid-column:auto}.about-story-side{margin:0;width:72%;margin-inline-start:auto}
  .about-team header>h2{font-size:28vw;line-height:.68;margin:6rem 0}.about-team header>p:last-child{width:100%;margin:0 0 6rem}
  .about-people{grid-template-columns:repeat(2,minmax(0,1fr));gap:5rem 1rem}
  .about-person>div{display:block}.about-person h3,.about-person p,.about-person a{display:block;text-align:start!important;margin-top:.28rem}
  .about-value{grid-template-columns:2rem 1fr}.about-value p{grid-column:2}
  .about-sustain{grid-template-columns:1fr}.about-sustain figure{height:auto;aspect-ratio:4/5}
  .about-contact>div{width:100%}
}