/* 8180 — "Lembar Verifikasi" (verification sheet) reference-led skin.
   ------------------------------------------------------------------
   Visual language is taken from 8180's own artwork only: the blue night
   lobby splash of the official H5 launcher (h5.8180aa.com) and the 3D
   feature artwork of the brand's own landing page (f.8180gamevip.com).
   Palette: warm paper + navy ink + brand blue + gold seal.
   No reference copy, headline, wordmark, watermark, third-party game name
   or unverified promo number is reproduced in this stylesheet.
   Structure: editorial masthead, ruled article columns, stamped figure,
   own section rhythm (hero → ringkasan → langkah → galeri → rute → fakta →
   bukti → istilah → tanya-jawab). */

:root{
  --lv-paper:#f3f7fd;
  --lv-paper-2:#e4ecfa;
  --lv-blue:#12408f;
  --lv-blue-deep:#0a2a63;
  --lv-blue-soft:#3f6bb8;
  --lv-sky:#d3e2f9;
  --lv-ink:#0a1a33;
  --lv-ink-soft:#41536e;
  --lv-gold:#ad7b1f;
  --lv-gold-deep:#8a5f12;
  --lv-gold-soft:#f0e1bd;
  --lv-white:#ffffff;
  --lv-line:rgba(10,26,51,.16);
  --lv-line-soft:rgba(10,26,51,.09);
  --lv-shadow:0 18px 44px rgba(9,30,66,.13);
  --lv-shadow-sm:0 6px 18px rgba(9,30,66,.10);
  --radius:2px;
}

/* The factory theme is injected as an inline :root; the skin wins by
   redeclaring the same tokens on the body and on :root with higher order. */
body.is-light,
body.variant-editorial{
  --bg:var(--lv-paper);
  --bg2:var(--lv-paper-2);
  --panel:var(--lv-white);
  --text:var(--lv-ink);
  --muted:var(--lv-ink-soft);
  --line:var(--lv-line);
  --accent:var(--lv-blue);
  --accent2:var(--lv-gold);
  --display:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  --body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--lv-ink);
  background:
    radial-gradient(900px 420px at 92% -6%, rgba(18,64,143,.10), transparent 62%),
    radial-gradient(620px 320px at -6% 10%, rgba(173,123,31,.09), transparent 66%),
    linear-gradient(180deg,var(--lv-paper) 0%,#f8fbff 44%,var(--lv-paper-2) 100%);
  font-family:var(--body);
  line-height:1.68;
}
body.variant-editorial::before{
  /* faint ledger ruling instead of the factory grain */
  opacity:.5;
  background-image:repeating-linear-gradient(0deg,rgba(10,26,51,.05) 0 1px,transparent 1px 26px);
  background-size:100% 26px;
}

body{font-size:16px;-webkit-font-smoothing:antialiased}
.wrap{width:min(1140px,100% - 44px)}
h1,h2,h3,h4{font-family:var(--display);color:var(--lv-ink);text-transform:none;letter-spacing:-.015em;text-shadow:none;font-weight:700}
/* The allocator may hand this site ``type-grotesk``; a reference-led skin is
   allowed to re-set the type hierarchy, so the editorial serif wins for every
   heading tag with the same specificity as the factory rule (skin loads last). */
body:not(.variant-legacy).type-grotesk h1,body:not(.variant-legacy).type-grotesk h2,body:not(.variant-legacy).type-grotesk h3,
body:not(.variant-legacy).type-humanist h1,body:not(.variant-legacy).type-humanist h2,body:not(.variant-legacy).type-humanist h3,
body:not(.variant-legacy).type-condensed h1,body:not(.variant-legacy).type-condensed h2,body:not(.variant-legacy).type-condensed h3,
body:not(.variant-legacy).type-serif h1,body:not(.variant-legacy).type-serif h2,body:not(.variant-legacy).type-serif h3{
  font-family:var(--display);text-transform:none;letter-spacing:-.015em;text-shadow:none;font-weight:700;
}
h1{line-height:1.02}
h2{font-size:clamp(24px,2.7vw,34px);line-height:1.16}
h3{font-size:19px;line-height:1.3}
p{margin:0 0 13px}
a{color:var(--lv-blue-deep);text-decoration-color:rgba(18,64,143,.32)}
a:hover{color:var(--lv-gold-deep)}
::selection{background:var(--lv-sky);color:var(--lv-blue-deep)}
:focus-visible{outline:3px solid var(--lv-blue);outline-offset:3px}

