/* Hallmark v2.0.0 · redesign: full · theme: brand (Prime crimson, ink, warm paper) · genre: modern-minimal · shape: Catalogue spread · hero: Split · signature: the cast photograph set large beside a two-line headline */
@font-face{font-family:'Figtree';src:url(../assets/fonts/Figtree-Variable.ttf) format('truetype');font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:'Figtree';src:url(../assets/fonts/Figtree-Italic-Variable.ttf) format('truetype');font-weight:300 900;font-style:italic;font-display:swap}
/* critique: a medical manufacturer page built around real photographs, one crimson accent, sharp corners, no labels above headings. */
/* waive F8: the services film and the section rises are the one scroll story the user asked for. */
/* waive shape lock: the New Projects posts use one cut-corner shape. */
/* waive 47b: the services journey is one dark stage inside a light page, a scroll film, not a theme switch. */
:root{
--paper:#F6F4F1;--paper-2:#ECE8E3;--ink:#14110F;--ink-2:#3B3733;--muted:#675F58;--rule:#D9D3CC;--rule-2:#B9B1A8;
--accent:#A2000A;--accent-ink:#FFFFFF;--accent-dark:#7A0008;--accent-tint:#F8EBEB;--focus:#A2000A;
--stage:#0E0C0B;--sp-a:#FF5A1F;--sp-m:#B06AB3;--sp-z:#2F6BFF;--stage-ink:#F6F4F1;--stage-muted:#A9A199;--stage-rule:#3A3531;
--font:'Figtree',ui-sans-serif,system-ui,sans-serif;
--radius:0;
--space-0:4px;--space-1:8px;--space-2:16px;--space-3:24px;--space-4:40px;--space-5:64px;--space-6:96px;
--measure:68ch;--wrap:1360px;--hdr:92px;--col-gap:clamp(32px,5vw,80px);--shadow:0 18px 36px rgba(20,17,15,.14);
--t-ease:cubic-bezier(0.22,1,0.36,1);--t-dur:500ms;--t-dist:12px;--t-stagger:40ms;--t-blur:3px;--shake-dist:6px;--revert:280ms;
}
html,body{overflow-x:clip;margin:0}
body{font-family:var(--font);color:var(--ink);background:var(--paper);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
*,*::before,*::after{box-sizing:border-box}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
h1,h2,h3{text-wrap:balance}
ul,ol{padding:0;list-style:none}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;transition:none}
.pg{container-type:inline-size;container-name:pg;background:var(--paper);min-width:0}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(20px,4.4vw,var(--space-5));padding-inline:clamp(20px,4.4cqw,var(--space-5))}
.sec{padding-block:clamp(var(--space-5),9vw,128px);padding-block:clamp(var(--space-5),9cqw,128px)}
.sec-alt{background:var(--paper-2)}
.display{font-weight:800;letter-spacing:-.035em;line-height:1;overflow-wrap:break-word;min-width:0}
.h1{font-size:clamp(44px,6.4vw,92px);font-size:clamp(44px,6.4cqw,92px)}
.h2{font-size:clamp(34px,4.4vw,60px);font-size:clamp(34px,4.4cqw,60px);font-weight:800;letter-spacing:-.03em;line-height:1.02;overflow-wrap:break-word;min-width:0}
.h3{font-size:clamp(24px,2.4vw,32px);font-size:clamp(24px,2.4cqw,32px);font-weight:700;letter-spacing:-.02em;line-height:1.1}
.lede{font-size:clamp(19px,1.7vw,24px);font-size:clamp(19px,1.7cqw,24px);line-height:1.45;color:var(--ink-2);max-width:var(--measure)}
.muted{color:var(--muted)}
.small{font-size:14px;line-height:1.5}
.stack>*+*{margin-top:var(--space-3)}
/* header */
.hdr{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:1px solid var(--rule)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:76px}
.logo{display:flex;align-items:center;min-height:44px}
.logo img{height:52px;width:auto}
.nav{display:flex;align-items:center;gap:var(--space-0) 32px;font-weight:500;font-size:16px}
.nav>a,.nav .dd>a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0;transition:color 300ms var(--t-ease)}
.nav>a::after,.nav .dd>a::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 400ms var(--t-ease)}
.nav>a:hover::after,.nav .dd>a:hover::after,.nav [aria-current="page"]::after{transform:scaleX(1)}
.nav [aria-current="page"]{color:var(--accent)}
.hdr-cta{display:inline-flex}
.dd{position:relative;display:flex}
.dd-caret{display:inline-block;margin-left:var(--space-1);transition:transform 300ms var(--t-ease)}
.dd:hover .dd-caret,.dd:focus-within .dd-caret{transform:rotate(180deg)}
.dd-menu{position:absolute;top:100%;left:-16px;min-width:220px;background:var(--paper);box-shadow:var(--shadow);padding:var(--space-1);display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(-6px) scale(.96);filter:blur(var(--t-blur));transform-origin:top left;transition:opacity 200ms var(--t-ease),transform 300ms var(--t-ease),filter 300ms var(--t-ease),visibility 0s linear 300ms}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none;filter:blur(0);transition-delay:0s}
.nav .dd-menu a{display:flex;align-items:center;min-height:44px;padding:0 var(--space-2);font-weight:500}
.nav .dd-menu a::after{display:none}
.nav .dd-menu a:hover,.nav .dd-menu a[aria-current]{background:var(--accent-tint);color:var(--accent)}
.mm{display:none;position:relative}
.mm summary{list-style:none;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;padding:0 var(--space-2);border:1px solid var(--ink);font-weight:600}
.mm summary::-webkit-details-marker{display:none}
.mm-list{position:absolute;right:0;top:100%;margin-top:var(--space-1);width:min(320px,80cqw);background:var(--paper);box-shadow:var(--shadow);padding:var(--space-1);display:flex;flex-direction:column}
.mm-list a{display:flex;align-items:center;min-height:44px;padding:0 12px;font-weight:600}
.mm-list a.sub{padding-left:28px;font-weight:400;color:var(--ink-2)}
/* buttons and links */
/* waive shape lock: buttons are pills, requested by the user. */
.btn{--sweep:var(--ink);--sweep-ink:var(--paper);position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-1);min-height:52px;padding:0 var(--space-4);font:600 16px var(--font);border:2px solid transparent;border-radius:999px;cursor:pointer;transition:transform 300ms var(--t-ease),color 400ms var(--t-ease),border-color 400ms var(--t-ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--sweep);transform:scaleX(0);transform-origin:left;transition:transform 500ms var(--t-ease)}
.btn:hover::before,.btn:focus-visible::before{transform:scaleX(1)}
.btn:hover{transform:translateY(-2px);color:var(--sweep-ink)}
.btn:active{transform:translateY(1px)}
.btn:disabled,.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed;transform:none}
.btn svg{width:18px;height:18px;transition:transform 400ms var(--t-ease)}
.btn:hover svg{transform:translateX(var(--space-1))}
a:active{opacity:.8}
.btn-accent{background:var(--accent);color:var(--accent-ink)}
.btn-ink{background:var(--ink);color:var(--paper);--sweep:var(--accent);--sweep-ink:var(--accent-ink)}
.btn-line{border:2px solid var(--ink);color:var(--ink);background:transparent}
.link{display:inline-flex;align-items:center;min-height:44px;font-weight:600;background:linear-gradient(var(--accent),var(--accent)) left bottom 10px/100% 2px no-repeat;transition:background-size 400ms var(--t-ease)}
.link:hover{background-size:0 2px;background-position:right bottom 10px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3)}
/* hero */
.hero{padding-block:clamp(var(--space-4),5vw,72px) clamp(56px,7vw,var(--space-6))}
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--col-gap);align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:var(--space-3)}
.hero-copy .lede{max-width:34ch}
.hero-art{aspect-ratio:480/560;width:100%}
.hero-art svg{display:block;width:100%;height:100%;overflow:visible}
.hero-art .panel{fill:var(--paper-2)}
.hero-art .sh{fill:var(--ink);opacity:.12}
.hero-art .roll{transform-box:fill-box;transform-origin:center;animation:float 7s ease-in-out infinite;transition:transform 500ms var(--t-ease)}
.hero-art .r-b{animation-delay:-2.4s}.hero-art .r-c{animation-delay:-4.8s}
.hero-art .wr{fill:none;stroke:var(--ink);stroke-opacity:.22;stroke-width:1.5}
.hero-art .co{fill:var(--paper)}
.hero-art .rg{fill:none;stroke:var(--ink);stroke-opacity:.28;stroke-width:1.5}
.hero-art .r-a .bd{fill:var(--accent)}.hero-art .r-a .tp{fill:var(--accent-dark)}
.hero-art .r-b .bd{fill:var(--ink)}.hero-art .r-b .tp{fill:var(--ink-2)}.hero-art .r-b .wr,.hero-art .r-b .rg{stroke:var(--paper)}
.hero-art .r-c .bd{fill:var(--paper)}.hero-art .r-c .tp{fill:var(--paper-2);stroke:var(--rule-2);stroke-width:1.5}.hero-art .r-c .bd{stroke:var(--rule-2);stroke-width:1.5}
.hero-art .roll:hover{transform:translateY(calc(var(--space-2) * -1))}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(calc(var(--space-1) * -1))}}
.hero-in>*{opacity:0;animation:t-in var(--t-dur) var(--t-ease) forwards}
.hero-in>*:nth-child(2){animation-delay:calc(var(--t-stagger)*1)}
.hero-in>*:nth-child(3){animation-delay:calc(var(--t-stagger)*2)}
.hero-in>*:nth-child(4){animation-delay:calc(var(--t-stagger)*3)}
.hero-in>*:nth-child(5){animation-delay:calc(var(--t-stagger)*4)}
@keyframes t-in{from{opacity:0;transform:translateY(var(--t-dist));filter:blur(var(--t-blur))}to{opacity:1;transform:none;filter:blur(0)}}
/* page head for inner pages */
.ph{padding-block:clamp(56px,7vw,104px) clamp(32px,4vw,56px)}
.ph .lede{margin-top:var(--space-3)}
/* split layouts */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--col-gap);align-items:center}
.split-wide{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--col-gap);align-items:start}
.pic{background:var(--paper-2);overflow:hidden}
.pic img{width:100%;height:100%;object-fit:cover}
.r43{aspect-ratio:4/3}.r169{aspect-ratio:16/9}.r34{aspect-ratio:3/4}.r11{aspect-ratio:1/1}
/* products */
.pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4) var(--space-3)}
.tile{display:block;transition:transform 600ms var(--t-ease);will-change:transform}
.tile:hover{transform:perspective(1000px) translateY(-6px) rotateX(2deg)}
.tile-img{aspect-ratio:1/1;background:var(--paper-2);overflow:hidden}
.tile-img img{width:100%;height:100%;object-fit:contain;padding:12px}
.tile-name{margin-top:var(--space-2);font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.tile-sub{margin-top:var(--space-0);color:var(--muted);font-size:15px}
.new{color:var(--accent);font-size:15px;font-weight:600;margin-left:var(--space-1)}
.feature{grid-column:span 2;grid-row:span 2;display:flex;flex-direction:column}
.feature .tile-img{flex:1;aspect-ratio:auto;min-height:340px}
.feature .tile-name{font-size:clamp(30px,3vw,44px);font-size:clamp(30px,3vw,44px)}
.regions{display:flex;flex-wrap:wrap;gap:var(--space-1) 28px}
.regions a{font-weight:600;min-height:44px;display:inline-flex;align-items:center}
.names{columns:3;column-gap:var(--space-4);margin-top:var(--space-3)}
.names li{padding:var(--space-0) 0;break-inside:avoid;color:var(--ink-2)}
details.more{margin-top:var(--space-3)}
details.more>summary{cursor:pointer;min-height:44px;display:inline-flex;align-items:center;font-weight:600;list-style:none;background:linear-gradient(var(--accent),var(--accent)) left bottom 10px/100% 2px no-repeat}
details.more>summary::-webkit-details-marker{display:none}
details.more[open]>summary{background-size:0 2px}
/* why */
.why{columns:2;column-gap:var(--col-gap)}
.why li{break-inside:avoid;padding:var(--space-2) 0;font-size:clamp(26px,2.8vw,40px);font-size:clamp(26px,2.8cqw,40px);font-weight:700;letter-spacing:-.025em;line-height:1.1}
/* posts */
.posts{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--col-gap);align-items:start}
.post-main .pic{margin-bottom:var(--space-3)}
.post-side{display:flex;flex-direction:column;gap:var(--space-4)}
.post-side .row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:var(--space-3);align-items:start}
.date{color:var(--muted);font-size:15px;margin-bottom:var(--space-1)}
.vids{margin-top:var(--space-5)}
.vid{display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-2) 0;font-size:clamp(19px,1.7vw,24px);font-size:clamp(19px,1.7cqw,24px);font-weight:600;letter-spacing:-.01em;min-height:44px;transition:color 300ms var(--t-ease)}
.vid:hover{color:var(--accent)}
.vid span:last-child{color:var(--muted);font-weight:400;font-variant-numeric:tabular-nums}
/* journey (scroll film): light panel, vertical step rail */
/* waive shape lock: the services panel and its image have rounded corners. */
.journey{height:2300px;background:var(--paper);margin-top:clamp(var(--space-5),9vw,120px)}
.stage{position:sticky;top:var(--hdr);height:640px;padding-block:var(--space-4);overflow:hidden}
.stage-h{margin-bottom:var(--space-3)}
.stage .wrap{width:100%}
.stage-in{position:relative;height:460px;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,5fr) minmax(0,6fr);gap:var(--space-3);align-items:stretch;padding:var(--space-4);background:var(--paper-2);border-radius:var(--space-4)}
.rail-col{position:relative;padding-left:var(--space-3)}
.rail{display:flex;flex-direction:column;justify-content:space-between;height:100%;font-weight:600;font-size:18px}
.rail span{position:relative;color:var(--muted)}
.rail span::before{content:"";position:absolute;top:50%;left:calc(var(--space-3) * -1 - var(--space-1) + 1px);width:var(--space-2);height:var(--space-2);margin-top:calc(var(--space-1) * -1);border-radius:50%;background:var(--rule-2);box-shadow:0 0 0 var(--space-0) var(--paper-2)}
.rail .rd0::before{background:var(--accent)}
.prog-wrap{position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--rule-2)}
.prog{height:100%;background:var(--accent);transform:scaleY(0);transform-origin:top}
.stage-copy{position:relative}
.stage-pics{position:relative;border-radius:var(--space-3);overflow:hidden}
.c0,.c1,.c2,.c3,.i0,.i1,.i2,.i3{position:absolute;inset:0;opacity:0}
.c0,.c1,.c2,.c3{display:flex;flex-direction:column;justify-content:center;gap:var(--space-3)}
.i0 img,.i1 img,.i2 img,.i3 img{width:100%;height:100%;object-fit:cover}
.j0 .c0,.j0 .i0{opacity:1}
.stage .lede{color:var(--ink-2);max-width:32ch}
.journey-intro{background:var(--paper);padding-top:clamp(var(--space-5),9vw,120px);padding-bottom:var(--space-4)}
@supports (animation-timeline: view()){
.journey{view-timeline-name:--j;view-timeline-axis:block}
.c0,.c1,.c2,.c3,.i0,.i1,.i2,.i3,.rd,.rd::before,.prog{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--j;animation-range:contain 0% contain 100%}
.prog{animation-name:prog}
@keyframes prog{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.rd0::before{animation-name:dt0}.rd1::before{animation-name:dt1}.rd2::before{animation-name:dt2}.rd3::before{animation-name:dt3}
.c0{animation-name:cp0}.i0{animation-name:im0}.rd0{animation-name:rl0}
.c1{animation-name:cp1}.i1{animation-name:im1}.rd1{animation-name:rl1}
.c2{animation-name:cp2}.i2{animation-name:im2}.rd2{animation-name:rl2}
.c3{animation-name:cp3}.i3{animation-name:im3}.rd3{animation-name:rl3}
.rv>*{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
@keyframes rise{from{opacity:0;transform:translateY(24px);filter:blur(3px)}to{opacity:1;transform:none;filter:blur(0)}}
}
/* team */
.team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5) var(--col-gap)}
.member{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr);gap:var(--space-3);align-items:start}
.member .pic{aspect-ratio:3/4}
.initials{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:56px;font-weight:800;letter-spacing:-.03em;color:var(--accent)}
.member h3{font-size:26px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.role{color:var(--accent);font-weight:600;margin:var(--space-0) 0 12px}
.member details summary{cursor:pointer;min-height:44px;display:inline-flex;align-items:center;font-weight:600;list-style:none}
.member details summary::-webkit-details-marker{display:none}
.member details[open] summary{display:none}
.locs{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr);gap:var(--col-gap);align-items:end}
.loc{display:block;transition:transform 600ms var(--t-ease)}
.loc:hover{transform:perspective(1000px) translateY(-6px) rotateX(2deg)}
.loc .pic{margin-bottom:var(--space-2)}
.loc:nth-child(2) .pic{aspect-ratio:1/1}
.loc:nth-child(3) .pic{aspect-ratio:3/4}
.figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}
.fig b{display:block;font-size:clamp(36px,4.4vw,64px);font-size:clamp(36px,4.4cqw,64px);font-weight:800;letter-spacing:-.04em;line-height:.95;color:var(--accent)}
.office{padding-top:var(--space-2);border-top:2px solid var(--ink)}
.office h3{font-size:24px;font-weight:700;letter-spacing:-.02em;margin-bottom:var(--space-1)}
.offices{display:flex;flex-direction:column;gap:var(--space-4)}
/* forms */
.field{display:flex;flex-direction:column;gap:var(--space-1)}
.field label{font-weight:600;font-size:15px}
.field input,.field textarea{min-height:52px;padding:12px var(--space-2);border:1px solid var(--muted);border-radius:var(--radius);font:inherit;background:var(--paper);color:var(--ink)}
.field textarea{min-height:140px;resize:vertical}
.form{display:flex;flex-direction:column;gap:var(--space-2);max-width:560px}
.t-input{transition:border-color 150ms ease-out}
.t-input:user-invalid{border-color:var(--accent);animation:t-shake 280ms linear}
@keyframes t-shake{0%{transform:translateX(0);animation-timing-function:cubic-bezier(.36,.07,.19,.97)}28.57%{transform:translateX(var(--shake-dist));animation-timing-function:cubic-bezier(.36,.07,.19,.97)}57.14%{transform:translateX(calc(var(--shake-dist)*-1));animation-timing-function:cubic-bezier(.36,.07,.19,.97)}78.57%{transform:translateX(calc(var(--shake-dist)*.4));animation-timing-function:cubic-bezier(.36,.07,.19,.97)}100%{transform:translateX(0)}}
.t-error-msg{font-size:14px;color:var(--accent);opacity:0;visibility:hidden;max-height:0;transition:opacity var(--revert) ease-out,visibility 0s linear var(--revert)}
.t-input:user-invalid+.t-error-msg{opacity:1;visibility:visible;max-height:24px;transition:opacity var(--revert) ease-out,visibility 0s linear 0s}
/* career accordions */
.acc details{padding:var(--space-3) 0}
.acc summary{cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);font-size:clamp(24px,2.4vw,34px);font-size:clamp(24px,2.4cqw,34px);font-weight:700;letter-spacing:-.025em;list-style:none}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-weight:400;font-size:1.2em;transition:transform 300ms var(--t-ease)}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc .body{padding-top:var(--space-2);max-width:var(--measure);color:var(--ink-2)}
.acc .body p+p,.acc .body ul{margin-top:12px}
.acc .body li{padding:var(--space-0) 0}
/* shop */
.belts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--col-gap)}
.belt .pic{aspect-ratio:4/3;margin-bottom:var(--space-3)}
.belt .pic img{object-fit:contain;padding:var(--space-2)}
.belt h3{margin-bottom:var(--space-1)}
.shoplist{columns:3;column-gap:var(--space-5)}
.shoplist li{display:flex;justify-content:space-between;align-items:center;gap:var(--space-2);padding:var(--space-1) 0;break-inside:avoid;min-height:48px}
/* cta + footer */
.cta{background:var(--accent);color:var(--accent-ink)}
.cta .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3)}
.cta .btn{background:var(--paper);color:var(--ink)}
.cta .btn:hover{color:var(--paper)}
main{position:relative;z-index:1;background:var(--paper);box-shadow:var(--shadow)}
.foot{position:sticky;bottom:0;z-index:0;background:var(--paper);border-top:2px solid var(--ink);padding-block:var(--space-5) 0}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap}
.foot-logo{display:inline-block;transition:transform 400ms var(--t-ease)}
.foot-logo:hover{transform:translateY(calc(var(--space-0) * -1))}
.foot-nav{display:flex;flex-wrap:wrap;gap:0 var(--space-3)}
.fl{position:relative;display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--ink-2);transition:color 300ms var(--t-ease)}
.fl::after{content:"";position:absolute;left:0;bottom:var(--space-1);height:2px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 500ms var(--t-ease)}
.fl:hover{color:var(--ink)}
.fl:hover::after{transform:scaleX(1)}
.foot-soc{display:flex;gap:var(--space-1)}
.fs{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--rule-2);transition:background-color 300ms var(--t-ease),border-color 300ms var(--t-ease),color 300ms var(--t-ease),transform 400ms var(--t-ease)}
.fs svg{width:20px;height:20px}
.fs:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);transform:translateY(calc(var(--space-0) * -1))}
.foot-prime{width:min(100%,1040px);margin:var(--space-5) auto 0;aspect-ratio:683/200;overflow:hidden;transition:transform 600ms var(--t-ease)}
.foot-prime img{width:100%;max-width:none;height:auto}
.foot:hover .foot-prime{transform:translateY(calc(var(--space-1) * -1))}
.foot-legal{margin-top:var(--space-4);padding-top:var(--space-3);border-top:1px solid var(--rule);color:var(--muted);font-size:14px}
@container pg (max-width:900px){.foot-row{flex-direction:column;align-items:flex-start;gap:var(--space-3)}}
@media (prefers-reduced-motion:reduce){.foot{position:static}.foot-logo,.fl::after,.fs,.foot-prime{transition:none}.foot:hover .foot-prime{transform:none}.fs:hover,.foot-logo:hover{transform:none}}
/* feature grid with hover */
.feats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.feat{position:relative;display:flex;flex-direction:column;padding:var(--space-4) 0;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);min-width:0}
.feat::before{content:"";position:absolute;inset:0;opacity:0;pointer-events:none;background:linear-gradient(to bottom,var(--paper),transparent);transition:opacity 200ms var(--t-ease)}
.feat:nth-child(-n+4)::before{background:linear-gradient(to top,var(--paper),transparent)}
.feat:hover::before{opacity:1}
.feat-ico{position:relative;padding:0 var(--space-4);margin-bottom:var(--space-2);color:var(--muted);transition:color 200ms var(--t-ease)}
.feat-ico svg{width:32px;height:32px;display:block}
.feat:hover .feat-ico{color:var(--accent)}
.feat-t{position:relative;padding:0 var(--space-4);margin-bottom:var(--space-1);font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.feat-t::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--rule-2);transform:scaleY(.7);transform-origin:center;transition:transform 200ms var(--t-ease),background-color 200ms var(--t-ease)}
.feat:hover .feat-t::before{transform:scaleY(1);background:var(--accent)}
.feat-t span{display:inline-block;transition:transform 200ms var(--t-ease)}
.feat:hover .feat-t span{transform:translateX(var(--space-1))}
.feat p{position:relative;padding:0 var(--space-4);color:var(--ink-2);max-width:32ch;font-size:16px}
.feat-link{position:relative;margin:var(--space-2) var(--space-4) 0;align-self:flex-start}
/* new projects: one shape, auto slider */
.pj{flex:0 0 clamp(240px,26vw,340px);flex:0 0 clamp(240px,26cqw,340px);margin-right:var(--space-4);display:flex;flex-direction:column;gap:var(--space-2);transition:transform 600ms var(--t-ease)}
.pj:hover{transform:translateY(calc(var(--space-1) * -1))}
.pj-pic{position:relative;aspect-ratio:4/5;background:var(--paper-2);overflow:hidden;clip-path:polygon(0 0,calc(100% - 56px) 0,100% 56px,100% 100%,0 100%);transition:clip-path 600ms var(--t-ease)}
.pj:hover .pj-pic{clip-path:polygon(0 0,calc(100% - 112px) 0,100% 112px,100% 100%,0 100%)}
.pj-pic img{width:100%;height:100%;object-fit:cover}
.pj-pic img.fit{object-fit:contain;padding:var(--space-2)}
.pj-row{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-2)}
.pj-t{font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.2;background:linear-gradient(var(--accent),var(--accent)) left bottom/0 2px no-repeat;padding-bottom:var(--space-0);transition:background-size 400ms var(--t-ease)}
.pj:hover .pj-t{background-size:100% 2px}
.pj-go{flex:0 0 44px;width:44px;height:44px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;transform:rotate(-45deg);transition:transform 400ms var(--t-ease),background-color 300ms var(--t-ease),color 300ms var(--t-ease)}
.pj:hover .pj-go,.pj:focus-visible .pj-go{transform:none;background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.pj-go svg{width:20px;height:20px}
.vgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--col-gap);margin-top:var(--space-3)}
.vitem{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) 0;min-height:44px;font-size:clamp(18px,1.6vw,22px);font-size:clamp(18px,1.6cqw,22px);font-weight:600;letter-spacing:-.01em}
.vplay{flex:0 0 48px;width:48px;height:48px;border:2px solid var(--ink);border-radius:50%;display:grid;place-items:center;transition:background-color 300ms var(--t-ease),color 300ms var(--t-ease),border-color 300ms var(--t-ease),transform 400ms var(--t-ease)}
.vplay svg{width:16px;height:16px;margin-left:2px}
.vitem:hover .vplay{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);transform:scale(1.08)}
.vtitle{flex:1;min-width:0;transition:transform 300ms var(--t-ease)}
.vitem:hover .vtitle{transform:translateX(var(--space-1))}
.vdur{color:var(--muted);font-weight:400;font-variant-numeric:tabular-nums}
/* request sample: contact + globe */
.cs{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--col-gap);align-items:start}
.cs-info{display:flex;flex-direction:column;gap:var(--space-3)}
.cs-links{display:flex;flex-direction:column;gap:var(--space-2)}
.cs-link{display:flex;align-items:center;gap:var(--space-2);width:fit-content;min-height:44px;font-weight:600;font-size:18px;color:var(--ink-2);transition:color 300ms var(--t-ease),transform 400ms var(--t-ease)}
.cs-ico{flex:0 0 44px;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--rule-2);background:var(--paper);color:var(--muted);transition:background-color 300ms var(--t-ease),border-color 300ms var(--t-ease),color 300ms var(--t-ease)}
.cs-ico svg{width:20px;height:20px}
.cs-link:hover{color:var(--ink);transform:translateX(var(--space-1))}
.cs-link:hover .cs-ico{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.globe{width:min(100%,520px);aspect-ratio:1;margin-inline:auto;margin-top:var(--space-2);color:var(--ink)}
.globe svg{display:block;width:100%;height:100%;overflow:visible}
.globe .g-sea{fill:var(--paper)}
.globe .g-grid{fill:none;stroke:var(--rule-2);stroke-width:.5}
.globe .g-land{fill:var(--ink);fill-opacity:.82;stroke:none}
.globe .g-rim{fill:none;stroke:var(--ink);stroke-width:1.2}
.globe .g-dot{fill:var(--accent);stroke:var(--paper);stroke-width:1.2}
.globe .g-ring{fill:none;stroke:var(--accent);stroke-width:1.2;transform-box:fill-box;transform-origin:center;animation:ping 2.6s var(--t-ease) infinite}
.globe .g-pin:nth-of-type(2) .g-ring{animation-delay:-.9s}.globe .g-pin:nth-of-type(3) .g-ring{animation-delay:-1.8s}
@keyframes ping{from{transform:scale(1);opacity:.9}to{transform:scale(4);opacity:0}}
.cs-card{background:var(--paper);border:1px solid var(--rule-2);padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-3);transition:border-color 300ms var(--t-ease),box-shadow 500ms var(--t-ease)}
.cs-card:hover,.cs-card:focus-within{border-color:var(--accent);box-shadow:var(--shadow)}
.cs-dots{height:var(--space-1);color:var(--rule-2);background-image:radial-gradient(circle,currentColor 1px,transparent 1px);background-size:var(--space-1) 100%;-webkit-mask-image:linear-gradient(90deg,transparent,var(--ink) 12%,var(--ink) 88%,transparent);mask-image:linear-gradient(90deg,transparent,var(--ink) 12%,var(--ink) 88%,transparent)}
.cs-card .form{max-width:none}
.cs-card .field input,.cs-card .field textarea{transition:border-color 300ms var(--t-ease),box-shadow 300ms var(--t-ease)}
.cs-card .field input:focus,.cs-card .field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}
@container pg (max-width:560px){.cs-card{padding:var(--space-3)}}
@container pg (max-width:900px){.cs{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.globe .g-ring{animation:none;opacity:0}.cs-link,.cs-ico{transition:none}.cs-link:hover{transform:none}}
/* waive shape lock: the Welcome image has rounded corners, requested by the user. */
.wel-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--col-gap);align-items:center}
.wel-copy{display:flex;flex-direction:column;gap:var(--space-3)}
.wel-pic{aspect-ratio:4/5;overflow:hidden;border-radius:var(--space-4);background:var(--paper)}
.wel-pic img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.wel-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3);margin-top:var(--space-3)}
.wel-stats .fig{padding-top:var(--space-2);border-top:2px solid var(--ink)}
@supports (animation-timeline: view()){
.wel-pic{animation:pic-in linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
.wel-stats .fig{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 40%}
.wel-stats .fig:nth-child(2){animation-range:entry 20% entry 60%}
.wel-stats .fig:nth-child(3){animation-range:entry 40% entry 80%}
}
@keyframes pic-in{from{opacity:0;transform:translateX(-64px) scale(.92);clip-path:inset(10% 10% 10% 10% round var(--space-4))}to{opacity:1;transform:none;clip-path:inset(0 round var(--space-4))}}
@container pg (max-width:900px){.wel-grid{grid-template-columns:minmax(0,1fr)}.wel-pic{aspect-ratio:4/3}}
@container pg (max-width:560px){.wel-stats{gap:var(--space-2)}.wel-stats .fig{font-size:14px;line-height:1.3}}
/* products slider: cards, arrow buttons, no autoplay */
.ps{position:relative}
.ps-r{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.ps-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-4)}
.ps-nav{position:relative;display:grid}
.nv{grid-area:1/1;display:flex;gap:var(--space-1)}
.ps:has(#ps0:checked) .nv:not(.nv0),.ps:has(#ps1:checked) .nv:not(.nv1),.ps:has(#ps2:checked) .nv:not(.nv2),.ps:has(#ps3:checked) .nv:not(.nv3){display:none}
.ab{display:grid;place-items:center;width:52px;height:52px;border:2px solid var(--ink);border-radius:50%;cursor:pointer;transition:background-color 300ms var(--t-ease),border-color 300ms var(--t-ease),color 300ms var(--t-ease),transform 300ms var(--t-ease)}
.ab svg{width:20px;height:20px}
.ab:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);transform:scale(1.06)}
.ab.off{opacity:.3;cursor:default;pointer-events:none}
.ps-view{overflow:clip;overflow-clip-margin:var(--space-3)}
.ps-track{--p:0;display:flex;gap:var(--space-3);transform:translateX(calc(var(--p) * (-100% - var(--space-3))));transition:transform 700ms var(--t-ease)}
.ps:has(#ps1:checked) .ps-track{--p:1}.ps:has(#ps2:checked) .ps-track{--p:2}.ps:has(#ps3:checked) .ps-track{--p:3}
.pc{flex:0 0 calc((100% - 3 * var(--space-3)) / 4);display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--rule-2);transition:border-color 300ms var(--t-ease),box-shadow 500ms var(--t-ease),transform 500ms var(--t-ease)}
.pc:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(calc(var(--space-1) * -1))}
.pc:focus-visible{border-color:var(--accent);transition:none}
.pc-img{position:relative;aspect-ratio:1/1;background:var(--paper-2);overflow:hidden}
.pc-img img{width:100%;height:100%;object-fit:contain;padding:var(--space-2)}
.pc-new{position:absolute;top:var(--space-2);left:var(--space-2);padding:var(--space-0) var(--space-2);background:var(--accent);color:var(--accent-ink);font-size:14px;font-weight:700}
.pc-body{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-3);flex:1}
.pc-name{font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.pc-sub{color:var(--muted);font-size:15px;flex:1}
.pc-go{display:inline-flex;align-items:center;gap:var(--space-1);margin-top:var(--space-1);font-weight:600;transition:color 300ms var(--t-ease),gap 400ms var(--t-ease)}
.pc-go svg{width:18px;height:18px}
.pc:hover .pc-go{color:var(--accent);gap:var(--space-2)}
.ps-links{margin-top:var(--space-4)}
@container pg (min-width:901px){.nv1 .nx{opacity:.3;pointer-events:none}}
@container pg (max-width:900px){.pc{flex-basis:calc((100% - var(--space-3)) / 2)}}
@container pg (max-width:560px){.ps-nav{display:none}.ps-view{overflow-x:auto;overflow-clip-margin:0;scroll-snap-type:x mandatory}.ps-track{transform:none;transition:none}.pc{flex-basis:78%;scroll-snap-align:start}}
@media (prefers-reduced-motion:reduce){.ps-track,.pc,.ab,.pc-go{transition:none}.pc:hover{transform:none}}
/* small containers */
@container pg (max-width:900px){
.vgrid{grid-template-columns:minmax(0,1fr)}
.feats{grid-template-columns:repeat(2,minmax(0,1fr))}
.feat:nth-child(-n+4)::before{background:linear-gradient(to bottom,var(--paper),transparent)}
.nav,.hdr-cta{display:none}
.mm{display:block}
.hero-grid,.split,.split-wide,.posts,.foot-grid,.belts{grid-template-columns:minmax(0,1fr)}
.hero-art{aspect-ratio:1/1;order:-1}
.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.feature{grid-column:span 2;grid-row:auto}
.feature .tile-img{min-height:0;aspect-ratio:4/3}
.why,.names,.shoplist{columns:1}
.team{grid-template-columns:minmax(0,1fr)}
.locs{grid-template-columns:minmax(0,1fr)}
.journey{height:1800px}
.stage{height:700px}
.stage-in{height:560px;grid-template-columns:minmax(0,1fr);grid-template-rows:240px minmax(0,1fr);gap:var(--space-3);padding:var(--space-3)}
.stage-copy{order:1}
.stage-pics{order:0}
.rail-col{display:none}
.post-side .row{grid-template-columns:minmax(0,1fr)}
}
@container pg (max-width:560px){.feats{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){
.pj,.pj-pic,.pj-pic img,.pj-t,.pj-go,.vplay,.vtitle{transition:none!important}
.pj[aria-hidden]{display:none}
.pj:hover,.pj:hover .pj-go,.vitem:hover .vplay,.vitem:hover .vtitle{transform:none}
.pj-go{opacity:1;transform:none}
.feat::before,.feat-ico,.feat-t::before,.feat-t span{transition:none!important}
.feat:hover .feat-t span{transform:none}
.hero-in>*{animation:none;opacity:1}
.hero-art .roll{animation:none;transition:none}
.tile,.loc,.btn,.nav a::after,.dd-menu,.dd-caret,.link,.t-input,.acc summary::after{transition:none!important}
.tile:hover,.loc:hover,.btn:hover{transform:none}
.btn::before{transition:none}
.t-input:user-invalid{animation:none}
.c0,.c1,.c2,.c3,.i0,.i1,.i2,.i3,.prog,.rv>*,.wel-pic,.wel-stats .fig,.rd::before,.sp,.sp-in{animation:none!important}
.c0,.i0{opacity:1}.rv>*{opacity:1}
}
@keyframes cp0{0%{opacity:1;transform:none} 23.0%{opacity:1;transform:none} 30.0%{opacity:0;transform:translateY(-48px)} 100%{opacity:0;transform:translateY(-48px)}}
@keyframes im0{0%{opacity:1;transform:scale(1)} 23.0%{opacity:1;transform:scale(1.06)} 30.0%{opacity:0;transform:scale(1.2)} 100%{opacity:0;transform:scale(1.2)}}
@keyframes rl0{0%{color:var(--ink)} 24.9%{color:var(--ink)} 25.0%{color:var(--muted)} 100%{color:var(--muted)}}
@keyframes dt0{0%{background:var(--accent)} 100%{background:var(--accent)}}
@keyframes cp1{0%{opacity:0;transform:translateY(48px)} 20.0%{opacity:0;transform:translateY(48px)} 27.0%{opacity:1;transform:none} 48.0%{opacity:1;transform:none} 55.0%{opacity:0;transform:translateY(-48px)} 100%{opacity:0;transform:translateY(-48px)}}
@keyframes im1{0%{opacity:0;transform:scale(.94)} 20.0%{opacity:0;transform:scale(.94)} 27.0%{opacity:1;transform:scale(1)} 48.0%{opacity:1;transform:scale(1.06)} 55.0%{opacity:0;transform:scale(1.2)} 100%{opacity:0;transform:scale(1.2)}}
@keyframes rl1{0%{color:var(--muted)} 24.9%{color:var(--muted)} 25.0%{color:var(--ink)} 49.9%{color:var(--ink)} 50.0%{color:var(--muted)} 100%{color:var(--muted)}}
@keyframes dt1{0%{background:var(--rule-2)} 24.9%{background:var(--rule-2)} 25.0%{background:var(--accent)} 100%{background:var(--accent)}}
@keyframes cp2{0%{opacity:0;transform:translateY(48px)} 45.0%{opacity:0;transform:translateY(48px)} 52.0%{opacity:1;transform:none} 73.0%{opacity:1;transform:none} 80.0%{opacity:0;transform:translateY(-48px)} 100%{opacity:0;transform:translateY(-48px)}}
@keyframes im2{0%{opacity:0;transform:scale(.94)} 45.0%{opacity:0;transform:scale(.94)} 52.0%{opacity:1;transform:scale(1)} 73.0%{opacity:1;transform:scale(1.06)} 80.0%{opacity:0;transform:scale(1.2)} 100%{opacity:0;transform:scale(1.2)}}
@keyframes rl2{0%{color:var(--muted)} 49.9%{color:var(--muted)} 50.0%{color:var(--ink)} 74.9%{color:var(--ink)} 75.0%{color:var(--muted)} 100%{color:var(--muted)}}
@keyframes dt2{0%{background:var(--rule-2)} 49.9%{background:var(--rule-2)} 50.0%{background:var(--accent)} 100%{background:var(--accent)}}
@keyframes cp3{0%{opacity:0;transform:translateY(48px)} 70.0%{opacity:0;transform:translateY(48px)} 77.0%{opacity:1;transform:none} 100%{opacity:1;transform:none}}
@keyframes im3{0%{opacity:0;transform:scale(.94)} 70.0%{opacity:0;transform:scale(.94)} 77.0%{opacity:1;transform:scale(1)} 100%{opacity:1;transform:scale(1.1)}}
@keyframes rl3{0%{color:var(--muted)} 74.9%{color:var(--muted)} 75.0%{color:var(--ink)} 100%{color:var(--ink)}}
@keyframes dt3{0%{background:var(--rule-2)} 74.9%{background:var(--rule-2)} 75.0%{background:var(--accent)} 100%{background:var(--accent)}}
.pst{display:flex;flex-wrap:wrap;gap:var(--space-5);margin-top:var(--space-4)}
.pst div{display:flex;flex-direction:column}
.pst b{font-size:40px;line-height:1;letter-spacing:-.03em;font-weight:700}
.pst span{color:var(--muted);font-size:15px;margin-top:var(--space-1)}
.pt-feat{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--col-gap);align-items:center}
.pt-feat figure{margin:0;background:var(--paper-2);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center}
.pt-feat img{width:100%;height:100%;object-fit:contain;padding:var(--space-3)}
.pt-kick{display:inline-block;padding:var(--space-0) var(--space-2);background:var(--accent);color:var(--accent-ink);font-size:14px;font-weight:700;margin-bottom:var(--space-2)}
.pt-feat ul{list-style:none;padding:0;margin:var(--space-3) 0;display:grid;gap:var(--space-2)}
.pt-feat li{padding-left:var(--space-3);position:relative}
.pt-feat li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;background:var(--accent)}
.pt{position:relative}
.pt-r{position:absolute;opacity:0;pointer-events:none}
.pt-bar{position:sticky;top:var(--hdr);z-index:5;background:var(--paper);border-bottom:1px solid var(--rule-2)}
.pt-tabs{display:flex;gap:var(--space-2);padding:var(--space-2) 0;overflow-x:auto;scrollbar-width:thin}
/* waive shape lock: category tabs are pills so they read as filter chips, distinct from square product cards. */
.pt-tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);border:1px solid var(--rule-2);border-radius:999px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background-color 300ms var(--t-ease),color 300ms var(--t-ease),border-color 300ms var(--t-ease)}
.pt-tab:hover{border-color:var(--ink)}
.pt-tab i{font-style:normal;font-size:14px;opacity:.65}
.pp{display:none}
.pp-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--space-3);margin:var(--space-5) 0 var(--space-4)}
.pp-head p{max-width:var(--measure);color:var(--muted)}
.pl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3)}
.pt-panels{min-height:1500px}
.pc-cat{font-size:14px;font-weight:600;color:var(--accent)}
.pl .pc-name{font-size:19px}
.pc-opt{font-size:14px;color:var(--ink)}
.pc-reg{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-top:var(--space-1)}
.pc-reg span{font-size:12px;font-weight:600;padding:0 var(--space-1);border:1px solid var(--rule-2);color:var(--muted)}
.pc-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:14px}
.rgn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap);margin-top:var(--space-4)}
.rgn{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);background:var(--paper);border:1px solid var(--rule-2);scroll-margin-top:calc(var(--hdr) + var(--space-3))}
.rgn b{font-size:48px;line-height:1;letter-spacing:-.03em}
.rgn p{color:var(--muted);flex:1}
@container pg (max-width:1100px){.pl{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container pg (max-width:900px){.pl{grid-template-columns:repeat(2,minmax(0,1fr))}.pt-feat,.rgn-grid{grid-template-columns:minmax(0,1fr)}.pt-panels{min-height:0}}
@container pg (max-width:560px){.pst b{font-size:32px}}
@media (prefers-reduced-motion:reduce){.pt-tab{transition:none}}
.pt:has(#pt0:checked) #pp0{display:block}.pt:has(#pt0:checked) .pt-tab[for=pt0]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.pt:has(#pt0:focus-visible) .pt-tab[for=pt0]{outline:2px solid var(--focus);outline-offset:2px;transition:none}.pt:has(#pt1:checked) #pp1{display:block}.pt:has(#pt1:checked) .pt-tab[for=pt1]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.pt:has(#pt1:focus-visible) .pt-tab[for=pt1]{outline:2px solid var(--focus);outline-offset:2px;transition:none}.pt:has(#pt2:checked) #pp2{display:block}.pt:has(#pt2:checked) .pt-tab[for=pt2]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.pt:has(#pt2:focus-visible) .pt-tab[for=pt2]{outline:2px solid var(--focus);outline-offset:2px;transition:none}
.hdr-in{min-height:var(--hdr)}
.logo img{height:64px}
.nav{font-size:21px;font-weight:700;gap:var(--space-0) var(--space-4)}
.nav .dd-menu a{font-size:19px;font-weight:600}
.hdr-cta{font-size:19px;font-weight:700}
.mm summary{font-size:19px;font-weight:700}
.mm-list a{font-size:19px;font-weight:700}
.mm-list a.sub{font-weight:500}
.loc h3{font-size:30px}
.team{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3)}
/* waive shape lock: team cards, photos and the bio modal use rounded corners as requested. */
.member{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-1);background:var(--paper);border:1px solid var(--rule-2);border-radius:var(--space-3);transition:border-color 300ms var(--t-ease),box-shadow 500ms var(--t-ease),transform 500ms var(--t-ease)}
.member:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(calc(var(--space-1) * -1))}
.member>.pic{aspect-ratio:1/1;border-radius:var(--space-2)}
.m-body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-0);padding:0 var(--space-1) var(--space-1)}
.member h3{font-size:21px}
.m-body .role{color:var(--muted)}
.m-body .btn{margin-top:var(--space-1);min-height:44px}
.m-modal:not(:popover-open){display:none}
.m-modal:popover-open{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:var(--space-4);width:min(92vw,880px);max-height:90vh;overflow:auto;padding:var(--space-4);border:0;border-radius:var(--space-3);background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}
.m-modal::backdrop{background:color-mix(in srgb,var(--stage) 62%,transparent)}
.m-pic{aspect-ratio:4/5;border-radius:var(--space-2);align-self:start}
.m-info{display:flex;flex-direction:column;gap:var(--space-2)}
.m-info .role{color:var(--accent);font-weight:600}
.m-info p:last-child{line-height:1.6;max-width:var(--measure)}
.m-x{position:absolute;top:var(--space-2);right:var(--space-2);width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--rule-2);border-radius:50%;background:var(--paper);color:var(--ink);cursor:pointer;transition:background-color 300ms var(--t-ease),color 300ms var(--t-ease)}
.m-x:hover{background:var(--ink);color:var(--paper)}
.m-x svg{width:20px;height:20px}
@media (max-width:700px){.m-modal:popover-open{grid-template-columns:minmax(0,1fr)}.m-pic{max-width:240px}}
@media (prefers-reduced-motion:reduce){.member{transition:none}.member:hover{transform:none}}
@container pg (max-width:1100px){.team{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container pg (max-width:900px){.team{grid-template-columns:repeat(2,minmax(0,1fr))}.split.big,.split-wide.big{grid-template-columns:minmax(0,1fr)}}
@container pg (max-width:560px){.team{grid-template-columns:minmax(0,1fr)}}
.j3{height:2100px}
.j3 .stage{height:820px}
.j3 .stage-in{height:620px}
.j3 .stage-copy .btn{align-self:flex-start}
.j3 .c0 .lede,.j3 .c1 .lede,.j3 .c2 .lede{font-size:22px}
.j3 .rail{font-size:22px;font-weight:700}
@container pg (max-width:900px){.j3{height:1500px}.j3 .stage{height:700px}.j3 .stage-in{height:560px}}
@supports (animation-timeline: view()){.j3 .c0{animation-name:cpq0}.j3 .i0{animation-name:imq0}.j3 .rd0{animation-name:rlq0}.j3 .rd0::before{animation-name:dtq0}.j3 .c1{animation-name:cpq1}.j3 .i1{animation-name:imq1}.j3 .rd1{animation-name:rlq1}.j3 .rd1::before{animation-name:dtq1}.j3 .c2{animation-name:cpq2}.j3 .i2{animation-name:imq2}.j3 .rd2{animation-name:rlq2}.j3 .rd2::before{animation-name:dtq2}}
@keyframes cpq0{0%{opacity:1;transform:none} 31.3%{opacity:1;transform:none} 38.3%{opacity:0;transform:translateY(-48px)} 100%{opacity:0;transform:translateY(-48px)}}
@keyframes imq0{0%{opacity:1;transform:scale(1)} 31.3%{opacity:1;transform:scale(1.06)} 38.3%{opacity:0;transform:scale(1.2)} 100%{opacity:0;transform:scale(1.2)}}
@keyframes rlq0{0%{color:var(--ink)} 33.2%{color:var(--ink)} 33.3%{color:var(--muted)} 100%{color:var(--muted)}}
@keyframes dtq0{0%{background:var(--accent)} 100%{background:var(--accent)}}
@keyframes cpq1{0%{opacity:0;transform:translateY(48px)} 28.3%{opacity:0;transform:translateY(48px)} 35.3%{opacity:1;transform:none} 64.7%{opacity:1;transform:none} 71.7%{opacity:0;transform:translateY(-48px)} 100%{opacity:0;transform:translateY(-48px)}}
@keyframes imq1{0%{opacity:0;transform:scale(.94)} 28.3%{opacity:0;transform:scale(.94)} 35.3%{opacity:1;transform:scale(1)} 64.7%{opacity:1;transform:scale(1.06)} 71.7%{opacity:0;transform:scale(1.2)} 100%{opacity:0;transform:scale(1.2)}}
@keyframes rlq1{0%{color:var(--muted)} 33.2%{color:var(--muted)} 33.3%{color:var(--ink)} 66.6%{color:var(--ink)} 66.7%{color:var(--muted)} 100%{color:var(--muted)}}
@keyframes dtq1{0%{background:var(--rule-2)} 33.2%{background:var(--rule-2)} 33.3%{background:var(--accent)} 100%{background:var(--accent)}}
@keyframes cpq2{0%{opacity:0;transform:translateY(48px)} 61.7%{opacity:0;transform:translateY(48px)} 68.7%{opacity:1;transform:none} 100%{opacity:1;transform:none}}
@keyframes imq2{0%{opacity:0;transform:scale(.94)} 61.7%{opacity:0;transform:scale(.94)} 68.7%{opacity:1;transform:scale(1)} 100%{opacity:1;transform:scale(1.1)}}
@keyframes rlq2{0%{color:var(--muted)} 66.6%{color:var(--muted)} 66.7%{color:var(--ink)} 100%{color:var(--ink)}}
@keyframes dtq2{0%{background:var(--rule-2)} 66.6%{background:var(--rule-2)} 66.7%{background:var(--accent)} 100%{background:var(--accent)}}
/* breadcrumb banner */
.ph{position:relative;isolation:isolate;color:var(--stage-ink);padding-block:clamp(72px,9vw,128px) clamp(48px,6vw,88px)}
.ph-bg{position:absolute;inset:0;z-index:-1;background:var(--stage)}
.ph-bg img{width:100%;height:100%;object-fit:cover}
.ph-bg::after{content:"";position:absolute;inset:0;background:color-mix(in srgb,var(--stage) 68%,transparent)}
.ph .lede{color:var(--stage-ink)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:var(--space-1);padding:0;margin:0 0 var(--space-3);font-size:18px;font-weight:600}
.crumbs li+li::before{content:"/";margin-right:var(--space-1);opacity:.6}
.crumbs a{text-decoration:underline;text-underline-offset:4px;text-decoration-color:transparent;transition:text-decoration-color 300ms var(--t-ease)}
.crumbs a:hover{text-decoration-color:currentColor}
.crumbs [aria-current]{opacity:.8}
.ph-x{padding-top:var(--space-4)}
/* office cards */
.oc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap)}
.oc{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--rule-2);transition:border-color 300ms var(--t-ease),box-shadow 500ms var(--t-ease),transform 500ms var(--t-ease)}
.oc:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(calc(var(--space-1) * -1))}
.oc-img{position:relative;aspect-ratio:4/3;background:var(--paper-2);overflow:hidden}
.oc-img img{width:100%;height:100%;object-fit:cover}
.oc-n{position:absolute;left:0;bottom:0;padding:var(--space-1) var(--space-3);background:var(--accent);color:var(--accent-ink);font-size:28px;font-weight:800;letter-spacing:-.02em}
.oc-body{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);flex:1}
.oc-role{color:var(--accent);font-weight:600}
.oc-co{font-weight:600}
.oc-line{display:flex;gap:var(--space-2);align-items:flex-start;color:var(--ink-2);transition:color 300ms var(--t-ease)}
a.oc-line:hover{color:var(--accent)}
.oc-i{flex:0 0 32px;width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--rule-2);color:var(--accent)}
.oc-i svg{width:16px;height:16px}
.oc-body .link{margin-top:auto}
@container pg (max-width:900px){.oc-grid{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.oc{transition:none}.oc:hover{transform:none}}

/* hero art: real product collage with subtle motion */
.hero-art{position:relative;aspect-ratio:960/1120}
.ha-img{position:relative;display:block;width:100%;height:100%;object-fit:contain;opacity:0;animation:t-in var(--t-dur) var(--t-ease) 200ms forwards,ha-drift 10s ease-in-out 1s infinite}
.ha-ring{position:absolute;left:50%;top:6%;width:84%;aspect-ratio:1;margin-left:-42%;color:var(--accent);opacity:.55;animation:ha-spin 90s linear infinite}
.ha-chip{position:absolute;padding:var(--space-0) var(--space-2);background:var(--ink);color:var(--paper);font-size:15px;font-weight:700;white-space:nowrap;opacity:0;animation:t-in var(--t-dur) var(--t-ease) forwards,ha-bob 6s ease-in-out infinite}
.ha-c1{left:4%;top:80%;animation-delay:700ms,0s}
.ha-c2{right:2%;top:12%;animation-delay:850ms,-1.5s}
@keyframes ha-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(calc(var(--space-2) * -1))}}
@keyframes ha-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(calc(var(--space-1) * -1))}}
@keyframes ha-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ha-img,.ha-chip{animation:none;opacity:1}.ha-ring{animation:none}}

