/* BlueAI Chat — shared design system.
   Single source of truth for the royal palette, type scale and components.
   Extracted from the homepage so every page stays in sync. */

:root {
      --sapphire: #10256B;
      --royal: #1E3FA0;
      --ink: #0B1638;
      --gold: #C9A227;
      --ivory: #FAF8F2;
      --porcelain: #FFFFFF;
      --slate: #5A6480;
      --hairline: #E4E1D7;
      --sky: #7DA3E5;
      --success: #1E7A56;
      --warning: #A8721F;
      --danger: #AE3B36;
      --max: 1180px;
      --radius: 14px;
      --shadow: 0 2px 8px rgba(11,22,56,.06);
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: Inter, system-ui, sans-serif;
      color: var(--ink);
      background: var(--ivory);
      line-height: 1.7;
      overflow-x: hidden;
    }

    img { max-width: 100%; display: block; }
    a { color: inherit; text-decoration: none; }
    button, input { font: inherit; }

    .container { width: min(calc(100% - 32px), var(--max)); margin-inline: auto; }
    .section { padding: 92px 0; position: relative; }
    .section::before {
      content: "";
      position: absolute;
      inset: 0 0 auto 0;
      height: 1px;
      background: rgba(201,162,39,.7);
    }
    .dark { background: var(--sapphire); color: var(--ivory); }
    .ivory { background: var(--ivory); }
    .white { background: var(--porcelain); }

    .eyebrow {
      display: inline-block;
      margin-bottom: 14px;
      color: var(--gold);
      font-size: 11px;
      letter-spacing: .2em;
      text-transform: uppercase;
      font-weight: 700;
    }

    h1, h2, h3 {
      font-family: "Playfair Display", serif;
      line-height: 1.12;
      letter-spacing: -.02em;
      margin: 0;
    }
    h1 { font-size: clamp(48px, 6.4vw, 88px); max-width: 760px; }
    h2 { font-size: clamp(36px, 4.4vw, 62px); max-width: 840px; }
    h3 { font-size: 24px; }
    p { margin: 0; color: var(--slate); }
    .dark p { color: rgba(250,248,242,.78); }
    .lead { font-size: clamp(18px, 2vw, 23px); max-width: 760px; }
    .mono { font-family: "IBM Plex Mono", monospace; font-variant-numeric: tabular-nums; }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 50px;
      padding: 0 20px;
      border-radius: 10px;
      font-weight: 700;
      transition: transform .2s ease, background .2s ease, color .2s ease;
      border: 1px solid transparent;
      cursor: pointer;
    }
    .btn:hover { transform: translateY(-2px); }
    .btn-primary { background: var(--royal); color: #fff; }
    .btn-outline { border-color: rgba(250,248,242,.65); color: var(--ivory); background: transparent; }
    .btn-light { background: var(--ivory); color: var(--sapphire); }
    .btn:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid var(--sky); outline-offset: 3px; }

    .nav {
      position: sticky;
      top: 0;
      z-index: 50;
      background: rgba(16,37,107,.97);
      backdrop-filter: blur(10px);
      border-bottom: 1px solid var(--gold);
    }
    .nav-inner {
      min-height: 72px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }
    .logo { display: flex; align-items: center; gap: 10px; font-weight: 800; color: white; }
    .logo-mark {
      width: 34px; height: 34px; border: 1px solid var(--gold); border-radius: 8px;
      display: grid; place-items: center; font-family: "Playfair Display"; font-size: 18px;
    }
    .nav-links { display: flex; gap: 24px; align-items: center; color: rgba(250,248,242,.82); font-size: 14px; }
    .nav-toggle { display: none; background: none; border: 0; color: white; font-size: 26px; }

    .hero { padding: 72px 0 88px; background: var(--sapphire); color: var(--ivory); }
    .hero-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 54px; align-items: center; }
    .hero h1 span { color: var(--sky); }
    .hero-copy > * + * { margin-top: 24px; }
    .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
    .hero-note { font-size: 14px; color: rgba(250,248,242,.7); }
    .stats-row {
      display: grid; grid-template-columns: repeat(4,1fr);
      border: 1px solid rgba(250,248,242,.18); border-radius: 12px; overflow: hidden;
    }
    .stat { padding: 18px; border-right: 1px solid rgba(250,248,242,.18); }
    .stat:last-child { border-right: 0; }
    .stat strong { display: block; font-family: "IBM Plex Mono"; font-size: 18px; }
    .stat span { display: block; font-size: 12px; color: rgba(250,248,242,.66); margin-top: 5px; }

    .employee-stage { position: relative; min-height: 590px; display: grid; place-items: center; }
    .employee-badge {
      width: min(100%, 370px);
      background: var(--porcelain);
      border: 1px solid var(--gold);
      border-radius: 18px;
      color: var(--ink);
      box-shadow: 0 24px 60px rgba(0,0,0,.22);
      padding: 28px;
      position: relative;
      z-index: 3;
    }
    .lanyard { width: 42px; height: 12px; border: 2px solid var(--gold); border-bottom: 0; border-radius: 8px 8px 0 0; margin: -40px auto 24px; background: var(--sapphire); }
    .avatar { width: 88px; height: 88px; border-radius: 50%; background: var(--sapphire); color: white; display: grid; place-items: center; margin: 0 auto 18px; font: 700 32px "Playfair Display"; border: 1px solid var(--gold); }
    .badge-role { text-align: center; color: var(--slate); font-size: 12px; letter-spacing: .18em; }
    .badge-name { text-align: center; font-size: 36px; margin-top: 5px; }
    .status { display: flex; justify-content: center; gap: 8px; align-items: center; margin-top: 14px; font-size: 13px; }
    .dot { width: 9px; height: 9px; background: var(--success); border-radius: 50%; box-shadow: 0 0 0 6px rgba(30,122,86,.12); animation: pulse 1.8s infinite; }
    .channel-label { text-align:center; margin-top:18px; font-size:10px; letter-spacing:.15em; color:var(--slate); font-weight:700; }
    .channel-row { display:flex; justify-content:center; gap:9px; margin-top:10px; flex-wrap:wrap; }
    .channel-icon { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:#fff; border:1px solid var(--hairline); color:var(--royal); box-shadow:0 2px 8px rgba(11,22,56,.06); }
    .channel-icon svg { width:17px; height:17px; fill:currentColor; }
    .channel-icon.whatsapp { color:#1E7A56; }
    .channel-icon.instagram { color:#9C3C78; }
    .channel-icon.facebook { color:#1E3FA0; }
    .channel-icon.phone { color:#A8721F; }
    .channel-icon.web { color:#5A6480; }
    .channel-icon.email { color:#AE3B36; }
    .badge-rule { height: 1px; background: var(--gold); margin: 20px 0; }
    .badge-stats { display: grid; gap: 10px; }
    .badge-stat { display: flex; justify-content: space-between; font-size: 14px; }

    .conversation-card {
      position: absolute;
      width: 230px;
      padding: 12px 14px;
      background: var(--ivory);
      color: var(--ink);
      border: 1px solid var(--hairline);
      border-radius: 12px;
      box-shadow: var(--shadow);
      font-size: 12px;
      z-index: 2;
      animation: drift 6s ease-in-out infinite;
    }
    .conversation-card .tag { color: var(--royal); font-family: "IBM Plex Mono"; font-weight: 700; margin-right: 6px; }
    .conversation-card .time { float: right; color: var(--slate); }
    .c1 { top: 60px; left: 0; transform: rotate(-5deg); }
    .c2 { top: 170px; right: 0; transform: rotate(4deg); animation-delay: -1.2s; }
    .c3 { bottom: 140px; left: -18px; transform: rotate(3deg); animation-delay: -2.4s; }
    .c4 { bottom: 52px; right: 12px; transform: rotate(-4deg); animation-delay: -3.6s; }

    .trust-strip { overflow: hidden; padding: 24px 0; background: var(--ivory); border-bottom: 1px solid var(--hairline); }
    .trust-track { display: flex; gap: 42px; white-space: nowrap; width: max-content; animation: marquee 30s linear infinite; color: var(--slate); font-size: 14px; }
    .trust-track span::before { content: "✦"; color: var(--gold); margin-right: 10px; }

    .section-head { margin-bottom: 46px; }
    .section-head p { margin-top: 18px; max-width: 740px; }

    .grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
    .grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
    .grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 24px; }

    .card {
      background: var(--porcelain);
      border: 1px solid var(--hairline);
      border-radius: var(--radius);
      padding: 24px;
      box-shadow: var(--shadow);
    }
    .problem-card { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; padding: 0; }
    .problem-side { padding: 22px; }
    .problem-loss { background: rgba(174,59,54,.07); }
    .problem-fix { background: rgba(30,122,86,.08); border-left: 1px solid var(--hairline); }
    .problem-side small { display:block; font-weight: 700; margin-bottom: 8px; }
    .problem-loss small { color: var(--danger); }
    .problem-fix small { color: var(--success); }

    .cap-card .num { color: var(--gold); font-family: "IBM Plex Mono"; font-size: 13px; }
    .cap-card h3 { margin: 10px 0; font-size: 22px; }

    .scale-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 28px; margin-top: 44px; }
    .scale-item strong { display:block; font: 500 clamp(38px,5vw,68px) "IBM Plex Mono"; color: white; }
    .scale-item span { color: rgba(250,248,242,.74); }

    .timeline { position: relative; padding-left: 34px; display: grid; gap: 24px; }
    .timeline::before { content:""; position:absolute; left:10px; top:4px; bottom:4px; width:1px; background: var(--gold); }
    .timeline-item { position:relative; }
    .timeline-item::before { content:""; position:absolute; left:-30px; top:8px; width:8px; height:8px; border-radius:50%; background:var(--gold); }
    .timeline-item strong { display:block; margin-bottom:4px; color:var(--ink); }

    .speed-row { display:grid; grid-template-columns: repeat(4,1fr); gap: 0; border:1px solid var(--hairline); border-radius:14px; overflow:hidden; }
    .speed-step { padding:26px; position:relative; background:white; }
    .speed-step:not(:last-child)::after { content:"→"; position:absolute; right:-9px; top:50%; transform:translateY(-50%); color:var(--gold); z-index:2; font-size:22px; }
    .speed-step time { display:block; font-family:"IBM Plex Mono"; color:var(--royal); font-size:19px; margin-bottom:8px; }

    .console {
      background:#091536; border:1px solid rgba(201,162,39,.5); border-radius:14px; padding:18px; overflow:hidden;
    }
    .console-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
    .live { display:flex; align-items:center; gap:8px; color:#dff7ed; font-size:13px; }
    .console-rows { display:grid; gap:10px; }
    .console-row { display:grid; grid-template-columns:60px 1fr auto; gap:12px; align-items:center; padding:12px 14px; background:rgba(255,255,255,.04); border-radius:9px; color:rgba(255,255,255,.85); font-size:13px; }
    .console-tag { font-family:"IBM Plex Mono"; color:var(--sky); }
    .console-time { color:rgba(255,255,255,.5); }

    .split-card { min-height: 280px; }
    .split-card ul, .price-card ul { margin:18px 0 0; padding-left:18px; color:var(--slate); }
    .split-card li + li, .price-card li + li { margin-top:8px; }

    .languages { display:flex; flex-wrap:wrap; gap:12px; }
    .pill { border:1px solid var(--hairline); background:white; padding:10px 14px; border-radius:999px; }


    .playbook-shell{display:grid;grid-template-columns:300px 1fr;gap:24px;align-items:start}.playbook-menu{display:grid;gap:10px}.playbook-tab{width:100%;text-align:left;padding:15px 16px;border:1px solid var(--hairline);border-radius:12px;background:#fff;color:var(--ink);font-weight:700;cursor:pointer}.playbook-tab.active,.playbook-tab:hover{border-color:var(--royal);background:rgba(30,63,160,.06)}.playbook-preview{background:#fff;border:1px solid var(--hairline);border-radius:16px;overflow:hidden;box-shadow:0 14px 38px rgba(11,22,56,.09)}.playbook-preview img{width:100%;aspect-ratio:16/9;object-fit:cover}.playbook-body{padding:22px}.playbook-body h3{font-size:28px;margin-bottom:10px}.playbook-body .use-link{display:inline-flex;margin-top:16px;color:var(--royal);font-weight:800}@media(max-width:800px){.playbook-shell{grid-template-columns:1fr}.playbook-menu{grid-template-columns:repeat(2,1fr)}.playbook-tab{font-size:13px}.playbook-preview img{aspect-ratio:auto}}
    .industry-card { min-height: 180px; cursor:pointer; transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease; text-align:left; width:100%; color:inherit; font:inherit; }
    .industry-card:hover, .industry-card.active { transform:translateY(-4px); border-color:var(--royal); box-shadow:0 10px 28px rgba(11,22,56,.10); }
    .industry-card p { margin-top:10px; }
    .industry-card .use-link { display:inline-flex; align-items:center; gap:7px; margin-top:18px; color:var(--royal); font-size:13px; font-weight:700; }
    .use-case-panel { margin-top:28px; display:grid; grid-template-columns:.85fr 1.15fr; gap:28px; padding:32px; border:1px solid var(--gold); border-radius:16px; background:var(--porcelain); box-shadow:var(--shadow); }
    .use-case-metric { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:24px; }
    .use-case-metric div { padding:14px; border:1px solid var(--hairline); border-radius:10px; background:var(--ivory); }
    .use-case-metric strong { display:block; font:500 20px "IBM Plex Mono"; color:var(--royal); }
    .use-case-metric span { font-size:12px; color:var(--slate); }
    .use-case-steps { display:grid; gap:12px; }
    .use-case-step { display:grid; grid-template-columns:34px 1fr; gap:12px; align-items:start; }
    .use-case-step b { width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:var(--sapphire); color:white; font:500 12px "IBM Plex Mono"; }
    .use-case-step p { margin-top:2px; }

    .pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch; }
    .price-card { position:relative; padding:28px; }
    .price-card.popular { transform: translateY(-10px); border-color: var(--gold); }
    .popular-badge { position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:var(--gold); color:var(--ink); font-size:11px; letter-spacing:.16em; padding:6px 12px; border-radius:999px; font-weight:800; }
    .price { font:500 34px "IBM Plex Mono"; margin:18px 0 6px; }
    .price span { font:500 13px Inter; color:var(--slate); }
    .savings { margin-top:18px; padding-top:16px; border-top:1px solid var(--hairline); font-size:13px; color:var(--success); font-weight:700; }
    .add-ons { margin-top:34px; overflow-x:auto; }
    table { width:100%; border-collapse:collapse; min-width:700px; background:white; border:1px solid var(--hairline); }
    th, td { padding:14px 16px; text-align:left; border-bottom:1px solid var(--hairline); }
    th { color:var(--ink); }
    td:last-child, th:last-child { text-align:right; font-family:"IBM Plex Mono"; }

    .math-compare { display:grid; grid-template-columns:1fr 1fr; border:1px solid rgba(255,255,255,.18); border-radius:14px; overflow:hidden; }
    .math-col { padding:30px; }
    .math-col + .math-col { border-left:1px solid rgba(255,255,255,.18); }
    .math-col h3 { color:white; margin-bottom:16px; }
    .math-col ul { margin:0; padding-left:18px; color:rgba(255,255,255,.76); }
    .math-col li+li { margin-top:8px; }

    details { border-bottom:1px solid var(--hairline); padding:20px 0; }
    summary { cursor:pointer; font-weight:700; list-style:none; position:relative; padding-right:30px; }
    summary::-webkit-details-marker { display:none; }
    summary::after { content:"+"; position:absolute; right:0; top:0; color:var(--royal); font-size:22px; }
    details[open] summary::after { content:"−"; }
    details p { margin-top:12px; max-width:800px; }

    .final-cta { text-align:center; }
    .final-cta h2, .final-cta p { margin-inline:auto; }
    .final-cta p { margin-top:18px; }
    .final-cta .hero-actions { justify-content:center; margin-top:28px; }

    footer { background:var(--sapphire); color:var(--ivory); padding:48px 0 28px; border-top:1px solid var(--gold); }
    .footer-grid { display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:28px; }
    .footer-grid h4 { margin:0 0 12px; }
    .footer-grid a { display:block; color:rgba(255,255,255,.68); margin:8px 0; font-size:14px; }
    .footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:34px; padding-top:20px; border-top:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.58); font-size:13px; }

    .js .reveal { opacity:0; transform:translateY(20px); transition:opacity .5s ease, transform .5s ease; }
    .js .reveal.visible { opacity:1; transform:none; }

    @keyframes pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.18)} }
    @keyframes drift { 0%,100%{translate:0 0} 50%{translate:0 -8px} }
    @keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

    @media (max-width: 980px) {
      .nav-links { display:none; position:absolute; top:72px; left:0; right:0; background:var(--sapphire); padding:20px; flex-direction:column; align-items:flex-start; }
      .nav-links.open { display:flex; }
      .nav-toggle { display:block; }
      .nav .btn-primary { display:none; }
      .hero-grid, .grid-4, .grid-3, .pricing-grid { grid-template-columns:1fr 1fr; }
      .hero-grid { grid-template-columns:1fr; }
      .employee-stage { min-height:540px; order:-1; }
      .stats-row { grid-template-columns:1fr 1fr; }
      .stat:nth-child(2) { border-right:0; }
      .stat:nth-child(-n+2) { border-bottom:1px solid rgba(250,248,242,.18); }
      .speed-row { grid-template-columns:1fr 1fr; }
      .speed-step:nth-child(2)::after { display:none; }
      .footer-grid { grid-template-columns:1fr 1fr; }
      .use-case-panel { grid-template-columns:1fr; }
    }

    @media (max-width: 680px) {
      .container { width:min(calc(100% - 22px), var(--max)); }
      .section { padding:72px 0; }
      .grid-4, .grid-3, .grid-2, .pricing-grid, .scale-grid, .math-compare, .footer-grid { grid-template-columns:1fr; }
      .problem-card { grid-template-columns:1fr; }
      .problem-fix { border-left:0; border-top:1px solid var(--hairline); }
      .employee-stage { min-height:470px; align-items:start; }
      .employee-badge { width:100%; }
      .conversation-card { width:180px; font-size:11px; }
      .c1 { top:300px; left:-4px; }
      .c2 { top:345px; right:-2px; }
      .c3, .c4 { display:none; }
      .hero-actions { flex-direction:column; }
      .btn { width:100%; }
      .stats-row { grid-template-columns:1fr; }
      .stat { border-right:0; border-bottom:1px solid rgba(250,248,242,.18); }
      .stat:last-child { border-bottom:0; }
      .speed-row { grid-template-columns:1fr; }
      .speed-step::after { display:none !important; }
      .console-row { grid-template-columns:50px 1fr; }
      .console-time { grid-column:2; }
      .math-col + .math-col { border-left:0; border-top:1px solid rgba(255,255,255,.18); }
      .price-card.popular { transform:none; margin-top:10px; }
      .footer-bottom { flex-direction:column; }
      .use-case-metric { grid-template-columns:1fr; }
    }

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

/* ---------------------------------------------------------------
   Long-form pages (legal, security, listings).
   Added after the homepage extraction — additive only, so the
   homepage is unaffected.
   --------------------------------------------------------------- */
.page-head{background:var(--sapphire);color:#fff;padding:120px 0 56px}
.page-head h1{font-family:'Playfair Display',Georgia,serif;font-size:clamp(34px,5vw,52px);line-height:1.08;margin:0 0 12px}
.page-head p{color:rgba(255,255,255,.72);max-width:640px;margin:0;font-size:17px}
.page-head .eyebrow{color:var(--gold)}
.prose{max-width:780px;margin:0 auto;padding:0}
.prose h2{font-family:'Playfair Display',Georgia,serif;font-size:26px;color:var(--ink);margin:40px 0 12px;padding-top:8px}
.prose h3{font-size:17px;color:var(--sapphire);margin:24px 0 8px;font-weight:700}
.prose p,.prose li{color:var(--slate);font-size:16px;line-height:1.72}
.prose ul{margin:12px 0 12px 20px}
.prose li{margin-bottom:7px}
.prose strong{color:var(--ink)}
.prose a{color:var(--royal)}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:18px 0}
.prose table{width:100%;min-width:420px;border-collapse:collapse;margin:0;font-size:15px}
.prose th,.prose td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--hairline);color:var(--slate)}
.prose th{color:var(--ink);font-weight:700;background:var(--ivory)}
.prose td:first-child{color:var(--ink);font-weight:600}
.updated{display:inline-block;font-size:13px;color:var(--slate);background:var(--ivory);
  border:1px solid var(--hairline);border-radius:999px;padding:6px 14px;margin-bottom:6px}