.kicker,.eyebrow,.label,.terms-label,.route-no,.ed-kicker,.po-kicker,
.policy-badge,.policy-tag,.ed-rule,.hero-logo-tag{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.17em;text-transform:uppercase;
}
.kicker,.ed-kicker,.po-kicker{font-size:10px;font-weight:700;color:var(--lv-gold-deep)}
.section{border-bottom:1px solid var(--lv-line-soft);padding:54px 0;background:transparent}
.sec-head{max-width:760px;margin:0 auto 26px;text-align:left}
.sec-head h2 + p,.sec-head p:not(.kicker){color:var(--lv-ink-soft);font-size:14.5px}
.sec-head h2{position:relative;padding-bottom:12px}
.sec-head h2::after{content:"";position:absolute;left:0;bottom:0;width:64px;height:3px;background:var(--lv-gold)}
.section-note{font-size:11.5px;color:var(--lv-ink-soft);margin-top:18px}
.section-note a{font-weight:600}

/* ---------- masthead ---------- */
.ed-header{
  position:sticky;top:0;z-index:60;
  background:color-mix(in srgb,var(--lv-white) 94%,var(--lv-paper));
  border-bottom:1px solid var(--lv-line);
  backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset;
}
.ed-header::after{content:"";display:block;height:3px;background:linear-gradient(90deg,var(--lv-blue) 0 52%,var(--lv-gold) 52% 74%,var(--lv-sky) 74% 100%)}
.ed-masthead{min-height:74px;gap:16px}
.ed-wordmark{order:1;flex:0 0 auto;text-align:left;display:flex;align-items:center}
.ed-brand-logo,.ed-header .brand-logo{
  height:52px;width:auto;max-width:min(210px,46vw);max-height:52px;object-fit:contain;
  filter:drop-shadow(0 2px 4px rgba(9,30,66,.18));
}
.ed-nav{order:2;margin-left:auto;gap:16px}
.ed-nav a{
  font-family:var(--body);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--lv-ink-soft);padding:6px 1px;border-bottom:1px solid transparent;
}
.ed-nav a:hover,.ed-nav a[aria-current="page"]{color:var(--lv-blue-deep);border-bottom-color:var(--lv-gold)}
.ed-meta{order:3;font-size:8.5px;color:var(--lv-ink-soft);letter-spacing:.1em;text-transform:uppercase}
.ed-meta .menu-btn{
  height:38px;padding:0 12px;border-radius:999px;border:1px solid var(--lv-line);
  background:var(--lv-white);color:var(--lv-blue-deep);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
}
.ed-rule{border-top:1px solid var(--lv-line);color:var(--lv-gold-deep);font-size:8.5px;letter-spacing:.18em;padding:6px 0}

/* ---------- policy strip ---------- */
.policy-strip{
  background:linear-gradient(90deg,color-mix(in srgb,var(--lv-blue) 9%,var(--lv-paper)),color-mix(in srgb,var(--lv-gold) 9%,var(--lv-paper)));
  border-bottom:1px solid var(--lv-line);color:var(--lv-ink);
}
.policy-strip-inner{gap:8px;padding:7px 0;font-size:9.5px}
.policy-badge{color:var(--lv-blue-deep);font-weight:800}
.policy-tag{border-color:var(--lv-line);background:var(--lv-white);color:var(--lv-blue-deep);border-radius:999px;padding:2px 8px}
.policy-link{color:var(--lv-gold-deep);border-color:var(--lv-line);border-radius:999px;background:var(--lv-white);padding:3px 10px}
.policy-link:hover{background:var(--lv-gold-soft);color:var(--lv-ink)}
.policy-note{color:var(--lv-ink-soft)}