/* welcome: rotating particle sphere behind frosted stat cards */
/* waive shape lock: sphere particles are round dots. */
.wel{overflow:hidden;content-visibility:auto;contain-intrinsic-size:auto 800px}
.wel-grid{position:relative;display:block}
.wel-copy{position:relative;z-index:1;max-width:min(560px,46%);margin-left:auto;min-height:360px;justify-content:flex-start;padding-top:var(--space-4)}
.wel-copy .lede{font-size:26px;line-height:1.35;max-width:30ch}
.sp{--R:230px;contain:layout paint;position:absolute;left:12%;top:0;width:calc(var(--R) * 2 + 40px);height:calc(var(--R) * 2 + 40px);perspective:1100px;z-index:0;opacity:0;animation:t-in 1200ms var(--t-ease) 200ms forwards}
.sp-tilt{position:absolute;inset:0;transform:rotateZ(-14deg);transform-style:preserve-3d}
.sp-in{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;animation:sp-spin 80s linear infinite;will-change:transform}
.sp-in i{position:absolute;left:0;top:0;width:var(--s);height:var(--s);margin:calc(var(--s) / -2);border-radius:50%;background:color-mix(in srgb,var(--sp-a),var(--sp-m) calc(var(--t) * 100%));opacity:var(--o);transform:rotateY(var(--y)) rotateX(var(--x)) translateZ(var(--R))}
.sp-in i.b{background:color-mix(in srgb,var(--sp-m),var(--sp-z) calc(var(--t) * 100%))}
@keyframes sp-spin{to{transform:rotateY(360deg)}}
.wel-stats{position:relative;z-index:1;margin-top:var(--space-2)}
.wel-stats .fig{display:flex;flex-direction:column;justify-content:space-between;min-height:200px;padding:var(--space-4);border:1px solid var(--rule-2);border-top:1px solid var(--rule-2);background:color-mix(in srgb,var(--paper) 72%,transparent);color:var(--muted);font-size:18px;line-height:1.35}
.wel-stats .fig b{display:block;margin:0;font-size:clamp(44px,4.4cqw,64px);line-height:1;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.wel-stats .fig b i{font-style:normal;color:var(--accent)}
@container pg (max-width:900px){.wel-copy{max-width:none;min-height:0;margin-left:0}.sp{--R:140px;position:relative;margin:var(--space-3) auto 0;left:auto}.wel-stats{margin-top:calc(var(--space-6) * -1)}}
@container pg (max-width:560px){.wel-stats{grid-template-columns:minmax(0,1fr)}.wel-stats .fig{min-height:0;gap:var(--space-2);font-size:16px}}
@media (prefers-reduced-motion:reduce){.sp{animation:none;opacity:1}.sp-in{animation:none}}

/* New Projects cards: plain rectangle */
.pj-pic{aspect-ratio:4/3;clip-path:none;transition:none;border:1px solid var(--rule-2)}
.pj:hover .pj-pic{clip-path:none}

.slider{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,var(--ink) 6%,var(--ink) 94%,transparent);mask-image:linear-gradient(90deg,transparent,var(--ink) 6%,var(--ink) 94%,transparent)}
.slide-track{display:flex;width:max-content;animation:slide 48s linear infinite;will-change:transform}
.slider:hover .slide-track,.slider:focus-within .slide-track{animation-play-state:paused}
.slide{flex:0 0 clamp(240px,24vw,320px);flex:0 0 clamp(240px,24cqw,320px);margin-right:var(--space-4)}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.slider{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.slide-track{animation:none}.slide[aria-hidden]{display:none}}

.rev>*:first-child{order:2}
@container pg (max-width:900px){.rev>*:first-child{order:0}}
.row-post{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--col-gap);align-items:center;padding-block:var(--space-4)}
.tabs{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-top:var(--space-3)}
.tabs a{min-height:44px;padding:0 20px;display:inline-flex;align-items:center;font-weight:600;border:2px solid var(--ink);transition:background-color 300ms var(--t-ease),color 300ms var(--t-ease)}
.tabs a:hover{background:var(--accent-tint)}
FONT=''
.ind-list li{padding:var(--space-1) 0}
.tile-cta{display:flex;align-items:center;justify-content:center;background:var(--accent-tint);aspect-ratio:1/1;font-size:26px;font-weight:800;letter-spacing:-.03em;text-align:center;padding:var(--space-2);color:var(--accent);transition:background-color 300ms var(--t-ease)}
.tile-cta:hover{background:var(--paper-2)}
@container pg (max-width:900px){.row-post{grid-template-columns:minmax(0,1fr)}}


/* form confirmation (js/main.js) */
.form-ok{margin-top:var(--space-2);padding:var(--space-2);border:1px solid var(--accent);color:var(--ink);background:var(--accent-tint)}