/* ==== MELT PEAK STORE / BLACKTOP VENOM ==== */
:root {
    --ink0: #0a0c08;
    --ink1: #10140b;
    --panel: #12170d;
    --raised: #1a2112;
    --line: #29331c;
    --linesoft: #1e2613;
    --text: #f1f5ea;
    --mut: #aab69c;
    --dim: #83906f;
    --venom: #a6e224;
    --venomhi: #c3f542;
    --venomdeep: #7fb90d;
    --inkbtn: #0b0e07;
    --star: #f5b301;
    --paper: #ffffff;
    --paperink: #101208;
}

/* ==== BASE ==== */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    background: var(--ink0);
    color: var(--text);
    font-family: 'K2D', Arial, sans-serif;
    font-size: 17px;
    line-height: 1.65;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--venom); text-decoration: none; }
a:hover { color: var(--venomhi); }
p a, li a, td a { text-decoration: underline; text-underline-offset: 3px; }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 22px; }
:focus-visible { outline: 2px solid var(--venom); outline-offset: 3px; border-radius: 4px; }
.skiplink {
    position: absolute; left: -999px; top: 8px; z-index: 200;
    background: var(--venom); color: var(--inkbtn); padding: 8px 16px; border-radius: 999px; font-weight: 700;
}
.skiplink:focus { left: 8px; }

h1, h2, .bignum, .pricebig {
    font-family: 'Passion One', Impact, sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    line-height: .95;
    letter-spacing: .01em;
}
h2 { font-size: clamp(30px, 4vw, 42px); margin-bottom: 14px; }
h3 { font-size: 19px; font-weight: 700; }
section { padding: 68px 0; }
.kicker {
    display: block; color: var(--venom); font-size: 12px; font-weight: 700;
    letter-spacing: .22em; text-transform: uppercase; margin-bottom: 10px;
}
.sectionlead { color: var(--mut); max-width: 720px; }

/* ==== ANNOUNCE + HEADER ==== */
.announce {
    background: var(--venom); color: var(--inkbtn); text-align: center;
    font-size: 13.5px; font-weight: 600; padding: 7px 16px; letter-spacing: .03em;
}
.announce strong { font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.announce a { color: var(--inkbtn); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.renamechip {
    border: 1px solid var(--venomdeep); color: var(--venom); border-radius: 999px;
    font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
    padding: 4px 11px; white-space: nowrap;
}
.siteheader {
    position: sticky; top: 0; z-index: 90;
    background: rgba(10, 12, 8, .92);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--linesoft);
}
.headrow { display: flex; align-items: center; gap: 26px; height: 64px; position: relative; }
.wordmark {
    font-family: 'Passion One', Impact, sans-serif; font-weight: 900;
    font-size: 27px; letter-spacing: .02em; color: var(--text);
}
.wordmark .peak { color: var(--venom); display: inline-block; transform: skewX(-8deg); margin-left: 2px; }
.wordmark.small { font-size: 23px; }
.mainnav { display: flex; gap: 22px; margin-left: auto; }
.mainnav a { color: var(--mut); font-size: 15px; font-weight: 600; }
.mainnav a:hover, .mainnav a[aria-current] { color: var(--text); }
.headacts { display: flex; align-items: center; gap: 14px; }

.pillbtn {
    display: inline-block; background: var(--venom); color: var(--inkbtn);
    font-weight: 800; text-transform: uppercase; letter-spacing: .05em;
    border-radius: 999px; padding: 13px 28px; font-size: 15px; border: 0; cursor: pointer;
    box-shadow: 0 0 0 rgba(166, 226, 36, 0);
    transition: background .15s, box-shadow .15s, transform .15s;
}
.pillbtn:hover { background: var(--venomhi); color: var(--inkbtn); box-shadow: 0 6px 26px rgba(166, 226, 36, .35); }
.pillbtn.dark { background: var(--inkbtn); color: var(--venom); }
.pillbtn.dark:hover { background: #151a0e; box-shadow: 0 6px 22px rgba(0, 0, 0, .45); }
.headshop { padding: 9px 20px; font-size: 13px; }

.navtoggle { display: none; background: none; border: 1px solid var(--line); border-radius: 10px; padding: 10px 9px; cursor: pointer; }
.navtoggle span { display: block; width: 20px; height: 2px; background: var(--text); margin: 4px 0; transition: .2s; }

/* ==== HERO / BUY BOX (layout D: floating card) ==== */
.hero { position: relative; padding: 46px 0 64px; overflow: hidden; }
.hero::before {
    content: ""; position: absolute; right: -140px; top: -80px; width: 720px; height: 720px;
    background: radial-gradient(circle, rgba(166, 226, 36, .14), transparent 62%);
    pointer-events: none;
}
.herogrid { display: grid; grid-template-columns: 1.02fr .98fr; gap: 46px; align-items: start; position: relative; }
.herochip {
    display: inline-block; border: 1px solid var(--venom); color: var(--venom);
    font-size: 11.5px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase;
    border-radius: 999px; padding: 7px 16px; margin-bottom: 22px;
}
h1 { font-size: clamp(52px, 7.2vw, 92px); }
h1 .h1b { color: var(--venom); display: inline-block; transform: skewX(-6deg); }
h1 .h1sub {
    display: block; font-family: 'K2D', Arial, sans-serif; font-weight: 600; text-transform: none;
    font-size: clamp(18px, 2vw, 22px); color: var(--mut); letter-spacing: 0; line-height: 1.4; margin-top: 14px;
}
.defline { margin: 20px 0 22px; max-width: 560px; color: var(--text); }
.ratingrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; }
.stars { color: var(--star); font-size: 18px; letter-spacing: 2px; }
.ratingrow a { color: var(--mut); text-decoration: underline; text-underline-offset: 3px; font-size: 15px; }
.chiprow { display: flex; flex-wrap: wrap; gap: 9px; }
.trustchip {
    border: 1px solid var(--line); color: var(--mut); border-radius: 999px;
    font-size: 12.5px; font-weight: 600; padding: 6px 13px;
}

.buycard {
    background: linear-gradient(180deg, var(--raised), var(--panel));
    border: 1px solid var(--line); border-top: 3px solid var(--venom);
    border-radius: 22px; padding: 24px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .5), 0 0 44px rgba(166, 226, 36, .07);
}
.buyhead { text-align: center; font-size: 15px; color: var(--mut); margin-bottom: 14px; }

