/* joya44.info — "Fit 44": shoe-fitting studio. Black shoebox lid, white end-labels, kraft box + tissue, eyelets & laces, outsole tread. */
:root{
 --tissue:#F2EEE6;--tissue-2:#E9E2D6;--paper:#FBFAF7;--white:#FFFFFF;
 --ink:#1B1A19;--ink-2:#34302C;--muted:#5E5850;--line:#D8CEBE;--line-2:#C4B7A3;
 --kraft:#C9A06E;--kraft-d:#8A6236;--kraft-l:#E4CDA9;
 --verm:#C23D17;--verm-d:#9A3012;--teal:#2D6C66;--gum:#B8702E;
 --f-disp:"Archivo Black","Baloo Da 2",system-ui,sans-serif;
 --f-bnd:"Baloo Da 2","Hind Siliguri",system-ui,sans-serif;
 --f-body:"Gantari","Hind Siliguri",system-ui,sans-serif;
 --f-mono:"Cousine","Hind Siliguri",ui-monospace,Menlo,monospace;
 --f-h:var(--f-disp);
 --gut:16px;--max:1240px;--r:6px;
 --primary:#1B1A19;--accent:#C23D17;--surface:#FFFFFF;--text:#1B1A19;--muted-c:#5E5850;
 color-scheme:light;
}
.lang-bn{--f-body:"Hind Siliguri","Gantari",system-ui,sans-serif;--f-h:var(--f-bnd)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:16px}
body{margin:0;background:var(--tissue);color:var(--ink);font:400 17px/1.65 var(--f-body);overflow-x:hidden;text-rendering:optimizeLegibility}
body.lang-bn{line-height:1.8}
img,svg{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--verm);outline-offset:3px;border-radius:2px}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
@media (min-width:700px){:root{--gut:28px}}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--ink);color:var(--white);padding:12px 16px;border-radius:4px;font-weight:700;text-decoration:none}
.skip:focus{top:12px}
h1,h2,h3{font-family:var(--f-h);color:var(--ink);font-weight:400;margin:0}
.lang-bn h1,.lang-bn h2,.lang-bn h3{font-weight:700;line-height:1.5}
code{font-family:var(--f-mono)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:999px;border:2px solid var(--ink);font:700 16px/1.2 var(--f-body);text-decoration:none;cursor:pointer;transition:background .18s,color .18s,border-color .18s,transform .18s;text-align:center}
.btn-go{background:var(--verm);border-color:var(--verm);color:var(--white)}
.btn-go:hover{background:var(--verm-d);border-color:var(--verm-d)}
.btn-line{background:transparent;color:var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--white)}
.btn-sm{min-height:44px;padding:8px 16px;font-size:15px}
.btn-lg{min-height:54px;padding:14px 26px;font-size:17px}
.btn:active{transform:translateY(1px)}

