/* source: assets/fidelra.css */ /* FIDELRA V5.1 — SINGLE CSS BUILD Every public page loads this file and no other stylesheet. Component rules below are page-scoped; the final Design Contract owns all shared visual grammar. */ /* ===== COMPONENT: home.css ===== */ /* V5 namespaced legacy component details for home. Global design grammar lives in fidelra.css. */ /* index.html */ body.page-home{ --bg: #f4f8fb; --panel: #ffffff; --panel-2: #eef2f5; --teal-tint: #eef8f6; --ink: #0c1a24; --ink-2: #3c5262; --ink-3: #6b8298; --line: rgba(12, 26, 36, 0.1); --line-soft: rgba(12, 26, 36, 0.06); --accent: #0c8577; --accent-strong: #0c8577; --accent-hover: #095f54; --accent-ink: #ffffff; --amber: #b5790a; --good: #187a4a; --font: "Segoe UI", -apple-system, system-ui, sans-serif; --font-display: "Inter", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif; --mono: "SF Mono", "Cascadia Code", Consolas, monospace; } body.page-home *{ box-sizing: border-box; } html body.page-home{ scroll-behavior: smooth; scroll-padding-top: 76px; } body.page-home{ margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font); font-size: 21.0px; line-height: 1.6; -webkit-font-smoothing: antialiased; } body.page-home a{ color: inherit; text-decoration: none; } body.page-home h1, body.page-home h2, body.page-home h3, body.page-home h4{ margin: 0; font-family: var(--font-display); letter-spacing: -0.02em; } body.page-home .wrap{ max-width: 1180px; margin: 0 auto; padding: 0 32px; } @media (max-width: 640px) { body.page-home .wrap{ padding: 0 18px; } } @media (max-width: 640px) { body.page-home{ font-size: 17.0px; } body.page-home .eyebrow{ font-size: 14px; } body.page-home .head p, body.page-home .thesis-cell p, body.page-home .goal-card p, body.page-home .price-card .desc, body.page-home .domain-card p, body.page-home .chart-caption, body.page-home .chart-sub, body.page-home .price-legend, body.page-home .footer-row{ font-size: 14px; } body.page-home .goal-card h4, body.page-home .domain-card h4, body.page-home .price-card .tier{ font-size: 15.5px; } body.page-home .chart-title{ font-size: 14.5px; } body.page-home .city-table td, body.page-home .city-table th{ font-size: 14px; } body.page-home .cert-grid li{ font-size: 15.5px; } body.page-home .price-table .go, body.page-home .goal-card .go, body.page-home .cta-badge{ font-size: 14px; } } body.page-home section{ padding: 108px 0; border-bottom: 1px solid var(--line-soft); } body.page-home .section-divider{ position: relative; height: 1px; background: var(--line); } body.page-home .section-divider span{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; border-radius: 50%; background: var(--accent); } body.page-home section.tight{ padding: 76px 0; } body.page-home section.reveal{ opacity: 1; transform: none; transition: opacity .7s ease, transform .7s ease; } body.page-home section.reveal.pre-in{ opacity: 0; transform: translateY(28px); } body.page-home section.reveal.in{ opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { body.page-home section.reveal, body.page-home section.reveal.pre-in{ opacity: 1; transform: none; transition: none; } } body.page-home section.band{ background: var(--teal-tint); } body.page-home section.band-dark{ background: #06101a; border-bottom-color: #06101a; } body.page-home .band-dark .eyebrow{ color: #4fd9c4; } body.page-home .band-dark .head h2{ color: #ffffff; } body.page-home .band-dark .head p{ color: #a9b3ae; } body.page-home .band-dark > .wrap > p{ color: #a9b3ae; } body.page-home .eyebrow{ font-family: var(--mono); font-size: 14px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent-strong); font-weight: 700; } body.page-home .head{ max-width: 640px; margin-bottom: 40px; } body.page-home .head h2{ font-size: clamp(42px, 5.6vw, 60px); font-weight: 650; line-height: 1.05; margin-top: 10px; } body.page-home .head p{ color: var(--ink-2); font-weight: 500; font-size: 15.5px; line-height: 1.65; margin-top: 12px; max-width: 58ch; } body.page-home .tabular{ font-variant-numeric: tabular-nums; } body.page-home .btn{ display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 8px; font-size: 14px; font-weight: 600; border: 1px solid transparent; cursor: pointer; transition: transform .15s ease, background .15s ease, border-color .15s ease; } body.page-home .btn:hover{ transform: translateY(-1px); } body.page-home .btn-primary{ background: var(--accent); color: var(--accent-ink); } body.page-home .btn-primary:hover{ background: var(--accent-hover); } body.page-home .btn-ghost{ background: transparent; color: var(--ink); border-color: var(--line); } body.page-home .btn-ghost:hover{ border-color: var(--accent); color: var(--accent-strong); } /* ---- hero ---- */ body.page-home .hero{ padding: 128px 0 36px; border-bottom: none; } body.page-home .hero-divider{ position: relative; z-index: 1; display: flex; width: 50%; height: 4px; margin: 40px auto 0; } body.page-home .hero-divider span:first-child{ flex: 0 0 42%; background: var(--accent); } body.page-home .hero-divider span:last-child{ flex: 1; background: var(--line); } body.page-home .hero{ position: relative; overflow: hidden; } body.page-home #heroNetwork{ position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; max-width: 1600px; height: 100%; z-index: 0; opacity: 0.9; } body.page-home .hero-scrim{ position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; max-width: 1600px; height: 100%; z-index: 0; background: radial-gradient(ellipse at 28% 45%, transparent 35%, var(--bg) 92%); pointer-events: none; } @media (min-width: 1600px) { body.page-home .hero{ background: radial-gradient(ellipse 900px 700px at 50% 40%, color-mix(in srgb, var(--accent) 4%, transparent), transparent 70%); } } body.page-home .hero-grid{ position: relative; z-index: 1; display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: center; } @media (max-width: 900px) { body.page-home .hero-grid{ grid-template-columns: 1fr; } } body.page-home .hero h1{ font-size: clamp(57px, 8.6vw, 99px); font-weight: 650; line-height: 1.0; letter-spacing: -0.03em; } body.page-home .hero h1 .line-2{ color: var(--accent-strong); display: block; } body.page-home .hero h1 .line-3{ color: var(--ink-2); display: block; } body.page-home .hero p.lead{ color: var(--ink-2); font-weight: 500; font-size: 19.0px; line-height: 1.6; margin-top: 18px; max-width: 54ch; } body.page-home .hero-actions{ display: flex; gap: 12px; margin-top: 28px; flex-wrap: wrap; } body.page-home .hero-roadmap{ position: relative; z-index: 1; font-size: 14px; line-height: 1.7; color: var(--ink-3); margin-top: 20px; } body.page-home .hero-roadmap b{ color: var(--ink-2); font-weight: 700; } body.page-home .spec-panel{ display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; box-shadow: 0 1px 2px rgba(20,26,23,0.04), 0 4px 16px -8px rgba(20,26,23,0.08); } body.page-home .spec-cell{ background: var(--panel); padding: 18px 18px; } body.page-home .spec-cell:last-child{ grid-column: span 2; } body.page-home .spec-value{ font-family: var(--font-display); font-weight: 650; font-size: 30.0px; letter-spacing: -0.01em; } body.page-home .spec-value.good{ color: var(--good); font-size: 16.0px; display: flex; align-items: center; gap: 7px; } body.page-home .status-dot{ width: 8px; height: 8px; border-radius: 50%; background: var(--good); box-shadow: 0 0 0 3px color-mix(in srgb, var(--good) 22%, transparent); } body.page-home .spec-label{ font-size: 14px; color: var(--ink-3); margin-top: 5px; text-transform: uppercase; letter-spacing: 0.06em; } /* ---- condensed thesis ---- */ body.page-home .thesis{ text-align: center; max-width: 820px; margin: 0 auto; } body.page-home .thesis p{ font-size: clamp(18px, 2.1vw, 23px); font-weight: 600; line-height: 1.55; color: var(--ink); } body.page-home .thesis strong{ color: var(--accent-strong); } body.page-home .thesis-row{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 36px; text-align: left; } @media (max-width: 780px) { body.page-home .thesis-row{ grid-template-columns: 1fr; } } body.page-home .thesis-cell{ background: var(--panel); padding: 22px; border-top: 3px solid transparent; transition: border-color .15s ease, transform .15s ease; } body.page-home .thesis-cell:hover{ border-top-color: var(--accent); transform: translateY(-2px); } body.page-home .thesis-more{ display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 700; color: var(--accent-strong); } /* ---- network diagram ---- */ body.page-home .network-wrap{ display: grid; grid-template-columns: 1fr 0.8fr; gap: 40px; align-items: center; } @media (max-width: 900px) { body.page-home .network-wrap{ grid-template-columns: 1fr; } } body.page-home #networkSvg{ width: 100%; height: auto; max-width: 560px; margin: 0 auto; display: block; } body.page-home .net-edge{ stroke: var(--line); stroke-width: 1; transition: stroke 0.3s ease; } body.page-home .net-via{ fill: var(--line); transition: fill 0.3s ease; } body.page-home .net-edge-group.lit .net-edge{ stroke: var(--accent); stroke-width: 1.6; } body.page-home .net-edge-group.lit .net-via{ fill: var(--accent); } body.page-home .net-dot{ fill: var(--panel); stroke: var(--line); stroke-width: 1.5; transition: fill 0.3s ease, stroke 0.3s ease; } body.page-home .net-hit{ fill: transparent; cursor: pointer; } body.page-home .net-node text{ fill: var(--ink-3); font-family: var(--font); font-size: 14px; font-weight: 600; pointer-events: none; transition: fill 0.3s ease; } body.page-home .net-node.lit .net-dot{ fill: var(--accent); stroke: var(--accent); } body.page-home .net-node.lit text{ fill: var(--ink); } body.page-home .net-node.origin .net-dot{ fill: var(--accent); stroke: var(--accent-strong); stroke-width: 2.5; } body.page-home .net-node.origin text{ fill: var(--ink); font-weight: 700; } body.page-home .net-node:focus{ outline: none; } body.page-home .net-node:focus .net-dot{ stroke: var(--accent-strong); stroke-width: 2.5; } body.page-home .band-dark .net-edge{ stroke: rgba(147,168,186,0.16); } body.page-home .band-dark .net-via{ fill: rgba(147,168,186,0.18); } body.page-home .band-dark .net-dot{ fill: #16283a; stroke: rgba(147,168,186,0.4); } body.page-home .band-dark .net-node text{ fill: #93a8ba; } body.page-home .band-dark .net-node.lit text{ fill: #d6e6ef; } body.page-home .band-dark .net-node.origin text{ fill: #eef4f7; } body.page-home .band-dark #networkCaption{ color: #a9b3ae; } body.page-home .twin-preview{ position: relative; margin-top: 36px; border: 1px solid rgba(255,255,255,0.12); background: #0a141f; } body.page-home .twin-tabs{ display: flex; gap: 2px; border-bottom: 1px solid rgba(255,255,255,0.12); } body.page-home .twin-tab{ flex: 1; font-family: var(--font-display); font-size: 16.0px; font-weight: 700; padding: 17px; background: transparent; border: none; color: #7d8b96; cursor: pointer; } body.page-home .twin-tab.active{ color: #ffffff; background: rgba(79,217,196,0.08); box-shadow: inset 0 -2px 0 #4fd9c4; } body.page-home .twin-panel{ min-height: 260px; padding: 26px; } body.page-home .twin-heatmap-label{ font-family: var(--mono); font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: #7d8b96; margin-bottom: 14px; } body.page-home .twin-map-wrap{ display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; align-items: start; } @media (max-width: 800px) { body.page-home .twin-map-wrap{ grid-template-columns: 1fr; } } body.page-home .twin-map-svg{ width: 100%; height: auto; display: block; } body.page-home .twin-area{ cursor: pointer; transition: opacity .12s ease; transform-box: fill-box; transform-origin: center; } body.page-home .twin-area:hover, body.page-home .twin-area.selected{ stroke: #4fd9c4; stroke-width: 2; } body.page-home .twin-area:hover{ transform: scale(1.08); } body.page-home .twin-area circle{ transition: transform .15s ease; } body.page-home .twin-area-label{ font-family: var(--font-display); font-size: 14px; font-weight: 700; fill: #cbd5da; pointer-events: none; text-anchor: middle; } body.page-home .twin-detail{ background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.1); padding: 18px; min-height: 220px; } body.page-home .twin-detail .td-eyebrow{ font-family: var(--mono); font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: #4fd9c4; } body.page-home .twin-detail .td-name{ font-family: var(--font-display); font-size: 19.0px; font-weight: 650; color: #fff; margin-top: 4px; } body.page-home .twin-detail .td-total{ font-size: 14px; color: #a9b3ae; margin-top: 2px; } body.page-home .twin-detail .td-split{ display: flex; gap: 16px; margin-top: 14px; } body.page-home .twin-detail .td-split div{ font-size: 14px; color: #d6e6ef; } body.page-home .twin-detail .td-split b{ display: block; font-family: var(--font-display); font-size: 17.0px; color: #fff; } body.page-home .twin-detail .td-hh-label{ font-family: var(--mono); font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; color: #7d8b96; margin-top: 16px; border-top: 1px solid rgba(255,255,255,0.08); padding-top: 12px; } body.page-home .twin-detail .td-hh-row{ display: flex; justify-content: space-between; font-size: 14px; color: #cbd5da; padding: 3px 0; } body.page-home .twin-detail .td-hh-row b{ color: #4fd9c4; font-weight: 700; } body.page-home .twin-sql{ font-family: var(--mono); font-size: 14px; line-height: 1.7; color: #cfe8e2; white-space: pre-wrap; } body.page-home .twin-sql .kw{ color: #4fd9c4; } body.page-home .twin-sql .cm{ color: #6b7c85; } body.page-home .twin-residents{ display: flex; flex-direction: column; gap: 10px; } body.page-home .twin-res-row{ background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); font-size: 14px; color: #cbd5da; } body.page-home .twin-res-row.open{ border-left: 3px solid #4fd9c4; } body.page-home .twin-res-top{ display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; cursor: pointer; } body.page-home .twin-res-row b{ color: #ffffff; } body.page-home .twin-res-toggle{ font-family: var(--mono); font-size: 14px; color: #4fd9c4; flex-shrink: 0; } body.page-home .twin-res-detail{ display: none; padding: 0 14px 16px; } body.page-home .twin-res-detail.open{ display: block; } body.page-home .twin-journey-chain{ display: flex; align-items: flex-start; flex-wrap: wrap; gap: 4px; padding-top: 8px; } body.page-home .tj-node{ display: flex; flex-direction: column; align-items: center; text-align: center; width: 148px; flex-shrink: 0; } body.page-home .tj-head{ display: flex; flex-direction: column; align-items: center; } body.page-home .tj-node .je-icon{ width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; font-size: 15.0px; background: #06101a; border: 1px solid #4fd9c4; border-radius: 50%; flex-shrink: 0; } body.page-home .tj-node h4{ font-size: 14px; font-weight: 700; color: #ffffff; margin: 8px 0 0; } body.page-home .tj-node p{ font-size: 14px; color: #a9b3ae; margin-top: 4px; line-height: 1.4; } body.page-home .tj-arrow{ color: #4fd9c4; font-size: 16.0px; padding-top: 7px; flex-shrink: 0; } @media (max-width: 900px) { body.page-home .twin-journey-chain{ flex-direction: column; align-items: stretch; gap: 14px; } body.page-home .tj-node{ width: 100%; flex-direction: row; align-items: flex-start; text-align: left; gap: 12px; } body.page-home .tj-head{ flex-direction: row; align-items: center; gap: 10px; flex-shrink: 0; } body.page-home .tj-node h4{ margin: 0; } body.page-home .tj-arrow{ display: none; } } body.page-home .twin-cert{ display: flex; flex-direction: column; gap: 10px; } body.page-home .twin-cert-row{ display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); font-size: 14px; color: #d6e6ef; font-weight: 600; } body.page-home .twin-cert-icon{ margin-right: 8px; } body.page-home .twin-cert-row b{ font-family: var(--mono); font-size: 14px; font-weight: 700; letter-spacing: 0.04em; color: #0a141f; background: #3ddc97; padding: 4px 10px; border-radius: 999px; } body.page-home .twin-cert-row b.twin-cert-pending{ color: #9aa6ac; background: rgba(255,255,255,0.08); } body.page-home .twin-cert-pager{ display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 16px; } body.page-home .twin-cert-pager .pager-label{ color: #7d8b96; } body.page-home .twin-cert-total{ margin-top: 10px; text-align: center; font-family: var(--mono); font-size: 14px; color: #7d8b96; } body.page-home .twin-evidence{ width: 100%; border-collapse: collapse; font-size: 14px; } body.page-home .twin-evidence th{ text-align: left; font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; color: #7d8b96; font-weight: 700; padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,0.12); } body.page-home .twin-evidence td{ padding: 12px; color: #d6e6ef; border-bottom: 1px solid rgba(255,255,255,0.06); } body.page-home .twin-evidence tr:last-child td{ border-bottom: none; } body.page-home .twin-evidence td:first-child{ color: #ffffff; font-weight: 700; } body.page-home .twin-evidence td:last-child{ color: #4fd9c4; font-weight: 700; font-family: var(--mono); } body.page-home .twin-stats{ display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; } body.page-home .twin-stats-inbox{ margin-top: 0; padding: 18px 22px; border-bottom: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.03); } body.page-home .twin-stat{ background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; padding: 14px 22px; text-align: center; } body.page-home .twin-stat .v{ font-family: var(--font-display); font-size: 26.0px; font-weight: 650; color: #ffffff; } body.page-home .twin-stat .k{ font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.04em; color: #7d8b96; margin-top: 4px; } body.page-home .twin-checklist{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 24px; margin-top: 28px; } @media (max-width: 700px) { body.page-home .twin-checklist{ grid-template-columns: 1fr 1fr; } } body.page-home .twin-checklist div{ font-size: 14px; color: #d6e6ef; font-weight: 600; } body.page-home .twin-checklist-inbox{ margin-top: 0; padding: 22px 26px 4px; border-top: 1px solid rgba(255,255,255,0.12); } body.page-home .twin-cta{ margin-top: 32px; } body.page-home .twin-cta-inbox{ margin-top: 0; padding: 18px 26px 26px; } body.page-home .thesis-cell h4{ font-size: 18.0px; font-weight: 700; } body.page-home .thesis-cell p{ font-size: 16.0px; font-weight: 500; color: var(--ink-2); margin-top: 8px; line-height: 1.55; } /* ---- goal routing bridge ---- */ body.page-home .goal-grid{ display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; } @media (max-width: 1080px) { body.page-home .goal-grid{ grid-template-columns: repeat(3, 1fr); } } @media (max-width: 640px) { body.page-home .goal-grid{ grid-template-columns: 1fr 1fr; } } body.page-home .goal-card{ display: block; border: 1px solid var(--line); border-radius: 12px; padding: 18px 16px; background: var(--panel); transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; } body.page-home .goal-card:hover{ transform: translateY(-2px); border-color: var(--accent); box-shadow: 0 8px 20px -12px rgba(20,26,23,0.16); } body.page-home .goal-card h4{ font-size: 17.0px; font-weight: 700; letter-spacing: -0.01em; } body.page-home .goal-card p{ font-size: 15.0px; font-weight: 500; color: var(--ink-2); margin-top: 8px; line-height: 1.5; min-height: 36px; } body.page-home .goal-card .go{ display: block; margin-top: 12px; font-family: var(--mono); font-size: 14px; font-weight: 700; color: var(--accent-strong); } /* ---- use-case starting-point cards ---- */ body.page-home .usecase-section-label{ font-family: var(--mono); font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--ink-3); margin-top: 40px; margin-bottom: 4px; } body.page-home .usecase-section-label-flagship{ color: var(--accent-strong); margin-top: 56px; font-size: 14px; } body.page-home .usecase-grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 16px; opacity: 0.88; } @media (max-width: 800px) { body.page-home .usecase-grid{ grid-template-columns: 1fr; } } body.page-home .usecase-card{ border: 1px solid var(--line); padding: 24px; background: var(--panel); } body.page-home .uc-icon{ font-size: 34.0px; } body.page-home .uc-icon-featured{ font-size: 52.0px; } body.page-home .usecase-card h4, body.page-home .usecase-featured h4{ font-size: 23.0px; font-weight: 650; margin-top: 12px; } body.page-home .usecase-card p, body.page-home .usecase-featured > p{ font-size: 16.5px; color: var(--ink-2); margin-top: 10px; line-height: 1.55; } body.page-home .uc-label{ font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-3); font-weight: 700; margin-top: 20px; margin-bottom: 9px; } body.page-home .uc-tags{ display: flex; flex-wrap: wrap; gap: 7px; } body.page-home .uc-tags span{ font-family: var(--mono); font-size: 14px; font-weight: 600; color: var(--ink-2); background: var(--panel-2); border: 1px solid var(--line); padding: 5px 11px; border-radius: 999px; } body.page-home .uc-list{ list-style: none; margin: 0; padding: 0; } body.page-home .uc-list li{ font-size: 15.5px; color: var(--ink-2); padding: 4px 0; } body.page-home .uc-list li::before{ content: "✓ "; color: var(--accent-strong); font-weight: 700; } body.page-home .uc-list-wide{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px 16px; } @media (max-width: 560px) { body.page-home .uc-list-wide{ grid-template-columns: 1fr 1fr; } } body.page-home .uc-cascade{ font-size: 16.0px; font-weight: 700; color: var(--ink); line-height: 2; margin-top: 18px; } body.page-home .uc-cascade span{ color: var(--ink-3); font-weight: 500; font-size: 14.5px; } body.page-home .uc-cta{ display: inline-block; margin-top: 20px; font-family: var(--mono); font-size: 15.0px; font-weight: 700; color: var(--accent-strong); } body.page-home .usecase-featured{ position: relative; margin-top: 16px; padding: 52px; border: 3px solid var(--accent); background: linear-gradient(135deg, var(--teal-tint), var(--panel)); box-shadow: 0 24px 60px -28px rgba(15,158,143,0.35); } body.page-home .usecase-featured h4{ font-size: 30.0px; } body.page-home .usecase-featured > p{ font-size: 18.0px; max-width: 68ch; } body.page-home .usecase-featured-badge{ display: inline-block; font-family: var(--mono); font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--accent-ink); background: var(--accent); padding: 6px 13px; border-radius: 999px; } body.page-home .uc-cta-primary{ background: var(--accent); color: var(--accent-ink); padding: 12px 22px; border-radius: 999px; } body.page-home .uc-cta-primary:hover{ background: var(--accent-hover); } body.page-home .find-start-footer{ margin-top: 40px; text-align: center; } body.page-home .find-start-footer p{ font-size: 17.0px; color: var(--ink-2); max-width: 62ch; margin: 0 auto; } body.page-home .find-start-actions{ display: flex; gap: 14px; justify-content: center; margin-top: 20px; } /* ---- pricing cards ---- */ body.page-home .price-cards{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; } @media (max-width: 1080px) { body.page-home .price-cards{ grid-template-columns: repeat(2, 1fr); } } @media (max-width: 560px) { body.page-home .price-cards{ grid-template-columns: 1fr; } } body.page-home .price-card{ position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 14px; padding: 24px 20px 22px; background: var(--card-tint, var(--panel)); transition: transform .15s ease, box-shadow .15s ease; } body.page-home .price-card:hover{ transform: translateY(-3px); box-shadow: 0 10px 28px -14px rgba(23,32,28,0.18); } body.page-home .price-card.preferred{ border-color: var(--accent); box-shadow: 0 8px 24px -12px color-mix(in srgb, var(--accent) 45%, transparent); } body.page-home .price-card-ribbon{ position: absolute; top: -11px; left: 20px; background: var(--accent); color: var(--accent-ink); font-family: var(--mono); font-size: 14px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; box-shadow: 0 3px 8px -2px rgba(15,158,143,0.5); } body.page-home .price-card .tier{ font-family: var(--font-display); font-weight: 700; color: var(--ink); font-size: 18.0px; letter-spacing: -0.01em; } body.page-home .price-card .price{ display: block; font-family: var(--mono); font-weight: 650; color: var(--accent-strong); font-size: 26.0px; margin-top: 12px; letter-spacing: -0.01em; } body.page-home .price-card .desc{ font-size: 15.5px; font-weight: 500; color: var(--ink-2); line-height: 1.5; margin-top: 12px; flex: 1; } body.page-home .price-card .cta-badge{ display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin-top: 16px; font-family: var(--mono); font-size: 14px; font-weight: 700; letter-spacing: 0.02em; padding: 10px 14px; border-radius: 999px; background: var(--panel-2); color: var(--accent-strong); border: 1px solid var(--line); transition: background .15s ease, border-color .15s ease; } body.page-home .price-card .cta-badge:hover{ background: var(--accent); color: var(--accent-ink); border-color: var(--accent); } body.page-home .price-card.preferred .cta-badge{ background: var(--accent); color: var(--accent-ink); border-color: var(--accent); } body.page-home .price-card.preferred .cta-badge:hover{ background: var(--accent-hover); } body.page-home .price-legend{ display: flex; gap: 18px; flex-wrap: wrap; margin-top: 22px; font-size: 14px; font-weight: 500; color: var(--ink-2); } body.page-home .price-legend b{ color: var(--ink); font-weight: 700; } body.page-home .price-tier-label{ font-family: var(--mono); font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); font-weight: 700; margin: 40px 0 14px; } body.page-home .price-tier-label:first-of-type{ margin-top: 0; } body.page-home .price-cards.cols-3{ grid-template-columns: repeat(3, 1fr); } @media (max-width: 900px) { body.page-home .price-cards.cols-3{ grid-template-columns: 1fr; } } body.page-home .price-card .buyer{ font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.03em; color: var(--ink-3); margin-top: 6px; } body.page-home .price-card .price .period{ font-family: var(--font); font-size: 14px; font-weight: 600; color: var(--ink-3); margin-left: 4px; letter-spacing: 0; } /* ---- domain explorer ---- */ body.page-home .filter-row{ display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; } body.page-home .filter-chip{ font-family: var(--mono); font-size: 14px; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); color: var(--ink-2); cursor: pointer; } body.page-home .filter-chip:hover{ border-color: var(--accent); color: var(--ink); } body.page-home .filter-chip.active{ background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-weight: 700; } body.page-home .domain-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; } @media (max-width: 980px) { body.page-home .domain-grid{ grid-template-columns: repeat(2, 1fr); } } @media (max-width: 560px) { body.page-home .domain-grid{ grid-template-columns: 1fr; } } body.page-home .domain-card{ background: var(--panel); padding: 18px; display: none; } body.page-home .domain-card.show{ display: block; } body.page-home .domain-card .cat{ font-family: var(--mono); font-size: 14px; color: var(--accent-strong); text-transform: uppercase; letter-spacing: 0.06em; } body.page-home .domain-card h4{ font-size: 18.0px; font-weight: 700; margin-top: 8px; } body.page-home .domain-card p{ font-size: 15.0px; font-weight: 500; color: var(--ink-2); margin-top: 8px; line-height: 1.5; } body.page-home .domain-pager{ display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 18px; } body.page-home .pager-btn{ font-family: var(--mono); font-size: 14px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel); color: var(--ink-2); cursor: pointer; } body.page-home .pager-btn:hover:not(:disabled){ border-color: var(--accent); color: var(--accent-strong); } body.page-home .pager-btn:disabled{ opacity: 0.4; cursor: not-allowed; } body.page-home .pager-label{ font-family: var(--mono); font-size: 14px; color: var(--ink-3); min-width: 56px; text-align: center; } /* ---- evidence / chart dashboard ---- */ body.page-home .evidence-grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; } @media (max-width: 1000px) { body.page-home .evidence-grid{ grid-template-columns: 1fr; } } body.page-home .journey-grid{ display: grid; grid-template-columns: 300px 1fr; gap: 32px; align-items: start; } @media (max-width: 800px) { body.page-home .journey-grid{ grid-template-columns: 1fr; } } body.page-home .journey-card{ background: var(--panel); border: 1px solid var(--accent); padding: 22px; position: sticky; top: 92px; } body.page-home .journey-card .jc-eyebrow{ font-family: var(--mono); font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent-strong); font-weight: 700; } body.page-home .journey-card .jc-name{ font-family: var(--font-display); font-size: 22.0px; font-weight: 650; margin-top: 6px; } body.page-home .journey-card .jc-row{ font-size: 14px; color: var(--ink-2); margin-top: 12px; } body.page-home .journey-card .jc-row b{ color: var(--ink); font-weight: 700; } body.page-home .journey-card .jc-note{ font-size: 14px; color: var(--ink-3); font-style: italic; margin-top: 16px; border-top: 1px solid var(--line-soft); padding-top: 12px; } body.page-home .journey-card .jc-relations{ margin-top: 16px; border-top: 1px solid var(--line-soft); padding-top: 12px; } body.page-home .journey-card .jc-relations-label{ font-family: var(--mono); font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-3); font-weight: 700; margin-bottom: 8px; } body.page-home .journey-card .jc-rel-row{ font-size: 14px; color: var(--ink-2); padding: 3px 0; } body.page-home .journey-card .jc-rel-row b{ float: right; color: var(--accent-strong); font-weight: 700; } body.page-home .journey-timeline{ position: relative; padding-left: 40px; } body.page-home .journey-timeline::before{ content: ""; position: absolute; left: 15px; top: 6px; bottom: 6px; width: 1px; background: var(--line); } body.page-home .journey-event{ position: relative; padding-bottom: 26px; } body.page-home .journey-event:last-child{ padding-bottom: 0; } body.page-home .journey-event .je-icon{ position: absolute; left: -40px; top: -2px; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; font-size: 14px; background: var(--panel); border: 1px solid var(--accent); border-radius: 50%; } body.page-home .journey-event h4{ font-size: 15.0px; font-weight: 700; } body.page-home .journey-event p{ font-size: 14px; color: var(--ink-2); margin-top: 4px; line-height: 1.5; } body.page-home .journey-event .je-schema{ display: inline-block; font-family: var(--font); font-size: 14px; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; color: var(--accent-strong); background: var(--teal-tint); padding: 3px 9px; border-radius: 999px; margin-top: 6px; } body.page-home .journey-cascade{ margin-top: 8px; padding: 22px 26px; background: #06101a; color: #ffffff; } body.page-home .journey-cascade .jca-title{ font-weight: 700; font-size: 15.0px; margin-bottom: 12px; } body.page-home .journey-cascade .jca-chain{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; color: #a9b3ae; } body.page-home .journey-cascade .jca-chain b{ color: #4fd9c4; font-weight: 700; } body.page-home .journey-cascade .jca-arrow{ color: #4fd9c4; } body.page-home .journey-conclusion{ margin-top: 10px; padding: 20px 24px; background: var(--teal-tint); border-left: 3px solid var(--accent); font-size: 14.5px; font-weight: 600; color: var(--ink); line-height: 1.7; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; } body.page-home .journey-more-cta{ flex-shrink: 0; font-family: var(--font-display); font-size: 14px; font-weight: 700; color: var(--accent-ink); background: var(--accent); padding: 10px 18px; border-radius: 999px; white-space: nowrap; } body.page-home .journey-more-cta:hover{ background: var(--accent-hover); } body.page-home .chart-card{ background: var(--panel); border: 1px solid var(--line); padding: 20px; box-shadow: 0 1px 2px rgba(20,26,23,0.04), 0 4px 16px -8px rgba(20,26,23,0.08); } body.page-home .chart-head{ display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 4px; } body.page-home .chart-title{ font-size: 14px; font-weight: 700; } body.page-home .chart-sub{ font-size: 14px; color: var(--ink-3); margin-top: 3px; } body.page-home .chart-browse-link{ font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 700; color: var(--accent-strong); white-space: nowrap; background: var(--teal-tint); padding: 4px 9px; border-radius: 999px; margin-right: 8px; } body.page-home .chart-browse-link:hover{ background: var(--accent); color: var(--accent-ink); } body.page-home .chart-toggle{ display: flex; gap: 4px; } body.page-home .chart-toggle button{ font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.04em; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: var(--ink-3); cursor: pointer; } body.page-home .chart-toggle button.active{ background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-weight: 700; } body.page-home .chart-facts{ display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; } body.page-home .chart-facts:empty{ margin-top: 0; } body.page-home .chart-fact{ display: flex; align-items: baseline; gap: 6px; padding: 8px 14px; background: var(--panel-2); border: 1px solid var(--line); font-family: var(--font-display); } body.page-home .chart-fact .v{ font-size: 18.0px; font-weight: 650; color: var(--ink); } body.page-home .chart-fact .k{ font-size: 14px; font-family: var(--mono); color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; } body.page-home .chart-fact.male .v{ color: var(--accent-strong); } body.page-home .chart-fact.female .v{ color: var(--amber); } body.page-home .chart-legend{ display: flex; gap: 14px; margin: 10px 0 4px; font-size: 14px; color: var(--ink-2); } body.page-home .chart-legend .sw{ display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 6px; vertical-align: middle; } body.page-home .chart-svg-wrap{ position: relative; margin-top: 8px; } body.page-home .chart-tooltip{ position: absolute; pointer-events: none; background: #17201c; border: 1px solid rgba(255,255,255,0.12); border-radius: 6px; padding: 7px 10px; font-size: 14px; color: #fff; white-space: nowrap; opacity: 0; transition: opacity .1s ease; transform: translate(-50%, -110%); z-index: 5; } body.page-home .chart-tooltip.show{ opacity: 1; } body.page-home .chart-tooltip b{ color: #5fe0cf; } body.page-home .chart-tooltip.event{ white-space: normal; max-width: 260px; } body.page-home .city-badge-tag{ font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; margin-left: 6px; opacity: 0.85; } body.page-home .filter-chip:not(.active) .city-badge-tag{ display: none; } body.page-home .filter-chip-soon{ display: inline-block; background: transparent; border: 1px dashed rgba(130,140,148,0.4); color: #9aa6ac; cursor: default; } body.page-home .band-dark .filter-chip-soon{ border-color: rgba(255,255,255,0.18); color: #55636d; } body.page-home .city-float-toggle{ position: fixed; top: 78px; right: 20px; z-index: 45; display: flex; flex-wrap: wrap; gap: 6px; max-width: 250px; background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 12px; box-shadow: 0 10px 30px -10px rgba(12,26,36,0.25); } body.page-home .city-float-toggle .filter-chip{ font-size: 14px; padding: 6px 11px; } body.page-home .city-float-toggle .filter-chip-soon{ border: 1px dashed rgba(130,140,148,0.4); color: #9aa6ac; } @media (max-width: 900px) { body.page-home .city-float-toggle{ display: none; } } body.page-home .chart-data-table{ width: 100%; border-collapse: collapse; font-family: var(--mono); font-size: 14px; display: none; } body.page-home .chart-data-table.show{ display: table; } body.page-home .chart-svg-wrap.hide{ display: none; } body.page-home .chart-data-table th{ text-align: left; color: var(--ink-3); font-weight: 600; padding: 5px 6px; border-bottom: 1px solid var(--line); font-size: 14px; text-transform: uppercase; } body.page-home .chart-data-table td{ padding: 5px 6px; border-bottom: 1px solid var(--line-soft); color: var(--ink-2); } body.page-home .chart-caption{ font-size: 14px; color: var(--ink-3); font-style: italic; margin-top: 10px; } /* ---- city comparison ---- */ body.page-home .city-table-wrap{ border: 1px solid var(--line); border-radius: 12px; overflow: hidden; } body.page-home table.city-table{ width: 100%; border-collapse: collapse; min-width: 520px; } body.page-home .city-table th{ text-align: left; padding: 12px 20px; background: var(--panel-2); font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-3); border-bottom: 1px solid var(--line); } body.page-home .city-table th.num, body.page-home .city-table td.num{ text-align: right; } body.page-home .city-table td{ padding: 13px 20px; border-bottom: 1px solid var(--line-soft); font-size: 14px; font-weight: 500; color: var(--ink-2); background: var(--panel); } body.page-home .city-table tr:last-child td{ border-bottom: none; } body.page-home .city-table td.label{ color: var(--ink); font-weight: 600; } body.page-home .city-table td.num{ font-family: var(--mono); color: var(--ink); } /* ---- certification checklist ---- */ body.page-home .cert-grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 32px; margin: 0; padding: 0; } @media (max-width: 620px) { body.page-home .cert-grid{ grid-template-columns: 1fr; } } body.page-home .cert-grid li{ list-style: none; font-size: 14.5px; font-weight: 500; color: var(--ink-2); padding: 9px 0 9px 26px; position: relative; border-top: 1px solid var(--line-soft); } body.page-home .cert-grid li:nth-child(-n/**/+2){ border-top: none; } body.page-home .cert-grid li::before{ content: "✓"; position: absolute; left: 0; color: var(--good); font-weight: 700; } /* ---- final cta ---- */ body.page-home .cta-panel{ text-align: center; background: color-mix(in srgb, var(--accent) 7%, var(--panel)); border: 1px solid var(--line); border-radius: 16px; padding: 56px 32px; } body.page-home .cta-panel h2{ font-size: clamp(24px, 3.4vw, 34px); font-weight: 650; } body.page-home .cta-panel p{ color: var(--ink-2); margin-top: 12px; } body.page-home .cta-actions{ display: flex; gap: 12px; justify-content: center; margin-top: 26px; flex-wrap: wrap; } body.page-home footer{ padding: 64px 0 32px; background: #06101a; border-bottom: none; } body.page-home .footer-row{ display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; font-size: 14px; color: #7d8b96; } body.page-home .footer-row a:hover{ color: #4fd9c4; } body.page-home .trust-pills{ display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 8px; } body.page-home .trust-pills span{ font-family: var(--mono); font-size: 14px; font-weight: 600; color: var(--ink-2); background: var(--panel-2); border: 1px solid var(--line); padding: 7px 15px; border-radius: 999px; } body.page-home .footer-grid{ display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr; gap: 32px; padding-bottom: 44px; border-bottom: 1px solid rgba(255,255,255,0.1); } @media (max-width: 900px) { body.page-home .footer-grid{ grid-template-columns: 1fr 1fr; } } @media (max-width: 560px) { body.page-home .footer-grid{ grid-template-columns: 1fr; } } body.page-home .footer-brand .logo{ font-family: var(--font-display); font-size: 20.0px; font-weight: 650; color: #ffffff; } body.page-home .footer-brand .logo span{ color: #4fd9c4; } body.page-home .footer-brand p{ font-size: 14px; color: #7d8b96; margin-top: 8px; } body.page-home .footer-brand-desc{ font-size: 14px; line-height: 1.6; color: #7d8b96; } body.page-home .footer-brand-desc b{ color: #cbd5da; } body.page-home .footer-brand-stats{ display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 16px; font-family: var(--mono); font-size: 14px; color: #7d8b96; } body.page-home .footer-brand-stats b{ color: #4fd9c4; font-weight: 700; } body.page-home #built-for{ padding-bottom: 44px; } body.page-home .footer-col-title{ font-family: var(--mono); font-size: 14px; text-transform: uppercase; letter-spacing: 0.06em; color: #7d8b96; font-weight: 700; margin-bottom: 14px; } body.page-home .footer-col{ display: flex; flex-direction: column; gap: 10px; } body.page-home .footer-col a{ font-size: 14px; color: #cbd5da; } body.page-home .footer-col a:hover{ color: #4fd9c4; } body.page-home .footer-bottom{ padding-top: 24px; } /* V4.5 integration-only overrides — preserve the attached homepage visuals and diagrams. */ body.page-home .logo{ white-space: nowrap; } body.page-home .footer-brand .logo{ white-space: nowrap; } body.page-home .fcte-certified-badge, body.page-home .certified-badge, body.page-home .badge-certified{ background:#163A42; color:#fff; border-color:#163A42; } /* ===== COMPONENT: marketing.css ===== */ /* V5 component foundation: unique layout/visual behavior only; fidelra.css owns global grammar. */ body.page-family-marketing{--ink:#0b3138;--ink2:#153e46;--teal:#173f46;--teal2:#21575f;--mint:#97cbcb;--mint2:#dff1ef;--bg:#f7faf9;--paper:#fff;--line:#d7e2e0;--muted:#5f787f;--muted2:#81969a;--soft:#eef5f4;--ok:#16685f;--warn:#946c25;--bad:#a34a42;--shadow:0 20px 55px rgba(9,47,54,.08);--r:18px;--max:1180px;--mono:ui-monospace,SFMono-Regular,Consolas,monospace} body.page-family-marketing *{box-sizing:border-box}body.page-family-marketing{scroll-behavior:smooth}body.page-family-marketing{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.55}body.page-family-marketing a{color:inherit;text-decoration:none}body.page-family-marketing button, body.page-family-marketing input, body.page-family-marketing select{font:inherit}body.page-family-marketing .wrap{max-width:var(--max);margin:auto;padding:0 26px}body.page-family-marketing .global-header{height:64px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:60}body.page-family-marketing .global-header .wrap{height:100%;display:flex;align-items:center;gap:30px}body.page-family-marketing .brand{font-size:14px;font-weight:650;letter-spacing:.12em;color:#28727a;white-space:nowrap}body.page-family-marketing .brand b{font-size:17.0px;color:var(--ink);letter-spacing:-.03em;margin-left:7px}body.page-family-marketing .brand small{font-size:14px;color:var(--muted2);margin-left:6px}body.page-family-marketing .global-nav{display:flex;gap:25px;margin-left:auto;align-items:center;font-size:14px;font-weight:700;color:#47656b}body.page-family-marketing .global-nav a:hover, body.page-family-marketing .global-nav a.active{color:var(--ink)}body.page-family-marketing .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:9px;border:1px solid var(--line);font-weight:650;font-size:14px;background:#fff;cursor:pointer}body.page-family-marketing .btn.primary{background:var(--ink);color:#fff;border-color:var(--ink)}body.page-family-marketing .btn.mint{background:var(--mint);border-color:var(--mint);color:var(--ink)}body.page-family-marketing .btn.ghost{background:transparent}body.page-family-marketing .btn.small{min-height:36px;padding:0 13px;font-size:14px}body.page-family-marketing .go{font-size:14px;font-weight:650;color:#28727a}body.page-family-marketing .city-bar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:64px;z-index:55}body.page-family-marketing .city-bar .wrap{display:flex;align-items:center;min-height:62px;gap:20px}body.page-family-marketing .city-identity{display:flex;align-items:center;gap:10px;font-weight:650;white-space:nowrap}body.page-family-marketing .city-dot{width:9px;height:9px;border-radius:50%;background:var(--mint)}body.page-family-marketing .city-select{border:0;background:transparent;font-weight:650;color:var(--ink);padding:7px}body.page-family-marketing .city-nav{display:flex;gap:4px;margin-left:auto;overflow:auto}body.page-family-marketing .city-nav a{padding:20px 10px 17px;font-size:14px;font-weight:650;color:#667e83;border-bottom:3px solid transparent;white-space:nowrap}body.page-family-marketing .city-nav a.active{color:var(--ink);border-color:var(--mint)} body.page-family-marketing .hero{background:var(--ink);color:#fff;padding:80px 0 72px}body.page-family-marketing .hero .eyebrow, body.page-family-marketing .section-head .eyebrow, body.page-family-marketing .doc-label{display:flex;align-items:center;gap:9px;text-transform:uppercase;letter-spacing:.18em;font-size:14px;font-weight:650;color:#62aeb0}body.page-family-marketing .hero .eyebrow:before, body.page-family-marketing .section-head .eyebrow:before, body.page-family-marketing .doc-label:before{content:'';width:24px;height:1px;background:var(--mint)}body.page-family-marketing .hero h1{font-size:clamp(48px,6.2vw,82px);line-height:.95;letter-spacing:-.055em;margin:18px 0 22px;max-width:930px;font-weight:650}body.page-family-marketing .hero p{font-size:17.0px;max-width:760px;color:#c6d7d8;margin:0 0 28px}body.page-family-marketing .hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}body.page-family-marketing .hero .btn.ghost{border-color:#628086;color:#fff}body.page-family-marketing .city-hero{padding:66px 0 58px}body.page-family-marketing .city-hero h1{font-size:clamp(46px,5.4vw,72px);max-width:890px}body.page-family-marketing .city-hero-grid{display:grid;grid-template-columns:1.35fr .72fr;gap:48px;align-items:end}body.page-family-marketing .asset-card{border:1px solid #31585f;border-radius:18px;padding:24px;background:rgba(255,255,255,.035)}body.page-family-marketing .asset-card .asset-label{font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:#8eb6b8;font-weight:650}body.page-family-marketing .asset-card strong{display:block;font-size:27.0px;margin:9px 0 4px}body.page-family-marketing .asset-card p{font-size:14px;margin:0;color:#a9c0c2}body.page-family-marketing .asset-stamp{margin-top:18px;padding-top:16px;border-top:1px solid #31585f;display:flex;justify-content:space-between;gap:8px;font:700 14px/1.4 var(--mono);color:#a6c4c6}body.page-family-marketing section{padding:66px 0}body.page-family-marketing section.tight{padding:34px 0}body.page-family-marketing section.band{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}body.page-family-marketing .section-head{margin-bottom:28px;max-width:900px}body.page-family-marketing .section-head h2{font-size:clamp(34px,4.5vw,52px);line-height:1.02;letter-spacing:-.045em;margin:14px 0 12px;font-weight:650}body.page-family-marketing .section-head p{font-size:15.0px;color:var(--muted);max-width:760px;margin:0}body.page-family-marketing .grid{display:grid;gap:14px}body.page-family-marketing .grid.c2{grid-template-columns:repeat(2,1fr)}body.page-family-marketing .grid.c3{grid-template-columns:repeat(3,1fr)}body.page-family-marketing .grid.c4{grid-template-columns:repeat(4,1fr)}body.page-family-marketing .card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px}body.page-family-marketing .card h3{font-size:18.0px;line-height:1.1;margin:8px 0}body.page-family-marketing .card p{font-size:14px;color:var(--muted);margin:0}body.page-family-marketing .card.dark{background:var(--ink);color:#fff;border-color:var(--ink)}body.page-family-marketing .card.dark p{color:#b9cdcf}body.page-family-marketing .kicker{font:800 14px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.13em;color:#5a858b}body.page-family-marketing .metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:#fff}body.page-family-marketing .metric{padding:22px;border-right:1px solid var(--line)}body.page-family-marketing .metric:last-child{border-right:0}body.page-family-marketing .metric strong{display:block;font-size:30.0px;letter-spacing:-.04em}body.page-family-marketing .metric span{font:700 14px/1.5 var(--mono);color:#759096;text-transform:uppercase}body.page-family-marketing .pill{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;font:800 14px/1 var(--mono);letter-spacing:.06em}body.page-family-marketing .pill.live, body.page-family-marketing .pill.pass{background:#e8f6f2;color:var(--ok)}body.page-family-marketing .pill.warn{background:#fbf1dd;color:var(--warn)}body.page-family-marketing .pill.future{background:#edf1f0;color:#879799}body.page-family-marketing .notice{padding:14px 17px;border-radius:12px;background:#eef7f5;border:1px solid #d2e7e3;font-size:14px;color:#496d72}body.page-family-marketing .notice strong{color:var(--ink)} body.page-family-marketing /* Gateway */.gateway-hero .hero-inner{display:grid;grid-template-columns:1.35fr .65fr;gap:50px;align-items:end}body.page-family-marketing .gateway-hero .hero-aside{border-left:1px solid #31545b;padding-left:28px}body.page-family-marketing .gateway-hero .hero-aside strong{display:block;font-size:26.0px;margin-bottom:8px}body.page-family-marketing .gateway-hero .hero-aside p{font-size:14px;margin:0;color:#a7bec0}body.page-family-marketing .catalog-toolbar{display:flex;gap:16px;justify-content:space-between;align-items:end;margin:24px 0 20px}body.page-family-marketing .searchbox{display:grid;gap:6px;font-size:14px;text-transform:uppercase;font-weight:650;letter-spacing:.13em;color:#628087}body.page-family-marketing .searchbox input{width:360px;max-width:100%;border:1px solid var(--line);border-radius:9px;padding:12px;background:#fff;color:var(--ink)}body.page-family-marketing .filterbar{display:flex;gap:6px}body.page-family-marketing .filterbar button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 12px;font-size:14px;font-weight:650;color:#648087}body.page-family-marketing .filterbar button.active{background:var(--ink);color:#fff;border-color:var(--ink)}body.page-family-marketing .city-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}body.page-family-marketing .city-grid .card{min-height:184px;display:flex;flex-direction:column}body.page-family-marketing .city-grid .card .go{margin-top:auto}body.page-family-marketing .city-grid .future-card{opacity:.43;filter:grayscale(.9);background:#f2f4f3;pointer-events:none}body.page-family-marketing .pager{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:24px}body.page-family-marketing .pager button{border:0;background:none;font-weight:650;color:var(--ink);cursor:pointer}body.page-family-marketing .pager button:disabled{opacity:.25;cursor:default}body.page-family-marketing .pager span{font:800 14px/1.4 var(--mono);color:#789095}body.page-family-marketing .hidden{display:none} body.page-family-marketing /* High-value global sections */.impact-flow{display:grid;grid-template-columns:1fr 70px 1fr 70px 1fr;gap:8px;align-items:stretch}body.page-family-marketing .impact-node{padding:24px;border:1px solid var(--line);background:#fff}body.page-family-marketing .impact-node b{display:block;font-size:17.0px}body.page-family-marketing .impact-node span{font-size:14px;color:var(--muted)}body.page-family-marketing .impact-arrow{display:flex;align-items:center;justify-content:center;font-size:28.0px;color:#73aeb0}body.page-family-marketing .question-box{background:var(--ink);color:#fff;padding:28px;border-radius:16px}body.page-family-marketing .question-box .q{font-size:25.0px;line-height:1.15;font-weight:650}body.page-family-marketing .question-box .path{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}body.page-family-marketing .question-box .path span{border:1px solid #41646a;border-radius:999px;padding:7px 10px;font:800 14px var(--mono);color:#bcd2d3} body.page-family-marketing /* Overview explorer */.explorer{background:#0d3037;color:#fff;border:1px solid #294f56}body.page-family-marketing .explorer-tabs{display:flex;border-bottom:1px solid #294f56;overflow:auto}body.page-family-marketing .explorer-tabs button{flex:1;min-width:120px;padding:16px;border:0;background:none;color:#7e9da2;font-weight:650;cursor:pointer;border-bottom:3px solid transparent}body.page-family-marketing .explorer-tabs button.active{color:#fff;border-color:var(--mint)}body.page-family-marketing .explorer-panel{display:none;padding:26px}body.page-family-marketing .explorer-panel.active{display:block}body.page-family-marketing .resident-row{border:1px solid #31545b;padding:14px 16px;margin:8px 0;background:#123840}body.page-family-marketing .resident-row b{font-size:14px}body.page-family-marketing .resident-row span{font:700 14px var(--mono);color:#96b0b4;margin-left:8px}body.page-family-marketing .proof-strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #31545b;margin-top:18px}body.page-family-marketing .proof-strip div{padding:17px;border-right:1px solid #31545b}body.page-family-marketing .proof-strip div:last-child{border:0}body.page-family-marketing .proof-strip b{display:block;font-size:23.0px}body.page-family-marketing .proof-strip span{font:700 14px var(--mono);color:#91aeb2;text-transform:uppercase}body.page-family-marketing .mini-table{width:100%;border-collapse:collapse;font-size:14px}body.page-family-marketing .mini-table th, body.page-family-marketing .mini-table td{text-align:left;padding:9px 10px;border-bottom:1px solid #31545b}body.page-family-marketing .mini-table th{color:#81a5a8;font:800 14px var(--mono);text-transform:uppercase}body.page-family-marketing .mini-table td{color:#d5e1e2}body.page-family-marketing .city-system-map{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}body.page-family-marketing .city-system-map span{padding:14px 8px;border:1px solid #31545b;text-align:center;font:800 14px var(--mono);color:#c0d2d4} body.page-family-marketing /* Data */.entity-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}body.page-family-marketing .entity-card{padding:20px;background:#fff;border:1px solid var(--line)}body.page-family-marketing .entity-card b{display:block;font-size:16.0px}body.page-family-marketing .entity-card span{font-size:14px;color:var(--muted)}body.page-family-marketing .sql-card{background:#0b2930;border:1px solid #244b52;color:#dbe7e8}body.page-family-marketing .sql-head{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #244b52;font:800 14px var(--mono);text-transform:uppercase;letter-spacing:.1em;color:#8fb0b3}body.page-family-marketing .sql-card pre{margin:0;padding:20px;overflow:auto;font:12px/1.65 var(--mono);white-space:pre}body.page-family-marketing .query-output{background:#fff;border:1px solid var(--line);overflow:auto}body.page-family-marketing .data-table{width:100%;border-collapse:collapse;font-size:14px}body.page-family-marketing .data-table th{position:sticky;top:0;background:#eef5f4;z-index:2;text-transform:uppercase;letter-spacing:.08em;font:800 14px var(--mono);color:#51737a}body.page-family-marketing .data-table th, body.page-family-marketing .data-table td{padding:11px 13px;border-bottom:1px solid #e2e8e7;text-align:left}body.page-family-marketing .data-table td{color:#59747a}body.page-family-marketing .scroll-pane{max-height:470px;overflow:auto;border:1px solid var(--line);background:#fff}body.page-family-marketing .path-chain{display:flex;align-items:center;gap:8px;flex-wrap:wrap}body.page-family-marketing .path-chain span{border:1px solid var(--line);background:#fff;padding:10px 13px;font:800 14px var(--mono)}body.page-family-marketing .path-chain i{font-style:normal;color:#71a9ab} body.page-family-marketing /* Domains index */.domain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}body.page-family-marketing .domain-card{background:#fff;border:1px solid var(--line);padding:20px;border-radius:14px;display:flex;flex-direction:column;min-height:160px}body.page-family-marketing .domain-card h3{font-size:17.0px;margin:7px 0}body.page-family-marketing .domain-card p{font-size:14px;color:var(--muted);margin:0 0 14px}body.page-family-marketing .domain-card .go{margin-top:auto}body.page-family-marketing .domain-meta{display:flex;justify-content:space-between;align-items:center}body.page-family-marketing .arch-groups details{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:8px}body.page-family-marketing .arch-groups summary{cursor:pointer;padding:15px 18px;font-weight:650;font-size:14px}body.page-family-marketing .arch-groups .inside{padding:0 18px 17px;display:flex;flex-wrap:wrap;gap:7px}body.page-family-marketing .arch-groups .inside span{font-size:14px;background:#f0f4f3;border-radius:999px;padding:6px 9px;color:#657d82} body.page-family-marketing /* Rich domain documentation */.domain-doc-hero .phase{display:inline-flex;align-items:center;gap:7px;border:1px solid #3d666c;border-radius:999px;padding:6px 10px;font:800 14px var(--mono);color:#b8d0d1}body.page-family-marketing .domain-doc-hero .phase:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--mint)}body.page-family-marketing .hero-stat-strip{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid #31545b;margin-top:28px}body.page-family-marketing .hero-stat-strip div{padding:17px;border-right:1px solid #31545b}body.page-family-marketing .hero-stat-strip div:last-child{border:0}body.page-family-marketing .hero-stat-strip b{display:block;font-size:16.0px}body.page-family-marketing .hero-stat-strip span{font:700 14px var(--mono);color:#91aeb2;text-transform:uppercase}body.page-family-marketing .page-layout{display:grid;grid-template-columns:220px 1fr;gap:34px}body.page-family-marketing .sticky-aside{position:sticky;top:148px;align-self:start}body.page-family-marketing .toc{background:#fff;border:1px solid var(--line);padding:18px}body.page-family-marketing .toc b{font-size:14px;text-transform:uppercase;letter-spacing:.12em}body.page-family-marketing .toc a{display:block;padding:9px 0;font-size:14px;border-bottom:1px solid #edf1f0;color:#536f75}body.page-family-marketing .toc a:last-child{border:0}body.page-family-marketing .doc-section{padding:0 0 54px;margin-bottom:54px;border-bottom:1px solid var(--line)}body.page-family-marketing .doc-section:last-child{border-bottom:0}body.page-family-marketing .doc-section h2{font-size:clamp(30px,4vw,44px);line-height:1.03;letter-spacing:-.04em;margin:10px 0 14px;font-weight:650}body.page-family-marketing .doc-section>p{font-size:14px;color:var(--muted);max-width:780px}body.page-family-marketing .cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}body.page-family-marketing .cap-card{background:#fff;border:1px solid var(--line);padding:19px}body.page-family-marketing .cap-card .n{font:800 14px var(--mono);color:#4e878b}body.page-family-marketing .cap-card h3{font-size:15.0px;margin:7px 0}body.page-family-marketing .network-wrap{background:#f1f6f5;border:1px solid var(--line);padding:28px;margin-top:18px}body.page-family-marketing .network-center{text-align:center;margin-bottom:24px}body.page-family-marketing .network-center span{display:inline-block;background:var(--ink);color:#fff;padding:12px 18px;font:900 14px var(--mono);text-transform:uppercase}body.page-family-marketing .network-links{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}body.page-family-marketing .network-links a, body.page-family-marketing .network-links span{background:#fff;border:1px solid var(--line);padding:11px;text-align:center;font:800 14px var(--mono)}body.page-family-marketing .timeline-chain{display:flex;align-items:center;flex-wrap:wrap;margin-top:18px}body.page-family-marketing .timeline-step{padding:9px 13px;border:1px solid var(--line);background:#fff;border-radius:999px;font:800 14px var(--mono)}body.page-family-marketing .timeline-arrow{padding:0 8px;color:#79a4a7}body.page-family-marketing .boundary-list{display:grid;gap:9px}body.page-family-marketing .boundary{padding:15px 17px;border-left:3px solid #6aa7a9;background:#eef5f4;font-size:14px;color:#527177}body.page-family-marketing .related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}body.page-family-marketing .related-grid a{padding:15px;border:1px solid var(--line);background:#fff;font-weight:650;font-size:14px} body.page-family-marketing /* Evidence / certification */.evidence-chain{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}body.page-family-marketing .chain-step{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}body.page-family-marketing .chain-step b{display:block;font-size:14px}body.page-family-marketing .chain-step span{display:block;margin-top:5px;font-size:14px;color:var(--muted)}body.page-family-marketing .assurance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}body.page-family-marketing .assurance{padding:20px;border:1px solid var(--line);border-radius:14px;background:#fff}body.page-family-marketing .assurance b{font-size:15.0px}body.page-family-marketing .assurance p{font-size:14px;color:var(--muted);margin:7px 0 0}body.page-family-marketing .cert-score{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:#fff}body.page-family-marketing .cert-score div{padding:20px;border-right:1px solid var(--line)}body.page-family-marketing .cert-score div:last-child{border:0}body.page-family-marketing .cert-score b{font-size:25.0px;display:block}body.page-family-marketing .cert-score span{font:800 14px var(--mono);color:#69868c;text-transform:uppercase}body.page-family-marketing .finding-card{border:1px solid var(--line);background:#fff;padding:17px}body.page-family-marketing .finding-card .status{font:800 14px var(--mono);color:var(--ok)}body.page-family-marketing .finding-card h3{font-size:15.0px;margin:6px 0}body.page-family-marketing .finding-card p{font-size:14px;color:var(--muted);margin:0}body.page-family-marketing .release-card{display:grid;grid-template-columns:115px 160px 1fr 60px;gap:15px;align-items:start;padding:17px 0;border-bottom:1px solid var(--line)}body.page-family-marketing .release-card:last-child{border-bottom:0}body.page-family-marketing .release-card .date{font:800 14px var(--mono);color:#618188}body.page-family-marketing .release-card .domain{font-weight:650;font-size:14px}body.page-family-marketing .release-card p{margin:0;color:var(--muted);font-size:14px}body.page-family-marketing .price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}body.page-family-marketing .price-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:23px;display:flex;flex-direction:column}body.page-family-marketing .price-card.featured{border:2px solid var(--teal2);box-shadow:var(--shadow)}body.page-family-marketing .price-card .price{font-size:35.0px;letter-spacing:-.04em;font-weight:650;margin:14px 0}body.page-family-marketing .price-card ul{padding-left:18px;margin:14px 0 22px;color:var(--muted);font-size:14px}body.page-family-marketing .price-card .btn{margin-top:auto}body.page-family-marketing .two-col{display:grid;grid-template-columns:1fr 1fr;gap:24px}body.page-family-marketing .three-col{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}body.page-family-marketing .download-row{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px} body.page-family-marketing /* Expanded Fidelra footer */.footer{background:#092a30;color:#afc5c6;padding:56px 0 24px;margin-top:70px}body.page-family-marketing .footer-grid{display:grid;grid-template-columns:1.55fr repeat(4,1fr);gap:28px}body.page-family-marketing .footer-brand .logo{font-size:19.0px;font-weight:650;color:#fff;letter-spacing:-.02em}body.page-family-marketing .footer-brand .logo span{color:var(--mint)}body.page-family-marketing .footer-brand .fidelra-link{display:inline-block;margin-top:6px;font:900 14px var(--mono);letter-spacing:.08em;color:var(--mint)}body.page-family-marketing .footer-brand-desc{font-size:14px;line-height:1.55;max-width:370px}body.page-family-marketing .footer-brand-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-top:17px}body.page-family-marketing .footer-brand-stats span{font:700 14px/1.4 var(--mono);color:#88a7aa;border-top:1px solid #234850;padding-top:7px}body.page-family-marketing .footer-brand-stats b{color:#d7e7e8}body.page-family-marketing .footer-col-title{font-size:14px;font-weight:650;color:#fff;margin-bottom:12px}body.page-family-marketing .footer-col a{display:block;font-size:14px;margin:8px 0;color:#abc5c7}body.page-family-marketing .footer-col a:hover{color:#fff}body.page-family-marketing .footer-bottom{border-top:1px solid #234850;margin-top:32px;padding-top:18px;display:flex;justify-content:space-between;gap:20px;font-size:14px;color:#789a9e}body.page-family-marketing .footer-bottom a{color:#b6d0d2} @media(max-width:960px){body.page-family-marketing .global-nav a:not(.btn){display:none}body.page-family-marketing .city-bar{top:64px}body.page-family-marketing .city-bar .wrap{display:block;padding-top:8px}body.page-family-marketing .city-nav{margin:0}body.page-family-marketing .city-hero-grid, body.page-family-marketing .gateway-hero .hero-inner, body.page-family-marketing .two-col, body.page-family-marketing .page-layout{grid-template-columns:1fr}body.page-family-marketing .sticky-aside{position:static}body.page-family-marketing .metrics{grid-template-columns:repeat(2,1fr)}body.page-family-marketing .metric:nth-child(2){border-right:0}body.page-family-marketing .grid.c3, body.page-family-marketing .grid.c4, body.page-family-marketing .domain-grid, body.page-family-marketing .price-grid, body.page-family-marketing .assurance-grid, body.page-family-marketing .cap-grid, body.page-family-marketing .entity-grid{grid-template-columns:repeat(2,1fr)}body.page-family-marketing .city-grid{grid-template-columns:repeat(2,1fr)}body.page-family-marketing .evidence-chain{grid-template-columns:repeat(2,1fr)}body.page-family-marketing .hero-stat-strip{grid-template-columns:repeat(3,1fr)}body.page-family-marketing .footer-grid{grid-template-columns:1.4fr repeat(2,1fr)}body.page-family-marketing .impact-flow{grid-template-columns:1fr}body.page-family-marketing .impact-arrow{transform:rotate(90deg)}body.page-family-marketing .network-links{grid-template-columns:repeat(2,1fr)}} @media(max-width:600px){body.page-family-marketing .wrap{padding:0 18px}body.page-family-marketing .hero{padding:58px 0 52px}body.page-family-marketing .hero h1{font-size:48.0px}body.page-family-marketing .hero p{font-size:14px}body.page-family-marketing .global-header{height:58px}body.page-family-marketing .city-bar{top:58px}body.page-family-marketing .brand small{display:none}body.page-family-marketing .global-nav{gap:8px}body.page-family-marketing .metrics, body.page-family-marketing .grid.c2, body.page-family-marketing .grid.c3, body.page-family-marketing .grid.c4, body.page-family-marketing .domain-grid, body.page-family-marketing .price-grid, body.page-family-marketing .assurance-grid, body.page-family-marketing .city-grid, body.page-family-marketing .cap-grid, body.page-family-marketing .entity-grid, body.page-family-marketing .evidence-chain, body.page-family-marketing .cert-score, body.page-family-marketing .related-grid{grid-template-columns:1fr}body.page-family-marketing .catalog-toolbar{align-items:stretch;flex-direction:column}body.page-family-marketing .searchbox input{width:100%}body.page-family-marketing .release-card{grid-template-columns:1fr}body.page-family-marketing .gateway-hero .hero-aside{border-left:0;border-top:1px solid #31545b;padding:18px 0 0}body.page-family-marketing .city-hero-grid{gap:25px}body.page-family-marketing .footer-grid{grid-template-columns:1fr 1fr}body.page-family-marketing .footer-brand{grid-column:1/-1}body.page-family-marketing .footer-bottom{display:block}body.page-family-marketing .city-system-map{grid-template-columns:repeat(2,1fr)}body.page-family-marketing .proof-strip, body.page-family-marketing .hero-stat-strip{grid-template-columns:repeat(2,1fr)}body.page-family-marketing .timeline-chain{align-items:flex-start;flex-direction:column}body.page-family-marketing .timeline-arrow{transform:rotate(90deg);padding:4px 12px}body.page-family-marketing .network-links{grid-template-columns:1fr}} body.page-family-marketing /* V4 expanded Fidelra footer */ .footer{padding:64px 0 24px}body.page-family-marketing .footer-grid{grid-template-columns:1.65fr repeat(4,1fr);gap:42px}body.page-family-marketing .footer-brand-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin-top:16px;font:600 14px var(--mono);color:#78999d}body.page-family-marketing .footer-brand-stats b{color:#78cfd0}@media(max-width:900px){body.page-family-marketing .footer-grid{grid-template-columns:1fr 1fr}body.page-family-marketing .footer-brand{grid-column:1/-1}} body.page-family-marketing /* V4.4 — global homepage + premium city gateway */ .fcte-certified-badge, body.page-family-marketing .pill.live{background:var(--ink);color:#fff;border-color:var(--ink)} body.page-family-marketing .fcte-certified-badge:before{background:var(--mint)} body.page-family-marketing .fcte-main-hero{position:relative;overflow:hidden;padding:94px 0 72px;background:linear-gradient(135deg,#f7faf9 0%,#eef6f6 65%,#f7faf9 100%);border-bottom:1px solid var(--line)} body.page-family-marketing .main-hero-grid{display:grid;grid-template-columns:1.02fr 1fr;gap:48px;align-items:center}body.page-family-marketing .main-eyebrow{font:800 14px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:#278b89}body.page-family-marketing .main-hero-copy h1{font-size:clamp(62px,7.8vw,102px);line-height:.95;letter-spacing:-.065em;margin:18px 0 24px;max-width:720px}body.page-family-marketing .main-hero-copy h1 span{display:block;color:#118f82}body.page-family-marketing .main-hero-copy>p{max-width:690px;font-size:18.0px;line-height:1.7;color:#405d66}body.page-family-marketing .main-availability{margin-top:24px;font-size:14px;color:#5f787f}body.page-family-marketing .main-availability span{display:block;margin-top:3px;color:#7d9397} body.page-family-marketing .main-network-stage{position:relative;min-height:540px}body.page-family-marketing .main-network{width:100%;height:auto;filter:drop-shadow(0 18px 35px rgba(14,74,79,.06))}body.page-family-marketing .mn-lines path{stroke:#9bcaca;stroke-width:1.2;fill:none;opacity:.62}body.page-family-marketing .mn-node circle{fill:#fff;stroke:#55b8b5;stroke-width:2}body.page-family-marketing .mn-node:first-of-type circle{fill:#118f82;stroke:#118f82}body.page-family-marketing .mn-node text{font:700 14px Inter,Arial,sans-serif;fill:#679095}body.page-family-marketing .main-kpi-panel{position:absolute;right:0;bottom:8px;width:min(500px,88%);display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid #c8d9d7;border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(11,49,56,.12)}body.page-family-marketing .main-kpi-panel>div{padding:22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}body.page-family-marketing .main-kpi-panel>div:nth-child(2n){border-right:0}body.page-family-marketing .main-kpi-panel b{display:block;font-size:29.0px;line-height:1.1;letter-spacing:-.04em}body.page-family-marketing .main-kpi-panel span{display:block;margin-top:7px;font:700 14px var(--mono);text-transform:uppercase;color:#718b91}body.page-family-marketing .main-kpi-panel .main-kpi-certified{grid-column:1/-1;border-bottom:0;background:#0b3138;color:#fff}body.page-family-marketing .main-kpi-panel .main-kpi-certified b{font-size:17.0px;color:#8fe0d7}body.page-family-marketing .main-kpi-panel .main-kpi-certified span{color:#9eb9bd} body.page-family-marketing .main-thesis{padding:72px 0}body.page-family-marketing .main-thesis-copy{max-width:880px;margin:0 auto 34px;text-align:center;font-size:20.0px;font-weight:650;line-height:1.55}body.page-family-marketing .main-thesis-copy b{color:#118f82}body.page-family-marketing .main-value-grid .card{border-top:3px solid #d7e2e0}body.page-family-marketing .main-value-grid .card:hover{border-top-color:#78cfd0}body.page-family-marketing .main-connected-band{background:#07151f;color:#fff}body.page-family-marketing .main-connected-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}body.page-family-marketing .main-connected-band .section-head h2{color:#fff}body.page-family-marketing .main-connected-band .section-head p{color:#9fb4b7}body.page-family-marketing .main-dot-orbit{position:relative;width:min(520px,80vw);aspect-ratio:1;margin:auto;border:1px solid rgba(151,203,203,.16);border-radius:50%}body.page-family-marketing .main-dot-orbit:before, body.page-family-marketing .main-dot-orbit:after{content:'';position:absolute;inset:20%;border:1px solid rgba(151,203,203,.12);border-radius:50%}body.page-family-marketing .main-dot-orbit:after{inset:36%}body.page-family-marketing .orbit-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:86px;height:86px;border-radius:50%;display:grid;place-items:center;background:#118f82;color:#fff;font-weight:650;box-shadow:0 0 0 12px rgba(17,143,130,.08)}body.page-family-marketing .main-dot-orbit span{position:absolute;left:50%;top:50%;width:max-content;transform:translate(-50%,-50%) rotate(var(--a)) translateX(220px) rotate(calc(-1 * var(--a)));padding:8px 11px;border:1px solid #29535a;border-radius:999px;background:#0d232d;color:#bcd2d3;font:700 14px var(--mono)}body.page-family-marketing .main-city-card{position:relative}body.page-family-marketing .main-city-card .pill{position:absolute;top:18px;right:18px}body.page-family-marketing .main-gateway-cta{display:flex;align-items:center;gap:18px;margin-top:22px}body.page-family-marketing .main-gateway-cta span{font-size:14px;color:var(--muted)} body.page-family-marketing .gateway-hero{position:relative;overflow:hidden}body.page-family-marketing .gateway-premium-grid{display:grid;grid-template-columns:.84fr 1.16fr;gap:42px;align-items:center}body.page-family-marketing .gateway-visual{position:relative;min-height:450px}body.page-family-marketing .gateway-network{width:100%;height:auto;opacity:.82}body.page-family-marketing .gw-lines path{stroke:#4b7177;stroke-width:1.2;fill:none}body.page-family-marketing .gw-node circle{fill:#153e46;stroke:#97cbcb;stroke-width:2}body.page-family-marketing .gw-node:first-of-type circle{fill:#97cbcb}body.page-family-marketing .gw-node text{font:700 14px Inter,Arial,sans-serif;fill:#85a6aa}body.page-family-marketing .gateway-kpis{position:absolute;right:0;bottom:8px;width:min(520px,90%);display:grid;grid-template-columns:1fr 1fr;background:#fff;color:var(--ink);border-radius:14px;overflow:hidden;box-shadow:0 22px 65px rgba(0,0,0,.18)}body.page-family-marketing .gateway-kpis>div{padding:19px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}body.page-family-marketing .gateway-kpis>div:nth-child(2n){border-right:0}body.page-family-marketing .gateway-kpis b{display:block;font-size:26.0px;letter-spacing:-.04em}body.page-family-marketing .gateway-kpis span{display:block;margin-top:6px;font:700 14px var(--mono);text-transform:uppercase;color:#748d92}body.page-family-marketing .gateway-kpis .gateway-certified{grid-column:1/-1;border-bottom:0;background:#0b3138;color:#fff}body.page-family-marketing .gateway-kpis .gateway-certified b{font-size:16.0px;color:#8fe0d7}body.page-family-marketing .gateway-kpis .gateway-certified span{color:#9db6ba} @media(max-width:960px){body.page-family-marketing .main-hero-grid, body.page-family-marketing .main-connected-grid, body.page-family-marketing .gateway-premium-grid{grid-template-columns:1fr}body.page-family-marketing .main-network-stage, body.page-family-marketing .gateway-visual{min-height:460px}body.page-family-marketing .main-kpi-panel, body.page-family-marketing .gateway-kpis{position:relative;right:auto;bottom:auto;margin:-85px auto 0}body.page-family-marketing .main-dot-orbit{margin-top:20px}} @media(max-width:600px){body.page-family-marketing .fcte-main-hero{padding-top:64px}body.page-family-marketing .main-hero-copy h1{font-size:58.0px}body.page-family-marketing .main-network-stage, body.page-family-marketing .gateway-visual{min-height:auto}body.page-family-marketing .main-kpi-panel, body.page-family-marketing .gateway-kpis{width:100%;margin:10px 0 0}body.page-family-marketing .main-kpi-panel>div, body.page-family-marketing .gateway-kpis>div{padding:16px}body.page-family-marketing .main-gateway-cta{align-items:flex-start;flex-direction:column}body.page-family-marketing .main-dot-orbit{width:94vw}body.page-family-marketing .main-dot-orbit span{font-size:14px}body.page-family-marketing .gateway-copy h1{font-size:52.0px}} /* ===== COMPONENT: city.css ===== */ /* V5 component foundation: unique layout/visual behavior only; fidelra.css owns global grammar. */ body.city-locked /* FCTE Marketplace — shared site chrome (variables, base, header/nav, footer, buttons) Linked by every page in fctemarketplace/. Page-specific component styles stay inline in each page's own