/* ==== SWAP SHOT (old label vs new label) ==== */
.swapshot { display: flex; align-items: flex-end; justify-content: center; gap: 16px; margin-bottom: 12px; }
.swapshot figure { margin: 0; text-align: center; }
.swapshot img { margin: 0 auto; }
.swapold img { height: 148px; width: auto; opacity: .48; filter: grayscale(.4) drop-shadow(0 10px 18px rgba(0, 0, 0, .5)); }
.swapnew img { height: 216px; width: auto; filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .55)) drop-shadow(0 0 26px rgba(166, 226, 36, .22)); }
.swaptag {
    display: inline-block; border-radius: 999px; font-size: 9.5px; font-weight: 800;
    letter-spacing: .13em; text-transform: uppercase; padding: 3px 10px; margin-bottom: 8px;
}
.swaptag.old { border: 1px solid var(--line); color: var(--dim); }
.swaptag.new { background: var(--venom); color: var(--inkbtn); }
.swapshot figcaption { font-size: 12px; color: var(--dim); margin-top: 8px; line-height: 1.4; }
.swapshot figcaption b { color: var(--text); font-size: 12.5px; }
.swapnew figcaption b { color: var(--venom); }
.swaparrow { color: var(--venom); font-size: 26px; font-weight: 800; padding-bottom: 92px; }