/* ---------- header: shoebox lid ---------- */
.lid{position:relative;z-index:20;background:var(--ink);color:var(--white)}
.lid::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:6px;background:linear-gradient(180deg,rgba(0,0,0,.22),transparent);pointer-events:none}
.lid-top{display:flex;align-items:center;gap:12px;min-height:72px;padding-top:10px;padding-bottom:10px}
.plate{display:inline-flex;align-items:stretch;background:var(--paper);color:var(--ink);text-decoration:none;border-radius:3px;box-shadow:0 0 0 1px rgba(255,255,255,.12);min-height:48px;margin-right:auto;min-width:0}
.plate-sz{display:grid;place-items:center;padding:0 10px;background:var(--verm);color:var(--white);font:400 22px/1 var(--f-disp);border-radius:3px 0 0 3px;letter-spacing:-.02em}
.plate-t{display:flex;flex-direction:column;justify-content:center;padding:4px 12px 4px 10px;min-width:0}
.plate-t b{font:400 18px/1.1 var(--f-disp);letter-spacing:-.01em;white-space:nowrap}
.plate-t small{font:400 12px/1.3 var(--f-mono);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lang-bn .plate-t small{font-family:var(--f-body);font-size:13px}
.lid-tools{display:flex;align-items:center;gap:10px}
.lid-tools .btn-go{display:none}
.lsw-wide{display:none}
.lsw{display:inline-flex;border:1px solid currentColor;border-radius:999px;padding:2px;gap:2px}
.lsw a{display:inline-flex;align-items:center;min-height:40px;padding:4px 14px;border-radius:999px;text-decoration:none;font:600 14px/1 var(--f-body);opacity:.85}
.lsw a[aria-current]{background:var(--paper);color:var(--ink);opacity:1}
.lsw a:hover{opacity:1}
.lone{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:4px 12px;border:1px solid rgba(255,255,255,.45);border-radius:999px;color:var(--white);text-decoration:none;font:600 14px/1 var(--f-body)}
.lace-btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;min-width:44px;padding:8px 12px;border:1px solid rgba(255,255,255,.45);border-radius:999px;background:transparent;color:var(--white);font:600 15px/1 var(--f-body);cursor:pointer}
.lb-ico{position:relative;width:22px;height:16px;display:block}
.lb-ico i{position:absolute;left:0;right:0;height:2px;background:currentColor;border-radius:2px;transition:transform .2s,opacity .2s}
.lb-ico i:nth-child(1){top:0}.lb-ico i:nth-child(2){top:7px}.lb-ico i:nth-child(3){top:14px}
.lb-ico::before,.lb-ico::after{content:"";position:absolute;top:-2px;width:5px;height:5px;border-radius:50%;box-shadow:0 0 0 1.5px var(--kraft);}
.lb-ico::before{left:-8px}.lb-ico::after{right:-8px}
.lid.is-open .lb-ico i:nth-child(1){transform:translateY(7px) rotate(35deg)}
.lid.is-open .lb-ico i:nth-child(2){opacity:0}
.lid.is-open .lb-ico i:nth-child(3){transform:translateY(-7px) rotate(-35deg)}
@media (max-width:419px){.lb-l{display:none}.plate-t small{display:none}}