/* ---------- hero: ruled feature with stamped figure ---------- */
.po-hero{
  padding:34px 0 44px;border-bottom:1px solid var(--lv-line);
  background:
    radial-gradient(680px 320px at 88% 4%, rgba(18,64,143,.12), transparent 68%),
    radial-gradient(420px 260px at 2% 92%, rgba(173,123,31,.10), transparent 70%);
  overflow:visible;
}
.po-hero .wrap{
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  grid-template-areas:
    "logo  fig"
    "kick  fig"
    "title fig"
    "rule  fig"
    "grid  fig"
    "chips fig"
    "strip strip";
  column-gap:42px;align-items:start;
}
.po-hero .wrap > .hero-logo-lockup{grid-area:logo}
.po-hero .wrap > .po-kicker{grid-area:kick}
.po-hero-figure{grid-area:fig;margin:0;position:relative;border:1px solid var(--lv-line);background:var(--lv-white);padding:8px;box-shadow:var(--lv-shadow);max-height:none}
.po-hero-figure img{width:100%;height:100%;max-height:660px;object-fit:cover;display:block;filter:saturate(1.02)}
.po-hero-figure::after{
  content:"Artwork resmi 8180 · lobi malam";
  display:block;margin-top:8px;padding-top:7px;border-top:1px solid var(--lv-line-soft);
  font-family:var(--display);font-size:11px;color:var(--lv-ink-soft);font-style:italic;letter-spacing:.01em;
}
.po-hero .wrap > .po-title{grid-area:title}
.po-title,.po-hero h1{
  font-family:var(--display);
  font-size:clamp(38px,5.4vw,68px);line-height:1.02;letter-spacing:-.025em;
  color:var(--lv-ink);-webkit-text-stroke:0;text-transform:none;
  border-top:3px solid var(--lv-blue);padding-top:16px;margin:6px 0 0;
  background:none;
}
.po-hero .wrap > .po-rule{grid-area:rule}
.po-rule{display:grid;grid-template-columns:3fr 1fr 1fr;gap:6px;margin:16px 0 0}
.po-rule span{height:2px;background:var(--lv-line)}
.po-rule span:nth-child(1){background:var(--lv-blue)}
.po-rule span:nth-child(2){background:var(--lv-gold)}
.po-rule span:nth-child(3){background:transparent;border-top:2px solid var(--lv-sky)}
.po-hero .wrap > .po-hero-grid{grid-area:grid}
.po-hero-grid{display:block;margin-top:18px}
.po-deck{font-family:var(--display);font-size:17.5px;line-height:1.62;color:var(--lv-ink-soft);max-width:560px;margin:0 0 18px}
.po-hero-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-start;align-items:center}
/* The factory's typographic hero prints the bare labels "H5"/"APK".  The mobile
   gate asks for explicit "Masuk H5" / "Unduh APK", so the skin prefixes the
   action verb (generated text is part of the accessible name) instead of
   forking the shared template. */
.po-hero-actions .btn-primary::before{content:"Masuk "}
.po-hero-actions .btn-ghost::before{content:"Unduh "}
.po-arrow{font-family:var(--body);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--lv-gold-deep);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;margin-left:4px}
.po-arrow:hover{color:var(--lv-blue-deep)}
.po-hero .wrap > .po-chips{grid-area:chips}
.po-chips{margin-top:16px}
.po-hero .wrap > .po-strip{grid-area:strip}
.po-strip{
  display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:26px;padding:10px 0 0;
  border-top:3px solid var(--lv-ink);border-bottom:1px solid var(--lv-line);
  font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--lv-ink-soft);
}
.po-strip b{color:var(--lv-blue-deep);font-weight:700}