/* ==== REBRAND SECTION ==== */
.rebrandgrid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 34px; align-items: start; margin-top: 10px; }
.rebrandgrid .prose p { margin-bottom: 14px; }
.swapcard { background: var(--panel); border: 1px solid var(--line); border-radius: 18px; padding: 24px; }
.swapcard h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .16em; color: var(--dim); margin: 0 0 10px; }
.swapcard h3.later { margin-top: 20px; }
.swapcard ul { list-style: none; margin: 0; display: grid; gap: 7px; }
.swapcard li { font-size: 14.5px; color: var(--mut); padding-left: 24px; position: relative; }
.swapcard li::before { position: absolute; left: 0; font-weight: 800; }
.swapcard .did li::before { content: "\2192"; color: var(--dim); }
.swapcard .not li::before { content: "\2713"; color: var(--venom); }
.packrow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-bottom: 16px; }
.packtile { position: relative; display: block; cursor: pointer; }
.packtile input { position: absolute; opacity: 0; }
.tilebody {
    display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px;
    border: 1.5px solid var(--line); border-radius: 14px; padding: 26px 8px 12px; text-align: center;
    transition: border-color .15s, background .15s; min-height: 108px;
}
.tilen, .tilelab, .tileper { display: block; }
.packtile:hover .tilebody { border-color: var(--venomdeep); }
.packtile input:checked + .tilebody { border-color: var(--venom); background: rgba(166, 226, 36, .08); }
.packtile input:focus-visible + .tilebody { outline: 2px solid var(--venom); outline-offset: 2px; }
.tilen { font-family: 'Passion One', Impact, sans-serif; font-weight: 900; font-size: 30px; line-height: 1; }
.tilelab { font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--mut); }
.tileper { font-size: 13px; font-weight: 700; color: var(--venom); margin-top: 5px; }
.tileflag {
    position: absolute; top: -1px; left: 50%; transform: translateX(-50%);
    background: var(--venom); color: var(--inkbtn); font-size: 9.5px; font-weight: 800;
    letter-spacing: .14em; text-transform: uppercase; border-radius: 0 0 8px 8px; padding: 3px 10px; white-space: nowrap;
}
.pricezone { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 4px; }
.pricebig { font-size: 54px; color: var(--venom); }
.pricebig .perb { font-size: 20px; letter-spacing: .04em; }
.sumline { font-size: 15px; color: var(--text); margin-bottom: 2px; }
.sumline s { color: var(--dim); margin-left: 7px; }
.savechip {
    display: inline-block; background: rgba(166, 226, 36, .14); color: var(--venomhi);
    border-radius: 999px; font-size: 12.5px; font-weight: 700; padding: 3px 11px; margin-left: 8px;
}
.savechip[hidden], .sumline s[hidden] { display: none; }
.shipline { font-size: 13.5px; color: var(--mut); margin-bottom: 14px; }
.buybtn { display: block; text-align: center; font-size: 17px; padding: 16px 20px; }
.microrow { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; margin-top: 13px; font-size: 12.5px; color: var(--mut); }
.microrow span::before { content: "\2713\00a0"; color: var(--venom); font-weight: 700; }
.stockline { text-align: center; font-size: 13px; color: var(--dim); margin-top: 10px; }
.mathnote { text-align: center; font-size: 11.5px; color: var(--dim); margin-top: 8px; }

/* ==== STAT BAND ==== */
.statband { border-top: 1px solid var(--linesoft); border-bottom: 1px solid var(--linesoft); background: var(--ink1); padding: 30px 0; }
.statgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; text-align: center; }
.bignum { font-size: 44px; color: var(--venom); }
.statlab { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: var(--mut); }

/* ==== STANDARDS ==== */
.stdgrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.stdcard { border: 1px solid var(--line); border-radius: 16px; padding: 18px 14px; text-align: center; background: var(--panel); }
.stdcard .mk { color: var(--venom); font-size: 22px; font-weight: 800; display: block; margin-bottom: 6px; }
.stdcard strong { font-size: 14px; display: block; line-height: 1.3; }
.stdcard span.note { font-size: 12.5px; color: var(--dim); }

/* ==== BENEFITS ==== */
.begrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 26px; }
.becard { background: var(--panel); border: 1px solid var(--linesoft); border-radius: 18px; padding: 24px; }
.becard::before { content: ""; display: block; width: 34px; height: 5px; background: var(--venom); border-radius: 3px; margin-bottom: 16px; }
.becard h3 { margin-bottom: 8px; }
.becard p { color: var(--mut); font-size: 15.5px; }

/* ==== SPEC TABLE (The Bottle Brief) ==== */
.brieftable { width: 100%; border-collapse: collapse; }
.brieftable th, .brieftable td { text-align: left; padding: 13px 16px; border-bottom: 1px solid var(--linesoft); vertical-align: top; }
.brieftable th { width: 230px; color: var(--dim); font-size: 12.5px; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; }
.brieftable td { color: var(--text); font-size: 15.5px; }
.brieftable tr:last-child th, .brieftable tr:last-child td { border-bottom: 0; }
.tablecard { background: var(--panel); border: 1px solid var(--linesoft); border-radius: 18px; overflow-x: auto; margin-top: 22px; }

