/* SavvyFlyer static-page dark skin v1 — 2026-08-09
 *
 * Shared across all NON-destination pages (guides, guide articles, savvy-score
 * explainer, contact, our-story, legal set, 404, site-stats). Mirrors the
 * homepage round-4b design system: deep-navy gradient, glass cards with the
 * 3D elevation shadow, Space Grotesk display type, aqua actions, traffic-light
 * tier palette. Destination pages use sf-country-dark-1.css instead.
 *
 * Contract: linked per page from Webflow page-head custom code. It restyles
 * the legacy light-theme classes in place — no copy, links or SEO metadata
 * are touched. Selectors are scoped to the legacy class names so a page that
 * doesn't use a block simply ignores those rules.
 */

/* ---- base ------------------------------------------------------ */
html{background-color:#070b14}
body{background:linear-gradient(180deg,#070b14 0%,#0d1424 60%,#070b14 100%);background-attachment:fixed;font-family:Inter,sans-serif;color:#cbd5e1;overflow-x:clip;-webkit-font-smoothing:antialiased}
[id]{scroll-margin-top:84px}

/* ambient blobs (pure CSS — no JS on static pages) */
body::before,body::after{content:"";position:fixed;border-radius:9999px;filter:blur(90px);pointer-events:none;z-index:0}
body::before{width:480px;height:480px;background:rgba(34,211,238,.13);top:-160px;left:-128px}
body::after{width:420px;height:420px;background:rgba(167,139,250,.13);top:38rem;right:-160px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---- legacy skeleton: section / container -------------------- */
.section-2{position:relative;z-index:1;background-image:none!important;background-color:transparent!important;padding-top:0!important}
.container-3{background-color:transparent!important;max-width:1152px}

/* ---- nav bar (homepage sf2-nav look; logo swapped to white in Designer) */
.link-block-2{position:sticky;top:0;z-index:50;display:flex;flex-direction:row!important;justify-content:flex-start!important;align-items:center;height:64px;width:100vw;margin-left:calc(50% - 50vw);padding:0 24px;margin-bottom:24px;background-color:rgba(13,20,36,.75)!important;border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.image-7{width:auto!important;height:32px!important;min-width:0!important;max-width:none!important;object-fit:contain}

/* ---- headings + intro ---------------------------------------- */
.heading-4{color:#fff!important;font-family:'Space Grotesk',Inter,sans-serif!important;font-weight:700;letter-spacing:-1px;text-shadow:none!important;-webkit-text-stroke-width:0!important;font-size:40px;line-height:1.15}
.paragraph-7{color:#94a3b8!important;font-weight:400!important;font-size:17px}
.paragraph-7 a,.link-3{color:#22d3ee!important;text-decoration:none}
.headline-container-2{align-items:center!important}
.headline-container-2>a{color:#22d3ee;font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;text-decoration:none;margin-bottom:8px}
.div-block-2{max-width:820px;width:100%}

/* ---- content card → glass w/ round-4 elevation ---------------- */
.div-block-23{background-image:none!important;background-color:rgba(255,255,255,.05)!important;border-color:rgba(255,255,255,.08)!important;box-shadow:0 24px 48px -12px rgba(0,0,0,.65),0 8px 16px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding:28px 32px!important}

/* ---- prose (rich text) — slate-300 on dark, AA everywhere ------ */
.div-block-23,.div-block-23 p,.div-block-23 li,.div-block-23 td{color:#cbd5e1!important;line-height:1.7}
.div-block-23 h1,.div-block-23 h2,.div-block-23 h3,.div-block-23 h4,.div-block-23 h5,.div-block-23 h6{color:#fff!important;font-family:'Space Grotesk',Inter,sans-serif!important;font-weight:700}
.div-block-23 h2{font-size:26px;margin-top:36px}
.div-block-23 h3{font-size:20px;margin-top:28px}
.div-block-23 a{color:#22d3ee!important;text-decoration:underline;text-decoration-color:rgba(34,211,238,.4);text-underline-offset:2px}
.div-block-23 a:hover{text-decoration-color:#22d3ee}
.div-block-23 strong{color:#e2e8f0}
.div-block-23 em{color:#cbd5e1}
.div-block-23 ul,.div-block-23 ol{padding-left:24px}
.div-block-23 li{margin-bottom:8px}
.div-block-23 blockquote{background-color:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-left:3px solid #22d3ee;border-radius:12px;margin:24px 0;padding:16px 20px;font-size:inherit;box-shadow:0 24px 48px -12px rgba(0,0,0,.65),0 8px 16px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)}
.div-block-23 img{max-width:100%;border-radius:12px}
.div-block-23 figure{margin:24px 0}
.div-block-23 figcaption{color:#94a3b8;font-size:13px}
.div-block-23 hr{border:none!important;border-top:1px solid rgba(255,255,255,.08)!important}

/* tables (glass) */
.div-block-23 table{border-collapse:collapse;width:100%;margin:20px 0;background-color:rgba(255,255,255,.03);border-radius:12px;overflow:hidden}
.div-block-23 th,.div-block-23 td{border:1px solid rgba(255,255,255,.08);padding:10px 12px;text-align:left}
.div-block-23 th{background-color:rgba(255,255,255,.08);color:#fff!important;font-family:'Space Grotesk',Inter,sans-serif;font-weight:600}
.div-block-23 tr:nth-child(even) td{background-color:rgba(255,255,255,.03)}
@media (max-width:767px){.div-block-23 table{display:block;overflow-x:auto}}

/* ---- savvy-score tier rows (classes added by page JS; copy untouched) */
.sf-tier-row{background-color:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-left:3px solid rgba(255,255,255,.3);border-radius:12px;padding:14px 18px!important;margin:10px 0;box-shadow:0 24px 48px -12px rgba(0,0,0,.65),0 8px 16px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)}

/* ---- guides listing ------------------------------------------- */
.div-block-23 .w-dyn-list{width:100%}
.div-block-23 .w-dyn-items{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:20px;gap:20px}
@media (max-width:991px){.div-block-23 .w-dyn-items{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.div-block-23 .w-dyn-items{grid-template-columns:1fr}}
.guide-card{background-color:rgba(255,255,255,.05)!important;border:1px solid rgba(255,255,255,.08);border-radius:16px!important;overflow:hidden;box-shadow:0 24px 48px -12px rgba(0,0,0,.65),0 8px 16px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)!important;transition:transform .2s ease,background-color .2s ease}
.guide-card:hover{transform:translateY(-4px);background-color:rgba(255,255,255,.08)!important}
.guide-card-pad{color:#94a3b8!important;font-size:14px}
.guide-card h3{color:#fff!important;font-family:'Space Grotesk',Inter,sans-serif!important;font-size:18px;line-height:1.35}

/* ---- guide article template ----------------------------------- */
.div-block-2.guide-col{max-width:820px}
.div-block-23.guide-article{margin-right:auto}
.headline-container-2>img{width:100%;max-width:820px;border-radius:16px;margin-bottom:28px;box-shadow:0 24px 48px -12px rgba(0,0,0,.65),0 8px 16px rgba(0,0,0,.4)}
.guide-body{color:#cbd5e1;font-size:17px;line-height:1.7}

/* ---- contact form (style only — bindings untouched) ------------ */
.form-block-2{width:100%;max-width:560px;background-color:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:28px;box-shadow:0 24px 48px -12px rgba(0,0,0,.65),0 8px 16px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)}
.form-block-2 label{color:#cbd5e1;font-weight:500}
.form-block-2 .w-input,.form-block-2 .w-select,.form-block-2 textarea{background-color:rgba(255,255,255,.05)!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:10px;color:#fff!important;min-height:44px}
.form-block-2 .w-input::placeholder,.form-block-2 textarea::placeholder{color:#94a3b8}
.form-block-2 .w-input:focus,.form-block-2 .w-select:focus,.form-block-2 textarea:focus{border-color:#22d3ee!important;box-shadow:0 0 0 2px rgba(34,211,238,.35);outline:none}
.form-block-2 select option{background-color:#0d1424;color:#cbd5e1}
.form-block-2 input[type=submit],.form-block-2 .w-button{background-color:#22d3ee!important;background-image:none!important;color:#070b14!important;border:none;border-radius:9999px;font-weight:600;height:48px;padding:0 28px;box-shadow:0 0 40px rgba(34,211,238,.25);transition:background-color .2s ease;cursor:pointer}
.form-block-2 input[type=submit]:hover,.form-block-2 .w-button:hover{background-color:#67e8f9!important}
.w-form-done{background-color:rgba(52,211,153,.12)!important;border:1px solid rgba(52,211,153,.35);border-radius:12px;color:#6ee7b7!important}
.w-form-fail{background-color:rgba(244,63,94,.12)!important;border:1px solid rgba(244,63,94,.35);border-radius:12px;color:#fda4af!important}

/* ---- footer (shared component, restyled in place) -------------- */
.footer{position:relative;z-index:1;background-color:transparent}
.div-block-11{border-top:1px solid rgba(255,255,255,.08);padding-top:40px;padding-bottom:32px;background-color:rgba(7,11,20,.6)}
.paragraph-5,.paragraph-8{color:#94a3b8!important;text-shadow:none!important}
.link-2{color:#94a3b8!important;border-right-color:rgba(255,255,255,.15)!important;text-decoration:none;transition:color .2s ease}
.link-2:hover{color:#22d3ee!important}
.div-block-16 a{color:#94a3b8}
.div-block-16 svg{fill:currentColor}

/* ---- 404 / utility -------------------------------------------- */
.utility-page-wrap{background:transparent}
.utility-page-content{width:320px;padding:32px;background-color:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;box-shadow:0 24px 48px -12px rgba(0,0,0,.65),0 8px 16px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)}
.utility-page-content h2{color:#fff;font-family:'Space Grotesk',Inter,sans-serif;font-weight:700}
.utility-page-content div{color:#94a3b8}

/* ---- a11y ------------------------------------------------------ */
a:focus-visible,input:focus-visible,button:focus-visible{outline:2px solid #22d3ee;outline-offset:2px;border-radius:6px}

/* ---- responsive ------------------------------------------------ */
@media (max-width:767px){
  .heading-4{font-size:30px}
  .div-block-2{max-width:100%}
  .div-block-23{padding:20px!important}
  .link-block-2{padding:0 16px}
}

/* ---- guide CTA card type fallback (font itself loads via page head) */
.sf-cta-title{font-family:'Space Grotesk',Inter,sans-serif}

/* ---- shared sf2 chrome (SF Nav component + rebuilt Footer component) ----
   Layout lives in Webflow global styles (sf2-*); this block carries the
   polish that previously existed only in the homepage embed. 2026-08-09. */
.sf2-nav{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.sf2-nav-link:hover{color:#fff}
.sf2-btn:hover{background-color:#67e8f9}
.sf2-footer-link:hover{color:#22d3ee}
.sf2-social:hover{background-color:rgba(255,255,255,.08)}
.sf2-soc-fb{background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2394a3b8'%3E%3Cpath d='M13.5 21v-7h2.4l.4-3h-2.8V9.1c0-.9.3-1.5 1.6-1.5h1.3V5c-.3 0-1.1-.1-2-.1-2 0-3.4 1.2-3.4 3.5V11H8.5v3H11v7h2.5z'/%3E%3C/svg%3E")}
.sf2-soc-ig{background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='%2394a3b8' stroke='none'/%3E%3C/svg%3E")}
.sf2-soc-tt{background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2394a3b8'%3E%3Cpath d='M16.6 3c.4 2 1.7 3.3 3.9 3.5v2.8c-1.4.1-2.7-.3-3.9-1.1v5.9c0 3.8-2.6 6-5.9 6C7.6 20.1 5.5 18 5.5 15c0-3 2.5-5.3 5.9-5v3c-.3-.1-.7-.2-1-.2-1.5 0-2.6 1-2.6 2.4 0 1.5 1.1 2.4 2.5 2.4 1.6 0 2.7-1.1 2.7-3.3V3h3.6z'/%3E%3C/svg%3E")}
.sf2-nav-link:focus-visible,.sf2-btn:focus-visible,.sf2-footer-link:focus-visible,.sf2-social:focus-visible{outline:2px solid #22d3ee;outline-offset:2px;border-radius:6px}


/* ---- v2 (2026-08-11 sweep) --------------------------------------------
   QW#5: hero h1 + sub ship inline opacity:0 from a Webflow IX2 fade on the
   legal/contact set; content must not depend on JS to be visible.
   !important beats the inline initial state — the fade is retired. */
h1.heading-4,p.paragraph-7{opacity:1!important}