/* GENERATED by the homepage-preview build from the reference desktop design (atominc-homepage.html) — do not hand-edit; see home-previews/README.md */

/* Layout: one pinned scene per leg of the journey, caption left and illustration right; a fixed tracker bar follows the shipment. */
.hv-d{
  /* light ground taken from the logo slide: lilac-white with a faint dot grid and a pink bloom; ink is the logo navy */
  --night:#FCFAFE; --night-deep:#FFFFFF; --panel:#F1ECF8; --line:rgba(28,3,61,.10); --line-strong:rgba(28,3,61,.18);
  --fg:#1C033D; --muted:#5E5180; --dim:#6F6590;
  --orange:#FF911B; --pink:#F82D74; --magenta:#E63975; --purple:#A24AFF; --mint:#147A37; --dg-text:#C81E28; --teal:#1F9C83; --dg:#E3262F;
  --grey:#6E6880; --grey-strong:#7C768C;
  --wash-a:rgba(248,45,116,.10); --wash-b:rgba(162,74,255,.07);
  --kraft:#C99560; --kraft-dark:#8C6239; --paper:#F4F1FA; --ink:#1C1240;
  --font-display:"Inter Tight","Helvetica Neue",Arial,sans-serif;
  --font-body:"Inter","Helvetica Neue",Arial,sans-serif;
  --font-data:"JetBrains Mono",ui-monospace,Menlo,monospace;
  --ease-out:cubic-bezier(.22,1,.36,1); --ease-in:cubic-bezier(.55,0,1,.45);
  --nav-h:64px; --hud-h:68px;
  color-scheme:light;
}
@property --wash-a{syntax:'<color>';inherits:true;initial-value:rgba(248,45,116,.10)}
@property --wash-b{syntax:'<color>';inherits:true;initial-value:rgba(162,74,255,.07)}
.hv-d *,.hv-d *::before,.hv-d *::after{box-sizing:border-box}
.hv-d .wash{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60vw 55vh at 100% 0%,var(--wash-a),transparent 72%),radial-gradient(55vw 50vh at 0% 100%,var(--wash-b),transparent 72%);
  transition:--wash-a 700ms cubic-bezier(.22,1,.36,1),--wash-b 700ms cubic-bezier(.22,1,.36,1)}