/* eyelet strip nav */
.eyelets{display:none;background:var(--ink-2);border-top:1px dashed rgba(255,255,255,.18)}
.lid.is-open .eyelets{display:block}
.ey-in{padding-top:8px;padding-bottom:16px}
.eyelets ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.eyelets ul a{display:flex;align-items:center;gap:12px;min-height:50px;padding:8px 6px;color:var(--white);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.1);font:600 16px/1.35 var(--f-body)}
.eyelets ul a[aria-current]{color:var(--kraft-l)}
.ey{flex:none;width:14px;height:14px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 3px #8F8A83,inset 0 1px 2px rgba(0,0,0,.6)}
.eyelets a[aria-current] .ey,.eyelets a:hover .ey{box-shadow:0 0 0 3px var(--verm),inset 0 1px 2px rgba(0,0,0,.6)}
.nv-n{font:400 12px/1 var(--f-mono);opacity:.6;min-width:1.6em}
.nav-extra{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding-top:14px}
.nav-extra .lsw{color:var(--white)}
@media (min-width:980px){
 .lid-top{min-height:84px}
 .plate-sz{font-size:28px;padding:0 14px}
 .plate-t b{font-size:22px}
 .lace-btn,.lone{display:none}
 .lsw-wide{display:inline-flex}
 .lid-tools .btn-go{display:inline-flex}
 .eyelets{display:block}
 .ey-in{padding-top:0;padding-bottom:0;display:flex;align-items:center}
 .eyelets ul{display:flex;gap:4px;flex-wrap:wrap}
 .eyelets ul a{border:0;min-height:52px;padding:8px 14px 8px 4px;font-size:15px}
 .eyelets ul a:hover .nv-l{text-decoration:underline;text-underline-offset:4px}
 .nav-extra{display:none}
 .eyelets ul li+li{position:relative;padding-left:22px}
 .eyelets ul li+li::before{content:"";position:absolute;left:0;top:50%;width:18px;height:2px;background:repeating-linear-gradient(90deg,#8F8A83 0 4px,transparent 4px 7px)}
}

/* ---------- home hero: fitting bench ---------- */
.fit{padding:28px 0 8px;background:radial-gradient(120% 70% at 85% 0%,var(--tissue-2),transparent 60%)}
.fit-g{display:grid;gap:28px}
.kicker{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 14px;font:600 14px/1.4 var(--f-body);color:var(--muted)}
.stamp{display:inline-flex;align-items:center;padding:3px 9px;border:2px solid var(--verm);color:var(--verm);border-radius:3px;font:400 13px/1.2 var(--f-disp);letter-spacing:.04em;transform:rotate(-3deg)}
.fit h1{font-size:clamp(30px,6.4vw,58px);line-height:1.04;letter-spacing:-.02em;max-width:18ch}
.lang-bn .fit h1{font-size:clamp(27px,4.9vw,46px);line-height:1.42;letter-spacing:0;max-width:22ch}
.lead{margin-top:16px;font-size:18px;color:var(--ink-2);max-width:62ch}
.lead p{margin:0 0 .6em}
.acts{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 18px}
.stickers{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.stickers li{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;background:var(--paper);border:1px solid var(--line);border-radius:999px;font:600 14px/1.35 var(--f-body);color:var(--ink-2)}
.stickers li::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--teal);box-shadow:inset 0 0 0 3px var(--paper),0 0 0 1px var(--teal)}
.stickers li:first-child::before{background:var(--verm);box-shadow:inset 0 0 0 3px var(--paper),0 0 0 1px var(--verm)}

/* the open shoebox holding the slot */
.box{position:relative;min-width:0;scroll-margin-top:12px;container-type:inline-size}
.box-lid{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;background:var(--ink);color:var(--white);border-radius:var(--r) var(--r) 0 0}
.box-k{font:400 12px/1.2 var(--f-mono);color:var(--kraft-l);text-transform:uppercase;letter-spacing:.12em}
.lang-bn .box-k{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-size:13px}
.box-t{font:700 16px/1.3 var(--f-body)}
.box-lid .bar{margin-left:auto}
.bar{display:inline-block;width:64px;height:22px;flex:none;background:repeating-linear-gradient(90deg,currentColor 0 2px,transparent 2px 3px,currentColor 3px 4px,transparent 4px 7px,currentColor 7px 10px,transparent 10px 11px,currentColor 11px 12px,transparent 12px 15px);opacity:.9}
.box-in{position:relative;padding:12px;background:linear-gradient(180deg,rgba(0,0,0,.14),transparent 16px),var(--kraft);box-shadow:inset 0 0 0 1px var(--kraft-d),inset 0 -10px 22px rgba(80,50,20,.18)}
.box-in::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(90,60,25,.07) 0 1px,transparent 1px 5px)}
.tissue{position:absolute;width:62px;height:62px;background:linear-gradient(135deg,#FFFFFF,#EFEBE3);pointer-events:none;z-index:0;filter:drop-shadow(0 2px 2px rgba(60,40,20,.2))}
.t1{top:-1px;left:-1px;clip-path:polygon(0 0,100% 0,0 100%)}
.t2{bottom:-1px;right:-1px;clip-path:polygon(100% 0,100% 100%,0 100%)}
.box-game{position:relative;z-index:1;border-radius:4px;box-shadow:0 1px 0 var(--kraft-d),0 10px 24px -12px rgba(50,30,10,.55)}
.box-side{padding:14px 16px 16px;background:var(--paper);border:1px solid var(--line);border-top:0;border-radius:0 0 var(--r) var(--r)}
.bs-h{margin:0 0 8px;font:700 15px/1.3 var(--f-body)}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.steps li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.5;color:var(--ink-2)}
.lang-bn .steps li{line-height:1.7}
.st-n{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--white);font:400 13px/1 var(--f-disp)}
@container (min-width:560px){.steps{grid-template-columns:repeat(3,1fr);gap:14px}}