/* hero logo lockup */
.hero-logo-lockup{gap:10px;margin:0 0 12px}
.hero-brand-logo{max-height:88px;max-width:min(200px,50vw);object-fit:contain;filter:drop-shadow(0 3px 6px rgba(9,30,66,.16))}
.hero-logo-tag{
  font-size:8.5px;color:var(--lv-gold-deep);border:1px solid var(--lv-gold);
  padding:3px 7px;border-radius:999px;background:var(--lv-gold-soft);font-weight:700;
}

/* ---------- buttons ---------- */
.btn{border-radius:2px;font-family:var(--body);font-weight:700;letter-spacing:.1em;font-size:11px;text-transform:uppercase}
.btn-primary{
  background:linear-gradient(180deg,#c8912c,var(--lv-gold) 58%,var(--lv-gold-deep));
  color:#1b1206;border-color:var(--lv-gold-deep);
  box-shadow:0 3px 0 rgba(122,86,16,.55),0 10px 24px rgba(9,30,66,.16);
}
.btn-ghost{background:var(--lv-white);color:var(--lv-blue-deep);border-color:var(--lv-line);box-shadow:0 1px 0 rgba(9,30,66,.06)}
.btn-ghost:hover{border-color:var(--lv-blue);color:var(--lv-blue-deep)}
.btn-lg{min-height:52px;padding:0 24px}
.chips span{
  font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.04em;
  background:var(--lv-white);border:1px solid var(--lv-line);color:var(--lv-ink-soft);
  padding:4px 8px;border-radius:999px;
}

/* ---------- showcase / galeri ---------- */
.sec-showcase{background:linear-gradient(180deg,var(--lv-white),var(--lv-paper))}
.h03-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;align-items:start}
.h03-tile{margin:0;border:1px solid var(--lv-line);background:var(--lv-white);padding:7px;box-shadow:var(--lv-shadow-sm)}
.h03-tile img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.h03-tile figcaption{
  font-family:var(--display);font-style:italic;font-size:11.5px;color:var(--lv-ink-soft);
  padding-top:7px;margin-top:7px;border-top:1px solid var(--lv-line-soft);
}
.h03-band{margin:20px 0 0;border-top:1px solid var(--lv-line);border-bottom:1px solid var(--lv-line);padding:8px 0}
.h03-band picture,.h03-band img{display:block;width:100%;height:auto}
.h03-band figcaption{font-family:var(--display);font-style:italic;font-size:11px;color:var(--lv-ink-soft);padding-top:8px}

/* ---------- ringkasan ---------- */
.ed-summary{display:grid;grid-template-columns:1.4fr .6fr;gap:38px;align-items:start}
.ed-prose p{font-family:var(--display);font-size:16px;line-height:1.75;color:var(--lv-ink-soft)}
.ed-lede{color:var(--lv-ink)}
/* no drop cap: the brand name starts with a digit and must stay legible */
.ed-lede::first-letter{float:none;font-size:inherit;padding:0;color:inherit}
.ed-aside{border-top:3px solid var(--lv-blue);background:var(--lv-white);padding:14px 16px 6px;box-shadow:var(--lv-shadow-sm)}
.ed-aside h3{font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--lv-gold-deep);margin:0 0 10px}
.ed-aside dl{margin:0;font-size:11.5px}
.ed-aside dt{color:var(--lv-ink-soft);border-top:1px solid var(--lv-line-soft);padding-top:7px;margin-top:7px}
.ed-aside dd{margin:2px 0 0;font-family:var(--display);font-size:13px;color:var(--lv-ink)}
.ed-prose .sec-links{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;font-weight:700;margin-top:14px}

