:root{
    --ink:#0c1930;        /* deep chart ink */
    --sea:#0d2547;        /* deep sea navy for dark panels */
    --sea2:#194a86;       /* secondary navy */
    --azure:#2879ed;      /* brand blue */
    --azure-deep:#1a5fd1;
    --azure-tint:#eaf2ff;
    --paper:#fbfcfe;
    --bg:#f3f6fb;
    --line:#e1e7f1;
    --muted:#64708a;
    --green:#0b9a63;
    --shadow-sm:0 10px 30px rgba(13,25,48,.06);
    --shadow-lg:0 30px 90px rgba(13,25,48,.12);
    --serif:'Source Serif 4', Georgia, serif;
    --mono:'Space Grotesk', ui-monospace, monospace;
    --sans:'Inter', system-ui, -apple-system, sans-serif;
  }
  *{box-sizing:border-box}
  html, body{scroll-behavior:smooth}
  body{
    margin:0; font-family:var(--sans); color:var(--ink); background:var(--bg);
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit}
  ::selection{ background:var(--azure); color:#fff; }

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

  /* ---------- Eyebrow / coordinate labels ---------- */
  .coord{
    font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;
    color:#8b96ad; font-weight:500;
  }
  .coord b{ color:var(--azure-deep); font-weight:600; }
  .section-label{
    font-family:var(--mono); text-align:center; padding:96px 0 30px; margin:0; letter-spacing:.22em;
    color:#9aa4b8; font-weight:600; font-size:12px; text-transform:uppercase;
    display:flex; align-items:center; gap:14px; justify-content:center;
  }
  .section-label::before, .section-label::after{
    content:""; height:1px; width:44px; background:var(--line);
  }

  /* ---------- Header (no sidebar; full-width top bar) ---------- */
  header.site-header{
    position:sticky; top:0; z-index:30; border-bottom:1px solid var(--line);
    background:rgba(251,252,254,.86); backdrop-filter:blur(16px);
    height:76px;
  }
  .brand{ height:44px; width:130px; overflow:hidden; display:block; }
  .brand img{ height:44px; width:130px; object-fit:contain; object-position:left center; }
  .brand-mark{ display:none; }

  .nav-pill{ background:#fff; border:1px solid var(--line); border-radius:999px; padding:5px; box-shadow:var(--shadow-sm); }
  .nav-pill a{
    text-decoration:none; font-size:13.5px; padding:9px 15px; border-radius:999px;
    color:#4a5468; font-weight:500; transition:.15s ease;
  }
  .nav-pill a:hover{ color:var(--ink); }
  .nav-pill a.active{ background:var(--ink); color:#fff; }

  .live-pill{
    padding:7px 12px; border-radius:999px; background:var(--azure-tint); color:var(--azure-deep);
    font-weight:600; font-size:12.5px; font-family:var(--mono); letter-spacing:.03em;
    display:inline-flex; align-items:center; gap:6px;
  }
  .live-dot{ width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 0 3px rgba(11,154,99,.18); }
  .avatar{
    width:36px; height:36px; border-radius:50%; background:linear-gradient(145deg,#f0b429,#d9ad22);
    font-weight:800; color:#fff; font-size:13px;
  }

  /* ---------- Hero ---------- */
  .hero-section{ position:relative; padding:64px 0 30px; overflow:hidden; }
  .chart-grid{
    position:absolute; inset:-40px -10% auto -10%; height:520px; z-index:0; pointer-events:none;
    background-image:
      linear-gradient(rgba(20,60,120,.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(20,60,120,.05) 1px, transparent 1px);
    background-size:44px 44px;
    mask-image:radial-gradient(ellipse 60% 100% at 50% 15%, #000 40%, transparent 85%);
  }
  .route-svg{ position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; }
  .route-path{
    fill:none; stroke:var(--azure); stroke-width:1.6; stroke-dasharray:6 7; opacity:.55;
    stroke-dashoffset:1400; stroke-dasharray:1400;
    animation:draw 2.6s ease forwards .3s;
  }
  @keyframes draw{ to{ stroke-dashoffset:0; } }
  .waypoint{ fill:var(--azure); opacity:0; animation:pop .4s ease forwards; }
  @keyframes pop{ to{ opacity:1; } }

  .hero-inner{ position:relative; z-index:1; text-align:center; }
  .hero-mark{
    width:64px; height:64px; border-radius:20px; background:#fff; border:1px solid var(--line);
    box-shadow:var(--shadow-lg); margin:0 auto 22px;
  }
  .hero-mark img{ width:44px; height:44px; object-fit:contain; }
  h1.display{
    font-family:var(--serif); font-style:italic; font-weight:500;
    letter-spacing:-.025em; font-size:clamp(38px,6vw,68px); line-height:1.05;
  }
  .lead-copy{ font-size:18.5px; line-height:1.7; max-width:760px; color:#4a5568; }
  .btn-navy{
    background:var(--ink); color:#fff; border-radius:12px; font-weight:600; padding:13px 22px;
    border:1px solid var(--ink); font-size:14.5px; transition:.15s ease;
  }
  .btn-navy:hover{ background:#08132b; color:#fff; transform:translateY(-1px); }
  .btn-outline-soft{
    background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:12px;
    font-weight:600; padding:13px 22px; font-size:14.5px; transition:.15s ease;
  }
  .btn-outline-soft:hover{ background:var(--azure-tint); border-color:#c9deff; transform:translateY(-1px); }

  .ai-box{
    max-width:880px; margin:38px auto 0; background:#fff;
    border:1.5px solid #cfe0fb; border-radius:22px; padding:6px;
    box-shadow:0 0 0 6px rgba(40,121,237,.07), var(--shadow-lg); text-align:left;
  }
  .ai-box-inner{ padding:16px 16px 12px; }
  .ai-input{ font-size:17px; color:#8d95a3; padding:6px 4px 22px; }
  .ai-tools{ border-top:1px solid var(--line); padding:14px 4px 4px; }
  .ai-menu-item{
    font-family:var(--mono); font-size:12.5px; font-weight:600; letter-spacing:.02em;
    color:#4a5468; background:var(--paper); border:1px solid var(--line); border-radius:999px;
    padding:8px 15px; cursor:pointer; transition:.15s ease;
  }
  .ai-menu-item:hover{ border-color:#c3d8f7; color:var(--ink); }
  .ai-menu-item.active{ background:var(--ink); border-color:var(--ink); color:#fff; }
  .btn-send{
    border:0; border-radius:11px; background:var(--ink); color:#fff; padding:10px 20px;
    font-weight:600; font-size:14px; opacity:.4; cursor:not-allowed; transition:opacity .2s ease;
  }
  .btn-send:hover{ background:#08132b; }
  .btn-send.is-ready{ opacity:1; cursor:pointer; }

  /* ---------- Metrics ---------- */
  .metric-card{
    background:#fff; border:1px solid var(--line); border-radius:18px; padding:22px; height:100%;
    position:relative; overflow:hidden;
  }
  .metric-card::before{
    content:""; position:absolute; top:0; left:0; width:3px; height:100%; background:var(--azure); opacity:.7;
  }
  .metric-card strong{ display:block; font-size:27px; letter-spacing:-.03em; font-family:var(--serif); font-style:italic; }
  .metric-card span{ color:var(--muted); font-size:12.5px; font-family:var(--mono); letter-spacing:.02em; text-transform:uppercase; }

  /* ---------- Cards ---------- */
  .info-card{
    background:#fff; border:1px solid var(--line); border-radius:20px;
    padding:26px; transition:.25s cubic-bezier(.2,.7,.3,1); height:100%; cursor:pointer;
  }
  .info-card:hover{ transform:translateY(-4px); border-color:#c3d8f7; box-shadow:var(--shadow-lg); }
  .info-card h3{ font-size:18.5px; letter-spacing:-.01em; margin-bottom:8px; font-weight:700; }
  .info-card p{ color:#566176; line-height:1.62; margin:0; font-size:14.8px; }
  .icon-tag{
    width:48px; height:48px; border-radius:14px; background:var(--azure-tint);
    color:var(--azure-deep); font-weight:700; font-size:12.5px; margin-bottom:18px;
    font-family:var(--mono); letter-spacing:.02em;
  }
  .open-toggle{
    display:inline-flex; align-items:center; gap:5px; margin-top:16px; color:var(--azure-deep);
    font-size:12.5px; font-weight:600; font-family:var(--mono);
  }
  .info-card.is-open .open-toggle .chev{ transform:rotate(180deg); }
  .chev{ transition:.2s ease; display:inline-block; }
  .details-panel{
    display:none; border-top:1px solid var(--line); margin-top:16px; padding-top:16px;
    color:#576277; font-size:14px; line-height:1.65;
  }
  .info-card.is-open .details-panel{ display:block; }
  .info-card.static-card{ cursor:default; }
  .info-card.static-card:hover{ transform:none; box-shadow:none; border-color:var(--line); }

  /* ---------- Dark / light split ---------- */
  .panel-dark{
    background:linear-gradient(150deg,var(--sea) 0%, var(--sea2) 100%); color:#fff;
    border-radius:24px; padding:34px; box-shadow:var(--shadow-lg); height:100%;
    position:relative; overflow:hidden;
  }
  .panel-dark::after{
    content:""; position:absolute; right:-60px; bottom:-60px; width:220px; height:220px;
    border:1px solid rgba(255,255,255,.08); border-radius:50%;
  }
  .panel-dark h2{ font-family:var(--serif); font-style:italic; font-weight:500; font-size:31px; letter-spacing:-.02em; }
  .panel-dark p{ color:#c7d7ee; line-height:1.65; font-size:15px; }
  .panel-row{ display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.12); font-size:14.5px; }
  .panel-row:last-child{ border-bottom:0; }
  .panel-row span{ color:#9fb3cf; font-family:var(--mono); font-size:12.5px; text-transform:uppercase; letter-spacing:.05em; }
  .panel-light{
    background:#fff; border:1px solid var(--line); border-radius:24px; padding:34px;
    box-shadow:var(--shadow-sm); height:100%;
  }
  .panel-light h2{ font-family:var(--serif); font-style:italic; font-weight:500; font-size:31px; letter-spacing:-.02em; }
  .panel-light p{ color:#566176; line-height:1.65; font-size:15px; }
  .quote-line{ border-left:3px solid var(--azure); padding-left:16px; margin-top:20px; font-weight:600; color:#26364e; font-size:15px; }

  /* ---------- Team ---------- */
  .avatar-tag{
    width:50px; height:50px; border-radius:14px; background:var(--azure-tint);
    color:var(--azure-deep); font-weight:700; font-size:12.5px; flex-shrink:0; font-family:var(--mono);
  }
  .role-line{ font-size:12.5px; color:#7a8495; margin-top:3px; font-family:var(--mono); }
  .badge-soft{
    font-size:11px; padding:6px 10px; border:1px solid var(--line); border-radius:999px;
    background:var(--paper); color:#5f6b80; font-weight:500;
  }

  /* ---------- Contact ---------- */
  .contact-form-card{ background:#fff; border:1px solid var(--line); border-radius:26px; padding:32px; box-shadow:var(--shadow-sm); }
  .contact-form-card h2{ font-family:var(--serif); font-style:italic; font-weight:500; }
  .contact-form-card label{ font-size:11.5px; color:#657186; font-weight:700; margin-bottom:6px; text-transform:uppercase; letter-spacing:.04em; font-family:var(--mono); }
  .contact-form-card .form-control, .contact-form-card .form-select{
    border:1px solid var(--line); border-radius:12px; padding:11px 13px; background:var(--paper); color:#17233a; font-size:14.5px;
  }
  .contact-form-card .form-control:focus, .contact-form-card .form-select:focus{
    border-color:var(--azure); box-shadow:0 0 0 .2rem var(--azure-tint);
  }
  .contact-side-card{
    background:linear-gradient(150deg,var(--sea) 0%, #2a68b8 100%); color:#fff; border-radius:26px; padding:32px; height:100%;
  }
  .contact-side-card h2{ font-family:var(--serif); font-style:italic; font-weight:500; }
  .contact-side-card p{ color:#cfe0f5; line-height:1.65; font-size:14.8px; }
  .contact-side-card img{ background:#fff; border-radius:12px; padding:7px 11px; height:46px; width:auto; object-fit:contain; }
  .contact-line{ padding:15px 0; border-bottom:1px solid rgba(255,255,255,.14); }
  .contact-line:last-child{ border-bottom:0; }
  .contact-line small{ display:block; color:#9fb3cf; margin-bottom:4px; font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.04em; }

  /* ---------- CTA ---------- */
  .cta-band{
    margin-top:70px; border-radius:28px; background:linear-gradient(135deg,var(--ink),var(--azure-deep));
    color:#fff; text-align:center; padding:56px 24px; position:relative; overflow:hidden;
  }
  .cta-band .chart-grid{ opacity:.5; height:100%; inset:0; }
  .cta-band-inner{ position:relative; z-index:1; }
  .cta-band img{ width:52px; height:52px; object-fit:contain; margin-bottom:10px; }
  .cta-band h2{ font-family:var(--serif); font-style:italic; font-weight:500; font-size:36px; letter-spacing:-.02em; }
  .cta-band p{ max-width:700px; margin:0 auto; color:#d6e5fb; line-height:1.6; font-size:15.5px; }

  footer.site-footer{
    margin-top:40px; padding:28px 0 12px; border-top:1px solid var(--line);
    color:#7a8495; font-size:13px;
  }
  footer.site-footer img{ height:26px; width:auto; object-fit:contain; }

  /* ---------- Scroll reveal ---------- */
  .reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }
  .offcanvas-body a.text-decoration-none.text-dark {
    font-size: 18px;
    font-family: 'Space Grotesk', ui-monospace, monospace;
  }
  a {
      text-decoration: none;
  }