:root {
  --ink: #102a43;
  --ink-2: #29445d;
  --muted: #5b7185;
  --teal: #0f766e;
  --teal-dark: #0a5a54;
  --teal-soft: #e7f5f2;
  --coral: #f97360;
  --coral-soft: #fff0ec;
  --cream: #fff8ee;
  --sky: #e9f4f7;
  --paper: #ffffff;
  --canvas: #f7f9f8;
  --nav-surface: rgba(255,255,255,.96);
  --line: #dbe5e6;
  --line-dark: #bfccce;
  --radius: 16px;
  --radius-sm: 10px;
  --max: 1240px;
  --narrow: 790px;
  --nav-height: 76px;
  --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* The visual system uses square editorial modules rather than soft app-style cards. */
*, *::before, *::after { box-sizing: border-box; border-radius: 0 !important; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--canvas); color: var(--ink); font-family: var(--font); font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: var(--teal); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--teal-dark); }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--coral); outline-offset: 3px; }
h1, h2, h3 { margin: 0; color: var(--ink); line-height: 1.12; letter-spacing: -.035em; }
h1 { font-size: clamp(2.45rem, 5vw, 5rem); }
h2 { font-size: clamp(1.7rem, 3vw, 2.55rem); }
h3 { font-size: 1.22rem; }
p { margin: 0 0 1rem; color: var(--ink-2); }
.container { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; }
.container-narrow { width: min(var(--narrow), calc(100% - 40px)); margin-inline: auto; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 999; background: var(--ink); color: white; padding: .7rem 1rem; }
.skip-link:focus { top: 1rem; }

