.hero-quick-view {
    --quick-border:var(--vpn-line,#d4e5fa66);
    --quick-ink:var(--vpn-link,#f5f9ff);
    --note-accent:var(--vpn-light,#a8d4ff);
    --note-radius:var(--vpn-cta-radius,10px);
    display:grid;
    gap:10px;
    width:min(100%,520px);
    min-width:0;
    margin-block-start:20px;
    color:var(--quick-ink);
    text-align:start;
}
.hero-quick-view .hero-notes {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));
    gap:8px;
    margin:0;
    padding:0;
    list-style:none;
}
.hero-notes li {
    display:grid;
    grid-template-columns:30px minmax(0,1fr);
    align-items:start;
    gap:8px;
    padding:9px;
    border:1px solid var(--quick-border);
    border-radius:min(var(--note-radius),22px);
    background:linear-gradient(145deg,color-mix(in srgb,var(--note-accent) 13%,transparent),color-mix(in srgb,var(--quick-ink) 4%,transparent));
    font-size:14px;
    line-height:1.45;
}
.hero-note-icon {
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    border-radius:min(var(--note-radius),10px);
    color:var(--note-accent);
    background:color-mix(in srgb,var(--note-accent) 16%,transparent);
}
.hero-note-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.hero-note-copy { min-width:0; overflow-wrap:anywhere; }
.hero-note-copy strong { display:block; font-size:15px; font-weight:700; }
.hero-platforms { display:flex; flex-wrap:wrap; gap:6px; }
.hero-platforms a {
    display:inline-flex;
    align-items:center;
    min-height:35px;
    padding:3px 9px;
    color:inherit;
    font-size:13px;
    line-height:1.4;
    border:1px solid var(--quick-border);
    border-radius:6px;
    text-decoration:none;
}
.hero-quick-view a:hover { text-decoration:underline; }
.hero-quick-view .hero-plan-peek {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) fit-content(38%);
    align-items:center;
    gap:8px 12px;
    padding:9px 12px;
    min-height:44px;
    border:1px solid var(--quick-border);
    border-radius:8px;
    color:inherit;
    font-size:15px;
    line-height:1.45;
    text-decoration:none;
    overflow-wrap:anywhere;
}
.hero-plan-peek > :first-child { font-size:13px; font-weight:650; }
.hero-plan-peek-price { min-inline-size:0; font-size:16px; text-align:end; }
.vpn-campaign-copy:has(.hero-quick-view) { width:100%; }
:is([data-vpn-layout="observatory"],[data-vpn-layout="focus"],[data-vpn-layout="ribbon"]) .hero-quick-view { margin-inline:auto; }
.template-seaglass .hero-quick-view { --note-radius:16px; color:#f3f8ff; }
.template-orbit .hero-quick-view { --note-accent:var(--citrus); --note-radius:7px; }
[data-vpn-treatment="directory"] .hero-quick-view { --note-radius:4px; }
[data-vpn-treatment="passes"] .hero-quick-view { --note-radius:16px; }
.orbit-hero-help { display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:12px; }
.orbit-hero-help a { display:inline-flex; align-items:center; min-height:44px; font-size:14px; color:#effbf7; text-decoration:underline; text-underline-offset:4px; }
@media(max-width:730px) {
    .hero-quick-view { margin-block-start:14px; gap:8px; }
    .hero-quick-view .hero-notes { grid-template-columns:1fr; gap:5px; }
    .hero-notes li {
        grid-template-columns:26px minmax(0,1fr);
        align-items:center;
        gap:7px;
        padding:5px 7px;
    }
    .hero-note-icon { width:26px; height:26px; }
    .hero-note-icon svg { width:16px; height:16px; }
    .hero-note-copy strong { display:inline; margin-inline-end:7px; }
    .hero-platforms a { min-height:32px; }
    .orbit-flight-home .orbit-station > .orbit-hero { padding-block:32px; }
}
@media(max-width:360px) {
    .vpn-campaign[data-vpn-layout="atlas"]:has(.hero-quick-view) .vpn-stage { padding-block-start:90px; }
    .hero-quick-view .hero-plan-peek { grid-template-columns:minmax(0,1fr) fit-content(36%); }
    .hero-plan-peek > :first-child { grid-column:1 / -1; }
}