/* yelvakvarnknot.com: a wood-type cabinet of a poster print shop */
:root{
  --walnut:#2A1C13;--walnut2:#3B2818;--floor:#21160F;--front:#4A3220;
  --maple:#E4C99C;--mapleLit:#F3E4C6;--mapleSide:#C39C68;--mapleShade:#9C764A;
  --ink:#1C1612;--muted:#5B4938;--proof:#F4EDDF;--line:#D6C9B0;
  --blue:#2346A0;--blueDot:#3E64C8;--blueSoft:#CBD4EC;--brass:#CDA84F;--brassDark:#8C6C27;
  --brassG:linear-gradient(135deg,#E6CB80 0,#CDA84F 45%,#A98532 100%);
  --disp:'Big Shoulders Display','Arial Narrow',Impact,sans-serif;--body:'Crimson Pro',Georgia,'Times New Roman',serif;
  --u:1px;--ov:200px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--proof);color:var(--ink);font:400 18px/1.5 var(--body);overflow-wrap:break-word}
img{max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.skip{position:absolute;left:8px;top:-60px;background:var(--proof);padding:8px 14px;z-index:99;border:2px solid var(--blue)}
.skip:focus{top:8px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.shell{display:block}
.pane{min-width:0}
.in{width:100%;max-width:1128px;margin-inline:auto}

/* ---------- wood-type blocks ---------- */
.bks{display:inline-flex;flex-wrap:nowrap;--d:.1em;filter:drop-shadow(calc(var(--d)*.6) calc(var(--d)*.9) calc(var(--d)*1.6) rgba(0,0,0,.4));line-height:1;white-space:nowrap;vertical-align:top}
.bk{position:relative;display:block;padding:0 var(--d) var(--d) 0;font:900 1em/1 var(--disp);font-style:normal;text-transform:uppercase}
.bk b{position:relative;z-index:1;display:block;padding:.13em .12em .02em;border-radius:.03em;font-weight:900;line-height:.8;color:rgba(28,22,18,.93);
  background:url(/assets/img/face-grain.svg) 0 0/12em auto,linear-gradient(135deg,#F3E2C0 0,var(--tn) 45%,#CDAA78 100%)}
.bk.bl b{color:var(--blue)}
.bk.sp{width:.14em;padding:0}
.bk:not(.sp)::before,.bk:not(.sp)::after,.cb::before,.cb::after{content:'';position:absolute}
.bk:not(.sp)::before,.cb::before{left:calc(100% - var(--d));top:.02em;bottom:0;width:var(--d);background:var(--mapleSide);clip-path:polygon(0 0,100% var(--d),100% 100%,0 calc(100% - var(--d)))}
.bk:not(.sp)::after,.cb::after{left:.02em;top:calc(100% - var(--d));right:0;height:var(--d);background:var(--mapleShade);clip-path:polygon(0 0,calc(100% - var(--d)) 0,100% 100%,var(--d) 100%)}
.cb::before{top:0}.cb::after{left:0}
.cb{position:relative;display:inline-block;--d:12px;padding:0 var(--d) var(--d) 0;filter:drop-shadow(calc(var(--d)*.6) calc(var(--d)*.9) calc(var(--d)*1.6) rgba(0,0,0,.4));vertical-align:top}
.cb img{position:relative;z-index:1;display:block;width:var(--w,250px);height:auto;aspect-ratio:1;border-radius:3px;background:var(--maple)}
.setbox{display:block;container-type:inline-size}
.setbox .row{display:block}.setbox .row+.row{margin-top:.5cqw}
.hb1{font-size:15.26cqw;--d:.107em}.hb2{font-size:18.25cqw;--d:.107em}
.y-rail{font-size:30px;--d:4px}.y-ck{font-size:30px;--d:4px}.ab{font-size:52px;--d:6px}
.fset .fw{font-size:7.48cqw;--d:.1em}
.ht{position:absolute;right:0;top:0;width:var(--w);height:var(--h);max-width:100%;background:var(--ht) 0 0/100% 100% no-repeat;pointer-events:none;opacity:.9}

/* ---------- parts ---------- */
.pit{display:block;background:var(--floor);box-shadow:inset 0 3px 10px rgba(0,0,0,.6);padding:8px;border-radius:3px}
.pit img{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:2px;transition:transform .16s,box-shadow .16s}
.tg{display:inline-block;align-self:flex-start;background:var(--brass);color:var(--ink);padding:3px 10px;border-radius:2px;font:700 14px/1.4 var(--disp);letter-spacing:.1em;text-transform:uppercase}
.st{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin:5px;padding:9px 20px;border:2px solid var(--blue);outline:2px solid var(--blue);outline-offset:3px;border-radius:2px;background:transparent;color:var(--blue);font:800 19px/1.1 var(--disp);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transform:rotate(-1.5deg);transition:background .16s,color .16s}
.st.fill,.st:hover{background:var(--blue);color:var(--proof)}
.st.maple{background:var(--maple);color:var(--ink);border-color:var(--mapleLit);outline-color:var(--mapleLit)}
.st.maple:hover{background:var(--mapleLit);color:var(--ink)}
.st.sm{padding:6px 14px;font-size:16px}
.short{display:none}.full{display:inline}
.ln{color:var(--blue);font-weight:600;text-underline-offset:3px}
.cap{font:700 14px/1.2 var(--disp);letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.crumbs ol{display:flex;flex-wrap:wrap;gap:4px 10px;font:italic 400 16px/1.4 var(--body);color:var(--muted)}
.crumbs li+li::before{content:'›';margin-right:10px;color:var(--mapleShade)}
.crumbs a{text-underline-offset:3px}

/* ---------- rail / top post ---------- */
.rail{background:url(/assets/img/grain-post.svg) 0 0/1200px 120px,var(--walnut);color:var(--proof)}
.rail-in{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px}
.logo{display:block;line-height:0;text-decoration:none}
.rail ul{display:flex;gap:8px}
.lt{display:block;font:700 12px/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;color:var(--mapleLit);margin-right:auto}.lt br{display:none}
.logo{display:flex;align-items:center;gap:10px;margin-right:auto}
.lab{display:block;text-decoration:none;border:2px solid var(--brassDark);border-radius:2px;color:var(--brass);font:700 12px/1 var(--disp);letter-spacing:.08em;text-transform:uppercase}
.lab span{display:block;padding:6px 7px;text-align:center}
.lab[aria-current]{background:var(--mapleLit);color:var(--ink);border-color:var(--brass)}
.lab:hover{background:var(--walnut2);color:var(--mapleLit)}.lab[aria-current]:hover{background:var(--mapleLit);color:var(--ink)}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--proof)}
.hbg{position:absolute;inset:0 0 var(--ov) 0;background:url(/assets/img/grain-hero.svg) 0 0/1200px 168px,var(--walnut)}
.hin{position:relative;max-width:1256px;margin-inline:auto;padding:20px 20px 0}
.drawer{display:flex;flex-direction:column;gap:8px;padding:8px;background:url(/assets/img/grain-maple.svg) 0 0/1200px 156px,var(--maple);border-radius:4px;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.long{display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:14px 14px 20px;background:url(/assets/img/grain-floor.svg) 0 0/1200px 192px,var(--floor);box-shadow:inset 0 4px 14px rgba(0,0,0,.55);border-radius:2px}
.h1{width:100%;font-size:inherit}
.sf{font:400 18px/1.45 var(--body);color:var(--mapleLit);max-width:560px}
.tray{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:6px;background:var(--walnut2);border-radius:2px}
.pitl{display:block;padding:4px}
.pitl .pit{padding:6px}
.front{position:relative;z-index:2;margin:50px 0 0;padding:14px 14px 18px;display:grid;gap:14px;align-items:center;background:url(/assets/img/grain-front.svg) 0 0/1200px 108px,var(--front);border-radius:4px;box-shadow:0 14px 30px rgba(0,0,0,.4)}
.pull{display:none;width:150px;height:30px;margin:0 auto;background:var(--brassG);border-radius:15px;box-shadow:0 3px 6px rgba(0,0,0,.45),inset 0 -3px 0 rgba(0,0,0,.2)}
.holder{padding:7px;background:var(--brassG);border-radius:3px;border:1px solid var(--brassDark)}
.idx{background:var(--proof);border-radius:2px;padding:14px 18px 6px}
.idh{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 16px;margin-bottom:6px}
.idt{font:700 18px/1.2 var(--disp);letter-spacing:.06em}
.idn{font:italic 400 16px/1.3 var(--body);color:var(--muted)}
.idx ul{display:grid;grid-template-columns:1fr;gap:0 24px}
.idx li a{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);text-decoration:none}
.idx li b{font:600 19px/1.15 var(--body)}
.idx li i{font:italic 400 15px/1.3 var(--body);color:var(--muted);flex:none}
.idx li a:hover b{color:var(--blue)}

/* ---------- sections ---------- */
.sec{position:relative;padding:48px 20px}
.hdg{display:grid;gap:12px;margin-bottom:28px;max-width:760px}
.hdg h2{font:800 34px/1 var(--disp);letter-spacing:0}
.hdg p{font:italic 400 19px/1.45 var(--body);color:var(--muted)}
.sx{background:var(--proof)}
.xh{display:none}
.xt{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.xr{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;padding:14px 0;border-top:1px solid var(--line)}
.xr:first-of-type{border-top:0}
.xg{grid-column:1/-1}
.xg a{display:flex;align-items:center;gap:12px;text-decoration:none}
.xg img{width:44px;height:44px;border-radius:3px;flex:none}
.xg b{font:800 22px/1.1 var(--disp)}
.xg a:hover b{color:var(--blue)}
.xc{font-size:16px;line-height:1.35}
.xc::before{content:attr(data-k);display:block;font:700 12px/1.6 var(--disp);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.xc[data-k=Input]{grid-column:1/-1}
.sg{background:url(/assets/img/grain-maple.svg) 0 0/1200px 156px,var(--mapleLit)}
.gcs{display:grid;gap:14px}
.gc{position:relative;display:flex;gap:14px;padding:12px;background:var(--maple);border-radius:4px;transition:background .16s}
.gp{flex:none;width:104px;padding:5px}
.gt{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
.gt h3{font:800 22px/1.05 var(--disp)}
.gt h3 a{text-decoration:none}.gt h3 a::after{content:'';position:absolute;inset:0;z-index:1}
.ol{font:400 15px/1.35 var(--body)}
.ctl{display:none;font:italic 400 17px/1.35 var(--body);color:var(--muted)}
.gc .st{margin:2px 5px 5px 0;padding:6px 12px;font-size:15px}
.gc:hover,.gc:focus-within{background:var(--mapleLit)}
.gc:hover .st,.gc:focus-within .st{background:var(--blue);color:var(--proof)}
.gc:hover .gp img,.gc:focus-within .gp img{transform:translate(-8px,-11px);box-shadow:8px 8px 0 var(--mapleSide),8px 12px 0 var(--mapleShade),0 17px 24px rgba(0,0,0,.4)}
.sp{background:var(--proof)}
.spi{position:relative;display:grid;gap:24px}
.pcw{--w:250px;--d:10px}
.ptx{display:grid;gap:14px;justify-items:start}
.ptx h2{font:900 34px/1 var(--disp);text-transform:uppercase}
.pl{font:italic 400 20px/1.4 var(--body);color:var(--muted)}
.ptx p{max-width:640px}
.pts{width:100%;max-width:640px;font-weight:600}
.pts li{padding:10px 0;border-top:1px solid var(--line)}.pts li:last-child{border-bottom:1px solid var(--line)}

/* ---------- inner pages ---------- */
.top{position:relative;padding:36px 20px 40px;background:var(--proof);border-bottom:1px solid var(--line);overflow:clip}
.top .in{position:relative;display:grid;gap:14px;justify-items:start}
.top h1{font:900 44px/.98 var(--disp);text-transform:uppercase;letter-spacing:.005em}
.top .lead{font:italic 400 20px/1.4 var(--body);color:var(--muted);max-width:640px}
.ahead h1{font-weight:800;font-size:34px}.abk{margin:6px 0 4px}
.lg h1{font-size:46px}.upd{font:italic 400 17px/1.4 var(--body);color:var(--muted)}
.cab{background:url(/assets/img/grain-hero.svg) 0 0/1200px 168px,var(--walnut);padding:28px 14px}
.cabin{display:grid;gap:12px;max-width:1128px;margin-inline:auto}
.dr{background:url(/assets/img/grain-front.svg) 0 0/1200px 108px,var(--front);border-radius:4px;box-shadow:0 10px 24px rgba(0,0,0,.4)}
.dr summary{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:12px;list-style:none;cursor:pointer}
.dr summary::-webkit-details-marker{display:none}
.hc{display:flex;flex:1;align-items:center;gap:14px;padding:6px;background:var(--proof);border-radius:2px;border:2px solid var(--brass)}
.hp{width:76px;flex:none;padding:5px}
.hct b{display:block;font:800 24px/1.05 var(--disp);color:var(--ink)}
.hct i{font:italic 400 15px/1.3 var(--body);color:var(--ink)}
.pullb{align-self:center;display:inline-flex;align-items:center;gap:14px;font:700 15px/1 var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--maple)}
.pullb::before{content:'';width:100px;height:30px;border-radius:15px;background:var(--brassG);box-shadow:0 3px 6px rgba(0,0,0,.45),inset 0 -3px 0 rgba(0,0,0,.2)}
.dr[open] .po,.dr:not([open]) .pc{display:none}
.dr summary:hover .pullb{filter:brightness(1.08)}
.ins{display:grid;gap:12px;margin:0 12px 12px;padding:12px;background:url(/assets/img/grain-maple.svg) 0 0/1200px 156px,var(--maple);border-radius:3px}
.flr{display:flex;justify-content:center;padding:22px 12px;background:url(/assets/img/grain-floor.svg) 0 0/1200px 192px,var(--floor);box-shadow:inset 0 4px 14px rgba(0,0,0,.55);border-radius:2px}
.flr .cb{--w:200px;--d:10px}
.pnl{display:grid;gap:14px;justify-items:start;padding:20px;background:var(--proof);border-radius:3px}
.ps{font:400 18px/1.45 var(--body)}
.pnl dl{display:grid;width:100%}
.pnl dl div,.dlab dl div{display:grid;grid-template-columns:minmax(80px,130px) 1fr;gap:2px 12px;align-items:baseline;padding:9px 0;border-top:1px solid var(--line)}
dt{font:700 13px/1.4 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
dd{font-size:17px;line-height:1.4}
.gh{position:relative;padding:28px 20px 36px;background:var(--proof);border-bottom:1px solid var(--line);overflow:clip}
.ghi{position:relative;display:grid;gap:22px}
.gcw{--w:230px;--d:9px;padding-bottom:6px}
.gtx{display:grid;gap:14px;justify-items:start}
.gtx h1{font:900 44px/.96 var(--disp);text-transform:uppercase}
.sum{font:400 19px/1.45 var(--body);max-width:640px}
.meta{font:italic 400 16px/1.4 var(--body);color:var(--muted)}
.gbody{background:var(--proof)}
.gwrap{display:grid;gap:36px}
.gmain>section,.as,.ls{padding:26px 0;border-top:1px solid var(--line)}
.gmain>section:first-child,.as:first-child,.ls:first-child{border-top:0;padding-top:0}
.gs h2,.as h2,.ls h2{font:800 26px/1.05 var(--disp);text-transform:uppercase;margin-bottom:14px}
.gs h3{font:700 15px/1.3 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:16px 0 4px}
.tx,.as p,.ls p{font-size:19px;line-height:1.6}.tx+.tx,.as p+p{margin-top:12px}
.keys{display:grid}
.keys>div{display:grid;grid-template-columns:minmax(96px,150px) 1fr;gap:14px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.keys>div:first-child{border-top:0}
.keys dd{font-size:18px}
kbd{display:inline-block;padding:3px 12px;background:var(--maple);border-radius:4px;box-shadow:0 3px 0 var(--mapleSide),0 5px 0 var(--mapleShade);font:700 18px/1.3 var(--disp);letter-spacing:.04em;color:var(--ink);margin-bottom:5px}
.tips li{padding:11px 0;border-top:1px solid var(--line);font-size:18px;line-height:1.5}.tips li:first-child{border-top:0;padding-top:0}
.qa{padding:12px 0;border-top:1px solid var(--line)}.qa:first-of-type{border-top:0;padding-top:0}
.qa h3{font:800 20px/1.2 var(--disp);letter-spacing:.01em;text-transform:none;color:var(--ink);margin:0 0 4px}
.qa p{font-size:18px}
.side{display:grid;gap:20px;align-content:start}
.dlab{padding:7px;background:var(--brassG);border-radius:3px;border:1px solid var(--brassDark)}
.dli{padding:20px;background:var(--proof);border-radius:2px}
.dli h2,.wbx h2,.nb h2{font:800 22px/1.1 var(--disp);text-transform:uppercase;margin-bottom:8px}
.dli>p{margin-bottom:10px}.rs{margin:0 0 8px;padding-left:18px;list-style:disc}
.wbx{padding:20px;background:var(--mapleLit);border-radius:4px;display:grid;gap:8px;justify-items:start}
.wbx h2{margin:0}.wbx .qa{width:100%}
.nb ul{display:grid;gap:12px}
.nb a{display:flex;gap:12px;align-items:center;text-decoration:none}
.nb .pit{width:64px;flex:none;padding:4px}
.nb b{display:block;font:800 18px/1.1 var(--disp)}.nb i{font:italic 400 15px/1.3 var(--body);color:var(--muted)}
.nb a:hover b{color:var(--blue)}

/* ---------- footer ---------- */
.ft{background:url(/assets/img/grain-hero.svg) 0 0/1200px 168px,var(--walnut);color:var(--mapleLit);padding:44px 20px 24px}
.ftw{max-width:1128px;margin-inline:auto;display:grid;gap:28px}
.fcols{display:grid;gap:24px}
.f1{font:400 19px/1.45 var(--body);max-width:420px}.f2{font:italic 400 16px/1.4 var(--body);color:var(--maple);margin-top:8px;max-width:420px}
.fm{display:inline-block;margin-top:10px;color:var(--brass)}
.fcol ul{display:grid;gap:6px;margin-top:8px}
.fcol a,.fck{color:var(--mapleLit);text-underline-offset:3px}
.fck{background:none;border:0;padding:0;text-decoration:underline;font:inherit;text-underline-offset:3px}
.fb{font-size:15px;color:var(--maple)}
.fmark{overflow:hidden;padding-bottom:6px}

/* ---------- cookie ---------- */
.cookie{position:fixed;z-index:60;left:10px;right:10px;bottom:10px;max-width:500px;background:var(--proof);border:1px solid var(--line);border-radius:4px;box-shadow:0 16px 40px rgba(0,0,0,.4);overflow:hidden}
.cookie[hidden]{display:none}
.cookie::before{content:'';display:block;height:10px;background:var(--brassG)}
.cookie::after{content:'';position:absolute;right:0;top:10px;width:200px;height:150px;background:url(/assets/img/ht-200x150-7-85.svg) 0 0/100% 100% no-repeat;opacity:.5;pointer-events:none}
.ckin{position:relative;z-index:1;display:grid;gap:12px;padding:16px 18px 20px}
.cktop{display:flex;align-items:center;gap:12px}
.ckc{display:block;line-height:0}
.cookie h2{font:800 24px/1.05 var(--disp);text-transform:uppercase}
.cookie p{font-size:15px;line-height:1.45}
.ck-acts{display:grid;gap:10px}
.ck-acts .st{width:calc(100% - 10px)}
.ck-manage{display:grid;gap:8px;font-size:15px}
.ck-manage[hidden]{display:none}
.ck-manage label{display:flex;gap:8px;align-items:center}

/* ---------- 400+ ---------- */
@media(min-width:400px){.ck-acts{grid-template-columns:1fr 1fr}.cookie{left:auto;right:20px;bottom:20px;width:min(500px,calc(100% - 40px))}}
/* ---------- tablet ---------- */
@media(min-width:600px){
  .pull{display:block}.long{padding:22px 20px 28px;gap:22px}.drawer{gap:14px;padding:14px}
  .idx ul{grid-template-columns:repeat(3,1fr)}
  .tray{grid-template-columns:repeat(6,1fr)}
  .gcs{grid-template-columns:1fr 1fr}.gp{width:104px}
  .xr{grid-template-columns:repeat(4,1fr)}.xg{grid-column:1/-1}.xc[data-k=Input]{grid-column:auto}
  .fcols{grid-template-columns:2fr 1fr 1fr 1fr}
}
/* ---------- desktop ---------- */
@media(min-width:1024px){
  :root{--u:min(1px,calc(100vw/1368));--ov:calc(92*var(--u))}
  .shell{display:flex}
  .rail{width:calc(112*var(--u));flex:none;background:url(/assets/img/grain-rail.svg) 0 0/1200px 132px,var(--walnut);box-shadow:inset -3px 0 8px rgba(0,0,0,.5)}
  .rail-in{position:sticky;top:0;height:100vh;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:calc(40*var(--u));padding:calc(28*var(--u)) calc(10*var(--u))}
  .rail-in{padding:calc(28*var(--u)) calc(10*var(--u))}
  .logo{margin-right:0;align-self:center;display:grid;justify-items:center;gap:calc(14*var(--u));text-align:center}
  .lt br{display:inline}
  .lt{margin:0 auto;font:700 calc(14*var(--u))/1.15 var(--disp);letter-spacing:.1em;text-transform:uppercase;color:var(--mapleLit);width:min-content;margin:0 auto}
  .logo::after{content:'';display:block;width:calc(56*var(--u));height:1px;background:var(--brassDark)}.y-rail{font-size:calc(56*var(--u));--d:calc(7*var(--u))}
  .rail ul{flex-direction:column;gap:calc(12*var(--u))}
  .lab{font-size:calc(15*var(--u));padding:calc(3*var(--u))}.lab span{padding:calc(10*var(--u)) calc(4*var(--u))}
  .in{max-width:calc(1128*var(--u))}
  .hbg{inset:0 0 var(--ov) 0}
  .hin{max-width:calc(1256*var(--u));padding:calc(44*var(--u)) calc(64*var(--u)) 0}
  .drawer{flex-direction:row;gap:calc(14*var(--u));padding:calc(14*var(--u))}
  .long{flex:1;min-width:0;gap:calc(26*var(--u));padding:calc(34*var(--u)) calc(36*var(--u))}
  .hb1{font-size:15.81cqw;--d:.0909em}.hb2{font-size:18.79cqw;--d:.0909em}
  .sf{font-size:calc(21*var(--u));max-width:calc(560*var(--u))}
  .tray{width:calc(379*var(--u));flex:none;grid-template-columns:1fr 1fr;padding:calc(9*var(--u))}
  .pitl{padding:calc(10*var(--u))}.pitl .pit{padding:calc(10*var(--u))}
  .front{margin-top:calc(58*var(--u));min-height:calc(179*var(--u))}
  .front{grid-template-columns:calc(150*var(--u)) 1fr;gap:calc(28*var(--u));padding:calc(20*var(--u)) calc(26*var(--u))}
  .pull{width:calc(150*var(--u));height:calc(34*var(--u))}
  .idx{padding:calc(14*var(--u)) calc(22*var(--u)) calc(4*var(--u))}
  .idt{font-size:calc(20*var(--u))}
  .idx ul{grid-template-columns:repeat(3,1fr);column-gap:calc(28*var(--u))}
  .idx li b{font-size:calc(19*var(--u))}
  .sec{padding:calc(80*var(--u)) calc(64*var(--u))}
  .hdg{gap:calc(14*var(--u));margin-bottom:calc(36*var(--u));max-width:calc(760*var(--u))}
  .hdg h2{font-size:calc(56*var(--u))}.hdg p{font-size:calc(21*var(--u))}
  .xh,.xr{display:grid;grid-template-columns:290fr 110fr 190fr 248fr 210fr;gap:calc(20*var(--u));align-items:center}
  .xh{padding:calc(14*var(--u)) 0;font:700 15px/1.2 var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
  .xr{padding:calc(14*var(--u)) 0}
  .xg{grid-column:auto}.xg img{width:calc(56*var(--u));height:calc(56*var(--u))}.xg b{font-size:calc(24*var(--u))}
  .xc{font-size:calc(17*var(--u))}.xc::before{display:none}
  .gcs{gap:calc(24*var(--u))}
  .gc{gap:calc(22*var(--u));padding:calc(14*var(--u)) calc(22*var(--u)) calc(14*var(--u)) calc(14*var(--u))}
  .gp{width:calc(200*var(--u));padding:calc(10*var(--u))}
  .gt{gap:calc(10*var(--u))}.gt h3{font-size:calc(34*var(--u))}.ol{font-size:calc(19*var(--u))}
  .ctl{display:block;font-size:calc(17*var(--u))}
  .gc .st{padding:calc(9*var(--u)) calc(20*var(--u));font-size:calc(19*var(--u))}
  .gc:hover .gp img,.gc:focus-within .gp img{transform:translate(-16px,-22px);box-shadow:16px 16px 0 var(--mapleSide),16px 22px 0 var(--mapleShade),0 32px 32px rgba(0,0,0,.45)}
  .short{display:none}
  .spi{grid-template-columns:auto 1fr;gap:calc(56*var(--u));align-items:start}
  .pcw{--w:calc(420*var(--u));--d:calc(20*var(--u))}
  .ptx h2{font-size:calc(60*var(--u))}.pl{font-size:calc(22*var(--u))}
  .top{padding:calc(56*var(--u)) calc(64*var(--u)) calc(60*var(--u))}
  .top h1{font-size:calc(80*var(--u))}.top .lead{font-size:calc(22*var(--u))}
  .ahead h1{font-size:calc(48*var(--u))}.abk{margin:calc(8*var(--u)) 0}.ab{font-size:110px;--d:12px}
  .lg h1{font-size:calc(80*var(--u))}
  .cab{padding:calc(48*var(--u)) calc(64*var(--u))}
  .cabin{gap:calc(16*var(--u))}
  .dr summary{flex-direction:row;gap:calc(40*var(--u));justify-content:space-between;align-items:center;padding:calc(16*var(--u)) calc(24*var(--u))}
  .hp{width:calc(120*var(--u))}.hct b{font-size:calc(32*var(--u))}.hct i{font-size:calc(18*var(--u))}
  .hc{gap:calc(20*var(--u));padding:calc(10*var(--u)) calc(30*var(--u)) calc(10*var(--u)) calc(10*var(--u))}
  .ins{grid-template-columns:auto 1fr;gap:calc(12*var(--u));margin:0 calc(12*var(--u)) calc(12*var(--u));padding:calc(12*var(--u))}
  .top h1{max-width:calc(660*var(--u))}
  .flr{padding:calc(30*var(--u)) calc(34*var(--u))}.flr .cb{--w:calc(300*var(--u));--d:calc(14*var(--u))}
  .pnl{padding:calc(26*var(--u)) calc(30*var(--u))}
  .gh{padding:calc(56*var(--u)) calc(64*var(--u))}
  .ghi{grid-template-columns:auto 1fr;gap:calc(48*var(--u));align-items:center}
  .gcw{--w:calc(380*var(--u));--d:calc(18*var(--u))}
  .gtx h1{font-size:calc(92*var(--u))}.sum{font-size:calc(22*var(--u))}
  .gwrap{grid-template-columns:calc(700*var(--u)) 1fr;gap:calc(56*var(--u))}
  .gwrap.rev{grid-template-columns:calc(340*var(--u)) calc(700*var(--u))}
  .gs h2,.as h2,.ls h2{font-size:calc(36*var(--u))}
  .side{position:sticky;top:calc(24*var(--u))}
  .ft{padding:calc(64*var(--u)) calc(64*var(--u)) calc(28*var(--u))}
  .fset .fw{font-size:8.014cqw}
}
@media(min-width:1024px) and (max-width:1100px){.gs h2,.as h2,.ls h2{font-size:30px}}

/* ---------- motion ---------- */
@keyframes fall{from{transform:translateY(-16px);opacity:0}to{transform:none;opacity:1}}
@keyframes slide{from{transform:translateX(-5%);opacity:0}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:no-preference){
  .hero .bk{animation:fall .38s cubic-bezier(.3,.7,.4,1) both;animation-delay:calc(var(--i)*70ms)}
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:none}
  ::view-transition-new(root){animation:slide .3s steps(6,end) both}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

h1,h2,h3{text-transform:none!important}
.xh{border-bottom:1px solid var(--ink)}
.sx .ht{top:calc(110*var(--u));width:calc(358*var(--u))}
.gp{align-self:flex-start}.gc{box-shadow:0 6px 12px -6px rgba(60,35,10,.35)}
.sp .ht{left:0;right:auto;top:auto;bottom:0;width:calc(578*var(--u));max-width:100%;opacity:.95}
.pts li:first-child{border-top:2px solid var(--ink)}
.fb{border-top:1px solid var(--brassDark);padding-top:20px}
@media(min-width:1024px){.spi{gap:calc(94*var(--u))}.sp{padding-bottom:calc(120*var(--u))}.sp .ht{bottom:calc(60*var(--u))}}
.dlab{padding:0;background:none;border:3px solid var(--brass);border-radius:2px}
.dlab dl div{grid-template-columns:1fr}.dlab dl div:first-child{border-top:0}
.dlab .dli h2{font:700 20px/1.1 var(--disp);letter-spacing:.06em;text-transform:uppercase!important}
.gs h3+.tips li{font-style:italic}
@media(min-width:1024px){.gh~.gbody{position:relative;overflow:clip;padding-bottom:calc(120*var(--u))}.gh~.gbody::after{content:'';position:absolute;right:0;bottom:calc(30*var(--u));width:calc(420*var(--u));height:calc(360*var(--u));background:url(/assets/img/ht-420x360-9-20.svg) 0 0/100% 100% no-repeat;opacity:.3;pointer-events:none}}
/* social icons */
.socs{display:flex;align-items:center;gap:10px;margin-top:8px}
.socs a.sic{display:grid;place-items:center;width:34px;height:34px;border-radius:2px;background:var(--brassG);border:1px solid var(--brassDark);color:var(--walnut);text-decoration:none;transition:filter .18s,transform .18s}
.socs a.sic svg{display:block;width:16px;height:16px;fill:currentColor}
.socs a.sic:hover{filter:brightness(1.1);transform:translateY(-1px)}
.socs a.sic:focus-visible{outline:2px solid var(--mapleLit);outline-offset:3px}