.site-header { position: sticky; top: 0; z-index: 200; height: var(--nav-height); background: var(--nav-surface); border: 0; backdrop-filter: blur(12px); }
.nav { height: 100%; display: flex; align-items: center; gap: 1.5rem; }
.brand { flex: 0 0 190px; }
.brand img { width: 190px; height: auto; }
.desktop-nav { display: flex; align-items: center; gap: .2rem; margin: 0 auto; padding: 0; list-style: none; }
.desktop-nav > li > a, .nav-trigger { display: flex; align-items: center; gap: .5rem; border: 0; background: transparent; color: var(--ink); padding: .55rem .6rem .55rem .75rem; border-radius: 10px; text-decoration: none; font-weight: 680; font-size: .9rem; cursor: pointer; }
.desktop-nav > li > a:hover, .nav-trigger:hover, .nav-menu.force-open .nav-trigger { color: var(--teal); background: var(--teal-soft); }
.nav-chevron { display: grid; place-items: center; flex: 0 0 22px; width: 22px; height: 22px; border: 1px solid #c4dedb; border-radius: 50%; background: white; color: var(--teal-dark); transition: rotate .2s ease, color .2s ease, background-color .2s ease, border-color .2s ease; }
.nav-chevron svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.nav-trigger:hover .nav-chevron,
.nav-trigger:focus-visible .nav-chevron { border-color: var(--teal); background: var(--teal); color: white; }
.nav-menu:hover .nav-chevron,
.nav-menu:focus-within .nav-chevron,
.nav-menu.force-open .nav-chevron,
.nav-trigger[aria-expanded="true"] .nav-chevron { rotate: 180deg; border-color: var(--teal); background: var(--teal); color: white; }
.nav-menu { position: relative; }
.mega-menu { display: none; position: absolute; top: calc(100% + 14px); left: 50%; translate: -50% 0; width: 650px; padding: 1rem; background: white; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 22px 60px rgba(16,42,67,.16); transform-origin: top center; }
.mega-menu::before { content: ""; position: absolute; inset: -15px 0 auto; height: 15px; }
.nav-menu:hover .mega-menu, .nav-menu:focus-within .mega-menu, .nav-menu.force-open .mega-menu { display: block; animation: nav-menu-in .16s ease-out both; }
@keyframes nav-menu-in { from { opacity: 0; transform: translateY(-5px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
.mega-heading { padding: .2rem .4rem .75rem; font-weight: 800; }
.mega-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem; }
.mega-grid a { display: flex; flex-direction: column; padding: .75rem; border-radius: 10px; color: var(--ink); text-decoration: none; }
.mega-grid a:hover { background: var(--teal-soft); }
.mega-grid strong { font-size: .9rem; }
.mega-grid span { color: var(--muted); font-size: .72rem; }
.mega-all { display: block; margin-top: .6rem; padding: .75rem .4rem .15rem; border-top: 1px solid var(--line); font-weight: 750; }
.desktop-cta { flex: 0 0 auto; padding: .7rem 1rem; border-radius: 999px; background: var(--teal); color: white; font-size: .82rem; font-weight: 800; text-decoration: none; }
.desktop-cta:hover { color: white; background: var(--teal-dark); }
.menu-button { display: none; align-items: center; gap: .6rem; min-width: 96px; height: 44px; padding: 0 .45rem 0 .9rem; border: 1px solid #b9d8d4; border-radius: 999px; background: var(--teal-soft); color: var(--teal-dark); cursor: pointer; }
.menu-button:hover { border-color: var(--teal); background: white; }
.menu-word { font-size: .72rem; font-weight: 850; text-transform: uppercase; letter-spacing: .075em; }
.menu-glyph { position: relative; width: 31px; height: 31px; border-radius: 50%; background: var(--teal); color: white; }
.menu-glyph i { position: absolute; right: 0; display: block; height: 2px; border-radius: 2px; background: currentColor; transition: .18s ease; }
.menu-glyph i:first-child { top: 10px; right: 6px; width: 19px; }
.menu-glyph i:last-child { top: 18px; right: 6px; width: 14px; }
.menu-button.open { background: var(--teal); color: white; border-color: var(--teal); }
.menu-button.open .menu-glyph { background: white; color: var(--teal-dark); }
.menu-button.open .menu-glyph i { top: 14px; right: 6px; width: 19px; }
.menu-button.open .menu-glyph i:first-child { rotate: 45deg; }
.menu-button.open .menu-glyph i:last-child { rotate: -45deg; }
.mobile-menu { position: fixed; inset: var(--nav-height) 0 0; z-index: 190; overflow-y: auto; visibility: hidden; opacity: 0; transform: translateY(-10px); pointer-events: none; background: linear-gradient(180deg, var(--cream), var(--canvas)); color: var(--ink); transition: opacity .18s ease, transform .18s ease, visibility .18s; }
.mobile-menu.open { visibility: visible; opacity: 1; transform: translateY(0); pointer-events: auto; }
.mobile-menu-inner { padding-top: 1.6rem; padding-bottom: 4rem; }
.mobile-menu-intro { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: center; gap: 1.5rem; padding: 1.25rem 1.4rem; overflow: hidden; background: var(--cream); border: 1px solid #eadfce; border-radius: 18px; }
.mobile-menu-intro strong { display: block; font-size: clamp(1.25rem, 3vw, 1.7rem); line-height: 1.15; letter-spacing: -.025em; }
.mobile-menu-intro span { display: block; margin-top: .45rem; color: var(--ink-2); font-size: .88rem; }
.mobile-route-art { width: 170px; fill: var(--cream); stroke: var(--coral); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.mobile-quick-actions { display: grid; grid-template-columns: 1.25fr .75fr; gap: .8rem; margin: .85rem 0 1rem; }
.mobile-feature, .mobile-plan-link { display: flex; justify-content: space-between; align-items: center; min-height: 74px; padding: 1rem 1.1rem; border-radius: 14px; font-weight: 850; text-decoration: none; }
.mobile-feature { background: var(--teal); color: white; }
.mobile-feature:hover { background: var(--teal-dark); color: white; }
.mobile-action-arrow { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 50%; background: var(--coral); color: var(--ink); }
.mobile-feature svg { width: 25px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mobile-plan-link { background: white; border: 1px solid var(--line-dark); color: var(--ink); }
.mobile-plan-link:hover { border-color: var(--coral); color: var(--teal-dark); }
.mobile-plan-link svg { width: 42px; fill: none; stroke: var(--coral); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.mobile-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }
.mobile-menu-group { padding: 1.15rem; background: white; border: 1px solid var(--line); border-radius: 14px; }
.mobile-group-title { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: .45rem; padding-bottom: .75rem; border-bottom: 2px solid var(--teal-soft); color: var(--teal-dark); font-size: .78rem; font-weight: 850; letter-spacing: .025em; }
.mobile-group-title svg { width: 38px; fill: none; stroke: var(--coral); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.mobile-grid a { position: relative; display: block; padding: .62rem 1.35rem .62rem 0; border-bottom: 1px solid var(--line); color: var(--ink); font-size: .9rem; font-weight: 680; text-decoration: none; }
.mobile-grid a:last-child { border: 0; }
.mobile-grid a::after { content: "›"; position: absolute; right: .1rem; color: var(--teal); font-size: 1.15rem; line-height: 1.2; }
.mobile-grid a:hover { color: var(--teal-dark); }
.mobile-trust-group { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 1rem; }
.mobile-trust-group .mobile-group-title { grid-column: 1 / -1; }

.hero { background: var(--cream); border-bottom: 1px solid #eadfce; overflow: hidden; }
.hero-grid { min-height: 650px; display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 3rem; }
.hero-copy { padding: 4.5rem 0; }
.lead { margin: 1.25rem 0 0; color: var(--ink-2); font-size: clamp(1.08rem, 1.7vw, 1.32rem); line-height: 1.55; }
.answer-summary { padding-left: 1rem; border-left: 4px solid var(--teal); color: var(--ink); }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 46px; padding: .75rem 1.1rem; border: 1px solid transparent; border-radius: 10px; font-weight: 800; text-decoration: none; cursor: pointer; }
.button.primary { background: var(--teal); color: white; }
.button.primary:hover { background: var(--teal-dark); color: white; }
.button.secondary { background: white; border-color: var(--line-dark); color: var(--ink); }
.button.secondary:hover { border-color: var(--teal); color: var(--teal); }
.trust-list { display: flex; flex-wrap: wrap; gap: 1.2rem; margin: 1.5rem 0 0; padding: 0; color: var(--muted); list-style: none; font-size: .78rem; font-weight: 700; }
.trust-list li::before { content: "✓"; margin-right: .35rem; color: var(--teal); }
.hero-visual { align-self: stretch; margin-right: calc((100vw - min(var(--max), calc(100vw - 40px))) / -2); }
.hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: center; }

.quick-path, .magazine-preview { padding-block: 5.5rem; }
.home-sequence { padding-block: 5rem; background: var(--sky); border-block: 1px solid #d7e9ed; }
.home-sequence .answer-summary { margin-bottom: 0; }
.sequence-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.sequence-grid article { display: flex; flex-direction: column; min-height: 330px; padding: 1.4rem; background: white; border: 1px solid #d6e5e8; border-radius: var(--radius); }
.sequence-grid svg { width: 48px; margin-bottom: 1.4rem; fill: none; stroke: var(--coral); stroke-width: 2.5; stroke-linecap: round; }
.sequence-grid h3 { font-size: 1.3rem; }
.sequence-grid p { margin-top: .7rem; font-size: .9rem; }
.sequence-grid .text-link { margin-top: auto; }
.sequence-note { margin: 1.5rem 0 0; color: var(--ink-2); }
.blocker-finder { padding-block: 5rem; }
.blocker-table [role=row] { grid-template-columns: minmax(190px, .7fr) minmax(0, 1.3fr); }
.blocker-table p { margin: 0; }
.topic-preview { padding-block: 5.5rem; }
.section-heading { margin-bottom: 2rem; }
.section-heading p { margin-top: .65rem; font-size: 1.05rem; }
.heading-row { max-width: none; display: flex; align-items: end; justify-content: space-between; gap: 2rem; }
.heading-row a { flex: 0 0 auto; font-weight: 800; }
.path-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.path-grid article { position: relative; min-height: 310px; padding: 1.5rem; overflow: hidden; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.path-grid article:nth-child(2) { background: var(--teal-soft); }
.path-grid article:nth-child(3) { background: var(--coral-soft); }
.path-icon, .tool-symbol { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 2.2rem; border-radius: 14px 14px 14px 4px; background: var(--ink); color: white; font-weight: 900; }
.path-grid h3 { font-size: 1.45rem; }
.path-grid h3 a, .magazine-feature h2 a, .magazine-feature h3 a, .article-stack h3 a, .listing-card h2 a, .listing-card h3 a, .guide-grid h2 a, .guide-grid h3 a, .magazine-grid h2 a, .magazine-grid h3 a { color: var(--ink); text-decoration: none; }
.path-grid p { margin-top: .7rem; }
.drawn-arrow { position: absolute; right: 1.2rem; bottom: 1.2rem; width: 90px; fill: none; stroke: var(--coral); stroke-width: 3; stroke-linecap: round; }

.country-band { padding-block: 5.5rem; background: var(--sky); border-block: 1px solid #d7e9ed; }
.country-cards { display: grid; grid-template-columns: repeat(5,1fr); gap: .85rem; }
.country-cards article { display: flex; flex-direction: column; min-height: 315px; padding: 1.2rem; background: white; border: 1px solid #d6e5e8; border-radius: 14px; }
.country-mark { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 1.5rem; border: 1px solid var(--line-dark); border-radius: 50%; color: var(--teal); font-size: .72rem; font-weight: 900; }
.country-cards h3 a { color: var(--ink); text-decoration: none; }
.country-cards p { margin-top: .55rem; font-size: .86rem; }
.text-link { margin-top: auto; font-size: .82rem; font-weight: 800; }

.magazine-preview { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; }
.magazine-feature { overflow: hidden; background: var(--ink); border-radius: var(--radius); }
.magazine-feature img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.magazine-feature > div { padding: 1.6rem; }
.magazine-feature h2 a, .magazine-feature p { color: white; }
.magazine-feature p { color: #bfd0dc; margin-top: .8rem; }
.article-stack { border-top: 1px solid var(--line); }
.article-stack article { display: flex; align-items: center; gap: 1rem; padding: 1.3rem .25rem; border-bottom: 1px solid var(--line); }
.article-stack article > div { flex: 1; }
.article-stack span, .guide-grid > article > span, .magazine-grid article > span { color: var(--muted); font-size: .72rem; font-weight: 750; }
.article-stack h3 { margin-top: .35rem; }
.article-stack p { margin-top: .45rem; font-size: .86rem; }
.circle-link { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border: 1px solid var(--line-dark); border-radius: 50%; color: var(--ink); text-decoration: none; }
.homepage-discovery { padding-block: 5.5rem; background: var(--teal-soft); border-block: 1px solid #c9e7e2; }
.homepage-discovery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.homepage-discovery-grid article { display: flex; flex-direction: column; min-height: 260px; padding: 1.4rem; background: white; border: 1px solid #c9dfdc; border-radius: var(--radius); }
.homepage-discovery-grid h3 { font-size: 1.28rem; }
.homepage-discovery-grid h3 a { color: var(--ink); text-decoration: none; }
.homepage-discovery-grid h3 a:hover { color: var(--teal); text-decoration: underline; }
.homepage-discovery-grid p { margin-top: .7rem; font-size: .88rem; }
.discovery-card-foot { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-top: auto; padding-top: 1rem; color: var(--muted); font-size: .73rem; font-weight: 800; }
.discovery-card-foot svg { width: 54px; fill: none; stroke: var(--coral); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.proof-strip { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-bottom: 5rem; padding: 1.5rem; background: var(--cream); border: 1px solid #eadfce; border-radius: var(--radius); }
.proof-strip p { margin: .25rem 0 0; }
.proof-strip h2 { font-size: 1.4rem; }
.proof-strip .review-note { margin-top: .8rem; color: var(--muted); font-size: .78rem; }
.proof-strip > a { flex: 0 0 auto; font-weight: 800; }

.topic-preview-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.topic-preview-grid article { display: grid; grid-template-columns: 40px 1fr; gap: .85rem; padding: 1.25rem .6rem; border-bottom: 1px solid var(--line); }
.topic-preview-grid article:nth-child(odd) { padding-right: 1.4rem; border-right: 1px solid var(--line); }
.topic-preview-grid article:nth-child(even) { padding-left: 1.4rem; }
.topic-preview-grid svg { width: 34px; margin-top: .2rem; fill: none; stroke: var(--coral); stroke-width: 2.5; }
.topic-preview-grid h3 a { color: var(--ink); text-decoration: none; }
.topic-preview-grid p { margin: .35rem 0 0; font-size: .84rem; }

.page-hero { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 3rem; padding-block: 4rem; }
.page-hero img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--radius); }
.simple-hero { padding-block: 5rem 3rem; }
.simple-hero h1, .article-header h1 { font-size: clamp(2.4rem, 5vw, 4.4rem); }
.breadcrumb-bar { background: var(--nav-surface); border: 0; box-shadow: none; }
.breadcrumb-bar .breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; margin: 0; padding: .7rem 0; color: var(--muted); font-size: .85rem; }
.breadcrumb-bar .breadcrumbs a { color: var(--teal-dark); }
.breadcrumb-bar .breadcrumbs .sep { color: var(--muted); }
.breadcrumb-bar + .page-hero,
.breadcrumb-bar + .simple-hero,
.breadcrumb-bar + article > .article-header,
.breadcrumb-bar + article > .simple-hero { padding-top: clamp(1.4rem, 2.2vw, 2.25rem); }
.listing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding-bottom: 3rem; }
.listing-card { display: grid; grid-template-columns: auto 1fr; gap: 1.2rem; padding: 1.5rem; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.listing-card .country-mark { margin: 0; }
.listing-card h2, .listing-card h3 { font-size: 1.35rem; }
.listing-card p { margin-top: .6rem; }
.card-meta { margin: .7rem 0; color: var(--muted); font-size: .75rem; }
.callout { margin-block: 1rem 5rem; padding: 2rem; background: var(--teal-soft); border-left: 4px solid var(--teal); border-radius: 0 var(--radius) var(--radius) 0; }
.callout h2 { font-size: 1.4rem; }
.callout p { margin-top: .7rem; }

.article-header { padding-block: 4.5rem 2rem; }
.article-featured-image { margin-block: 0 3rem; }
.article-featured-image img { display: block; width: 100%; height: auto; max-height: 720px; object-fit: cover; border-radius: var(--radius-lg); }
.review-line { display: flex; flex-wrap: wrap; gap: .9rem 1.5rem; margin-top: 1.5rem; color: var(--muted); font-size: .76rem; font-weight: 650; }
.article-layout { display: grid; grid-template-columns: 220px minmax(0, 790px); align-items: start; justify-content: center; gap: 3.5rem; padding-bottom: 5rem; }
.article-toc { position: sticky; top: 105px; display: flex; flex-direction: column; padding: 1rem 0; border-block: 1px solid var(--line); }
.article-toc strong { margin-bottom: .4rem; }
.article-toc a { padding: .35rem 0; color: var(--muted); font-size: .82rem; }
.prose { color: var(--ink-2); font-size: 1.03rem; }
.prose > section, .prose > h2 { margin-top: 3.3rem; }
.prose > section:first-child { margin-top: 0; }
.prose h2 { margin-bottom: 1rem; font-size: clamp(1.55rem, 3vw, 2.15rem); }
.prose h3 { margin-top: 2rem; }
.prose p { margin-bottom: 1.15rem; }
.prose li { margin-bottom: .55rem; color: var(--ink-2); }
.opening { padding-left: 1.3rem; border-left: 4px solid var(--coral); color: var(--ink); font-size: 1.25rem; }
.answer-box, .financial-note { margin: 1.5rem 0; padding: 1.3rem; background: var(--teal-soft); border: 1px solid #c9e7e2; border-radius: var(--radius-sm); }
.answer-box p, .financial-note p { margin: .35rem 0 0; }
.check-list { padding: 0; list-style: none; }
.check-list li { position: relative; padding-left: 1.8rem; }
.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--teal); font-weight: 900; }
.comparison-table { margin: 1.5rem 0; border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
.comparison-table [role=row] { display: grid; grid-template-columns: 160px 1fr; gap: 1rem; padding: 1rem; background: white; border-bottom: 1px solid var(--line); }
.comparison-table [role=row]:last-child { border-bottom: 0; }
.comparison-table [role=row]:hover { background: white; box-shadow: none; }
.source-list { padding-left: 1.2rem; }
.source-note { padding: 1rem; background: var(--cream); border-radius: var(--radius-sm); font-size: .88rem; }
.field-note { display: flex; gap: 1rem; margin-top: 1rem; padding: 1rem; background: var(--cream); border: 1px solid #eadfce; border-radius: 12px; }
.field-note svg { flex: 0 0 34px; fill: none; stroke: var(--coral); stroke-width: 2.5; }
.field-note p { margin: .2rem 0 0; }
.policy-prose { padding-bottom: 5rem; }
.collection-intro { padding-block: 1rem 3rem; }
.collection-intro h3 { margin-top: 1.8rem; }
.container > h2 + .listing-grid,
.container > h2 + .topic-index-grid,
.container > h2 + .tools-grid,
.container > h2 + .magazine-grid { margin-top: 1.5rem; }
.route-sequence > p { color: var(--muted); }
.route-sequence .route-map { margin-top: 1.5rem; }

.route-map { padding-bottom: 5rem; }
.route-map article { display: grid; grid-template-columns: 65px 1fr; gap: 1.5rem; padding: 1.6rem; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.route-map h2, .route-map h3 { font-size: 1.6rem; }
.route-map p { margin-top: .65rem; }
.route-symbol { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px 18px 18px 5px; background: var(--teal); color: white; font-size: 1.5rem; font-weight: 900; }
.route-curve { display: block; width: 100px; height: 70px; margin: .15rem auto; fill: none; stroke: var(--coral); stroke-width: 3; stroke-linecap: round; }
.route-curve.flip { transform: scaleX(-1); }
.inline-links { display: flex; gap: 1rem; flex-wrap: wrap; }

.guide-grid, .magazine-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; padding-bottom: 5rem; }
.guide-grid article, .magazine-grid article { display: flex; flex-direction: column; min-height: 285px; padding: 1.4rem; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.guide-grid h2, .guide-grid h3, .magazine-grid h2, .magazine-grid h3 { margin-top: 1rem; font-size: 1.35rem; }
.guide-grid h3 { margin-top: 1rem; font-size: 1.25rem; }
.guide-grid h3 a { color: var(--ink); text-decoration: none; }
.guide-grid p, .magazine-grid p { margin-top: .7rem; font-size: .9rem; }
.magazine-grid img { width: calc(100% + 2.8rem); max-width: none; height: 160px; margin: -1.4rem -1.4rem 1rem; object-fit: cover; border-radius: var(--radius) var(--radius) 0 0; }
.pagination { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; padding-bottom: 5rem; }
.pagination > div:last-child { justify-self: end; }
.pagination p { margin: 0; color: var(--muted); font-size: .86rem; font-weight: 750; text-align: center; }
.guide-grid.compact { padding-bottom: 0; }
.guide-grid.compact article { min-height: 310px; }
.grouped-guides { padding-bottom: 5rem; }
.grouped-guides > section { padding-block: 3rem; border-top: 1px solid var(--line); }
.grouped-guides > section:first-child { border-top: 0; }

.topic-index-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding-bottom: 5rem; }
.topic-index-grid > article { display: flex; flex-direction: column; min-height: 440px; padding: 1.5rem; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.topic-count { margin-bottom: 1.2rem; color: var(--teal); font-size: .72rem; font-weight: 850; text-transform: uppercase; letter-spacing: .07em; }
.topic-index-grid h2, .topic-index-grid h3 { font-size: 1.65rem; }
.topic-index-grid h2 a, .topic-index-grid h3 a { color: var(--ink); text-decoration: none; }
.topic-index-grid p { margin-top: .7rem; }
.topic-index-grid ul { margin: .5rem 0 1.3rem; padding-left: 1.1rem; color: var(--ink-2); font-size: .86rem; }
.topic-index-grid li { margin-bottom: .5rem; }
.topic-index-grid .text-link { margin-top: auto; }
.hub-overview { padding-bottom: 4rem; }
.decision-list { display: grid; gap: .65rem; margin-block: 1rem 2rem; }
.decision-list > div { padding: 1rem; background: white; border: 1px solid var(--line); border-radius: var(--radius-sm); }
.decision-list p { margin: .25rem 0 0; }
.hub-spokes { padding-block: 4.5rem; background: var(--sky); border-block: 1px solid #d7e9ed; }
.hub-spokes .guide-grid { padding-bottom: 0; }
.topic-hub > .prose:last-child { padding-block: 4rem 5rem; }
.takeaways { margin: 2rem 0; padding: 1.4rem; background: var(--ink); border-radius: var(--radius); }
.takeaways h2 { color: white; font-size: 1.3rem; }
.takeaways ul { margin-bottom: 0; padding-left: 1.2rem; }
.takeaways li { color: #d7e4eb; }
.article-tool-cta { padding: 1.5rem; background: var(--cream); border: 1px solid #eadfce; border-radius: var(--radius); }
.article-tool-cta h2 { margin-top: 0; }
.worked-example { padding: 1.5rem; background: var(--sky); border: 1px solid #d7e9ed; border-radius: var(--radius); }
.worked-example h2 { margin-top: 0; }
.worked-example small { color: var(--muted); }
.action-workbook { padding: 1.5rem; border: 2px solid var(--ink); border-radius: var(--radius); }
.workbook-heading { display: flex; justify-content: space-between; align-items: start; gap: 1.5rem; }
.workbook-heading h2 { margin-top: 0; }
.workbook-heading .button { flex: 0 0 auto; }
.workbook-items { display: grid; gap: .7rem; margin-top: 1.3rem; }
.workbook-items label { display: flex; gap: .8rem; padding: 1rem; background: var(--canvas); border: 1px solid var(--line); border-radius: 10px; cursor: pointer; }
.workbook-items label:has(input:checked) { background: var(--teal-soft); border-color: var(--teal); }
.workbook-items input { flex: 0 0 20px; width: 20px; height: 20px; margin-top: .15rem; accent-color: var(--teal); }
.workbook-items span { display: grid; gap: .25rem; }
.workbook-status { margin: 1rem 0 0 !important; color: var(--teal-dark); font-size: .86rem; font-weight: 850; }
.workbook-complete .workbook-status::before { content: "✓ "; }
.related-reading { margin-top: 4.5rem; padding-block: 4.5rem; background: var(--sky); border-top: 1px solid #d7e9ed; }

.tools-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; padding-bottom: 4rem; }
.tools-grid article { display: flex; flex-direction: column; min-height: 300px; padding: 1.5rem; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.tools-grid h2, .tools-grid h3 { font-size: 1.45rem; }
.tools-grid h2 a, .tools-grid h3 a { color: var(--ink); text-decoration: none; }
.tools-grid p { margin-top: .7rem; }
.tools-grid .button { margin-top: auto; }
.privacy-line { display: inline-block; margin-top: 1.4rem; padding: .45rem .7rem; background: var(--teal-soft); border-radius: 999px; color: var(--teal-dark); font-size: .76rem; font-weight: 750; }
.tool-shell { margin-bottom: 2rem; padding: 2rem; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.tool-shell > h2 { margin-bottom: .45rem; font-size: clamp(1.4rem, 3vw, 1.9rem); }
.tool-shell > p { margin-bottom: 1.5rem; color: var(--muted); }
.tool-shell form { display: grid; gap: 1.5rem; }
.tool-shell fieldset { display: grid; gap: .7rem; margin: 0; padding: 0 0 1.5rem; border: 0; border-bottom: 1px solid var(--line); }
.tool-shell legend { margin-bottom: .9rem; font-size: 1.2rem; font-weight: 850; color: var(--ink); }
.tool-shell label > span { display: block; margin-bottom: .35rem; font-size: .82rem; font-weight: 750; }
.tool-shell select { width: 100%; padding: .75rem; border: 1px solid var(--line-dark); border-radius: 9px; background: white; color: var(--ink); }
.numeric-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.numeric-grid input { width: 100%; padding: .75rem; border: 1px solid var(--line-dark); border-radius: 9px; background: white; color: var(--ink); }
.choice { display: flex; align-items: center; gap: .65rem; padding: .8rem; background: var(--canvas); border: 1px solid var(--line); border-radius: 9px; cursor: pointer; }
.choice:has(input:checked) { background: var(--teal-soft); border-color: var(--teal); }
.choice input { width: 18px; height: 18px; accent-color: var(--teal); }
.tool-shell .button { justify-self: start; }
.tool-result { margin-top: 2rem; padding: 1.5rem; background: var(--ink); border-radius: var(--radius); color: white; }
.tool-result h2, .tool-result h3, .tool-result p, .tool-result li { color: white; }
.tool-result h2 { font-size: 1.65rem; }
.tool-result h3 { margin-top: 1.4rem; font-size: 1.1rem; }
.tool-result ul { padding-left: 1.2rem; }
.methodology-note { margin-bottom: 5rem; padding: 1.5rem; background: var(--cream); border-radius: var(--radius); }
.methodology-note h2 { font-size: 1.4rem; }
.methodology-note p { margin-top: .5rem; }
.tool-explanation { margin-bottom: 3rem; }
.start-principles { padding-bottom: 2rem; }
.glossary-list dl { display: grid; gap: 1rem; margin-top: 1.25rem; }
.glossary-list dl > div { padding: 1.25rem 0; border-top: 1px solid var(--line); scroll-margin-top: calc(var(--nav-height) + 1rem); }
.glossary-list dt h3 { margin: 0 0 .45rem; color: var(--navy); }
.glossary-list dd { margin: 0; }
.glossary-list dd p { margin: .35rem 0; }

.site-footer { padding-top: 4rem; background: #0a1e31; color: white; }
.footer-grid { display: grid; grid-template-columns: 1.6fr repeat(3,1fr); gap: 3rem; }
.footer-brand img { width: 190px; height: auto; filter: brightness(0) invert(1); }
.footer-brand p { max-width: 340px; margin-top: 1rem; color: #9fb4c3; font-size: .86rem; }
.footer-grid h2 { margin-bottom: .8rem; color: #87d5ce; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; }
.footer-grid > div > a { display: block; padding: .3rem 0; color: #d4e0e7; font-size: .84rem; text-decoration: none; }
.footer-bottom { display: flex; justify-content: space-between; margin-top: 3rem; padding-block: 1.2rem; border-top: 1px solid rgba(255,255,255,.12); color: #88a0b1; font-size: .72rem; }
.not-found { min-height: 60vh; padding-block: 7rem; }
.not-found p { margin-top: 1rem; font-size: 1.1rem; }

@media (max-width: 1080px) {
  .desktop-nav, .desktop-cta { display: none; }
  .nav { justify-content: space-between; }
  .menu-button { display: flex; }
  .hero-grid, .page-hero { grid-template-columns: 1fr; gap: 0; }
  .hero-grid { min-height: auto; }
  .hero-copy { padding: 3.75rem 0 2.5rem; }
  .hero-visual { height: clamp(320px, 48vw, 520px); margin-inline: calc((100vw - 100%) / -2); }
  .page-hero { padding-top: 3rem; }
  .page-hero img { margin-top: 2rem; }
  .country-cards { grid-template-columns: repeat(3,1fr); }
  .sequence-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1.3fr repeat(3,1fr); gap: 1.5rem; }
}

@media (max-width: 820px) {
  :root { --nav-height: 68px; }
  .container, .container-narrow { width: min(100% - 28px, var(--max)); }
  .brand, .brand img { width: 160px; flex-basis: 160px; }
  .path-grid, .guide-grid, .magazine-grid, .tools-grid, .homepage-discovery-grid { grid-template-columns: 1fr 1fr; }
  .country-cards { grid-template-columns: 1fr 1fr; }
  .magazine-preview { grid-template-columns: 1fr; }
  .listing-grid { grid-template-columns: 1fr; }
  .topic-index-grid { grid-template-columns: 1fr; }
  .article-layout { grid-template-columns: 1fr; }
  .article-toc { position: static; display: none; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  h1 { font-size: 2.65rem; }
  .simple-hero h1, .article-header h1 { font-size: clamp(2.15rem, 11vw, 2.75rem); }
  .menu-button { min-width: 92px; height: 42px; }
  .mobile-grid { grid-template-columns: 1fr; }
  .mobile-menu-inner { padding-top: .85rem; }
  .mobile-menu-intro { grid-template-columns: minmax(0, 1fr) 84px; gap: .75rem; padding: 1rem; }
  .mobile-route-art { width: 96px; margin-right: -18px; }
  .mobile-quick-actions { grid-template-columns: 1fr; }
  .mobile-feature, .mobile-plan-link { min-height: 64px; }
  .mobile-trust-group { grid-column: auto; grid-template-columns: 1fr; }
  .mobile-trust-group .mobile-group-title { grid-column: auto; }
  .hero-visual { height: 260px; }
  .hero-actions .button { width: 100%; }
  .quick-path, .country-band, .magazine-preview { padding-block: 3.5rem; }
  .path-grid, .country-cards, .guide-grid, .magazine-grid, .tools-grid, .sequence-grid, .homepage-discovery-grid { grid-template-columns: 1fr; }
  .topic-preview-grid { grid-template-columns: 1fr; }
  .topic-preview-grid article:nth-child(odd), .topic-preview-grid article:nth-child(even) { padding-inline: .4rem; border-right: 0; }
  .numeric-grid { grid-template-columns: 1fr; }
  .path-grid article, .country-cards article { min-height: 250px; }
  .heading-row { display: block; }
  .heading-row > a { display: inline-block; margin-top: .6rem; }
  .proof-strip { display: block; }
  .proof-strip > a { display: inline-block; margin-top: .8rem; }
  .page-hero { padding-block: 2.5rem; }
  .simple-hero, .article-header { padding-block: 3.5rem 2rem; }
  .listing-card { grid-template-columns: 1fr; }
  .route-map article { grid-template-columns: 1fr; }
  .comparison-table [role=row] { grid-template-columns: 1fr; gap: .2rem; }
  .tool-shell { padding: 1.2rem; }
  .workbook-heading { display: block; }
  .workbook-heading .button { margin-top: .5rem; }
  .pagination { grid-template-columns: 1fr 1fr; }
  .pagination p { grid-column: 1 / -1; grid-row: 1; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { display: grid; gap: .4rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}