/* Brannock-style sizing scale */
.gauge{display:grid;gap:14px;margin:30px 0 8px;padding:16px 0 4px;border-top:2px solid var(--ink)}
.ruler{position:relative;height:74px;background:#E7E3DB;border-radius:4px;box-shadow:inset 0 0 0 1px var(--line-2),inset 0 3px 6px rgba(0,0,0,.08);overflow:hidden}
.heel{position:absolute;left:0;top:0;bottom:0;width:18px;background:linear-gradient(90deg,var(--ink),var(--ink-2))}
.ticks{position:absolute;left:22px;right:6px;top:0;bottom:0;display:grid;grid-template-columns:repeat(12,1fr);background:linear-gradient(90deg,var(--ink) 1px,transparent 1px) 0 0/calc(100%/24) 12px repeat-x,linear-gradient(90deg,var(--ink) 2px,transparent 2px) 0 0/calc(100%/12) 22px repeat-x}
.ticks span{display:grid;place-items:end start;padding:0 0 10px 3px;font:700 13px/1 var(--f-mono);color:var(--ink-2)}
.ticks span.on{color:var(--verm)}
.slide{position:absolute;top:24px;bottom:8px;left:22px;width:calc((100% - 28px) * 8 / 12 + 1px);background:linear-gradient(90deg,rgba(194,61,23,.0),rgba(194,61,23,.16));border-right:3px solid var(--verm);transform-origin:left center}
.slide::after{content:"";position:absolute;right:-9px;top:-10px;border:7px solid transparent;border-top:9px solid var(--verm)}
.gauge-cap{margin:0;font-size:15px;line-height:1.6;color:var(--ink-2);max-width:70ch}
.lang-bn .gauge-cap{line-height:1.75}
.gauge-cap b{font-family:var(--f-disp);font-weight:400;color:var(--verm);margin-right:6px}
.lang-bn .gauge-cap b{font-family:var(--f-bnd);font-weight:700}
@media (prefers-reduced-motion:no-preference){.slide{animation:slide-in 1.2s cubic-bezier(.2,.8,.2,1) .2s both}@keyframes slide-in{from{transform:scaleX(.35)}to{transform:scaleX(1)}}}
@media (max-width:420px){.ticks span{font-size:11px;padding-left:1px}}

@media (min-width:980px){
 .fit{padding:52px 0 12px}
 .fit-g{grid-template-columns:minmax(0,1fr) minmax(400px,500px);gap:48px;align-items:start}
 .gauge{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:center;gap:28px}
}
@media (min-width:1200px){.fit-g{grid-template-columns:minmax(0,1fr) 540px}}

/* ---------- inner page head: shoebox end-label ---------- */
.ph{padding:22px 0 26px;background:linear-gradient(180deg,var(--tissue-2),var(--tissue))}
.ph-g{display:grid;gap:22px}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-bottom:14px;font:500 15px/1.4 var(--f-body);color:var(--muted)}
.crumbs a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:4px}
.crumbs .sep{width:18px;height:2px;background:repeating-linear-gradient(90deg,var(--kraft-d) 0 3px,transparent 3px 6px)}
.ph h1{font-size:clamp(28px,5.2vw,50px);line-height:1.08;letter-spacing:-.02em;max-width:20ch}
.lang-bn .ph h1{font-size:clamp(26px,4.4vw,42px);line-height:1.45;letter-spacing:0}
.endlabel{background:var(--paper);border:1px solid var(--line-2);border-radius:3px;box-shadow:0 14px 30px -18px rgba(40,25,10,.45);overflow:hidden;align-self:start;max-width:440px}
.el-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 14px;background:var(--ink);color:var(--white)}
.el-top b{font:400 20px/1.1 var(--f-disp)}
.el-top span{font:400 12px/1.2 var(--f-mono);color:var(--kraft-l)}
.lang-bn .el-top span{font-family:var(--f-body);font-size:13px}
.el-f{display:grid;grid-template-columns:1fr auto auto;margin:0}
.el-f div{padding:8px 14px;border-right:1px solid var(--line);min-width:0}
.el-f div:last-child{border-right:0}
.el-f dt{font:400 11px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.lang-bn .el-f dt{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-size:12px}
.el-f dd{margin:2px 0 0;font:700 16px/1.3 var(--f-body);overflow-wrap:anywhere}
.el-f .el-sz dd{font:400 30px/1 var(--f-disp);color:var(--verm)}
.el-b{display:flex;align-items:center;gap:12px;padding:8px 14px;border-top:1px dashed var(--line-2);color:var(--ink)}
.el-b code{font-size:12px;color:var(--muted)}
@media (min-width:980px){
 .ph{padding:40px 0 44px}
 .ph-g{grid-template-columns:minmax(0,1fr) 360px;gap:56px;align-items:end}
}

/* ---------- document ---------- */
.doc{padding:26px 0 44px}
.doc-g{display:grid;gap:22px}
.art{min-width:0;max-width:760px;container-type:inline-size}
.prose{font-size:17px}
.prose p{margin:0 0 1em}
.prose h3{font-size:20px;line-height:1.3;margin:1.5em 0 .5em}
.lang-bn .prose h3{font-size:20px;line-height:1.55}
.prose ul,.prose ol{margin:0 0 1.1em;padding-left:1.3em}
.prose li{margin:.35em 0}
.prose ul li::marker{color:var(--verm)}
.prose ol li::marker{font-family:var(--f-mono);font-weight:700;color:var(--kraft-d)}
.prose strong{color:var(--ink)}
.prose a{color:var(--verm-d);text-underline-offset:3px}
.intro-rest{margin-bottom:12px}
.tbl{overflow-x:auto;margin:1.2em 0 1.4em;border:1px solid var(--line-2);border-radius:4px;background:var(--paper)}
.tbl table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5;min-width:480px}
.tbl th{background:var(--ink);color:var(--white);text-align:left;padding:10px 12px;font-weight:700}
.tbl td{padding:10px 12px;border-top:1px solid var(--line);vertical-align:top}
.tbl tr:nth-child(even) td{background:#F6F2EB}
@container (min-width:600px){.tbl table{min-width:0}}

.sec{position:relative;padding-top:34px;margin-top:34px}
.sec::before{content:"";position:absolute;left:0;right:0;top:0;height:14px;background:radial-gradient(circle at 7px 7px,var(--tissue) 0 3px,#8F8A83 3.5px 5.5px,transparent 6px) 0 0/30px 14px round no-repeat}
.sec::after{content:"";position:absolute;left:0;right:0;top:6px;height:2px;background:repeating-linear-gradient(90deg,var(--line-2) 0 6px,transparent 6px 10px);z-index:-1}
.sec-plain::before,.sec-plain::after{display:none}
.sec-k{display:flex;align-items:center;gap:10px;margin:0 0 8px;font:600 13px/1.3 var(--f-body);color:var(--muted)}
.sec-n{display:inline-grid;place-items:center;min-width:34px;height:26px;padding:0 6px;background:var(--ink);color:var(--white);border-radius:3px;font:400 14px/1 var(--f-disp)}
.sec h2,.faq h2{font-size:clamp(24px,3.6vw,34px);line-height:1.15;letter-spacing:-.01em;margin-bottom:14px;scroll-margin-top:16px}
.lang-bn .sec h2,.lang-bn .faq h2{font-size:clamp(23px,3.2vw,30px);line-height:1.5;letter-spacing:0}

/* laced TOC rail */
.lacing{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r)}
.lacing summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:10px 14px;cursor:pointer;list-style:none;font:700 15px/1.3 var(--f-body)}
.lacing summary::-webkit-details-marker{display:none}
.lacing summary::after{content:"";width:10px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-3px);transition:transform .2s}
.lacing[open] summary::after{transform:rotate(-135deg)}
.lc-c{margin-left:auto;font:400 12px/1 var(--f-mono);color:var(--muted)}
.lacing ol{position:relative;list-style:none;margin:0;padding:4px 10px 12px 10px;border-top:1px dashed var(--line-2)}
.lacing ol::before{content:"";position:absolute;left:16px;top:10px;bottom:22px;width:3px;background:repeating-linear-gradient(180deg,var(--verm) 0 10px,var(--verm-d) 10px 12px);border-radius:2px;opacity:.85}
.lacing li a{position:relative;display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:9px 4px;text-decoration:none;font-size:15px;line-height:1.4;color:var(--ink-2)}
.lang-bn .lacing li a{line-height:1.6}
.lacing .ey{margin-top:3px;background:var(--paper);box-shadow:0 0 0 3px var(--ink-2),inset 0 1px 2px rgba(0,0,0,.25);position:relative;z-index:1}
.lc-n{flex:none;font:700 12px/1.9 var(--f-mono);color:var(--muted)}
.lacing a:hover .lc-l,.lacing a[aria-current] .lc-l{color:var(--ink);text-decoration:underline;text-decoration-color:var(--verm);text-underline-offset:4px}
.lacing a[aria-current] .ey{background:var(--verm);box-shadow:0 0 0 3px var(--verm-d)}
@media (min-width:1100px){
 .doc{padding:44px 0 64px}
 .doc-g{grid-template-columns:280px minmax(0,1fr);gap:56px}
 .doc-g.no-rail{grid-template-columns:minmax(0,1fr)}
 .rail{position:sticky;top:18px;align-self:start;max-height:calc(100vh - 36px);overflow:auto}
 .lacing summary{cursor:default}
 .lacing summary::after{display:none}
}

