@font-face{font-family:Satoshi;src:url(/wp-content/themes/origami-2026/assets/20261010-od-r2/satoshi.woff2) format('woff2');font-weight:300 900;font-display:block}
:root{--ink:#121115;--ink2:#1a1820;--plum:#3a2145;--plum2:#4d2d5c;--plum3:#2a1834;--paper:#e5e1d6;--paper2:#f3f0e7;--silver:#bdb9b0;--text:#f4f1ea;--dim:#cbc7bd;--dark:#1b1920;--darkdim:#463f4f;--ease:cubic-bezier(.2,.7,.2,1);--gut:clamp(20px,4.5vw,72px)}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--ink);color:var(--text);font-family:Satoshi,Arial,sans-serif;font-weight:500;font-size:19px;line-height:1.5;overflow-x:hidden}
a{color:inherit}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{display:block;max-width:100%;height:auto}
.wrap{max-width:1560px;margin:0 auto;padding:0 var(--gut);position:relative}
.tex{position:absolute;inset:0;background:url(/wp-content/themes/origami-2026/assets/20261010-od-r2/paper.jpg) center/520px;pointer-events:none;opacity:.18}
.paperbg{background:var(--paper);color:var(--dark)}.paperbg>.tex{opacity:.5}
.inkbg{background:radial-gradient(ellipse at 22% 18%,#2a2231 0,transparent 58%),var(--ink2)}.inkbg>.tex{opacity:.035}
.plumbg{background:radial-gradient(ellipse at 80% 20%,#55346a 0,transparent 55%),linear-gradient(160deg,#3d2349,#251530);color:var(--text)}.plumbg>.tex{opacity:.04}
section{position:relative;overflow:hidden}
main>section:not(.hero):not(.markets):not(.owner){padding:clamp(96px,13vh,170px) 0}
/* type */
h1,h2{font-weight:700;letter-spacing:-.052em;line-height:.97}
h1{font-size:clamp(58px,7.4vw,118px);max-width:9em}
h2{font-size:clamp(50px,6.4vw,108px)}
h2.giant{font-size:clamp(58px,9vw,168px)}
.q{color:var(--silver)}.paperbg .q{color:#7a7283}.plumbg .q{color:#c9bfd2}
h3{font-weight:700;letter-spacing:-.035em;line-height:1.08}
.side{font-size:clamp(19px,1.55vw,24px);line-height:1.45;color:var(--dim);max-width:21em}
.paperbg .side{color:var(--darkdim)}
.split-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px 60px;flex-wrap:wrap;margin-bottom:clamp(40px,7vh,84px)}
.split-head .side{padding-bottom:.6em}
/* word reveal (one owner: CSS transition triggered by .in) */
.wr .w{display:inline-block}
.wr .w>span{display:inline-block;opacity:0;transform:translateY(.3em) rotate(1.5deg);filter:blur(3px);transform-origin:0 100%;transition:opacity .5s ease,transform .8s cubic-bezier(.2,.8,.2,1.05),filter .5s ease;transition-delay:calc(var(--i)*42ms)}
.wr.in .w>span{opacity:1;transform:none;filter:none}
html:not(.js) .wr .w>span{opacity:1;transform:none;filter:none}
.js .wr:not(.split){visibility:hidden}.js .sheet{transform:rotate(-4deg) rotateX(86deg)}.js .sheet-wrap{opacity:.1}
.rise{opacity:0;transform:translateY(22px);transition:opacity .55s,transform .75s var(--ease)}
.rise.in{opacity:1;transform:none}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:14px;padding:16px 24px;background:var(--paper2);color:#1b1920;font-weight:700;font-size:18px;text-decoration:none;letter-spacing:-.01em;transition:transform .35s var(--ease),background .3s,box-shadow .35s;box-shadow:0 14px 30px -14px #0009}
.btn:hover{transform:translateY(-3px);background:#fff;box-shadow:0 22px 36px -14px #000a}
.btn.big{font-size:21px;padding:20px 30px}
.ar{width:18px;height:18px;flex:none}
.lnk{display:inline-flex;align-items:center;gap:12px;font-weight:700;font-size:18px;text-decoration:none;padding:6px 0;border-bottom:2px solid #ffffff66;margin-top:clamp(30px,5vh,56px);transition:gap .3s var(--ease)}
.lnk:hover{gap:18px}.lnk.dark{border-color:#1b192066}
.bar{position:fixed;z-index:41;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);will-change:transform;background:linear-gradient(90deg,#6c4a80,#e5e1d6)}
/* nav */
.nav{position:fixed;z-index:40;top:0;left:0;right:0;height:80px;display:flex;align-items:center;gap:20px;padding:0 var(--gut);background:linear-gradient(#121115fa,#121115e6);border-bottom:1px solid #ffffff12}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:800;font-size:23px;letter-spacing:-.02em;color:var(--text)}
.brand span{font-weight:500;opacity:.72}
.bm{display:block;width:36px;height:36px;transition:transform .5s var(--ease)}.bm.recv{transform:scale(1.22) rotate(-6deg)}
.mark{width:100%;height:100%;display:block}
.links{display:flex;gap:clamp(18px,2.3vw,40px);font-size:17px;font-weight:600;margin-left:auto}
.links a{text-decoration:none;opacity:.86;position:relative}.links a:after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:currentColor;transform:scaleX(0);transform-origin:0 50%;transition:transform .35s var(--ease)}
.links a:hover{opacity:1}.links a:hover:after{transform:scaleX(1)}
.nav .btn{margin-left:clamp(10px,2vw,30px);padding:14px 20px;font-size:17px}
.menu{display:none;align-items:center;gap:10px;font-weight:700;font-size:17px}
.menu i{position:relative;width:22px;height:2px;background:currentColor;transition:transform .35s var(--ease)}.menu i:before{content:"";position:absolute;left:0;top:-7px;width:22px;height:2px;background:currentColor;transition:transform .35s var(--ease)}
.menu[aria-expanded=true] i{transform:rotate(45deg)}.menu[aria-expanded=true] i:before{transform:translateY(7px) rotate(-90deg)}
.menu-sheet{position:fixed;z-index:39;inset:68px 0 auto 0;background:linear-gradient(120deg,#f6f3ea,#ddd9cd);color:#1b1920;padding:26px 24px 34px;box-shadow:0 30px 60px -20px #000c;transform-origin:50% 0;animation:mdrop .5s var(--ease)}
.menu-sheet .tex{opacity:.25;}
.menu-sheet nav{position:relative;display:grid}.menu-sheet a{font-size:30px;font-weight:700;letter-spacing:-.03em;text-decoration:none;padding:12px 0;border-bottom:1px solid #1b192022}
@keyframes mdrop{from{transform:rotateX(-70deg);opacity:0}to{transform:none;opacity:1}}
/* hero */
.hero{min-height:100svh;display:grid;align-items:center;isolation:isolate;background:radial-gradient(ellipse at 70% 40%,#2a2330 0%,transparent 62%),var(--ink)}
.hero-photo{position:absolute;z-index:-1;top:0;bottom:0;right:-2%;width:68%;background:url(/wp-content/themes/origami-2026/assets/20261010-od-r2/hero-1600.webp) 74% 58%/cover no-repeat;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40%);mask-image:linear-gradient(90deg,transparent 0,#000 40%);will-change:transform;animation:breathe 22s ease-in-out infinite alternate}
@keyframes breathe{from{background-position:72% 58%}to{background-position:78% 54%}}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--ink) 0,transparent 22%),linear-gradient(180deg,#121115cc 0,transparent 18%)}
.hero-in{padding:120px var(--gut) 80px;max-width:1560px;margin:0 auto;width:100%;will-change:transform,opacity}
.hero .sub{margin-top:30px;max-width:24em;font-size:clamp(20px,1.7vw,26px);color:var(--dim);line-height:1.45}
.acts{display:flex;flex-wrap:wrap;align-items:center;gap:28px;margin-top:38px}.acts .lnk{margin-top:0}
.sheet-wrap{position:absolute;right:clamp(20px,3.6vw,70px);bottom:clamp(40px,8vh,100px);width:clamp(320px,27vw,420px);perspective:1500px;z-index:3;transform-origin:0 0;will-change:transform}
.sheet{position:relative;transform-origin:50% 100%;transform:rotate(-4deg);box-shadow:0 40px 50px -24px #000c,0 2px 0 #fff8 inset;background:linear-gradient(118deg,#f4f1e8,#d9d5c8);color:#1d1b21;padding:34px 34px 30px;overflow:hidden}
.sheet .tex{opacity:.2;}
.sheet>*{position:relative}
.sheet:before{content:"";position:absolute;left:0;right:0;top:44%;height:2px;background:linear-gradient(90deg,transparent,#fff9,transparent);box-shadow:0 1px 0 #0001;z-index:2}
.sheet:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#0000 44%,#3a21451f 100%);pointer-events:none}
.sheet .sweep{position:absolute;top:-20%;bottom:-20%;left:-60%;width:40%;background:linear-gradient(100deg,transparent,#ffffff70,transparent);transform:skewX(-14deg);animation:sweep 7s ease-in-out 2.4s infinite;z-index:3}
@keyframes sweep{0%,72%{left:-60%}100%{left:130%}}
.sheet .lab{font-size:18px;font-weight:600;color:#47404f;max-width:15em;line-height:1.3}
.sheet .num{font-size:clamp(104px,9vw,140px);font-weight:700;letter-spacing:-.075em;line-height:1;margin:6px 0 4px -.04em;color:#17151b}
.sheet .row{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}.sheet .row b{font-size:30px;letter-spacing:-.03em;color:var(--plum)}.sheet .row span{font-size:17px;font-weight:600;color:#47404f}
.sheet .src{margin-top:18px;font-size:18px;color:#5b5463;line-height:1.35;border-top:1px solid #1d1b2124;padding-top:12px}
/* handover */
.stage{position:relative;display:grid;grid-template-columns:1fr minmax(120px,15vw) 1fr;align-items:stretch}
.pan{position:relative;padding:36px 40px 38px;min-height:330px;box-shadow:0 2px 0 #fff8 inset,0 30px 50px -16px #2a1c3477,0 3px 8px #2a1c3433;overflow:hidden}
.pan .tex{opacity:.2;}.pan>*{position:relative}
.pan.a{background:linear-gradient(120deg,#f6f3ea,#ddd9cd);transform:rotate(-1.3deg);color:#1b1920}
.pan.b{background:linear-gradient(130deg,#4d2d5c,#34203f);transform:rotate(1.2deg);color:#f4f1ea}.pan.b .tex{opacity:.1}
.pan h3{font-size:clamp(28px,2.5vw,38px);margin-bottom:22px}
.pan ol{list-style:none}
.pan li{display:flex;align-items:center;gap:16px;font-size:clamp(22px,1.9vw,29px);font-weight:600;letter-spacing:-.02em;padding:15px 0;border-top:1px solid #1b192026;opacity:.42;transition:opacity .5s,transform .6s var(--ease)}
.pan.b li{border-top-color:#ffffff24}
.pan li i{font-style:normal;font-size:17px;font-weight:700;opacity:.65;min-width:28px}
.pan li.on{opacity:1}.pan.a li.on{transform:translateX(6px)}
.wires{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:4}
.wires path{fill:none;stroke:#3a2145;stroke-width:2.4;stroke-linecap:round}
.plane{position:absolute;left:0;top:0;width:34px;height:20px;z-index:5;opacity:0;filter:drop-shadow(0 6px 5px #0004);pointer-events:none}
.plane.big{width:58px;height:34px}
.pairs{display:none}
.foot-row{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:clamp(30px,5vh,56px);font-size:18px;font-weight:600;color:var(--darkdim)}.foot-row .lnk{margin-top:0}
/* capabilities */
.caps-g{display:grid;grid-template-columns:minmax(300px,.72fr) 1.28fr;gap:clamp(30px,5vw,90px);align-items:start}
.caps-l{list-style:none;border-top:1px solid #ffffff1f}
.caps-l button{width:100%;display:grid;grid-template-columns:52px 1fr;align-items:center;text-align:left;padding:22px 0;border-bottom:1px solid #ffffff1f;position:relative;opacity:.55;transition:opacity .4s}
.caps-l button:hover,.caps-l button[aria-selected=true]{opacity:1}
.cn{font-size:18px;font-weight:700;color:var(--silver)}.cl{font-size:clamp(23px,2vw,31px);font-weight:700;letter-spacing:-.03em}
.cp{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:#c9bfd2;transform-origin:0 50%;transform:scaleX(0)}
.caps-l button[aria-selected=true] .cp{animation:cp var(--dur,7s) linear forwards}
.caps-l.paused button .cp{animation:none;transform:scaleX(1)}
@keyframes cp{to{transform:scaleX(1)}}
.caps-stage{position:relative;min-height:clamp(470px,40vw,600px);perspective:1800px}
.cpan{position:absolute;inset:0;display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(20px,3vw,44px);align-items:center;padding:clamp(28px,3vw,48px);background:linear-gradient(130deg,#4d2d5c,#2e1b39);box-shadow:0 40px 70px -30px #000e,0 2px 0 #ffffff1a inset;transform-origin:0 50%;opacity:0;transform:rotateY(-76deg);pointer-events:none;transition:opacity .5s,transform 1s var(--ease)}
.cpan:before{content:"";position:absolute;inset:0;background:url(/wp-content/themes/origami-2026/assets/20261010-od-r2/paper.jpg) center/520px;opacity:.08;}
.cpan.on{opacity:1;transform:none;pointer-events:auto}
.cpan.out{opacity:0;transform:rotateY(30deg) translateX(40px)}
.cpan>*{position:relative}
.cpan h3{font-size:clamp(30px,2.6vw,44px)}
.cpan-t p{margin-top:16px;font-size:clamp(18px,1.35vw,21px);color:#e6e0ea;line-height:1.5}
.cpan .back{display:flex;flex-direction:column;gap:2px;margin-top:22px;font-size:21px;font-weight:700;color:#fff;border-left:3px solid #c9bfd2;padding-left:16px}
.cpan .back span{font-size:17px;font-weight:600;color:#d8cfe0}
.cpan .lnk{margin-top:24px}
.cpan-a{display:flex;justify-content:center;align-items:center}
.doc{position:relative;width:100%;max-width:420px;background:linear-gradient(118deg,#f4f1e8,#d9d5c8);color:#1d1b21;padding:28px 28px 22px;transform:rotate(2deg);box-shadow:0 30px 44px -18px #000c}
.doc .tex{opacity:.22;}.doc>*{position:relative}
.doc-h{font-size:24px;font-weight:700;letter-spacing:-.03em;margin-bottom:12px}
.doc-l{list-style:none}.doc-l li{display:flex;gap:12px;font-size:18px;font-weight:600;padding:10px 0;border-top:1px solid #1d1b211f}.doc-l b{color:var(--plum)}
.doc-t{width:100%;border-collapse:collapse;font-size:17px;font-weight:600}.doc-t td{padding:10px 0;border-top:1px solid #1d1b211f}.doc-t td+td{text-align:right;color:var(--plum)}
.doc-f{margin-top:12px;font-size:17px;color:#5b5463}
.browser{width:100%;background:#e9e6dd;padding:0 8px 8px;box-shadow:0 30px 44px -18px #000c;transform:rotate(-1.5deg)}
.browser .bb{display:flex;align-items:center;gap:6px;height:30px;font-size:15px;color:#46404d}.browser .bb i{width:9px;height:9px;border-radius:50%;background:#bdb8ad}.browser .bb span{margin-left:10px}
.phoneprint{width:min(260px,64%);transform:rotate(3deg);background:#e4e1d5;padding:10px;box-shadow:0 30px 44px -18px #000c}
.photoprint{width:100%;background:#e4e1d5;padding:10px 10px 14px;transform:rotate(-1.6deg);box-shadow:0 30px 44px -18px #000c}
.photoprint img{width:100%;aspect-ratio:4/3;object-fit:cover}.photoprint.wide img{aspect-ratio:16/10;object-position:0 0}
.pp-c{margin-top:10px;font-size:18px;font-weight:600;color:#3f3946}
/* route */
.ribbon{position:relative;height:clamp(420px,46vw,620px);margin-top:10px}
.rib{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.st{position:absolute;width:clamp(180px,16vw,240px);opacity:.38;transition:opacity .6s,transform .8s cubic-bezier(.3,1.5,.4,1)}
.st.on{opacity:1;transform:translateY(-6px)}
.st-n{display:block;font-size:17px;font-weight:700;color:#c9bfd2}
.st b{display:block;font-size:clamp(30px,2.8vw,44px);font-weight:700;letter-spacing:-.04em;line-height:1.05}
.st-o{display:block;margin-top:6px;font-size:19px;color:#e2dbe8}
/* work */
.plate{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(28px,4vw,70px);align-items:center;margin-bottom:clamp(70px,11vh,140px)}
.plate.rev{grid-template-columns:1.05fr .95fr}.plate.rev .plate-sheet{order:2}
.plate-sheet{position:relative;background:linear-gradient(118deg,#f4f1e8,#d9d5c8);color:#1d1b21;padding:clamp(28px,3vw,48px);box-shadow:0 40px 60px -26px #000d,0 2px 0 #fff8 inset;transform:rotate(-1.2deg)}
.plate.rev .plate-sheet{transform:rotate(1.2deg)}
.plate-sheet .tex{opacity:.2;}.plate-sheet>*{position:relative}
.pk{font-size:19px;font-weight:700;color:var(--plum)}
.plate-sheet h3{font-size:clamp(28px,2.6vw,42px);margin-top:6px}
.pair{display:flex;align-items:flex-end;gap:clamp(12px,1.6vw,26px);margin-top:18px;flex-wrap:wrap}
.pair>div{display:flex;flex-direction:column}
.pair .n{font-size:clamp(84px,8vw,140px);font-weight:700;letter-spacing:-.08em;line-height:.92}
.pair .n.was{color:#8a8393}
.pair .w{font-size:18px;font-weight:600;color:#47404f;margin-top:4px}
.pair .la{width:clamp(30px,3.6vw,56px);height:auto;color:var(--plum);margin-bottom:2.6em}
.psrc{margin-top:20px;font-size:18px;color:#4f4857;border-top:1px solid #1d1b2124;padding-top:12px}
.pex{margin-top:6px;font-size:18px;font-weight:600;color:#2b2731}
.plate-sheet .lnk{margin-top:22px}
.plate-img{position:relative;background:#e4e1d5;padding:12px;box-shadow:0 40px 60px -26px #000d;transform:rotate(1.4deg);will-change:transform}
.plate.rev .plate-img{transform:rotate(-1.4deg)}
.plate-img img{width:100%;aspect-ratio:3/2;object-fit:cover}
/* architecture */
.tree{position:relative;padding-bottom:10px}
.tree-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.tree-l path{fill:none;stroke:#3a2145;stroke-width:2;stroke-linecap:round}
.slip{position:relative;background:linear-gradient(118deg,#f6f3ea,#ddd9cd);box-shadow:0 18px 30px -16px #2a1c3477,0 2px 0 #fff8 inset;padding:18px 22px;overflow:hidden;will-change:transform}
.slip .tex{opacity:.22;}.slip>*{position:relative}
.slip b{display:block;font-size:clamp(22px,1.8vw,28px);letter-spacing:-.03em}
.slip span{display:block;font-size:18px;font-weight:600;color:#463f4f}
.slip.root{width:min(440px,100%);margin:0 auto 70px;background:linear-gradient(130deg,#4d2d5c,#34203f);color:#f4f1ea}.slip.root span{color:#ddd3e6}.slip.root .tex{opacity:.04}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.6vw,44px)}
.col{display:grid;gap:14px;align-content:start}
.slip.grp{background:linear-gradient(118deg,#ebe6f0,#cfc7d8);margin-bottom:22px}
.slip.leaf{margin-left:22px}
.arch .lnk{margin-top:40px}
/* craft */
.devices{position:relative;height:clamp(420px,46vw,700px)}
.dev{position:absolute;will-change:transform}
.scr{position:relative;overflow:hidden;background:#000}
.scr img{width:100%;height:100%;object-fit:cover;object-position:0 0}
.dev.wall{left:20%;right:0;top:0}.dev.wall .scr{aspect-ratio:16/9;border:10px solid #0c0b0e;box-shadow:0 40px 80px -30px #000}
.dev.wall .stand{display:block;width:16%;height:30px;margin:0 auto;background:linear-gradient(#2a282e,#141317)}
.dev.laptop{left:0;width:44%;bottom:0}.dev.laptop .scr{aspect-ratio:16/10;border:9px solid #1a191d;border-bottom-width:14px;border-radius:12px 12px 0 0;box-shadow:0 40px 60px -26px #000}
.dev.laptop .base{display:block;height:14px;margin:0 -5%;background:linear-gradient(#b9b7bc,#7c7a80);border-radius:0 0 12px 12px}
.dev.phone{right:3%;width:clamp(140px,13vw,210px);bottom:-2%}.dev.phone .scr{aspect-ratio:393/852;border:8px solid #0e0d10;border-radius:28px;box-shadow:0 40px 60px -26px #000}
.tri{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:clamp(40px,6vh,70px)}
.tri b{display:block;font-size:clamp(22px,1.8vw,28px);letter-spacing:-.03em}.tri span{display:block;margin-top:6px;font-size:19px;color:var(--dim)}
/* publishing */
.pub-g{display:grid;grid-template-columns:minmax(260px,.6fr) 1.4fr;gap:clamp(30px,5vw,90px);align-items:center}
.pub-l{list-style:none}
.pub-l button{position:relative;display:flex;align-items:center;gap:18px;width:100%;text-align:left;padding:20px 0;border-bottom:1px solid #1b192022;font-size:clamp(23px,2vw,31px);font-weight:700;letter-spacing:-.03em;opacity:.45;transition:opacity .4s}
.pub-l button span{font-size:18px;color:var(--plum)}
.pub-l button[aria-current]{opacity:1}
.pp{position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--plum);transform-origin:0 50%;transform:scaleX(0)}
.pub-l button[aria-current] .pp{animation:cp 2.6s linear forwards}
.pub-stage{position:relative;min-height:clamp(460px,38vw,580px);display:flex;align-items:center;justify-content:center}
.page{position:relative;width:min(560px,92%);min-height:clamp(420px,34vw,520px);background:linear-gradient(118deg,#f6f3ea,#ddd9cd);box-shadow:0 40px 60px -26px #2a1c34aa;padding:0 28px 26px;overflow:hidden;transform:rotate(-1.2deg);transition:transform .8s var(--ease)}
.page .tex{opacity:.22;}.page>*{position:relative}
.pg-bar{display:flex;align-items:center;gap:6px;height:38px;margin:0 -28px 18px;padding:0 16px;background:#d6d1c4;font-size:15px;color:#4a4352;transition:background .6s}
.pg-bar i{width:9px;height:9px;border-radius:50%;background:#aaa496}.pg-bar span{margin-left:auto;font-weight:700}
.pg-brief{transition:opacity .5s,transform .7s var(--ease)}
.pg-k{font-size:17px;font-weight:700;color:var(--plum)}.pg-q{font-size:clamp(28px,2.4vw,38px);font-weight:700;letter-spacing:-.035em;line-height:1.05;margin-top:4px}
.pg-m{font-size:18px;color:#4a4352;margin-top:8px;max-width:22em}
.pg-hero{height:0;overflow:hidden;transition:height .7s var(--ease);margin:0 -28px}
.pg-hero img{width:100%;height:150px;object-fit:cover}
.pg-t{font-size:clamp(24px,2vw,30px);font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-top:16px;opacity:0;transition:opacity .6s}
.lines{margin-top:12px}.lines i{display:block;height:10px;margin:10px 0;background:#2a2530;opacity:.18;width:0;transition:width .9s var(--ease);transition-delay:calc(var(--k,0)*90ms)}
.marks{position:absolute;left:28px;right:28px;top:120px;width:calc(100% - 56px);height:auto;pointer-events:none}
.marks path{fill:none;stroke:#b0283f;stroke-width:3;stroke-linecap:round;stroke-dasharray:240;stroke-dashoffset:240;transition:stroke-dashoffset .9s var(--ease)}
.stamp{position:absolute;right:22px;top:58px;font-size:20px;font-weight:800;letter-spacing:.02em;color:var(--plum);border:3px solid var(--plum);padding:6px 14px;transform:rotate(-8deg) scale(1.6);opacity:0;transition:opacity .35s,transform .5s cubic-bezier(.3,1.6,.5,1)}
.res{position:absolute;right:-2%;bottom:-4%;width:clamp(150px,13vw,210px);background:#e4e1d5;padding:8px;box-shadow:0 30px 44px -18px #2a1c34cc;transform:translateY(40px) rotate(4deg);opacity:0;transition:opacity .6s,transform .9s var(--ease)}
.pub-stage[data-s="1"] .pg-brief,.pub-stage[data-s="2"] .pg-brief,.pub-stage[data-s="3"] .pg-brief,.pub-stage[data-s="4"] .pg-brief{opacity:.35;transform:scale(.96);transform-origin:0 0}
.pub-stage:not([data-s="0"]) .pg-t{opacity:1}
.pub-stage:not([data-s="0"]) .lines i{width:var(--w)}
.pub-stage[data-s="2"] .marks path,.pub-stage[data-s="3"] .marks path,.pub-stage[data-s="4"] .marks path{stroke-dashoffset:0}
.pub-stage[data-s="3"] .marks,.pub-stage[data-s="4"] .marks{opacity:0;transition:opacity .5s}
.pub-stage[data-s="3"] .pg-brief,.pub-stage[data-s="4"] .pg-brief{display:none}
.pub-stage[data-s="3"] .pg-hero,.pub-stage[data-s="4"] .pg-hero{height:150px}
.pub-stage[data-s="3"] .pg-bar,.pub-stage[data-s="4"] .pg-bar{background:#3a2145;color:#f4f1ea}
.pub-stage[data-s="3"] .stamp,.pub-stage[data-s="4"] .stamp{opacity:1;transform:rotate(-8deg)}
.pub-stage[data-s="3"] .page,.pub-stage[data-s="4"] .page{transform:rotate(0)}
.pub-stage[data-s="4"] .res{opacity:1;transform:rotate(4deg)}
/* reporting */
.folio-g{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(30px,5vw,80px);align-items:center}
.folio{position:relative;height:clamp(440px,40vw,640px)}
.pocket{position:absolute;left:0;right:6%;bottom:0;height:40%;background:linear-gradient(160deg,#4d2d5c,#2a1834);box-shadow:0 -10px 30px -10px #000a,0 40px 60px -26px #000;z-index:3;clip-path:polygon(0 12%,100% 0,100% 100%,0 100%)}
.pocket .tex{opacity:.04;}
.flap{position:absolute;left:0;right:6%;bottom:30%;height:22%;background:linear-gradient(180deg,#3a2145,#2a1834);z-index:0;clip-path:polygon(0 100%,8% 0,92% 0,100% 100%)}
.fdesk,.fphone{position:absolute;background:#e4e1d5;padding:10px;box-shadow:0 40px 60px -26px #000d;will-change:transform}
.fdesk{left:4%;width:80%;bottom:12%;z-index:2}
.fphone{right:0;width:26%;bottom:6%;z-index:4}
.rep-pts>div{padding:18px 0;border-top:1px solid #ffffff1f}.rep-pts b{display:block;font-size:clamp(22px,1.8vw,28px);letter-spacing:-.03em}.rep-pts span{display:block;margin-top:4px;font-size:19px;color:var(--dim)}
.note{margin:18px 0 26px;font-size:18px;color:var(--dim)}
/* markets */
.mk-head{padding:clamp(96px,13vh,170px) 0 clamp(50px,8vh,90px)}
.mk-head .wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:28px 60px;flex-wrap:wrap}
.mkp{position:relative;height:clamp(560px,86vh,940px);overflow:hidden;display:flex;align-items:flex-end}
.mk-img{position:absolute;inset:-12% 0;will-change:transform}
.mk-img img{width:100%;height:100%;object-fit:cover}
.mkp:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0e0d12f2 0,#0e0d1299 28%,transparent 62%)}
.mk-t{position:relative;z-index:2;max-width:1560px;width:100%;margin:0 auto;padding:0 var(--gut) clamp(46px,8vh,90px)}
.mk-k{font-size:19px;font-weight:700;color:#e0d8e8}
.mk-t h3{font-size:clamp(46px,5.6vw,96px);letter-spacing:-.05em;line-height:.98;margin-top:6px}
.mk-t h3 .q{color:#d4cdc3}
.mk-t p:last-child{margin-top:16px;max-width:24em;font-size:clamp(19px,1.5vw,23px);color:#ece6dc}
/* relationship */
.peel{position:relative;height:clamp(400px,36vw,540px);max-width:1100px;margin:0 auto;perspective:1600px}
.under,.over{position:absolute;inset:0;padding:clamp(28px,3.4vw,54px);overflow:hidden;box-shadow:0 40px 60px -26px #2a1c3499}
.under{background:linear-gradient(130deg,#4d2d5c,#2a1834);color:#f4f1ea;transform:rotate(.8deg) translate(1%,2%);display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;text-align:right}
.under .tex{opacity:.04;}
.over{background:linear-gradient(118deg,#f6f3ea,#d9d5c8);color:#1b1920;transform:rotate(-1deg);will-change:clip-path}
.over .tex{opacity:.22;}
.under>*,.over>*{position:relative}
.u-k,.o-k{font-size:19px;font-weight:700}.o-k{color:var(--plum)}.u-k{color:#ddd3e6}
.u-big{font-size:clamp(34px,3.2vw,48px);font-weight:700;letter-spacing:-.045em;line-height:1;margin-top:8px}.o-big{font-size:clamp(40px,4.4vw,72px);font-weight:700;letter-spacing:-.05em;line-height:1;margin-top:10px}
.o-s{margin-top:18px;font-size:20px;font-weight:600;color:#463f4f}.u-s{margin-top:12px;font-size:20px;font-weight:600;color:#e2d9ea}
.flapc{position:absolute;z-index:3;right:0;bottom:0;width:0;height:0;background:linear-gradient(315deg,#bdb7aa 0,#e9e5da 45%,#f7f4ec 100%);clip-path:polygon(100% 0,0 100%,0 0);filter:drop-shadow(-6px -6px 10px #2a1c3455);will-change:width,height}
.rel-pts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,36px);margin-top:clamp(60px,9vh,100px)}
.slip2{position:relative;background:linear-gradient(118deg,#f6f3ea,#ddd9cd);padding:24px 26px;box-shadow:0 20px 30px -16px #2a1c3477}
.slip2:nth-child(1){transform:rotate(-1deg)}.slip2:nth-child(2){transform:rotate(.8deg) translateY(16px)}.slip2:nth-child(3){transform:rotate(-.6deg)}
.slip2 .tex{opacity:.22;}.slip2>*{position:relative}
.slip2 b{display:block;font-size:clamp(22px,1.8vw,27px);letter-spacing:-.03em}.slip2 span{display:block;margin-top:6px;font-size:18px;color:#463f4f}
/* method */
.m-tabs{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid #ffffff1f}
.m-tabs button{position:relative;width:100%;text-align:left;padding:22px 10px 22px 0;font-size:clamp(22px,1.9vw,30px);font-weight:700;letter-spacing:-.03em;opacity:.45;transition:opacity .4s}
.m-tabs button span{display:block;font-size:17px;color:#c9bfd2}.m-tabs .ml{font-weight:700}
.m-tabs button[aria-current]{opacity:1}
.mp{position:absolute;left:0;top:-1px;height:2px;width:100%;background:#c9bfd2;transform-origin:0 50%;transform:scaleX(0)}
.m-tabs button[aria-current] .mp{animation:cp var(--dur,4.2s) linear forwards}
.m-tabs.paused button .mp{animation:none;transform:scaleX(1)}
.m-g{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,90px);align-items:center;margin-top:clamp(30px,5vh,60px)}
.fold{position:relative;aspect-ratio:1;max-width:520px;width:100%;margin:0 auto}.fold:after{content:"";position:absolute;left:18%;right:18%;bottom:2%;height:10%;border-radius:50%;background:radial-gradient(#000a,transparent 70%);z-index:-1}
.fold svg{width:100%;height:100%;overflow:visible}
.m-c{position:relative;min-height:330px}
.m-p{position:absolute;inset:0;opacity:0;transform:translateY(24px);transition:opacity .5s,transform .8s var(--ease);pointer-events:none}
.m-p.on{opacity:1;transform:none;pointer-events:auto}
.m-p h3{font-size:clamp(36px,3.6vw,62px);letter-spacing:-.045em}
.m-p p{margin-top:18px;font-size:clamp(19px,1.5vw,23px);color:var(--dim);max-width:24em}
.m-p .leave{display:flex;flex-direction:column;margin-top:26px;font-size:24px;font-weight:700;color:var(--text);border-left:3px solid #c9bfd2;padding-left:18px}.m-p .leave span{font-size:17px;font-weight:600;color:var(--dim)}
.method .lnk{margin-top:40px}
/* owner */
.owner{min-height:clamp(620px,90vh,900px);display:flex;align-items:center;background:#0d0c10}
.own-img{position:absolute;inset:-6% 0;will-change:transform}
.own-img img{width:100%;height:100%;object-fit:cover;opacity:.92}
.owner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0d0c10ee 0,#0d0c1099 42%,transparent 75%)}
.own-g{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;width:100%}
.own-t .btn{margin-top:34px}
.own-t .side{margin-top:26px}
.sculpt{position:relative;width:min(440px,90%);aspect-ratio:1;margin:0 auto;transform-style:preserve-3d;will-change:transform}
.sculpt svg{width:100%;height:100%;overflow:visible}
.sweepbar{animation:sbar 6s ease-in-out infinite}
@keyframes sbar{0%,45%{transform:translateX(0)}100%{transform:translateX(170px)}}
.sshadow{position:absolute;left:20%;right:20%;bottom:-2%;height:14%;border-radius:50%;background:radial-gradient(#000c,transparent 70%)}
/* faq */
.faq-g{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(30px,5vw,90px);align-items:start}
.qa{position:relative;background:linear-gradient(118deg,#f6f3ea,#e0dbcf);margin-bottom:14px;box-shadow:0 14px 24px -16px #2a1c3466;transition:transform .5s var(--ease)}
.qa>.tex{opacity:.18;z-index:0}
.qa.open{transform:translateX(10px) rotate(-.4deg)}
.qa button{position:relative;z-index:1;display:grid;grid-template-columns:44px 1fr 28px;align-items:center;gap:8px;width:100%;text-align:left;padding:22px 24px}
.qn{font-size:17px;font-weight:700;color:var(--plum)}.qt{font-size:clamp(20px,1.6vw,24px);font-weight:700;letter-spacing:-.025em;line-height:1.2}
.pm{position:relative;width:20px;height:20px}.pm:before,.pm:after{content:"";position:absolute;left:0;right:0;top:9px;height:2px;background:var(--plum);transition:transform .4s var(--ease)}.pm:after{transform:rotate(90deg)}
.qa.open .pm:after{transform:rotate(0)}
.ans{position:relative;z-index:1;display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
.qa.open .ans{grid-template-rows:1fr}
.ans>div{overflow:hidden}
.ans p{padding:0 24px 24px 76px;font-size:19px;color:#3d3644;line-height:1.5}
.qa.open:before{content:"";position:absolute;left:0;right:0;top:66px;height:1px;background:linear-gradient(90deg,transparent,#1b192030,transparent);z-index:1}
.faq-side{position:sticky;top:120px}
.fs-card{position:relative;background:linear-gradient(130deg,#4d2d5c,#2a1834);color:#f4f1ea;padding:34px 34px 30px;min-height:420px;overflow:hidden;box-shadow:0 40px 60px -26px #2a1c3499;transform:rotate(1.2deg)}
.fs-card .tex{opacity:.04;}.fs-card>*{position:relative}
.fs-n{font-size:clamp(90px,8vw,140px);font-weight:700;letter-spacing:-.07em;line-height:.9;color:#d4cbdc}
.fs-c{margin-top:10px;font-size:clamp(22px,1.8vw,28px);font-weight:700;letter-spacing:-.03em;line-height:1.15;max-width:12em}
.fs-sheets{position:relative;height:150px;margin-top:20px}
.fs-sheets i{position:absolute;width:42%;height:120px;background:linear-gradient(118deg,#f6f3ea,#cfcabe);box-shadow:0 14px 24px -12px #000c;transition:transform .8s var(--ease),opacity .5s}
.fs-sheets .s1{left:6%;top:14px;transform:rotate(-6deg)}.fs-sheets .s2{left:30%;top:4px;transform:rotate(3deg)}.fs-sheets .s3{left:54%;top:18px;transform:rotate(-2deg);background:linear-gradient(130deg,#6a4a7d,#3a2145)}
.fs-card.swap .fs-n,.fs-card.swap .fs-c{animation:swap .6s var(--ease)}
@keyframes swap{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* direct */
.dir-g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);align-items:center}
.dir-img{background:#e4e1d5;padding:12px;transform:rotate(-1.6deg);box-shadow:0 40px 60px -26px #000d;will-change:transform}
.dir-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.dir-t h2{font-size:clamp(44px,4.8vw,84px)}
.dir-t .side{margin-top:24px}.dir-t .btn{margin-top:32px}
/* closing + ascent */
.close{background:radial-gradient(ellipse at 50% 100%,#3a2145 0,transparent 60%),var(--ink);padding-bottom:0!important}
.close>.tex{opacity:.035}
.close .wrap{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end}
.close-r .btn{margin-top:28px}
.ascent{position:relative;height:clamp(300px,38vw,560px);margin-top:clamp(40px,8vh,90px);display:flex;justify-content:center;align-items:flex-end}
.ascent svg{height:100%;width:auto;overflow:visible}.ascent:after{content:"";position:absolute;left:50%;bottom:-2%;width:44%;height:12%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(#0009,transparent 70%)}
.foot{background:#0d0c10;border-top:1px solid #ffffff12;padding:56px 0 64px}
.foot-g{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.foot .brand .mark{width:34px;height:34px}
.foot p{margin-top:14px;font-size:18px;color:var(--dim);max-width:22em}
.foot nav{display:grid;grid-template-columns:repeat(2,auto);gap:10px 48px;font-size:18px;font-weight:600}
.foot nav a{text-decoration:none;opacity:.86}.foot nav a:hover{opacity:1}
/* responsive */
@media (max-width:1100px){.links{display:none}.menu{display:flex}.nav .btn{margin-left:auto}}
@media (max-width:900px){
 body{font-size:18px}
 .nav{height:68px;gap:12px}.nav .btn{display:none}.menu{margin-left:auto}.brand{font-size:21px}.bm{width:32px;height:32px}.nav .btn{padding:11px 14px;font-size:16px}.nav .btn .full{display:none}
 .hero{display:block}.hero-photo{width:128%;right:-14%;top:68px;bottom:auto;height:40svh;-webkit-mask-image:linear-gradient(0deg,transparent 0,#000 46%);mask-image:linear-gradient(0deg,transparent 0,#000 46%)}
 .hero-in{padding:calc(68px + 37svh) 20px 36px;min-height:100svh;display:flex;flex-direction:column}
 h1{font-size:clamp(50px,14.4vw,76px)}
 .hero .sub{margin-top:20px}.acts{margin-top:26px;gap:22px}
 .sheet-wrap{position:relative;right:auto;bottom:auto;width:min(100%,380px);margin:30px 20px 40px auto}
 h2{font-size:clamp(44px,12.4vw,68px)}h2.giant{font-size:clamp(52px,14vw,80px)}
 .split-head{margin-bottom:36px}.split-head .side{padding-bottom:0}
 main>section:not(.hero):not(.markets):not(.owner){padding:84px 0}
 .stage{display:none}.pairs{display:block}
 .pr{position:relative;margin-bottom:18px}.pr>div{position:relative;overflow:hidden;padding:14px 18px;font-size:22px;font-weight:700;letter-spacing:-.025em;opacity:.45;transition:opacity .5s;box-shadow:0 12px 22px -10px #2a1c3466}
 .pr .c{background:linear-gradient(120deg,#f6f3ea,#ddd9cd);color:#1b1920;transform:rotate(-.8deg)}.pr .p{background:linear-gradient(130deg,#4d2d5c,#34203f);color:#f4f1ea;margin-top:26px;transform:rotate(.7deg)}
 .pr .tex{opacity:.2;}.pr .p .tex{opacity:.1}.pr small{font-size:17px;font-weight:700;opacity:.65;margin-right:10px}
 .pr.on>div{opacity:1}
 .pr .ln{position:absolute;left:34px;top:54px;width:2px;height:28px;background:#3a2145;transform-origin:0 0;transform:scaleY(var(--s,0));z-index:2}
 .pr .pl{position:absolute;left:23px;top:50px;width:24px;height:14px;z-index:3;opacity:0;transform:translateY(calc(var(--s,0)*26px)) rotate(90deg);filter:drop-shadow(0 3px 3px #0004)}.pr.run .pl{opacity:1}
 .foot-row{flex-direction:column;align-items:flex-start}
 .caps-g{grid-template-columns:1fr}.caps-l{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}.caps-l button{grid-template-columns:34px 1fr;padding:14px 0}.cl{font-size:19px}.cn{font-size:17px}
 .caps-stage{min-height:0;perspective:none}.cpan{position:relative;display:none;grid-template-columns:1fr;transform:none;padding:26px 22px}.cpan.on{display:grid;animation:mdrop .7s var(--ease)}
 .ribbon{height:auto;padding-left:70px}.rib{width:70px;left:0}.st{position:relative;width:auto;margin-bottom:46px;left:auto!important;top:auto!important}
 .plate,.plate.rev{grid-template-columns:1fr;gap:26px}.plate.rev .plate-sheet{order:0}
 .pair{flex-wrap:nowrap}.pair .n{font-size:17vw}.pair .la{margin-bottom:2.2em;width:28px}
 .cols{grid-template-columns:1fr;gap:26px}.slip.root{margin-bottom:34px}
 .devices{height:clamp(300px,90vw,420px)}.dev.wall{left:0;right:0}.dev.laptop{width:62%}.dev.phone{width:30%;right:0}
 .tri{grid-template-columns:1fr;gap:20px}
 .pub-g{grid-template-columns:1fr}.pub-l{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}.pub-l button{font-size:20px;padding:12px 0}
 .pub-stage{min-height:480px}.res{width:130px;right:0}
 .folio-g{grid-template-columns:1fr}.folio{height:clamp(320px,90vw,440px)}
 .mkp{height:58svh}.mk-img{inset:-8% 0}
 .peel{height:420px;margin-bottom:160px}.under{transform:rotate(.8deg)}.flapc{display:none}
 .rel-pts{grid-template-columns:1fr;gap:16px}.slip2:nth-child(2){transform:rotate(.8deg)}
 .m-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}.m-tabs button{padding:14px 0}.m-tabs .ml{display:none}.m-tabs button span{font-size:19px}
 .m-g{grid-template-columns:1fr}.fold{max-width:300px}.m-c{min-height:330px}
 .owner{display:block;padding:0 0 70px}.own-img{position:relative;inset:auto;height:62vw}.owner:after{display:none}.own-img:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0d0c10 0,transparent 60%)}.own-g{grid-template-columns:1fr;margin-top:-30vw}.sculpt{width:min(240px,62%);order:-1}
 .faq-g{grid-template-columns:1fr}.faq-side{display:none}.ans p{padding:0 18px 20px 18px}.qa button{grid-template-columns:36px 1fr 24px;padding:18px}
 .dir-g{grid-template-columns:1fr}
 .close .wrap{grid-template-columns:1fr}
 .tri span,.rep-pts span{font-size:18px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.wr .w>span,.rise{transform:none!important;opacity:1!important}}

/* ---- ambient life (OD's quiet equivalent of RBX's always-on layer) */
@keyframes driftA{0%{translate:0 0;rotate:0deg}50%{translate:0 -7px;rotate:.5deg}100%{translate:0 0;rotate:0deg}}
@keyframes driftB{0%{translate:0 0;rotate:0deg}50%{translate:0 -5px;rotate:-.45deg}100%{translate:0 0;rotate:0deg}}
@keyframes sway{0%,100%{rotate:0deg}50%{rotate:.6deg}}
.pan.a,.doc,.slip2:nth-child(odd),.fs-card,.page,.browser{animation:driftA 8.5s ease-in-out infinite}
.pan.b,.phoneprint,.photoprint,.slip2:nth-child(even),.plate-sheet{animation:driftB 9.5s ease-in-out infinite}
.plate-img,.dir-img{animation:sway 11s ease-in-out infinite}
.pan.b{animation-delay:-3s}.plate:nth-child(odd) .plate-sheet{animation-delay:-4s}.slip2:nth-child(3){animation-delay:-2s}
/* a lamp moving slowly over the dark scenes */
.inkbg:after,.plumbg:after,.close:after{content:"";position:absolute;width:70vw;height:70vw;left:-10vw;top:-20vw;border-radius:50%;background:radial-gradient(closest-side,#ffffff0d,transparent);pointer-events:none;animation:lamp 26s ease-in-out infinite alternate;z-index:0}
.plumbg:after{background:radial-gradient(closest-side,#ffffff12,transparent)}
@keyframes lamp{from{transform:translate3d(0,0,0)}to{transform:translate3d(60vw,30vw,0)}}
.inkbg>.wrap,.plumbg>.wrap,.close>.wrap,.close>.ascent,.mk-head>.wrap{position:relative;z-index:1}
/* a crease drawn under every heading once it has risen */
h2.wr:after{content:"";display:block;height:2px;width:min(300px,38%);margin-top:.28em;background:linear-gradient(90deg,currentColor 0,currentColor 30%,transparent);opacity:.32;transform:scaleX(0);transform-origin:0 50%;transition:transform 1.6s cubic-bezier(.2,.8,.2,1) .55s}
h2.wr.in:after{transform:scaleX(1)}
.paperbg h2.wr:after{color:#3a2145}
/* staged entries */
.rise{transition-delay:calc(var(--ri,0)*70ms)}
/* hover finesse */
.btn{position:relative;overflow:hidden}
.btn:after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,#ffffffb0,transparent);transform:skewX(-18deg);transition:left .7s cubic-bezier(.2,.8,.2,1)}
.btn:hover:after{left:130%}
.plate-sheet,.plate-img,.dir-img,.photoprint,.doc,.slip2,.qa{transition:box-shadow .5s,scale .6s cubic-bezier(.3,1.4,.4,1)}
.plate:hover .plate-sheet,.plate:hover .plate-img,.dir-img:hover,.slip2:hover{scale:1.018;box-shadow:0 60px 80px -30px #000e}
.paperbg .slip2:hover{box-shadow:0 34px 44px -20px #2a1c3499}
.qa:hover{scale:1.008}
.caps-l button .cl{display:inline-block;transition:transform .5s cubic-bezier(.3,1.4,.4,1)}.caps-l button:hover .cl,.caps-l button[aria-selected=true] .cl{transform:translateX(8px)}
.pub-l button,.m-tabs button{transition:opacity .4s,transform .5s cubic-bezier(.3,1.4,.4,1)}.pub-l button:hover{transform:translateX(6px)}
@keyframes glint{0%,86%,100%{filter:brightness(1)}92%{filter:brightness(1.45)}}
.bm .mark{animation:glint 9s ease-in-out infinite}
/* paper scenes get a soft fold shadow where they meet the dark */
.paperbg:before{content:"";position:absolute;left:0;right:0;top:0;height:46px;background:linear-gradient(#0000001f,transparent);pointer-events:none;z-index:1}
@media (prefers-reduced-motion:reduce){.pan,.doc,.slip2,.fs-card,.page,.browser,.phoneprint,.photoprint,.plate-sheet,.plate-img,.dir-img,.inkbg:after,.plumbg:after,.close:after,.bm .mark{animation:none!important}h2.wr:after{transform:none!important}}

/* round 3 finesse */
.mk-img img{animation:kb 26s ease-in-out infinite alternate;transform-origin:60% 50%}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.07)}}
.sculpt{animation:bob 7s ease-in-out infinite}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -12px}}
.ascent svg{animation:bob 8s ease-in-out infinite 2s}
.arw{position:relative;display:inline-flex;align-self:flex-end}
.arw .fly{position:absolute;left:0;top:-14px;width:30px;height:18px;opacity:0;filter:drop-shadow(0 4px 3px #0003)}
.plate.in .arw .fly{animation:glide 1.6s cubic-bezier(.4,0,.2,1) .5s forwards}
@keyframes glide{0%{opacity:0;transform:translate(-6px,10px) rotate(-14deg)}25%{opacity:1}100%{opacity:1;transform:translate(calc(100% + 16px),-26px) rotate(-22deg) scale(.8)}}
.pair .la{transition:opacity .6s}.plate.in .pair .la{opacity:.55}
@media (prefers-reduced-motion:reduce){.mk-img img,.sculpt,.ascent svg{animation:none!important}.arw .fly{display:none}}

/* ===== inner pages: the same paper language, one device per section shape ===== */
.crumbs{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:17px;font-weight:600;color:var(--dim);margin-bottom:22px}
.crumbs a{text-decoration:none;opacity:.8}.crumbs a:hover{opacity:1}.crumbs span{opacity:.5}
.paperbg .crumbs{color:var(--darkdim)}
.kick{font-size:19px;font-weight:700;color:#c9bfd2;margin-bottom:14px}
.paperbg .kick{color:var(--plum)}
/* hero variants */
.ph{position:relative;min-height:min(100svh,980px);display:flex;align-items:center;isolation:isolate;padding:130px 0 90px;background:radial-gradient(ellipse at 75% 35%,#2a2330 0,transparent 60%),var(--ink)}
.ph .wrap{width:100%}
.ph-g{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,90px);align-items:center}
.ph h1{font-size:clamp(52px,6.4vw,104px);max-width:9.5em}
.ph .lede{margin-top:26px;max-width:24em;font-size:clamp(20px,1.6vw,25px);color:var(--dim);line-height:1.45}
.ph .acts{margin-top:34px}
.ph-art{position:relative}
.ph-art .print{position:relative;background:#e4e1d5;padding:12px;box-shadow:0 50px 70px -30px #000e;transform:rotate(1.6deg)}
.ph-art .print img{width:100%;aspect-ratio:4/3;object-fit:cover}
.ph-art .print.wide img{aspect-ratio:16/10;object-position:0 0}
.ph-art .tag{position:absolute;left:-6%;bottom:-8%;width:min(300px,62%);background:linear-gradient(118deg,#f4f1e8,#d9d5c8);color:#1d1b21;padding:20px 22px;box-shadow:0 30px 44px -18px #000c;transform:rotate(-3deg);overflow:hidden}
.ph-art .tag .tex{opacity:.2}.ph-art .tag>*{position:relative}
.ph-art .tag b{display:block;font-size:clamp(46px,4.2vw,72px);font-weight:700;letter-spacing:-.07em;line-height:.95}
.ph-art .tag span{display:block;margin-top:4px;font-size:17px;font-weight:600;color:#47404f;line-height:1.3}
.ph-full{min-height:min(100svh,940px);align-items:flex-end;padding-bottom:clamp(60px,10vh,110px)}
.ph-full .bgimg{position:absolute;inset:-10% 0;z-index:-2}.ph-full .bgimg img{width:100%;height:100%;object-fit:cover}
.ph-full:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#0e0d12f5 0,#0e0d12aa 34%,#0e0d1233 70%,#0e0d1288 100%)}
.ph-type .fan{position:relative;height:clamp(360px,32vw,500px)}
.fan a{position:absolute;left:50%;top:50%;width:min(300px,70%);margin:-120px 0 0 -150px;min-height:220px;padding:24px 24px 22px;background:linear-gradient(118deg,#f4f1e8,#d9d5c8);color:#1d1b21;text-decoration:none;box-shadow:0 30px 50px -22px #000c;overflow:hidden;transform-origin:50% 120%;transition:transform 1s cubic-bezier(.3,1.3,.4,1),box-shadow .4s;transition-delay:calc(var(--k)*70ms)}
.fan a .tex{opacity:.2}.fan a>*{position:relative}
.fan a small{display:block;font-size:17px;font-weight:700;color:var(--plum)}
.fan a b{display:block;margin-top:8px;font-size:24px;letter-spacing:-.03em;line-height:1.12}
.fan.in a{transform:rotate(var(--rot)) translate(var(--tx),var(--ty))}
.fan.in a:hover{transform:rotate(0) translateY(-30px) scale(1.04);z-index:5;box-shadow:0 50px 70px -24px #000e}
/* trio: three panels unfold in turn */
.trio-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,30px);perspective:1600px}
.tp{position:relative;padding:30px 30px 32px;min-height:260px;background:linear-gradient(118deg,#f6f3ea,#ddd9cd);color:#1b1920;box-shadow:0 30px 50px -24px #2a1c3488;overflow:hidden;transform-origin:0 50%;opacity:0;transform:rotateY(-62deg);transition:opacity .6s,transform 1.1s cubic-bezier(.2,.9,.3,1.08);transition-delay:calc(var(--k)*160ms)}
.inkbg .tp,.plumbg .tp{box-shadow:0 40px 60px -26px #000d}
.tp .tex{opacity:.2}.tp>*{position:relative}
.tp:nth-child(2){background:linear-gradient(130deg,#4d2d5c,#34203f);color:#f4f1ea}.tp:nth-child(2) .tex{opacity:.05}.tp:nth-child(2) p{color:#e2d9ea}
.trio-g.in .tp{opacity:1;transform:rotate(calc((var(--k) - 1) * .8deg))}
.tp .fn{display:block;font-size:clamp(54px,4.6vw,78px);font-weight:700;letter-spacing:-.07em;line-height:.9;color:#7a7283}
.tp:nth-child(2) .fn{color:#c9bfd2}
.tp h3{margin-top:16px;font-size:clamp(25px,2.1vw,32px)}
.tp p{margin-top:10px;font-size:19px;color:#463f4f;line-height:1.45}
.tp:after{content:"";position:absolute;top:0;bottom:0;left:0;width:14%;background:linear-gradient(90deg,#00000014,transparent)}
/* steps: a folded ribbon with numbered stations, a plane flies it */
.steps2{position:relative}
.ribbon2{position:relative;height:120px;margin:10px 0 26px}
.ribbon2 svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ribbon2 .plane{width:46px;height:27px;opacity:0;top:0;left:0;transition:none}
.st2-g{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:clamp(16px,2vw,30px)}
.st2{opacity:.35;transform:translateY(16px);transition:opacity .6s,transform .8s cubic-bezier(.3,1.5,.4,1)}
.st2.on{opacity:1;transform:none}
.st2 .sn{display:block;font-size:18px;font-weight:700;color:#c9bfd2}.paperbg .st2 .sn{color:var(--plum)}
.st2 h3{margin-top:6px;font-size:clamp(25px,2.1vw,32px)}
.st2 p{margin-top:8px;font-size:19px;color:var(--dim);line-height:1.45}.paperbg .st2 p{color:var(--darkdim)}
/* pair: two sheets meet at a crease */
.pair2{display:grid;grid-template-columns:1fr 1fr;max-width:1180px;margin:0 auto;filter:drop-shadow(0 40px 40px #2a1c3455)}
.pair2>div{position:relative;padding:clamp(28px,3.4vw,52px);min-height:280px;overflow:hidden}
.pair2>div:first-child{background:linear-gradient(118deg,#f6f3ea,#d9d5c8);color:#1b1920;transform:perspective(1400px) rotateY(10deg);transform-origin:100% 50%;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.pair2>div:last-child{background:linear-gradient(130deg,#4d2d5c,#2a1834);color:#f4f1ea;transform:perspective(1400px) rotateY(-10deg);transform-origin:0 50%;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.pair2.in>div{transform:none}
.pair2 .tex{opacity:.2}.pair2>div:last-child .tex{opacity:.05}.pair2>div>*{position:relative}
.pair2 h3{font-size:clamp(28px,2.6vw,40px)}.pair2 p{margin-top:12px;font-size:20px;line-height:1.45;opacity:.9}
.pair2>div:first-child:after{content:"";position:absolute;top:0;bottom:0;right:0;width:18%;background:linear-gradient(270deg,#0000001c,transparent)}
/* slips grid for 5+ items */
.slips-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,26px)}
.slip3{position:relative;padding:24px 26px;background:linear-gradient(118deg,#f6f3ea,#ddd9cd);color:#1b1920;box-shadow:0 22px 34px -18px #2a1c3477;overflow:hidden;animation:driftA 9s ease-in-out infinite;animation-delay:calc(var(--k)*-1.3s)}
.slip3 .tex{opacity:.2}.slip3>*{position:relative}
.slip3 small{display:block;font-size:17px;font-weight:700;color:var(--plum)}
.slip3 h3{margin-top:6px;font-size:clamp(22px,1.8vw,27px)}.slip3 p{margin-top:6px;font-size:18px;color:#463f4f}
/* prose: text with a print or a pull sheet beside it */
.prose-g{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,90px);align-items:center}
.prose-g.rev .prose-a{order:-1}
.prose-t h2{font-size:clamp(44px,4.8vw,80px)}
.prose-t p{margin-top:20px;font-size:clamp(19px,1.45vw,22px);line-height:1.55;color:var(--dim);max-width:34em}
.paperbg .prose-t p{color:#3f3946}
.prose-t p:first-of-type{margin-top:30px}
.prose-a .print{background:#e4e1d5;padding:12px;box-shadow:0 44px 64px -28px #000d;transform:rotate(-1.4deg);will-change:transform}
.prose-g.rev .prose-a .print{transform:rotate(1.4deg)}
.prose-a .print img{width:100%;aspect-ratio:5/4;object-fit:cover}
.pull{position:relative;padding:clamp(28px,3vw,46px);background:linear-gradient(118deg,#f4f1e8,#d9d5c8);color:#1d1b21;box-shadow:0 44px 64px -28px #000c;transform:rotate(1.8deg);overflow:hidden}
.pull .tex{opacity:.2}.pull>*{position:relative}
.pull p{font-size:clamp(25px,2.2vw,36px);font-weight:700;letter-spacing:-.03em;line-height:1.18}
.pull:before{content:"";position:absolute;left:0;right:0;top:46%;height:2px;background:linear-gradient(90deg,transparent,#fffa,transparent);z-index:2}
.pull i.mk{display:block;width:54px;height:54px;margin-bottom:18px}
/* evidence */
.ev-g{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,90px);align-items:center}
.ev-sheet{position:relative;padding:clamp(28px,3vw,48px);background:linear-gradient(118deg,#f4f1e8,#d9d5c8);color:#1d1b21;box-shadow:0 44px 64px -28px #000d;transform:rotate(-1.2deg);overflow:hidden}
.ev-sheet .tex{opacity:.2}.ev-sheet>*{position:relative}
.bars{display:grid;gap:22px}
.bars .row{display:grid;grid-template-columns:minmax(150px,auto) 1fr;gap:6px 18px;align-items:end}
.bars .row span{font-size:19px;font-weight:600;color:#47404f}
.bars .row b{font-size:clamp(56px,5.4vw,96px);font-weight:700;letter-spacing:-.07em;line-height:.9;text-align:right}
.bars .row:first-child b{color:#8a8393}
.bars .row i{grid-column:1/-1;height:14px;background:#1d1b2114;position:relative;overflow:hidden}
.bars .row i:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#6c4a80,#3a2145);transform-origin:0 50%;transform:scaleX(0);transition:transform 1.4s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--k)*250ms + .3s)}
.ev-sheet.in .bars .row i:after{transform:scaleX(var(--w))}
.ev-src{margin-top:22px;font-size:18px;color:#4f4857;border-top:1px solid #1d1b2124;padding-top:12px}
.lanes{display:grid;gap:18px}
.lane .lt{display:flex;justify-content:space-between;align-items:baseline;font-size:19px;font-weight:600;color:#47404f}.lane .lt b{font-size:36px;font-weight:700;letter-spacing:-.04em;color:#1d1b21}
.lane .sq{display:flex;flex-wrap:wrap;gap:3px;margin-top:6px}
.lane .sq i{width:9px;height:12px;background:#3a2145;opacity:0;transform:translateY(-6px);transition:opacity .25s,transform .35s;transition-delay:calc(var(--q)*14ms + var(--k)*200ms)}
.ev-sheet.in .lane .sq i{opacity:.85;transform:none}
.rankv{display:flex;align-items:flex-end;gap:22px}.rankv div{display:flex;flex-direction:column}.rankv small{font-size:18px;font-weight:600;color:#47404f}.rankv b{font-size:clamp(70px,7vw,120px);font-weight:700;letter-spacing:-.07em;line-height:.9}.rankv div:first-child b{color:#8a8393}
.dots{display:grid;grid-template-columns:repeat(11,1fr);gap:8px;margin-top:22px;max-width:420px}
.dots i{aspect-ratio:1;border-radius:3px;background:#3a2145;opacity:0;transform:scale(.3) rotate(45deg);transition:opacity .3s,transform .5s cubic-bezier(.3,1.6,.5,1);transition-delay:calc(var(--q)*35ms)}
.dots i.b{background:#a9a2b2}
.ev-sheet.in .dots i{opacity:1;transform:rotate(45deg) scale(.8)}
/* faq */
.faq2{max-width:1100px}
/* index cards for hubs */
.cards-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.icard{position:relative;display:flex;flex-direction:column;min-height:250px;padding:28px 28px 26px;text-decoration:none;background:linear-gradient(118deg,#f6f3ea,#ddd9cd);color:#1b1920;box-shadow:0 26px 40px -22px #2a1c3488;overflow:hidden;transition:transform .6s cubic-bezier(.3,1.4,.4,1),box-shadow .5s}
.inkbg .icard,.plumbg .icard{box-shadow:0 34px 50px -24px #000c}
.icard .tex{opacity:.2}.icard>*{position:relative}
.icard small{font-size:17px;font-weight:700;color:var(--plum)}
.icard b{display:block;margin-top:10px;font-size:clamp(24px,2vw,31px);letter-spacing:-.03em;line-height:1.1}
.icard span{display:block;margin-top:10px;font-size:18px;color:#463f4f;line-height:1.45}
.icard .go2{margin-top:auto;padding-top:18px;display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:18px}
.icard:hover{transform:translateY(-8px) rotate(-.6deg);box-shadow:0 44px 60px -24px #2a1c34aa}
.icard:after{content:"";position:absolute;right:0;top:0;width:44px;height:44px;background:linear-gradient(225deg,#cfc9bc 50%,transparent 50%);box-shadow:-4px 4px 8px -4px #0003;transition:width .45s,height .45s}
.icard:hover:after{width:64px;height:64px}
.icard.plum{background:linear-gradient(130deg,#4d2d5c,#34203f);color:#f4f1ea}.icard.plum span{color:#e2d9ea}.icard.plum small{color:#d6cbe0}.icard.plum .tex{opacity:.05}.icard.plum:after{background:linear-gradient(225deg,#6c4a80 50%,transparent 50%)}
/* hub chapter (services hub) */
.chap-g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);align-items:center}
.chap-links{display:grid;gap:12px;margin-top:28px}
.chap-links a{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:#ffffff12;border:1px solid #ffffff22;text-decoration:none;font-size:20px;font-weight:700;letter-spacing:-.02em;transition:background .3s,transform .5s cubic-bezier(.3,1.4,.4,1)}
.paperbg .chap-links a{background:#ffffff80;border-color:#1b192022}
.chap-links a:hover{transform:translateX(8px);background:#ffffff22}
/* cta bed */
.bed{background:radial-gradient(ellipse at 50% 110%,#3a2145 0,transparent 62%),var(--ink)}
.bed-g{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(30px,5vw,90px);align-items:end}
.bed h2{font-size:clamp(50px,6vw,104px)}
.bed .side{margin-top:22px}
.bed-acts{display:flex;flex-wrap:wrap;gap:16px 26px;align-items:center;margin-top:32px}.bed-acts .lnk{margin-top:0}
.mini-ascent{width:min(320px,70%);aspect-ratio:1;margin-left:auto}
.mini-ascent svg{width:100%;height:100%;overflow:visible}
/* note lines */
.note2{margin-top:20px;font-size:18px;color:var(--dim)}.paperbg .note2{color:var(--darkdim)}
.sec-intro{margin-top:-30px;margin-bottom:40px}
/* contact */
.brief{position:relative;padding:clamp(26px,3vw,48px);background:linear-gradient(118deg,#f6f3ea,#d9d5c8);color:#1b1920;box-shadow:0 50px 70px -30px #000e;overflow:hidden}
.brief .tex{opacity:.18}.brief>*{position:relative}
.brief h2{font-size:clamp(34px,3vw,50px)}
.brief form{display:grid;gap:18px;margin-top:22px}
.brief .r2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.brief label{display:grid;gap:6px;font-size:18px;font-weight:700;color:#2b2731}
.brief input,.brief textarea{width:100%;font:500 19px Satoshi,Arial,sans-serif;color:#1b1920;background:#fffdf8;border:0;border-bottom:2px solid #1b192040;padding:14px 14px;outline:0;transition:border-color .3s,box-shadow .3s}
.brief textarea{min-height:150px;resize:vertical}
.brief input:focus,.brief textarea:focus{border-color:#3a2145;box-shadow:0 10px 24px -14px #3a214577}
.brief .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.brief .btn{justify-self:start;background:#3a2145;color:#f4f1ea}.brief .btn:hover{background:#4d2d5c}
.brief .fnote{font-size:18px;color:#463f4f}
.brief .ok,.brief .bad{display:none;padding:16px 18px;font-size:19px;font-weight:600}
.brief .ok{background:#e4efe0}.brief .bad{background:#f3e1e1}
.brief[data-status="sent"] .ok,.brief[data-status="error"] .bad{display:block}
@media (max-width:900px){
 .ph{padding:110px 0 60px;min-height:auto}.ph-g,.prose-g,.ev-g,.chap-g,.bed-g{grid-template-columns:1fr}.prose-g.rev .prose-a{order:0}
 .ph h1{font-size:clamp(44px,12.4vw,66px)}
 .ph-art .tag{left:auto;right:4%;bottom:-10%}
 .ph-full{min-height:86svh}
 .trio-g,.st2-g,.slips-g,.cards-g{grid-template-columns:1fr}
 .ribbon2{display:none}.st2{opacity:1;transform:none;padding-left:18px;border-left:3px solid #c9bfd2}.paperbg .st2{border-left-color:#3a2145}
 .pair2{grid-template-columns:1fr}.pair2>div{transform:none!important}
 .tp{transform:rotateX(-50deg);transform-origin:50% 0}
 .bars .row b{font-size:clamp(48px,15vw,72px)}
 .mini-ascent{margin:0 auto;width:60%}
 .brief .r2{grid-template-columns:1fr}
 .ph-type .fan{height:340px}
 .fan a{width:min(240px,62%);margin:-110px 0 0 -120px;min-height:200px}
}
@media (prefers-reduced-motion:reduce){.tp,.st2,.fan a,.pair2>div{opacity:1!important;transform:none!important}.bars .row i:after{transform:scaleX(var(--w))!important}.lane .sq i,.dots i{opacity:1!important;transform:none!important}.slip3{animation:none!important}}

.foot .fnav{display:grid;grid-template-columns:repeat(3,auto);gap:20px 64px}
.fnav div{display:grid;gap:10px;align-content:start}
.fnav b{font-size:18px;color:var(--dim);font-weight:600;margin-bottom:4px}
.fnav a{text-decoration:none;font-size:18px;font-weight:600;opacity:.88}.fnav a:hover{opacity:1}
.foot .fol{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:26px;font-size:18px;font-weight:600}
.foot .fol b{flex:0 0 100%;color:var(--dim);font-weight:600;margin-bottom:2px}
.foot .fol a{text-decoration:none;opacity:.86}.foot .fol a:hover{opacity:1}
.qa{color:#1b1920}.qa .ans p{color:#3d3644}
.la2{font-size:clamp(36px,3vw,52px);color:#6c4a80;margin-bottom:.3em}
.ev-sheet .rankv{flex-wrap:wrap}
.prose-t a:not(.lnk),.side a,.lede a,.note2 a,.ans a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
@media (max-width:900px){.foot .fnav{grid-template-columns:1fr 1fr;gap:26px}}

@media (max-width:900px){.bars .row{grid-template-columns:1fr auto}.bars .row b{font-size:clamp(40px,11.5vw,60px)}.bars .row span{font-size:18px}.rankv b{font-size:clamp(56px,17vw,90px)}}
.brief[data-status="sent"] form{display:none}
@media (min-width:901px){.slips-g:has(>:nth-child(5):last-child){grid-template-columns:repeat(5,minmax(0,1fr))}.slips-g:has(>:nth-child(8):last-child),.slips-g:has(>:nth-child(7):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:900px){.tp{min-height:0}.pair2>div{min-height:0}}
.cg{grid-template-rows:auto 1fr;align-items:start}.cg .c1{padding-top:clamp(20px,4vw,70px)}.cg .c2{grid-column:2;grid-row:1/3}.cg .c3{grid-column:1;grid-row:2;width:min(380px,72%);margin-top:clamp(10px,2vw,30px)}.cg .c3 .print{transform:rotate(-2.2deg)}
@media (max-width:900px){.cg .c2,.cg .c3{grid-column:auto;grid-row:auto}.cg .c3{width:78%;justify-self:end}}
.fan .fan-bg{position:absolute;left:4%;right:4%;top:6%;bottom:6%;margin:0;background:#e4e1d5;padding:10px;box-shadow:0 40px 60px -30px #000d;transform:rotate(-3deg)}.fan .fan-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) brightness(.8)}
@media (max-width:900px){.fan .fan-bg{left:0;right:0}}
.mk-t .mk-h{font-size:clamp(56px,7vw,120px);letter-spacing:-.055em;line-height:.95;margin-top:6px}.mk-t .lnk{margin-top:22px;color:#f4f1ea}
@media (max-width:900px){.ph-full .bgimg{inset:-4% 0 36% 0}.ph-full .bgimg:after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(0deg,#121115,transparent)}.ph-full{background:#121115}}
/* position evidence (the cleaning case's September record): animates when its sheet arrives */
.ev-sheet .posx{margin:4px 0 10px}
.ev-sheet .posx .wk-q{color:#2b2731}
.ev-sheet.in .posx .wk-dot.now{left:calc(var(--in) + var(--p) * (100% - 2 * var(--in)))}
.ph-art .tag b.ct{font-variant-numeric:tabular-nums}
/* hub heroes: paper index tabs over the print (replaces the fan, whose cards hid each other's titles) */
.ph-tabs{position:relative;padding-bottom:6%}
.ph-tabs .print{width:86%;margin-left:auto}
.ph-tabs .tabs{position:absolute;left:0;bottom:0;width:min(440px,74%);display:grid;gap:10px;z-index:2}
.ph-tabs .tabs a{position:relative;display:flex;align-items:center;gap:12px;padding:13px 16px 13px 0;background:linear-gradient(118deg,#f7f4ec,#dfdacd);color:#1b1920;text-decoration:none;overflow:hidden;
  box-shadow:inset 0 1px 0 #ffffffc0,2px 3px 0 -1px #bdb6a8,0 18px 30px -16px #000c;transition:translate .5s cubic-bezier(.3,1.5,.4,1),box-shadow .4s;rotate:calc((var(--k) - 2) * -.25deg)}
.ph-tabs .tabs a .tex{opacity:.2}
.ph-tabs .tabs a>*{position:relative}
.ph-tabs .tabs .tn{flex:none;align-self:stretch;display:grid;place-items:center;width:46px;margin:-13px 0;background:linear-gradient(135deg,#4d2d5c,#2e1a39);color:#ece6dc;font-size:15px;font-weight:700}
.ph-tabs .tabs .tt{flex:1;font-size:18px;font-weight:700;letter-spacing:-.015em;line-height:1.25}
.ph-tabs .tabs .ar{flex:none;width:18px;height:18px;color:#3a2145;opacity:.7}
.ph-tabs .tabs a:hover{translate:12px 0;box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #bdb6a8,0 26px 38px -16px #000d}
@media (max-width:900px){
  .ph-tabs{padding-bottom:0}
  .ph-tabs .print{width:100%}
  .ph-tabs .tabs{position:relative;width:100%;margin-top:-28px;padding:0 10px}
  .ph-tabs .tabs .tt{font-size:17px}
}
/* about: the person doing the work, full bleed; copy in the dark half of the room (10 Oct 2026) */
.ph-portrait{position:relative;display:flex;align-items:center;min-height:min(100svh,980px);overflow:hidden;background:#0a090c;padding:110px 0 70px}
.ph-portrait .pp-img{position:absolute;inset:0;z-index:0;overflow:hidden}
.ph-portrait .pp-img img{width:100%;height:100%;object-fit:cover;object-position:70% 50%;animation:ppDrift 30s ease-in-out infinite alternate}
@keyframes ppDrift{from{scale:1}to{scale:1.035}}
.ph-portrait .pp-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#0a090ce6 0,#0a090c99 28%,#0a090c00 55%),linear-gradient(0deg,#121115 0,#12111500 22%),linear-gradient(180deg,#121115cc 0,#12111500 16%)}
.ph-portrait .wrap{position:relative;z-index:2;width:100%}
.ph-portrait .pp-copy{max-width:min(620px,46%)}
.ph-portrait .pp-copy .lede{color:#e8e2d8}
@media (max-width:900px){
  .ph-portrait{display:block;min-height:0;padding:64px 0 34px}
  .ph-portrait .pp-img{position:relative;inset:auto;aspect-ratio:4/3;margin:0 0 6px}
  .ph-portrait .pp-img img{object-position:80% 52%}
  .ph-portrait .pp-shade{background:linear-gradient(0deg,#121115 0,#12111500 34%)}
  .ph-portrait .pp-copy{max-width:none;margin-top:-6px}
}
@media (prefers-reduced-motion:reduce){.ph-portrait .pp-img img{animation:none}}
/* service pages (11 Oct 2026): the service's own scene, on a paper plate laid over the hero print, replaying its story */
.ph-art{position:relative}
.sv-plate.sv-stage{position:absolute;z-index:3;pointer-events:none;left:-8%;bottom:-10%;width:min(60%,440px);margin:0;padding:12px 12px 10px;rotate:-1.6deg;translate:none;
  box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #c4bdaf,7px 8px 0 -2px #8f897e,0 34px 54px -24px #000d}
.sv-plate.sv-stage.on{translate:none;box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #c4bdaf,7px 8px 0 -2px #8f897e,0 34px 54px -24px #000d}
.sv-plate .sv-sc{margin:0}
@media (max-width:900px){.sv-plate.sv-stage{left:3%;bottom:-12%;width:74%}}
/* where the page has an evidence tag (bottom left on desktop, bottom right on phones) the plate takes the opposite corner */
.sv-plate-top.sv-stage{left:auto;right:-7%;top:-10%;bottom:auto;rotate:1.4deg}
@media (max-width:900px){.ph-art:has(.sv-plate-top){display:flex;flex-direction:column}.sv-plate-top.sv-stage{order:-1;position:relative;left:auto;right:auto;top:auto;bottom:auto;width:76%;margin:0 0 22px auto;rotate:1deg}}
/* agencies and businesses heroes (11 Oct 2026): the matching answer scene from the home, on a plum plate over the print */
.fs-plate{position:absolute;z-index:3;left:-8%;bottom:-10%;width:min(56%,400px);padding:14px 16px;pointer-events:none;rotate:-1.6deg;
  background:linear-gradient(130deg,#4d2d5c,#2a1834);box-shadow:0 2px 0 #ffffff14 inset,0 34px 54px -24px #000d}
.fs-plate .fs-stage{height:auto;aspect-ratio:2/1;margin:0}
@media (max-width:900px){.fs-plate{left:3%;bottom:-12%;width:76%}}
/* city pages (11 Oct 2026): the map and pin on a plate over the full-bleed photograph, bottom right of the copy column */
.ph-full .wrap{position:relative}
.sv-plate-city.sv-stage{left:auto;right:var(--gut,40px);bottom:clamp(30px,7vh,70px);top:auto;width:min(30%,360px);rotate:1.4deg}
@media (max-width:900px){.sv-plate-city.sv-stage{position:relative;right:auto;bottom:auto;left:0;width:78%;margin:22px 0 0;rotate:-1deg}}

/* ---------- r3: depth, light and ambient motion (10 Oct 2026) ---------- */
html.r3 body{background:#0b0a0e}
/* sections are sheets: each casts onto the one before it, the one you leave recedes */
main>section{position:relative}
main>section+section{box-shadow:0 -34px 70px -28px #000d}
main>section>.shade{position:absolute;inset:0;z-index:30;background:#09080c;opacity:0;pointer-events:none;will-change:opacity}
main>section.paperbg:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#fffdf6cc 18%,#fffdf6 50%,#fffdf6cc 82%,transparent);z-index:2;pointer-events:none}
main>section.paperbg:after{content:"";position:absolute;left:0;right:0;top:2px;height:60px;background:linear-gradient(#5a50461f,transparent);pointer-events:none}
main>section>.wrap{position:relative;z-index:1}
/* device grids lay down onto the page */
.cards-g,.trio-g,.slips-g,.pair2,.qs,.steps2,.ev-g,.prose-a,.bed-g,.rel-pts,.tri,.rep-pts,.peel{transform-origin:50% 0;will-change:transform}
/* cards and prints: stacked paper edges, cursor tilt, a light that follows the hand */
.cards-g,.trio-g,.slips-g,.pair2,.qs,.prose-a,.ph-art,.ev-g,.fan,.rel-pts,.tri,.rep-pts{perspective:1300px}
.tl{--lit:0;transform-style:flat}
.tl>.sheen{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:calc(var(--lit) * .9);background:radial-gradient(circle at var(--mx,50%) var(--my,50%),#ffffff59 0,#ffffff14 26%,transparent 55%);mix-blend-mode:normal}
.inkbg .tl>.sheen,.plumbg .tl>.sheen{background:radial-gradient(circle at var(--mx,50%) var(--my,50%),#ffffff40 0,#ffffff0f 28%,transparent 58%)}
.icard,.slip3,.tp,.qa,.pull,.ev-sheet{box-shadow:inset 0 1px 0 #ffffffb3,3px 4px 0 -1px #d3cdbf,7px 8px 0 -2px #b7b0a2,0 28px 44px -22px #1d1424a6}
.inkbg .icard,.inkbg .slip3,.inkbg .tp,.plumbg .icard,.plumbg .slip3,.plumbg .tp,.inkbg .pull,.plumbg .pull,.inkbg .ev-sheet{box-shadow:inset 0 1px 0 #ffffffb3,3px 4px 0 -1px #bdb7aa,7px 8px 0 -2px #8f897e,0 34px 54px -24px #000e}
.icard.plum,.tp:nth-child(2),.pair2>div:last-child{box-shadow:inset 0 1px 0 #ffffff33,3px 4px 0 -1px #5b3a6c,7px 8px 0 -2px #3c2549,0 34px 54px -24px #000e}
/* only grid cards lift above their neighbours; prints and tags keep their stacking (a lifted print covered the card on top of it) */
.icard.tl:hover,.tp.tl:hover,.slip3.tl:hover,.sv-stage.tl:hover,.wk.tl:hover,.qa.tl:hover,.pair2>div.tl:hover{z-index:4}
.fan .fan-bg{z-index:0;pointer-events:none}.fan a{z-index:1}.fan.in a:hover{z-index:5}
.ph-art .tag{z-index:3}
/* prints sit on a second sheet that separates as you reach for them */
.print{isolation:isolate}
.print:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(140deg,#d8d3c6,#b9b3a5);box-shadow:0 30px 50px -26px #000c;transform:rotate(-3.2deg) translate(-10px,8px);transition:transform .9s cubic-bezier(.2,.9,.25,1.15)}
.print:hover:before,.prose-a:hover .print:before{transform:rotate(-5.5deg) translate(-22px,16px)}
.ph-art .print:before{transform:rotate(-4deg) translate(-14px,10px)}
/* kicker: a folded plum corner that unfolds with the label */
.kick{position:relative;padding-left:26px}
.kick:before{content:"";position:absolute;left:0;top:50%;width:14px;height:14px;margin-top:-7px;background:linear-gradient(135deg,#6c4a80 50%,#3a2145 50%);clip-path:polygon(0 0,100% 0,0 100%);transform-origin:0 0;transform:scale(.2) rotate(-40deg);opacity:0;transition:transform .9s cubic-bezier(.3,1.6,.4,1) .2s,opacity .4s .2s}
.paperbg .kick:before{background:linear-gradient(135deg,#3a2145 50%,#6c4a80 50%)}
.kick.in:before,.ph .kick:before,.kick:not(.rise):before{transform:none;opacity:1}
/* ambient life */
@keyframes r3shine{0%,78%{left:-60%}100%{left:130%}}
.btn{position:relative;overflow:hidden}
.btn:after{animation:r3shine 6.5s cubic-bezier(.4,0,.2,1) infinite;animation-delay:calc(var(--sd,0) * 1s + 1.5s)}
@keyframes r3nudge{0%,70%,100%{translate:0 0}80%{translate:3px -3px}90%{translate:0 0}}
.lnk .ar,.btn .ar,.go2 .ar,.chap-links .ar{animation:r3nudge 4.2s ease-in-out infinite}
.lnk:hover .ar,.btn:hover .ar,.icard:hover .go2 .ar{animation-duration:.9s}
@keyframes r3bob{0%,100%{translate:0 0}50%{translate:0 -5px}}
.slip3{animation:r3bob 7s ease-in-out infinite;animation-delay:calc(var(--k,0) * -1.4s)}
.trio-g.in .tp{animation:r3bob 8s ease-in-out infinite 1.4s;animation-delay:calc(var(--k,0) * -1.9s + 1.4s)}
.icard{animation:r3bob 9s ease-in-out infinite;animation-delay:calc(var(--ri,0) * -1.3s)}
@keyframes r3flap{0%,88%,100%{transform:none}92%{transform:rotate(-7deg)}96%{transform:rotate(2deg)}}
.nav .mark path:first-child{transform-origin:47px 90px;animation:r3flap 9s ease-in-out infinite 3s}
.nav .mark path:last-child{transform-origin:53px 90px;animation:r3flap 9s ease-in-out infinite 3.15s;animation-direction:reverse}
@keyframes r3breathe{0%,100%{scale:1}50%{scale:1.035}}
.mini-ascent svg{animation:r3breathe 6s ease-in-out infinite 2.2s}
/* the rule under every heading draws in */
.split-head h2:after,.prose-t h2:after{transform-origin:0 50%}
@media (max-width:900px){main>section+section{box-shadow:0 -20px 40px -20px #000c}.print:before{transform:rotate(-2.4deg) translate(-6px,6px)}}
@media (prefers-reduced-motion:reduce){.btn:after,.lnk .ar,.btn .ar,.go2 .ar,.slip3,.tp,.icard,.nav .mark path,.mini-ascent svg{animation:none!important}.kick:before{transform:none;opacity:1}}
/* heading and intro share the row instead of the intro falling under a long heading */
@media (min-width:901px){.split-head:has(>div+div){display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);align-items:end;gap:28px clamp(40px,5vw,90px)}.split-head:has(>div+div) .side{max-width:30em}}
/* sub-service links are paper index tabs */
.chap-links{counter-reset:tab;gap:10px}
.chap-links a{counter-increment:tab;position:relative;padding:16px 20px 16px 62px;background:linear-gradient(118deg,#f4f1e8,#dcd7ca);color:#1b1920;border:0;box-shadow:inset 0 1px 0 #ffffffb3,2px 3px 0 -1px #bdb6a8,0 16px 26px -16px #000b;transition:transform .55s cubic-bezier(.3,1.5,.4,1),box-shadow .4s}
.chap-links a:nth-child(odd){rotate:-.35deg}.chap-links a:nth-child(even){rotate:.3deg}
.chap-links a:before{content:counter(tab,decimal-leading-zero);position:absolute;left:0;top:0;bottom:0;width:46px;display:grid;place-items:center;background:linear-gradient(135deg,#4d2d5c,#2e1a39);color:#e9e2ef;font-size:15px;font-weight:700;letter-spacing:.02em}
.chap-links a:hover{transform:translateX(10px);background:linear-gradient(118deg,#fffdf6,#e6e1d4);box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #bdb6a8,0 24px 34px -16px #000c}
.paperbg .chap-links a{box-shadow:inset 0 1px 0 #ffffffb3,2px 3px 0 -1px #c4bdaf,0 14px 22px -14px #2a1c3477}

/* The thread (thread.js): one hairline from the hero to the foot of the Ascent, folding a sheet in each section.
   It sits just above each section's paper texture and under everything else; the plane rides the end of the line. */
.thread{position:absolute;left:0;top:0;z-index:0;pointer-events:none;overflow:hidden}
.thread .t-ink{fill:none;stroke:#ece5d9;color:#ece5d9;opacity:.42;stroke-linecap:round;stroke-linejoin:round}
.paperbg>.thread .t-ink{stroke:#3a2145;color:#3a2145;opacity:.5}
.plumbg>.thread .t-ink{opacity:.5}
.thread .t-line{stroke-width:1.2px}
.thread .t-flap{fill:currentColor;fill-opacity:0}
.thread .t-v,.thread .t-m,.thread .t-s,.thread .t-d{stroke-width:1px}
.thread .t-v{stroke-dasharray:4 3}
.thread .t-m{stroke-dasharray:7 2.6 .01 2.6}
.thread-fly{position:absolute;left:0;top:0;z-index:31;pointer-events:none;overflow:visible;transition:opacity .3s;will-change:transform}
.thread-fly path{stroke-width:.8px;stroke-linejoin:round}
.thread-fly .pu{fill:#efe9de;stroke:#efe9de}
.thread-fly .pl{fill:#aaa194;stroke:#aaa194}
.thread-fly.on-paper .pu{fill:#fbf7ef;stroke:#3a2145}
.thread-fly.on-paper .pl{fill:#cfc5b6;stroke:#3a2145}
@media (max-width:900px){.thread .t-line{stroke-width:1.1px}}
@media (prefers-reduced-motion:reduce){.thread-fly{display:none}}
@media print{.thread,.thread-fly{display:none}}

/* ---------- guides and answers (11 Oct 2026): the article pages and the /guides/ hub ---------- */
/* a scene used outside the home's service stages: no card of its own, its holder gives the paper or the plum */
.ar-sc.sv-stage,.ar-sc.sv-stage:nth-child(odd),.ar-sc.sv-stage:nth-child(even),.ar-sc.sv-stage.on{rotate:none;translate:none;margin:0;padding:0;background:none;box-shadow:none}
.ar-sc{display:block;width:100%;pointer-events:none}
.ar-sc .sv-sc{margin:0}
.ar-fs .fs-stage{height:auto;aspect-ratio:2/1;margin:0}

/* article hero: the guides' print with the piece's scene on a plate */
.ar-ph{min-height:auto;padding:150px 0 120px}
.ar-h1{font-size:clamp(40px,4.4vw,74px);max-width:13em;line-height:1.02}
.ar-by{margin-top:22px;font-size:18px;font-weight:600;color:var(--dim)}
.ar-plate{position:absolute;z-index:3;left:-8%;bottom:-10%;width:min(56%,420px);padding:12px;rotate:-1.6deg;
  background:linear-gradient(160deg,#f7f4ec,#ddd8cb);box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #c4bdaf,7px 8px 0 -2px #8f897e,0 34px 54px -24px #000d}
.ar-plate.ar-fs{padding:14px 16px;background:linear-gradient(130deg,#4d2d5c,#2a1834);box-shadow:0 2px 0 #ffffff14 inset,0 34px 54px -24px #000d}
@media (max-width:900px){.ar-ph{padding:112px 0 70px}.ar-plate{left:3%;bottom:-12%;width:76%}.ar-ph .ph-art{margin-bottom:40px}}

/* the reading column with its contents rail */
.ar-body{position:relative;overflow:clip;padding:clamp(70px,8vw,120px) 0 clamp(90px,9vw,140px)}
.ar-g{display:grid;grid-template-columns:minmax(190px,260px) minmax(0,740px);gap:clamp(40px,6vw,110px);justify-content:center;align-items:start}
.ar-rail{position:sticky;top:110px}
.ar-rail ol{max-height:calc(100vh - 260px);overflow:auto}
.ar-rk{font-size:15px;font-weight:700;letter-spacing:.02em;color:var(--plum);margin-bottom:14px}
.ar-rail ol{list-style:none;margin:0;padding:0;border-left:1.5px solid #1b192022}
.ar-rail li a{display:block;padding:7px 0 7px 16px;margin-left:-1.5px;border-left:2.5px solid transparent;font-size:18px;line-height:1.35;color:var(--darkdim);text-decoration:none;transition:color .3s,border-color .3s}
.ar-rail li a:hover{color:var(--dark)}
.ar-rail li a.on{color:var(--plum);border-left-color:var(--plum);font-weight:700}
.ar-back{display:inline-flex;align-items:center;gap:10px;margin-top:26px;font-size:18px;font-weight:700;color:var(--dark);text-decoration:none}
.ar-back svg{width:16px;height:16px}
.ar-text{font-size:clamp(19px,1.22vw,21px);line-height:1.68;color:#29252e;min-width:0}
.ar-text p,.ar-text ul,.ar-text ol{margin:0 0 1.1em}
.ar-text h2{font-size:clamp(30px,2.5vw,42px);line-height:1.1;letter-spacing:-.022em;margin:1.9em 0 .6em;color:var(--dark);scroll-margin-top:110px}
.ar-text h3{font-size:clamp(22px,1.6vw,26px);line-height:1.2;margin:1.5em 0 .5em;color:var(--dark)}
.ar-text ul,.ar-text ol{padding-left:1.25em}
.ar-text li{margin:.45em 0;padding-left:.2em}
.ar-text li::marker{color:var(--plum);font-weight:700}
.ar-text a{color:var(--plum);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.ar-text a:hover{color:#6c4a80}
.ar-text strong{color:var(--dark)}
.ar-short{position:relative;overflow:hidden;margin:0 0 2.4em;padding:26px 30px 24px;background:linear-gradient(130deg,#4d2d5c,#2a1834);color:var(--text);box-shadow:0 30px 44px -26px #2a1834cc}
.ar-short .tex{opacity:.05}
.ar-short .ar-rk{color:#c9bfd2;margin-bottom:8px}
.ar-short p:last-child{margin:0;font-size:clamp(20px,1.35vw,23px);line-height:1.5}
@media (max-width:900px){.ar-g{grid-template-columns:minmax(0,1fr)}.ar-rail{display:none}}

/* cards: a numbered sheet with its scene, used on the hub and under each article */
.ar-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,2.4vw,36px);margin-top:44px}
.ar-card{position:relative;display:flex;flex-direction:column;text-decoration:none;color:var(--dark);background:linear-gradient(160deg,#f7f4ec,#e2ddd1);
  box-shadow:inset 0 1px 0 #fff,0 26px 40px -24px #2a1c3488;transition:translate .6s var(--ease),box-shadow .6s var(--ease)}
.inkbg .ar-card{box-shadow:inset 0 1px 0 #fff,0 34px 50px -26px #000c}
.ar-card:hover{translate:0 -6px;box-shadow:inset 0 1px 0 #fff,0 40px 56px -26px #2a1c34aa}
.ar-art{position:relative;display:grid;place-items:center stretch;aspect-ratio:16/10;padding:8% 9%;overflow:hidden;background:linear-gradient(160deg,#e9e3d6,#d6cfc0)}
.ar-art:has(.ar-fs){background:radial-gradient(ellipse at 78% 18%,#5b3a6b 0,transparent 60%),linear-gradient(130deg,#4d2d5c,#2a1834)}
.ar-n{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--text);font-size:14px;font-weight:700}
.ar-kind{margin:22px 24px 6px;font-size:14.5px;font-weight:700;color:var(--plum)}
.ar-card h3{margin:0 24px;font-size:clamp(21px,1.55vw,26px);line-height:1.18;letter-spacing:-.015em}
.ar-s{margin:12px 24px 0;font-size:18px;line-height:1.5;color:#4a4450;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ar-go{display:grid;place-items:center;align-self:flex-end;width:42px;height:42px;margin:18px 22px 22px auto;border-radius:50%;background:var(--plum);color:var(--text);transition:translate .4s var(--ease)}
.ar-go svg{width:17px;height:17px}
.ar-card:hover .ar-go{translate:4px 0}
.ar-slot{display:block;width:100%;aspect-ratio:240/84}
@media (max-width:900px){.ar-cards{grid-template-columns:minmax(0,1fr)}}
.ar-more{position:relative;padding:clamp(80px,8vw,120px) 0}

/* hub hero: plum, with three of the work's sheets floating and acting out in turn */
.hb-h{position:relative;overflow:hidden;padding:170px 0 130px;color:var(--text);background:radial-gradient(ellipse at 80% 20%,#55346a 0,transparent 55%),linear-gradient(160deg,#3d2349,#251530)}
.hb-h .tex{opacity:.05}
.hb-g{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,90px);align-items:center}
.hb-h .kick{color:#d8cde0}
.hb-h h1{font-size:clamp(56px,6.2vw,104px);line-height:.98}
.hb-h .lede{margin-top:30px;color:#e3dbe6}
.hb-fan{position:relative;height:clamp(340px,32vw,500px)}
.hb-sheet{position:absolute;width:min(68%,430px);padding:12px;background:linear-gradient(160deg,#f7f4ec,#ddd8cb);
  box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #c4bdaf,7px 8px 0 -2px #8f897e,0 40px 60px -26px #000e;animation:hbFloat 10s ease-in-out infinite alternate}
.hb-sheet:has(.ar-fs){padding:14px 16px;background:linear-gradient(130deg,#5b3a6b,#2a1834);box-shadow:0 2px 0 #ffffff1c inset,0 40px 60px -26px #000e}
.hb-sheet:nth-child(1){left:0;top:2%;rotate:-6deg;animation-duration:11s}
.hb-sheet:nth-child(2){right:0;top:30%;rotate:4deg;z-index:2;animation-duration:9s;animation-delay:-3s}
.hb-sheet:nth-child(3){left:10%;bottom:0;rotate:-1.5deg;z-index:1;animation-duration:12s;animation-delay:-6s}
@keyframes hbFloat{0%{translate:0 0}100%{translate:0 -14px}}
@media (prefers-reduced-motion:reduce){.hb-sheet{animation:none}}
@media (max-width:900px){.hb-h{padding:120px 0 80px}.hb-g{grid-template-columns:1fr}.hb-fan{height:min(78vw,380px);margin-top:20px}.hb-sheet{width:72%}}

/* the library: search, two rows of filters, guide cards, then quick answers */
.hb-lib{position:relative;padding:clamp(70px,7vw,110px) 0 clamp(90px,9vw,140px)}
.hb-find{scroll-margin-top:100px}
.hb-q{position:relative;display:block;max-width:780px}
.hb-q .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hb-q input{width:100%;padding:19px 60px 19px 22px;font:inherit;font-size:clamp(18px,1.3vw,21px);color:var(--dark);background:#f7f4ec;border:2px solid #1b1920;border-radius:0;outline:none;
  box-shadow:6px 6px 0 -1px #c9c2b4;transition:box-shadow .3s}
.hb-q input:focus{box-shadow:6px 6px 0 -1px var(--plum)}
.hb-q input::placeholder{color:#7d7682}
.hb-q input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.hb-q svg{position:absolute;right:20px;top:50%;width:24px;height:24px;translate:0 -50%;fill:none;stroke:#1b1920;stroke-width:2.2;stroke-linecap:round}
.hb-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.hb-chips button{padding:10px 18px;font:inherit;font-size:18px;font-weight:700;color:var(--dark);background:transparent;border:1.5px solid #1b192040;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.hb-chips button:hover{border-color:var(--dark)}
.hb-chips button.on{background:var(--plum);border-color:var(--plum);color:var(--text)}
.hb-topics{margin-top:12px}
.hb-topics button{padding:8px 15px;font-size:18px;font-weight:600}
.hb-topics button.on{background:var(--dark);border-color:var(--dark)}
.hb-count{margin-top:20px;font-size:18px;font-weight:600;color:var(--darkdim)}
.hb-gs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(22px,2.4vw,36px);margin-top:44px}
.hb-gs .ar-card{grid-column:span 2}
.hb-gs .ar-card:nth-child(-n+2){grid-column:span 3}
.hb-gs .ar-card:nth-child(-n+2) h3{font-size:clamp(24px,1.9vw,32px)}
.hb-gs[hidden],.hb-as[hidden]{display:none}
.hb-as{margin-top:clamp(70px,7vw,110px);max-width:1180px}
.hb-ah{font-size:clamp(34px,3vw,50px);letter-spacing:-.025em;margin-bottom:18px}
.hb-row{border-bottom:1.5px solid #1b192026}
.hb-rb{display:flex;align-items:center;gap:clamp(16px,2vw,30px);width:100%;padding:22px 0;font:inherit;text-align:left;color:var(--dark);background:none;border:0;cursor:pointer}
.hb-th{flex:0 0 clamp(104px,11vw,156px);display:grid;place-items:center stretch;aspect-ratio:16/10;padding:8px 10px;background:linear-gradient(160deg,#e9e3d6,#d6cfc0);box-shadow:inset 0 0 0 1px #1b192014}
.hb-th:has(.ar-fs){background:linear-gradient(130deg,#4d2d5c,#2a1834)}
.hb-rt{flex:1;min-width:0}
.hb-rt small{display:block;font-size:14px;font-weight:700;color:var(--plum);margin-bottom:6px}
.hb-rt b{display:block;font-size:clamp(20px,1.6vw,27px);line-height:1.22;letter-spacing:-.015em}
.hb-pl{position:relative;flex:0 0 44px;height:44px;border-radius:50%;background:var(--plum);transition:rotate .45s var(--ease),background .3s}
.hb-pl:before,.hb-pl:after{content:"";position:absolute;left:50%;top:50%;width:16px;height:2.5px;background:var(--text);translate:-50% -50%}
.hb-pl:after{rotate:90deg}
.hb-rb:hover .hb-pl{background:#5b3a6b}
.hb-row.open .hb-pl{rotate:135deg}
.hb-ans{padding:0 74px 28px calc(clamp(104px,11vw,156px) + clamp(16px,2vw,30px));font-size:clamp(18px,1.25vw,20px);line-height:1.6;color:#3a3540}
.hb-ans p{max-width:40em}
.hb-ans a{display:inline-flex;align-items:center;gap:10px;margin-top:14px;font-weight:700;color:var(--plum);text-decoration:none}
.hb-ans a svg{width:16px;height:16px}
.hb-more{display:block;margin:40px auto 0;padding:14px 26px;font:inherit;font-size:17px;font-weight:700;color:var(--dark);background:transparent;border:2px solid var(--dark);cursor:pointer;transition:background .25s,color .25s}
.hb-more:hover{background:var(--dark);color:var(--text)}
.hb-more[hidden]{display:none}
.hb-none{margin-top:40px;font-size:19px}
.hb-none a{color:var(--plum)}
@media (max-width:900px){.hb-gs{grid-template-columns:minmax(0,1fr)}.hb-gs .ar-card,.hb-gs .ar-card:nth-child(-n+2){grid-column:auto}
  .hb-topics{flex-wrap:nowrap;overflow-x:auto;margin-right:calc(var(--gut) * -1);padding-right:var(--gut);scrollbar-width:none}.hb-topics button{flex:0 0 auto}
  .hb-rb{gap:14px;padding:18px 0}.hb-th{flex-basis:84px}.hb-pl{flex-basis:36px;height:36px}.hb-ans{padding:0 0 24px}}

/* ---------- hero (11 Oct 2026): the work behind your agency, acted out (hero_stack.py; home.js drives --open) ----------
   The agency's finished website is the front sheet; the work behind it fans out from underneath on arrival, each sheet
   doing its work, and the front sheet takes the agency's seal. Scrolling packs the work back behind it. */
.hero .sheet-wrap{display:none}
.hx{position:absolute;z-index:-1;top:0;bottom:0;right:0;width:74%;overflow:hidden;transform-origin:62% 54%;will-change:transform}
.hx>*{position:absolute;pointer-events:none}
.hx-lamp{width:70%;aspect-ratio:1;right:-16%;top:-30%;border-radius:50%;background:radial-gradient(circle,#fff3e824 0,#f5e8f010 34%,transparent 66%);animation:hxLamp 11s ease-in-out infinite alternate;will-change:transform,opacity}
@keyframes hxLamp{0%{opacity:.65;transform:scale(1)}100%{opacity:1;transform:scale(1.08)}}
.hx-dust{inset:0;width:100%;height:100%}
/* the stack: one value (--open, 0 packed to 1 fanned) places every sheet; the front sheet sits nearest */
.hs{left:67%;top:52%;width:0;height:0;perspective:1700px;--fw:clamp(170px,21vw,520px);--u:calc(var(--fw) / 400);--open:0}
.hs-3d{position:absolute;left:0;top:0;transform-style:preserve-3d;transform:rotateX(10deg) rotateY(-14deg) rotateZ(1.5deg)}
.hsh{position:absolute;left:0;top:0;transform-style:preserve-3d;--r0:0;will-change:transform;
  transform:translate(-50%,-50%) translate3d(calc(var(--x) * var(--open) * var(--u)),calc(var(--y) * var(--open) * var(--u)),calc(var(--z) * 1px)) rotate(calc((var(--r0) + var(--r) * var(--open)) * 1deg))}
.hsh.front{--x:0;--y:0;--z:60;--r:0;--r0:-2;--fd:10s;width:var(--fw)}
.hsh.hb{width:calc(var(--fw) * .6)}
.hsh-in{position:relative;border-radius:3px;overflow:hidden;background:linear-gradient(160deg,#fbf8f1,#e6e0d4);
  box-shadow:inset 0 1px 0 #fff,0 26px 38px -20px #000e}
.hsh.front .hsh-in{animation:hsFloat 10s ease-in-out infinite alternate;box-shadow:inset 0 1px 0 #fff,0 34px 50px -24px #000}
@keyframes hsFloat{from{translate:0 -4px;rotate:-.35deg}to{translate:0 4px;rotate:.35deg}}
/* light: a soft plum glow grounds the stack, and a slow light passes across the finished front sheet */
.hs:before{content:"";position:absolute;left:-460px;top:-330px;width:920px;height:660px;border-radius:50%;background:radial-gradient(closest-side,#5b3a6b52,#3a214529 46%,transparent 74%);pointer-events:none}
.hsh.front .hsh-in:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 32%,#ffffff38 48%,transparent 64%);transform:translateX(-130%);animation:hsSheen 9s cubic-bezier(.37,0,.63,1) 3.2s infinite}
@keyframes hsSheen{0%{transform:translateX(-130%)}34%,100%{transform:translateX(130%)}}
/* the front sheet: the agency's finished website */
.hs-site{display:block;width:100%;height:auto}
.hs-site .s-mark{fill:#3a2145}.hs-site .s-markc{fill:#efe9de}.hs-site .s-name{fill:#1b1920}.hs-site .s-nav{fill:#1b192059}
.hs-site .s-cta{fill:#3a2145}.hs-site .s-hero{fill:#2c1937}.hs-site .s-h1{fill:#f4efe6}.hs-site .s-sub{fill:#f4efe680}
.hs-site .s-btn{fill:#efe9de}.hs-site .s-pic{fill:#cfc4b2}.hs-site .s-hill2{fill:#8f8396}.hs-site .s-hill{fill:#5b4a63}.hs-site .s-sun{fill:#fdf6ea}
.hs-site .s-col{fill:#1b19203d}.hs-site .s-foot{fill:#1b1920}.hs-site .s-fl{fill:#efe9de59}
/* the seal: the agency's mark pressed onto the finished work */
.hs-seal{position:absolute;right:5%;top:20%;width:15%;aspect-ratio:1;opacity:0;scale:1.7;rotate:-12deg;
  transition:opacity .45s,scale .7s cubic-bezier(.3,1.45,.45,1),rotate .7s cubic-bezier(.3,1.45,.45,1)}
.hs.sealed .hs-seal{opacity:1;scale:1;rotate:-6deg}
.hs-seal svg{display:block;width:100%;height:100%;filter:drop-shadow(0 4px 6px #0005)}
.hs-seal .sl-o{fill:#3a2145}.hs-seal .sl-i{fill:none;stroke:#efe9de;stroke-width:1.6;stroke-dasharray:3 2.4}
.hs-seal .sl-m{fill:#efe9de40}.hs-seal .sl-k{fill:none;stroke:#efe9de;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}
/* the work sheets: a title band, the scene doing its work, a few lines of record */
.hb .hb-top{display:flex;gap:6px;align-items:center;height:22px;padding:0 9px;background:#3a2145}
.hb .hb-top i{display:block;height:4px;border-radius:2px;background:#efe9de99}.hb .hb-top i:first-child{width:38%}.hb .hb-top i:last-child{width:14%;margin-left:auto;background:#efe9de4d}
.hb .hs-run{padding:8px 8px 0}
.hb .hb-lines{padding:8px 10px 10px}.hb .hb-lines i{display:block;height:3px;border-radius:2px;background:#1b192033;margin-top:5px}
.hb .hb-lines i:nth-child(2){width:78%}.hb .hb-lines i:nth-child(3){width:52%}
/* the scenes keep their own look; the service-card styling of .sv-stage does not apply in here */
.hs .sv-stage,.hs .sv-stage.on{background:none!important;box-shadow:none!important;rotate:0deg!important;margin:0!important;translate:none!important;transition:none!important}
.hs .sv-sc{margin:0}.hs .sv-sc svg{filter:none}
@media (max-width:900px){
  .hx{width:100%;right:0;top:64px;bottom:auto;height:40svh}
  .hs{left:50%;top:50%;--fw:min(48vw,206px)}
  .hs-3d{transform:rotateX(8deg) rotateY(-8deg) rotateZ(1deg)}
}
@media (prefers-reduced-motion:reduce){.hs{--open:1}.hsh-in,.hsh.front .hsh-in:after{animation:none}.hs-seal{opacity:1;scale:1;rotate:-6deg;transition:none}}

/* ---------- section 2: folded sheets (10 Oct 2026). Your half on top; ours unfolds beneath it, moved only by the scroll ---------- */
.hand .stage,.hand .pairs{display:none}
.folds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,34px);perspective:1500px;margin-top:clamp(8px,2vh,24px)}
.folds>.fsheet{position:relative;display:flex;flex-direction:column}
.folds>.fsheet:nth-child(1){rotate:-.6deg}.folds>.fsheet:nth-child(2){rotate:.4deg;margin-top:18px}.folds>.fsheet:nth-child(3){rotate:-.3deg;margin-top:6px}
.f-top,.f-face{position:relative;padding:clamp(24px,2.4vw,34px) clamp(24px,2.4vw,34px) clamp(26px,2.6vw,36px);overflow:hidden}
.f-top{z-index:2;background:linear-gradient(118deg,#f7f4ec,#e2ddd1);color:#1b1920;box-shadow:inset 0 1px 0 #ffffffc0,0 18px 30px -18px #2a1c3466;flex:1}
.f-top .tex,.f-face .tex{opacity:.22}
.f-top>*,.f-face>*{position:relative}
.folds .who{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:700;letter-spacing:.01em;color:#5d5368;margin-bottom:14px}
.folds .who span{display:inline-grid;place-items:center;min-width:34px;height:26px;padding:0 6px;background:#1b1920;color:#f4f1ea;font-size:15px}
.folds h3{font-size:clamp(28px,2.3vw,38px);letter-spacing:-.035em;line-height:1.05}
.folds p:not(.who){margin-top:12px;font-size:clamp(18px,1.25vw,20px);line-height:1.5;color:#3e3746;max-width:24em}
/* the crease: a hairline highlight over a soft shadow where the sheet folds */
.f-top .crease{position:absolute;left:0;right:0;bottom:0;height:16px;background:linear-gradient(#0000,#2a1c341a);pointer-events:none}
.f-top .crease:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#fffdf6b0}
.f-bot{position:relative;z-index:1;transform-origin:50% 0;backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform}
.f-face{background:linear-gradient(160deg,#4a2b59,#2c1937);color:#f4f1ea;box-shadow:0 30px 46px -24px #1d1024b0;min-height:100%}
.f-face .tex{opacity:.08}
.f-face>:not(.tex){opacity:var(--fo,1)}
.f-face .who{color:#e4ddd0}
.f-face p:not(.who){color:#ece6dc}
.f-shade{position:absolute;inset:0;background:linear-gradient(#0d0a10,#2a1c34cc);opacity:.75;pointer-events:none}
.hand .foot-row{margin-top:clamp(34px,5vh,56px)}
.hand .foot-row span{font-size:19px}
@media (max-width:900px){
  .folds{grid-template-columns:1fr;gap:26px}
  .folds>.fsheet:nth-child(n){margin-top:0}
  .folds h3{font-size:30px}
}
@media (prefers-reduced-motion:reduce){.f-bot{transform:none!important}.f-shade{opacity:0!important}}
/* the three working rules (from the retired section 11): one line, quiet, under the sheets */
.hand .rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,34px);margin-top:clamp(40px,6vh,64px);padding-top:24px;border-top:1px solid #1b192024}
.hand .rules b{display:block;font-size:clamp(20px,1.5vw,24px);letter-spacing:-.025em;color:#1b1920}
.hand .rules span{display:block;margin-top:6px;font-size:18px;line-height:1.45;color:#3e3746}
.hand .rules>div{position:relative;padding-left:18px}
.hand .rules>div:before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;background:#3a2145;rotate:45deg}
@media (max-width:900px){.hand .rules{grid-template-columns:1fr;gap:18px}}
.hand .foot-row .fr-l{display:flex;gap:28px;flex-wrap:wrap}

/* ---------- section 3: the whole job, every service on screen, in four stages (10 Oct 2026) ---------- */
.caps .caps-g{display:none}
.stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,2.2vw,34px);align-items:start;perspective:1400px}
.sv-stage{position:relative;background:linear-gradient(160deg,#f7f4ec,#ddd8cb);color:#1b1920;
  box-shadow:inset 0 1px 0 #ffffffc8,3px 4px 0 -1px #bdb7aa,7px 8px 0 -2px #8f897e,0 34px 54px -26px #000d;
  transition:translate .9s cubic-bezier(.2,.8,.2,1),box-shadow .9s cubic-bezier(.2,.8,.2,1)}
.sv-stage:nth-child(odd){rotate:-.5deg}.sv-stage:nth-child(even){rotate:.4deg;margin-top:22px}
.sv-stage.on{translate:0 -12px;box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #cfc7b9,7px 8px 0 -2px #a2998b,0 0 0 2px #e6dfd2,0 56px 74px -28px #000}
/* the light that marks the active stage: a slow, wide sheen, never a flash */
.sv-light{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;opacity:0;transition:opacity .9s}
.sv-light:before{content:"";position:absolute;top:-20%;bottom:-20%;width:70%;left:-80%;background:linear-gradient(100deg,transparent,#ffffff40 45%,#ffffff55 50%,#ffffff40 55%,transparent);transform:skewX(-14deg)}
.sv-stage.on .sv-light{opacity:1}
.sv-stage.on .sv-light:before{animation:svSheen 2.4s cubic-bezier(.37,0,.63,1) .2s 1 both}
@keyframes svSheen{0%{left:-80%}100%{left:130%}}
.sv-h{position:relative;display:flex;gap:14px;align-items:center;padding:18px 20px;background:linear-gradient(130deg,#4d2d5c,#2e1a39);color:#f4f1ea}
.sv-n{flex:none;display:grid;place-items:center;width:46px;height:46px;background:#f4f1ea;color:#2e1a39;font-size:22px;font-weight:700;box-shadow:0 6px 12px -6px #000a}
.sv-h small{display:block;font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#e4ddd0}
.sv-h b{display:block;font-size:clamp(24px,1.9vw,30px);letter-spacing:-.03em;line-height:1.1}
.sv{position:relative;display:flex;gap:14px;align-items:flex-start;padding:20px 20px 22px;border-top:1px solid #1b19201c;text-decoration:none;color:inherit;transition:background .35s}
.sv:first-of-type{border-top:0}
.sv:hover{background:#fffdf6}
.sv-i{flex:none;display:grid;place-items:center;width:36px;height:28px;background:#1b1920;color:#f4f1ea;font-size:15px;font-weight:700;margin-top:2px}
.sv-t{flex:1;min-width:0}
.sv-t b{display:block;font-size:clamp(19px,1.4vw,22px);letter-spacing:-.02em;line-height:1.2}
.sv-t>span{display:block;margin-top:6px;font-size:18px;line-height:1.45;color:#3e3746}
.sv-t em{display:block;margin-top:12px;padding-left:12px;border-left:2px solid #6c4a80;font-style:normal;font-size:18px;font-weight:600;line-height:1.35;color:#2b2731}
.sv-t em small{display:block;font-size:15px;font-weight:700;color:#6c4a80;margin-bottom:2px}
.sv .ar{flex:none;width:20px;height:20px;margin-top:4px;color:#3a2145;transition:translate .4s cubic-bezier(.3,1.5,.4,1)}
.sv:hover .ar{translate:3px -3px}
/* the path between stages: a small paper chevron in the gap */
.sv-next{position:absolute;z-index:3;top:30px;right:calc(-1 * clamp(22px,2.2vw,34px) / 2 - 13px);width:26px;height:26px;border-radius:50%;background:#f4f1ea;box-shadow:0 6px 14px -6px #000c}
.sv-next:after{content:"";position:absolute;left:9px;top:7px;width:8px;height:12px;background:#3a2145;clip-path:polygon(0 0,100% 50%,0 100%)}
.sv-stage:last-child .sv-next{display:none}
.sv-foot{display:flex;justify-content:space-between;align-items:center;gap:20px 40px;flex-wrap:wrap;margin-top:clamp(40px,6vh,64px);padding-top:28px;border-top:1px solid #ffffff1c}
.sv-foot p{font-size:20px;color:var(--dim);max-width:36em}
@media (max-width:1100px) and (min-width:901px){.stages{grid-template-columns:repeat(2,minmax(0,1fr))}.sv-stage:nth-child(even){margin-top:0}.sv-stage:nth-child(2) .sv-next{display:none}}
@media (max-width:900px){
  .stages{grid-template-columns:1fr;gap:34px}
  .sv-stage:nth-child(n){rotate:0deg;margin-top:0}
  .sv-next{top:auto;bottom:-30px;right:auto;left:calc(50% - 13px)}
  .sv-next:after{left:7px;top:9px;width:12px;height:8px;clip-path:polygon(0 0,100% 0,50% 100%)}
  .sv-foot .btn{width:100%;justify-content:space-between}
}
@media (prefers-reduced-motion:reduce){.sv-stage,.sv-light{transition:none}.sv-stage.on .sv-light:before{animation:none}}
/* ---- service scenes (11 Oct 2026, sv_scenes.py): each plays its story while its stage is lit ---- */
.sv{flex-wrap:wrap}
.sv-sc{flex:0 0 100%;order:-1;display:block;aspect-ratio:240/84;margin:-4px 0 2px;background:linear-gradient(180deg,#ebe5d9,#e1dacc);box-shadow:inset 0 1px 3px #0000001c,inset 0 0 0 1px #1b192012;overflow:hidden}
.sv-sc svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 1.4px 1.1px #2a1c3426)}
.sv-sc svg *{transform-box:fill-box}
.sv-sc .sh{fill:#fffdf6;stroke:#1b19202e;stroke-width:.8}.sv-sc .plum{fill:#3a2145;stroke:none}
.sv-sc .ln{fill:#1b19203d}.sv-sc .ln.lt{fill:#fffdf6b8}.sv-sc .pl-tg{fill:#3a2145}.sv-sc .pip{fill:#fffdf6}
.sv-sc .pl-wire,.sv-sc .ct-link{fill:none;stroke:#3a2145;stroke-width:1.2;stroke-dasharray:1 1}
.sv-sc .bar{fill:#e9e3d6}.sv-sc .dot{fill:#1b192059}.sv-sc .btnk{fill:#fffdf6}
.sv-sc .pic{fill:#cdc4b4}.sv-sc .mtn{fill:#8b7f8f}.sv-sc .sun{fill:#fffdf6}
.sv-sc .frame{fill:#1b1920}.sv-sc .scr{fill:#fffdf6}.sv-sc .pbtn{fill:#3a2145}
.sv-sc .brick{fill:#d8d0c1;stroke:#1b19202e;stroke-width:.8}.sv-sc .brick.dk{fill:#c8bfae}.sv-sc .track{fill:#e7e1d4}
.sv-sc .okc{fill:#3a2145}.sv-sc .okt,.sv-sc .lc-k{fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1}
.sv-sc .okt{stroke:#fffdf6}.sv-sc .lc-k{stroke:#3a2145}.sv-sc .ct-dot{fill:#3a2145}
.sv-sc .mp1{fill:#e7e0d2;stroke:#1b19202e;stroke-width:.8}.sv-sc .mp2{fill:#d6cdbd;stroke:#1b19202e;stroke-width:.8}
.sv-sc .road{fill:none;stroke:#fffdf6;stroke-width:2.2;stroke-linecap:round}
.sv-sc .pin{fill:#3a2145}.sv-sc .pinh{fill:#fffdf6}.sv-sc .ring{fill:none;stroke:#3a2145;stroke-width:1;opacity:.4}
.sv-sc .ic,.sv-sc .icl{fill:none;stroke:#3a2145;stroke-width:1.3}.sv-sc .icl{stroke-width:1}
.sv-sc .axis{fill:none;stroke:#1b192045;stroke-width:.8}.sv-sc .rp-c{fill:#5b3a6b}.sv-sc .rp-c5{fill:#3a2145}
.sv-sc .rp-tr{fill:none;stroke:#1b1920;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1}
.sv-sc .seal{fill:#3a2145}.sv-sc .seali{fill:none;stroke:#fffdf6;stroke-width:.8;stroke-dasharray:2 1.6}
.sv-sc .sealk{fill:none;stroke:#fffdf6;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sv-sc .bd-nav,.sv-sc .bd-hero,.sv-sc .bd-txt,.sv-sc .tc-fill,.sv-sc .rp-head{transform-origin:0 50%}
.sv-sc .bd-win,.sv-sc .bd-img,.sv-sc .tc-ok,.sv-sc .rp-seal,.sv-sc .pl-n,.sv-sc .ct-dot,.sv-sc .lc-r1,.sv-sc .lc-r2{transform-origin:50% 50%}
.sv-sc .tc-page{transform-origin:0 100%}.sv-sc .rp-c,.sv-sc .lc-map,.sv-sc .lc-pin{transform-origin:50% 100%}.sv-sc .ct-p{transform-origin:0 50%}
@keyframes odPlanTop{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,12%{opacity:0;translate:0 -5px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}28%,100%{}}
.sv-stage.on .sc-plan .pl-top{animation:odPlanTop 3.2s linear both}
@keyframes odPlanWire{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,26%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}46%,100%{}}
.sv-stage.on .sc-plan .pl-wire{animation:odPlanWire 3.2s linear both}
@keyframes odPlanC1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,40%{opacity:0;translate:0 9px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}58%,100%{}}
.sv-stage.on .sc-plan .pl-c1{animation:odPlanC1 3.2s linear both}
@keyframes odPlanC2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,48%{opacity:0;translate:0 9px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}66%,100%{}}
.sv-stage.on .sc-plan .pl-c2{animation:odPlanC2 3.2s linear both}
@keyframes odPlanC3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,56%{opacity:0;translate:0 9px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}74%,100%{}}
.sv-stage.on .sc-plan .pl-c3{animation:odPlanC3 3.2s linear both}
@keyframes odPlanN1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,64%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}76%,100%{}}
.sv-stage.on .sc-plan .pl-c1 .pl-n{animation:odPlanN1 3.2s linear both}
@keyframes odPlanN2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,70%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}82%,100%{}}
.sv-stage.on .sc-plan .pl-c2 .pl-n{animation:odPlanN2 3.2s linear both}
@keyframes odPlanN3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,76%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}88%,100%{}}
.sv-stage.on .sc-plan .pl-c3 .pl-n{animation:odPlanN3 3.2s linear both}
@keyframes odBuildWin{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,8%{opacity:0;scale:.95;animation-timing-function:cubic-bezier(.2,.8,.2,1)}22%,100%{}}
.sv-stage.on .sc-build .bd-win{animation:odBuildWin 3.2s linear both}
@keyframes odBuildNav{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,20%{scale:0 1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}32%,100%{}}
.sv-stage.on .sc-build .bd-nav{animation:odBuildNav 3.2s linear both}
@keyframes odBuildHero{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,26%{scale:0 1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}42%,100%{}}
.sv-stage.on .sc-build .bd-hero{animation:odBuildHero 3.2s linear both}
@keyframes odBuildHl{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,38%{opacity:0;translate:-5px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}50%,100%{}}
.sv-stage.on .sc-build .bd-hl{animation:odBuildHl 3.2s linear both}
@keyframes odBuildImg{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,40%{opacity:0;scale:.86;animation-timing-function:cubic-bezier(.2,.8,.2,1)}54%,100%{}}
.sv-stage.on .sc-build .bd-img{animation:odBuildImg 3.2s linear both}
@keyframes odBuildTxt{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,50%{scale:0 1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}64%,100%{}}
.sv-stage.on .sc-build .bd-txt{animation:odBuildTxt 3.2s linear both}
@keyframes odBuildPh{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,62%{opacity:0;translate:0 14px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}80%,100%{}}
.sv-stage.on .sc-build .bd-ph{animation:odBuildPh 3.2s linear both}
@keyframes odTechB1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,20%{opacity:0;translate:-16px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}36%,100%{}}
.sv-stage.on .sc-tech .tc-b4{animation:odTechB1 3.2s linear both}
@keyframes odTechB2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,24%{opacity:0;translate:16px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}40%,100%{}}
.sv-stage.on .sc-tech .tc-b5{animation:odTechB2 3.2s linear both}
@keyframes odTechB3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,30%{opacity:0;translate:-16px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}46%,100%{}}
.sv-stage.on .sc-tech .tc-b1{animation:odTechB3 3.2s linear both}
@keyframes odTechB4{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,34%{opacity:0;translate:0 10px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}50%,100%{}}
.sv-stage.on .sc-tech .tc-b2{animation:odTechB4 3.2s linear both}
@keyframes odTechB5{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,38%{opacity:0;translate:16px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}54%,100%{}}
.sv-stage.on .sc-tech .tc-b3{animation:odTechB5 3.2s linear both}
@keyframes odTechPage{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,50%{rotate:-5deg;translate:0 5px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}66%,100%{}}
.sv-stage.on .sc-tech .tc-page{animation:odTechPage 3.2s linear both}
@keyframes odTechFill{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,64%{scale:.06 1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}80%,100%{}}
.sv-stage.on .sc-tech .tc-fill{animation:odTechFill 3.2s linear both}
@keyframes odTechOk{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,76%{opacity:0;scale:.4;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}86%,100%{}}
.sv-stage.on .sc-tech .tc-ok{animation:odTechOk 3.2s linear both}
@keyframes odTechTick{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,82%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}94%,100%{}}
.sv-stage.on .sc-tech .okt{animation:odTechTick 3.2s linear both}
@keyframes odContP1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,14%{opacity:1;transform:translateX(-0.0px) skewY(16deg) scaleX(.3);animation-timing-function:cubic-bezier(.2,.8,.2,1)}58%,100%{}}
.sv-stage.on .sc-content .ct-p1{animation:odContP1 3.2s linear both}
@keyframes odContP2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,14%{opacity:.9;transform:translateX(-37.4px) skewY(-16deg) scaleX(.3);animation-timing-function:cubic-bezier(.2,.8,.2,1)}58%,100%{}}
.sv-stage.on .sc-content .ct-p2{animation:odContP2 3.2s linear both}
@keyframes odContP3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,14%{opacity:.9;transform:translateX(-74.8px) skewY(16deg) scaleX(.3);animation-timing-function:cubic-bezier(.2,.8,.2,1)}58%,100%{}}
.sv-stage.on .sc-content .ct-p3{animation:odContP3 3.2s linear both}
@keyframes odContP4{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,14%{opacity:.9;transform:translateX(-112.2px) skewY(-16deg) scaleX(.3);animation-timing-function:cubic-bezier(.2,.8,.2,1)}58%,100%{}}
.sv-stage.on .sc-content .ct-p4{animation:odContP4 3.2s linear both}
@keyframes odContLink{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,58%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}76%,100%{}}
.sv-stage.on .sc-content .ct-link{animation:odContLink 3.2s linear both}
@keyframes odContD1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,62%{opacity:0;scale:0;animation-timing-function:cubic-bezier(.3,1.6,.45,1)}72%,100%{}}
.sv-stage.on .sc-content .ct-d1{animation:odContD1 3.2s linear both}
@keyframes odContD2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,68%{opacity:0;scale:0;animation-timing-function:cubic-bezier(.3,1.6,.45,1)}78%,100%{}}
.sv-stage.on .sc-content .ct-d2{animation:odContD2 3.2s linear both}
@keyframes odContD3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,74%{opacity:0;scale:0;animation-timing-function:cubic-bezier(.3,1.6,.45,1)}84%,100%{}}
.sv-stage.on .sc-content .ct-d3{animation:odContD3 3.2s linear both}
@keyframes odContD4{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,80%{opacity:0;scale:0;animation-timing-function:cubic-bezier(.3,1.6,.45,1)}90%,100%{}}
.sv-stage.on .sc-content .ct-d4{animation:odContD4 3.2s linear both}
@keyframes odLocMap{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,10%{opacity:0;scale:1 .2;animation-timing-function:cubic-bezier(.2,.8,.2,1)}32%,100%{}}
.sv-stage.on .sc-local .lc-map{animation:odLocMap 3.2s linear both}
@keyframes odLocPin{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,32%{opacity:0;translate:0 -20px;animation-timing-function:cubic-bezier(.3,1.45,.45,1)}46%,100%{}}
.sv-stage.on .sc-local .lc-pin{animation:odLocPin 3.2s linear both}
@keyframes odLocRing{0%{opacity:.4;scale:1}8%,44%{opacity:0;scale:.3}62%{opacity:.7;scale:1.2}80%{opacity:0;scale:1.9}92%{opacity:0;scale:.6}100%{opacity:.4;scale:1}}.sv-stage.on .sc-local .lc-r1{animation:odLocRing 3.2s cubic-bezier(.37,0,.63,1) both}.sv-stage.on .sc-local .lc-r2{animation:odLocRing 2.95s cubic-bezier(.37,0,.63,1) .25s both}
@keyframes odLocT1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,52%{opacity:0;translate:9px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}66%,100%{}}
.sv-stage.on .sc-local .lc-t1{animation:odLocT1 3.2s linear both}
@keyframes odLocT2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,59%{opacity:0;translate:9px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}73%,100%{}}
.sv-stage.on .sc-local .lc-t2{animation:odLocT2 3.2s linear both}
@keyframes odLocT3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,66%{opacity:0;translate:9px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}80%,100%{}}
.sv-stage.on .sc-local .lc-t3{animation:odLocT3 3.2s linear both}
@keyframes odLocK1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,68%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}80%,100%{}}
.sv-stage.on .sc-local .lc-k1{animation:odLocK1 3.2s linear both}
@keyframes odLocK2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,75%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}87%,100%{}}
.sv-stage.on .sc-local .lc-k2{animation:odLocK2 3.2s linear both}
@keyframes odLocK3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,82%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}94%,100%{}}
.sv-stage.on .sc-local .lc-k3{animation:odLocK3 3.2s linear both}
@keyframes odRepSheet{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,6%{opacity:0;translate:0 10px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}22%,100%{}}
.sv-stage.on .sc-report .rp-sheet{animation:odRepSheet 3.2s linear both}
@keyframes odRepHead{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,18%{scale:0 1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}30%,100%{}}
.sv-stage.on .sc-report .rp-head{animation:odRepHead 3.2s linear both}
@keyframes odRepC1{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,28%{scale:1 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}42%,100%{}}
.sv-stage.on .sc-report .rp-c1{animation:odRepC1 3.2s linear both}
@keyframes odRepC2{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,33%{scale:1 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}47%,100%{}}
.sv-stage.on .sc-report .rp-c2{animation:odRepC2 3.2s linear both}
@keyframes odRepC3{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,38%{scale:1 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}52%,100%{}}
.sv-stage.on .sc-report .rp-c3{animation:odRepC3 3.2s linear both}
@keyframes odRepC4{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,43%{scale:1 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}57%,100%{}}
.sv-stage.on .sc-report .rp-c4{animation:odRepC4 3.2s linear both}
@keyframes odRepC5{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,48%{scale:1 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}62%,100%{}}
.sv-stage.on .sc-report .rp-c5{animation:odRepC5 3.2s linear both}
@keyframes odRepTr{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,58%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}78%,100%{}}
.sv-stage.on .sc-report .rp-tr{animation:odRepTr 3.2s linear both}
@keyframes odRepSeal{0%{animation-timing-function:cubic-bezier(.2,.8,.2,1)}7%,78%{opacity:0;scale:1.6;animation-timing-function:cubic-bezier(.2,.9,.3,1)}88%,100%{}}
.sv-stage.on .sc-report .rp-seal{animation:odRepSeal 3.2s linear both}
@media (prefers-reduced-motion:reduce){.sv-stage.on .sv-sc *{animation:none!important}}
/* ---- end service scenes ---- */

/* ---------- section 4: the route, one client's real month (10 Oct 2026). Curves only; nothing greyed out ---------- */
.route .ribbon{display:none}
.rt{position:relative;margin-top:clamp(10px,3vh,30px)}
.rt-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.rt-base{fill:none;stroke:#f4f1ea;stroke-opacity:.14;stroke-width:3;stroke-linecap:round}
.rt-draw{fill:none;stroke:#f4f1ea;stroke-opacity:.85;stroke-width:3;stroke-linecap:round}
.rt-glow{fill:none;stroke:#fff6ee;stroke-width:9;stroke-linecap:round;stroke-opacity:.55;opacity:0}
.rt-dot{fill:#2c1937;stroke:#f4f1ea;stroke-width:3;transition:fill .6s}
.rt-dot.on{fill:#f4f1ea}
.rt-who{position:relative;z-index:1;font-size:18px;font-weight:600;color:#ece6dc;margin-bottom:clamp(54px,8vh,80px)}
.rt-g{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,2.6vw,40px);align-items:start}
.rt-st{position:relative;padding:clamp(22px,2vw,30px);background:linear-gradient(160deg,#f7f4ec,#ddd8cb);color:#1b1920;
  box-shadow:inset 0 1px 0 #ffffffc8,3px 4px 0 -1px #bdb7aa,7px 8px 0 -2px #8f897e,0 34px 54px -26px #000d;
  transition:translate .9s cubic-bezier(.2,.8,.2,1),box-shadow .9s}
.rt-st:nth-child(2){margin-top:44px}.rt-st:nth-child(3){margin-top:12px}.rt-st:nth-child(4){margin-top:58px}
.rt-st .tex{opacity:.2}
.rt-st>*{position:relative}
.rt-st.on{translate:0 -6px}
.rt-pin{position:absolute;left:50%;top:-22px;width:2px;height:22px;margin-left:-1px;background:linear-gradient(#f4f1ea99,#f4f1ea33)}
.rt-k{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;color:#5d5368}
.rt-k span{display:inline-grid;place-items:center;min-width:34px;height:26px;background:#1b1920;color:#f4f1ea;font-size:15px}
.rt-n{margin-top:14px;line-height:.9}
.rt-n b{font-size:clamp(52px,4.6vw,78px);font-weight:700;letter-spacing:-.06em}
.rt-s{margin-top:10px;font-size:18px;line-height:1.4;color:#3e3746}
.rt-st.last{background:linear-gradient(160deg,#4a2b59,#2c1937);color:#f4f1ea;box-shadow:inset 0 1px 0 #ffffff26,3px 4px 0 -1px #5b3a6c,7px 8px 0 -2px #3c2549,0 40px 60px -26px #000}
.rt-st.last .tex{opacity:.08}
.rt-st.last .rt-k{color:#e4ddd0}.rt-st.last .rt-k span{background:#f4f1ea;color:#2c1937}
.rt-st.last .rt-s{color:#ece6dc}
.rt-chips{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}
.rt-chips li{padding:9px 10px;background:#ffffff14;font-size:17px;line-height:1.25;color:#f1ece3}
.rt-chips b{display:block;font-size:24px;letter-spacing:-.03em;color:#fff}
.rt-src{position:relative;z-index:1;margin-top:clamp(36px,5vh,56px);font-size:18px;line-height:1.5;color:#ddd6ca;max-width:52em}
@media (max-width:900px){
  .rt-who{margin-bottom:26px;padding-left:34px}
  .rt-g{grid-template-columns:1fr;gap:22px;padding-left:34px}
  .rt-st:nth-child(n){margin-top:0}
  .rt-pin{display:none}
  .rt-src{padding-left:34px}
}
@media (prefers-reduced-motion:reduce){.rt-st{transition:none}}
/* the route's traffic (home.js flowRoute) */
.rt-flow{position:absolute;left:0;top:0;pointer-events:none;z-index:0}
.rt-chips li{transition:background .5s,box-shadow .5s}
.rt-chips li.hit{background:#ffffff30;box-shadow:inset 0 0 0 1px #ffffff47}

/* ---------- section 5: wins you can check (10 Oct 2026). Biggest first; every visual is drawn from its own numbers ---------- */
.work .plate{display:none}
.wks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,2.6vw,40px);margin-bottom:clamp(36px,5vh,56px)}
.wk{position:relative;padding:clamp(26px,2.6vw,40px);background:linear-gradient(160deg,#f7f4ec,#ddd8cb);color:#1b1920;overflow:hidden;
  box-shadow:inset 0 1px 0 #ffffffc8,3px 4px 0 -1px #bdb7aa,7px 8px 0 -2px #8f897e,0 34px 54px -26px #000d}
.wk:nth-child(1){rotate:-.5deg}.wk:nth-child(2){rotate:.45deg;margin-top:26px}.wk:nth-child(3){rotate:.3deg}.wk:nth-child(4){rotate:-.35deg;margin-top:26px}
.wk .tex{opacity:.2}
.wk>*{position:relative}
.wk-k{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;color:#3a2145}
.wk-k span{display:inline-grid;place-items:center;min-width:34px;height:26px;background:#1b1920;color:#f4f1ea;font-size:15px}
.wk h3{margin-top:12px;font-size:clamp(26px,2.1vw,34px);letter-spacing:-.035em;line-height:1.1}
/* before and after as two bars, scaled to each other; the after bar grows once */
.wk-bars{display:grid;gap:12px;margin-top:24px}
.wk-bar{position:relative;display:grid;grid-template-columns:1fr;align-items:center;min-height:62px}
.wk-bar i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--w) * 100%);min-width:10px;background:#cfc8bb;transform-origin:0 50%;transform:scaleX(0);transition:transform 1.5s cubic-bezier(.2,.8,.2,1) .1s}
.wk-bar.now i{background:linear-gradient(90deg,#4d2d5c,#2e1a39);transition-delay:.35s}
.wk.in .wk-bar i{transform:scaleX(1)}
.wk-bar span{position:relative;display:flex;align-items:baseline;gap:12px;padding:0 16px;font-size:18px;font-weight:600;color:#3e3746}
.wk-bar b{font-size:clamp(40px,3.4vw,56px);letter-spacing:-.05em;color:#1b1920;line-height:1}
.wk-bar.was span{padding-left:calc(var(--w) * 100% + 14px)}
.wk-bar.now span{color:#3e3746;transition:color .5s 1.1s}.wk-bar.now b{color:#1b1920;transition:color .5s 1.1s}
.wk.in .wk-bar.now span{color:#ece6dc}.wk.in .wk-bar.now b{color:#f7f4ec}
/* page one, position 10 to 1, top three marked; the September dot travels from where June was */
.wk-lad{margin-top:22px}
.wk-track{--in:5%;position:relative;height:96px;margin-top:34px;background:#d8d2c5;box-shadow:inset 0 1px 0 #ffffff80}
.wk-top3{position:absolute;right:0;top:0;bottom:0;width:calc(var(--in) + 2.5 / 9 * (100% - 2 * var(--in)));background:linear-gradient(90deg,#4d2d5c,#2e1a39);font-size:0}
.wk-top3:before{content:"Top three";position:absolute;right:0;bottom:calc(100% + 6px);font-size:15px;font-weight:700;color:#3a2145;white-space:nowrap}
.wk-track>i{position:absolute;bottom:8px;left:calc(var(--in) + var(--t) * (100% - 2 * var(--in)));translate:-50% 0;font-style:normal;font-size:14px;font-weight:700;color:#5d5368}
.wk-track>i:nth-of-type(n+8){color:#d8d0c4}
.wk-dot{position:absolute;top:12px;left:calc(var(--in) + var(--p) * (100% - 2 * var(--in)));translate:-50% 0;display:grid;justify-items:center;min-width:58px;padding:5px 8px;background:#f7f4ec;color:#1b1920;box-shadow:0 8px 16px -8px #000b;transition:left 1.6s cubic-bezier(.2,.8,.2,1) .3s}
.wk-dot b{font-size:20px;letter-spacing:-.03em;line-height:1.1}
.wk-dot small{font-size:14px;font-weight:700;color:#5d5368}
.wk-dot.was{background:#ece7dc;box-shadow:inset 0 0 0 2px #1b192040}
.wk-dot.now{left:calc(var(--in) + var(--from) * (100% - 2 * var(--in)));z-index:2}
.wk.in .wk-dot.now{left:calc(var(--in) + var(--p) * (100% - 2 * var(--in)))}
.wk-q{font-size:18px;font-weight:600;color:#2b2731}
.wk-x{margin-top:20px;font-size:18px;line-height:1.45;color:#2b2731}
.wk-src{margin-top:10px;font-size:18px;line-height:1.45;color:#5d5368}
.wk .lnk{margin-top:18px}
@media (max-width:900px){
  .wks{grid-template-columns:1fr;gap:24px}
  .wk:nth-child(n){margin-top:0;rotate:0deg}
  .wk-bar span{font-size:17px}
  .wk-track .pg{font-size:14px;padding:0 6px 6px}
}
@media (prefers-reduced-motion:reduce){.wk-bar i{transform:none;transition:none}.wk-dot{transition:none}}
/* big moves: pages 6 to 1, page one marked; same dot behaviour as the page-one track */
.wk-track.t2{--in:8%}
.wk-track.t2 .wk-p1{position:absolute;right:0;top:0;bottom:0;width:calc(var(--in) + (1 - 50 / 59) * (100% - 2 * var(--in)));background:linear-gradient(90deg,#4d2d5c,#2e1a39)}
.wk-track.t2 .wk-p1:before{content:"Page one";position:absolute;right:0;bottom:calc(100% + 6px);font-size:15px;font-weight:700;color:#3a2145;white-space:nowrap}
.wk-track.t2>i{color:#5d5368}
/* five sheets: the last runs the full width */
.wk:nth-child(5){grid-column:1 / -1;rotate:.25deg}
@media (max-width:900px){.wk:nth-child(5){grid-column:auto}}
@media (max-width:900px){.wk-track.t2{--in:11%}.wk-track.t2 .lg{display:none}.wk-track.t2 .wk-p1:before{content:"Page one"}}
.wk-track.t2 .p1l{position:absolute;left:50%;bottom:8px;translate:-50% 0;font-size:14px;font-weight:700;color:#ece6dc;white-space:nowrap}
/* page-one keywords as dots (11 Oct 2026): one per keyword; the earlier count is lit from the start, the rest pop in order */
.wk-dots{margin-top:24px}
.wd-g{display:grid;grid-template-columns:repeat(21,minmax(0,1fr));gap:clamp(4px,.42vw,6px)}
.wd-g i{display:block;aspect-ratio:1;border-radius:50%;box-shadow:inset 0 0 0 1.5px #1b192030;scale:.72;
  transition:background-color .45s,box-shadow .45s,scale .55s cubic-bezier(.3,1.6,.45,1);transition-delay:calc(.4s + var(--i) * 10ms)}
.wd-g i.o{background:#8d8595;box-shadow:none;scale:1}
.wk.in .wd-g i{background:#3a2145;box-shadow:none;scale:1}.wk.in .wd-g i.o{background:#8d8595}
.wd-l{display:flex;justify-content:space-between;align-items:flex-end;gap:10px 18px;flex-wrap:wrap;margin-top:16px}
.wd-l span{display:flex;align-items:baseline;gap:9px;font-size:18px;line-height:1.3;color:#3e3746}
.wd-l span>i{align-self:center;width:12px;height:12px;border-radius:50%;background:#8d8595;flex:none}
.wd-l .now>i{background:#3a2145}
.wd-l b{font-size:clamp(30px,2.4vw,40px);font-weight:700;letter-spacing:-.04em;color:#6f6777}
.wd-l .now b{color:#3a2145}
@media (prefers-reduced-motion:reduce){.wd-g i{transition:none;scale:1}.wd-g i:not(.o){background:#3a2145;box-shadow:none}}

/* ---------- section 6: every page has a purpose (10 Oct 2026). Paper, not lilac; proof under the tree ---------- */
.arch .slip.grp{background:linear-gradient(118deg,#f7f4ec,#e2ddd1);box-shadow:inset 6px 0 0 #4d2d5c,0 18px 30px -16px #2a1c3477,0 2px 0 #fff8 inset}
.arch .slip.grp span{color:#5d5368}
.arch .slip.leaf{background:linear-gradient(118deg,#efebe2,#d8d2c5)}
.arch .slip.root span{color:#ece6dc}
.arch-proof{position:relative;display:flex;align-items:center;gap:clamp(20px,3vw,48px);margin:clamp(48px,7vh,80px) 0 clamp(28px,4vh,40px);padding:clamp(22px,2.4vw,32px) clamp(24px,2.6vw,40px);
  background:linear-gradient(130deg,#4d2d5c,#2e1a39);color:#f4f1ea;box-shadow:0 34px 54px -26px #2a1c34cc;overflow:hidden;rotate:-.4deg}
.arch-proof .tex{opacity:.06}
.arch-proof>*{position:relative}
.ap-n{display:flex;align-items:center;gap:16px;white-space:nowrap}
.ap-n span{font-size:clamp(40px,3.4vw,56px);font-weight:700;letter-spacing:-.05em;color:#cfc7bb}
.ap-n i{width:44px;height:2px;background:#f4f1ea99;position:relative}
.ap-n i:after{content:"";position:absolute;right:-2px;top:-5px;width:10px;height:12px;background:#f4f1ea99;clip-path:polygon(0 0,100% 50%,0 100%)}
.ap-n b{font-size:clamp(52px,4.6vw,76px);font-weight:700;letter-spacing:-.06em;color:#fff}
.ap-t{font-size:18px;line-height:1.5;color:#ece6dc;max-width:34em}
.ap-t b{display:block;font-size:clamp(22px,1.8vw,28px);letter-spacing:-.03em;color:#fff;margin-bottom:4px}
@media (max-width:900px){
  /* one card per group, its pages inside: a short spine joins the cards, nothing crosses a page */
  .arch .tree-l{display:none}
  .arch .slip.root{margin-bottom:22px}
  .arch .cols{gap:16px;margin-left:12px;padding-left:18px;border-left:2px solid #3a2145}
  .arch .col{position:relative;gap:0;background:linear-gradient(118deg,#f7f4ec,#e2ddd1);box-shadow:inset 6px 0 0 #4d2d5c,0 18px 30px -16px #2a1c3477}
  .arch .col:before{content:"";position:absolute;left:-25px;top:26px;width:12px;height:12px;border-radius:50%;background:#3a2145;box-shadow:0 0 0 3px #e5e1d6}
  .arch .slip.grp{margin:0;background:none;box-shadow:none;padding:16px 20px 10px}
  .arch .slip.leaf{margin:0 0 0 20px;background:none;box-shadow:none;padding:12px 18px 12px 0;border-top:1px solid #1b19201a}
  .arch .slip.leaf .tex,.arch .slip.grp .tex{display:none}
  .arch-proof{flex-direction:column;align-items:flex-start;rotate:0deg}
}
/* structure: a visitor travels one path to its page, which lifts as it arrives (home.js visitTree, 11 Oct 2026) */
.tree-l .t-visit{opacity:0}
.tree-l .tv-d{fill:#3a2145;stroke:#fffdf6;stroke-width:3}
.tree-l .tv-h{fill:#3a2145;opacity:.2}
.slip.leaf{transition:translate .5s cubic-bezier(.3,1.4,.4,1),box-shadow .5s}
.slip.leaf.hit{translate:0 -4px;box-shadow:inset 4px 0 0 #3a2145,0 24px 32px -16px #2a1c3499,0 2px 0 #fff8 inset}

/* ---------- one phone for the whole site (10 Oct 2026). iPhone 15 proportions: body 71.6 x 147.6 mm, screen 393 x 852 pt.
   Thin metal rim, black glass bezel, deep corners, Dynamic Island, status bar, side buttons. Everything is sized from the
   phone's own width (container units), so it reads the same at any size. Two frames: dark titanium and white. ---------- */
.iph{position:relative;container-type:inline-size;aspect-ratio:71.6/147.6;width:100%}
.iph-body{position:absolute;inset:0;border-radius:16.6cqw;
  background:linear-gradient(140deg,#5a5a60 0%,#26262a 16%,#141417 46%,#26262b 80%,#55555b 100%);
  box-shadow:inset 0 0 0 .3cqw #00000080,0 2cqw 4cqw -1.5cqw #000000b3,0 16cqw 30cqw -12cqw #000000e6}
.iph-body:before{content:"";position:absolute;inset:.28cqw;border-radius:16.3cqw;box-shadow:inset 0 0 0 .32cqw #ffffff26;pointer-events:none}
.iph-bez{position:absolute;inset:1.05cqw;border-radius:15.6cqw;background:#040405}
.iph-scr{position:absolute;inset:3.6cqw;border-radius:12.9cqw;overflow:hidden;background:#121115}
.iph-sb{position:absolute;z-index:2;left:0;right:0;top:0;aspect-ratio:393/54;background:#121115 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 393 54'%3E%3Ctext x='51' y='35' text-anchor='middle' font-family='-apple-system,Helvetica Neue,Arial,sans-serif' font-size='17' font-weight='600' fill='%23fff'%3E9:41%3C/text%3E%3Crect x='134' y='11' width='125' height='37' rx='18.5' fill='%23000'/%3E%3Cg fill='%23fff'%3E%3Crect x='290' y='27' width='3.2' height='5' rx='1'/%3E%3Crect x='295' y='24.5' width='3.2' height='7.5' rx='1'/%3E%3Crect x='300' y='22' width='3.2' height='10' rx='1'/%3E%3Crect x='305' y='19.5' width='3.2' height='12.5' rx='1'/%3E%3Cpath d='M322 31.6l2.3-2.6a3.3 3.3 0 0 0-4.6 0z'/%3E%3Cpath d='M317.4 26.8l1.5 1.6a5.6 5.6 0 0 1 6.2 0l1.5-1.6a7.9 7.9 0 0 0-9.2 0z'/%3E%3Cpath d='M314.4 23.7l1.5 1.6a9.9 9.9 0 0 1 12.2 0l1.5-1.6a12.2 12.2 0 0 0-15.2 0z'/%3E%3C/g%3E%3Crect x='338.5' y='20' width='24' height='12' rx='3.6' fill='none' stroke='%23ffffff88' stroke-width='1'/%3E%3Crect x='340.5' y='22' width='17' height='8' rx='2' fill='%23fff'/%3E%3Cpath d='M364 24.2v3.6a1.9 1.9 0 0 0 0-3.6z' fill='%23ffffff88'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
.iph-scr img{position:absolute;left:0;top:12.75cqw;width:100%;height:calc(100% - 12.75cqw);object-fit:cover;object-position:50% 0}
.iph-scr:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(125deg,#ffffff14 0,#ffffff00 32%);z-index:3}
/* side buttons: action and volume on the left, power on the right */
.iph>.b{position:absolute;width:1cqw;border-radius:.6cqw;background:linear-gradient(90deg,#1c1c20,#55555b 60%,#2a2a2f)}
.iph>.ba{left:-.62cqw;top:21cqw;height:6.4cqw}
.iph>.bv1{left:-.62cqw;top:32cqw;height:12.4cqw}
.iph>.bv2{left:-.62cqw;top:47cqw;height:12.4cqw}
.iph>.bp{right:-.62cqw;top:36cqw;height:19.4cqw;background:linear-gradient(270deg,#1c1c20,#55555b 60%,#2a2a2f)}
/* white frame for dark grounds: the metal turns pale, the glass bezel stays black like the real thing */
.iph.light .iph-body{background:linear-gradient(140deg,#ffffff 0%,#e3e2df 18%,#c9c8c4 48%,#e6e5e1 80%,#fbfbf9 100%);box-shadow:inset 0 0 0 .3cqw #0000001f,0 2cqw 4cqw -1.5cqw #00000080,0 16cqw 30cqw -12cqw #000000cc}
.iph.light .iph-body:before{box-shadow:inset 0 0 0 .32cqw #ffffffb3}
.iph.light>.b{background:linear-gradient(90deg,#b9b8b4,#f2f1ee 60%,#cfcec9)}
.iph.light>.bp{background:linear-gradient(270deg,#b9b8b4,#f2f1ee 60%,#cfcec9)}

/* ---------- section 7: the devices carry the current design; the phone is the one phone (10 Oct 2026) ---------- */
.dev.phone .iph{filter:none}
.dev.phone{width:clamp(150px,13.5vw,220px)}
@media (max-width:900px){.dev.phone{width:31%}}
/* screens that scroll the real pages (11 Oct 2026): each capture is three screens tall and travels inside its frame at a
   reader's pace, stopping on each screen, then glides back to the top. Runs only while the devices are on screen. */
.scr img.roll,.iph-scr img.roll{height:auto;object-fit:fill;will-change:translate;animation:odScreen 26s cubic-bezier(.45,0,.3,1) infinite;animation-play-state:paused}
.dev.wall img.roll{--roll:-70%}.dev.laptop img.roll{--roll:-66.6%}.iph-scr img.roll{--roll:-64%}
.devices.live img.roll,.dir-ph.live img.roll{animation-play-state:running}
.dev.laptop img.roll{animation-delay:-8s}.iph-scr img.roll{animation-delay:-15s}
@keyframes odScreen{0%,9%{translate:0 0}21%,33%{translate:0 calc(var(--roll) / 2)}46%,62%{translate:0 var(--roll)}86%,100%{translate:0 0}}
@media (prefers-reduced-motion:reduce){.scr img.roll,.iph-scr img.roll{animation:none}}

/* ---------- section 8: publishing, real output and a real outcome (10 Oct 2026) ---------- */
.pub .pub-g{display:none}
.flow{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin:0 0 clamp(36px,5vh,56px);border-top:2px solid #1b1920}
.flow li{position:relative;padding:16px 18px 0 0}
.flow li:before{content:"";position:absolute;left:0;top:-7px;width:12px;height:12px;border-radius:50%;background:#3a2145;box-shadow:0 0 0 3px #e5e1d6}
.flow span{display:block;font-size:15px;font-weight:700;color:#6c4a80;margin-top:4px}
.flow b{display:block;font-size:clamp(20px,1.5vw,24px);letter-spacing:-.025em;color:#1b1920}
.flow em{display:block;margin-top:4px;font-style:normal;font-size:18px;line-height:1.4;color:#3e3746}
.pubx{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:end;margin-bottom:clamp(36px,5vh,56px)}
.stk-k{font-size:18px;font-weight:700;color:#3a2145;margin-bottom:18px}
.stk-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,30px);align-items:end;height:clamp(300px,30vw,400px)}
.stk{display:flex;flex-direction:column;justify-content:flex-end;height:100%}
/* a pile of sheets: the edges show as fine lines, the height is the real count */
.stk-pile{position:relative;height:calc(var(--h) * 78%);min-height:120px;display:flex;flex-direction:column;justify-content:flex-end;padding:18px 18px 16px;overflow:hidden;
  background:repeating-linear-gradient(180deg,#f3efe6 0 5px,#d9d3c6 5px 6px),linear-gradient(118deg,#f7f4ec,#ddd8cb);background-blend-mode:normal;
  box-shadow:inset 0 1px 0 #fff,3px 4px 0 -1px #c4bdaf,0 26px 40px -22px #2a1c3499;transform-origin:50% 100%;transform:scaleY(.12);transition:transform 1.6s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--k) * .18s)}
.stk-pile .tex{opacity:.18}
.stk-pile>*{position:relative}
.stacks.in .stk-pile{transform:none}
.stk-pile b{font-size:clamp(48px,4.4vw,72px);font-weight:700;letter-spacing:-.06em;line-height:.95;color:#1b1920}
.stk-pile span{font-size:18px;font-weight:600;color:#3e3746}
.stk:nth-child(2) .stk-pile{background:repeating-linear-gradient(180deg,#563566 0 5px,#3b2347 5px 6px),linear-gradient(130deg,#4d2d5c,#2e1a39)}
.stk:nth-child(2) .stk-pile b{color:#fff}.stk:nth-child(2) .stk-pile span{color:#ece6dc}
.stk-who{margin-top:14px;font-size:18px;font-weight:700;color:#1b1920;line-height:1.3}
.stk-was{margin-top:2px;font-size:18px;color:#5d5368}
.stk-src{margin-top:18px;font-size:18px;line-height:1.45;color:#5d5368}
.pub-out{position:relative;padding:clamp(24px,2.6vw,36px);background:linear-gradient(130deg,#4d2d5c,#2e1a39);color:#f4f1ea;overflow:hidden;box-shadow:0 34px 54px -26px #2a1c34cc;rotate:.6deg}
.pub-out .tex{opacity:.06}
.pub-out>*{position:relative}
.po-k{font-size:18px;font-weight:700;color:#e4ddd0}
.po-q{margin-top:10px;font-size:clamp(22px,1.8vw,28px);letter-spacing:-.03em;line-height:1.2;color:#fff}
.po-n{display:flex;align-items:center;gap:16px;margin-top:18px}
.po-n span{font-size:clamp(40px,3.4vw,54px);font-weight:700;letter-spacing:-.05em;color:#cfc7bb}
.po-n i{width:40px;height:2px;background:#f4f1ea99;position:relative}
.po-n i:after{content:"";position:absolute;right:-2px;top:-5px;width:10px;height:12px;background:#f4f1ea99;clip-path:polygon(0 0,100% 50%,0 100%)}
.po-n b{font-size:clamp(56px,5vw,84px);font-weight:700;letter-spacing:-.06em;color:#fff;line-height:1}
.po-t{margin-top:12px;font-size:18px;line-height:1.5;color:#ece6dc}
@media (max-width:900px){
  .flow{display:flex;flex-wrap:wrap;gap:8px;border-top:0}
  .flow li{display:flex;align-items:center;gap:8px;padding:9px 12px;background:#f3efe6;box-shadow:0 8px 14px -10px #2a1c3466}
  .flow li:before{display:none}
  .flow span{margin:0;font-size:15px}
  .flow b{font-size:18px}
  .flow em{display:none}
  .stk-pile b{font-size:40px}
  .pubx{grid-template-columns:1fr}
  .stk-g{height:300px;gap:12px}
  .stk-pile{padding:12px 10px}
  .stk-pile span,.stk-who{font-size:17px}
  .pub-out{rotate:0deg}
}
@media (prefers-reduced-motion:reduce){.stk-pile{transform:none;transition:none}}
/* the piles (11 Oct 2026): each starts at its real earlier count and grows to September's, revealed upward so its
   number is never squashed, while the count runs from the earlier figure to the new one; then new sheets keep landing */
.stk-pw{position:relative;height:calc(var(--h) * 78%);min-height:120px}
.stk-pw>.stk-pile{height:100%;min-height:0;transform:none;clip-path:inset(calc((1 - var(--w0)) * 100%) -30px -60px -30px);transition:clip-path 1.9s cubic-bezier(.2,.8,.2,1) calc(var(--k) * .18s)}
.stacks.in .stk-pw>.stk-pile{clip-path:inset(-30px -30px -60px -30px)}
.sht{position:absolute;left:3%;right:3%;top:-7px;height:7px;z-index:2;pointer-events:none;opacity:0;background:linear-gradient(#fffdf6,#e2dccd);box-shadow:0 1px 0 #00000024,0 4px 6px -3px #2a1c3466}
.stk:nth-child(2) .sht{background:linear-gradient(#70497f,#4d2d5c)}
.stacks.in .sht{animation:odSheetDrop 3.4s cubic-bezier(.2,.8,.2,1) infinite}
.stacks.in .sht.s1{animation-delay:calc(2.3s + var(--k) * .8s)}.stacks.in .sht.s2{animation-delay:calc(4s + var(--k) * .8s)}
@keyframes odSheetDrop{0%{opacity:0;translate:0 -60px;rotate:-4deg}10%{opacity:1}36%{translate:0 1px;rotate:.5deg}42%{translate:0 0;rotate:0deg}64%{opacity:1}80%,100%{opacity:0;translate:0 0;rotate:0deg}}
@media (prefers-reduced-motion:reduce){.stk-pw>.stk-pile{clip-path:none;transition:none}.sht{display:none}}

/* ---------- section 9: the real portal in a browser window and the one phone (10 Oct 2026) ---------- */
.rep .folio{display:none}
.rep-dev{position:relative;padding:0 0 12% 0;align-self:center}
.bw{position:relative;width:86%;border-radius:12px;overflow:hidden;background:#f7f4ec;box-shadow:0 2px 0 #ffffff1a inset,0 40px 70px -30px #000,0 10px 24px -12px #000a}
.bw-bar{display:flex;align-items:center;gap:7px;height:38px;padding:0 14px;background:linear-gradient(#f1eee7,#e3dfd5);border-bottom:1px solid #1b192014}
.bw-bar i{width:11px;height:11px;border-radius:50%;background:#cfc9be}
.bw-bar span{margin-left:14px;flex:1;max-width:300px;padding:4px 12px;border-radius:7px;background:#ffffffb3;font-size:14px;font-weight:600;color:#3e3746;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bw img{display:block;width:100%;aspect-ratio:2880/1800;object-fit:cover;object-position:0 0}
.rep-ph{position:absolute;right:0;bottom:0;width:29%;rotate:2deg}
@media (max-width:900px){
  .rep-dev{padding-bottom:18%;margin-bottom:28px}
  .bw{width:92%}
  .bw-bar{height:30px}
  .bw-bar span{font-size:14px;max-width:none;margin-left:10px}
  .rep-ph{width:36%}
}
/* reporting (11 Oct 2026): each promise is pinned onto the part of the real portal it describes, in turn: the dated
   report, the numbers with their meaning, the decision waiting in Approvals (home.js rpStep) */
.rp-pins{position:absolute;left:0;right:0;bottom:0;aspect-ratio:1.6;pointer-events:none}
.rp-hl{position:absolute;border:2px solid #3a2145;border-radius:10px;box-shadow:0 0 0 5px #3a21451f;opacity:0;scale:.98;transition:opacity .5s,scale .6s cubic-bezier(.3,1.4,.4,1)}
.rp-hl.ln{border-width:0 0 3px;border-radius:0;box-shadow:none}
.rpin{position:absolute;display:grid;place-items:center;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:#5b3a6b;color:#fffdf6;font-size:16px;font-weight:700;line-height:1;
  box-shadow:0 0 0 3px #fffdf6,0 8px 16px -6px #000c;opacity:0;scale:.6;transition:opacity .45s,scale .55s cubic-bezier(.3,1.5,.45,1),background .4s}
.folio-g.tour .rpin{opacity:1;scale:.82}
.rp-pins .rp-hl.on{opacity:1;scale:1}.rp-pins .rpin.on{opacity:1;scale:1;background:#3a2145}
.rpin.on:after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid #3a2145;animation:rpPulse 1.6s cubic-bezier(.2,.8,.2,1) infinite}
@keyframes rpPulse{0%{opacity:.8;scale:1}100%{opacity:0;scale:1.9}}
.rep-pts>div{position:relative}
.rep-pts>div:before{content:"";position:absolute;left:-18px;top:18px;bottom:18px;width:3px;background:#e6dfd2;scale:1 0;transform-origin:50% 0;transition:scale .6s cubic-bezier(.2,.8,.2,1)}
.rep-pts>div b{transition:color .4s}.rep-pts>div.on b{color:#fff}.rep-pts>div.on:before{scale:1 1}
@media (max-width:900px){.rp-hl{border-radius:6px}.rpin{width:24px;height:24px;margin:-12px 0 0 -12px;font-size:15px}.rep-pts>div:before{left:-12px}}
@media (prefers-reduced-motion:reduce){.rpin{opacity:1;scale:1}.rpin.on:after{animation:none}}

/* ---------- business section: the real offer page on the white-framed phone (10 Oct 2026) ---------- */
.direct .dir-img{display:none}
.dir-ph{width:min(300px,62%);margin:0 auto;rotate:-3deg;filter:drop-shadow(0 50px 50px #000b)}
@media (max-width:900px){.dir-ph{width:58%;margin-bottom:24px}}
/* ---- questions: one scene per answer (11 Oct 2026, faq_scenes.py) ---- */
.fs-stage{position:relative;height:190px;margin-top:18px}
.fs-sc{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .45s,visibility 0s .45s}
.fs-sc.on{opacity:1;visibility:visible;transition:opacity .45s}
.fs-sc svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 8px 10px #0000004d)}
.fs-sc svg *{transform-box:fill-box}
.fs-sc .fq-pp{fill:#f6f3ea}.fs-sc .fq-pp.dim{fill:#d9d3c7}.fs-sc .fq-pp2{fill:#e9e3d6}.fs-sc .fq-pk{fill:#3a2145}.fs-sc .fq-pk.lift{fill:#5b3a6b}
.fs-sc .pl{fill:#1b19203d}.fs-sc .pl.lt2{fill:#f4f1ea8c}
.fs-sc .seal{fill:#f4f1ea;stroke:#3a2145;stroke-width:2}.fs-sc .seali{fill:none;stroke:#3a2145;stroke-width:1.2;stroke-dasharray:2.4 2}
.fs-sc .tkc{fill:#f4f1ea}.fs-sc .tkp{fill:none;stroke:#3a2145;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1}
.fs-sc .tkp.sm{stroke-width:1.6;stroke-dasharray:none}.fs-sc .tkc.sm{fill:#3a2145}.fs-sc .tkp.sm{stroke:#f4f1ea}.fs-sc .tkp.up{stroke-dasharray:none}
.fs-sc .ln{fill:none;stroke:#f4f1ea;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1 1;opacity:.85}
.fs-sc .dash{fill:none;stroke:#f4f1ea;stroke-width:2;stroke-linecap:round;stroke-dasharray:.02 .025;opacity:.8}
.fs-sc .ring{fill:#4d2d5c;stroke:#f4f1ea;stroke-width:2}.fs-sc .lt{fill:#f4f1ea}
.fs-sc .key{fill:none;stroke:#f4f1ea;stroke-width:3}.fs-sc .keyh{fill:#f4f1ea}.fs-sc .keyl{fill:none;stroke:#f4f1ea;stroke-width:3;stroke-linecap:round}
.fs-sc .win{fill:#3a214533}
.fs-sc .a-seal,.fs-sc .b-tick,.fs-sc .c-tick,.fs-sc .e-keep,.fs-sc .e-up,.fs-sc .f-tick,.fs-sc [class^=c-n],.fs-sc .tkc.sm{transform-origin:50% 50%}
.fs-sc .d-r .pl,.fs-sc .e-hl{transform-origin:0 50%}.fs-sc .f-flap{transform-origin:50% 100%}.fs-sc .g-home,.fs-sc .g-stack{transform-origin:50% 100%}
@keyframes fqA1{0%,0%{opacity:0;translate:0 10px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}26%,100%{}}
.fs-sc.on .a-back{animation:fqA1 2.6s linear both}
@keyframes fqA2{0%,22%{opacity:0;translate:-46px 6px;rotate:-5deg;animation-timing-function:cubic-bezier(.2,.8,.2,1)}62%,100%{}}
.fs-sc.on .a-front{animation:fqA2 2.6s linear both}
@keyframes fqA3{0%,62%{opacity:0;scale:1.7;animation-timing-function:cubic-bezier(.2,.8,.2,1)}80%,100%{}}
.fs-sc.on .a-seal{animation:fqA3 2.6s linear both}
@keyframes fqB1{0%,0%{opacity:0;translate:0 8px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}22%,100%{}}
.fs-sc.on .b-rest{animation:fqB1 2.6s linear both}
@keyframes fqB3{0%,22%{opacity:0;translate:-10px 18px;rotate:4deg}34%{opacity:1;translate:0 0;rotate:0deg}48%{translate:0 0}74%,100%{translate:96px 4px;rotate:0deg}}
.fs-sc.on .b-one{animation:fqB3 2.6s cubic-bezier(.37,0,.63,1) both}
@keyframes fqB4{0%,48%{opacity:1}74%,100%{opacity:.5}}
.fs-sc.on .b-rest .pp{animation:fqB4 2.6s linear both}
@keyframes fqB5{0%,74%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}88%,100%{}}
.fs-sc.on .b-tick{animation:fqB5 2.6s linear both}
@keyframes fqB6{0%,80%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}96%,100%{}}
.fs-sc.on .b-tick .tkp{animation:fqB6 2.6s linear both}
@keyframes fqC1{0%,0%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}16%,100%{}}
.fs-sc.on .c-n1{animation:fqC1 2.6s linear both}
@keyframes fqC2{0%,8%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}24%,100%{}}
.fs-sc.on .c-n2{animation:fqC2 2.6s linear both}
@keyframes fqC3{0%,16%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}32%,100%{}}
.fs-sc.on .c-n3{animation:fqC3 2.6s linear both}
@keyframes fqC4{0%,30%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}46%,100%{}}
.fs-sc.on .c-l1{animation:fqC4 2.6s linear both}
@keyframes fqC5{0%,40%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}56%,100%{}}
.fs-sc.on .c-l2{animation:fqC5 2.6s linear both}
@keyframes fqC6{0%,58%{opacity:0;clip-path:inset(0 100% 0 0)}84%,100%{opacity:.8;clip-path:inset(0 0 0 0)}}
.fs-sc.on .c-arc{animation:fqC6 2.6s cubic-bezier(.2,.8,.2,1) both}
@keyframes fqC7{0%,82%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}94%,100%{}}
.fs-sc.on .c-tick{animation:fqC7 2.6s linear both}
@keyframes fqC8{0%,86%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}100%,100%{}}
.fs-sc.on .c-tick .tkp{animation:fqC8 2.6s linear both}
@keyframes fqD1{0%,0%{opacity:0;translate:0 10px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}18%,100%{}}
.fs-sc.on .d-sheet{animation:fqD1 2.6s linear both}
@keyframes fqD1r{0%,16%{opacity:0;translate:-8px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}28%,100%{}}
.fs-sc.on .d-r1{animation:fqD1r 2.6s linear both}
@keyframes fqD2r{0%,30%{opacity:0;translate:-8px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}42%,100%{}}
.fs-sc.on .d-r2{animation:fqD2r 2.6s linear both}
@keyframes fqD3r{0%,44%{opacity:0;translate:-8px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}56%,100%{}}
.fs-sc.on .d-r3{animation:fqD3r 2.6s linear both}
@keyframes fqD4r{0%,58%{opacity:0;translate:-8px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}70%,100%{}}
.fs-sc.on .d-r4{animation:fqD4r 2.6s linear both}
@keyframes fqD5r{0%,72%{opacity:0;translate:-8px 0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}84%,100%{}}
.fs-sc.on .d-r5{animation:fqD5r 2.6s linear both}
@keyframes fqD1t{0%,24%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}34%,100%{}}
.fs-sc.on .d-r1 .tkc.sm{animation:fqD1t 2.6s linear both}
@keyframes fqD2t{0%,38%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}48%,100%{}}
.fs-sc.on .d-r2 .tkc.sm{animation:fqD2t 2.6s linear both}
@keyframes fqD3t{0%,52%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}62%,100%{}}
.fs-sc.on .d-r3 .tkc.sm{animation:fqD3t 2.6s linear both}
@keyframes fqD4t{0%,66%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}76%,100%{}}
.fs-sc.on .d-r4 .tkc.sm{animation:fqD4t 2.6s linear both}
@keyframes fqD5t{0%,80%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}90%,100%{}}
.fs-sc.on .d-r5 .tkc.sm{animation:fqD5t 2.6s linear both}
@keyframes fqE1p{0%,0%{opacity:0;translate:0 10px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}18%,100%{}}
.fs-sc.on .e-p1{animation:fqE1p 2.6s linear both}
@keyframes fqE2p{0%,6%{opacity:0;translate:0 10px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}24%,100%{}}
.fs-sc.on .e-p2{animation:fqE2p 2.6s linear both}
@keyframes fqE3p{0%,12%{opacity:0;translate:0 10px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}30%,100%{}}
.fs-sc.on .e-p3{animation:fqE3p 2.6s linear both}
@keyframes fqEk{0%,26%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}38%,100%{}}
.fs-sc.on .e-keep{animation:fqEk 2.6s linear both}
@keyframes fqEk2{0%,32%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}44%,100%{}}
.fs-sc.on .e-keep .tkp{animation:fqEk2 2.6s linear both}
@keyframes fqEh{0%,42%{scale:0 1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}56%,100%{}}
.fs-sc.on .e-hl{animation:fqEh 2.6s linear both}
@keyframes fqEu{0%,50%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}62%,100%{}}
.fs-sc.on .e-up{animation:fqEu 2.6s linear both}
@keyframes fqEf{0%,12%{opacity:0}30%,62%{opacity:1}80%,100%{opacity:.45}}
.fs-sc.on .e-p3{animation:fqE3p 2.6s linear both,fqEf 2.6s linear both}
@keyframes fqEa{0%,64%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}86%,100%{}}
.fs-sc.on .e-arr{animation:fqEa 2.6s linear both}
@keyframes fqEh2{0%,84%{opacity:0;animation-timing-function:cubic-bezier(.2,.8,.2,1)}92%,100%{}}
.fs-sc.on .e-head{animation:fqEh2 2.6s linear both}
@keyframes fqF1{0%,0%{opacity:0;translate:0 8px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}18%,100%{}}
.fs-sc.on .f-src{animation:fqF1 2.6s linear both}
@keyframes fqF2{0%,6%{opacity:0;translate:0 8px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}24%,100%{}}
.fs-sc.on .f-fold{animation:fqF2 2.6s linear both}
@keyframes fqF3{0%,10%{opacity:0;translate:0 8px}22%{opacity:1;translate:0 0}30%{translate:0 0}50%{translate:74px -26px}70%,100%{translate:150px 30px}}
.fs-sc.on .f-key{animation:fqF3 2.6s cubic-bezier(.37,0,.63,1) both}
@keyframes fqF4{0%,68%{scale:1 .2}84%,100%{scale:1 1}}
.fs-sc.on .f-flap{animation:fqF4 2.6s cubic-bezier(.2,.8,.2,1) both}
@keyframes fqF5{0%,82%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}92%,100%{}}
.fs-sc.on .f-tick{animation:fqF5 2.6s linear both}
@keyframes fqF6{0%,86%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}100%,100%{}}
.fs-sc.on .f-tick .tkp{animation:fqF6 2.6s linear both}
@keyframes fqG1{0%,0%{opacity:0;scale:.3;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}14%,100%{}}
.fs-sc.on .g-o{animation:fqG1 2.6s linear both}
@keyframes fqG2{0%,12%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}34%,100%{}}
.fs-sc.on .g-a{animation:fqG2 2.6s linear both}
@keyframes fqG3{0%,30%{opacity:0;translate:0 8px;animation-timing-function:cubic-bezier(.2,.8,.2,1)}46%,100%{}}
.fs-sc.on .g-stack{animation:fqG3 2.6s linear both}
@keyframes fqG7{0%,30%{opacity:.85}60%,100%{opacity:.35}}
.fs-sc.on .g-a{animation:fqG2 2.6s linear both,fqG7 2.6s linear both}
.fs-sc.on .g-stack{animation:fqG3 2.6s linear both,fqG8 2.6s linear both}
@keyframes fqG8{0%,30%{opacity:0}46%,56%{opacity:1}76%,100%{opacity:.4}}
@keyframes fqG4{0%,48%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(.2,.8,.2,1)}74%,100%{}}
.fs-sc.on .g-b{animation:fqG4 2.6s linear both}
@keyframes fqG5{0%,70%{opacity:0;scale:.6;animation-timing-function:cubic-bezier(.3,1.5,.45,1)}88%,100%{}}
.fs-sc.on .g-home{animation:fqG5 2.6s linear both}
@media (prefers-reduced-motion:reduce){.fs-sc.on *{animation:none!important}}
/* ---- end questions scenes ---- */
/* markets (11 Oct 2026): each place opens from a folded sheet. Seven accordion panels, hinged alternately left and right,
   turn edge-on one after another to show the photograph; then the place name rises. The photo, its parallax and its
   slow drift are untouched underneath. Without script or with reduced motion, the place is simply there. */
.mk-fold{display:none}
.js .mk-fold{position:absolute;inset:0;z-index:1;display:flex;perspective:1800px;pointer-events:none}
.mk-fold i{flex:1;height:100%;transform-origin:0 50%;transform:rotateY(0deg);backface-visibility:hidden;
  background:linear-gradient(90deg,#3e2449,#2b1835 70%,#24142d);box-shadow:inset -1px 0 0 #ffffff10;
  transition:transform 1.05s cubic-bezier(.62,0,.32,1),opacity .35s .85s;transition-delay:calc(var(--k) * 90ms),calc(.8s + var(--k) * 90ms)}
.mk-fold i:nth-child(even){transform-origin:100% 50%;background:linear-gradient(90deg,#22132b,#311c3d 30%,#4a2b58)}
.mkp.open .mk-fold i{transform:rotateY(88deg);opacity:0}
.mkp.open .mk-fold i:nth-child(even){transform:rotateY(-88deg)}
.js .mkp:not(.open) .mk-t{opacity:0;translate:0 24px}
.js .mk-t{transition:opacity .9s .7s,translate 1.1s cubic-bezier(.2,.8,.2,1) .7s}
@media (prefers-reduced-motion:reduce){.js .mk-fold{display:none}.js .mkp .mk-t{opacity:1;translate:none;transition:none}}

/* steps on a phone (18 Oct 2026): the ribbon folds down the left edge; inner.js draws it and flies the plane with the scroll */
.ribv,.ribv-plane{display:none}
@media (max-width:900px){
 .steps2.ribv-on .st2-g{padding-left:48px}
 .steps2.ribv-on .st2{border-left:0;padding-left:0}
 .steps2.ribv-on .ribv{display:block;position:absolute;left:0;top:0;width:40px;overflow:visible;pointer-events:none}
 .steps2.ribv-on .ribv-plane{display:block;position:absolute;left:0;top:0;width:30px;height:18px;pointer-events:none;z-index:2;will-change:transform}
 .ribv polygon{stroke:#3a214530;stroke-width:1}
 .ribv circle{fill:#f4f1ea;stroke:#3a2145;transition:fill .35s}
 .ribv circle.hit{fill:#3a2145;stroke:#f4f1ea}
 .steps2.ribv-on .st2 .sn{transition:color .35s}
 .steps2.ribv-on .st2.hit .sn{color:#f4f1ea}
 .paperbg .steps2.ribv-on .st2.hit .sn{color:#3a2145}
 .paperbg .steps2.ribv-on .st2:not(.hit) .sn{color:#9a90a4}
}
/* desktop ribbon stations (drawn by inner.js in real pixels): open until the plane reaches them */
.ribbon2 .rnode{fill:#f4f1ea;stroke:#3a2145;transition:fill .3s,stroke .3s}
.ribbon2 .rnode.hit{fill:#3a2145;stroke:#f4f1ea}
.ribbon2 svg:not(.plane),.ribv{filter:drop-shadow(0 7px 7px #2a1c3438)}