/* =========================================================
     Design tokens, modeled on the pricing page screenshot
     ========================================================= */
 :root {
   --blue-700: #1e40af;
   --blue-600: #2563eb;
   --blue-500: #3b82f6;
   --blue-50: #eff6ff;
   --ink-900: #0a0a0f;
   --ink-800: #18181b;
   --ink-700: #27272a;
   --ink-500: #71717a;
   --ink-400: #a1a1aa;
   --ink-300: #d4d4d8;
   --ink-200: #e4e4e7;
   --ink-100: #f4f4f5;
   --ink-50: #fafafa;
   --green-500: #10b981;
   --green-50: #ecfdf5;
   --amber-500: #f59e0b;
   --amber-50: #fffbeb;
   --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
   --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06), 0 2px 4px rgba(15, 23, 42, 0.04);
   --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.08), 0 4px 8px rgba(15, 23, 42, 0.04);
   --radius-sm: 6px;
   --radius-md: 10px;
   --radius-lg: 16px;
   --radius-pill: 999px;
 }

 *,
 *::before,
 *::after {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }

 html {
   scroll-behavior: smooth;
 }

 body {
   font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
   font-size: 16px;
   line-height: 1.55;
   color: var(--ink-800);
   background: #fff;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   min-height: 100vh;
   display: flex;
   flex-direction: column;
 }

 /* Always push the footer below the fold, only applies on single-section pages
     so multi-section pages like the homepage aren't affected */
 body>section:only-of-type,
 body>main:only-of-type {
   flex: 1 0 auto;
   min-height: calc(100vh - 65px);
 }

 body>footer {
   margin-top: auto;
 }

 .serif {
   font-family: 'Source Serif 4', Georgia, serif;
 }

 em.serif {
   font-style: italic;
   font-weight: 600;
 }

 a {
   color: var(--blue-600);
   text-decoration: none;
 }

 a:hover {
   text-decoration: underline;
 }

 .container {
   max-width: 1380px;
   margin: 0 auto;
   padding: 0 40px;
 }

 .container-narrow {
   max-width: 720px;
   margin: 0 auto;
   padding: 0 40px;
 }

 /* =========================================================
     Buttons
     ========================================================= */
 .btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   padding: 12px 20px;
   font-size: 15px;
   font-weight: 600;
   border-radius: var(--radius-sm);
   border: 1px solid transparent;
   cursor: pointer;
   transition: all 0.15s ease;
   font-family: inherit;
   white-space: nowrap;
   text-decoration: none;
 }

 .btn-primary {
   background: var(--blue-600);
   color: #fff;
   box-shadow: 0 1px 2px rgba(37, 99, 235, 0.25);
 }

 .btn-primary:hover {
   background: var(--blue-700);
   text-decoration: none;
   transform: translateY(-1px);
   box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
 }

 .btn-secondary {
   background: #fff;
   color: var(--ink-800);
   border-color: var(--ink-200);
 }

 .btn-secondary:hover {
   background: var(--ink-50);
   border-color: var(--ink-300);
   text-decoration: none;
 }

 .btn-ghost {
   background: transparent;
   color: var(--ink-700);
   padding: 8px 12px;
 }

 .btn-ghost:hover {
   color: var(--ink-900);
   background: var(--ink-100);
   text-decoration: none;
 }

 .btn-lg {
   padding: 14px 24px;
   font-size: 16px;
 }

 .btn-sm {
   padding: 8px 14px;
   font-size: 14px;
 }

 /* =========================================================
     Nav
     ========================================================= */
 .nav {
   /* No border, no distinct background — nav color matches the very
       top of the hero gradient so they blend into one continuous fade. */
   border-bottom: none;
   background: #0f172a;
   position: sticky;
   top: 0;
   z-index: 100;
 }

 .nav-inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 16px 40px;
   /* 1000px outer minus 40+40 padding = 920px visible content (matches body content width) */
   max-width: 1380px;
   margin: 0 auto;
 }

 .logo {
   display: inline-block;
   text-decoration: none;
   line-height: 0;
 }

 .nav .logo img {
   height: 28px;
   width: auto;
   display: block;
   filter: brightness(0) invert(1);
 }

 .footer .logo img {
   height: 24px;
   filter: brightness(0) invert(1) opacity(0.92);
 }

 .nav-links {
   display: flex;
   align-items: center;
   gap: 4px;
 }

 .nav-link {
   padding: 8px 14px;
   color: rgba(255, 255, 255, 0.78);
   font-size: 14px;
   font-weight: 500;
   border-radius: var(--radius-sm);
   transition: all 0.15s;
   text-decoration: none;
 }

 .nav-link:hover {
   color: #fff;
   background: rgba(255, 255, 255, 0.08);
   text-decoration: none;
 }

 .nav-cta {
   margin-left: 8px;
 }

 /* Search count badge on "Recently viewed" nav link */
 .nav-link--badgeable {
   position: relative;
 }

 .nav-searches-badge {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   background: #ef4444;
   color: #fff;
   font-size: 10px;
   font-weight: 700;
   border-radius: 100%;
   letter-spacing: 0;
   animation: badge-pop 0.2s ease;
   position: absolute;
   top: -2px;
   right: -2px;
   min-width: 16px;
   min-height: 16px;
 }

 @keyframes badge-pop {
   0% {
     transform: scale(0.5);
     opacity: 0;
   }

   70% {
     transform: scale(1.15);
   }

   100% {
     transform: scale(1);
     opacity: 1;
   }
 }

 /* Logged-in nav: avatar + name button + dropdown */
 .nav-user-menu {
   position: relative;
   margin-left: 8px;
 }

 .nav-user-btn {
   display: inline-flex;
   align-items: center;
   gap: 7px;
   padding: 6px 10px 6px 6px;
   background: rgba(255, 255, 255, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.18);
   border-radius: var(--radius-pill);
   cursor: pointer;
   font-family: inherit;
   font-size: 14px;
   font-weight: 500;
   color: rgba(255, 255, 255, 0.9);
   transition: background 0.15s, border-color 0.15s;
 }

 .nav-user-btn:hover {
   background: rgba(255, 255, 255, 0.16);
   border-color: rgba(255, 255, 255, 0.3);
 }

 .nav-user-avatar {
   width: 26px;
   height: 26px;
   border-radius: 50%;
   background: var(--blue-600);
   color: #fff;
   font-size: 12px;
   font-weight: 700;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
 }

 .nav-user-name {
   max-width: 100px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }

 .nav-user-dropdown {
   display: none;
   position: absolute;
   top: calc(100% + 8px);
   right: 0;
   min-width: 200px;
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-md);
   box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12), 0 2px 6px rgba(15, 23, 42, 0.06);
   padding: 6px;
   z-index: 200;
   animation: dd-in 0.12s ease;
 }

 @keyframes dd-in {
   from {
     opacity: 0;
     transform: translateY(-4px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .nav-user-dropdown.is-open {
   display: block;
 }

 .nav-dd-item {
   display: flex;
   align-items: center;
   gap: 9px;
   padding: 9px 12px;
   border-radius: var(--radius-sm);
   font-size: 14px;
   font-weight: 500;
   color: var(--ink-700);
   text-decoration: none;
   transition: background 0.12s, color 0.12s;
 }

 .nav-dd-item:hover {
   background: var(--ink-50);
   color: var(--ink-900);
   text-decoration: none;
 }

 .nav-dd-item svg {
   color: var(--ink-400);
   flex-shrink: 0;
 }

 .nav-dd-divider {
   height: 1px;
   background: var(--ink-100);
   margin: 4px 0;
 }

 .nav-dd-signout {
   color: #b91c1c;
 }

 .nav-dd-signout:hover {
   background: #fef2f2;
   color: #991b1b;
 }

 .nav-dd-signout svg {
   color: #f87171;
 }


 /* =========================================================
     Hero, dark gradient for max contrast against search bar
     ========================================================= */
 .hero {
   padding: 96px 0 80px;
   /* Flipped gradient: darkest at top (matches nav color, no visible
       header boundary), brightening to a brand-blue at the bottom where
       the search bar sits. Continues the nav color upward so the entire
       top of the page reads as one continuous fade. */
   background: linear-gradient(180deg, #0f172a 0%, #15214d 45%, #2347a3 100%);
   text-align: center;
   position: relative;
   /* overflow visible so autocomplete dropdown can extend past the hero */
 }

 .hero::before {
   content: '';
   position: absolute;
   inset: 0;
   background-image:
     radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.06) 1px, transparent 0);
   background-size: 32px 32px;
   pointer-events: none;
 }

 .hero .container {
   position: relative;
   z-index: 1;
 }

 .hero-eyebrow {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   padding: 6px 14px;
   background: rgba(255, 255, 255, 0.08);
   border: 1px solid rgba(255, 255, 255, 0.15);
   border-radius: var(--radius-pill);
   font-size: 13px;
   font-weight: 500;
   color: rgba(255, 255, 255, 0.85);
   margin-bottom: 24px;
   backdrop-filter: blur(8px);
 }

 .hero-eyebrow .dot {
   width: 6px;
   height: 6px;
   background: var(--green-500);
   border-radius: 50%;
   box-shadow: 0 0 8px rgba(16, 185, 129, 0.6);
 }

 .hero h1 {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 64px;
   line-height: 1.05;
   letter-spacing: -0.025em;
   font-weight: 600;
   color: #fff;
   max-width: 880px;
   margin: 0 auto 20px;
 }

 .hero h1 em {
   font-style: italic;
   color: #93c5fd;
   font-weight: 600;
 }

 .hero-sub {
   font-size: 19px;
   line-height: 1.5;
   color: rgba(255, 255, 255, 0.72);
   max-width: 640px;
   margin: 0 auto 40px;
 }

 /* Search box, primary conversion element, intentionally large */
 /* Shell reserves layout space, fixed height matching the closed panel.
     Page below sits below this; panel grows downward as overlay when dropdown opens. */
 .search-shell {
   max-width: 1300px;
   margin: 0 auto;
   position: relative;
   height: 80px;
 }

 /* Single white panel, owns the only shadow. Overlays the shell so page doesn't shift. */
 .search-panel {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   background: #fff;
   border-radius: 16px;
   overflow: hidden;
   box-shadow:
     0 30px 80px rgba(0, 0, 0, 0.55),
     0 12px 30px rgba(0, 0, 0, 0.35),
     0 0 0 1px rgba(255, 255, 255, 0.10);
   z-index: 11;
   transition: box-shadow 0.15s;
 }

 .search-panel:focus-within {
   box-shadow:
     0 30px 80px rgba(0, 0, 0, 0.55),
     0 12px 30px rgba(0, 0, 0, 0.35),
     0 0 0 4px rgba(59, 130, 246, 0.45);
 }

 /* Search row inside the panel, no bg/shadow */
 .search-card {
   background: transparent;
   border: none;
   padding: 6px;
   display: flex;
   gap: 0;
   align-items: stretch;
 }

 .search-state {
   position: relative;
   flex: 0 0 170px;
   border-left: 1px solid var(--ink-200);
 }

 .search-state select {
   appearance: none;
   width: 100%;
   height: 100%;
   background: transparent;
   border: none;
   border-radius: 0;
   padding: 18px 40px 18px 20px;
   font-family: inherit;
   font-size: 16px;
   color: var(--ink-800);
   font-weight: 600;
   cursor: pointer;
   outline: none;
 }

 .search-state::after {
   content: '';
   position: absolute;
   right: 18px;
   top: 50%;
   width: 9px;
   height: 9px;
   border-right: 2px solid var(--ink-500);
   border-bottom: 2px solid var(--ink-500);
   transform: translateY(-75%) rotate(45deg);
   pointer-events: none;
 }

 .search-input-wrap {
   position: relative;
   flex: 1;
   min-width: 0;
   display: flex;
 }

 .search-input {
   flex: 1;
   border: none;
   background: transparent;
   padding: 18px 22px;
   font-family: inherit;
   font-size: 19px;
   color: var(--ink-900);
   outline: none;
   font-weight: 500;
   min-width: 0;
 }

 .search-input::placeholder {
   color: transparent;
 }

 /* Custom placeholder overlay, keeps "Enter" fixed and only animates the rotating phrase */
 .search-ph {
   position: absolute;
   left: 22px;
   top: 50%;
   transform: translateY(-50%);
   pointer-events: none;
   color: var(--ink-400);
   font-size: 19px;
   font-weight: 400;
   font-family: inherit;
   line-height: 1;
   display: flex;
   align-items: baseline;
   gap: 0.3em;
   white-space: nowrap;
 }

 .search-ph-rotate {
   display: inline-block;
   transition: opacity 0.45s ease;
 }

 .search-ph-rotate.fading {
   opacity: 0;
 }

 .search-input-wrap.has-value .search-ph,
 .search-input-wrap.is-focused .search-ph {
   display: none;
 }

 .search-submit {
   background: var(--blue-600);
   color: #fff;
   border: none;
   border-radius: 12px;
   padding: 0 32px;
   font-family: inherit;
   font-size: 17px;
   font-weight: 600;
   cursor: pointer;
   display: flex;
   align-items: center;
   gap: 10px;
   transition: background 0.15s, transform 0.15s;
   box-shadow: 0 2px 6px rgba(37, 99, 235, 0.3);
   margin: 0;
 }

 .search-submit:hover {
   background: var(--blue-700);
   box-shadow: 0 6px 16px rgba(37, 99, 235, 0.4);
 }

 .search-submit svg {
   width: 18px;
   height: 18px;
 }

 /* Autocomplete, lives INSIDE the panel, in flow. Hidden by default.
     When open, panel grows downward, single shadow envelops the whole unit. */
 .autocomplete {
   background: linear-gradient(180deg, #ffffff 0%, #f6f7f9 55%, #eceef2 100%);
   border-top: 1px solid var(--ink-100);
   text-align: left;
   display: none;
 }

 .autocomplete.open {
   display: block;
 }

 .autocomplete-header {
   padding: 10px 18px;
   background: transparent;
   border-bottom: 1px solid var(--ink-100);
   font-size: 11px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   color: var(--ink-500);
   display: flex;
   justify-content: space-between;
   align-items: center;
 }

 .autocomplete-header .count {
   color: var(--ink-700);
   font-weight: 500;
   text-transform: none;
   letter-spacing: normal;
   font-size: 12px;
 }

 .autocomplete-row {
   padding: 14px 18px;
   display: flex;
   align-items: center;
   gap: 14px;
   border-bottom: 1px solid var(--ink-100);
   cursor: pointer;
   transition: background 0.1s;
 }

 .autocomplete-row:last-child {
   border-bottom: none;
 }

 .autocomplete-row:hover,
 .autocomplete-row:focus {
   background: var(--blue-50);
   outline: none;
 }

 .autocomplete-icon {
   width: 36px;
   height: 36px;
   background: var(--ink-100);
   border-radius: 8px;
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--ink-500);
   flex-shrink: 0;
 }

 .autocomplete-row:hover .autocomplete-icon {
   background: #fff;
   color: var(--blue-600);
 }

 .autocomplete-main {
   flex: 1;
   min-width: 0;
 }

 .autocomplete-name {
   font-size: 15px;
   font-weight: 600;
   color: var(--ink-900);
   margin-bottom: 2px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }

 .autocomplete-meta {
   font-size: 13px;
   color: var(--ink-500);
   display: flex;
   align-items: center;
   gap: 8px;
 }

 .autocomplete-meta .dot {
   width: 3px;
   height: 3px;
   background: var(--ink-300);
   border-radius: 50%;
 }

 .autocomplete-status {
   flex-shrink: 0;
   display: inline-flex;
   align-items: center;
   gap: 5px;
   padding: 3px 9px;
   border-radius: var(--radius-pill);
   font-size: 11px;
   font-weight: 600;
 }

 .autocomplete-status.active {
   background: var(--green-50);
   color: #047857;
 }

 .autocomplete-status.active .dot {
   width: 5px;
   height: 5px;
   background: var(--green-500);
   border-radius: 50%;
 }

 .autocomplete-status.dissolved {
   background: var(--ink-100);
   color: var(--ink-500);
 }

 .autocomplete-footer {
   padding: 12px 18px;
   background: transparent;
   font-size: 13px;
   color: var(--ink-500);
   text-align: center;
   border-top: 1px solid rgba(0, 0, 0, 0.06);
 }

 .autocomplete-footer kbd {
   display: inline-block;
   padding: 2px 6px;
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: 4px;
   font-size: 11px;
   font-family: ui-monospace, monospace;
   color: var(--ink-700);
   margin: 0 2px;
 }

 .hero-meta {
   margin-top: 28px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 24px;
   font-size: 13px;
   color: rgba(255, 255, 255, 0.65);
   flex-wrap: wrap;
 }

 .hero-meta .meta-item {
   display: inline-flex;
   align-items: center;
   gap: 6px;
 }

 .hero-meta svg {
   color: #34d399;
 }

 /* =========================================================
     Trustpilot widget, uses official brand styling
     ========================================================= */
 .trustpilot-mini {
   margin: 36px auto 0;
   display: inline-flex;
   align-items: center;
   gap: 14px;
   padding: 14px 22px;
   background: rgba(255, 255, 255, 0.08);
   border: 1px solid rgba(255, 255, 255, 0.14);
   border-radius: 10px;
   backdrop-filter: blur(12px);
   color: #fff;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, sans-serif;
 }

 .trustpilot-mini.on-light {
   background: #fff;
   border: 1px solid var(--ink-200);
   color: var(--ink-900);
   box-shadow: var(--shadow-sm);
 }

 .tp-label {
   font-weight: 700;
   font-size: 15px;
   letter-spacing: -0.01em;
 }

 .tp-stars {
   display: inline-flex;
   gap: 2px;
 }

 .tp-star {
   width: 22px;
   height: 22px;
   display: block;
 }

 .tp-score {
   font-size: 13px;
   color: rgba(255, 255, 255, 0.85);
   font-weight: 500;
 }

 .trustpilot-mini.on-light .tp-score {
   color: var(--ink-700);
 }

 .tp-score strong {
   color: #fff;
   font-weight: 600;
 }

 .trustpilot-mini.on-light .tp-score strong {
   color: var(--ink-900);
 }

 .tp-divider {
   width: 1px;
   height: 22px;
   background: rgba(255, 255, 255, 0.2);
 }

 .trustpilot-mini.on-light .tp-divider {
   background: var(--ink-200);
 }

 .tp-logo {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   font-weight: 700;
   font-size: 15px;
   color: #fff;
   letter-spacing: -0.01em;
 }

 .trustpilot-mini.on-light .tp-logo {
   color: var(--ink-900);
 }

 .tp-logo-star {
   width: 18px;
   height: 18px;
 }

 /* =========================================================
     Trust bar, stats centered + larger, sources own subtle row below
     ========================================================= */
 .trust {
   padding: 64px 0 56px;
   border-bottom: 1px solid var(--ink-100);
 }

 .trust-stats {
   display: flex;
   justify-content: center;
   gap: 64px;
   margin-bottom: 40px;
   flex-wrap: wrap;
   text-align: center;
 }

 .trust-stat .num {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 52px;
   font-weight: 600;
   letter-spacing: -0.02em;
   color: var(--ink-900);
   line-height: 1;
 }

 .trust-stat .label {
   font-size: 14px;
   color: var(--ink-500);
   margin-top: 10px;
 }

 .trust-sources {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 14px;
   padding-top: 28px;
   border-top: 1px solid var(--ink-100);
 }

 .trust-sources .label {
   font-size: 12px;
   color: var(--ink-400);
   font-weight: 500;
   text-transform: uppercase;
   letter-spacing: 0.06em;
   text-align: center;
 }

 .source-pills {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   flex-wrap: wrap;
 }

 .source-pill {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   padding: 6px 12px;
   background: transparent;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-pill);
   font-size: 12px;
   color: var(--ink-500);
   font-weight: 500;
 }

 .source-pill .dot {
   width: 5px;
   height: 5px;
   background: var(--blue-600);
   border-radius: 50%;
 }

 /* =========================================================
     Section header
     ========================================================= */
 .section {
   padding: 96px 0;
 }

 /* Section separators, same lightweight style as the trust bar bottom border */
 .pricing-teaser {
   border-top: 1px solid var(--ink-100);
 }

 #faq {
   border-top: 1px solid var(--ink-100);
 }

 .section-eyebrow {
   display: inline-block;
   color: var(--blue-600);
   font-size: 14px;
   font-weight: 600;
   letter-spacing: 0.01em;
   margin-bottom: 12px;
 }

 .section-title {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 40px;
   line-height: 1.1;
   letter-spacing: -0.02em;
   font-weight: 600;
   color: var(--ink-900);
   margin-bottom: 16px;
 }

 .section-title em {
   font-style: italic;
   color: var(--blue-600);
   font-weight: 600;
 }

 .section-sub {
   font-size: 18px;
   color: var(--ink-500);
   max-width: 600px;
   line-height: 1.55;
 }

 .section-head {
   margin-bottom: 56px;
 }

 .section-head.center {
   text-align: center;
 }

 .section-head.center .section-sub {
   margin-left: auto;
   margin-right: auto;
 }

 /* =========================================================
     Sample report
     ========================================================= */
 .sample {
   background: linear-gradient(180deg, #fff 0%, var(--ink-50) 100%);
 }

 .report-card {
   max-width: 1300px;
   margin: 0 auto;
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-lg);
   box-shadow: var(--shadow-md);
   overflow: hidden;
 }

 /* Section heads on the sample/breakdown also stay at 920px */
 .sample .section-head {
   max-width: 1300px;
   margin-left: auto;
   margin-right: auto;
 }

 .report-header {
   padding: 20px 24px;
   border-bottom: 1px solid var(--ink-100);
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 16px;
   background: var(--ink-50);
 }

 .report-entity {
   display: flex;
   align-items: center;
   gap: 16px;
 }

 .report-icon {
   width: 48px;
   height: 48px;
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-sm);
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--blue-600);
 }

 .report-entity-name {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 22px;
   font-weight: 600;
   color: var(--ink-900);
   line-height: 1.2;
 }

 .report-entity-meta {
   font-size: 13px;
   color: var(--ink-500);
   margin-top: 2px;
 }

 .badge {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   padding: 4px 10px;
   border-radius: var(--radius-pill);
   font-size: 12px;
   font-weight: 600;
 }

 .badge-success {
   background: var(--green-50);
   color: #047857;
 }

 .badge-success .dot {
   width: 6px;
   height: 6px;
   background: var(--green-500);
   border-radius: 50%;
 }

 /* Quick-jump category pills */
 .report-categories {
   display: grid;
   grid-template-columns: repeat(6, 1fr);
   gap: 8px;
   padding: 16px 24px;
   background: #fff;
   border-bottom: 1px solid var(--ink-100);
 }

 .report-cat-pill {
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 10px 12px;
   background: var(--ink-50);
   border: 1px solid var(--ink-200);
   border-radius: 8px;
   color: var(--blue-700);
   font-weight: 600;
   font-size: 12.5px;
   text-decoration: none;
   transition: all 0.15s;
   cursor: pointer;
 }

 .report-cat-pill:hover {
   background: var(--blue-50);
   border-color: var(--blue-500);
   text-decoration: none;
 }

 .report-cat-pill svg {
   color: var(--blue-600);
   flex-shrink: 0;
 }

 /* Section blocks */
 .report-section {
   border-top: 1px solid var(--ink-100);
 }

 .report-section-head {
   display: flex;
   align-items: center;
   gap: 10px;
   padding: 14px 24px;
   background: var(--ink-50);
   color: var(--blue-700);
   font-size: 13px;
   font-weight: 700;
   letter-spacing: 0.06em;
 }

 .report-section-head svg {
   color: var(--blue-600);
 }

 .report-section-body {
   padding: 2px 0;
   background: #fff;
 }

 /* Key/value rows lay out as flex space-between so labels sit left and
     values sit right — no giant trailing whitespace when the value is
     short, which it usually is at the new wider page width. */
 .report-row {
   display: flex;
   align-items: baseline;
   justify-content: space-between;
   padding: 9px 24px;
   border-bottom: 1px solid var(--ink-100);
   gap: 24px;
 }

 .report-row:last-child {
   border-bottom: none;
 }

 .rrk {
   font-size: 13px;
   color: var(--ink-500);
   flex-shrink: 0;
 }

 .rrv {
   font-size: 13px;
   color: var(--ink-900);
   font-weight: 500;
   word-break: break-word;
   text-align: right;
 }

 .rrv.strong {
   color: var(--blue-700);
   font-weight: 700;
   letter-spacing: 0.02em;
 }

 .rrv.link {
   color: var(--blue-600);
 }

 /* Interactive collapse rows using <details> */
 .report-collapse {
   border-bottom: 1px solid var(--ink-100);
 }

 .report-collapse:last-child {
   border-bottom: none;
 }

 .report-collapse-row {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 12px 24px;
   cursor: pointer;
   list-style: none;
   transition: background 0.1s;
 }

 .report-collapse-row::-webkit-details-marker {
   display: none;
 }

 .report-collapse-row:hover {
   background: var(--blue-50);
 }

 .report-collapse-body {
   background: var(--ink-50);
   border-top: 1px solid var(--ink-100);
   padding: 2px 0;
 }

 .report-collapse-body .report-row {
   padding: 8px 24px 8px 56px;
   border-bottom: 1px solid var(--ink-100);
 }

 .report-collapse-body .report-row:last-child {
   border-bottom: none;
 }

 .report-collapse.is-open .rcr-icon {
   background: var(--blue-600);
   color: #fff;
 }

 .rcr-icon {
   transition: background-color 0.32s cubic-bezier(0.4, 0, 0.2, 1), color 0.32s cubic-bezier(0.4, 0, 0.2, 1);
 }

 /* Animated slide-open for sample-report collapsible rows */
 .report-collapse-body {
   overflow: hidden;
   transition: height 0.32s cubic-bezier(0.4, 0, 0.2, 1);
 }

 .rcr-icon {
   width: 24px;
   height: 24px;
   border-radius: 50%;
   background: var(--blue-50);
   color: var(--blue-600);
   display: inline-flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
   transition: all 0.15s ease;
 }

 .rcr-icon svg {
   width: 14px;
   height: 14px;
   display: block;
   transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
 }

 .report-collapse.is-open .rcr-icon svg {
   transform: rotate(45deg);
 }

 .rcr-label {
   flex: 1;
   font-size: 14px;
   color: var(--blue-600);
   font-weight: 600;
 }

 .rcr-count {
   font-size: 13px;
   color: var(--ink-500);
 }

 .report-empty {
   padding: 16px 32px;
   font-size: 13px;
   color: var(--ink-500);
   font-style: italic;
 }

 /* Section-by-section breakdown, alternating image/text rows */
 .report-breakdown {
   max-width: 1300px;
   margin-left: auto;
   margin-right: auto;
 }

 .rb-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 48px;
   align-items: center;
   padding: 56px 0;
   border-top: 1px solid var(--ink-100);
 }

 .rb-row:first-child {
   border-top: none;
   padding-top: 24px;
 }

 /* Default (odd rows): text on left, visual on right hugs the right edge */
 .rb-visual {
   justify-content: flex-end;
 }

 /* Even rows: visual on left, hugs the left edge */
 .rb-row:nth-child(even) .rb-visual {
   order: -1;
   justify-content: flex-start;
 }

 .rb-text {
   max-width: 560px;
 }

 .rb-eyebrow {
   font-size: 13px;
   font-weight: 600;
   color: var(--blue-600);
   letter-spacing: 0.04em;
   margin-bottom: 14px;
 }

 /* Headline row: large number sits inline with the heading */
 .rb-headline {
   display: flex;
   align-items: baseline;
   gap: 12px;
   margin-bottom: 16px;
 }

 .rb-num {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 40px;
   font-weight: 700;
   line-height: 1;
   letter-spacing: -0.04em;
   background: linear-gradient(180deg, var(--blue-600) 0%, var(--blue-700) 100%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
   color: var(--blue-600);
   flex-shrink: 0;
 }

 .rb-headline .rb-heading {
   margin-bottom: 0;
 }

 .rb-heading {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 32px;
   line-height: 1.15;
   letter-spacing: -0.02em;
   font-weight: 600;
   color: var(--ink-900);
   margin-bottom: 16px;
 }

 .rb-body {
   font-size: 16px;
   color: var(--ink-500);
   line-height: 1.6;
   margin-bottom: 20px;
 }

 .rb-list {
   list-style: none;
   padding: 0;
 }

 .rb-list li {
   padding: 8px 0 8px 24px;
   font-size: 14px;
   color: var(--ink-700);
   position: relative;
 }

 .rb-list li::before {
   content: '';
   position: absolute;
   left: 0;
   top: 14px;
   width: 6px;
   height: 6px;
   border-radius: 50%;
   background: var(--blue-600);
 }

 /* Mini visual preview cards */
 .rb-visual {
   display: flex;
 }

 .rb-mini-card {
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: 12px;
   box-shadow: var(--shadow-md);
   overflow: hidden;
   width: 100%;
   max-width: 520px;
 }

 .rb-mini-head {
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 14px 18px;
   background: var(--ink-50);
   color: var(--blue-700);
   font-size: 11px;
   font-weight: 700;
   letter-spacing: 0.06em;
   border-bottom: 1px solid var(--ink-100);
 }

 .rb-mini-head svg {
   color: var(--blue-600);
 }

 .rb-mini-row {
   display: grid;
   grid-template-columns: 110px 1fr;
   gap: 12px;
   padding: 12px 18px;
   border-bottom: 1px solid var(--ink-100);
   font-size: 12px;
 }

 .rb-mini-row:last-child {
   border-bottom: none;
 }

 .rb-mini-row span {
   color: var(--ink-500);
 }

 .rb-mini-row strong {
   color: var(--ink-900);
   font-weight: 600;
   word-break: break-word;
 }

 .rb-mini-row strong.link {
   color: var(--blue-600);
 }

 /* Mini list item (court records, UCC, patents) */
 .rb-mini-item {
   display: grid;
   grid-template-columns: 1fr auto;
   gap: 12px;
   align-items: center;
   padding: 12px 18px;
   border-bottom: 1px solid var(--ink-100);
 }

 .rb-mini-item:last-child {
   border-bottom: none;
 }

 .rb-mini-item-title {
   font-size: 13px;
   font-weight: 600;
   color: var(--ink-900);
   grid-column: 1;
 }

 .rb-mini-item-meta {
   font-size: 12px;
   color: var(--ink-500);
   grid-column: 1;
   margin-top: 2px;
 }

 .rb-mini-pill {
   font-size: 10px;
   font-weight: 700;
   padding: 4px 10px;
   border-radius: var(--radius-pill);
   grid-row: 1 / span 2;
   grid-column: 2;
   align-self: center;
   text-transform: uppercase;
   letter-spacing: 0.04em;
 }

 .rb-mini-pill.green {
   background: var(--green-50);
   color: #047857;
 }

 .rb-mini-pill.gray {
   background: var(--ink-100);
   color: var(--ink-500);
 }

 .rb-mini-pill.blue {
   background: var(--blue-50);
   color: var(--blue-700);
 }

 /* Officer mini row */
 .rb-mini-officer {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 12px 18px;
   border-bottom: 1px solid var(--ink-100);
 }

 .rb-mini-officer:last-child {
   border-bottom: none;
 }

 .rb-mini-avatar {
   width: 32px;
   height: 32px;
   border-radius: 50%;
   background: var(--blue-50);
   color: var(--blue-700);
   font-size: 11px;
   font-weight: 700;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
 }

 .rb-mini-officer-name {
   font-size: 13px;
   font-weight: 600;
   color: var(--ink-900);
 }

 .rb-mini-officer-role {
   font-size: 12px;
   color: var(--ink-500);
 }

 /* Trademark mini row */
 .rb-mini-tm {
   display: grid;
   grid-template-columns: auto 1fr auto;
   gap: 12px;
   align-items: center;
   padding: 12px 18px;
   border-bottom: 1px solid var(--ink-100);
 }

 .rb-mini-tm:last-child {
   border-bottom: none;
 }

 .rb-mini-tm-mark {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 16px;
   font-weight: 700;
   color: var(--ink-900);
   background: var(--ink-50);
   padding: 6px 12px;
   border-radius: 4px;
   letter-spacing: 0.02em;
 }

 .rb-mini-tm-no {
   font-size: 12px;
   color: var(--ink-700);
   font-weight: 600;
 }

 .rb-mini-tm-meta {
   font-size: 11px;
   color: var(--ink-500);
 }

 @media (max-width: 900px) {
   .rb-row {
     grid-template-columns: 1fr;
     gap: 32px;
     padding: 48px 0;
   }

   .rb-row:nth-child(even) .rb-visual {
     order: 0;
   }

   .rb-heading {
     font-size: 26px;
   }
 }

 .report-grid {
   display: grid;
   grid-template-columns: 1fr 1fr;
 }

 .report-cell {
   padding: 20px 32px;
   border-bottom: 1px solid var(--ink-100);
   border-right: 1px solid var(--ink-100);
 }

 .report-cell:nth-child(even) {
   border-right: none;
 }

 .report-cell:nth-last-child(-n+2) {
   border-bottom: none;
 }

 .cell-label {
   font-size: 12px;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   color: var(--ink-500);
   font-weight: 600;
   margin-bottom: 6px;
   display: flex;
   align-items: center;
   gap: 6px;
 }

 .cell-value {
   font-size: 15px;
   color: var(--ink-900);
   font-weight: 500;
 }

 .report-cell.locked {
   background: var(--ink-50);
   position: relative;
 }

 .report-cell.locked .cell-value {
   filter: blur(5px);
   user-select: none;
   pointer-events: none;
 }

 .report-cell.locked .cell-label {
   color: var(--blue-600);
 }

 .lock-icon {
   width: 14px;
   height: 14px;
   color: var(--blue-600);
 }

 .report-footer {
   padding: 24px 32px;
   background: linear-gradient(180deg, var(--ink-50) 0%, #eff6ff 100%);
   border-top: 1px solid var(--ink-200);
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 16px;
   flex-wrap: wrap;
 }

 .report-footer-text {
   font-size: 14px;
   color: var(--ink-700);
 }

 .report-footer-text strong {
   color: var(--ink-900);
 }

 /* =========================================================
     Use cases
     ========================================================= */
 .use-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 20px;
 }

 .use-card {
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-md);
   padding: 28px;
   transition: all 0.2s;
 }

 .use-card:hover {
   border-color: var(--blue-500);
   box-shadow: var(--shadow-md);
   transform: translateY(-2px);
 }

 .use-icon {
   width: 44px;
   height: 44px;
   background: var(--blue-50);
   border-radius: var(--radius-sm);
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--blue-600);
   margin-bottom: 16px;
 }

 .use-title {
   font-size: 16px;
   font-weight: 600;
   color: var(--ink-900);
   margin-bottom: 6px;
 }

 .use-desc {
   font-size: 14px;
   color: var(--ink-500);
   line-height: 1.55;
 }

 /* =========================================================
     How it works
     ========================================================= */
 .how {
   background:
     radial-gradient(circle at 30% 0%, rgba(37, 99, 235, 0.06), transparent 60%),
     radial-gradient(circle at 70% 100%, rgba(124, 58, 237, 0.05), transparent 60%),
     linear-gradient(180deg, #f5f8ff 0%, #eef3fc 100%);
   border-top: 1px solid var(--ink-200);
   border-bottom: 1px solid var(--ink-200);
 }

 .how-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 24px;
   position: relative;
   max-width: 1300px;
   margin: 0 auto;
 }

 .how-card {
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-md);
   padding: 32px;
   position: relative;
 }

 .how-step {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 32px;
   height: 32px;
   background: var(--blue-600);
   color: #fff;
   border-radius: var(--radius-pill);
   font-weight: 700;
   font-size: 14px;
   margin-bottom: 20px;
   font-family: 'Source Serif 4', Georgia, serif;
 }

 .how-title {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 22px;
   font-weight: 600;
   color: var(--ink-900);
   margin-bottom: 8px;
 }

 .how-desc {
   font-size: 15px;
   color: var(--ink-500);
   line-height: 1.55;
 }

 /* =========================================================
     Pricing teaser
     ========================================================= */
 .pricing-teaser {
   background: #fff;
 }

 .pricing-grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   /*3*/
   gap: 20px;
   max-width: 1300px;
   margin: 0 auto;
 }

 .price-card {
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-md);
   padding: 28px;
   position: relative;
 }

 .price-card.featured {
   border: 2px solid var(--blue-600);
   box-shadow: var(--shadow-lg);
 }

 .price-badge {
   position: absolute;
   top: -10px;
   left: 28px;
   padding: 4px 10px;
   background: var(--blue-600);
   color: #fff;
   font-size: 11px;
   font-weight: 700;
   letter-spacing: 0.05em;
   border-radius: var(--radius-pill);
   text-transform: uppercase;
 }

 .price-tier {
   font-size: 14px;
   color: var(--ink-500);
   font-weight: 500;
   margin-bottom: 4px;
 }

 .price-name {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 20px;
   font-weight: 600;
   color: var(--ink-900);
   margin-bottom: 16px;
 }

 .price-amount {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 40px;
   font-weight: 700;
   color: var(--ink-900);
   line-height: 1;
 }

 .price-amount .unit {
   font-size: 14px;
   font-weight: 400;
   color: var(--ink-500);
 }

 .price-fineprint {
   font-size: 13px;
   color: var(--ink-500);
   margin-top: 6px;
   margin-bottom: 20px;
 }

 .price-feature {
   display: flex;
   align-items: center;
   gap: 8px;
   font-size: 14px;
   color: var(--ink-700);
   padding: 6px 0;
 }

 .price-feature svg {
   color: var(--green-500);
   flex-shrink: 0;
 }

 .pricing-cta {
   text-align: center;
   margin-top: 40px;
 }

 /* =========================================================
     Cross-sell
     ========================================================= */
 .cross-sell {
   background: var(--ink-50);
   padding: 56px 0;
 }

 .cross-sell-card {
   background: linear-gradient(135deg, #fff 0%, var(--blue-50) 100%);
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-lg);
   padding: 32px 40px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 32px;
   flex-wrap: wrap;
   box-shadow: var(--shadow-sm);
 }

 .cross-sell-content {
   flex: 1;
   min-width: 280px;
 }

 .cross-sell-eyebrow {
   font-size: 12px;
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   color: var(--blue-600);
   margin-bottom: 8px;
 }

 .cross-sell-title {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 24px;
   font-weight: 600;
   color: var(--ink-900);
   margin-bottom: 4px;
   line-height: 1.2;
 }

 .cross-sell-desc {
   font-size: 14px;
   color: var(--ink-500);
 }

 /* =========================================================
     States
     ========================================================= */
 .states {
   background: #fff;
 }

 .state-grid {
   display: grid;
   grid-template-columns: repeat(5, 1fr);
   gap: 10px;
   max-width: 1300px;
   margin: 0 auto;
 }

 .state-link {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 44px;
   padding: 0 12px;
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-sm);
   color: var(--ink-700);
   font-size: 13px;
   font-weight: 500;
   text-decoration: none;
   transition: all 0.15s;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }

 .state-link:hover {
   border-color: var(--blue-500);
   color: var(--blue-700);
   background: var(--blue-50);
   text-decoration: none;
 }

 /* =========================================================
     Testimonials
     ========================================================= */
 .testimonials {
   background: var(--ink-50);
 }

 .test-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 20px;
   max-width: 1300px;
   margin: 0 auto;
 }

 .test-card {
   background: #fff;
   border: 1px solid var(--ink-200);
   border-radius: var(--radius-md);
   padding: 28px;
 }

 .test-stars {
   display: flex;
   gap: 2px;
   margin-bottom: 16px;
 }

 .test-stars .tp-star {
   width: 20px;
   height: 20px;
 }

 .test-verified {
   display: inline-flex;
   align-items: center;
   gap: 4px;
   font-size: 12px;
   color: #00B67A;
   font-weight: 600;
   margin-top: 6px;
 }

 .test-quote {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 16px;
   line-height: 1.55;
   color: var(--ink-800);
   margin-bottom: 20px;
 }

 .test-author {
   display: flex;
   align-items: center;
   gap: 12px;
 }

 .test-avatar {
   width: 36px;
   height: 36px;
   border-radius: var(--radius-pill);
   background: var(--blue-50);
   color: var(--blue-600);
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: 600;
   font-size: 14px;
 }

 .test-name {
   font-size: 14px;
   font-weight: 600;
   color: var(--ink-900);
 }

 .test-role {
   font-size: 13px;
   color: var(--ink-500);
 }

 /* =========================================================
     FAQ
     ========================================================= */
 .faq-list {
   max-width: 1300px;
   margin: 0 auto;
 }

 .faq-item {
   border-bottom: 1px solid var(--ink-200);
 }

 .faq-summary {
   padding: 24px 0;
   cursor: pointer;
   list-style: none;
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 16px;
   font-size: 17px;
   font-weight: 500;
   color: var(--ink-900);
   transition: color 0.15s;
 }

 .faq-summary:hover {
   color: var(--blue-600);
 }

 .faq-summary::-webkit-details-marker {
   display: none;
 }

 .faq-toggle {
   width: 24px;
   height: 24px;
   flex-shrink: 0;
   transition: transform 0.2s;
   color: var(--ink-500);
 }

 .faq-item[open] .faq-toggle {
   transform: rotate(45deg);
   color: var(--blue-600);
 }

 .faq-content {
   padding: 0 0 24px;
   font-size: 15px;
   color: var(--ink-500);
   line-height: 1.6;
   max-width: 720px;
 }

 /* =========================================================
     Final CTA
     ========================================================= */
 .final-cta {
   background: linear-gradient(135deg, var(--ink-900) 0%, #1e3a8a 100%);
   color: #fff;
   text-align: center;
   padding: 96px 0;
 }

 .final-cta h2 {
   font-family: 'Source Serif 4', Georgia, serif;
   font-size: 48px;
   line-height: 1.1;
   letter-spacing: -0.02em;
   font-weight: 600;
   margin-bottom: 16px;
   color: #fff;
 }

 .final-cta h2 em {
   font-style: italic;
   color: var(--blue-500);
   font-weight: 600;
 }

 .final-cta p {
   font-size: 19px;
   color: var(--ink-300);
   margin-bottom: 32px;
   max-width: 560px;
   margin-left: auto;
   margin-right: auto;
 }

 .final-cta .btn-primary {
   background: #fff;
   color: var(--ink-900);
 }

 .final-cta .btn-primary:hover {
   background: var(--ink-100);
   color: var(--ink-900);
 }

 /* =========================================================
     Footer
     ========================================================= */
 .footer {
   background: #1a202c;
   color: var(--ink-400);
   padding: 64px 0 32px;
 }

 .footer-grid {
   display: grid;
   grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
   gap: 48px;
   max-width: 1300px;
   margin: 0 auto 48px;
 }

 .footer-brand .logo {
   color: #fff;
 }

 .footer-brand .logo .accent {
   color: var(--blue-500);
 }

 .footer-brand .logo .tld {
   color: var(--ink-300);
 }

 .footer-brand p {
   margin-top: 16px;
   font-size: 14px;
   color: var(--ink-400);
   max-width: 280px;
   line-height: 1.55;
 }

 .footer-family {
   margin-top: 20px;
   padding: 12px 16px;
   background: rgba(255, 255, 255, 0.05);
   border: 1px solid rgba(255, 255, 255, 0.08);
   border-radius: var(--radius-sm);
   font-size: 13px;
   color: var(--ink-300);
   max-width: 320px;
 }

 .footer-family strong {
   color: #fff;
   display: block;
   margin-bottom: 4px;
   font-size: 13px;
 }

 .footer-col h4 {
   color: #fff;
   font-size: 13px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.05em;
   margin-bottom: 16px;
 }

 .footer-col ul {
   list-style: none;
 }

 .footer-col li {
   margin-bottom: 10px;
 }

 .footer-col a {
   color: var(--ink-400);
   font-size: 14px;
   text-decoration: none;
   transition: color 0.15s;
 }

 .footer-col a:hover {
   color: #fff;
 }

 .footer-bottom {
   border-top: 1px solid rgba(255, 255, 255, 0.08);
   padding-top: 24px;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   gap: 16px;
   font-size: 13px;
   color: var(--ink-500);
   max-width: 1300px;
   margin: 0 auto;
 }

 /* =========================================================
     Responsive
     ========================================================= */
 @media (max-width: 900px) {
   .hero h1 {
     font-size: 44px;
   }

   .section-title {
     font-size: 32px;
   }

   .section {
     padding: 64px 0;
   }

   .hero {
     padding: 56px 0 40px;
   }

   .nav-links .nav-link:not(.nav-cta) {
     display: none;
   }

   .search-card {
     flex-direction: column;
     padding: 8px;
   }

   /* State now sits BELOW the input on mobile (HTML order). Top
       divider separates it from the input above; no rounded corners. */
   .search-state {
     flex: 1;
     width: 100%;
     border-left: none;
     border-top: 1px solid var(--ink-200);
   }

   .search-state select {
     border-radius: 0;
   }

   .trust-grid {
     grid-template-columns: 1fr;
     gap: 24px;
   }

   .use-grid {
     grid-template-columns: repeat(2, 1fr);
   }

   .how-grid,
   .pricing-grid,
   .test-grid {
     grid-template-columns: 1fr;
   }

   .state-grid {
     grid-template-columns: repeat(3, 1fr);
   }

   .footer-grid {
     grid-template-columns: 1fr 1fr;
   }

   .final-cta h2 {
     font-size: 32px;
   }
 }

 /* Mobile (≤ 640px), phones */
 @media (max-width: 640px) {
   .container {
     padding: 0 16px;
   }

   .nav-inner {
     padding: 12px 16px;
     max-width: 100%;
   }

   .nav .logo img {
     height: 26px;
   }

   .nav-links {
     gap: 2px;
   }

   .nav-link {
     padding: 6px 10px;
     font-size: 13px;
   }

   .btn-sm,
   .nav-cta {
     padding: 8px 12px;
     font-size: 13px;
   }

   .hero {
     padding: 40px 0 32px;
   }

   .hero h1 {
     font-size: 30px;
     line-height: 1.15;
   }

   .hero-sub {
     font-size: 14px;
     margin-top: 12px;
   }

   /* Search card on mobile */
   .search-shell {
     padding: 0;
   }

   .search-card {
     border-radius: 12px;
     box-shadow: var(--shadow-md);
   }

   .search-state {
     flex: 0 0 auto;
   }

   .search-state select {
     padding: 14px 36px 14px 16px;
     font-size: 16px;
   }

   .search-state::after {
     right: 16px;
   }

   .search-input {
     padding: 14px 16px;
     font-size: 16px;
     min-height: 48px;
   }

   .search-ph {
     left: 16px;
     font-size: 16px;
   }

   .search-submit {
     width: 100%;
     padding: 14px 16px;
     font-size: 15px;
     border-radius: 8px;
     min-height: 48px;
   }

   .search-trust-row {
     flex-wrap: wrap;
     gap: 8px 16px;
     font-size: 12px;
   }

   .section-title {
     font-size: 24px;
   }

   .section {
     padding: 48px 0;
   }

   /* Stats grid */
   .stats-grid {
     grid-template-columns: repeat(2, 1fr);
     gap: 24px 16px;
   }

   .stat-num {
     font-size: 30px;
   }

   .stat-label {
     font-size: 11px;
   }

   /* Sample report scales down */
   .report-card {
     padding: 20px;
   }

   .report-entity-name {
     font-size: 20px;
   }

   .report-entity-meta {
     font-size: 12px;
   }

   .report-categories {
     gap: 6px;
     flex-wrap: wrap;
   }

   .report-cat-pill {
     font-size: 12px;
     padding: 6px 10px;
   }

   /* Numbered breakdown rows: ensure stacking and tighter type */
   .rb-row {
     padding: 32px 0;
     gap: 24px;
   }

   .rb-num {
     font-size: 32px;
   }

   .rb-heading {
     font-size: 22px;
   }

   .rb-body {
     font-size: 14px;
   }

   /* Pricing */
   .pricing-card {
     padding: 24px;
   }

   .pricing-price {
     font-size: 40px;
   }

   /* Testimonials, FAQ, state grid */
   .test-card {
     padding: 20px;
   }

   .faq-q {
     font-size: 15px;
   }

   .faq-a {
     font-size: 14px;
   }

   .state-grid {
     grid-template-columns: repeat(2, 1fr);
     gap: 6px;
   }

   .state-link {
     padding: 8px 10px;
     font-size: 12px;
   }

   /* Final CTA */
   .final-cta {
     padding: 56px 0;
   }

   .final-cta h2 {
     font-size: 26px;
   }

   .final-cta p {
     font-size: 14px;
   }

   /* Footer collapses to single column */
   .footer {
     padding: 48px 0 24px;
   }

   .footer-grid {
     grid-template-columns: 1fr;
     gap: 32px;
     margin-bottom: 32px;
   }

   .footer-brand p {
     max-width: 100%;
   }

   .footer-bottom {
     font-size: 12px;
     flex-direction: column;
     gap: 8px;
   }

   .trustpilot-mini {
     flex-direction: column;
   }


 }

 /* Small phones (≤ 380px) */
 @media (max-width: 380px) {
   .hero h1 {
     font-size: 26px;
   }

   .stats-grid {
     grid-template-columns: 1fr;
   }

   .state-grid {
     grid-template-columns: 1fr;
   }
 }