/* Additions: purchase facts, buy section, comparison table, sample pages, starter pack, calculator notes */
.buyfacts{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0;padding:0}
.buyfacts li{display:flex;flex-direction:column;gap:2px;min-width:118px;padding:10px 14px;background:var(--panel);border:1px solid var(--line-soft)}
.buyfacts b{font-family:"Bebas Neue",sans-serif;font-size:24px;letter-spacing:.03em;color:var(--gold);font-weight:400;line-height:1.1}
.buyfacts span{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.bp-note{margin:14px 0 0;max-width:62ch;font-size:14px;line-height:1.55;color:var(--muted)}
.bp-note a,.bp-bundle a{color:var(--gold);text-underline-offset:3px}
.bp-bundle{margin:16px 0 0;max-width:62ch;font-size:15px;line-height:1.55;color:var(--cream)}
.buybox{display:grid;grid-template-columns:1.3fr 1fr;gap:32px;align-items:center;background:var(--panel);border:1px solid var(--line);padding:34px}
.buybox h2{margin:6px 0 0}
.buyact{display:flex;flex-direction:column;gap:12px;align-items:stretch}
.buyact .btn{justify-content:center}
.cmp-wrap{overflow-x:auto;border:1px solid var(--line-soft);background:var(--panel)}
table.cmp{width:100%;border-collapse:collapse;min-width:640px;font-size:15px;line-height:1.5}
table.cmp th,table.cmp td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-soft)}
table.cmp thead th{font-family:"Bebas Neue",sans-serif;font-weight:400;font-size:22px;letter-spacing:.03em;color:var(--gold);background:rgba(0,0,0,.18)}
table.cmp tbody th{font-family:"JetBrains Mono",monospace;font-weight:500;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);width:24%}
table.cmp tr.same td{color:var(--muted)}
.callout{border-left:4px solid var(--gold);background:var(--panel);padding:20px 24px;margin:0 0 28px;max-width:78ch}
.callout p{margin:0 0 10px}.callout p:last-child{margin:0}
.pv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px;margin-top:8px}
.pv-fig{margin:0;background:var(--panel);border:1px solid var(--line-soft);padding:12px}
.pv-fig img{width:100%;height:auto;border:1px solid rgba(0,0,0,.25);background:#fff}
.pv-fig figcaption{margin-top:10px;font-size:14px;line-height:1.45;color:var(--muted)}
.pv-fig figcaption b{display:block;color:var(--cream);font-weight:600}
.pv-fig a{display:block}
.skip-note{font-size:13px;color:var(--muted);margin:18px 0 0}
@media (max-width:760px){.buybox{grid-template-columns:1fr;padding:24px 20px}.buyfacts li{min-width:calc(50% - 6px);flex:1}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.cardnote{margin:0;padding:0 24px 20px;font-size:14px;color:var(--muted)}
.cardnote a{color:var(--gold);text-underline-offset:3px}
.hero-facts{max-width:62ch;margin:20px auto 0;font-size:15px;line-height:1.55;color:var(--muted)}
.hero-facts a,.hero-also a{color:var(--gold);text-underline-offset:3px}
.hero-also{margin:10px 0 0;font-size:14px;color:var(--muted)}
.usable{margin-top:16px;display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
.usable select{background:var(--panel);color:var(--cream);border:1px solid var(--line);padding:10px 12px;font:inherit}
.usable select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.calc-msg{margin:12px 0 0;min-height:1.2em;font-size:14px;color:var(--gold)}
.calc-how{max-width:760px;margin:22px auto 0;background:var(--panel);border:1px solid var(--line-soft)}
.calc-how summary{cursor:pointer;padding:14px 18px;font-weight:600;color:var(--cream)}
.calc-how summary:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.calc-how-in{padding:0 18px 8px;font-size:15px;line-height:1.6;color:var(--muted)}
.calc-how-in a{color:var(--gold);text-underline-offset:3px}

.packform{max-width:520px;margin-top:10px}
.packform label{display:block;font-weight:600;margin:0 0 6px}
.packform input[type=email]{width:100%;box-sizing:border-box;padding:14px;font:inherit;color:var(--cream);background:var(--bg);border:1px solid var(--line)}
.packform input[type=email]:focus-visible,.packform button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.optin{border:0;padding:0;margin:0 0 18px}.optin legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.chk2{display:flex;gap:12px;align-items:flex-start;font-weight:400!important;line-height:1.5;color:var(--muted);cursor:pointer}
.chk2 input{width:22px;height:22px;margin-top:2px;flex:0 0 22px;accent-color:var(--gold)}
.packresult{margin-top:22px;padding:0;outline:0}
.packresult.ok,.packresult.err{padding:18px 20px;border-left:4px solid var(--gold);background:var(--panel)}
.packresult.err{border-left-color:#E8890F}
.packresult p{margin:0 0 12px}.packresult p:last-child{margin:0}
.packresult a:not(.btn){color:var(--gold)}

/* Hazard stripe: part of the page (scrolls away with it), never stuck to the header */
.ghero,.a-hero,.bp-hero{position:relative}
.ghero>.stripe,.a-hero>.stripe,.bp-hero>.stripe{position:absolute;top:0;left:0;right:0;height:18px;background-size:33px 33px;animation:barHazardSlide 3s linear infinite}
.hero .stripe{top:75px}
@media(max-width:820px){.hero .stripe{top:58px}}
@keyframes barHazardSlide{to{background-position:33px 0}}
@media(prefers-reduced-motion:reduce){.ghero>.stripe,.a-hero>.stripe,.bp-hero>.stripe{animation:none}}

/* spacing between the "Also free" links on the home hero */
.hero-also a{margin:0 .7em}
.hero-also a:first-of-type{margin-left:.5em}

/* arrow on the "How this is calculated" drop-down so it is clear it opens */
.calc-how summary{display:flex;align-items:center;justify-content:space-between;gap:14px;list-style:none}
.calc-how summary::-webkit-details-marker{display:none}
.calc-how summary::after{content:"";flex:0 0 auto;width:9px;height:9px;border:solid var(--gold);border-width:0 2.5px 2.5px 0;transform:rotate(45deg);margin:-4px 4px 0 0;transition:transform .25s ease}
.calc-how[open] summary::after{transform:rotate(-135deg);margin:4px 4px 0 0}
.calc-how summary:hover::after{border-color:var(--gold-2)}

/* keep the breadcrumb clear of the stripe where the page hero has no top padding */
.ghero>.wrap>.bp-crumb:first-child{margin-top:0;padding-top:54px}

/* About page: body text lines up with the heading above and is justified */
.about-body>.rv>p{max-width:none;text-align:justify;hyphens:auto}
.about-body{padding-left:40px;padding-right:40px}
@media(max-width:820px){.about-body{padding-left:22px;padding-right:22px}}