/* ---------- langkah ---------- */
.ed-steps{list-style:none;padding:0;margin:0;counter-reset:lv}
.ed-steps li{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:16px 0;border-top:1px solid var(--lv-line)}
.ed-steps li:last-child{border-bottom:1px solid var(--lv-line)}
.ed-steps li>span{font-family:var(--display);font-size:30px;line-height:1;color:var(--lv-gold);font-weight:700}
.ed-steps h3{margin:0 0 4px;font-size:18px}
.ed-steps p{font-family:var(--display);font-size:13.5px;line-height:1.7;color:var(--lv-ink-soft);margin:0}

/* ---------- rute ---------- */
.route-grid,.variant-routes{display:grid;gap:0;border-top:1px solid var(--lv-line)}
.variant-editorial .route-card{
  border:0;border-bottom:1px solid var(--lv-line);border-radius:0;background:none;box-shadow:none;
  display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:18px;align-items:center;
  padding:18px 4px;min-height:0;color:var(--lv-ink);transition:background .16s ease,padding .16s ease;
}
.variant-editorial .route-card:hover{background:var(--lv-white);padding-left:12px}
.variant-editorial .route-card h3{grid-column:1;grid-row:1}
.variant-editorial .route-card p{grid-column:1;grid-row:2}
.variant-editorial .route-card .route-link{grid-column:2;grid-row:1 / span 2;align-self:center;justify-self:end}
.variant-editorial .route-card.primary{background:linear-gradient(90deg,rgba(173,123,31,.10),transparent 70%)}
.route-no{display:none}  /* the editorial route index duplicates the card title */
.route-card h3{margin:0;font-size:21px;color:var(--lv-blue-deep)}
.route-card p{margin:2px 0 0;font-family:var(--display);font-size:13px;color:var(--lv-ink-soft);line-height:1.55}
.route-link{
  justify-self:end;margin:0;padding:0;border:0;font-family:var(--body);font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--lv-gold-deep);font-weight:700;
}
.route-card:hover .route-link{color:var(--lv-blue-deep)}

/* ---------- fakta ---------- */
.ed-fact-table table{width:100%;border-collapse:collapse;border-top:3px solid var(--lv-ink);background:var(--lv-white);box-shadow:var(--lv-shadow-sm)}
.ed-fact-table caption{caption-side:top;text-align:left;font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--lv-gold-deep);padding-bottom:8px}
.ed-fact-table th{
  background:none;color:var(--lv-ink-soft);font-family:ui-monospace,monospace;
  font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;width:32%;text-align:left;
  border-bottom:1px solid var(--lv-line-soft);padding:10px 12px;
}
.ed-fact-table td{font-family:var(--display);font-size:13.5px;color:var(--lv-ink);border-bottom:1px solid var(--lv-line-soft);padding:10px 12px;word-break:break-word}
.ed-fact-table tr:last-child th,.ed-fact-table tr:last-child td{border-bottom:0}