.callout{background:var(--ivory);border:1px solid var(--hairline);border-left:3px solid var(--gold);
  border-radius:10px;padding:16px 18px;margin:22px 0}
.callout p{margin:0}
.legal-nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px}
.legal-nav a{font-size:13px;padding:7px 13px;border:1px solid var(--hairline);border-radius:999px;
  color:var(--slate);text-decoration:none;background:#fff}
.legal-nav a:hover{border-color:var(--royal);color:var(--royal)}
.legal-nav a[aria-current="page"]{background:var(--sapphire);border-color:var(--sapphire);color:#fff}

/* --- industry listing grid --- */
.industry-listing{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.industry-listing .industry-card{display:block;text-decoration:none;overflow:hidden;padding:0;
  border:1px solid var(--hairline);border-radius:var(--radius);background:#fff;transition:box-shadow .2s,transform .2s,border-color .2s}
.industry-listing .industry-card:hover{box-shadow:0 10px 30px rgba(11,22,56,.10);transform:translateY(-2px);border-color:var(--sky)}
.industry-listing img{width:100%;height:auto;display:block;border-bottom:1px solid var(--hairline);background:var(--ivory)}
.industry-card-body{padding:20px 22px 24px}
.industry-card-body h3{font-family:'Playfair Display',Georgia,serif;font-size:22px;color:var(--ink);margin:6px 0 8px}
.industry-card-body .industry-headline{color:var(--royal);font-weight:600;font-size:15px;margin:0 0 8px}
.industry-card-body p{color:var(--slate);font-size:15px;line-height:1.62;margin:0 0 12px}
@media (max-width:800px){.industry-listing{grid-template-columns:1fr}}

/* --- comparison table --- */
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--hairline);
  border-radius:var(--radius);background:#fff}
table.cmp{width:100%;min-width:720px;border-collapse:collapse;font-size:15px}
table.cmp th,table.cmp td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--hairline)}
table.cmp thead th{background:var(--sapphire);color:#fff;font-weight:600;font-size:14px;
  position:sticky;top:0;white-space:nowrap}
table.cmp thead th:first-child{border-top-left-radius:var(--radius)}
table.cmp thead th.us{background:var(--royal)}
table.cmp td:first-child{color:var(--ink);font-weight:600}
table.cmp td{color:var(--slate);text-align:center}
table.cmp td:first-child{text-align:left}
table.cmp tr.group td{background:var(--ivory);color:var(--sapphire);font-weight:700;
  font-size:12px;letter-spacing:.10em;text-transform:uppercase;text-align:left}
table.cmp td.us{background:rgba(30,63,160,.045);color:var(--ink);font-weight:600}
.yes{color:var(--success);font-weight:700}
.no{color:var(--slate);opacity:.55}
.part{color:var(--warning);font-weight:600}
.cmp-note{font-size:13px;color:var(--slate);margin-top:14px}
.edge{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:34px}
.edge .card{padding:22px}
.edge h3{font-size:17px;color:var(--ink);margin:0 0 8px}
.edge p{margin:0;color:var(--slate);font-size:15px;line-height:1.6}
.edge .big{font-family:'Playfair Display',Georgia,serif;font-size:30px;color:var(--royal);
  display:block;margin-bottom:4px}
@media (max-width:800px){.edge{grid-template-columns:1fr}}