/* hang-tag FAQ */
.faq{position:relative;padding-top:34px;margin-top:40px}
.faq::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ink)}
.tags{display:grid;gap:12px}
.tag{position:relative;background:var(--paper);border:1px solid var(--line-2);border-radius:4px 14px 14px 4px;box-shadow:0 8px 18px -14px rgba(40,25,10,.5)}
.tag summary{display:flex;align-items:flex-start;gap:12px;min-height:56px;padding:14px 14px 14px 12px;cursor:pointer;list-style:none;font:700 16px/1.45 var(--f-body)}
.lang-bn .tag summary{line-height:1.7}
.tag summary::-webkit-details-marker{display:none}
.tag-hole{flex:none;width:14px;height:14px;margin-top:5px;border-radius:50%;background:var(--tissue);box-shadow:inset 0 1px 2px rgba(0,0,0,.35),0 0 0 3px var(--kraft-l)}
.tag-n{flex:none;font:700 13px/1.9 var(--f-mono);color:var(--verm)}
.tag-q{flex:1;min-width:0}
.tag-x{flex:none;position:relative;width:26px;height:26px;margin-top:1px;border-radius:50%;border:2px solid var(--ink)}
.tag-x::before,.tag-x::after{content:"";position:absolute;left:5px;right:5px;top:10px;height:2px;background:var(--ink);transition:transform .2s}
.tag-x::after{transform:rotate(90deg)}
.tag[open] .tag-x::after{transform:rotate(0)}
.tag[open]{border-color:var(--ink)}
.tag-a{padding:0 18px 6px 50px;font-size:16px}
@media (max-width:480px){.tag-a{padding-left:16px}}