/* ==== FAST TAKE / TAKEAWAYS ==== */
.fasttake { background: var(--panel); border-left: 4px solid var(--venom); border-radius: 0 18px 18px 0; padding: 26px 30px; margin-top: 22px; }
.fasttake p { color: var(--text); }
.takelist { list-style: none; margin-top: 20px; display: grid; gap: 12px; counter-reset: tk; }
.takelist li { position: relative; padding-left: 58px; color: var(--mut); }
.takelist li::before {
    counter-increment: tk; content: "0" counter(tk);
    position: absolute; left: 0; top: 0;
    font-family: 'Passion One', Impact, sans-serif; font-weight: 900; font-size: 30px; color: var(--venom); line-height: 1;
}
.takelist li strong { color: var(--text); }

/* ==== INGREDIENT PREVIEW ==== */
.inggrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 11px; margin-top: 24px; }
.ingcard { border: 1px solid var(--line); border-radius: 14px; padding: 16px 14px; background: var(--ink1); }
.ingcard strong { display: block; font-size: 14.5px; margin-bottom: 5px; }
.ingcard span { font-size: 13px; color: var(--dim); line-height: 1.45; display: block; }

/* ==== STEPS ==== */
.stepgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 26px; }
.stepcard { border: 1px solid var(--linesoft); border-radius: 18px; padding: 24px; background: var(--panel); }
.stepno { font-family: 'Passion One', Impact, sans-serif; font-weight: 900; font-size: 40px; color: var(--venom); line-height: 1; display: block; margin-bottom: 10px; }
.stepcard p { color: var(--mut); font-size: 15.5px; }

/* ==== REVIEWS ==== */
.scoreline { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 18px 0 8px; }
.scorebig { font-family: 'Passion One', Impact, sans-serif; font-weight: 900; font-size: 62px; color: var(--venom); line-height: 1; }
.revgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 24px; }
.revcard { background: var(--panel); border: 1px solid var(--linesoft); border-radius: 18px; padding: 22px; }
.revwho { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.revwho strong { font-size: 15px; }
.vchip { border: 1px solid var(--venomdeep); color: var(--venom); border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 3px 9px; white-space: nowrap; }
.revcard .stars { font-size: 14px; }
.revcard p { color: var(--mut); font-size: 15px; margin-top: 8px; }
.revmeta { color: var(--dim); font-size: 12.5px; }
.distbars { display: grid; gap: 8px; max-width: 460px; margin: 20px 0; }
.dbar { display: grid; grid-template-columns: 44px 1fr 44px; gap: 10px; align-items: center; font-size: 13.5px; color: var(--mut); }
.dtrack { background: var(--linesoft); border-radius: 99px; height: 9px; overflow: hidden; }
.dfill { background: var(--venom); height: 100%; border-radius: 99px; }
.statstrip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin: 26px 0; }
.statstrip .cell { border: 1px solid var(--line); border-radius: 14px; padding: 16px 12px; text-align: center; background: var(--ink1); }
.statstrip .cell b { font-family: 'Passion One', Impact, sans-serif; font-weight: 900; font-size: 27px; color: var(--venom); display: block; }
.statstrip .cell span { font-size: 12px; color: var(--dim); text-transform: uppercase; letter-spacing: .08em; }

/* ==== QA / FAQ ==== */
.qa h3 { margin-top: 26px; margin-bottom: 6px; color: var(--venomhi); }
.qa p { color: var(--mut); }
.faqgroup { margin-top: 34px; }
.faqgroup h2 { font-size: 26px; }
details.qitem { border-bottom: 1px solid var(--linesoft); }
details.qitem summary {
    cursor: pointer; list-style: none; padding: 17px 34px 17px 0; font-weight: 700; font-size: 16.5px; position: relative;
}
details.qitem summary::-webkit-details-marker { display: none; }
details.qitem summary::after {
    content: "+"; position: absolute; right: 4px; top: 14px;
    color: var(--venom); font-size: 24px; font-weight: 400; transition: transform .18s;
}
details.qitem[open] summary::after { transform: rotate(45deg); }
details.qitem .aa { padding: 0 0 18px; color: var(--mut); max-width: 780px; }

