@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/hanken-grotesk-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/hanken-grotesk-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/hanken-grotesk-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/hanken-grotesk-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Hanken Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/hanken-grotesk-latin-700-normal.woff2) format('woff2')}

/* Medsport. Dusk track: soft atmospheric hero with floating glass instruments, then calm rounded panels. Shared by index.html (viden) and shop.html (køb). */
:root{
  color-scheme:light;
  --ink:#141A26;
  --dusk:#1C2438;
  --page:#F3F4F6;
  --card:#FFFFFF;
  --muted:#5D6472;
  --line:#E0E3E9;
  --orange:#E4572E;
  --orange-d:#C9441F;
  --on-dark:#F4F5F7;
  --on-dark-muted:#A3AABA;
  --f:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --r-xl:32px;--r-l:24px;--r-m:16px;--r-s:999px;
}
*{box-sizing:border-box}
html,body{margin:0}
[hidden]{display:none!important}
html{background:var(--page);scroll-behavior:smooth}
body{background:var(--page);color:var(--ink);font-family:var(--f);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin:0}
a{color:inherit}
img{display:block;max-width:100%}
a:focus-visible,button:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:8px}
.wrap{max-width:1280px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.num{font-variant-numeric:tabular-nums}

/* logo */
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.logo svg{width:34px;height:34px;flex:none}
.logo b{font-weight:600;font-size:1.22rem;letter-spacing:-.025em}

/* nav pill */
.nav{position:fixed;top:max(14px,env(safe-area-inset-top,0px));left:0;right:0;z-index:20;pointer-events:none}
.nav .in{pointer-events:auto;max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 8px 8px 16px;border-radius:var(--r-s);background:rgba(20,26,38,.42);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.14);color:var(--on-dark);transition:background .3s}
.nav.solid .in{background:rgba(20,26,38,.88)}
.nav-wrap{padding:0 max(16px,env(safe-area-inset-left,0px))}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav ul a{display:block;padding:9px 14px;border-radius:var(--r-s);text-decoration:none;font-size:.95rem;color:rgba(244,245,247,.82)}
.nav ul a:hover{background:rgba(255,255,255,.1);color:#fff}
@media (max-width:820px){.nav ul{display:none}}

/* buttons */
.btn{font-family:inherit;display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:var(--r-s);background:var(--orange);color:#fff;text-decoration:none;font-weight:600;font-size:.98rem;border:0;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--orange-d)}
.btn.sm{padding:10px 18px;font-size:.92rem}
.btn.glass{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn.glass:hover{background:rgba(255,255,255,.24)}

/* hero */
.hero-shell{padding-top:12px}
.hero{position:relative;border-radius:var(--r-xl);overflow:hidden;min-height:min(94vh,880px);color:var(--on-dark);background:var(--dusk);isolation:isolate}
.hero .bg{position:absolute;inset:0;z-index:-2}
.hero .bg img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(20,26,38,.55) 0%,rgba(20,26,38,.15) 55%,transparent 80%),
  linear-gradient(180deg,transparent 55%,rgba(20,26,38,.45) 100%)}
.hero-in{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,.85fr);gap:40px;align-items:end;min-height:inherit;padding:clamp(120px,16vh,170px) clamp(22px,4vw,64px) clamp(28px,4vw,56px)}
.hero h1{font-weight:300;font-size:clamp(2.6rem,4.9vw,4.9rem);line-height:1.02;letter-spacing:-.045em}
.hero h1 span{display:block}
@media (min-width:901px){.hero h1 span{white-space:nowrap}}
.hero .sub{margin-top:24px;max-width:44ch;font-size:clamp(1.05rem,1.4vw,1.2rem);color:rgba(244,245,247,.86)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.chips a{padding:9px 16px;border-radius:var(--r-s);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);text-decoration:none;font-size:.95rem}
.chips a:hover{background:rgba(255,255,255,.22)}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.part{position:absolute;top:clamp(92px,13vh,120px);right:clamp(22px,4vw,64px);font-size:.9rem;color:rgba(244,245,247,.75)}
.part a{color:#fff}

/* glass instruments */
.stack{display:grid;gap:14px;justify-items:end}
.glass{background:rgba(28,36,56,.42);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3);border-radius:var(--r-l);box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.reading{width:min(100%,400px);padding:20px 20px 16px}
.reading .top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:.88rem;color:var(--on-dark-muted)}
.reading .val{display:flex;align-items:baseline;gap:8px;margin-top:6px}
.reading .val b{font-weight:300;font-size:3.2rem;letter-spacing:-.04em;line-height:1}
.reading .val small{color:var(--on-dark-muted)}
.reading .badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--r-s);background:rgba(228,87,46,.2);color:#FFB49C;font-size:.82rem}
.reading .badge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--orange)}
.reading{width:min(100%,440px)}
.reading .src{font-size:.8rem}
.lts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.ltc{background:rgba(255,255,255,.08);border-radius:14px;padding:10px 12px;display:grid;gap:2px;justify-items:start}
.ltc b{font-weight:600;font-size:.74rem;padding:1px 8px;border-radius:999px;background:#fff;color:#1C2438;margin-bottom:4px}
.ltc.o b{background:#E4572E;color:#fff}
.ltc span{font-size:1.25rem;font-weight:400;letter-spacing:-.02em;line-height:1.1}
.ltc small{color:var(--on-dark-muted);font-size:.78rem}
.rwrap{position:relative;padding:22px 4px 40px 22px;margin-top:6px}
.ylab{position:absolute;left:0;top:0;font-size:.74rem;color:var(--on-dark-muted)}
.xlab{position:absolute;right:4px;bottom:0;font-size:.74rem;color:var(--on-dark-muted)}
.rplot{position:relative;height:150px}
.rplot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rplot .dom2{fill:rgba(255,255,255,.05)}
.rplot .dom3{fill:rgba(228,87,46,.16)}
.rplot .gl{stroke:rgba(255,255,255,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.rplot .ax{stroke:rgba(255,255,255,.3);stroke-width:1;vector-effect:non-scaling-stroke}
.rplot .g1,.rplot .g2{stroke-width:1.2;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.rplot .g1{stroke:rgba(255,255,255,.55)}.rplot .g2{stroke:#F08A64}
.rplot .rl{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;vector-effect:non-scaling-stroke}
.rplot .rd{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff;transform:translate(-50%,-50%)}
.rplot .lm{position:absolute;width:13px;height:13px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.3);transform:translate(-50%,-50%);z-index:2}
.rplot .lm.o{background:#E4572E;box-shadow:0 0 0 2px #fff,0 0 0 6px rgba(228,87,46,.35)}
.rplot .lml{position:absolute;transform:translate(calc(-100% - 10px),calc(-100% - 4px));font-size:.74rem;font-weight:600;color:#fff;z-index:2}
.rplot .lml.o{color:#FFC2AC}
.rplot .dl{position:absolute;top:4px;transform:translateX(-50%);font-size:.68rem;color:rgba(244,245,247,.6);white-space:nowrap}
.rplot .dl.o{color:#FFC2AC}
.rplot .yt{position:absolute;left:-22px;width:14px;text-align:right;transform:translateY(-50%);font-size:.7rem;color:var(--on-dark-muted);font-variant-numeric:tabular-nums}
.rplot .xt{position:absolute;top:calc(100% + 6px);transform:translateX(-50%);font-size:.7rem;color:var(--on-dark-muted);font-variant-numeric:tabular-nums}
.reading .axis{position:relative;display:flex;justify-content:space-between;font-size:.75rem;color:var(--on-dark-muted);margin-top:6px}
.mini{width:min(100%,320px);display:flex;align-items:center;gap:14px;padding:10px 16px 10px 10px;text-decoration:none}
.mini .ph{width:64px;height:64px;border-radius:14px;background:#fff;flex:none;overflow:hidden}
.mini .ph img{width:100%;height:100%;object-fit:cover;object-position:28% 55%;transform:scale(1.7)}
.mini b{display:block;font-weight:600}
.mini span{font-size:.88rem;color:var(--on-dark-muted)}
@media (max-width:900px){.hero-in{grid-template-columns:1fr;align-items:start}.stack{justify-items:stretch}.reading,.mini{width:100%}.part{display:none}}
@media (prefers-reduced-motion:no-preference){
  .stack > *{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
  .stack > *:nth-child(2){animation-delay:.15s}
  .rplot svg{animation:reveal 1.6s .35s cubic-bezier(.4,0,.2,1) both}
  @keyframes reveal{from{clip-path:inset(-10% 100% -10% 0)}to{clip-path:inset(-10% 0 -10% 0)}}
  .rplot .rd,.rplot .lm{animation:pop .4s 1.5s both}.rplot .lml{animation:fadein .4s 1.6s both}
  @keyframes fadein{from{opacity:0}to{opacity:1}}
  @keyframes pop{from{opacity:0;transform:translate(-50%,-50%) scale(.4)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
  @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  @keyframes draw{to{stroke-dashoffset:0}}
}

/* sections */
.sec{padding-block:clamp(36px,4.5vw,64px)}
main > .wrap:first-child + .sec{padding-top:clamp(56px,7vw,96px)}
h2{font-weight:400;font-size:clamp(2.1rem,4.6vw,3.9rem);line-height:1.04;letter-spacing:-.04em;text-wrap:balance}
.lede{font-size:clamp(1.15rem,1.7vw,1.4rem);line-height:1.4;letter-spacing:-.01em;color:var(--ink);text-wrap:pretty}
.body{color:var(--muted);max-width:56ch}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,96px);align-items:start}
.split > *{min-width:0}
.split .rcol{display:grid;gap:18px;padding-top:10px}
@media (max-width:860px){.split{grid-template-columns:1fr}}

.why{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:clamp(40px,6vw,72px)}
.why > div{background:var(--card);border-radius:var(--r-l);padding:26px 24px 28px;display:grid;gap:10px;align-content:start}
.why i{width:34px;height:34px;border-radius:50%;background:rgba(228,87,46,.12);display:grid;place-items:center}
.why i svg{width:18px;height:18px}
.why b{font-weight:600;font-size:1.12rem;letter-spacing:-.01em;line-height:1.25;margin-top:6px}
.why p{color:var(--muted);font-size:.96rem}
@media (max-width:980px){.why{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.why{grid-template-columns:1fr}}

/* products */
.prods{display:grid;gap:16px;margin-top:clamp(36px,5vw,56px)}
.prod{display:grid;grid-template-columns:1.1fr 1fr;background:var(--card);border-radius:var(--r-xl);overflow:hidden}
.prod > *{min-width:0}
.prod .img{background:#EEF0F3;min-height:380px;position:relative}
.prod .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.prod .img.contain{background:#fff}
.prod .img.contain img{object-fit:contain;padding:7%}
.prod .img.dark{background:#0F0E0D}
.prod .img.dark img{object-fit:contain}
.prod.flip .img{order:2}
.prod .info{padding:clamp(26px,4vw,52px);display:grid;gap:18px;align-content:center}
.prod .tag{justify-self:start;padding:5px 12px;border-radius:var(--r-s);background:var(--page);font-size:.85rem;color:var(--muted)}
.prod h3{font-weight:500;font-size:clamp(2rem,3.4vw,2.9rem);letter-spacing:-.04em;line-height:1}
.spec{margin:4px 0 0;border-top:1px solid var(--line)}
.spec div{display:grid;grid-template-columns:8.5em 1fr;gap:12px;padding-block:11px;border-bottom:1px solid var(--line);font-size:.97rem}
.spec dt{color:var(--muted)}
.spec dd{margin:0}
.buy{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:6px}
.buy .p small{display:block;color:var(--muted);font-size:.88rem}
.buy .p b{display:block;font-weight:500;font-size:clamp(1.9rem,3vw,2.4rem);letter-spacing:-.035em;line-height:1.1}
.buy .p span{display:block;color:var(--muted);font-size:.9rem;margin-top:2px}
@media (max-width:860px){.prod{grid-template-columns:1fr}.prod.flip .img{order:0}.prod .img{min-height:260px}}

/* prices */
.prices{background:var(--ink);color:var(--on-dark);border-radius:var(--r-xl);padding:clamp(40px,6vw,80px) clamp(22px,5vw,72px)}
.prices h2{color:var(--on-dark)}
.prices .lede{color:var(--on-dark-muted);margin-top:16px;max-width:40ch}
.prices .lede a{color:var(--on-dark)}
.ptables{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:44px}
.ptables > div{min-width:0;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--r-l);padding:24px 24px 18px}
.ptables h3{font-weight:500;font-size:1.3rem;letter-spacing:-.02em;margin-bottom:8px}
table{width:100%;border-collapse:collapse;color:inherit;font:inherit}
td,th{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08);text-align:left;vertical-align:top}
tr:last-child td{border-bottom:0}
th{font-size:.82rem;color:var(--on-dark-muted);font-weight:400}
td small{display:block;color:var(--on-dark-muted);font-size:.84rem}
.r{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;padding-left:14px}
td.r small{text-align:right}
.fine{color:var(--on-dark-muted);font-size:.86rem;margin-top:10px}
@media (max-width:900px){.ptables{grid-template-columns:1fr}}
@media (max-width:520px){.ptables > div{padding:18px 16px 12px}.ptables td{font-size:.92rem}.ptables td.r{font-size:.86rem}.r{padding-left:10px;white-space:normal}}

/* laktattest */
.curve{background:var(--card);border-radius:var(--r-xl);padding:clamp(22px,3vw,36px)}
.curve svg{display:block;width:100%;height:auto;overflow:visible}
.curve .cap{display:flex;justify-content:space-between;gap:12px;font-size:.88rem;color:var(--muted);margin-top:10px}
.zones{display:grid;gap:10px;margin-top:18px}
.zone{display:grid;grid-template-columns:6.5em 1fr;gap:14px;align-items:center;padding:12px 16px;border-radius:var(--r-m);background:var(--page)}
.zone .v{font-variant-numeric:tabular-nums;font-weight:500}
.zone b{font-weight:600}
.zone p{color:var(--muted);font-size:.92rem}
.zone.hi{background:rgba(228,87,46,.1)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:clamp(40px,6vw,64px);list-style:none;padding:0;counter-reset:s}
.steps li{background:var(--card);border-radius:var(--r-l);padding:24px;display:grid;gap:8px;align-content:start;counter-increment:s}
.steps li::before{content:counter(s);width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:600;font-size:.9rem;margin-bottom:8px}
.steps li:last-child::before{background:var(--orange)}
.steps b{font-weight:600;font-size:1.1rem}
.steps p{color:var(--muted);font-size:.95rem}
@media (max-width:980px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}

/* refs */
.refs{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:40px}
.refs span{border:1px solid var(--line);border-radius:var(--r-l);padding:22px;font-weight:500;font-size:1.12rem;letter-spacing:-.015em;line-height:1.25}
.study{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;margin-top:40px;padding-top:32px;border-top:1px solid var(--line)}
.study b{font-weight:300;font-size:clamp(3.2rem,7vw,5.4rem);line-height:1;color:var(--orange);letter-spacing:-.05em}
.study p{color:var(--muted);max-width:46ch}
@media (max-width:860px){.refs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.study{grid-template-columns:1fr;gap:10px}}

/* contact */
.contact{background:var(--orange);color:#fff;border-radius:var(--r-xl);padding:clamp(40px,6vw,80px) clamp(22px,5vw,72px);position:relative;overflow:hidden}
.contact::after{content:"";position:absolute;right:-10%;top:-40%;width:60%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.22),transparent 65%);pointer-events:none}
.contact h2{max-width:16ch}
.contact .lede{color:rgba(255,255,255,.9);margin-top:16px;max-width:44ch}
.lines{display:grid;margin-top:36px;border-top:1px solid rgba(255,255,255,.4)}
.line{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-block:18px;border-bottom:1px solid rgba(255,255,255,.4)}
.line a{font-weight:400;font-size:clamp(1.6rem,4.4vw,3.2rem);letter-spacing:-.04em;text-decoration:none;line-height:1.05;word-break:break-word}
.copy{font:inherit;font-size:.88rem;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.5);color:#fff;padding:8px 14px;border-radius:var(--r-s);cursor:pointer}
.copy:hover{background:rgba(255,255,255,.28)}
.who{margin-top:18px;color:rgba(255,255,255,.88)}

footer{padding-block:28px 44px;color:var(--muted);font-size:.92rem}
footer .in{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
footer .logo svg{width:26px;height:26px}
footer .logo b{font-size:1rem;color:var(--ink)}

/* chart: two tests, same runner */
.chart{margin:0;background:var(--card);border-radius:var(--r-xl);padding:clamp(20px,3vw,36px)}
.chart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.chart-head b{display:block;font-weight:600;font-size:1.15rem;letter-spacing:-.015em}
.chart-head span{color:var(--muted);font-size:.92rem}
.legend{display:flex;gap:16px}
.legend .k{display:inline-flex;align-items:center;gap:8px;font-size:.92rem;color:var(--ink)}
.legend .k::before{content:"";width:22px;height:3px;border-radius:2px;background:#A9AFBB}
.legend .k2::before{background:var(--orange)}
.plot-wrap{position:relative;padding:22px 0 26px 34px}
.plot{position:relative;aspect-ratio:16/9}
.plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.plot .g{stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke}
.plot .band{fill:rgba(228,87,46,.06)}
.plot .c1{fill:none;stroke:#A9AFBB;stroke-width:2.5;stroke-dasharray:1 6;stroke-linecap:round;vector-effect:non-scaling-stroke}
.plot .c2{fill:none;stroke:var(--orange);stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}
.plot .drop{stroke-width:1.2;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.plot .d1{stroke:#A9AFBB}.plot .d2{stroke:var(--orange)}
.plot .dot{position:absolute;width:9px;height:9px;border-radius:50%;background:#fff;border:2px solid var(--orange);transform:translate(-50%,-50%)}
.plot .th{position:absolute;width:15px;height:15px;border-radius:50%;transform:translate(-50%,-50%);border:3px solid #fff;box-shadow:0 0 0 1px var(--line)}
.plot .th1{background:#A9AFBB}.plot .th2{background:var(--orange)}
.plot .dot.m{border-color:#A9AFBB;width:7px;height:7px}
.plot .th1s,.plot .th2s{position:absolute;width:11px;height:11px;border-radius:50%;transform:translate(-50%,-50%);border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.plot .th1s{background:#A9AFBB}.plot .th2s{background:var(--orange)}
.plot .ltl{position:absolute;transform:translate(calc(-100% - 10px),calc(-100% - 2px));font-size:.78rem;font-weight:600;color:var(--ink)}
.plot .shift{position:absolute;transform:translate(-50%,calc(-100% - 16px));background:var(--ink);color:#fff;font-size:.82rem;font-weight:600;padding:5px 10px;border-radius:var(--r-s);white-space:nowrap;font-variant-numeric:tabular-nums}
.plot .zl{position:absolute;left:12px;transform:translateY(-50%);font-size:.8rem;color:var(--muted)}
.plot .yl{position:absolute;left:-34px;width:24px;text-align:right;transform:translateY(-50%);font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}
.plot .xl{position:absolute;top:calc(100% + 8px);transform:translateX(-50%);font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}
.plot .xv{position:absolute;top:calc(100% + 4px);transform:translateX(-50%);font-size:.78rem;font-weight:600;padding:2px 7px;border-radius:var(--r-s);font-variant-numeric:tabular-nums;z-index:1}
.plot .xv1{background:#E9EBEF;color:var(--ink)}.plot .xv2{background:var(--orange);color:#fff}
.unit-y{position:absolute;left:0;top:0;font-size:.8rem;color:var(--muted)}
.unit-x{position:absolute;right:0;bottom:0;font-size:.8rem;color:var(--muted)}
.chart-note{color:var(--muted);font-size:.92rem;margin-top:14px;max-width:62ch}
.plot .xl{white-space:nowrap}
.plot .xl.last{transform:translateX(-100%)}
@media (max-width:620px){.plot{aspect-ratio:4/3}.plot .zl{font-size:.72rem}.plot .xl,.plot .yl{font-size:.72rem}.plot .xv1{transform:translateX(calc(-100% + 4px))}.plot .xv2{transform:translateX(-4px)}.plot .x14,.plot .xl.last{display:none}}

/* knowledge */
.k-intro{max-width:760px}
.k-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:clamp(36px,5vw,56px)}
.k-grid > div{background:var(--card);border-radius:var(--r-l);padding:26px}
.k-grid b{display:block;font-weight:600;font-size:1.12rem;margin-bottom:8px;letter-spacing:-.01em}
.k-grid p{color:var(--muted);font-size:.96rem}
@media (max-width:900px){.k-grid{grid-template-columns:1fr}}
.chart-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;margin-top:clamp(36px,5vw,56px);align-items:stretch}
.zcard{background:var(--card);border-radius:var(--r-xl);padding:clamp(20px,3vw,32px);display:grid;gap:10px;align-content:start}
.zcard h3{font-weight:600;font-size:1.15rem;letter-spacing:-.015em;margin-bottom:4px}
@media (max-width:980px){.chart-row{grid-template-columns:1fr}}
.shopband{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:var(--ink);color:var(--on-dark);border-radius:var(--r-xl);padding:clamp(28px,4vw,48px) clamp(22px,5vw,64px)}
.shopband p{color:var(--on-dark-muted);margin-top:10px;max-width:52ch}
.shopband .cta{margin:0}
@media (max-width:760px){.shopband{grid-template-columns:1fr}}

/* shop page */
.shop-head{border-radius:var(--r-xl);background:var(--dusk);color:var(--on-dark);padding:clamp(120px,15vh,150px) clamp(22px,4vw,64px) clamp(36px,5vw,56px);position:relative;overflow:hidden;isolation:isolate}
.shop-head::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 90% at 90% 0%,rgba(228,87,46,.45),transparent 60%),radial-gradient(60% 80% at 0% 100%,rgba(255,255,255,.07),transparent 60%)}
.shop-head h1{font-weight:300;font-size:clamp(2.6rem,6vw,5rem);letter-spacing:-.045em;line-height:1}
.shop-head p{margin-top:16px;max-width:52ch;color:rgba(244,245,247,.84);font-size:1.1rem}
.shop-head .chips{margin-top:24px}
.nav ul a[aria-current]{background:rgba(255,255,255,.14);color:#fff}
.quote{display:grid;gap:14px;align-content:start}
.quote p{color:var(--on-dark-muted)}

/* inquiry form */
.form-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:clamp(24px,4vw,56px);margin-top:36px;position:relative;z-index:1}
.direct{display:grid;gap:4px;align-content:start}
.direct .line a{font-size:clamp(1.4rem,2.6vw,2.1rem)}
.direct .lines{margin-top:0}
form.inq{background:#fff;color:var(--ink);border-radius:var(--r-l);padding:clamp(20px,3vw,32px);display:grid;gap:16px}
.inq .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.inq label{display:grid;gap:6px;font-size:.9rem;font-weight:500}
.inq label span.opt{font-weight:400;color:var(--muted)}
.inq input[type=text],.inq input[type=email],.inq input[type=tel],.inq textarea,.inq input[type=number]{font:inherit;font-size:1rem;color:var(--ink);background:var(--page);border:1px solid transparent;border-radius:12px;padding:12px 14px;width:100%}
.inq textarea{min-height:96px;resize:vertical}
.inq input:focus,.inq textarea:focus{outline:none;border-color:var(--orange);background:#fff}
.inq fieldset{border:0;margin:0;padding:0;display:grid;gap:8px}
.inq legend{font-size:.9rem;font-weight:500;margin-bottom:8px;padding:0}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg label{display:inline-flex;align-items:center;gap:8px;font-weight:400;padding:9px 14px;border-radius:var(--r-s);background:var(--page);cursor:pointer}
.seg input{accent-color:var(--orange);margin:0}
.seg label:has(input:checked){background:rgba(228,87,46,.12);color:var(--ink)}
.qty{display:grid;gap:6px}
.qty div{display:grid;grid-template-columns:1fr 92px;gap:12px;align-items:center;padding:6px 6px 6px 14px;border-radius:12px;background:var(--page)}
.qty div span{font-size:.95rem}
.qty div small{display:block;color:var(--muted);font-size:.82rem}
.qty input[type=number]{background:#fff;text-align:center;padding:8px}
.consent{display:flex!important;grid-template-columns:none;align-items:flex-start;gap:10px!important;font-weight:400!important;color:var(--muted)}
.consent input{accent-color:var(--orange);margin-top:4px}
.consent a{color:var(--ink)}
.inq .send{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.inq .note{font-size:.85rem;color:var(--muted)}
.inq .ok{background:rgba(228,87,46,.1);border-radius:12px;padding:14px 16px}
@media (max-width:900px){.form-wrap{grid-template-columns:1fr}}
@media (max-width:520px){.inq .row{grid-template-columns:1fr}}

/* footer */
footer.site{padding-block:40px 48px;color:var(--muted);font-size:.92rem}
footer.site .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px;padding-top:28px;border-top:1px solid var(--line)}
footer.site h4{margin:0 0 10px;font-size:.92rem;font-weight:600;color:var(--ink)}
footer.site ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
footer.site a{color:var(--muted);text-decoration:none}
footer.site a:hover{color:var(--ink)}
footer.site address{font-style:normal;line-height:1.7}
footer.site .logo{margin-bottom:12px}
@media (max-width:760px){footer.site .cols{grid-template-columns:1fr}}

/* legal page */
.legal{max-width:760px;padding-top:clamp(110px,14vh,140px)}
.legal h1{font-weight:300;font-size:clamp(2.4rem,5vw,3.8rem);letter-spacing:-.045em;line-height:1.05}
.legal h2{font-size:1.35rem;font-weight:600;letter-spacing:-.015em;margin:36px 0 10px}
.legal p,.legal li{color:#3A4150}
.legal p+p{margin-top:12px}
.legal ul{padding-left:20px}
.legal .meta{color:var(--muted);margin-top:14px}
.navpage .nav .in{background:rgba(20,26,38,.88)}

/* interval chart */
.legend .kb::before{height:10px;width:16px;border-radius:3px;background:rgba(228,87,46,.18)}
.iplot .target{fill:rgba(228,87,46,.12)}
.iplot .axis{stroke:var(--ink);stroke-width:1;vector-effect:non-scaling-stroke}
.iplot .il{fill:none;stroke:var(--ink);stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.iplot .ip{position:absolute;width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--ink);transform:translate(-50%,-50%)}
.iplot .ip b{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);font-size:.82rem;font-weight:600;font-variant-numeric:tabular-nums}
.iplot .ip.over{background:var(--orange);border-color:#fff;box-shadow:0 0 0 1px var(--orange),0 0 0 6px rgba(228,87,46,.2)}
.iplot .ip.over b{color:var(--orange)}
.iplot .inote{position:absolute;transform:translate(14px,-50%);background:var(--ink);color:#fff;font-size:.78rem;font-weight:600;padding:5px 10px;border-radius:999px;white-space:nowrap}
.iplot .iy{position:absolute;left:-34px;width:24px;text-align:right;transform:translateY(-50%);font-size:.8rem;color:var(--muted)}
.iplot .ix{position:absolute;top:calc(100% + 8px);transform:translateX(-50%);font-size:.8rem;color:var(--muted)}
@media (max-width:620px){.iplot .inote{transform:translate(-100%,calc(-100% - 22px));left:auto}}
.ichart .plot-wrap{padding-bottom:48px}
.ichart .unit-x{left:34px;right:0;text-align:center}
.chart-row{align-items:start}
.iplot{aspect-ratio:5/2}
@media (max-width:620px){.iplot{aspect-ratio:4/3}}
.direct{align-self:start}

.contact .form-wrap{margin-top:0}
.contact .direct{gap:0}
.contact .direct .lede{margin:16px 0 32px}