/* inner CTA: fitting stool */
.stool{display:grid;gap:14px;align-items:center;margin-top:44px;padding:18px;background:var(--kraft);border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--kraft-d)}
.stool-sz{display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:var(--ink);color:var(--white);font:400 24px/1 var(--f-disp)}
.stool-k{margin:0;font:700 13px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink)}
.lang-bn .stool-k{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-size:14px}
.stool-p{margin:4px 0 0;font-size:17px;line-height:1.55;color:var(--ink)}
.stool .btn-go{background:var(--ink);border-color:var(--ink)}
.stool .btn-go:hover{background:var(--verm-d);border-color:var(--verm-d)}
@container (min-width:620px){.stool{grid-template-columns:auto minmax(0,1fr) auto}}

/* ---------- related: shoebox stack ---------- */
.rel{padding:44px 0 56px;background:var(--tissue-2);border-top:1px solid var(--line)}
.rel-h{display:grid;gap:6px;margin-bottom:22px}
.rel-t{font-size:clamp(26px,4vw,38px);line-height:1.1}
.lang-bn .rel-t{line-height:1.5}
.rel-h p{margin:0;color:var(--muted);font-size:16px}
.rel-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.sbox{--bx:var(--ink);--bxc:var(--white);display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line-2);border-radius:4px;text-decoration:none;color:var(--ink);overflow:hidden;transition:transform .2s,box-shadow .2s;box-shadow:0 10px 0 -6px var(--bx),0 14px 22px -16px rgba(40,25,10,.5)}
.sbox.v1{--bx:var(--kraft);--bxc:var(--ink)}
.sbox.v2{--bx:var(--verm);--bxc:var(--white)}
.sbox.v3{--bx:var(--teal);--bxc:var(--white)}
.sb-end{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;background:var(--bx);color:var(--bxc)}
.sb-no{font:400 12px/1.2 var(--f-mono);letter-spacing:.06em}
.lang-bn .sb-no{font-family:var(--f-body);letter-spacing:0;font-size:13px}
.sb-sz{font:400 20px/1 var(--f-disp)}
.sb-b{display:grid;gap:6px;padding:14px 14px 18px}
.sb-b strong{font:700 18px/1.3 var(--f-body)}
.sb-d{font-size:15px;line-height:1.55;color:var(--muted)}
.lang-bn .sb-d{line-height:1.7}
.sbox:hover{transform:translateY(-3px);box-shadow:0 13px 0 -6px var(--bx),0 20px 26px -16px rgba(40,25,10,.55)}
.sbox:hover strong{text-decoration:underline;text-underline-offset:4px}