/* ---------- bukti / trust ---------- */
.trust-list{list-style:none;padding:0;margin:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.trust-list li{
  display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start;
  border:1px solid var(--lv-line);background:var(--lv-white);padding:14px;box-shadow:var(--lv-shadow-sm);
}
.trust-list li span{font-family:var(--display);font-size:15px;font-weight:700;color:var(--lv-gold)}
.trust-list li p{margin:0;font-family:var(--display);font-size:13px;line-height:1.65;color:var(--lv-ink-soft)}

/* ---------- istilah ---------- */
.terms-box{border:1px solid var(--lv-line);background:var(--lv-white);padding:18px;box-shadow:var(--lv-shadow-sm);border-radius:2px}
.terms-label{font-size:9px;color:var(--lv-gold-deep);margin:0 0 6px;font-weight:700}
.terms-label + .chips{margin-top:0;margin-bottom:14px}
.terms-derived span{border-style:dashed;opacity:.95;background:transparent}
.edition-note{border-top:1px solid var(--lv-line-soft);margin-top:6px;padding-top:10px}
.edition-note p:last-child{font-family:var(--display);font-size:13px;color:var(--lv-ink-soft);margin:0}

/* ---------- kegiatan ---------- */
.card-grid.variant-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.card{border:1px solid var(--lv-line);background:var(--lv-white);padding:14px;box-shadow:var(--lv-shadow-sm);border-radius:2px}
.card img{width:100%;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--lv-line-soft);margin-bottom:10px}
.promo-card h3{margin:4px 0 6px;font-size:18px;color:var(--lv-blue-deep)}
.promo-card p{font-family:var(--display);font-size:13px;line-height:1.65;color:var(--lv-ink-soft)}
.promo-card .label{font-size:8.5px;color:var(--lv-gold-deep);letter-spacing:.14em}
.empty{border:1px dashed var(--lv-line);background:var(--lv-white);padding:22px;text-align:center}
.empty h2{font-size:22px}
.empty p{color:var(--lv-ink-soft);font-family:var(--display)}

/* ---------- faq ---------- */
.ed-faq{border-top:3px solid var(--lv-ink)}
.ed-faq article{display:grid;grid-template-columns:.92fr 1.08fr;gap:28px;padding:16px 0;border-bottom:1px solid var(--lv-line)}
.ed-faq h3{font-family:var(--display);font-size:16.5px;color:var(--lv-ink);margin:0;font-weight:700}
.ed-faq p{font-family:var(--display);font-size:13.5px;line-height:1.72;color:var(--lv-ink-soft);margin:0}

