/* Variani guides & collections, v2: modern luxury editorial.
   Neutral palette only (no brown, no purple). Links blue; visited set explicitly. */
:root{
  --ink:#0a0b0d;--ink-2:#111317;--ink-3:#191c21;--paper:#f4f5f6;--white:#fff;
  --text:#121418;--muted:#666c76;--muted-d:#9aa1ab;--line:#dfe2e6;--line-d:rgba(255,255,255,.12);
  --blue:#2459e0;--blue-d:#8db4ff;
  --steel:linear-gradient(100deg,#ffffff 0%,#c9d0d9 45%,#8e97a3 100%);
  --display:"Inter Tight","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --wrap:1320px;--gut:clamp(20px,4vw,48px);--ease:cubic-bezier(.2,.7,.1,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--text);font:400 17.5px/1.75 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
a:visited{color:var(--blue)}a:hover{color:#1a44b8}
.dk a,.dk a:visited{color:var(--blue-d)}
::selection{background:#111;color:#fff}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
h1,h2,h3,h4{font-family:var(--display);margin:0 0 .45em;line-height:1.05;color:inherit;font-weight:300}
p{margin:0 0 1.15em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:200;background:#fff;color:#000;padding:8px 12px}
.mono{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.dk{background:var(--ink);color:#e9ecf0}
.grid>*,.layout>*,.rail-track>*,.rail-grid>*,.figs>*,.pc>*,.cols>*,.brief .facts>*,.hgrid>*{min-width:0}

/* progress + header */
.progress{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,#8db4ff,#fff);z-index:120}
.hdr{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .4s var(--ease),border-color .4s;border-bottom:1px solid transparent}
.hdr.solid{background:rgba(10,11,13,.84);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-bottom-color:var(--line-d)}
.hdr .in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:76px;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.hdr nav{display:flex;gap:28px}
.hdr nav.r{justify-content:flex-end;align-items:center}
.hdr nav a,.hdr nav a:visited{color:#cfd4db;text-decoration:none;font:500 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;transition:color .2s}
.hdr nav a:hover,.hdr nav a[aria-current]{color:#fff}
.hdr .logo img{height:18px;width:auto}
.hdr nav .tel,.hdr nav .tel:visited{border:1px solid rgba(255,255,255,.28);padding:11px 16px;color:#fff}
.menu-btn{display:none;background:none;border:0;color:#fff;font:500 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;justify-self:end;padding:10px 0}
.overlay{position:fixed;inset:0;background:var(--ink);z-index:150;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:0 var(--gut);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.overlay.open{opacity:1;visibility:visible}
.overlay a,.overlay a:visited{color:#fff;text-decoration:none;font:300 clamp(2rem,9vw,3.2rem)/1.3 var(--display);letter-spacing:-.03em}
.overlay .x{position:absolute;top:28px;right:var(--gut);background:none;border:0;color:#fff;font:500 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
@media(max-width:1060px){.hdr nav{display:none}.hdr .in{grid-template-columns:auto 1fr}.menu-btn{display:block}}

/* buttons */
.btn,.btn:visited{display:inline-flex;align-items:center;gap:14px;padding:19px 30px;font:500 .72rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;transition:background .3s var(--ease),color .3s,border-color .3s;border:1px solid transparent}
.btn .ar{transition:transform .3s var(--ease)}.btn:hover .ar{transform:translateX(5px)}
.btn-w,.btn-w:visited{background:#fff;color:#0a0b0d}.btn-w:hover{background:#dfe4ea;color:#0a0b0d}
.btn-o,.btn-o:visited{border-color:rgba(255,255,255,.35);color:#fff}.btn-o:hover{border-color:#fff;color:#fff}
.btn-l,.btn-l:visited{border-color:var(--text);color:var(--text)}.btn-l:hover{background:var(--text);color:#fff}
.btns{display:flex;flex-wrap:wrap;gap:12px}

/* hero */
.hero{position:relative;min-height:max(740px,100svh);display:flex;align-items:flex-end;overflow:hidden;background:radial-gradient(80% 70% at 72% 45%,#272c34 0%,#14171b 48%,#0a0b0d 100%);color:#fff;isolation:isolate}
.hero:after{content:"";position:absolute;inset:0;z-index:1;opacity:.06;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero .bg{position:absolute;inset:0;z-index:-1}
.hero .bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);animation:kb 18s var(--ease) forwards}
.hero .bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,11,13,.94) 0%,rgba(10,11,13,.72) 45%,rgba(10,11,13,.2) 100%),linear-gradient(0deg,rgba(10,11,13,.9) 0%,rgba(10,11,13,0) 50%)}
@keyframes kb{to{transform:scale(1)}}
.hero .in{position:relative;z-index:2;width:100%;max-width:var(--wrap);margin:0 auto;padding:150px var(--gut) 80px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:center}
.hero .crumbs{font:500 .68rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted-d);margin-bottom:34px}
.hero .crumbs a,.hero .crumbs a:visited{color:var(--muted-d);text-decoration:none}.hero .crumbs a:hover{color:#fff}
.hero h1{font-size:clamp(2.8rem,5.6vw,6.1rem);text-wrap:balance;letter-spacing:-.05em;line-height:.94;margin-bottom:34px;font-weight:300}
.hero h1 em{font-style:normal;background:var(--steel);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .dek{font-size:clamp(1.05rem,1.35vw,1.22rem);line-height:1.65;color:#b8bec7;max-width:560px;margin-bottom:42px;font-weight:300}
.meta{display:flex;flex-wrap:wrap;gap:10px 30px;margin-top:60px;padding-top:22px;border-top:1px solid var(--line-d);color:var(--muted-d);align-items:center}
.meta b{color:#fff;font-weight:500}
.meta img{width:30px;height:30px;border-radius:50%;object-fit:cover;object-position:top;filter:grayscale(1)}
.stage{position:relative;height:min(64vh,620px);align-self:center}
.stage .glow{position:absolute;inset:8% 0;background:radial-gradient(closest-side,rgba(141,180,255,.14),transparent 75%)}
.stage .pc-img{position:absolute;filter:drop-shadow(0 50px 45px rgba(0,0,0,.6)) drop-shadow(0 10px 14px rgba(0,0,0,.4))}
.stage .pc-img img{width:100%;height:auto}
.float{animation:float 8s ease-in-out infinite}
.float.d2{animation-delay:-2.6s}.float.d3{animation-delay:-5.2s}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -16px}}
.hero .scroll{position:absolute;z-index:2;left:50%;bottom:20px;translate:-50% 0;color:var(--muted-d);font:500 .6rem/1 var(--sans);letter-spacing:.26em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:10px}
.hero .scroll:after{content:"";width:1px;height:36px;background:linear-gradient(#fff,transparent);animation:drip 2.4s var(--ease) infinite;transform-origin:top}
@keyframes drip{0%{transform:scaleY(0)}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
@media(max-width:900px){.hero{min-height:0}.hero .in{grid-template-columns:minmax(0,1fr);padding-top:110px;padding-bottom:56px}.stage{height:min(78vw,380px);order:-1}.hero .scroll{display:none}.meta{margin-top:40px}}

/* marquee */
.marquee{background:var(--ink);color:#cfd5dc;border-top:1px solid var(--line-d);overflow:hidden;white-space:nowrap;position:relative;z-index:3}
.marquee .t{display:inline-flex;animation:mq 46s linear infinite;padding:24px 0}
.marquee span{font:300 1.02rem/1 var(--display);letter-spacing:.01em;padding:0 36px;position:relative}
.marquee span:after{content:"";position:absolute;right:-4px;top:50%;width:6px;height:6px;border:1px solid #6d7580;transform:translateY(-50%) rotate(45deg)}
@keyframes mq{to{transform:translateX(-50%)}}

/* in brief */
.brief{padding:clamp(84px,10vw,150px) 0 clamp(64px,7vw,110px);background:var(--white)}
.brief .grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px}
.brief .lbl{color:var(--muted);padding-top:14px}
.brief .lede{font:300 clamp(1.5rem,2.6vw,2.3rem)/1.36 var(--display);letter-spacing:-.022em;color:var(--text);margin:0;max-width:1000px}
.brief .facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 24px;margin-top:70px}
.brief .facts div{padding:22px 0 0;border-top:1px solid var(--text)}
.brief .facts .mono{color:var(--muted);display:block;margin-bottom:12px}
.brief .facts b{font:400 1.1rem/1.4 var(--display);display:block;letter-spacing:-.01em}
@media(max-width:900px){.brief .grid{grid-template-columns:minmax(0,1fr);gap:16px}.brief .facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;margin-top:44px}.brief .facts div{padding-bottom:22px}}

/* article */
.art{background:var(--paper);padding:clamp(80px,9vw,140px) 0 40px}
.layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(40px,7vw,120px)}
.toc{position:sticky;top:112px;align-self:start}
.toc .mono{color:var(--muted);margin-bottom:22px;display:block}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.toc li{counter-increment:t}
.toc a,.toc a:visited{display:grid;grid-template-columns:32px minmax(0,1fr);padding:10px 0;color:var(--muted);text-decoration:none;font-size:.85rem;line-height:1.45;border-top:1px solid var(--line);transition:color .25s}
.toc a:before{content:counter(t,decimal-leading-zero);font:400 .66rem/2 var(--mono)}
.toc a:hover,.toc a.on{color:var(--text)}
.toc a.on:before{color:var(--blue)}
.toc-m{display:none}
@media(max-width:1060px){.layout{grid-template-columns:minmax(0,1fr)}.toc{display:none}.toc-m{display:block;margin:0 0 56px;border-top:1px solid var(--text);border-bottom:1px solid var(--line)}.toc-m summary{cursor:pointer;padding:18px 0;list-style:none}.toc-m summary::-webkit-details-marker{display:none}.toc-m ol{margin:0 0 20px;padding-left:22px;font-size:.95rem}}
.prose{max-width:780px}
.sec{margin-bottom:clamp(80px,9vw,130px)}
.sec-h{margin-bottom:38px}
.sec-h .num{display:block;font:200 clamp(4.2rem,9vw,8rem)/.8 var(--display);letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1px #aab1ba;margin-bottom:22px}
.sec-h h2{text-wrap:balance;font-size:clamp(2rem,3.7vw,3.2rem);letter-spacing:-.038em;margin:0;padding-top:22px;border-top:1px solid var(--text)}
.prose h3{font-weight:500;font-size:1.2rem;letter-spacing:-.01em;margin-top:1.6em}
.prose ul,.prose ol{padding-left:1.2em;margin:0 0 1.3em}
.prose li{margin-bottom:.5em}
.prose strong{font-weight:600}
.prose .lead{font:300 clamp(1.25rem,1.9vw,1.5rem)/1.55 var(--display);letter-spacing:-.012em;color:#22262b}

figure.fig{margin:2.8em 0}
figure.fig img{width:100%}
figcaption{font:400 .8rem/1.55 var(--sans);color:var(--muted);margin-top:14px;padding-left:14px;border-left:1px solid #b9bfc7}
.figs{display:grid;gap:12px;margin:2.8em 0}
.figs.c2{grid-template-columns:repeat(2,minmax(0,1fr))}.figs.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.figs figure{margin:0}
.figs img{width:100%;aspect-ratio:9/14;object-fit:cover;background:var(--ink)}
.film{background:var(--ink);padding:14px 14px 4px;margin:2.8em 0}
.film .figs{margin:0}
.film figcaption{color:var(--muted-d);border-left-color:#3a3f47}
.film .lbl{display:flex;justify-content:space-between;color:var(--muted-d);padding:4px 2px 14px}
@media(max-width:640px){.figs.c3{grid-template-columns:repeat(2,minmax(0,1fr))}}

blockquote.pull{margin:3.4em 0;padding:0;font:300 clamp(1.8rem,3.2vw,2.7rem)/1.22 var(--display);letter-spacing:-.032em;color:var(--text)}
blockquote.pull:before{content:"\201C";display:block;font:200 7rem/.55 var(--display);color:transparent;-webkit-text-stroke:1px #9aa1ab;margin-bottom:8px}
blockquote.pull cite{display:block;margin-top:22px;font:400 .7rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-style:normal}

.callout{margin:2.6em 0;padding:6px 0 6px 28px;border-left:1px solid var(--text);font-size:1rem}
.callout b:first-child{display:block;font:400 .68rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0 24px;margin:2.8em 0}
.stats div{padding:24px 0 8px;border-top:1px solid var(--text)}
.stats b{display:block;font:200 clamp(2.5rem,4.2vw,3.6rem)/1 var(--display);letter-spacing:-.05em;margin-bottom:14px;font-variant-numeric:tabular-nums}
.stats span{font-size:.86rem;color:var(--muted);line-height:1.5;display:block}

.tbl{width:100%;overflow-x:auto;margin:2.8em 0;-webkit-overflow-scrolling:touch}
.tbl table{border-collapse:collapse;width:100%;min-width:580px;font-size:.93rem;line-height:1.5}
.tbl th,.tbl td{padding:17px 18px 17px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.tbl thead th{font:400 .66rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--text);padding-top:0}
.tbl tbody th{font-weight:600}
.tbl .hl th,.tbl .hl td{background:linear-gradient(90deg,#e6ecf8,rgba(230,236,248,0) 90%)}
.tbl .hl th{box-shadow:inset 2px 0 0 var(--blue);padding-left:14px}
.tbl .num{font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl caption{caption-side:bottom;text-align:left;font-size:.8rem;color:var(--muted);padding-top:14px}

.steps{list-style:none;counter-reset:s;padding:0!important;margin:2.6em 0}
.steps li{counter-increment:s;position:relative;padding:24px 0 22px 72px;border-top:1px solid var(--line);margin:0}
.steps li:last-child{border-bottom:1px solid var(--line)}
.steps li:before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:26px;font:200 2rem/1 var(--display);letter-spacing:-.04em;color:#9aa1ab}
.steps b{display:block;font:500 1.08rem/1.4 var(--display);margin-bottom:6px;letter-spacing:-.01em}

.pc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;margin:2.6em 0}
.pc>div{padding:24px 0 10px;border-top:1px solid var(--text)}
.pc h4{font:500 1.05rem/1.3 var(--display);margin-bottom:14px}
.pc ul{margin:0;padding-left:1.1em;font-size:.95rem}
@media(max-width:640px){.pc{grid-template-columns:minmax(0,1fr)}}

.diagram{margin:2.8em 0;padding:clamp(18px,3vw,36px);background:var(--white);overflow-x:auto;-webkit-overflow-scrolling:touch}
@media(max-width:640px){.diagram svg{min-width:600px}}

/* products */
.rail{background:var(--ink);color:#fff;padding:clamp(96px,11vw,160px) 0;overflow:hidden}
.rail-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:60px}
.rail-head h2{font-size:clamp(2.6rem,5.4vw,5rem);letter-spacing:-.05em;margin:16px 0 16px;line-height:.96}
.rail-head p{color:var(--muted-d);max-width:520px;margin:0;font-weight:300}
.rail-head .mono{color:var(--muted-d)}
.rail-ctl{display:flex;gap:10px}
.rail-ctl button{width:56px;height:56px;border:1px solid var(--line-d);background:none;color:#fff;cursor:pointer;font-size:1.05rem;transition:border-color .2s,background .2s}
.rail-ctl button:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.rail-track{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(250px,27vw,380px);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 var(--gut);margin:0 calc(var(--gut)*-1);scroll-padding:0 var(--gut);scroll-behavior:smooth}
.rail-track::-webkit-scrollbar{display:none}
.rail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 18px}
@media(max-width:900px){.rail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 10px}}
.tile,.tile:visited{scroll-snap-align:start;display:block;text-decoration:none;color:#fff}
.tile:hover{color:#fff}
.tile .ph{position:relative;aspect-ratio:1/1;overflow:hidden;background:#fff}
.tile .ph.lt{background:radial-gradient(70% 58% at 50% 46%,#ffffff,#e2e5e9 80%)}
.tile .ph img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.tile .ph.lt img{mix-blend-mode:multiply;filter:none}
.tile:hover .ph img{transform:scale(1.03)}
.tile .tag{position:absolute;top:18px;left:18px;font:400 .6rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#4a5059}
.tile .ph.lt .tag{color:#4a5059}
.tile .tx{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:20px 2px 0}
.tile .nm{font:400 1.05rem/1.35 var(--display);letter-spacing:-.01em}
.tile .ds{display:block;font-size:.83rem;color:var(--muted-d);line-height:1.5;margin-top:6px;font-weight:300}
.tile .pr{font:400 .8rem/1 var(--mono);letter-spacing:.06em;white-space:nowrap}

@media(max-width:600px){.tile .tx{flex-direction:column;gap:6px}.tile .ds{display:none}.stage{margin-bottom:24px}.rail-ctl{display:none}}

/* faq */
.faq{padding:clamp(96px,11vw,160px) 0;background:var(--white)}
.faq .grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,7vw,120px)}
.faq h2{font-size:clamp(2.6rem,5vw,4.6rem);letter-spacing:-.05em;line-height:.96;margin:16px 0 26px}
.faq .side .mono{color:var(--muted)}
.faq .side p{color:var(--muted)}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:28px 60px 28px 0;font:400 1.2rem/1.4 var(--display);letter-spacing:-.012em;position:relative;transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--blue)}
.faq summary:before,.faq summary:after{content:"";position:absolute;right:6px;top:50%;width:16px;height:1px;background:currentColor;transition:transform .35s var(--ease)}
.faq summary:after{transform:rotate(90deg)}
.faq details[open] summary:after{transform:rotate(0)}
.faq details p{color:#3d424a;margin:-8px 0 30px;max-width:640px}
@media(max-width:900px){.faq .grid{grid-template-columns:minmax(0,1fr)}}

/* author */
.author{background:var(--white);padding:0 0 clamp(96px,11vw,150px)}
.author .card{display:grid;grid-template-columns:160px minmax(0,1fr);gap:44px;align-items:center;padding-top:48px;border-top:1px solid var(--text)}
.author img{width:160px;height:160px;border-radius:50%;object-fit:cover;object-position:top;filter:grayscale(1) contrast(1.05);transition:filter .6s}
.author .card:hover img{filter:none}
.author .mono{color:var(--muted)}
.author h3{font-size:clamp(1.8rem,3vw,2.4rem);letter-spacing:-.035em;margin:10px 0 12px}
.author p{color:var(--muted);margin:0;max-width:760px}
@media(max-width:640px){.author .card{grid-template-columns:minmax(0,1fr);gap:24px}}

/* related list */
.next{background:var(--paper);padding:clamp(96px,11vw,150px) 0}
.next .mono{color:var(--muted)}
.next h2{font-size:clamp(2.4rem,4.4vw,4rem);letter-spacing:-.045em;margin:16px 0 48px}
.nrow,.nrow:visited{display:grid;grid-template-columns:80px minmax(0,1fr) 170px 40px;align-items:center;gap:20px;padding:32px 0;border-top:1px solid var(--line);color:var(--text);text-decoration:none;transition:padding .45s var(--ease)}
.nrow:last-child{border-bottom:1px solid var(--line)}
.nrow:hover{padding-left:18px;color:var(--text)}
.nrow .n{font:200 2rem/1 var(--display);color:#9aa1ab;letter-spacing:-.04em}
.nrow .t{font:300 clamp(1.35rem,2.5vw,2.1rem)/1.2 var(--display);letter-spacing:-.028em}
.nrow .cat{color:var(--muted)}
.nrow .ar{font-size:1.3rem;transition:transform .35s var(--ease);justify-self:end}
.nrow:hover .ar{transform:translateX(6px)}
@media(max-width:700px){.nrow{grid-template-columns:48px minmax(0,1fr) 24px}.nrow .cat{display:none}.nrow .n{font-size:1.4rem}}

/* cta */
.cta{position:relative;overflow:hidden;padding:clamp(120px,14vw,200px) 0;background:#0a0b0d;color:#fff;text-align:center;isolation:isolate}
.cta h2{font-size:clamp(2.8rem,6.6vw,6.6rem);letter-spacing:-.055em;line-height:.94;max-width:1150px;margin:24px auto 28px}
.cta h2 em{font-style:normal;background:var(--steel);-webkit-background-clip:text;background-clip:text;color:transparent}
.cta p{color:var(--muted-d);max-width:600px;margin:0 auto 46px;font-weight:300;font-size:1.12rem}
.cta .btns{justify-content:center}
.cta .mono{color:var(--muted-d)}
.assure{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 44px;margin-top:80px;color:var(--muted-d)}
.cta .belt{position:absolute;z-index:-1;opacity:.22;pointer-events:none}

/* hub */
.hub{background:var(--paper);padding:clamp(96px,11vw,150px) 0}
.hgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:56px 22px}
.hcard,.hcard:visited{grid-column:span 4;display:block;text-decoration:none;color:var(--text)}
.hcard:hover{color:var(--text)}
.hcard.big{grid-column:span 6}
.hcard .im{aspect-ratio:4/3;overflow:hidden;background:var(--ink)}
.hcard .im img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.hcard .im.cut{display:grid;place-items:center;background:radial-gradient(70% 58% at 50% 46%,#2c323a,#131519 72%)}
.hcard .im.cut img{width:70%;height:78%;object-fit:contain;filter:drop-shadow(0 24px 20px rgba(0,0,0,.5))}
.hcard:hover .im img{transform:scale(1.05)}
.hcard .tx{padding:24px 0 0}
.hcard .mono{color:var(--muted)}
.hcard h3{font-size:clamp(1.45rem,2.2vw,2.05rem);letter-spacing:-.032em;margin:12px 0 10px}
.hcard p{color:var(--muted);font-size:.95rem;margin:0}
@media(max-width:900px){.hcard,.hcard.big{grid-column:span 12}}

/* footer */
.ftr{background:var(--ink);color:#bfc5cd;padding:120px 0 0;font-size:.92rem;overflow:hidden}
.ftr .cols{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px}
@media(max-width:860px){.ftr .cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ftr h4{font:400 .66rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#fff;margin:0 0 22px}
.ftr ul{list-style:none;margin:0;padding:0}.ftr li{margin-bottom:10px}
.ftr a,.ftr a:visited{color:#bfc5cd;text-decoration:none}.ftr a:hover{color:#fff}
.ftr address{font-style:normal;line-height:1.8}
.ftr .word{font:200 clamp(5rem,22vw,22rem)/.78 var(--display);letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.13);margin:100px 0 0;white-space:nowrap;text-align:center;user-select:none}
.ftr .base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line-d);padding:22px 0 28px;color:#7c838d;font-size:.8rem}
.wa{position:fixed;right:20px;bottom:20px;width:54px;height:54px;border-radius:50%;background:rgba(17,17,17,.9);border:1px solid rgba(255,255,255,.22);display:grid;place-items:center;z-index:90;transition:background .25s}
.wa:hover{background:#0f9d58}
.wa svg{width:23px;height:23px;fill:#fff}

/* reveal */
.js [data-r]{opacity:0;transform:translateY(30px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.js [data-r].is-in{opacity:1;transform:none}
.js [data-r="2"]{transition-delay:.12s}.js [data-r="3"]{transition-delay:.24s}.js [data-r="4"]{transition-delay:.36s}
.js .hero [data-r]{opacity:0;transform:translateY(26px);transition:none;animation:rise 1.1s var(--ease) forwards}
.js .hero [data-r="2"]{animation-delay:.1s}.js .hero [data-r="3"]{animation-delay:.22s}.js .hero [data-r="4"]{animation-delay:.34s}
@keyframes rise{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.js [data-r]{opacity:1;transform:none}}
