/* ==========================================================================
     TOKENS
     ========================================================================== */
  :root{
    --primary:#133B5E;
    --primary-700:#0E2C46;
    --primary-900:#091B2C;
    --secondary:#088392;
    --secondary-600:#066E7C;
    --accent:#F0A020;
    --accent-600:#D88A0F;
    --ink:#0F172A;
    --ink-muted:#475569;
    --line:#E5EAF0;
    --soft:#F7F9FC;
    --soft-2:#EEF2F7;
    --white:#FFFFFF;
    --warn-bg:#FFF6E7;

    --shadow-sm:0 1px 2px rgba(15,23,42,.04), 0 2px 8px rgba(19,59,94,.05);
    --shadow-md:0 6px 18px -6px rgba(19,59,94,.12), 0 2px 6px rgba(19,59,94,.06);
    --shadow-lg:0 24px 50px -18px rgba(19,59,94,.25), 0 4px 12px rgba(19,59,94,.08);

    --r-sm:10px; --r-md:14px; --r-lg:18px; --r-xl:22px; --r-pill:999px;

    --container-w: 90%;
    --section-y: 96px;
  /* Skip-to-content link — visually hidden until focused */
  .skip-to-content{
    position:absolute; top:8px; inset-inline-start:8px;
    background:var(--primary); color:#fff;
    padding:.7rem 1.1rem; border-radius:var(--r-sm);
    font-weight:600; font-size:.92rem;
    z-index:200;
    transform:translateY(-200%);
    transition:transform .2s ease;
  }
  .skip-to-content:focus{ transform:translateY(0); color:#fff; outline:3px solid var(--accent); outline-offset:2px; }

  /* AA-compliant teal for inline TEXT contexts (slightly darker than brand teal) */
  :root{ --secondary-text:#066E7C; }
  .eyebrow{ color:var(--secondary-text); }
  .step-cta{ color:var(--secondary-text) !important; }

  /* Carousel pause button */
  .tt-pause{
    width:44px; height:44px; border-radius:50%;
    background:#fff; border:1px solid var(--line); color:var(--primary);
    display:grid; place-items:center; cursor:pointer;
    transition:transform .2s, background .2s, border-color .2s;
    margin-inline-end:.4rem;
  }
  .tt-pause:hover{ background:var(--soft); border-color:var(--primary); transform:translateY(-2px); }

  }
  @media (max-width:991.98px){
    :root{ --section-y:72px; --container-w: 92%; }
  }
  @media (max-width:575.98px){
    :root{ --section-y:56px; --container-w: 92%; }
  }

  /* ============================================================
     MOBILE OVERFLOW + TYPOGRAPHY FIXES (≤575.98px)
     ============================================================ */
  html{ overflow-x:hidden; }
  body{ overflow-x:hidden; }

  @media (max-width:575.98px){
    /* Container: stricter so nothing crowds the edges */
    .container, .container-lg, .container-xl{ width:94%; }

    /* Hero — reduce min font so title fits 360px */
    .hero h1{ font-size:clamp(1.45rem, 7.5vw, 2.4rem) !important; line-height:1.12; }
    .hero-sub{ font-size:.95rem; }

    /* Section headings */
    .h-section{ font-size:clamp(1.35rem, 5.5vw, 2rem) !important; }

    /* Contact card — shrink padding so heading fits */
    .contact-card{ padding:1.6rem 1.15rem !important; }
    .contact-card h2{ font-size:clamp(1.15rem, 5vw, 1.6rem) !important; }
    .contact-card .eyebrow{ font-size:.7rem; }

    /* Allow long email / URL strings to wrap instead of overflow */
    .ci-row .val,
    .ci-row .lbl,
    .footer-contact-row a{
      overflow-wrap:anywhere;
      word-break:break-word;
    }
    .ci-row .val{ font-size:.88rem; }
    .ci-row{ padding:.75rem .85rem; gap:.6rem; }
    .ci-icn{ width:36px; height:36px; font-size:.9rem; }

    /* Contact CTAs — keep on one row, equal split (same treatment as discount) */
    .contact-card .discount-cta-row{
      flex-wrap:nowrap;
      gap:.5rem;
    }
    .contact-card .discount-cta-row .btn{
      flex:1 1 0; min-width:0;
      padding:.65rem .55rem;
      font-size:.85rem;
      white-space:nowrap;
    }
    .contact-card .discount-cta-row .btn i{ font-size:.85rem; }

    /* Hero mock — flatten 3D so it doesn't push width; smaller text */
    .hero-mock{ transform:none; max-width:100%; }
    .hero-mock-body{ padding:1rem 1rem 1.1rem; }
    .mock-tile{ padding:.6rem .65rem; }
    .mock-tile .val{ font-size:1.05rem; }
    .mock-tile .lbl{ font-size:.62rem; }
    .mock-tile .trend{ font-size:.66rem; }
    .mock-queue-item{ padding:.55rem .65rem; font-size:.78rem; gap:.55rem; }
    .mock-queue-item .net{ width:26px; height:26px; font-size:.75rem; }
    .mock-queue-item .meta b{ font-size:.78rem; }
    .mock-queue-item .meta small{ font-size:.68rem; }
    .hero-mock-bar .crumb{ font-size:.65rem; padding:.2rem .5rem; }

    /* Hero bullets — single column already at 575 */
    .hero-bullets li{ font-size:.9rem; }
  }

  /* ==========================================================================
     BASE
     ========================================================================== */
  *,*::before,*::after{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    font-family:'Heebo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Tahoma, sans-serif;
    color:var(--ink);
    background:var(--white);
    font-size:16px;
    line-height:1.65;
    margin:0;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,h4,h5,h6{
    font-family:'Heebo', sans-serif;
    color:var(--primary);
    font-weight:800;
    line-height:1.15;
    letter-spacing:-.01em;
    margin:0 0 .4em;
    text-wrap:balance;
  }
  p{ margin:0 0 1rem; color:var(--ink-muted); text-wrap:pretty; }
  a{ color:var(--secondary); text-decoration:none; }
  a:hover{ color:var(--secondary-600); }
  img,svg{ max-width:100%; display:block; }
  ::selection{ background:var(--secondary); color:#fff; }

  /* Container override — 90% on desktop */
  .container, .container-lg, .container-xl{
    width:var(--container-w);
    max-width:1320px;
    margin-inline:auto;
    padding-inline:0;
  }

  /* Sections rhythm */
  .section{ padding-block:var(--section-y); position:relative; }
  .section-soft{ background:var(--soft); }
  .section-dark{ background:var(--primary-900); color:#fff; }
  .section-dark h1,.section-dark h2,.section-dark h3,.section-dark h4{ color:#fff; }
  .section-dark p{ color:rgba(255,255,255,.7); }

  .eyebrow{
    display:inline-flex; align-items:center; gap:.5rem;
    font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
    color:var(--secondary);
    background:rgba(8,131,146,.08);
    padding:.45rem .9rem; border-radius:var(--r-pill);
    margin-bottom:1.25rem;
  }
  .eyebrow::before{
    content:""; width:6px; height:6px; border-radius:50%;
    background:var(--secondary); display:inline-block;
  }
  .section-dark .eyebrow{
    color:#7BD7E3; background:rgba(123,215,227,.12);
  }
  .section-dark .eyebrow::before{ background:#7BD7E3; }

  /* Section heading scale */
  .h-display{ font-size:clamp(2.2rem, 4.2vw, 3.6rem); font-weight:900; }
  .h-section{ font-size:clamp(1.8rem, 3.2vw, 2.5rem); }
  .lead-muted{ color:var(--ink-muted); font-size:1.075rem; max-width:62ch; }
  .section-dark .lead-muted{ color:rgba(255,255,255,.7); }

  /* ==========================================================================
     BUTTONS
     ========================================================================== */
  .btn{
    font-weight:600; border-radius:var(--r-md);
    padding:.85rem 1.4rem; font-size:.98rem;
    transition:transform .18s ease, box-shadow .18s ease, background .2s ease, color .2s ease, border-color .2s ease;
    display:inline-flex; align-items:center; gap:.55rem;
    border:1px solid transparent;
    white-space:nowrap;
  }
  .btn:focus-visible{
    outline:3px solid rgba(8,131,146,.35); outline-offset:2px;
  }
  .btn-primary{
    background:var(--secondary); border-color:var(--secondary); color:#fff;
    box-shadow:0 6px 16px -6px rgba(8,131,146,.55);
  }
  .btn-primary:hover{
    background:var(--secondary-600); border-color:var(--secondary-600); color:#fff;
    transform:translateY(-2px);
    box-shadow:0 14px 28px -10px rgba(8,131,146,.6);
  }
  .btn-ghost{
    background:transparent; border-color:rgba(255,255,255,.25); color:#fff;
  }
  .btn-ghost:hover{ background:rgba(255,255,255,.08); color:#fff; transform:translateY(-2px); }
  .btn-outline{
    background:#fff; border-color:var(--line); color:var(--primary);
  }
  .btn-outline:hover{
    border-color:var(--primary); color:var(--primary);
    transform:translateY(-2px); box-shadow:var(--shadow-md);
  }
  .btn-accent{
    background:var(--accent); border-color:var(--accent); color:#1a1306;
    box-shadow:0 6px 16px -6px rgba(240,160,32,.5);
  }
  .btn-accent:hover{
    background:var(--accent-600); border-color:var(--accent-600); color:#1a1306;
    transform:translateY(-2px); box-shadow:0 14px 28px -10px rgba(240,160,32,.55);
  }
  .btn-lg{ padding:1rem 1.6rem; font-size:1.02rem; }
  .btn-sm{ padding:.55rem 1rem; font-size:.88rem; }

  /* Hide on smallest viewports (replaces Bootstrap d-none d-sm-inline-flex) */
  .hide-on-xs{ display:inline-flex; }
  @media (max-width:575.98px){ .hide-on-xs{ display:none !important; } }

  /* ==========================================================================
     HEADER
     ========================================================================== */
  .site-header{
    position:sticky; top:0; z-index:60;
    background:rgba(255,255,255,.85);
    backdrop-filter:saturate(180%) blur(12px);
    -webkit-backdrop-filter:saturate(180%) blur(12px);
    border-bottom:1px solid transparent;
    transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
  }
  .site-header.is-scrolled{
    border-bottom-color:var(--line);
    box-shadow:0 6px 22px -16px rgba(19,59,94,.15);
    background:rgba(255,255,255,.92);
  }
  .header-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:.85rem 0;
    gap:1.25rem;
  }
  .brand{
    display:inline-flex; align-items:center; gap:.65rem;
    font-weight:800; color:var(--primary); font-size:1.06rem;
    letter-spacing:-.01em;
    line-height:1.1;
  }
  @media (max-width:575.98px){
    .brand{ font-size:.95rem; line-height:1.02; gap:.5rem; max-width:55vw; }
    .brand span{ display:inline-block; }
  }
  .brand:hover{ color:var(--primary); }
  .brand-mark{
    width:38px; height:38px; border-radius:11px;
    background:linear-gradient(135deg,var(--primary) 0%, var(--secondary) 100%);
    display:grid; place-items:center; color:#fff; font-weight:900; font-size:1.05rem;
    box-shadow:0 6px 14px -6px rgba(19,59,94,.45);
  }
  .brand-mark i{ font-size:1rem; }
  .nav-list{
    list-style:none; padding:0; margin:0;
    display:flex; align-items:center; gap:.25rem;
  }
  .nav-list a{
    color:var(--ink); font-weight:500; font-size:.95rem;
    padding:.55rem .85rem; border-radius:var(--r-sm);
    transition:color .15s ease, background .15s ease;
  }
  .nav-list a:hover{ color:var(--primary); background:var(--soft); }
  .header-actions{ display:flex; align-items:center; gap:.6rem; }
  .lang-toggle{
    display:inline-flex; align-items:center; gap:.4rem;
    background:var(--soft); border:1px solid var(--line);
    color:var(--primary); font-weight:600; font-size:.85rem;
    padding:.5rem .8rem; border-radius:var(--r-pill);
    cursor:pointer; transition:background .15s, border-color .15s;
  }
  .lang-toggle:hover{ background:var(--soft-2); border-color:#cdd5e0; }
  .lang-toggle i{ font-size:.85rem; color:var(--ink-muted); }

  .nav-toggle{
    display:none; background:none; border:0; color:var(--primary); font-size:1.35rem;
    width:42px; height:42px; border-radius:var(--r-sm);
  }
  .nav-toggle:hover{ background:var(--soft); }
  @media (max-width:991.98px){
    .nav-list{ display:none; }
    .nav-toggle{ display:inline-flex; align-items:center; justify-content:center; }
    .nav-list.is-open{
      display:flex !important;
      flex-direction:column; align-items:stretch;
      position:absolute;
      top:100%;
      inset-inline-start:5%;
      inset-inline-end:auto;
      width:auto;
      min-width:240px; max-width:90vw;
      margin-top:8px;
      background:#fff !important;
      border:1px solid var(--line); border-radius:var(--r-md);
      box-shadow:var(--shadow-lg); padding:.5rem;
      z-index:120;
    }
    .nav-list.is-open a{ width:100%; padding:.75rem 1rem; }
    .header-cta-text{ display:none; }
  }

  /* ==========================================================================
     HERO
     ========================================================================== */
  .hero{
    position:relative; overflow:hidden;
    background:linear-gradient(160deg, #F7FBFD 0%, #ECF3F9 40%, #E2EBF4 100%);
    padding-block:clamp(64px, 8vw, 120px) clamp(72px, 9vw, 130px);
    isolation:isolate;
  }
  .hero::before{
    content:""; position:absolute; inset:0; z-index:-1;
    background-image:
      radial-gradient(circle at 18% 22%, rgba(8,131,146,.10), transparent 45%),
      radial-gradient(circle at 82% 80%, rgba(19,59,94,.10), transparent 50%),
      radial-gradient(circle at 80% 8%,  rgba(240,160,32,.07), transparent 40%);
  }
  .hero::after{
    content:""; position:absolute; inset:0; z-index:-1;
    background-image:
      linear-gradient(rgba(19,59,94,.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(19,59,94,.04) 1px, transparent 1px);
    background-size:48px 48px;
    mask-image:radial-gradient(ellipse at 50% 30%, #000 0%, transparent 70%);
    -webkit-mask-image:radial-gradient(ellipse at 50% 30%, #000 0%, transparent 70%);
  }
  .hero-grid{
    display:grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap:clamp(2rem, 4vw, 4.5rem);
    align-items:center;
  }
  @media (max-width:991.98px){
    .hero-grid{ grid-template-columns:1fr; }
  }
  .hero h1{
    font-size:clamp(2.3rem, 5vw, 4rem);
    font-weight:900;
    letter-spacing:-.02em;
    margin-bottom:1.1rem;
  }
  .hero-sub{
    font-size:clamp(1.05rem, 1.45vw, 1.18rem);
    color:var(--ink-muted);
    max-width:58ch;
    margin-bottom:2rem;
  }
  .hero-ctas{
    display:flex; flex-wrap:wrap; gap:.85rem; margin-bottom:1.25rem;
  }
  .hero-note{
    color:var(--ink-muted); font-size:.88rem;
    display:inline-flex; align-items:center; gap:.45rem;
  }
  .hero-note i{ color:var(--secondary); }
  .hero-bullets{
    list-style:none; padding:0; margin:2rem 0 0;
    display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
    gap:.85rem;
  }
  @media (max-width:575.98px){
    .hero-bullets{ grid-template-columns:1fr; }
  }
  .hero-bullets li{
    display:flex; align-items:center; gap:.7rem;
    background:#fff; padding:.85rem 1rem;
    border:1px solid var(--line); border-radius:var(--r-md);
    box-shadow:var(--shadow-sm);
    font-weight:600; color:var(--primary); font-size:.95rem;
  }
  .hero-bullets li i{
    width:30px; height:30px; border-radius:50%;
    background:rgba(8,131,146,.12); color:var(--secondary);
    display:grid; place-items:center; font-size:.85rem; flex-shrink:0;
  }

  /* Hero visual — product mock */
  .hero-visual{ position:relative; }
  .hero-mock{
    position:relative;
    border-radius:var(--r-xl);
    background:#fff;
    border:1px solid var(--line);
    box-shadow:var(--shadow-lg);
    overflow:hidden;
    transform:perspective(1400px) rotateY(-2deg) rotateX(2deg);
  }
  [dir="rtl"] .hero-mock{ transform:perspective(1400px) rotateY(2deg) rotateX(2deg); }
  .hero-mock-bar{
    display:flex; align-items:center; gap:.4rem;
    padding:.7rem 1rem; border-bottom:1px solid var(--line);
    background:var(--soft);
  }
  .hero-mock-bar span{ width:10px; height:10px; border-radius:50%; background:#D8DEE7; }
  .hero-mock-bar span:nth-child(1){ background:#FF6363; }
  .hero-mock-bar span:nth-child(2){ background:#FFC542; }
  .hero-mock-bar span:nth-child(3){ background:#3DD68C; }
  .hero-mock-bar .crumb{
    margin-inline-start:auto; font-size:.78rem; color:var(--ink-muted);
    background:#fff; padding:.25rem .6rem; border-radius:var(--r-pill); border:1px solid var(--line);
  }
  .hero-mock-body{ padding:1.4rem 1.5rem 1.6rem; }
  .mock-row{
    display:grid; grid-template-columns:1fr 1fr 1fr;
    gap:.75rem; margin-bottom:1.1rem;
  }
  .mock-tile{
    background:var(--soft); border:1px solid var(--line); border-radius:var(--r-md);
    padding:.85rem 1rem;
  }
  .mock-tile .lbl{ font-size:.72rem; color:var(--ink-muted); letter-spacing:.06em; text-transform:uppercase; }
  .mock-tile .val{ font-size:1.35rem; font-weight:800; color:var(--primary); }
  .mock-tile .trend{ font-size:.76rem; color:#0A9F6B; font-weight:600; }
  .mock-chart{
    height:140px; background:linear-gradient(180deg, rgba(8,131,146,.12), transparent 80%);
    border:1px solid var(--line); border-radius:var(--r-md);
    position:relative; overflow:hidden;
  }
  .mock-chart svg{ position:absolute; inset:0; width:100%; height:100%; }
  .mock-queue{ margin-top:1rem; display:grid; gap:.6rem; }
  .mock-queue-item{
    display:flex; align-items:center; gap:.75rem;
    background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
    padding:.6rem .8rem; font-size:.85rem;
  }
  .mock-queue-item .net{
    width:30px; height:30px; border-radius:8px; display:grid; place-items:center;
    color:#fff; font-size:.85rem; flex-shrink:0;
  }
  .net-fb{ background:#1877F2; }
  .net-ig{ background:linear-gradient(135deg,#F58529,#DD2A7B,#8134AF); }
  .net-tt{ background:#000; }
  .net-yt{ background:#FF0000; }
  .net-li{ background:#0A66C2; }
  .net-x{ background:#000; }
  .mock-queue-item .meta{ flex:1; min-width:0; }
  .mock-queue-item .meta b{ color:var(--primary); display:block; font-weight:600; font-size:.86rem; }
  .mock-queue-item .meta small{ color:var(--ink-muted); font-size:.74rem; }
  .mock-queue-item .pill{
    font-size:.7rem; padding:.25rem .55rem; border-radius:var(--r-pill);
    background:rgba(8,131,146,.1); color:var(--secondary); font-weight:600;
  }

  /* Floating chips next to mock */
  .hero-chip{
    position:absolute; background:#fff; border:1px solid var(--line);
    border-radius:var(--r-md); padding:.65rem .85rem;
    box-shadow:var(--shadow-md); font-size:.85rem; font-weight:600;
    color:var(--primary); display:flex; align-items:center; gap:.5rem;
    z-index:2;
  }
  .hero-chip i{ color:var(--secondary); }
  .hero-chip-1{ top:8%; inset-inline-start:-3%; }
  .hero-chip-2{ bottom:6%; inset-inline-end:-4%; }
  @media (max-width:991.98px){
    .hero-chip-1, .hero-chip-2{ display:none; }
    .hero-mock{ transform:none; }
  }

  /* ==========================================================================
     STATS
     ========================================================================== */
  .stats{
    background:var(--primary);
    color:#fff;
    position:relative; overflow:hidden;
  }
  .stats::before{
    content:""; position:absolute; inset:0;
    background:
      radial-gradient(circle at 12% 50%, rgba(8,131,146,.35), transparent 38%),
      radial-gradient(circle at 88% 50%, rgba(240,160,32,.18), transparent 42%);
    opacity:.7;
  }
  .stats-inner{ position:relative; padding-block:64px; }
  .stats-grid{
    display:grid; gap:1.1rem;
    grid-template-columns:repeat(4, minmax(0,1fr));
  }
  @media (max-width:991.98px){ .stats-grid{ grid-template-columns:repeat(2, 1fr); } }
    .stat-card{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    border-radius:var(--r-lg);
    padding:1.6rem 1.4rem;
    backdrop-filter:blur(8px);
    transition:transform .25s ease, background .25s ease, border-color .25s ease;
  }
  .stat-card:hover{
    transform:scale(1.025); background:rgba(255,255,255,.09);
    border-color:rgba(255,255,255,.22);
  }
  .stat-card .icn{
    width:44px; height:44px; border-radius:12px;
    background:rgba(8,131,146,.35); color:#7BD7E3;
    display:grid; place-items:center; font-size:1.1rem;
    margin-bottom:1rem;
  }
  .stat-card .num{
    font-size:clamp(2rem, 3vw, 2.6rem); font-weight:900;
    color:#fff; line-height:1; letter-spacing:-.02em;
  }
  .stat-card .num .suf{ color:var(--accent); }
  .stat-card .lbl{
    color:rgba(255,255,255,.7); margin-top:.5rem; font-size:.92rem; font-weight:500;
  }

  /* ==========================================================================
     SECTION HEADERS
     ========================================================================== */
  .section-head{ max-width:760px; margin:0 auto 3.5rem; text-align:center; }
  .section-head .lead-muted{ margin:0 auto; }

  /* ==========================================================================
     FEATURES
     ========================================================================== */
  .features-grid{
    display:grid; gap:1.25rem;
    grid-template-columns:repeat(3, minmax(0,1fr));
  }
  @media (max-width:991.98px){ .features-grid{ grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:767.98px){ .features-grid{ grid-template-columns:1fr; } }
  .feature-card{
    background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
    padding:1.8rem 1.6rem;
    text-align:center;
    display:flex; flex-direction:column; align-items:center;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    position:relative; overflow:hidden;
  }
  .feature-card::after{
    content:""; position:absolute; inset:0; border-radius:inherit;
    box-shadow:inset 0 0 0 1px transparent;
    transition:box-shadow .25s ease;
    pointer-events:none;
  }
  .feature-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-md);
    border-color:rgba(8,131,146,.35);
  }
  .feature-card:hover::after{
    box-shadow:inset 0 0 0 1px rgba(8,131,146,.18), 0 0 30px rgba(8,131,146,.08);
  }
  .feature-icn{
    width:54px; height:54px; border-radius:14px;
    background:linear-gradient(135deg, rgba(8,131,146,.14), rgba(19,59,94,.12));
    color:var(--secondary);
    display:grid; place-items:center; font-size:1.3rem;
    margin-bottom:1.2rem;
  }
  .feature-card h3{ font-size:1.18rem; margin-bottom:.5rem; }
  .feature-card p{ margin:0; font-size:.94rem; }

  /* ==========================================================================
     QUICK START
     ========================================================================== */
  .steps-grid{
    display:grid; gap:1.1rem;
    grid-template-columns:repeat(4, minmax(0,1fr));
  }
  @media (max-width:991.98px){ .steps-grid{ grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:767.98px){ .steps-grid{ grid-template-columns:1fr; } }
  .step-card{
    background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
    padding:2rem 1.4rem 1.5rem;
    position:relative;
    display:flex; flex-direction:column; align-items:center;
    text-align:center;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .step-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:rgba(19,59,94,.2); }
  .step-num{
    position:absolute; top:-18px;
    inset-inline-start:50%;
    transform:translateX(-50%);
    width:36px; height:36px; border-radius:50%;
    background:var(--primary); color:#fff;
    display:grid; place-items:center; font-weight:800; font-size:.9rem;
    box-shadow:0 6px 14px -6px rgba(19,59,94,.45);
  }
  [dir="rtl"] .step-num{ transform:translateX(50%); }
  .step-icn{
    width:54px; height:54px; border-radius:14px;
    background:rgba(240,160,32,.12); color:var(--accent-600);
    display:grid; place-items:center; font-size:1.25rem;
    margin:.4rem 0 1rem;
  }
  .step-card h3{ font-size:1.1rem; margin-bottom:.45rem; }
  .step-card p{ margin:0 0 1.4rem; font-size:.92rem; }
  .step-card .step-cta{
    margin-top:auto;
    display:inline-flex; align-items:center; justify-content:center;
    gap:.5rem;
    padding:.7rem 1.25rem;
    background:var(--secondary);
    color:#fff !important;
    border-radius:var(--r-md);
    font-weight:600;
    font-size:.92rem;
    box-shadow:0 6px 14px -6px rgba(8,131,146,.5);
    transition:background .2s ease, transform .2s ease, box-shadow .2s ease;
  }
  .step-card .step-cta:hover{
    background:var(--secondary-600);
    transform:translateY(-2px);
    box-shadow:0 10px 22px -8px rgba(8,131,146,.55);
    color:#fff !important;
  }
  .step-card .step-cta i{
    color:#fff !important;
    transition:transform .2s ease;
  }

  [dir="rtl"] .step-card .step-cta i{ transform:scaleX(-1); }
  .step-card:hover .step-cta i{ transform:translateX(3px); }
  [dir="rtl"] .step-card:hover .step-cta i{ transform:scaleX(-1) translateX(3px); }

  /* ==========================================================================
     DISCOUNT / COUNTDOWN
     ========================================================================== */
  .discount{
    background:
      radial-gradient(circle at 10% 50%, rgba(240,160,32,.18), transparent 50%),
      radial-gradient(circle at 90% 50%, rgba(220,80,60,.16), transparent 55%),
      linear-gradient(135deg, #1F1407 0%, #2A1A0B 100%);
    color:#fff;
    border-radius:var(--r-xl);
    padding:clamp(2rem, 4vw, 3.5rem);
    box-shadow:var(--shadow-lg);
    position:relative; overflow:hidden;
  }
  .discount::before{
    content:""; position:absolute; inset:0;
    background-image:radial-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
    background-size:24px 24px; opacity:.6; pointer-events:none;
  }
  .discount-inner{
    position:relative; display:grid;
    grid-template-columns:1fr auto; gap:2rem; align-items:center;
  }
  @media (max-width:991.98px){
    .discount-inner{ grid-template-columns:1fr; }
  }
  .discount h2{ color:#fff; font-size:clamp(1.7rem, 2.8vw, 2.2rem); margin-bottom:.6rem; }
  .discount p{ color:rgba(255,255,255,.78); max-width:55ch; margin:0; }
  .discount-badge{
    display:inline-flex; align-items:center; gap:.5rem;
    background:var(--accent); color:#1a1306;
    font-weight:800; font-size:.95rem;
    padding:.55rem 1rem; border-radius:var(--r-pill);
    margin-bottom:1.1rem;
    box-shadow:0 8px 20px -6px rgba(240,160,32,.5);
  }
  .countdown{
    display:flex; gap:.65rem; flex-wrap:wrap; justify-content:flex-start;
  }
  .cd-cell{
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    border-radius:var(--r-md);
    padding:.85rem 1.1rem;
    min-width:80px; text-align:center;
    backdrop-filter:blur(6px);
  }
  .cd-cell .cd-num{
    font-size:2rem; font-weight:900; line-height:1; color:#fff;
    font-variant-numeric:tabular-nums;
  }
  .cd-cell .cd-lbl{
    font-size:.72rem; color:rgba(255,255,255,.65); text-transform:uppercase;
    letter-spacing:.1em; margin-top:.35rem;
  }
  .discount-cta-row{ margin-top:1.4rem; display:flex; gap:.7rem; flex-wrap:wrap; }

  /* Mobile fixes — keep countdown + CTAs + title on single rows */
  @media (max-width:767.98px){
    .discount{ padding:1.6rem 1.15rem; }
    .discount-badge{ font-size:.78rem; padding:.4rem .8rem; margin-bottom:.85rem; }
    .discount h2{
      font-size:clamp(.95rem, 4.4vw, 1.3rem);
      line-height:1.25;
      margin-bottom:.55rem;
      white-space:nowrap;
      width:100%;
      letter-spacing:-.015em;
    }
    .discount p{ font-size:.86rem; line-height:1.55; }

    .countdown{
      flex-wrap:nowrap;
      gap:.4rem;
      width:100%;
      justify-content:space-between;
    }
    .cd-cell{
      flex:1 1 0; min-width:0;
      padding:.55rem .3rem;
    }
    .cd-cell .cd-num{ font-size:1.3rem; }
    .cd-cell .cd-lbl{ font-size:.58rem; letter-spacing:.04em; margin-top:.2rem; }

    .discount .discount-cta-row{
      flex-wrap:nowrap;
      gap:.5rem;
      margin-top:1.1rem;
    }
    .discount .discount-cta-row .btn{
      flex:1 1 0; min-width:0;
      padding:.65rem .55rem;
      font-size:.85rem;
      white-space:nowrap;
    }
    .discount .discount-cta-row .btn i{ font-size:.85rem; }
  }

  /* ==========================================================================
     PRICING
     ========================================================================== */
  .pricing-grid{
    display:grid; gap:1.1rem;
    grid-template-columns:repeat(4, minmax(0,1fr));
    align-items:stretch;
  }
  @media (max-width:991.98px){ .pricing-grid{ grid-template-columns:repeat(2, 1fr); } }
  @media (max-width:575.98px){ .pricing-grid{ grid-template-columns:1fr; } }
  .price-card{
    background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
    padding:1.8rem 1.5rem 1.6rem;
    display:flex; flex-direction:column;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    position:relative;
  }
  .price-card:hover{
    transform:translateY(-6px); box-shadow:var(--shadow-md);
    border-color:rgba(19,59,94,.25);
  }
  .price-card.is-featured{
    border-color:transparent;
    background:linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
    box-shadow:
      0 0 0 2px var(--secondary),
      0 24px 50px -22px rgba(8,131,146,.45);
    transform:translateY(-6px);
  }
  .price-card.is-featured:hover{ transform:translateY(-10px); }
  .price-badge{
    position:absolute; top:-12px; inset-inline-start:50%;
    transform:translateX(-50%);
    background:var(--secondary); color:#fff;
    padding:.35rem .9rem; border-radius:var(--r-pill);
    font-size:.76rem; font-weight:700; letter-spacing:.04em;
    box-shadow:0 6px 14px -4px rgba(8,131,146,.5);
    white-space:nowrap;
  }
  [dir="rtl"] .price-badge{ transform:translateX(50%); }
  .price-name{ font-size:1.05rem; font-weight:700; color:var(--primary); margin-bottom:.25rem; }
  .price-desc{ font-size:.86rem; color:var(--ink-muted); margin-bottom:1.2rem; min-height:2.6em; }
  .price-amount{
    font-size:2.8rem; font-weight:900; color:var(--primary); line-height:1;
    display:flex; align-items:baseline; gap:.25rem;
    letter-spacing:-.03em;
  }
  .price-amount .cur{ font-size:1.2rem; font-weight:700; color:var(--primary); }
  .price-amount .per{ font-size:.9rem; font-weight:500; color:var(--ink-muted); }
  .price-amount.custom{ font-size:1.6rem; }
  .price-features{
    list-style:none; padding:0; margin:1.4rem 0 1.6rem;
    display:grid; gap:.55rem;
    flex:1;
  }
  .price-features li{
    display:flex; align-items:flex-start; gap:.6rem;
    font-size:.92rem; color:var(--ink);
  }
  .price-features li i{
    color:var(--secondary); font-size:.85rem; margin-top:.32rem;
    flex-shrink:0;
  }
  .price-features li.muted{ color:var(--ink-muted); text-decoration:line-through; }
  .price-features li.muted i{ color:#C2CAD6; }
  .price-card .btn{ width:100%; justify-content:center; }

  /* ==========================================================================
     ABOUT
     ========================================================================== */
  .about-grid{
    display:grid; gap:clamp(2rem, 4vw, 4rem);
    grid-template-columns:1fr 1fr; align-items:center;
  }
  @media (max-width:991.98px){ .about-grid{ grid-template-columns:1fr; } }
  .about-img{
    aspect-ratio:5/4;
    background:
      repeating-linear-gradient(135deg, #EEF2F7 0 12px, #E5EAF0 12px 24px);
    border:1px solid var(--line); border-radius:var(--r-xl);
    box-shadow:var(--shadow-md);
    position:relative; overflow:hidden;
    display:grid; place-items:center;
  }
  .about-img::after{
    content:attr(data-label);
    position:absolute; bottom:1rem; inset-inline-start:1rem;
    background:rgba(255,255,255,.92);
    border:1px solid var(--line); border-radius:var(--r-sm);
    padding:.4rem .7rem;
    font-family:'JetBrains Mono', ui-monospace, Menlo, monospace;
    font-size:.74rem; color:var(--ink-muted);
  }
  .about-img .mock-window{
    width:78%;
    background:#fff; border:1px solid var(--line); border-radius:var(--r-md);
    box-shadow:var(--shadow-md);
    overflow:hidden;
  }
  .about-img .mock-window .topbar{
    height:28px; background:var(--soft);
    border-bottom:1px solid var(--line);
    display:flex; align-items:center; gap:.3rem;
    padding-inline:.7rem;
  }
  .about-img .mock-window .topbar span{
    width:8px; height:8px; border-radius:50%; background:#D8DEE7;
  }
  .about-img .mock-window .topbar span:nth-child(1){ background:#FF6363; }
  .about-img .mock-window .topbar span:nth-child(2){ background:#FFC542; }
  .about-img .mock-window .topbar span:nth-child(3){ background:#3DD68C; }
  .about-img .mock-window .body{
    padding:.9rem; display:grid; gap:.55rem;
  }
  .about-img .mock-window .body .row{
    height:10px; background:var(--soft); border-radius:6px;
  }
  .about-img .mock-window .body .row.w70{ width:70%; }
  .about-img .mock-window .body .row.w50{ width:50%; background:rgba(8,131,146,.18); }
  .about-img .mock-window .body .row.w85{ width:85%; }

  .about-stats{
    display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem;
    margin-top:1.6rem; padding-top:1.6rem; border-top:1px solid var(--line);
  }
  @media (max-width:575.98px){
    .about-stats{ gap:.6rem; }
    .about-stats .as-num{ font-size:1.25rem; }
    .about-stats .as-lbl{ font-size:.7rem; line-height:1.3; }
  }
  .about-stats .as-num{ font-size:1.7rem; font-weight:900; color:var(--primary); line-height:1; }
  .about-stats .as-lbl{ font-size:.82rem; color:var(--ink-muted); margin-top:.3rem; }

  /* ==========================================================================
     TESTIMONIALS
     ========================================================================== */
  .tt-shell{ position:relative; }
  .tt-viewport{ overflow:hidden; border-radius:var(--r-lg); }
  .tt-track{
    display:flex; transition:transform .5s cubic-bezier(.22,.65,.32,1);
    will-change:transform;
  }
  .tt-slide{
    flex:0 0 100%;
    display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
    gap:1.1rem;
    padding:.3rem;
  }
  @media (max-width:1199.98px){ .tt-slide{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:575.98px){ .tt-slide{ grid-template-columns:1fr; } }
  .tt-card{
    background:#fff; border:1px solid var(--line); border-radius:var(--r-lg);
    padding:1.5rem 1.4rem; box-shadow:var(--shadow-sm);
    display:flex; flex-direction:column; gap:1rem;
  }
  .tt-stars{ color:var(--accent); font-size:.85rem; display:flex; gap:.15rem; }
  .tt-quote{ color:var(--ink); font-size:.96rem; margin:0; flex:1; }
  .tt-meta{ display:flex; align-items:center; gap:.7rem; }
  .tt-avatar{
    width:42px; height:42px; border-radius:50%;
    background:linear-gradient(135deg, var(--primary), var(--secondary));
    display:grid; place-items:center; color:#fff; font-weight:700; font-size:.95rem;
    flex-shrink:0;
  }
  .tt-name{ font-weight:600; color:var(--primary); font-size:.92rem; line-height:1.2; }
  .tt-role{ color:var(--ink-muted); font-size:.8rem; }
  .tt-controls{
    display:flex; justify-content:space-between; align-items:center;
    margin-top:1.6rem;
  }
  .tt-dots{ display:flex; gap:.5rem; }
  .tt-dot{
    width:8px; height:8px; border-radius:50%; background:#CBD3DE;
    border:0; padding:0; cursor:pointer; transition:width .25s ease, background .2s;
  }
  .tt-dot.is-active{ background:var(--secondary); width:24px; border-radius:4px; }
  .tt-arrows{ display:flex; gap:.5rem; }
  .tt-arrow{
    width:44px; height:44px; border-radius:50%;
    background:#fff; border:1px solid var(--line); color:var(--primary);
    display:grid; place-items:center; cursor:pointer;
    transition:transform .2s, background .2s, border-color .2s;
  }
  .tt-arrow:hover{ background:var(--soft); border-color:var(--primary); transform:translateY(-2px); }
  .tt-arrow:disabled{ opacity:.4; cursor:not-allowed; transform:none; }
  [dir="rtl"] .rtl-flip{ transform:scaleX(-1); }

  /* ==========================================================================
     FAQ
     ========================================================================== */
  .faq-list{ max-width:840px; margin:0 auto; }
  .faq-item{
    border-bottom:1px solid var(--line);
  }
  .faq-q{
    width:100%; text-align:start; background:none; border:0;
    padding:1.2rem 0;
    display:flex; align-items:center; justify-content:space-between; gap:1rem;
    font-weight:600; color:var(--primary); font-size:1.05rem;
    cursor:pointer;
    transition:color .15s ease;
  }
  .faq-q:hover{ color:var(--secondary); }
  .faq-q .faq-icn{
    width:32px; height:32px; border-radius:50%;
    background:var(--soft); color:var(--primary);
    display:grid; place-items:center; font-size:.85rem;
    transition:transform .3s ease, background .2s, color .2s;
    flex-shrink:0;
  }
  .faq-item.is-open .faq-q{ color:var(--secondary); }
  .faq-item.is-open .faq-icn{
    transform:rotate(45deg); background:var(--secondary); color:#fff;
  }
  .faq-a{
    max-height:0; overflow:hidden;
    transition:max-height .35s ease, padding .25s ease;
  }
  .faq-a-inner{ padding:0 0 1.3rem; color:var(--ink-muted); }
  .faq-item.is-open .faq-a{ max-height:280px; }

  /* ==========================================================================
     CONTACT
     ========================================================================== */
  .contact-card{
    background:linear-gradient(135deg, var(--primary) 0%, #194870 100%);
    color:#fff; border-radius:var(--r-xl);
    padding:clamp(2rem, 4vw, 3.5rem);
    box-shadow:var(--shadow-lg);
    position:relative; overflow:hidden;
  }
  .contact-card::before{
    content:""; position:absolute; inset:0;
    background:
      radial-gradient(circle at 90% 0%, rgba(8,131,146,.4), transparent 45%),
      radial-gradient(circle at 0% 100%, rgba(240,160,32,.18), transparent 50%);
    pointer-events:none;
  }
  .contact-inner{
    position:relative;
    display:grid; grid-template-columns:1.1fr .9fr; gap:2.5rem; align-items:center;
  }
  @media (max-width:991.98px){
    .contact-inner{ grid-template-columns:1fr; }
  }
  .contact-card h2{ color:#fff; }
  .contact-card p{ color:rgba(255,255,255,.78); }
  .contact-info{ display:grid; gap:.9rem; }
  .ci-row{
    display:flex; align-items:center; gap:.85rem;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    border-radius:var(--r-md);
    padding:.9rem 1.1rem;
    transition:background .2s, transform .2s, border-color .2s;
  }
  .ci-row:hover{
    background:rgba(255,255,255,.1); transform:translateY(-2px);
    border-color:rgba(255,255,255,.25);
    color:#fff;
  }
  .ci-icn{
    width:42px; height:42px; border-radius:12px;
    background:rgba(255,255,255,.12); color:#7BD7E3;
    display:grid; place-items:center; font-size:1rem; flex-shrink:0;
  }
  .ci-row .lbl{ font-size:.75rem; color:rgba(255,255,255,.6); text-transform:uppercase; letter-spacing:.1em; }
  .ci-row .val{ color:#fff; font-weight:600; }

  /* ==========================================================================
     FOOTER
     ========================================================================== */
  .site-footer{
    background:var(--primary-900); color:rgba(255,255,255,.7);
    padding-block:72px 28px;
  }
  .footer-grid{
    display:grid; gap:2.5rem;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  }
  @media (max-width:991.98px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:575.98px){ .footer-grid{ grid-template-columns:1fr; } }
  .footer-grid h4{
    color:#fff; font-size:.85rem; letter-spacing:.12em; text-transform:uppercase;
    font-weight:700; margin-bottom:1.2rem;
  }
  .footer-grid p, .footer-grid li{ font-size:.92rem; color:#fff; }
  .footer-grid ul{ list-style:none; padding:0; margin:0; display:grid; gap:.6rem; }
  .footer-grid a{
    color:#fff; transition:color .15s, opacity .15s, text-decoration-color .15s;
    text-decoration:none;
  }
  .footer-grid a:hover{
    color:#fff; opacity:1;
    text-decoration:underline;
    text-decoration-color:#fff;
    text-underline-offset:3px;
  }

  /* Override the generic a:hover rule everywhere in the footer */
  .site-footer a,
  .site-footer a:hover,
  .site-footer a:focus,
  .site-footer a:active{
    color:#fff !important;
  }
  .site-footer a:hover{
    text-decoration:underline !important;
    text-decoration-color:#fff !important;
    text-underline-offset:3px;
  }
  .footer-brand{ display:inline-flex; align-items:center; gap:.65rem; color:#fff; margin-bottom:1rem; font-weight:800; font-size:1.05rem; }
  .footer-brand .brand-mark{ box-shadow:none; }
  .footer-contact-row{ display:flex; align-items:center; gap:.6rem; font-size:.92rem; }
  .footer-contact-row i{ color:#7BD7E3; width:18px; text-align:center; }

  .bottom-bar{
    border-top:1px solid rgba(255,255,255,.08);
    padding-top:24px; margin-top:64px;
    display:flex; align-items:center; justify-content:space-between;
    gap:1.25rem; flex-wrap:wrap;
    color:rgba(255,255,255,.55); font-size:.83rem;
  }
  .bottom-bar a{ color:#7BD7E3; }
  .bottom-bar a:hover{ color:#fff; }
  .bb-credit{
    display:flex; align-items:center; gap:.85rem;
  }
  .bb-logo{
    width:42px; height:42px; object-fit:contain;
    background:#fff; border-radius:9px; padding:4px;
    flex-shrink:0;
  }
  .bb-credit-text{
    display:flex; flex-direction:column; line-height:1.45;
  }
  .bb-credit-line1{ color:#fff; font-weight:600; font-size:.85rem; }
  .bb-credit-line2{ color:#fff; font-size:.82rem; }
  .bb-credit-line2 a{
    color:#fff; font-weight:500;
    text-decoration:none;
    transition:text-decoration-color .15s;
  }
  .bb-credit-line2 a:hover{
    text-decoration:underline;
    text-decoration-color:#fff;
    text-underline-offset:3px;
  }
  .bb-rights{ color:#fff; font-size:.82rem; }
  @media (max-width:767.98px){
    .bottom-bar{ justify-content:center; text-align:center; }
    .bb-credit{ flex-direction:column; gap:.6rem; }
    .bb-credit-text{ align-items:center; }
  }

  /* ==========================================================================
     REVEAL ANIMATIONS
     ========================================================================== */
  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.is-in{ opacity:1; transform:none; }
  @media (prefers-reduced-motion: reduce){
    .reveal{ opacity:1; transform:none; transition:none; }
    *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
    html{ scroll-behavior:auto; }
  }

  /* Scope generic anchor color so it does NOT override button text */
  a:not(.btn):not(.brand):not(.footer-brand):not(.skip-to-content){ color:var(--secondary-text); }
  a:not(.btn):not(.brand):not(.footer-brand):not(.skip-to-content):hover{ color:var(--primary); }

  /* Defensive — buttons explicitly own their text + icon color in all states */
  .btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active{ color:#fff !important; }
  .btn-primary i, .btn-primary:hover i, .btn-primary:focus i{ color:#fff !important; }
  .btn-accent, .btn-accent:hover, .btn-accent:focus, .btn-accent:active{ color:#1a1306 !important; }
  .btn-accent i, .btn-accent:hover i, .btn-accent:focus i{ color:#1a1306 !important; }
  .btn-ghost, .btn-ghost:hover, .btn-ghost:focus{ color:#fff !important; }
  .btn-ghost i, .btn-ghost:hover i{ color:#fff !important; }
  .btn-outline{ color:var(--primary); }
  .btn-outline:hover{ color:var(--primary); }
  .btn-outline i{ color:var(--primary) !important; }
  .btn-outline:hover i{ color:var(--primary) !important; }

  /* Bump primary button visual weight per request — slightly stronger shadow */
  .btn-primary{
    box-shadow:0 8px 22px -6px rgba(8,131,146,.55), 0 2px 4px rgba(8,131,146,.18);
  }

  /* Real logo image replaces the .brand-mark gradient square */
  .brand-mark-img{
    background:transparent !important;
    box-shadow:none !important;
    object-fit:contain;
    padding:0;
  }
  .site-header .brand-mark-img{ width:42px; height:42px; }
  .footer-brand .brand-mark-img{ width:36px; height:36px; }

  /* Focus visible — accessibility */
  a:focus-visible, button:focus-visible, .lang-toggle:focus-visible, .faq-q:focus-visible{
    outline:3px solid rgba(8,131,146,.4); outline-offset:3px; border-radius:6px;
  }
  

  /* Card hover micro-animations */
  .feature-card .feature-icn,
  .price-card .price-amount,
  .tt-card .tt-stars,
  .stat-card .icn{
    transition:transform .4s cubic-bezier(.34,1.56,.64,1), background .25s ease, color .25s ease;
  }
  .feature-card:hover .feature-icn{
    transform:scale(1.12) rotate(-6deg);
    background:linear-gradient(135deg, rgba(8,131,146,.22), rgba(19,59,94,.18));
  }
  .price-card:hover .price-amount{
    transform:translateY(-3px) scale(1.03);
  }
  .tt-card:hover .tt-stars{ transform:scale(1.1); }
  .stat-card:hover .icn{
    transform:rotate(8deg) scale(1.08);
    background:rgba(123,215,227,.45);
  }

  /* Subtle pulse for FAQ chevron on hover */
  .faq-item:hover .faq-icn{
    background:var(--secondary);
    color:#fff;
    transform:scale(1.08);
  }

  /* Pricing card check icons cascade-bounce on hover */
  .price-card:hover .price-features li i{
    animation:price-bounce .5s ease;
  }
  .price-card:hover .price-features li:nth-child(1) i{ animation-delay:0s; }
  .price-card:hover .price-features li:nth-child(2) i{ animation-delay:.05s; }
  .price-card:hover .price-features li:nth-child(3) i{ animation-delay:.10s; }
  .price-card:hover .price-features li:nth-child(4) i{ animation-delay:.15s; }
  .price-card:hover .price-features li:nth-child(5) i{ animation-delay:.20s; }
  @keyframes price-bounce{
    0%   { transform:scale(1); }
    50%  { transform:scale(1.4) rotate(-8deg); color:var(--secondary); }
    100% { transform:scale(1); }
  }

  /* Mockup queue items shimmer on hero hover */
  .hero-mock:hover .mock-queue-item{
    transform:translateX(0);
    animation:none;
  }

  @media (prefers-reduced-motion: reduce){
    .feature-card:hover .feature-icn,
    .price-card:hover .price-amount,
    .tt-card:hover .tt-stars,
    .stat-card:hover .icn,
    .step-card:hover .step-icn,
    .price-card:hover .price-features li i{
      animation:none !important;
      transform:none !important;
    }
  }

  /* ============================================================
     COOKIE BANNER + PRIVACY MODAL
     ============================================================ */
  body.modal-open{ overflow:hidden; }
  .cookie-banner{
    position:fixed; inset-inline:0; bottom:0; z-index:90;
    background:rgba(9, 27, 44, .96);
    backdrop-filter:saturate(180%) blur(10px);
    -webkit-backdrop-filter:saturate(180%) blur(10px);
    border-top:1px solid rgba(255,255,255,.1);
    color:#fff;
    padding:14px 0;
    box-shadow:0 -10px 30px -8px rgba(0,0,0,.25);
    transform:translateY(100%);
    transition:transform .4s ease;
  }
  .cookie-banner.is-shown{ transform:translateY(0); }
  .cookie-inner{
    display:flex; align-items:center; gap:1.5rem;
    flex-wrap:wrap;
  }
  .cookie-text{ flex:1 1 360px; min-width:0; }
  .cookie-text strong{ display:block; font-size:.95rem; margin-bottom:.2rem; color:#fff; }
  .cookie-text p{ font-size:.84rem; color:rgba(255,255,255,.78); margin:0; line-height:1.5; }
  .cookie-actions{ display:flex; align-items:center; gap:.85rem; flex-wrap:wrap; }
  .privacy-link{
    background:none; border:0; color:#7BD7E3;
    font-size:.88rem; font-weight:500; cursor:pointer;
    text-decoration:underline; text-underline-offset:3px;
    padding:.4rem .2rem;
  }
  .privacy-link:hover{ color:#fff; }
  .cookie-accept{
    padding:.6rem 1.4rem; font-size:.92rem;
    min-width:120px;
  }
  @media (max-width:575.98px){
    .cookie-banner{ padding:12px 0; }
    .cookie-inner{ gap:.85rem; }
    .cookie-text strong{ font-size:.88rem; }
    .cookie-text p{ font-size:.78rem; }
    .cookie-actions{ width:100%; justify-content:space-between; gap:.5rem; }
    .cookie-accept{ flex:1; min-width:0; padding:.55rem 1rem; font-size:.85rem; }
    .privacy-link{ font-size:.82rem; }
  }
  .privacy-modal{
    position:fixed; inset:0; z-index:200;
    display:flex; align-items:center; justify-content:center;
    padding:24px;
    opacity:0; pointer-events:none;
    transition:opacity .25s ease;
  }
  .privacy-modal.is-open{ opacity:1; pointer-events:auto; }
  .privacy-modal-backdrop{
    position:absolute; inset:0;
    background:rgba(9, 27, 44, .65);
    backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  }
  .privacy-modal-content{
    position:relative; z-index:1;
    background:#fff;
    border-radius:var(--r-xl);
    max-width:720px; width:100%;
    max-height:88vh;
    display:flex; flex-direction:column;
    box-shadow:var(--shadow-lg);
    transform:translateY(20px) scale(.97);
    transition:transform .25s ease;
  }
  .privacy-modal.is-open .privacy-modal-content{ transform:translateY(0) scale(1); }
  .privacy-modal-header{
    padding:1.4rem 1.6rem;
    border-bottom:1px solid var(--line);
    display:flex; align-items:center; justify-content:space-between; gap:1rem;
    flex-shrink:0;
  }
  .privacy-modal-header h2{ margin:0; font-size:1.35rem; }
  .privacy-modal-close{
    width:38px; height:38px; border-radius:50%;
    background:var(--soft); border:1px solid var(--line); color:var(--primary);
    display:grid; place-items:center; cursor:pointer; font-size:.95rem;
    transition:background .15s, border-color .15s, transform .15s;
  }
  .privacy-modal-close:hover{ background:var(--soft-2); border-color:var(--primary); transform:rotate(90deg); }
  .privacy-modal-body{
    padding:1.4rem 1.6rem 1.6rem;
    overflow-y:auto;
    line-height:1.7;
  }
  .privacy-modal-body h3{
    font-size:1.05rem; font-weight:700;
    margin:1.4rem 0 .5rem;
    color:var(--primary);
  }
  .privacy-modal-body h3:first-of-type{ margin-top:.2rem; }
  .privacy-modal-body p{ margin:0 0 .8rem; font-size:.94rem; color:var(--ink); }
  .privacy-modal-body ul{ padding-inline-start:1.4rem; margin:0 0 .8rem; font-size:.94rem; color:var(--ink); }
  .privacy-modal-body li{ margin-bottom:.3rem; }
  .privacy-modal-body strong{ color:var(--primary); }
  .privacy-modal-body a{ color:var(--secondary-text); }
  .privacy-modal-body a:hover{ color:var(--primary); text-decoration:underline; }
  .privacy-modal-body .updated{
    background:var(--soft); border-radius:var(--r-sm);
    padding:.55rem .85rem; font-size:.85rem;
    color:var(--ink-muted); margin-bottom:1rem;
    display:inline-block;
  }
  .privacy-body[hidden]{ display:none; }