/* ---------- footer: outsole ---------- */
.sole{background:var(--ink);color:#E9E4DC;padding-bottom:26px}
.tread{height:30px;background:linear-gradient(135deg,#2E2B28 25%,transparent 25%) -12px 0/24px 24px,linear-gradient(225deg,#2E2B28 25%,transparent 25%) -12px 0/24px 24px,linear-gradient(315deg,#2E2B28 25%,transparent 25%) 0 0/24px 24px,linear-gradient(45deg,#2E2B28 25%,transparent 25%) 0 0/24px 24px,#24211F;border-bottom:1px solid #3A3632}
.sole-g{display:grid;gap:28px;padding:34px 0 26px}
.sole-b p{margin:16px 0 0;font-size:15px;line-height:1.65;color:#CFC8BD;max-width:48ch}
.lang-bn .sole-b p{line-height:1.8}
.sole .plate{margin:0}
.sole-h{font:700 13px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.12em;color:var(--kraft-l);margin:0 0 10px}
.lang-bn .sole-h{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-size:15px}
.sole-l{list-style:none;margin:0 0 16px;padding:0}
.sole-l a{display:flex;align-items:center;gap:10px;min-height:44px;color:#F2EEE6;text-decoration:none;font-size:16px;line-height:1.35}
.sole-l a:hover{text-decoration:underline;text-underline-offset:4px}
.sole .lsw{color:#F2EEE6}
.sole-btm{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding-top:18px;border-top:1px dashed #4A4540;font:400 13px/1.4 var(--f-mono);color:#BDB5A9}
.age{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;border:2px solid var(--verm);color:#FFFFFF;background:var(--verm);font:400 15px/1 var(--f-disp)}
.sole-disc{margin:26px 0 16px;color:#CFC8BD;font-size:15px}
@media (min-width:760px){.sole-g{grid-template-columns:1.4fr 1fr 1fr;gap:40px}}

/* ---------- 404 ---------- */
.nf{padding:60px 0 80px}
.nf .wrap{display:grid;gap:14px;justify-items:start}
.nf-box{display:grid;place-items:center;width:84px;height:84px;background:var(--kraft);border-radius:4px;font:400 40px/1 var(--f-disp);color:var(--ink);box-shadow:inset 0 0 0 1px var(--kraft-d)}
.nf h1{font-size:clamp(30px,6vw,52px)}
.nf p{margin:0;max-width:52ch}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}