:root{
    --indigo:#0057ff;
    --indigo-2:#0070ff;
    --indigo-soft:#e6efff;
    --ink:#0E0F1A;
    --ink-2:#1A1B2B;
    --muted:#6B6F8A;
    --line:#ECEAF5;
    --bg:#F6F5FB;
    --card:#FFFFFF;
    --dark:#0B0B1F;
    --dark-2:#15163A;
  }
  *{box-sizing:border-box}
  a{text-decoration:none;}
  .container{ max-width:1440px; margin:0 auto; padding:0 130px; }
  @media(max-width:1280px){ .container{ padding:0 64px; } }
  @media(max-width:860px){ .container{ padding:0 28px; } }
  @media(max-width:600px){ .container{ padding:0 20px; } }
  html{
    background:#fff;
    color-scheme: only light;
  }
  html,body{margin:0;padding:0}
  body{
    font-family:'Bricolage Grotesque', sans-serif;
    background:#fff;
    color:var(--ink);
    min-height:100vh;
    -webkit-font-smoothing:antialiased;
    padding:0;
  }

  /* Sticky header */
  .header{
    position:sticky;
    top:0;
    z-index:50;
    background:#fff;
    padding:0;
    margin:0;
    transition:box-shadow .2s ease, border-color .2s ease;
    border-bottom:1px solid rgba(0,0,0,.06);
    overflow:visible;
  }
  .header.scrolled{
    box-shadow:0 8px 24px -18px rgba(0,0,0,.12);
    border-bottom-color:rgba(0,0,0,.08);
  }

  /* Top bar */
  .nav{
    max-width:1440px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:12px 130px;
    margin-top:-25px !important;
  }
  .brand{
    display:flex; align-items:center; gap:12px;
    font-size:28px; font-weight:700; letter-spacing:-0.02em; color:var(--ink);
  }
  .brand-logo{ height:36px; width:auto; display:block; }
  .brand-mark{
    width:34px; height:34px;
    display:grid; place-items:center;
  }
  .nav-links{
    display:flex; align-items:center; gap:32px;
    font-weight:600; font-size:15px; color:var(--ink);
    position:relative;
  }
  .nav-link{
    display:inline-flex; align-items:center; gap:6px;
    cursor:pointer; padding:8px 2px;
    position:relative;
  }
  .nav-link .chev{ width:14px; height:14px; transition:transform .2s ease; }
  .nav-link.active{ color:var(--indigo); }
  .nav-link.active .chev{ transform:rotate(180deg); color:var(--indigo); }
  .nav-link.active::after{
    content:""; position:absolute; left:0; right:0; bottom:-2px;
    height:2px; background:var(--indigo); border-radius:2px;
  }

  .nav-right{
    display:flex; align-items:center; gap:20px;
  }
  .nav-cta-link{
    display:inline-flex; align-items:center; gap:5px;
    color:var(--indigo);
    font-size:14.5px; font-weight:600;
    text-decoration:none;
    white-space:nowrap;
    transition:opacity .15s ease;
  }
  .nav-cta-link:hover{ opacity:.75; }
  .nav-cta-link svg{ flex:none; }

  .cta{
    background:#0070ff;
    color:#fff;
    font-family:inherit;
    font-weight:600;
    font-size:14.5px;
    padding:11px 20px;
    border-radius:11px;
    display:inline-flex; align-items:center; gap:10px;
    border:none; cursor:pointer;
    box-shadow:0 6px 18px rgba(13,14,40,.25);
  }
  .cta:hover{ background:#0057cc; }

  /* Mega menu */
  .menu-wrap{
    position:absolute;
    left:0; right:0;
    top:100%;
    z-index:100;
    overflow:hidden;
    max-height:1200px;
    opacity:1;
    transition:max-height .35s ease, opacity .25s ease;
  }
  .menu-wrap.closed{
    max-height:0;
    opacity:0;
    pointer-events:none;
  }
  .arrow-tab{ display:none; }

  /* Resources menu variant */
  .menu.resources{
    grid-template-columns: 1fr 300px;
    gap:20px;
  }
  .menu.resources .grid{
    grid-template-columns: repeat(4, 1fr);
    row-gap:4px;
  }
  .menu.resources .grid::before{ left:calc(25% - 2px); display:block; }
  .menu.resources .grid::after{ left:calc(75% - 2px); display:block; }
  .menu.resources .grid .extra-div{
    position:absolute; top:8px; bottom:8px;
    width:1px; background:var(--line);
    left:calc(50% - 1px);
  }

  /* Newsletter card (mega menu only - scoped to avoid conflict with blog sidebar) */
  .menu .newsletter{
    background:#F4F1FF;
    border-radius:14px;
    padding:20px 22px;
    position:relative;
    overflow:hidden;
    display:flex; flex-direction:column;
  }
  .menu .newsletter h4{
    font-size:16px; font-weight:700; letter-spacing:-0.01em; margin:0 0 8px;
    color:var(--ink);
    position:relative; z-index:1;
  }
  .menu .newsletter p{
    font-size:12.5px; color:var(--muted); line-height:1.5; margin:0 0 14px;
    max-width:180px;
    position:relative; z-index:1;
  }
  .newsletter-link{
    display:inline-flex; align-items:center; gap:8px;
    color:var(--indigo); font-weight:600; font-size:13.5px;
    text-decoration:none; cursor:pointer;
    position:relative; z-index:1;
  }
  .newsletter-art{
    position:absolute;
    right:-18px; top:30px;
    width:130px; height:110px;
    pointer-events:none;
    opacity:.95;
  }
  .menu{
    position:relative;
    background:#fff;
    border:none;
    border-top:1px solid var(--line);
    border-radius:0;
    padding:24px 130px 26px;
    display:grid;
    grid-template-columns: 1fr 320px;
    gap:26px;
    box-shadow: 0 24px 48px -20px rgba(20,18,60,.14);
  }

  .pill{
    display:inline-block;
    background:var(--indigo-soft);
    color:var(--indigo);
    font-weight:700;
    font-size:10px;
    letter-spacing:.14em;
    padding:6px 12px;
    border-radius:999px;
    margin-bottom:14px;
  }

  .grid{
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap:20px;
    row-gap:4px;
    position:relative;
  }
  /* vertical divider between columns */
  .grid::before{
    content:""; position:absolute; top:8px; bottom:8px;
    width:1px; background:var(--line);
    left:50%;
  }
  .grid::after{ display:none; }

  .card{
    display:grid;
    grid-template-columns:42px 1fr 18px;
    grid-template-rows:auto auto;
    column-gap:12px;
    row-gap:2px;
    padding:10px 12px;
    border-radius:12px;
    color:inherit;
    text-decoration:none;
    border:1px solid transparent;
    cursor:pointer;
    transition:background .15s ease, border-color .15s ease;
    align-items:center;
  }
  .card:hover{
    background:#f5f4fb;
    border-color:var(--line);
  }
  .card:hover .card-title{ color:var(--indigo); }
  .card:hover .arrow-link{ opacity:1; transform:translateX(2px); }

  .num{ display:none; }

  .icon-wrap{
    grid-column:1;
    grid-row:1/3;
    align-self:center;
    display:flex; align-items:center; justify-content:center;
    height:auto;
    margin-bottom:0;
    padding-left:0;
  }
  .glass{
    position:relative;
    width:42px; height:42px;
    border-radius:10px;
    background:linear-gradient(155deg, rgba(255,255,255,.95), rgba(230,239,255,.7));
    border:1px solid rgba(0,87,255,.15);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.9),
      0 6px 16px -10px rgba(0,87,255,.3);
    overflow:visible;
    flex-shrink:0;
  }
  .glass .sparkle{
    position:absolute; top:-4px; right:-5px;
    width:10px; height:10px; color:var(--indigo);
  }
  .glass .sparkle.small{
    width:6px; height:6px; top:auto; right:-9px; bottom:10px; opacity:.7;
  }
  .glass-inner{
    position:absolute; inset:5px;
    display:flex; align-items:center; justify-content:center;
    color:var(--indigo);
  }
  /* stacked card icon */
  .stack{
    position:relative; width:42px; height:42px;
    flex-shrink:0;
  }
  .stack .sheet{
    position:absolute;
    width:34px; height:28px;
    border-radius:7px;
    background:linear-gradient(155deg, rgba(255,255,255,.95), rgba(230,239,255,.6));
    border:1px solid rgba(0,87,255,.15);
    box-shadow:0 6px 14px -10px rgba(0,87,255,.4);
  }
  .stack .s1{ top:0; left:0; transform:rotate(-6deg); }
  .stack .s2{ top:2px; left:5px; transform:rotate(2deg); }
  .stack .s3{ top:6px; left:9px; display:flex; align-items:center; justify-content:center; color:var(--indigo); }

  .card-title{
    grid-column:2;
    grid-row:1;
    align-self:end;
    font-weight:700; font-size:14.5px; color:var(--ink); letter-spacing:-0.01em;
    margin:0 0 2px;
    transition:color .15s ease;
    line-height:1.25;
  }
  .card-desc{
    grid-column:2;
    grid-row:2;
    align-self:start;
    font-size:12px; color:var(--muted); line-height:1.4;
    margin:0;
  }
  .arrow-link{
    grid-column:3;
    grid-row:1/3;
    align-self:center;
    width:16px; height:16px; color:var(--indigo);
    display:block;
    opacity:0;
    transition:opacity .15s ease, transform .2s ease;
    flex-shrink:0;
  }

  /* ── Services grid ── */
  .svc-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 20px;
    position:relative;
    flex:1;
  }
  .svc-grid::before{
    content:''; position:absolute;
    left:50%; top:6px; bottom:6px;
    width:1px; background:var(--line);
  }
  .svc-panel{
    display:flex;
    flex-direction:column;
  }
  .svc-col-head{
    display:inline-flex; align-items:center; gap:6px;
    font-size:11px; font-weight:700; letter-spacing:.12em;
    text-transform:uppercase; color:var(--muted);
    margin:0 0 6px; padding:0 10px;
  }

  .svc-link{
    display:grid;
    grid-template-columns:36px 1fr 16px;
    grid-template-rows:auto auto;
    column-gap:13px;
    row-gap:2px;
    padding:14px 10px;
    border-radius:11px;
    text-decoration:none;
    color:inherit;
    border:1px solid transparent;
    transition:background .14s ease, border-color .14s ease;
    align-items:center;
    align-content:center;
    flex:1;
  }
  .svc-link:hover{
    background:#f5f4fb;
    border-color:var(--line);
  }
  .svc-link-ic{
    grid-column:1; grid-row:1/3;
    width:36px; height:36px;
    border-radius:9px;
    background:var(--indigo-soft);
    color:var(--indigo);
    display:grid; place-items:center;
    align-self:center;
    flex-shrink:0;
  }
  .svc-link-name{
    grid-column:2; grid-row:1;
    font-weight:700; font-size:14.5px;
    color:var(--ink); letter-spacing:-.01em;
    align-self:end;
    transition:color .14s ease;
    line-height:1.2;
    margin-bottom:1px;
  }
  .svc-link:hover .svc-link-name{ color:var(--indigo); }
  .svc-link-desc{
    grid-column:2; grid-row:2;
    font-size:12px; color:var(--muted);
    align-self:start; line-height:1.4;
  }
  .svc-link-arrow{
    grid-column:3; grid-row:1/3;
    align-self:center;
    width:15px; height:15px; color:var(--indigo);
    display:block;
    opacity:0;
    transition:opacity .14s ease, transform .18s ease;
    flex-shrink:0;
  }
  .svc-link:hover .svc-link-arrow{ opacity:1; transform:translateX(2px); }

  /* Services footer row */
  .menu-left{
    display:flex; flex-direction:column;
  }
  .svc-footer{
    display:flex; align-items:center; justify-content:space-between;
    margin-top:auto;
    padding-top:16px;
    border-top:1px solid var(--line);
  }
  .svc-footer-link{
    display:inline-flex; align-items:center; gap:6px;
    font-size:13px; font-weight:600; color:var(--indigo);
    text-decoration:none;
    transition:gap .15s ease;
  }
  .svc-footer-link:hover{ gap:10px; }
  .svc-footer-note{
    font-size:11.5px; color:var(--muted); font-weight:500;
  }

  /* Promo panel */
  .promo{
    position:relative;
    background:
      radial-gradient(circle at 85% 18%, rgba(124,58,237,.4), transparent 45%),
      radial-gradient(circle at 110% 90%, rgba(0,87,255,.35), transparent 50%),
      linear-gradient(160deg, #0E0E2E 0%, #14123A 60%, #0B0B1F 100%);
    border-radius:16px;
    padding:18px 20px;
    color:#fff;
    overflow:hidden;
    display:flex; flex-direction:column;
  }
  .stars{
    position:absolute; inset:0; pointer-events:none;
  }
  .stars i{
    position:absolute; width:2px; height:2px; background:#fff; border-radius:50%;
    opacity:.7;
  }
  .promo-icon{
    width:38px; height:38px; border-radius:10px;
    background:linear-gradient(160deg, #0057ff, #7c3aed);
    display:grid; place-items:center;
    box-shadow: 0 0 0 1px rgba(255,255,255,.06) inset, 0 6px 18px rgba(0,87,255,.4);
    margin-bottom:14px;
  }
  .promo-title{
    font-size:19px; font-weight:700; line-height:1.2; letter-spacing:-0.02em;
    margin:0 0 6px;
  }
  .promo-sub{
    font-size:12.5px; color:#C9C5E6; line-height:1.45;
    margin:0 0 12px;
  }

  .stat-card{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    border-radius:12px;
    padding:10px 14px;
    margin-bottom:12px;
    position:relative; overflow:hidden;
  }
  .stat-card .label{
    font-size:11px; color:#B7B3D6; margin-bottom:4px; font-weight:500;
  }
  .stat-row{ display:flex; align-items:baseline; gap:8px; }
  .stat-num{ font-size:22px; font-weight:700; letter-spacing:-0.02em; }
  .stat-delta{
    color:#5BE3A4; font-size:12.5px; font-weight:600;
    display:inline-flex; align-items:center; gap:2px;
  }
  .spark{
    position:absolute; right:10px; bottom:6px; width:110px; height:30px;
  }

  .platforms{
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    border-radius:12px;
    padding:10px 14px 12px;
    margin-bottom:12px;
  }
  .platforms .label{ font-size:11px; color:#B7B3D6; margin-bottom:8px; font-weight:500; }
  .platforms-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
  .plat{
    flex:1;
    display:flex; flex-direction:column; align-items:center; gap:8px;
  }
  .plat-ic{
    width:22px; height:22px; color:#fff; opacity:.95;
    display:grid; place-items:center;
  }
  .bar{ width:100%; height:4px; border-radius:3px; background:rgba(255,255,255,.1); overflow:hidden; }
  .bar i{ display:block; height:100%; background:linear-gradient(90deg,#0057ff,#7c3aed); border-radius:3px; }

  .promo-cta{
    margin-top:auto;
    background:transparent;
    border:1.5px solid rgba(0,87,255,.4);
    color:#fff;
    font-family:inherit;
    font-weight:600; font-size:13.5px;
    padding:11px 16px;
    border-radius:11px;
    display:flex; align-items:center; justify-content:space-between;
    cursor:pointer;
    box-shadow:0 8px 24px -10px rgba(0,87,255,.3);
  }
  .promo-cta:hover{ background:rgba(0,87,255,.1); }

  /* Page caption */
  .caption{
    max-width:1440px; margin:18px auto 0; padding:0 8px;
    color:var(--muted); font-size:13px;
  }
  .caption b{ color:var(--ink); font-weight:600; }

  /* Demo scrollable content below header */
  .page-body{
    max-width:1240px;
    margin:48px auto;
    padding:0 32px 120px;
  }
  .hero-h{
    font-size:64px; font-weight:700; letter-spacing:-0.03em;
    line-height:1.05; margin:0 0 18px; max-width:900px;
  }
  .hero-h em{ font-style:normal; color:var(--indigo); }
  .hero-p{
    font-size:18px; color:var(--muted); line-height:1.55; max-width:680px;
    margin:0 0 36px;
  }
  .section-block{
    background:transparent; border:none; border-radius:0;
    padding:0; margin-top:28px;
  }
  .section-block h2{
    font-size:26px; letter-spacing:-0.02em; margin:0 0 10px;
  }
  .section-block p{
    color:var(--muted); font-size:15px; line-height:1.6; margin:0;
    max-width:760px;
  }

  /* Mobile hamburger / close button - hidden on desktop */
  .mobile-btn{
    display:none;
    width:42px; height:42px;
    border:none; background:transparent;
    align-items:center; justify-content:center;
    color:var(--ink); cursor:pointer; padding:0;
    border-radius:10px;
  }
  .mobile-btn:hover{ background:rgba(20,18,60,.04); }

  /* Mobile drawer */
  .mobile-drawer{
    display:flex;
    position:fixed;
    inset:0;
    z-index:60;
    background:#fff;
    flex-direction:column;
    overflow:hidden;
    transform:translateX(100%);
    visibility:hidden;
    transition:transform .35s cubic-bezier(.22,.61,.36,1), visibility 0s linear .35s;
  }
  .mobile-drawer.open{
    transform:translateX(0);
    visibility:visible;
    transition:transform .35s cubic-bezier(.22,.61,.36,1), visibility 0s linear 0s;
  }
  .mobile-top{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 22px 14px;
    background:#fff;
  }
  .mobile-top .brand{ font-size:24px; }
  .mobile-top .brand-mark{ width:30px; height:30px; }

  /* Panels container - three columns slide horizontally */
  .panels{
    position:relative;
    flex:1;
    overflow:hidden;
  }
  .panel{
    position:absolute;
    inset:0;
    padding:8px 18px 40px;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    transition: transform .35s cubic-bezier(.22,.61,.36,1);
    will-change:transform;
    background:#fff;
    transform: translate3d(100%, 0, 0);
    visibility:hidden;
  }
  .panel.main{
    transform: translate3d(0, 0, 0);
    visibility:visible;
    display:flex;
    flex-direction:column;
  }
  .panel.main .m-list{
    flex-shrink:0;
  }
  .panel.main .m-cta{
    flex-shrink:0;
    margin-top:16px;
  }
  .panel.main .m-promo-card{
    flex-shrink:0;
    margin-top:auto;
    padding-top:26px;
  }

  /* When showing a sub panel - main slides out left, sub slides in from right */
  .panels.show-services .panel.main,
  .panels.show-resources .panel.main{
    transform: translate3d(-30%, 0, 0);
    visibility:visible;
  }
  .panels.show-services .panel.services,
  .panels.show-resources .panel.resources{
    transform: translate3d(0, 0, 0);
    visibility:visible;
  }
  /* Keep visibility on the panel that just left so its transition can finish */
  .panel.was-active{ visibility:visible; }

  /* Main panel - list of nav items */
  .m-list{
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    padding:6px 0;
    box-shadow:0 10px 30px -22px rgba(20,18,60,.18);
  }
  .m-row{
    display:flex; align-items:center; gap:14px;
    padding:18px 18px;
    cursor:pointer;
    border-bottom:1px solid var(--line);
  }
  .m-row:last-child{ border-bottom:none; }
  .m-row .m-ic{
    width:36px; height:36px; border-radius:9px;
    background:var(--indigo-soft); color:var(--indigo);
    display:grid; place-items:center;
    flex:none;
  }
  .m-row .m-label{
    flex:1; font-size:17px; font-weight:600; color:var(--ink);
  }
  .m-row .m-chev{
    width:18px; height:18px; color:var(--ink); opacity:.6;
  }

  .m-cta{
    display:flex; align-items:center; justify-content:center; gap:14px;
    background:#0070ff; color:#fff;
    font-weight:600; font-size:17px;
    border:none; cursor:pointer;
    width:100%;
    padding:20px;
    border-radius:14px;
    margin-top:22px;
    font-family:inherit;
  }

  .m-promo-card{
    margin-top:26px;
    background:linear-gradient(180deg, #FFFFFF 0%, #EFE9FF 100%);
    border:1px solid var(--line);
    border-radius:18px;
    padding:22px;
    display:flex; gap:14px;
    align-items:flex-start;
  }
  .m-promo-card .m-spark{
    width:24px; height:24px; color:var(--indigo); flex:none;
  }
  .m-promo-card h4{
    margin:0 0 8px; font-size:17px; font-weight:700; letter-spacing:-0.01em; color:var(--ink);
    line-height:1.25;
  }
  .m-promo-card p{
    margin:0; font-size:14px; color:var(--muted); line-height:1.45;
  }

  /* Sub panel header */
  .sub-head{
    display:flex; align-items:center; gap:12px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:12px 14px;
    margin-bottom:18px;
  }
  .sub-head .back{
    width:32px; height:32px; border-radius:8px;
    border:none; background:transparent;
    display:grid; place-items:center;
    cursor:pointer; color:var(--ink);
  }
  .sub-head .back:hover{ background:rgba(20,18,60,.04); }
  .sub-head .sub-ic{
    width:34px; height:34px; border-radius:9px;
    background:var(--indigo); color:#fff;
    display:grid; place-items:center;
  }
  .sub-head .sub-title{
    font-size:18px; font-weight:700; color:var(--ink); flex:1;
  }
  .sub-head .close{
    width:32px; height:32px; border-radius:8px;
    border:none; background:transparent;
    display:grid; place-items:center;
    cursor:pointer; color:var(--ink);
  }

  .sub-pill{
    display:block;
    color:var(--indigo); font-weight:700; font-size:12px;
    letter-spacing:.14em;
    margin:8px 4px 16px;
  }

  .m-card{
    display:flex; gap:14px; align-items:flex-start;
    padding:14px 4px;
    border-bottom:1px solid var(--line);
    cursor:pointer;
    color:inherit;
    text-decoration:none;
  }
  .m-card:last-of-type{ border-bottom:none; }
  .m-card .m-card-ic{
    width:44px; height:44px; border-radius:11px;
    background:var(--indigo-soft); color:var(--indigo);
    display:grid; place-items:center;
    flex:none;
  }
  .m-card-body{ flex:1; min-width:0; }
  .m-card-title{
    font-size:15.5px; font-weight:700; color:var(--ink); letter-spacing:-0.01em;
    margin:0 0 4px; line-height:1.25;
  }
  .m-card-desc{
    font-size:13px; color:var(--muted); line-height:1.45; margin:0;
  }
  .m-card-arrow{
    width:18px; height:18px; color:var(--indigo); flex:none; margin-top:12px;
  }

  /* Bottom highlight card (services promo & newsletter) */
  .m-bottom{
    margin-top:22px;
    border-radius:18px;
    padding:22px;
    position:relative;
    overflow:hidden;
  }
  .m-bottom.dark{
    background:
      radial-gradient(circle at 85% 14%, rgba(124,58,237,.38), transparent 45%),
      linear-gradient(160deg, #0E0E2E 0%, #14123A 60%, #0B0B1F 100%);
    color:#fff;
  }
  .m-bottom.light{
    background:#F1ECFF;
    color:var(--ink);
  }
  .m-bottom .m-bottom-ic{
    width:42px; height:42px; border-radius:11px;
    background:linear-gradient(160deg, #0057ff, #7c3aed);
    display:grid; place-items:center;
    margin-bottom:14px;
    box-shadow:0 6px 18px rgba(0,87,255,.35);
  }
  .m-bottom h3{
    font-size:20px; font-weight:700; letter-spacing:-0.02em; line-height:1.2; margin:0 0 10px;
  }
  .m-bottom p{ font-size:13.5px; line-height:1.5; margin:0 0 14px; opacity:.85; }
  .m-bottom.dark p{ color:#C9C5E6; opacity:1; }
  .m-bottom-link{
    display:inline-flex; align-items:center; gap:8px;
    font-weight:600; font-size:14px; text-decoration:none; cursor:pointer;
  }
  .m-bottom.dark .m-bottom-link{ color:#99b8ff; }
  .m-bottom.light .m-bottom-link{ color:var(--indigo); }


  @media (max-width: 1280px){
    .nav-links{ gap:32px; }
    .brand{ font-size:24px; }
  }
  @media (max-width: 1180px){
    .menu{ grid-template-columns:1fr; }
    .menu.resources{ grid-template-columns:1fr; }
    .promo{ order:2; max-width:none; }
    .menu .newsletter{ order:2; }
    .menu.resources .grid{ grid-template-columns: repeat(2, 1fr); row-gap:4px; }
    .menu.resources .grid::before{ left:50%; display:block; }
    .menu.resources .grid::after{ display:none; }
    .menu.resources .grid > .extra-div{ display:none; }
  }
  @media (max-width: 980px){
    .grid{ grid-template-columns: 1fr; row-gap:2px; }
    .grid::before{ display:none; }
    .header{ padding:0; }
    .nav{ padding:10px 24px; }
    .menu{ padding-left:18px; padding-right:18px; }
  }
  @media (max-width: 820px){
    .nav-links{ display:none !important; }
    .nav-right{ display:none !important; }
    .mobile-btn{ display:inline-flex !important; }
    .menu-wrap{ display:none; }
    .header{ padding:0; }
    .nav{ padding:10px 16px; margin:0; }
    .page-body{ padding:0 18px 80px; margin-top:24px; }
    .hero-h{ font-size:48px; }
    .hero-p{ font-size:15px; }
    .section-block{ padding:22px; }
  }
  @media (max-width: 560px){
    .hero-h{ font-size:40px; }
    .section-block h2{ font-size:20px; }
    .section-block{ padding:18px; border-radius:14px; }
    .page-body{ padding:0 14px 60px; }
    .panel{ padding:8px 14px 32px; }
    .m-row{ padding:16px 14px; }
    .m-row .m-label{ font-size:16px; }
    .m-card-title{ font-size:15px; }
    .m-card-desc{ font-size:12.5px; }
  }
  @media (max-width: 380px){
    .mobile-top .brand{ font-size:20px; }
    .mobile-top .brand-mark{ width:26px; height:26px; }
    .m-bottom h3{ font-size:18px; }
  }

/* ============================================================
   SHARED DEPTH SECTION STYLES - Split dark/light layout
   ============================================================ */

/* Section = full-width grid, no container wrapper needed */
.chatgpt-depth,
.audit-depth,
.avm-explainer,
.aco-depth,
.geo-depth {
  display:grid;
  grid-template-columns:420px 1fr;
  min-height:520px;
}

/* Left dark panel */
.depth-left{
  background:#0B0B12;
  padding:72px 52px;
  display:flex;flex-direction:column;justify-content:flex-start;gap:40px;
  position:relative;overflow:hidden;
}
.depth-left::before{
  content:'';position:absolute;
  top:-100px;right:-100px;
  width:300px;height:300px;
  background:radial-gradient(circle,rgba(0,87,255,.18) 0%,transparent 70%);
  pointer-events:none;
}
.depth-left::after{
  content:'';position:absolute;
  bottom:-80px;left:-60px;
  width:240px;height:240px;
  background:radial-gradient(circle,rgba(124,58,237,.15) 0%,transparent 70%);
  pointer-events:none;
}
.depth-eyebrow{
  display:inline-block;
  font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:#4d9eff;margin-bottom:24px;
  position:relative;z-index:1;
}
.depth-heading{
  font-size:34px;font-weight:800;letter-spacing:-.03em;
  color:#fff;line-height:1.15;margin:0 0 20px;
  position:relative;z-index:1;
}
.depth-tagline{
  font-size:15px;color:rgba(255,255,255,.5);
  line-height:1.7;margin:0;
  position:relative;z-index:1;
}
/* Stats 2x2 grid inside left panel */
.depth-stats{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:rgba(255,255,255,.08);
  border-radius:16px;overflow:hidden;
  position:relative;z-index:1;
}
.depth-stat{
  background:#0B0B12;
  padding:20px 18px;
}
.depth-stat-val{
  font-size:24px;font-weight:800;letter-spacing:-.03em;
  background:linear-gradient(90deg,#4d9eff,#a78bfa);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  line-height:1.1;margin-bottom:4px;
}
.depth-stat-lab{
  font-size:11px;color:rgba(255,255,255,.4);font-weight:500;line-height:1.4;
}

/* Right white panel */
.depth-right{
  background:#fff;
  padding:64px 60px;
  display:flex;flex-direction:column;
  border-left:1px solid #EEEEF2;
}
.depth-block{ flex:1; }
.depth-divider{
  height:1px;background:#E4E5EC;
  margin:36px 0;
}

/* Gradient number badge */
.depth-num{
  width:36px;height:36px;flex-shrink:0;
  background:linear-gradient(135deg,#0057ff,#7c3aed);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:#fff;letter-spacing:.04em;
  margin-bottom:18px;
}
.depth-col-title{
  font-size:18px;font-weight:700;color:#0B0B12;
  margin:0 0 16px;line-height:1.35;
}
.depth-block p{
  font-size:15px;color:#3A3A48;line-height:1.8;
  margin:0 0 14px;
}
.depth-block p:last-child{margin-bottom:0;}

/* Responsive */
@media(max-width:1100px){
  .chatgpt-depth,
  .audit-depth,
  .avm-explainer,
  .aco-depth,
  .geo-depth { grid-template-columns:340px 1fr; }
  .depth-left{padding:60px 40px;}
  .depth-heading{font-size:28px;}
  .depth-right{padding:56px 44px;}
}
@media(max-width:860px){
  .chatgpt-depth,
  .audit-depth,
  .avm-explainer,
  .aco-depth,
  .geo-depth { grid-template-columns:1fr;min-height:auto; }
  .depth-left{padding:52px 32px;gap:32px;}
  .depth-stats{grid-template-columns:repeat(4,1fr);}
  .depth-heading{font-size:28px;}
  .depth-right{padding:48px 32px;border-left:none;border-top:1px solid #EEEEF2;}
}
@media(max-width:600px){
  .depth-left{padding:44px 22px;gap:24px;}
  .depth-heading{font-size:24px;}
  .depth-tagline{font-size:14px;}
  .depth-stats{grid-template-columns:repeat(2,1fr);}
  .depth-stat-val{font-size:20px;}
  .depth-right{padding:40px 22px;}
  .depth-col-title{font-size:16px;}
  .depth-block p{font-size:14px;}
  .depth-divider{margin:28px 0;}
  .depth-num{width:32px;height:32px;font-size:11px;border-radius:8px;}
}
@media(max-width:400px){
  .depth-heading{font-size:22px;}
  .depth-left,.depth-right{padding-left:18px;padding-right:18px;}
}

/* ============================================================
   GLOBAL MOBILE - text alignment (all pages)
   ============================================================ */
@media (max-width: 760px) {
  /* Headings + labels stay left */
  h1, h2, h3, h4, h5, h6,
  .seclabel, .sectitle,
  .eyebrow, .pill, .sec-tag,
  .section-eyebrow, .dark-eyebrow,
  .avm-eyebrow, .geo-section-eyebrow,
  .depth-eyebrow, .depth-heading,
  .depth-col-title,
  .page-hero-label, .page-hero-title,
  .ap-eyebrow,
  .ins-head .ctr {
    text-align: left !important;
  }
  /* Body text justify */
  p,
  .depth-tagline,
  .depth-block p,
  .page-hero-desc,
  .about-prose,
  .ap-intro,
  .trusted-label,
  .hero {
    text-align: justify !important;
  }
}

/* ============================================================
   FAQ2 - Shared two-column accordion (all pages)
   ============================================================ */
.faq2-section{ padding: 80px 0; background: #F6F5FB; }
.faq2-wrap{
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 64px;
  align-items: start;
}
.faq2-head{ position: sticky; top: 100px; }
.faq2-label{
  font-size: 11px; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: #0057ff; margin-bottom: 14px;
}
.faq2-title{
  font-size: 28px; font-weight: 800; color: #0E0F1A;
  letter-spacing: -.025em; line-height: 1.25; margin: 0 0 14px;
}
.faq2-desc{ font-size: 14px; color: #6B6F8A; line-height: 1.7; margin: 0 0 24px; }
.faq2-cta{
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 14px; font-weight: 700; color: #0057ff;
  transition: gap .2s ease;
}
.faq2-cta:hover{ gap: 10px; }
.faq2-list{ display: flex; flex-direction: column; gap: 0; }
.faq2-item{
  background: #fff;
  border: 1px solid #ECEAF5;
  border-radius: 14px;
  margin-bottom: 10px;
  overflow: hidden;
  transition: box-shadow .2s ease;
}
.faq2-item:hover{ box-shadow: 0 4px 20px rgba(0,0,0,.06); }
.faq2-item.open{ box-shadow: 0 4px 20px rgba(0,87,255,.08); border-color: #c7d8ff; }
.faq2-q{
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 20px 22px;
  background: none; border: none; cursor: pointer;
  font-size: 15px; font-weight: 600; color: #0E0F1A;
  text-align: left; line-height: 1.4;
}
.faq2-q span{ flex: 1; }
.faq2-chevron{
  flex-shrink: 0; color: #6B6F8A;
  transition: transform .25s ease;
}
.faq2-item.open .faq2-chevron{ transform: rotate(180deg); color: #0057ff; }
.faq2-a{
  max-height: 0;
  overflow: hidden;
  transition: max-height .3s ease;
  padding: 0 22px;
}
.faq2-a p{ font-size: 14px; color: #6B6F8A; line-height: 1.75; margin: 0; padding-bottom: 20px; }
.faq2-item.open .faq2-a{ max-height: 400px; }
@media(max-width: 860px){
  .faq2-wrap{ grid-template-columns: 1fr; gap: 36px; }
  .faq2-head{ position: static; }
  .faq2-title{ font-size: 24px; }
}
@media(max-width: 600px){
  .faq2-section{ padding: 48px 0; }
  .faq2-title{ font-size: 22px; }
  .faq2-q{ font-size: 14px; padding: 16px 18px; }
  .faq2-a{ padding: 0 18px; }
}

/* Menu CTA card extras */
.menu-cta-badge{
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: #22c55e;
  background: rgba(34,197,94,.1); border-radius: 20px;
  padding: 3px 10px; margin-bottom: 10px; width: fit-content;
}
.menu-cta-btn{
  display: inline-flex !important; align-items: center; gap: 8px;
  background: linear-gradient(135deg, #0057ff, #7c3aed) !important;
  color: #fff !important; font-size: 13.5px !important; font-weight: 700 !important;
  padding: 10px 18px; border-radius: 9px; text-decoration: none;
  margin-top: 4px; transition: opacity .15s ease;
}
.menu-cta-btn:hover{ opacity: .88; }
.menu-cta-trust{
  font-size: 11px; color: var(--muted); margin-top: 10px;
}