.hv-d{scroll-behavior:smooth}
.hv-d{margin:0;background:radial-gradient(rgba(28,3,61,.06) 1px,transparent 1.3px) 0 0/22px 22px,var(--night);color:var(--fg);font-family:var(--font-body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
.hv-d a{color:inherit}
.hv-d :focus-visible{outline:2px solid var(--fg);outline-offset:3px;border-radius:6px}
.hv-d .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hv-d .num{font-family:var(--font-data);font-variant-numeric:tabular-nums}
.hv-d .wm{font-family:var(--font-display);font-weight:800;letter-spacing:-.045em;line-height:1;white-space:nowrap}
.hv-d .wm .i{color:var(--orange)} .hv-d .wm .n{color:var(--pink)} .hv-d .wm .c{color:var(--purple)}

.hv-d .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;font:600 15px/1 var(--font-display);text-decoration:none;cursor:pointer;border:1px solid transparent;
  transition:background-color 150ms var(--ease-out),border-color 150ms var(--ease-out),transform 120ms var(--ease-out)}
.hv-d .btn:active{transform:scale(.97)}
.hv-d .btn-primary{background:var(--fg);color:#FFFFFF} .hv-d .btn-primary:hover{background:#34115F}
.hv-d .btn-ghost{color:var(--fg);border-color:var(--line-strong)} .hv-d .btn-ghost:hover{border-color:rgba(28,3,61,.45)}

/* nav */
.hv-d .nav{position:fixed;inset:0 0 auto 0;z-index:50;padding-top:env(safe-area-inset-top,0px);transition:background-color 240ms var(--ease-out);border-bottom:1px solid transparent}
.hv-d .nav.scrolled{background:rgba(252,250,254,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom-color:var(--line)}
.hv-d .nav-inner{height:var(--nav-h);max-width:1240px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between}
.hv-d .nav .wm{font-size:24px;text-decoration:none}
.hv-d .nav .btn{min-height:40px;padding:0 16px;font-size:14px}

/* hero */
.hv-d .hero{padding:calc(var(--nav-h) + 72px) 20px 72px;max-width:1240px;margin:0 auto}
.hv-d .hv-eyebrow{display:inline-block;font:500 clamp(.95rem,1.4vw,1.1rem)/1.3 var(--font-body);letter-spacing:0;color:var(--grey);margin:0 0 20px}
.hv-d .hero h1{font-family:var(--font-display);font-weight:700;font-size:clamp(2.3rem,5vw,4.6rem);line-height:.94;letter-spacing:-.05em;margin:0 0 24px;text-wrap:balance}
.hv-d .hero h1 span{display:block}
.hv-d .hero h1 .l2{color:var(--grey-strong)}
.hv-d .hero .lead{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--muted);max-width:46ch;margin:0 0 40px}
.hv-d .picker-label{font-size:13px;color:var(--muted);margin:0 0 12px}
.hv-d .picker{display:flex;flex-wrap:wrap;gap:10px}
.hv-d .pick{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 18px 0 8px;border-radius:999px;border:1px solid var(--line-strong);background:transparent;color:var(--fg);font:600 15px/1 var(--font-display);cursor:pointer;
  transition:background-color 150ms var(--ease-out),border-color 150ms var(--ease-out),color 150ms var(--ease-out)}
.hv-d .pick:hover{border-color:rgba(28,3,61,.45)}
.hv-d .pick svg{width:36px;height:36px;border-radius:50%;background:var(--panel);padding:4px}
.hv-d .pick[aria-pressed="true"]{background:var(--fg);color:#FFFFFF;border-color:var(--fg)}
.hv-d .dg-badge{font:600 10.5px/1 var(--font-body);color:#fff;background:var(--dg);padding:4px 7px;border-radius:999px;margin-left:2px}
.hv-d .pick[aria-pressed="true"] svg{background:#E7E1F7}
.hv-d .scroll-cue{margin:48px 0 0;font-size:13px;color:var(--dim);display:flex;align-items:center;gap:10px}
.hv-d .scroll-cue i{display:inline-block;width:1px;height:28px;background:var(--line-strong)}

/* scenes */
.hv-d .scene{position:relative}
.hv-d .sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.hv-d .scene-inner{height:100%;max-width:1240px;margin:0 auto;padding:calc(var(--nav-h) + 12px + env(safe-area-inset-top,0px)) 20px calc(var(--hud-h) + 16px + env(safe-area-inset-bottom,0px));
  display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:40px;align-items:center}
.hv-d .cap .step{display:inline-block;font:500 14px/1.3 var(--font-body);color:var(--grey);margin:0 0 14px}
.hv-d .cap h2{font-family:var(--font-display);font-weight:700;font-size:clamp(1.9rem,3.6vw,3.2rem);line-height:1;letter-spacing:-.04em;margin:0 0 16px;text-wrap:balance}
.hv-d .cap p{margin:0;color:var(--muted);max-width:36ch;font-size:16px}
.hv-d .cap .chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:20px 0 0;padding:0}
.hv-d .cap .chips li{font-size:13px;font-weight:500;padding:6px 12px;border-radius:999px;border:1px solid var(--line-strong)}
.hv-d .art{position:relative;width:100%;max-width:calc((100svh - var(--nav-h) - var(--hud-h) - 60px) * 1000 / 600);aspect-ratio:1000/600;margin:0 auto}
.hv-d .art svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hv-d .art svg text{font-family:var(--font-body)}
.hv-d .art .mono{font-family:var(--font-data)}
.hv-d .burst-pt{position:absolute;width:1px;height:1px}
.hv-d #s-factory{height:270vh}
.hv-d #s-export{height:240vh}
.hv-d #s-sea{height:290vh}
.hv-d #s-customs{height:230vh}
.hv-d #s-fulfil{height:230vh}
.hv-d #s-sell{height:270vh}
.hv-d #s-door{height:210vh}
.hv-d #s-paid{height:230vh}

.hv-d .pref{display:inline-flex;padding:3px;border:1px solid var(--line-strong);border-radius:999px;gap:2px;margin-top:22px;flex-wrap:wrap}
.hv-d .pref button{min-height:44px;padding:0 16px;border-radius:999px;border:0;background:transparent;color:var(--muted);font:600 14px/1 var(--font-display);cursor:pointer;transition:background-color 150ms var(--ease-out),color 150ms var(--ease-out)}
.hv-d .pref button:hover{color:var(--fg)}
.hv-d .pref button[aria-pressed="true"]{background:var(--fg);color:#FFFFFF}
.hv-d .hv-split{display:flex;height:6px;border-radius:6px;overflow:hidden;margin:16px 0 12px;background:var(--line);max-width:340px}
.hv-d .dg-note{margin:12px 0 0;font-size:13px;color:var(--dg-text);max-width:40ch}
.hv-d .hv-split span{display:block;height:100%;transition:width 240ms var(--ease-out)}
.hv-d .hv-split .air{background:var(--orange)} .hv-d .hv-split .sea{background:var(--pink)}
.hv-d .pref-out{display:grid;grid-template-columns:repeat(3,auto);gap:4px 20px;margin:0;justify-content:start}
.hv-d .pref-out dt{font-size:11px;color:var(--dim)}
.hv-d .pref-out dd{margin:0;font:500 14px/1.3 var(--font-data);font-variant-numeric:tabular-nums}
/* tracker */
.hv-d .hud{position:fixed;left:0;right:0;bottom:0;z-index:40;padding-bottom:env(safe-area-inset-bottom,0px);background:rgba(255,255,255,.92);box-shadow:0 -8px 24px rgba(28,3,61,.05);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line);
  transform:translateY(100%);transition:transform 320ms var(--ease-out)}
.hv-d .hud[data-on="true"]{transform:none}
.hv-d .hud-inner{height:var(--hud-h);max-width:1240px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:28px}
.hv-d .stops{flex:1;min-width:0;position:relative;display:flex;justify-content:space-between;list-style:none;margin:0;padding:0}
.hv-d .stops::before,.hv-d .stops .fill{content:"";position:absolute;left:6px;right:6px;top:5px;height:2px;background:var(--line-strong)}
.hv-d .stops .fill{right:auto;width:0;background:var(--pink)}
.hv-d .stops li{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11.5px;color:var(--dim);transition:color 200ms var(--ease-out)}
.hv-d .stops li::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--night-deep);border:2px solid var(--line-strong);transition:background-color 200ms var(--ease-out),border-color 200ms var(--ease-out)}
.hv-d .stops li.done::before{background:var(--pink);border-color:var(--pink)}
.hv-d .stops li.on{color:var(--fg)}
.hv-d .stops li.on::before{background:var(--fg);border-color:var(--fg)}
.hv-d .readouts{display:flex;gap:22px;flex-shrink:0}
.hv-d .ro span{display:block;font-size:11px;color:var(--dim)}
.hv-d .ro b{display:block;font:500 15px/1.3 var(--font-data);font-variant-numeric:tabular-nums}
.hv-d .ro.prod b{font-family:var(--font-body);font-weight:600}
.hv-d .hud-now{display:none;font:600 14px/1.2 var(--font-display)}

@media (max-width:880px){
  .hv-d{--hud-h:60px}
  .hv-d .hero{padding-top:calc(var(--nav-h) + 40px);padding-bottom:48px}
  .hv-d .scene-inner{grid-template-columns:1fr;align-content:center;gap:20px}
  .hv-d .cap h2{font-size:clamp(1.6rem,7vw,2.2rem);margin-bottom:10px}
  .hv-d .cap p{font-size:15px}
  .hv-d .cap .chips{margin-top:12px}
  .hv-d .cap .chips li{font-size:12px;padding:5px 10px}
  .hv-d .art{max-width:100%}
  .hv-d #s-factory{height:240vh} .hv-d #s-export,.hv-d #s-fulfil{height:210vh} .hv-d #s-sea{height:260vh} .hv-d #s-customs,.hv-d #s-door{height:190vh} .hv-d #s-sell{height:240vh} .hv-d #s-paid{height:210vh}
  .hv-d .stops{display:none}
  .hv-d .hud-now{display:block;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hv-d .hud-inner{gap:16px}
  .hv-d .readouts{gap:16px}
  .hv-d #s-sea .cap p:not(.step){display:none}
  .hv-d .pref{margin-top:10px} .hv-d .pref button{padding:0 12px;font-size:13px} .hv-d .hv-split{margin:10px 0 8px}
}
@media (max-height:640px) and (max-width:880px){ .hv-d .cap p:not(.step){display:none} }

/* dangerous goods */
.hv-d .dg-panel{margin:28px 0 0;max-width:900px;border:1px solid rgba(227,38,47,.35);background:#FFF6F6;border-radius:18px;padding:20px 22px}
.hv-d .dg-head{display:flex;gap:14px;align-items:flex-start}
.hv-d .dg-head svg{width:40px;height:40px;flex-shrink:0}
.hv-d .dg-title{margin:0;font:700 17px/1.3 var(--font-display);color:var(--fg)}
.hv-d .dg-sub{margin:2px 0 0;font-size:14px;color:var(--muted)}
.hv-d .dg-steps{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;counter-reset:d}
.hv-d .dg-steps li{counter-increment:d;border-top:2px solid var(--dg);padding-top:10px;min-width:0}
.hv-d .dg-steps b{display:block;font:700 14px/1.2 var(--font-display)}
.hv-d .dg-steps b::before{content:counter(d) ". ";color:var(--dg)}
.hv-d .dg-steps span{display:block;font-size:12.5px;color:var(--muted);margin-top:4px}
.hv-d .cap .chips li.dg-chip{border-color:rgba(227,38,47,.5);color:var(--dg-text);background:#FFF6F6}
.hv-d .cap .chips li.logo-chip{display:inline-flex;align-items:center;gap:6px}
.hv-d .cap .chips li.logo-chip svg{width:18px;height:18px;flex:none}
@media (max-width:880px){ .hv-d .dg-steps{grid-template-columns:1fr 1fr} .hv-d .dg-steps li:last-child{grid-column:1/-1} }
/* country picker, report tab, dialog */
.hv-d .ctry .pick{padding-left:6px}
.hv-d .ctry .pick svg{width:30px;height:30px;padding:0;background:none;border-radius:50%}
.hv-d .ro.dest b{display:flex;align-items:center;gap:6px}
.hv-d .ro.dest svg{width:18px;height:18px}
.hv-d .report-tab{position:fixed;z-index:49;top:calc(env(safe-area-inset-top,0px) + var(--nav-h) + 8px);right:max(20px,calc((100vw - 1240px) / 2 + 20px));
  display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.94);border:1px solid var(--line-strong);
  color:var(--muted);font:500 13px/1 var(--font-body);text-decoration:none;box-shadow:0 6px 18px rgba(28,3,61,.06);
  opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity 240ms var(--ease-out),transform 240ms var(--ease-out),color 150ms var(--ease-out),border-color 150ms var(--ease-out)}
.hv-d .report-tab svg{width:15px;height:15px}
.hv-d .report-tab.show{opacity:1;transform:none;pointer-events:auto}
.hv-d .report-tab:hover{color:var(--fg);border-color:rgba(28,3,61,.4)}
.hv-d .report-dlg{border:0;border-radius:20px;padding:0;width:min(480px,calc(100vw - 32px));color:var(--fg);background:#FFFFFF;box-shadow:0 24px 60px rgba(28,3,61,.2)}
.hv-d .report-dlg::backdrop{background:rgba(28,3,61,.35)}
.hv-d .report-dlg form{display:flex;flex-direction:column;gap:6px;padding:24px}
.hv-d .rep-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.hv-d .rep-title{margin:0;font:700 20px/1.2 var(--font-display)}
.hv-d .rep-x{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);background:none;font-size:22px;cursor:pointer;color:var(--muted)}
.hv-d .rep-sub{margin:0 0 10px;color:var(--muted);font-size:14px}
.hv-d .report-dlg label{font-size:12px;color:var(--muted);margin-top:6px}
.hv-d .report-dlg input,.hv-d .report-dlg select{min-height:44px;border:1px solid var(--line-strong);border-radius:10px;padding:0 12px;font:15px var(--font-body);color:var(--fg);background:#FFFFFF;width:100%}
.hv-d .rep-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hv-d .report-dlg .btn{margin-top:14px}
.hv-d .rep-done{margin:10px 0 0;font-size:13px;color:var(--mint)}
/* close */
.hv-d .close{padding:140px 20px 120px;background:#1C033D;color:#FFFFFF;text-align:center}
.hv-d .close .btn-primary{background:#FFFFFF;color:#1C033D} .hv-d .close .btn-primary:hover{background:#EDE8FF}
.hv-d .close .btn-ghost{color:#FFFFFF;border-color:rgba(255,255,255,.3)}
.hv-d .close h2{font-family:var(--font-display);font-weight:700;font-size:clamp(2.4rem,6.6vw,5.6rem);line-height:.95;letter-spacing:-.05em;margin:0 auto 24px;max-width:16ch;text-wrap:balance}
.hv-d .close h2 .l2{color:rgba(255,255,255,.62)}
.hv-d .close p{color:rgba(255,255,255,.72);margin:0 auto 32px;max-width:44ch;font-size:clamp(1rem,1.5vw,1.15rem)}
.hv-d .close .ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.hv-d .close .note{margin:40px auto 0;font-size:12px;color:rgba(255,255,255,.5);max-width:60ch}
.hv-d footer{background:#1C033D;border-top:1px solid rgba(255,255,255,.1);padding:28px 20px 40px;text-align:center;color:rgba(255,255,255,.6);font-size:13px}
.hv-d footer .wm{color:#FFFFFF}
.hv-d footer .wm{font-size:20px;display:inline-block;margin-bottom:6px}

/* reduced motion: no pinning, each scene shows its finished frame */
.hv-d.rm .scene{height:auto !important}
.hv-d.rm .sticky{position:relative;height:auto}
.hv-d.rm .scene-inner{padding-block:72px}
.hv-d.rm .hud{display:none}
.hv-d.rm #s-sell{height:auto !important}
@media (prefers-reduced-motion: reduce){
  .hv-d *,.hv-d *::before,.hv-d *::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
  .hv-d{scroll-behavior:auto}
}

/* ---------- additions for the homepage ---------- */
.hv-d .skip{position:fixed;left:16px;top:-60px;z-index:100;background:var(--fg);color:#FFFFFF;padding:10px 16px;border-radius:999px;font:600 14px/1 var(--font-display);text-decoration:none;transition:top 150ms var(--ease-out)}
.hv-d .skip:focus{top:12px}
.hv-d [tabindex="-1"]:focus{outline:none}

/* nav */
.hv-d .nav-links{display:flex;align-items:center;gap:2px}
.hv-d .nav-links a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;font:500 14.5px/1 var(--font-body);color:var(--muted);text-decoration:none;transition:color 150ms var(--ease-out),background-color 150ms var(--ease-out)}
.hv-d .nav-links a:hover{color:var(--fg);background:rgba(28,3,61,.05)}
.hv-d .nav-right{display:flex;align-items:center;gap:8px}
.hv-d .nav.menu-open{background:rgba(252,250,254,.97);border-bottom-color:var(--line)}
.hv-d .menu-btn{display:none;width:44px;height:44px;border-radius:999px;border:1px solid var(--line-strong);background:transparent;cursor:pointer;position:relative;padding:0}
.hv-d .menu-btn span{position:absolute;left:13px;right:13px;height:1.5px;background:var(--fg);border-radius:2px;transition:transform 200ms var(--ease-out)}
.hv-d .menu-btn span:first-child{transform:translateY(-3.5px)}
.hv-d .menu-btn span:last-child{transform:translateY(3.5px)}
.hv-d .menu-btn[aria-expanded="true"] span:first-child{transform:rotate(45deg)}
.hv-d .menu-btn[aria-expanded="true"] span:last-child{transform:rotate(-45deg)}
.hv-d .mnav{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top,0px) + var(--nav-h));z-index:49;display:flex;flex-direction:column;padding:8px 20px 20px;background:rgba(252,250,254,.98);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(28,3,61,.08);
  opacity:0;transform:translateY(-4px);visibility:hidden;transition:opacity 150ms var(--ease-out),transform 150ms var(--ease-out),visibility 0s linear 150ms}
.hv-d .mnav.open{opacity:1;transform:none;visibility:visible;transition:opacity 220ms var(--ease-out),transform 220ms var(--ease-out),visibility 0s}
.hv-d .mnav a{display:flex;align-items:center;min-height:52px;font:600 17px/1.2 var(--font-display);color:var(--fg);text-decoration:none;border-bottom:1px solid var(--line)}
.hv-d .mnav a:last-child{border-bottom:0;color:var(--muted);font-weight:500;font-size:15px}
@media (max-width:980px){ .hv-d .nav-links{display:none} .hv-d .menu-btn{display:inline-block} }
@media (min-width:981px){ .hv-d .mnav{display:none} }

/* hero */
.hv-d .hero .lead{max-width:60ch;margin-bottom:0}
.hv-d .picker{gap:8px}
.hv-d .pick{min-height:48px;padding:0 16px 0 6px;font-size:14.5px}
.hv-d .pick svg{width:34px;height:34px}
@media (max-width:880px){
  .hv-d .pick{min-height:44px;padding:0 13px 0 5px;font-size:14px;gap:8px}
  .hv-d .pick svg{width:30px;height:30px}
  .hv-d .dg-badge{display:none}
  .hv-d .report-tab{display:none}
}

/* after the journey */
.hv-d #after{position:relative;background:linear-gradient(180deg,rgba(255,255,255,0) 0,#FFFFFF 160px)}
.hv-d .sec{max-width:1240px;margin:0 auto;padding:112px 20px 0;scroll-margin-top:var(--nav-h)}
.hv-d .sec:last-child{padding-bottom:128px}
.hv-d .sec-head{max-width:760px;margin:0 0 44px}
.hv-d .sec-head h2{font-family:var(--font-display);font-weight:700;font-size:clamp(2rem,4.4vw,3.5rem);line-height:1;letter-spacing:-.04em;margin:0 0 16px;text-wrap:balance}
.hv-d .sec-head p{margin:0;color:var(--muted);font-size:clamp(1rem,1.4vw,1.15rem);max-width:60ch}
.hv-d .sec-note{margin:24px 0 0;color:var(--muted);font-size:15px}
.hv-d .sec-note a{color:var(--fg);font-weight:600;text-underline-offset:3px}
.hv-d .status{display:inline-flex;align-items:center;gap:7px;font:600 12.5px/1 var(--font-body);padding:7px 11px;border-radius:999px;white-space:nowrap}
.hv-d .status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.hv-d .status.live{color:var(--mint);background:#EAF6EE}
.hv-d .status.reg{color:#8A4B00;background:#FFF1DF}

.hv-d .ch-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.hv-d .ch-card{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:24px;border-radius:20px;background:#FFFFFF;box-shadow:0 0 0 1px var(--line),0 10px 30px rgba(28,3,61,.04)}
.hv-d .ch-card h3{margin:4px 0 0;font:700 20px/1.2 var(--font-display);letter-spacing:-.02em}
.hv-d .ch-card p{margin:0;color:var(--muted);font-size:15px;flex:1}



.hv-d .days{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;counter-reset:d}
.hv-d .days li{counter-increment:d;position:relative;padding:28px 24px 26px;border-radius:20px;background:#FFFFFF;box-shadow:0 0 0 1px var(--line)}
.hv-d .days li::before{content:counter(d);display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--fg);color:#FFFFFF;font:600 14px/1 var(--font-display);margin-bottom:18px}
.hv-d .d-when{display:block;font:500 13px/1 var(--font-data);color:var(--dim);margin-bottom:8px}
.hv-d .days h3{margin:0 0 8px;font:700 22px/1.15 var(--font-display);letter-spacing:-.02em}
.hv-d .days p{margin:0;color:var(--muted);font-size:15.5px}

.hv-d .faq{max-width:860px;border-top:1px solid var(--line-strong)}
.hv-d .faq details{border-bottom:1px solid var(--line-strong)}
.hv-d .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font:600 clamp(1.05rem,1.6vw,1.2rem)/1.3 var(--font-display);letter-spacing:-.01em;color:var(--fg)}
.hv-d .faq summary::-webkit-details-marker{display:none}
.hv-d .faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-strong);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Cpath d='M9 12l5 5 5-5' fill='none' stroke='%231C033D' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/28px no-repeat;transition:transform 200ms var(--ease-out)}
.hv-d .faq details[open] summary::after{transform:rotate(180deg)}
.hv-d .faq summary:hover{color:#34115F}
.hv-d .faq details p{margin:0 0 22px;color:var(--muted);max-width:68ch;font-size:16px}
.hv-d .faq details[open] p{animation:hvd-faqIn 260ms var(--ease-out)}
@keyframes hvd-faqIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

@media (max-width:980px){ .hv-d .ch-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .hv-d .days{grid-template-columns:1fr} }
@media (max-width:880px){
  .hv-d .sec{padding-top:80px}
  .hv-d .sec:last-child{padding-bottom:96px}
  .hv-d .sec-head{margin-bottom:32px}
}
@media (max-width:600px){ .hv-d .ch-grid{grid-template-columns:1fr} }

/* close and footer */
.hv-d .close h2{max-width:22ch}
.hv-d .close h2 .l2{display:block}
.hv-d .close :focus-visible,.hv-d .foot :focus-visible{outline-color:#FFFFFF}
.hv-d .foot{text-align:left;background:#1C033D;color:rgba(255,255,255,.72);padding:64px 20px 36px;border-top:1px solid rgba(255,255,255,.1)}
.hv-d .foot-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:32px}
.hv-d .foot .wm{color:#FFFFFF;font-size:26px}
.hv-d .foot-brand p{margin:14px 0 14px;max-width:34ch;font-size:14.5px}
.hv-d .foot-mail{color:#FFFFFF;font-weight:600;font-size:14.5px;text-underline-offset:3px}
.hv-d .foot-col{display:flex;flex-direction:column;gap:2px}
.hv-d .foot-col p{margin:0 0 8px;font:600 13px/1 var(--font-body);color:rgba(255,255,255,.55)}
.hv-d .foot-col a{display:inline-flex;align-items:center;min-height:36px;color:rgba(255,255,255,.82);text-decoration:none;font-size:14.5px;transition:color 150ms var(--ease-out)}
.hv-d .foot-col a:hover{color:#FFFFFF}
.hv-d .foot-base{max-width:1240px;margin:44px auto 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;color:rgba(255,255,255,.6)}
@media (max-width:880px){ .hv-d .foot-inner{grid-template-columns:1fr 1fr} .hv-d .foot-brand{grid-column:1/-1} }
.hv-d .rep-done[data-state="err"]{color:var(--dg-text)}
.hv-d.rm .report-tab{display:none}

/* ---------- v2: hero journey intro ---------- */
.hv-d .hero{padding-bottom:24px}
.hv-d .j-intro{margin-top:72px;padding-top:36px;border-top:1px solid var(--line-strong);max-width:780px}
.hv-d .j-kicker{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 14px;font:500 13px/1 var(--font-data);color:var(--dim)}
.hv-d .j-kicker span+span::before{content:"·";margin-right:10px}
.hv-d .j-title{font-family:var(--font-display);font-weight:700;font-size:clamp(1.8rem,3.6vw,3rem);line-height:1.02;letter-spacing:-.035em;margin:0 0 14px;text-wrap:balance}
.hv-d .j-sub{margin:0;color:var(--muted);font-size:clamp(1rem,1.4vw,1.12rem);max-width:58ch}
.hv-d .j-intro .scroll-cue{margin-top:32px;font-size:14px;color:var(--muted)}
.hv-d .j-intro .scroll-cue i{height:32px;background:linear-gradient(var(--pink),transparent)}

/* ---------- v2: the four opening stops ---------- */
.hv-d #s-product{height:180vh} .hv-d #s-market{height:190vh} .hv-d #s-model{height:190vh} .hv-d #s-comp{height:220vh}
.hv-d .pick-scene .cap .pick-help{margin:0 0 22px}
.hv-d .picker.prod{max-width:460px}
.hv-d .pick .pick-t{white-space:nowrap}
.hv-d .art.art-x{aspect-ratio:auto;max-width:none}
.hv-d .art.art-x svg{position:static;inset:auto;width:auto;height:auto;overflow:visible}
.hv-d .spec-k{margin:0;font:500 11.5px/1.2 var(--font-data);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}

/* how you sell picker */
.hv-d .mpick{display:flex;flex-direction:column;gap:8px;max-width:420px}
.hv-d .mp{display:grid;grid-template-columns:26px minmax(0,1fr);column-gap:12px;align-items:center;width:100%;padding:12px 16px;border-radius:16px;border:1px solid var(--line-strong);background:rgba(255,255,255,.72);color:var(--fg);text-align:left;cursor:pointer;font:inherit;
  transition:background-color 150ms var(--ease-out),border-color 150ms var(--ease-out),color 150ms var(--ease-out),transform 120ms var(--ease-out)}
.hv-d .mp:hover{border-color:rgba(28,3,61,.45)}
.hv-d .mp:active{transform:scale(.99)}
.hv-d .mp-dot{grid-row:1/3;display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line-strong);background:#FFFFFF;color:var(--muted);font:600 12.5px/1 var(--font-display);transition:background-color 150ms var(--ease-out),border-color 150ms var(--ease-out),color 150ms var(--ease-out)}
.hv-d .mp-t{font:600 16px/1.2 var(--font-display)}
.hv-d .mp-s{grid-column:2;font-size:13px;color:var(--muted);margin-top:3px}
.hv-d .mp[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:#FFFFFF}
.hv-d .mp[aria-pressed="true"] .mp-s{color:rgba(255,255,255,.74)}
.hv-d .mp[aria-pressed="true"] .mp-dot{border-color:var(--pink);background:var(--pink);color:#FFFFFF}

/* 1 product stage */
.hv-d .pstage{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:28px;align-items:center;max-width:860px;margin:0 auto}
.hv-d .art.art-x .pstage-art{width:100%;height:auto;max-height:calc(100svh - var(--nav-h) - var(--hud-h) - 90px);display:block}
.hv-d #pg-pop{transform-box:fill-box;transform-origin:50% 100%}
.hv-d .spec{background:#FFFFFF;border-radius:20px;box-shadow:0 0 0 1px var(--line),0 18px 40px rgba(28,3,61,.06);padding:24px 26px 20px}
.hv-d .spec-name{margin:12px 0 4px;font:700 clamp(1.3rem,2vw,1.65rem)/1.1 var(--font-display);letter-spacing:-.02em}
.hv-d .spec-cat{margin:0 0 14px;color:var(--muted);font-size:14px}
.hv-d .spec-rows{margin:0;border-top:1px solid var(--line)}
.hv-d .spec-rows div{padding:11px 0;border-bottom:1px solid var(--line)}
.hv-d .spec-rows div:last-child{border-bottom:0;padding-bottom:0}
.hv-d .spec-rows dt{font-size:12.5px;color:var(--dim)}
.hv-d .spec-rows dd{margin:3px 0 0;font:600 16px/1.3 var(--font-body);color:var(--fg)}
.hv-d .spec-rows dd.mono{font-family:var(--font-data);font-weight:500}
.hv-d .spec-rows dd.spec-price{color:var(--mint);font-size:18px}
.hv-d #pg-ships.is-dg{color:var(--dg-text)}

/* 2 market */
.hv-d .mstage{display:flex;flex-direction:column;gap:14px;max-width:900px;margin:0 auto}
.hv-d .art.art-x .mstage-map{width:100%;height:auto;display:block}
.hv-d .m-dot{fill:#1C033D;r:6px;transition:fill 200ms var(--ease-out)}
.hv-d .m-ring{fill:none;stroke:var(--pink);stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.hv-d .m-pin.on .m-dot{fill:var(--pink)}
.hv-d .m-pin.on .m-ring{animation:hvd-mring 1.8s var(--ease-out) infinite}
@keyframes hvd-mring{0%{opacity:.85;transform:scale(.6)}100%{opacity:0;transform:scale(2.3)}}
.hv-d .m-lbl{font:600 15px var(--font-body);fill:#1C033D}
.hv-d .m-pin.on .m-lbl{font-weight:700}
.hv-d .mcard{background:#FFFFFF;border-radius:20px;box-shadow:0 0 0 1px var(--line),0 18px 40px rgba(28,3,61,.06);padding:18px 22px}
.hv-d .mcard-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hv-d .art.art-x .mcard-flag{width:44px;height:44px;border-radius:50%;flex:none}
.hv-d .mcard-name{margin:4px 0 0;font:700 22px/1.1 var(--font-display);letter-spacing:-.02em}
.hv-d .mcard-sell{margin-left:auto}
.hv-d .mcard-logos{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 0;padding:0}
.hv-d .mcard-logos li{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 5px;border-radius:999px;background:var(--paper);font-size:13px;font-weight:600}
.hv-d .art.art-x .mcard-logos svg{width:20px;height:20px}
.hv-d .mcard-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:14px 0 0;padding-top:12px;border-top:1px solid var(--line)}
.hv-d .mcard-stats dt{font-size:12.5px;color:var(--dim)}
.hv-d .mcard-stats dd{margin:3px 0 0;font-weight:600;font-size:15px;line-height:1.3}

/* 3 who is on the paperwork */
.hv-d .paper{background:#FFFFFF;border-radius:22px;box-shadow:0 0 0 1px var(--line),0 18px 40px rgba(28,3,61,.06);padding:24px 28px 0;overflow:hidden;max-width:720px;margin:0 auto}
.hv-d .paper-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.hv-d .art.art-x .paper-head svg{width:28px;height:28px;border-radius:50%}
.hv-d .paper-num{margin:12px 0 0;font:600 12.5px/1.2 var(--font-display);color:var(--pink)}
.hv-d .paper-title{margin:4px 0 4px;font:700 clamp(1.5rem,2.4vw,2rem)/1.05 var(--font-display);letter-spacing:-.03em}
.hv-d .paper-sub{margin:0 0 14px;color:var(--muted);font-size:15px;max-width:62ch}
.hv-d .paper-rows{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.hv-d .pw-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l who" "v who";column-gap:16px;padding:11px 0;border-bottom:1px solid var(--line)}
.hv-d .pw-row:last-child{border-bottom:0}
.hv-d .pw-l{grid-area:l;font-size:12.5px;color:var(--dim)}
.hv-d .pw-v{grid-area:v;font:600 16px/1.3 var(--font-body);margin-top:2px}
.hv-d .pw-who{grid-area:who;align-self:center;font:600 12.5px/1 var(--font-body);padding:7px 11px;border-radius:999px;white-space:nowrap}
.hv-d .pw-who[data-who="atom"]{background:#F1E8FF;color:#6B21C8}
.hv-d .pw-who[data-who="you"]{background:#FFE6EF;color:#B5164F}
.hv-d .pw-who[data-who="co"]{background:#FFF0DE;color:#8A4B00}
.hv-d .paper-foot{display:flex;gap:12px;align-items:flex-start;margin:4px -28px 0;padding:15px 28px 17px;background:#EAF6EE;color:#1D5A33;font-size:14.5px;line-height:1.45}
.hv-d .paper-foot b{color:#0F4D24}
.hv-d .tick{flex:none;width:20px;height:20px;margin-top:1px;border-radius:50%;background:var(--mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.2l2.6 2.6L13 6.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat}

/* 4 compliance */
.hv-d .comp-head{display:flex;gap:14px;align-items:flex-start}
.hv-d .comp-icon{flex:none}
.hv-d .comp-title{margin:0;font:700 17px/1.3 var(--font-display);color:var(--fg)}
.hv-d .comp-sub{margin:3px 0 0;font-size:14px;color:var(--muted);max-width:70ch}
.hv-d .art.art-x .comp-icon svg{width:40px;height:40px}
.hv-d .comp-card{background:#FFFFFF;border-radius:22px;box-shadow:0 0 0 1px var(--line),0 18px 40px rgba(28,3,61,.06);padding:22px 26px 18px;border-top:4px solid var(--tone);--tone:#A24AFF;max-width:780px;margin:0 auto}
.hv-d .comp-card[data-tone="dg"]{--tone:#E3262F}
.hv-d .comp-list{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.hv-d .comp-list li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--line);transition:opacity 200ms var(--ease-out)}
.hv-d .cl-n{flex:none;display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line-strong);font:600 12px/1 var(--font-display);color:var(--muted);transition:background-color 200ms var(--ease-out),border-color 200ms var(--ease-out),color 200ms var(--ease-out)}
.hv-d .comp-list li.done .cl-n{border-color:var(--mint);color:transparent;background:var(--mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.2l2.6 2.6L13 6.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/22px no-repeat}
.hv-d .cl-x b{display:block;font:700 14.5px/1.25 var(--font-display)}
.hv-d .cl-x>span{display:block;font-size:13px;color:var(--muted);margin-top:3px;line-height:1.4}
.hv-d .comp-foot{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:14px 0 0;padding:12px 16px;border-radius:14px;background:var(--paper)}
.hv-d .comp-foot dt{font-size:12px;color:var(--dim)}
.hv-d .comp-foot dd{margin:3px 0 0;font-weight:600;font-size:15px}
.hv-d .comp-more{margin:12px 0 0;font-size:13.5px;color:var(--muted)}
.hv-d .comp-more a{color:var(--fg);font-weight:600;text-underline-offset:3px}

/* ---------- v2: tracker with twelve stops ---------- */
.hv-d .readouts{gap:18px}
@media (max-width:1180px) and (min-width:881px){ .hv-d .stops li{font-size:0} .hv-d .stops li.on{font-size:11px;white-space:nowrap} }

/* ---------- v2: marketplaces and the three ways to sell ---------- */
.hv-d .ch-card{gap:10px}
.hv-d .ch-logo{width:44px;height:44px;flex:none}
.hv-d .ch-flags{list-style:none;margin:6px 0 0;padding:14px 0 0;border-top:1px solid var(--line);width:100%;display:flex;flex-wrap:wrap;gap:8px}
.hv-d .ch-flags li{display:inline-flex}
.hv-d .ch-flags svg{width:28px;height:28px;border-radius:50%;box-shadow:0 0 0 1px var(--line)}
.hv-d .ch-flags span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:1180px) and (min-width:981px){ .hv-d .ch-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }

.hv-d .ways{border-radius:20px;background:#FFFFFF;box-shadow:0 0 0 1px var(--line),0 10px 30px rgba(28,3,61,.04);overflow:hidden}
.hv-d .ways-row{display:grid;grid-template-columns:minmax(0,.85fr) repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.hv-d .ways-row:first-child{border-top:0}
.hv-d .ways-row>span{padding:16px 20px;font-size:15px;line-height:1.45;transition:background-color 200ms var(--ease-out)}
.hv-d .ways-row>span[role="rowheader"]{font-weight:600;color:var(--fg)}
.hv-d .ways-row>span[data-m]{color:var(--fg)}
.hv-d .ways-headrow>span{padding-top:20px;padding-bottom:18px}
.hv-d .ways-headrow b{display:block;font:700 18px/1.2 var(--font-display);letter-spacing:-.01em}
.hv-d .ways-headrow small{display:block;margin-top:4px;font-size:13px;color:var(--muted)}
.hv-d .ways-headrow .wn{margin:0 0 6px;font:500 11.5px/1 var(--font-data);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.hv-d .ways [data-m].is-on{background:#F6F2FB}
.hv-d .ways-headrow [data-m].is-on{box-shadow:inset 0 3px 0 var(--pink)}
.hv-d .ways-same{background:#EAF6EE}
.hv-d .ways-same>span[role="rowheader"]{color:#0F4D24}
.hv-d .ways-same .ways-span{grid-column:2/-1;color:#1D5A33;font-weight:500}

/* ---------- v2: phones ---------- */
@media (max-width:880px){
  .hv-d .j-intro{margin-top:48px;padding-top:28px}
  .hv-d #s-product{height:170vh} .hv-d #s-market,.hv-d #s-model{height:180vh} .hv-d #s-comp{height:200vh}
  .hv-d .pick-scene .scene-inner{align-content:start;padding-top:calc(var(--nav-h) + 18px + env(safe-area-inset-top,0px));gap:16px}
  .hv-d .pick-scene .cap .pick-help{display:none}
  .hv-d .pick-scene .cap h2{margin-bottom:14px}
  .hv-d .picker.prod{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-width:none}
  .hv-d .picker.prod .pick{min-height:40px;padding:0 10px 0 4px;font-size:13px;gap:6px}
  .hv-d .picker.prod .pick svg{width:28px;height:28px;padding:3px}
  .hv-d .picker.prod .pick-t{white-space:normal;line-height:1.15;text-align:left}
  .hv-d .picker.ctry{gap:6px}
  .hv-d .picker.ctry .pick{min-height:40px;padding:0 12px 0 4px;font-size:13.5px}
  .hv-d .picker.ctry .pick svg{width:28px;height:28px}
  .hv-d .pstage{grid-template-columns:92px minmax(0,1fr);gap:12px}
  .hv-d .spec{padding:14px 16px}
  .hv-d .spec-name{font-size:18px;margin-top:6px}
  .hv-d .spec-cat{display:none}
  .hv-d .spec-rows div{padding:6px 0}
  .hv-d .spec-rows dd{font-size:14px}
  .hv-d .spec-rows div:first-child,.hv-d .spec-rows div:last-child{display:none}
  .hv-d .mstage{gap:8px}
  .hv-d .m-lbl{font-size:30px}
  .hv-d .m-pin use,.hv-d #m-origin use{display:none}
  .hv-d .m-dot{r:11px}
  .hv-d .m-ring{stroke-width:4}
  .hv-d .m-base{stroke-width:4}
  .hv-d .m-hot{stroke-width:7}
  .hv-d #s-comp .cap p:not(.step){display:none}
  .hv-d .mcard{padding:14px 16px}
  .hv-d .mcard-top{gap:10px}
  .hv-d .art.art-x .mcard-flag{width:34px;height:34px}
  .hv-d .mcard-name{font-size:18px}
  .hv-d .mcard-sell{margin-left:0;width:100%}
  .hv-d .mcard-stats{grid-template-columns:1fr 1fr;gap:8px 12px;margin-top:10px;padding-top:10px}
  .hv-d .mcard-stats div:last-child{grid-column:1/-1}
  .hv-d .mcard-stats dd{font-size:13.5px}
  .hv-d .mpick{gap:6px}
  .hv-d .mp{padding:10px 14px}
  .hv-d .mp-s{display:none}
  .hv-d .paper{padding:14px 16px 0}
  .hv-d .paper-title{font-size:19px;margin-top:6px}
  .hv-d .paper-sub{font-size:12.5px;margin-bottom:6px;line-height:1.4}
  .hv-d .pw-row{padding:5px 0}
  .hv-d .pw-l{font-size:11.5px}
  .hv-d .pw-v{font-size:13.5px}
  .hv-d .pw-who{font-size:11px;padding:5px 8px}
  .hv-d .paper-foot{margin:2px -16px 0;padding:9px 16px 10px;font-size:12px;gap:8px}
  .hv-d .tick{width:18px;height:18px;background-size:18px}
  .hv-d .comp-card{padding:16px 16px 14px}
  .hv-d .comp-title{font-size:15px}
  .hv-d .comp-sub{display:none}
  .hv-d .art.art-x .comp-icon svg{width:30px;height:30px}
  .hv-d .comp-list{gap:0 12px;margin-top:10px}
  .hv-d .comp-list li{padding:7px 0;gap:8px}
  .hv-d .cl-n{width:22px;height:22px;font-size:11px}
  .hv-d .cl-x b{font-size:13px}
  .hv-d .cl-x>span{font-size:11.5px}
  .hv-d .comp-foot{padding:10px 12px;margin-top:10px;gap:10px}
  .hv-d .comp-foot dd{font-size:13px}
  .hv-d .comp-more{display:none}
  .hv-d .readouts{gap:12px}
  .hv-d .ro span{display:none}
  .hv-d .ro b{font-size:13px}
  .hv-d .ways-headrow{display:none}
  .hv-d .ways-row{grid-template-columns:1fr;padding:16px 18px}
  .hv-d .ways-row>span{padding:0}
  .hv-d .ways-row>span[role="rowheader"]{margin-bottom:8px;font-size:16px}
  .hv-d .ways-row>span[data-l]{font-size:14.5px;padding:4px 0}
  .hv-d .ways-row>span[data-l]::before{content:attr(data-l) ": ";font-weight:600;color:var(--dim)}
  .hv-d .ways [data-m].is-on{background:none}
  .hv-d .ways-row>span[data-l].is-on::before{color:var(--pink)}
  .hv-d .ways-same .ways-span{grid-column:auto}
}
@media (max-width:880px) and (max-height:720px){
  .hv-d .pick-scene .cap .step{display:none}
  .hv-d .pstage-art{display:none !important}
  .hv-d .pstage{grid-template-columns:1fr}
  .hv-d .art.art-x .mstage-map{max-height:110px}
  .hv-d .mcard-sell .spec-k{display:none}
  .hv-d .mcard-stats div:last-child{display:none}
  .hv-d .mp{padding:7px 12px}
  .hv-d .paper-head,.hv-d .paper-sub{display:none}
  .hv-d .paper-title{margin-top:0}
  .hv-d .pw-row{padding:4px 0}
  .hv-d .cl-x>span{display:none}
  .hv-d .comp-title{font-size:14px}
}
@media (min-width:881px) and (max-height:780px){
  .hv-d .paper{padding-top:18px}
  .hv-d .paper-title{margin-top:6px}
  .hv-d .paper-sub{margin-bottom:8px;font-size:14px}
  .hv-d .pw-row{padding:7px 0}
  .hv-d .paper-foot{padding:11px 28px 12px}
  .hv-d .comp-card{padding-top:16px}
  .hv-d .comp-list li{padding:8px 0}
  .hv-d .pick-scene .cap h2{font-size:clamp(1.9rem,3.2vw,2.6rem)}
}

/* ---------- v3: auto-fit levels for pinned stops (set by script when a stop would not fit the screen) ---------- */
.hv-d .fit1 .cap .chips,.hv-d .fit1 .comp-more,.hv-d .fit1 .pf-list,.hv-d .fit1 .pick-help{display:none}
.hv-d .fit1 .cap .pick-help+.picker,.hv-d .fit1 .cap .pick-help+.mpick{margin-top:0}
.hv-d .fit2 .cap p:not(.step),.hv-d .fit2 .cl-x>span,.hv-d .fit2 .paper-sub,.hv-d .fit2 .mcard-stats>div:last-child,.hv-d .fit2 .spec-cat,.hv-d .fit2 .dg-note{display:none}
.hv-d .fit3 .cap .step,.hv-d .fit3 .pref-out,.hv-d .fit3 .paper-head{display:none}
.hv-d .fit3 .art:not(.art-x){max-width:min(100%,calc((100svh - var(--nav-h) - var(--hud-h) - 60px) * 1000 / 600 * .78))}

/* ---------- v3: touch polish ---------- */
.hv-d button,.hv-d .btn,.hv-d .pick,.hv-d .mp,.hv-d summary,.hv-d a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}

@media (max-width:880px){
  /* product and market pills: 44px touch targets */
  .hv-d .picker.prod .pick,.hv-d .picker.ctry .pick{min-height:44px}
  /* how you sell: three side by side, numbered */
  .hv-d .mpick{flex-direction:row;gap:6px;max-width:none}
  .hv-d .mp{grid-template-columns:1fr;justify-items:center;row-gap:5px;padding:9px 6px 10px;text-align:center;border-radius:14px}
  .hv-d .mp-dot{grid-row:auto;width:24px;height:24px;font-size:12px}
  .hv-d .mp-t{font-size:13.5px;line-height:1.15}
  .hv-d .mp-s{display:none}
  /* paperwork: one line per row, the colour shows whose name it is */
  .hv-d .pw-row{grid-template-columns:minmax(0,1fr);grid-template-areas:"l" "v"}
  .hv-d .pw-who{display:none}
  .hv-d .pw-row[data-who="atom"] .pw-v{color:#6B21C8}
  .hv-d .pw-row[data-who="you"] .pw-v{color:#B5164F}
  .hv-d .pw-row[data-who="co"] .pw-v{color:#8A4B00}
  .hv-d .paper-num{margin-top:8px;font-size:12px}
  /* report form: 16px inputs so iPhones do not zoom in */
  .hv-d .report-dlg input,.hv-d .report-dlg select{font-size:16px}
  .hv-d .report-dlg form{padding:20px}
  .hv-d .rep-row{grid-template-columns:1fr}
}