/* ---------- footer (factory "columns" chrome, editorial skin) ---------- */
.av-footer{background:var(--lv-ink);border-top:3px solid var(--lv-gold);color:#e8eefb}
.av-footer-cta{background:linear-gradient(90deg,var(--lv-blue),var(--lv-blue-deep));color:#eef4ff;padding:18px 0}
.av-footer-cta p{font-family:var(--display);font-size:15px;text-transform:none;letter-spacing:0;margin:0}
.av-footer-cta .btn-primary{background:linear-gradient(180deg,#c8912c,var(--lv-gold));color:#1b1206;border-color:var(--lv-gold-deep);box-shadow:none}
.av-footer-cta .btn-ghost{color:#eef4ff;border-color:rgba(238,244,255,.5);background:transparent}
.av-footer-grid{gap:26px;padding:34px 0 20px}
.av-footer-brand img{max-height:64px;width:auto;margin-bottom:10px}
.av-footer-brand strong{font-family:var(--display);font-size:22px;color:var(--lv-gold-soft);text-transform:none}
.av-footer-brand p{font-family:var(--display);font-size:12px;line-height:1.7;color:rgba(232,238,251,.74);max-width:320px}
.av-footer-col h3{font-family:ui-monospace,monospace;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--lv-gold-soft);margin-bottom:9px}
.av-footer-col a{color:rgba(232,238,251,.78);font-size:11.5px;padding:4px 0;text-decoration:none}
.av-footer-col a:hover{color:#fff;text-decoration:underline}
.av-footer-bottom{border-top:1px solid rgba(232,238,251,.16);color:rgba(232,238,251,.62);font-size:9px;padding:14px 0 20px}
.av-footer-bottom .age{border:1px solid rgba(232,238,251,.4);border-radius:999px;padding:1px 6px;margin-right:8px;font-family:ui-monospace,monospace}

/* ---------- inner pages (h5/apk/login/...) reuse the same paper ---------- */
.guide-hero,.promo-hero,.info-hero{border-bottom:1px solid var(--lv-line)}
.page-head h1,.guide h1,.promo h1{font-family:var(--display)}

/* ---------- inner pages: page hero + prose + aside ---------- */
.variant-page-hero{padding:34px 0 30px;border-bottom:1px solid var(--lv-line);
  background:radial-gradient(680px 280px at 88% 0%, rgba(18,64,143,.10), transparent 66%)}
.variant-page-hero .eyebrow{font-size:9px;letter-spacing:.14em;color:var(--lv-gold-deep);max-width:820px}
.variant-page-hero h1{font-size:clamp(32px,3.8vw,48px);line-height:1.06;color:var(--lv-ink);margin:6px 0 0;max-width:900px}
.variant-page-hero .deck{font-family:var(--display);font-size:16px;line-height:1.62;color:var(--lv-ink-soft);max-width:720px;margin:12px 0 0}
.variant-page-hero .chips{margin-top:12px}
.variant-page-hero .hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;max-width:none}
.variant-page-hero .hero-actions .btn{min-height:50px}
.variant-prose{max-width:820px}
.variant-prose h2{font-size:clamp(22px,2.4vw,30px);margin:34px 0 10px;padding-bottom:8px;border-bottom:1px solid var(--lv-line-soft)}
.variant-prose h2:first-child{margin-top:0}
.variant-prose p{font-family:var(--display);font-size:15px;line-height:1.75;color:var(--lv-ink-soft)}
.variant-prose ul{margin:0 0 16px;padding-left:18px}
.variant-prose li{font-family:var(--display);font-size:14px;line-height:1.65;color:var(--lv-ink-soft);margin-bottom:5px}
.variant-prose .table-wrap,.variant-split .table-wrap{overflow-x:auto;border:1px solid var(--lv-line);background:var(--lv-white)}
.variant-prose table,.variant-split table{width:100%;border-collapse:collapse;font-size:12.5px}
.variant-prose th,.variant-split th{background:color-mix(in srgb,var(--lv-sky) 55%,#fff);color:var(--lv-blue-deep);font-family:ui-monospace,monospace;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;text-align:left;padding:9px 11px;border-bottom:1px solid var(--lv-line)}
.variant-prose td,.variant-split td{font-family:var(--display);font-size:13px;color:var(--lv-ink);padding:9px 11px;border-bottom:1px solid var(--lv-line-soft)}
.variant-split{display:grid;grid-template-columns:1.35fr .65fr;gap:34px;align-items:start}
.variant-split .aside .card{border:1px solid var(--lv-line);background:var(--lv-white);padding:13px 14px;margin-bottom:10px;box-shadow:var(--lv-shadow-sm)}
.variant-split .aside .card .label{font-size:8.5px;color:var(--lv-gold-deep);letter-spacing:.14em}
.variant-split .aside .card p:last-child{font-family:var(--display);font-size:13px;line-height:1.6;color:var(--lv-ink-soft);margin:4px 0 0}
.variant-split .h2{font-size:22px;margin:26px 0 10px}
.sec-info,.sec-guide{padding:42px 0}
@media (max-width:980px){
  .variant-split{grid-template-columns:1fr;gap:20px}
}
@media (max-width:700px){
  .variant-page-hero{padding:22px 0 24px}
  .variant-page-hero h1{font-size:clamp(26px,7.2vw,34px)}
  .variant-page-hero .deck{font-size:14px}
  .variant-page-hero .hero-actions .btn{width:100%}
  .variant-prose h2{font-size:21px;margin-top:26px}
  .variant-prose p{font-size:14px}
  .sec-info,.sec-guide{padding:30px 0}
}

/* ---------- mobile ---------- */
@media (max-width:980px){
  .po-hero .wrap{grid-template-columns:1fr;grid-template-areas:"logo" "kick" "fig" "title" "rule" "grid" "chips" "strip";column-gap:0}
  .po-hero-figure img{max-height:none;aspect-ratio:16/11}
  .ed-summary{grid-template-columns:1fr;gap:22px}
  .variant-editorial .route-card{grid-template-columns:minmax(0,1fr);row-gap:6px}
  .route-link{justify-self:start;grid-column:1}
  .ed-faq article{grid-template-columns:1fr;gap:6px}
}
@media (max-width:700px){
  .wrap{width:calc(100% - 30px)}
  body{font-size:15.5px}
  .ed-masthead{min-height:64px}
  .ed-brand-logo,.ed-header .brand-logo{height:40px;max-height:40px;max-width:min(150px,46vw)}
  .ed-meta > span{display:none}
  .ed-rule{font-size:7.5px;padding:4px 0}
  .policy-strip-inner{gap:5px 8px;padding:5px 0;font-size:8.5px}
  .policy-note{display:none}
  .policy-badge,.policy-tag,.policy-link{font-size:8.5px;letter-spacing:.1em}
  .policy-tag,.policy-link{padding:2px 7px}
  .po-hero{padding:16px 0 26px}
  .po-hero-figure{padding:6px}
  .po-hero-figure img{aspect-ratio:3/2;max-height:190px;object-position:center 30%}
  .po-hero-figure::after{font-size:9.5px;margin-top:5px;padding-top:5px}
  .po-title,.po-hero h1{font-size:clamp(26px,7.4vw,32px);padding-top:10px;margin-top:2px;border-top-width:2px}
  .po-rule{margin:8px 0 0}
  .po-deck{font-size:13.6px;line-height:1.5;margin:8px 0 10px;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .po-hero-actions{flex-direction:column;flex-wrap:wrap;align-items:stretch;gap:7px}
  body:not(.variant-legacy).cta-stack .po-hero-actions{max-width:none;gap:7px}
  .po-hero-actions .btn{min-height:50px;padding:0 10px;font-size:10.5px}
  .po-arrow{display:none}
  .po-strip{font-size:8.5px;gap:6px 16px;margin-top:20px}
  .hero-brand-logo{max-height:64px;max-width:min(140px,42vw)}
  .hero-logo-tag{font-size:8px;padding:2px 6px}
  .section{padding:38px 0}
  .sec-head{margin-bottom:20px}
  .h03-tiles{grid-template-columns:1fr 1fr;gap:10px}
  .h03-tile figcaption{font-size:10.5px}
  .h03-band{margin-top:14px}
  .ed-aside{padding:12px 13px 4px}
  .ed-steps li{grid-template-columns:38px 1fr;gap:12px;padding:13px 0}
  .ed-steps li>span{font-size:24px}
  .ed-fact-table table{box-shadow:none}
  .ed-fact-table th{width:40%;font-size:8px;padding:8px 9px}
  .ed-fact-table td{font-size:12.5px;padding:8px 9px}
  .trust-list{grid-template-columns:1fr}
  .ed-faq{border-top-width:2px}
  .av-footer-grid{grid-template-columns:1fr 1fr;gap:18px}
  .av-footer-brand{grid-column:1/-1}
  .av-footer-cta .wrap{flex-direction:column;align-items:stretch;gap:10px}
  .av-footer-cta .btn{width:100%}

  /* fixed action bar: the factory hides it for variant sites, an approved
     skin may switch it back on for phones only. */
  body.variant-editorial .bottom-cta{
    display:flex!important;position:fixed;left:0;right:0;bottom:0;z-index:80;gap:8px;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom));
    background:color-mix(in srgb,var(--lv-white) 97%,var(--lv-ink));
    border-top:1px solid var(--lv-line);
    box-shadow:0 -8px 24px rgba(9,30,66,.16);
  }
  body.variant-editorial .bottom-cta .btn{flex:1;min-height:50px;font-size:10.5px;letter-spacing:.08em}
  body.variant-editorial{padding-bottom:calc(78px + env(safe-area-inset-bottom))}
}

@media (max-width:400px){
  .h03-tiles{grid-template-columns:1fr 1fr;gap:8px}
  .po-title,.po-hero h1{font-size:clamp(28px,8.6vw,34px)}
  .ed-nav a{font-size:9px}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}