/* ==== GUARANTEE ==== */
.guaband { background: var(--panel); border: 1px solid var(--venomdeep); border-radius: 24px; padding: 40px; display: flex; gap: 36px; align-items: center; box-shadow: 0 0 50px rgba(166, 226, 36, .08); }
.guanum { font-family: 'Passion One', Impact, sans-serif; font-weight: 900; font-size: 120px; color: var(--venom); line-height: .85; }
.guanum small { display: block; font-size: 20px; letter-spacing: .2em; color: var(--text); }
.guaband p { color: var(--mut); max-width: 640px; }
.guaband h2 { margin-bottom: 8px; }

/* ==== CTA BAND ==== */
.ctaband { background: var(--venom); color: var(--inkbtn); padding: 46px 0; }
.ctaband h2, .ctaband p { color: var(--inkbtn); }
.ctaband p { opacity: .8; font-weight: 600; }
.ctarow { display: flex; align-items: center; justify-content: space-between; gap: 26px; flex-wrap: wrap; }

/* ==== REFERENCES ==== */
.reflist { margin: 18px 0 0 20px; color: var(--mut); font-size: 14.5px; display: grid; gap: 8px; }
sup.cite a { font-size: 12px; color: var(--venom); text-decoration: none; font-weight: 700; }

/* ==== SUPPLEMENT FACTS (white label card) ==== */
.factscard { background: var(--paper); color: var(--paperink); border-radius: 14px; padding: 26px 28px; max-width: 560px; border: 1px solid #d8dcd0; }
.factscard h3 { font-size: 30px; font-weight: 800; border-bottom: 10px solid var(--paperink); padding-bottom: 6px; margin-bottom: 8px; font-family: Arial, sans-serif; }
.factscard .servrow { font-size: 14.5px; border-bottom: 5px solid var(--paperink); padding-bottom: 8px; margin-bottom: 4px; }
.factstable { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.factstable th, .factstable td { text-align: left; padding: 7px 2px; border-bottom: 1px solid #b9beb0; }
.factstable thead th { font-size: 12.5px; border-bottom: 3px solid var(--paperink); }
.factstable td.amt, .factstable th.amt { text-align: right; white-space: nowrap; }
.factsfoot { font-size: 12px; color: #40453a; padding-top: 9px; }
.blendlist { font-size: 13px; color: #23261d; padding: 8px 2px; border-bottom: 1px solid #b9beb0; line-height: 1.6; }

/* ==== PILLARS / PROSE PAGES ==== */
.prose { max-width: 780px; }
.prose p { margin-bottom: 16px; color: var(--mut); }
.prose p strong, .prose li strong { color: var(--text); }
.prose ul, .prose ol { margin: 0 0 16px 22px; color: var(--mut); }
.prose li { margin-bottom: 8px; }
.pillar { border-left: 3px solid var(--venom); padding-left: 24px; margin: 34px 0; }
.pillar h3 { font-size: 21px; margin-bottom: 10px; color: var(--venomhi); }
.byline { color: var(--dim); font-size: 14px; margin: 10px 0 4px; }
.updated { color: var(--dim); font-size: 13.5px; margin-bottom: 26px; }
.glossary dt { font-weight: 700; color: var(--text); margin-top: 16px; }
.glossary dd { color: var(--mut); margin-left: 0; font-size: 15.5px; }
.notecard { background: var(--ink1); border: 1px solid var(--line); border-radius: 16px; padding: 22px 26px; margin: 26px 0; color: var(--mut); }
.timeline { display: grid; gap: 12px; margin: 22px 0; }
.trow { display: grid; grid-template-columns: 150px 1fr 56px; gap: 14px; align-items: center; font-size: 14.5px; color: var(--mut); }

/* ==== CONTACT / FORM ==== */
.contactgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 26px; }
.formcard { background: var(--panel); border: 1px solid var(--linesoft); border-radius: 18px; padding: 26px; }
.formcard label { display: block; font-size: 13.5px; font-weight: 700; margin: 14px 0 5px; }
.formcard input, .formcard textarea {
    width: 100%; background: var(--ink0); border: 1px solid var(--line); border-radius: 10px;
    color: var(--text); padding: 11px 13px; font-family: inherit; font-size: 15px;
}
.formnote { font-size: 12.5px; color: var(--dim); margin-top: 12px; }

/* ==== FOOTER ==== */
.sitefooter { border-top: 1px solid var(--linesoft); background: var(--ink1); padding: 56px 0 30px; margin-top: 40px; }
.footgrid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 30px; }
.footbrand p { color: var(--mut); font-size: 14.5px; margin-top: 14px; max-width: 360px; }
.footco { font-size: 13.5px; color: var(--dim); }
.footcol h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .16em; color: var(--dim); margin-bottom: 14px; }
.footcol a { display: block; color: var(--mut); font-size: 14.5px; margin-bottom: 9px; }
.footcol a:hover { color: var(--venom); }
.footlegal { border-top: 1px solid var(--linesoft); margin-top: 40px; padding-top: 26px; }
.footlegal p { color: var(--dim); font-size: 12.5px; margin-bottom: 10px; max-width: 980px; }
.footcopy { color: var(--mut); }

/* ==== DOCK (sticky add-to-cart, V2 always-on) ==== */
body.hasdock { padding-bottom: 76px; }
html.nodock body.hasdock { padding-bottom: 0; }
html.nodock .dock { display: none; }
.dock {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
    background: rgba(13, 17, 9, .96); backdrop-filter: blur(8px);
    border-top: 2px solid var(--venom);
}
.dockrow { display: flex; align-items: center; gap: 18px; padding-top: 12px; padding-bottom: 12px; }
.dockinfo { display: flex; flex-direction: column; line-height: 1.25; }
.dockinfo strong { font-size: 15px; }
.dockinfo span { font-size: 13px; color: var(--mut); }
.dockbtn { margin-left: auto; padding: 11px 24px; font-size: 14px; }
.dockx { background: none; border: 0; color: var(--dim); font-size: 24px; cursor: pointer; padding: 4px 8px; line-height: 1; }
.dockx:hover { color: var(--text); }

/* ==== 404 / REDIRECT ==== */
.lostbox { text-align: center; padding: 110px 22px; }
.lostbox h1 { font-size: 96px; color: var(--venom); }
.lostbox p { color: var(--mut); margin: 14px 0 26px; }
.spinbox { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 22px; text-align: center; padding: 22px; }
.spinner { width: 46px; height: 46px; border: 4px solid var(--linesoft); border-top-color: var(--venom); border-radius: 50%; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ==== RESPONSIVE ==== */
@media (max-width: 960px) {
    .herogrid { grid-template-columns: 1fr; gap: 34px; }
    .buycard { max-width: 520px; margin: 0 auto; }
    .rebrandgrid { grid-template-columns: 1fr; }
    .begrid, .stepgrid, .revgrid { grid-template-columns: 1fr 1fr; }
    .inggrid { grid-template-columns: repeat(3, 1fr); }
    .stdgrid { grid-template-columns: repeat(3, 1fr); }
    .statstrip { grid-template-columns: repeat(3, 1fr); }
    .footgrid { grid-template-columns: 1fr 1fr; }
    .guaband { flex-direction: column; text-align: center; }
    .contactgrid { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
    .mainnav {
        position: absolute; top: 100%; left: 0; right: 0;
        flex-direction: column; gap: 0;
        background: var(--ink1); border-bottom: 1px solid var(--line);
        visibility: hidden; opacity: 0; transform: translateY(-6px);
        transition: opacity .2s, transform .2s, visibility 0s linear .2s;
    }
    .mainnav.open { visibility: visible; opacity: 1; transform: none; transition: opacity .2s, transform .2s, visibility 0s; }
    .mainnav a { padding: 15px 22px; border-top: 1px solid var(--linesoft); }
    .navtoggle { display: block; }
}
@media (max-width: 620px) {
    body { font-size: 16px; }
    section { padding: 52px 0; }
    .renamechip { display: none; }
    .swapold img { height: 116px; }
    .swapnew img { height: 178px; }
    .swaparrow { padding-bottom: 76px; font-size: 21px; }
    .statgrid { grid-template-columns: 1fr 1fr; }
    .begrid, .stepgrid, .revgrid { grid-template-columns: 1fr; }
    .inggrid { grid-template-columns: 1fr 1fr; }
    .stdgrid { grid-template-columns: 1fr 1fr; }
    .statstrip { grid-template-columns: 1fr 1fr; }
    .packrow { grid-template-columns: 1fr; }
    .tilebody { flex-direction: row; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; min-height: 0; text-align: left; }
    .tileflag { left: auto; right: 12px; transform: none; border-radius: 0 0 8px 8px; }
    .guanum { font-size: 84px; }
    .footgrid { grid-template-columns: 1fr; }
    .dockinfo strong { display: none; }
    .brieftable th { width: 140px; }
}