:root {
      --bg:           #09090f;
      --bg-2:         #0d0d16;
      --card:         #111119;
      --soft:         #16161f;
      --border:       rgba(58,184,129,.13);
      --border-md:    rgba(58,184,129,.22);
      --border-hi:    rgba(58,184,129,.35);
      --txt:          #eef0f6;
      --muted:        #8892a8;
      --accent:       #3ab881;
      --accent-2:     #2d9463;
      --accent-light: #4dd194;
      --wa:           #25d366;
      --shadow:       0 16px 48px rgba(0,0,0,.55);
      --ring:         0 0 0 3px rgba(58,184,129,.22);
      --radius:       16px;
      --radius-sm:    11px;
      --header-bg:    rgba(9,9,15,.92);
      --mnav-bg:      rgba(9,9,15,.98);
      --amb-1:        rgba(58,184,129,.09);
      --amb-2:        rgba(45,148,99,.06);
      --logo-fg:      #ffffff;
      /* Subtle surface-tint scale, layered over --bg/--card to add depth.
         White in dark mode, dark in light mode — see [data-theme="light"] below. */
      --ov01:  rgba(255,255,255,.01);
      --ov012: rgba(255,255,255,.012);
      --ov015: rgba(255,255,255,.015);
      --ov02:  rgba(255,255,255,.02);
      --ov025: rgba(255,255,255,.025);
      --ov03:  rgba(255,255,255,.03);
      --ov04:  rgba(255,255,255,.04);
      --ov045: rgba(255,255,255,.045);
      --ov05:  rgba(255,255,255,.05);
      --ov06:  rgba(255,255,255,.06);
      --ov12:  rgba(255,255,255,.12);
    }

    /* ══════════ LIGHT THEME ══════════
       Toggled by setting data-theme="light" on <html> (see themeSwitch JS).
       Everything else in the file reads the variables above, so this one
       block is enough to re-skin the whole site to a white/black/green look. */
    [data-theme="light"] {
      --bg:           #ffffff;
      --bg-2:         #f6f9f8;
      --card:         #ffffff;
      --soft:         #eef3f1;
      --border:       rgba(21,120,80,.16);
      --border-md:    rgba(21,120,80,.26);
      --border-hi:    rgba(21,120,80,.4);
      --txt:          #10151b;
      --muted:        #57616d;
      --shadow:       0 16px 40px rgba(16,24,32,.10);
      --ring:         0 0 0 3px rgba(21,120,80,.16);
      --header-bg:    rgba(255,255,255,.86);
      --mnav-bg:      rgba(255,255,255,.98);
      --amb-1:        rgba(58,184,129,.07);
      --amb-2:        rgba(45,148,99,.045);
      --logo-fg:      #10151b;
      --ov01:  rgba(13,20,28,.03);
      --ov012: rgba(13,20,28,.035);
      --ov015: rgba(13,20,28,.04);
      --ov02:  rgba(13,20,28,.05);
      --ov025: rgba(13,20,28,.055);
      --ov03:  rgba(13,20,28,.065);
      --ov04:  rgba(13,20,28,.075);
      --ov045: rgba(13,20,28,.08);
      --ov05:  rgba(13,20,28,.085);
      --ov06:  rgba(13,20,28,.10);
      --ov12:  rgba(13,20,28,.09);
    }
    [data-theme="light"] body { color-scheme: light; }
    /* The brand mark is baked as white-fill SVG paths (design intent: sit on
       the dark header/footer). In light mode those same paths need to become
       dark, so retarget them by their literal fill attribute. */
    [data-theme="light"] svg path[fill="#fff"],
    [data-theme="light"] svg path[fill="#ffffff"],
    [data-theme="light"] svg text[fill="#ffffff"] { fill: var(--logo-fg); }

    *, *::before, *::after { box-sizing: border-box; }
    html { overflow-x: hidden; scroll-behavior: smooth; font-size: 16px; }
    body { margin: 0; padding: 0; background: var(--bg); color: var(--txt); font-family: Manrope, system-ui, sans-serif; line-height: 1.5; }
    html[lang="bn"] body { font-family: 'Noto Sans Bengali', Manrope, system-ui, sans-serif; }
    html[lang="hi"] body { font-family: 'Noto Sans Devanagari', Manrope, system-ui, sans-serif; }
    a { color: inherit; text-decoration: none; }
    img { max-width: 100%; height: auto; display: block; }
    .container { width: min(1160px, 92vw); margin: 0 auto; }
    section { padding: 72px 0; }
    .divider { height: 1px; background: linear-gradient(90deg, transparent, var(--border-md), transparent); margin: 32px 0; }

    /* ── SCROLL REVEAL ── */
    .reveal { opacity:0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.16,.8,.24,1), transform .7s cubic-bezier(.16,.8,.24,1); }
    .reveal.is-visible { opacity:1; transform:none; }
    @media (prefers-reduced-motion: reduce) {
      .reveal { transition: opacity .01s linear !important; transform:none !important; }
      .hero-img-card { transition:none !important; }
      .hero-grid > div:first-child::before, .hero h1 .hl::after { animation:none !important; }
    }

    .ambient { position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
    .ambient::before { content:''; position:absolute; width:700px; height:700px; top:-260px; left:-200px; background: radial-gradient(circle, var(--amb-1) 0%, transparent 65%); border-radius:50%; }
    .ambient::after { content:''; position:absolute; width:500px; height:500px; top:300px; right:-180px; background: radial-gradient(circle, var(--amb-2) 0%, transparent 65%); border-radius:50%; }

    .btn { display:inline-flex; align-items:center; gap:.52rem; padding:.78rem 1.2rem; border-radius:10px; border:1px solid var(--ov12); background:var(--ov05); color:var(--txt); font-weight:700; font-size:.9rem; transition:transform .2s, box-shadow .2s, background .2s, border-color .2s; white-space:nowrap; cursor:pointer; font-family:inherit; }
    .btn:hover { transform: translateY(-2px); box-shadow: var(--ring); }
    .btn.primary { background: linear-gradient(135deg, var(--accent), var(--accent-light)); border-color: transparent; color:#071a0f; font-weight:800; }
    .btn.primary:hover { box-shadow: 0 8px 28px rgba(58,184,129,.38); transform: translateY(-2px); }
    .btn.ghost { background: transparent; border-color: var(--border-md); color: var(--muted); }
    .btn.ghost:hover { border-color: var(--accent); color: var(--accent-light); background: rgba(58,184,129,.07); }
    .btn.wa-btn { background: linear-gradient(135deg, #25d366, #128c7e); border-color: transparent; color:#fff; font-weight:800; }
    .btn.wa-btn:hover { box-shadow: 0 8px 28px rgba(37,211,102,.35); transform: translateY(-2px); }
    .btn.block { width:100%; justify-content:center; }

    .badge { display:inline-flex; align-items:center; gap:.42rem; padding:.3rem .72rem; border-radius:100vmax; border:1px solid var(--border-hi); background:rgba(58,184,129,.09); font-size:.75rem; font-weight:700; color:var(--accent-light); }
    .pill { display:inline-flex; align-items:center; gap:.38rem; padding:.28rem .65rem; border-radius:100vmax; border:1px dashed var(--border-md); font-size:.75rem; color:var(--accent-light); }

    /* ── LANGUAGE SWITCHER ── */
    .lang-switch { display:flex; align-items:center; gap:2px; border:1px solid var(--border-md); border-radius:9px; padding:2px; background: var(--ov03); flex-shrink:0; }
    .lang-btn { border:none; background:none; color: var(--muted); font-family:inherit; font-size:.76rem; font-weight:800; padding:.42rem .55rem; border-radius:7px; cursor:pointer; transition:.16s; line-height:1; }
    .lang-btn.active { background: rgba(58,184,129,.16); color: var(--accent-light); }
    .lang-btn:hover:not(.active) { color: var(--txt); }
    .mnav-lang { display:flex; gap:8px; margin-bottom:1.5rem; width:100%; }
    .mnav-lang .lang-btn { flex:1; text-align:center; padding:.65rem; border:1px solid var(--border-md); border-radius: var(--radius-sm); font-size:.82rem; background: var(--ov02); }
    .mnav-lang .lang-btn.active { border-color: var(--accent); background: rgba(58,184,129,.1); color: var(--accent-light); }

    /* ── THEME SWITCHER ── */
    .theme-switch { display:flex; align-items:center; gap:2px; border:1px solid var(--border-md); border-radius:9px; padding:2px; background: var(--ov03); flex-shrink:0; }
    .theme-btn { display:flex; align-items:center; justify-content:center; border:none; background:none; color: var(--muted); font-family:inherit; font-size:.92rem; padding:.42rem .55rem; border-radius:7px; cursor:pointer; transition:.16s; line-height:1; }
    .theme-btn.active { background: rgba(58,184,129,.16); color: var(--accent-light); }
    .theme-btn:hover:not(.active) { color: var(--txt); }
    .mnav-theme { display:flex; gap:8px; margin-bottom:1.5rem; width:100%; }
    .mnav-theme .theme-btn { flex:1; display:flex; align-items:center; justify-content:center; gap:.4rem; text-align:center; padding:.65rem; border:1px solid var(--border-md); border-radius: var(--radius-sm); font-size:.82rem; font-weight:700; background: var(--ov02); }
    .mnav-theme .theme-btn.active { border-color: var(--accent); background: rgba(58,184,129,.1); color: var(--accent-light); }

    header { position:sticky; top:0; z-index:100; background:var(--header-bg); backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%); border-bottom:1px solid var(--border); }
    .offer-bar { background: linear-gradient(90deg, var(--accent), var(--accent-light)); color:#06140d; padding:9px 16px; text-align:center; font-size:.82rem; font-weight:700; position:relative; z-index:101; }
    .offer-bar .container { display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; }
    .offer-bar i { font-size:1rem; }
    .offer-bar .offer-note { font-weight:600; opacity:.85; font-size:.78rem; }
    @media (max-width: 560px) { .offer-bar { font-size:.76rem; padding:8px 12px; } .offer-bar .offer-note { display:block; width:100%; } }
    nav { display:flex; align-items:center; justify-content:space-between; padding:.8rem 0; gap:1rem; }
    .brand { display:flex; align-items:center; flex-shrink:0; }
    .nav-links { display:flex; gap:.2rem; align-items:center; }
    .nav-links a { padding:.52rem .78rem; border-radius:9px; color:var(--muted); font-size:.88rem; font-weight:600; transition:.18s; white-space:nowrap; }
    .nav-links a:hover { color: var(--accent-light); background: rgba(58,184,129,.08); }
    .nav-actions { display:flex; align-items:center; gap:.55rem; flex-shrink:0; }
    .mobile-toggle { display:none; background:none; border:1px solid var(--border); border-radius:9px; padding:.55rem .6rem; color:var(--txt); cursor:pointer; align-items:center; justify-content:center; font-size:1.15rem; }

    .mobile-nav { display:none; position:fixed; inset:0; background:var(--mnav-bg); backdrop-filter: blur(20px); z-index:200; flex-direction:column; align-items:stretch; padding:1.4rem; overflow-y:auto; }
    .mobile-nav.open { display:flex; animation: mnavIn .22s ease; }
    @keyframes mnavIn { from{opacity:0; transform:translateY(-6px);} to{opacity:1; transform:translateY(0);} }
    .mnav-header { display:flex; justify-content:center; align-items:center; position:relative; margin-bottom:1.4rem; width:100%; }
    .mnav-close { position:absolute; right:0; top:50%; transform:translateY(-50%); background:none; border:1px solid var(--border-md); border-radius:11px; padding:.6rem; color:var(--txt); cursor:pointer; display:flex; font-size:1.15rem; }
    .mobile-nav a { display:flex; align-items:center; gap:.85rem; padding:.85rem 1rem; border-radius: var(--radius); font-size:.98rem; font-weight:700; color:var(--txt); border:1px solid var(--border); background: var(--ov02); transition:.18s; margin-bottom:.55rem; width:100%; align-self:stretch; text-align:left; }
    .mobile-nav a:hover { background: rgba(58,184,129,.08); border-color: var(--border-md); }
    .mnav-icon { display:flex; align-items:center; justify-content:center; width:42px; height:42px; flex-shrink:0; border-radius:12px; background: rgba(58,184,129,.14); }
    .mobile-nav a .mnav-icon i { font-size:1.05rem; color:var(--accent-light); }
    .mobile-nav a .mnav-label { flex:1; text-align:left; }
    .mobile-nav a .mnav-chevron { font-size:1.15rem; color:var(--muted); flex-shrink:0; }
    .mnav-cta { margin-top:.6rem; padding-top:.8rem; }
    .mnav-wa-btn { display:flex; align-items:center; gap:.85rem; width:100%; padding:1rem 1.3rem; border-radius:100vmax; background:linear-gradient(135deg,#25d366,#128c7e); color:#fff; font-weight:800; font-size:1rem; border:none; cursor:pointer; transition:.2s; font-family:inherit; }
    .mnav-wa-btn:hover { box-shadow:0 8px 28px rgba(37,211,102,.35); transform:translateY(-2px); }
    .mnav-wa-btn i:first-child { font-size:1.35rem; flex-shrink:0; }
    .mnav-wa-divider { width:1px; align-self:stretch; background:rgba(255,255,255,.35); flex-shrink:0; }
    .mnav-wa-label { flex:1; }
    .mnav-wa-chevron { font-size:1.2rem; opacity:.85; flex-shrink:0; }

    .hero { padding: clamp(52px, 9vw, 96px) 0 40px; position:relative; }
    .hero-grid { display:grid; grid-template-columns: 1.1fr .9fr; gap: min(5vw, 60px); align-items:center; }
    .hero-eyebrow { margin-bottom:20px; }
    /* Soft ambient glow behind the headline copy — pulls the eye to the
       headline first, reinforcing it as the focal point of the section. */
    .hero-grid > div:first-child { position:relative; }
    .hero-grid > div:first-child::before {
      content:''; position:absolute; top:-70px; left:-90px; width:440px; height:440px;
      background: radial-gradient(circle, rgba(58,184,129,.15), transparent 68%);
      z-index:-1; pointer-events:none; animation: heroGlowPulse 7s ease-in-out infinite;
    }
    @keyframes heroGlowPulse { 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.08); } }
    h1 { font-size: clamp(34px, 5.8vw, 60px); line-height:1.05; margin:0 0 20px; font-weight:900; letter-spacing:-.5px; }
    .hl { background: linear-gradient(92deg, var(--accent) 0%, var(--accent-light) 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
    /* Animated underline sweep, scoped to the hero headline only so it
       doesn't leak into other places .hl is reused (e.g. testimonials). */
    .hero h1 .hl { position:relative; display:inline-block; }
    .hero h1 .hl::after {
      content:''; position:absolute; left:1px; right:1px; bottom:-.05em; height:.12em; border-radius:2px;
      background: linear-gradient(90deg, transparent, var(--accent-light), transparent);
      background-size: 200% 100%; opacity:.6; animation: hlSweep 3.4s ease-in-out infinite;
    }
    @keyframes hlSweep { 0%{ background-position:0% 0; } 100%{ background-position:-200% 0; } }
    .hero-lead { font-size: clamp(15.5px, 2vw, 18px); color:var(--muted); line-height:1.7; margin:0 0 26px; max-width:520px; }
    .hero-cta { display:flex; gap:.75rem; flex-wrap:wrap; }
    .hero-trust { display:flex; flex-wrap:wrap; gap:1.2rem; margin-top:26px; padding-top:22px; border-top:1px solid var(--border); }
    .trust-badge { display:flex; align-items:center; gap:.4rem; font-size:.8rem; font-weight:700; color:var(--muted); }
    .trust-badge i { color: var(--accent); font-size:.95rem; }
    .trust-banner { border-radius: var(--radius-sm); overflow:hidden; border:1px solid var(--border); margin-bottom:28px; background:#fff; }
    .trust-banner img { width:100%; height:auto; display:block; }
    .hero-visual { position:relative; perspective: 1200px; }
    .hero-img-card { position:relative; border-radius: var(--radius); overflow:hidden; border:1px solid var(--border-md); background: linear-gradient(145deg, rgba(58,184,129,.16), rgba(9,9,15,.4)); box-shadow: var(--shadow); display:flex; align-items:flex-end; justify-content:center; transform: perspective(1200px) rotateX(0deg) rotateY(0deg) scale3d(1,1,1); transition: transform .6s cubic-bezier(.22,1,.36,1), box-shadow .4s; transform-style: preserve-3d; will-change: transform; }
    .hero-img-card.tilting { transition: transform .12s ease-out, box-shadow .4s; box-shadow: 0 24px 64px rgba(0,0,0,.6); }
    .hero-img-card::after { content:''; position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .35s; background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,.16), transparent 60%); }
    .hero-img-card.tilting::after { opacity:1; }
    .hero-img-card img { width:88%; max-width:420px; object-fit:contain; display:block; transform: translateZ(30px); }
    .hero-carousel { position:relative; width:100%; align-self:stretch; aspect-ratio: 4 / 3; transform: translateZ(30px); }
    .hero-img-card .hero-carousel-slide { position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; opacity:0; transition: opacity 1s ease; transform:none; }
    .hero-img-card .hero-carousel-slide.is-active { opacity:1; }
    .hero-carousel-dots { position:absolute; left:50%; bottom:14px; transform: translate(-50%, 0) translateZ(30px); display:flex; gap:7px; z-index:5; }
    .hero-carousel-dot { width:8px; height:8px; padding:0; border-radius:100vmax; border:none; background:rgba(255,255,255,.4); cursor:pointer; transition:.22s; }
    .hero-carousel-dot.is-active { width:22px; background: var(--accent-light); }
    .hero-carousel-dot:hover { background: rgba(255,255,255,.7); }
    @media (prefers-reduced-motion: reduce) { .hero-carousel-slide { transition:none !important; } }
    .feature-strip { display:grid; grid-template-columns: repeat(3, 1fr); border:1px solid var(--border); border-radius: var(--radius-sm); overflow:hidden; margin-top:12px; gap:1px; background: var(--border); }
    .feat { background: var(--card); padding:14px 10px; text-align:center; }
    .feat i { color: var(--accent-light); font-size:1.25rem; display:block; margin-bottom:5px; }
    .feat span { display:block; font-size:.72rem; color: var(--muted); font-weight:700; line-height:1.35; }

    .marquee-wrap { margin-top:36px; border-radius:11px; border:1px solid var(--border); background: rgba(58,184,129,.025); overflow:hidden; }
    .marquee-track { display:flex; gap:28px; padding:11px 0; animation: marquee 34s linear infinite; width: max-content; }
    @keyframes marquee { 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }
    .chip { border:1px solid var(--border-md); padding:.42rem .85rem; border-radius:100vmax; background: rgba(58,184,129,.06); display:inline-flex; gap:.4rem; align-items:center; white-space:nowrap; color:var(--accent-light); font-size:.83rem; font-weight:600; flex-shrink:0; }

    .sec-hd { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:32px; flex-wrap:wrap; gap:1rem; }
    h2 { font-size: clamp(22px, 3.2vw, 34px); margin:0; font-weight:800; letter-spacing:-.3px; }
    .sec-label { display:block; font-size:.7rem; font-weight:800; color: var(--accent); text-transform:uppercase; letter-spacing:1.8px; margin-bottom:5px; }

    .svc-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:15px; }
    @media (max-width: 680px) {
      .svc-grid { display:flex; overflow-x:auto; scroll-snap-type:x proximity; gap:12px; padding:2px 16px 14px; margin:0 -16px; -webkit-overflow-scrolling:touch; }
      .svc-grid::-webkit-scrollbar { height:6px; }
      .svc-grid::-webkit-scrollbar-thumb { background: var(--border-md); border-radius:10px; }
      .svc-card { flex:0 0 78vw; max-width:290px; scroll-snap-align:start; }
      .svc-swipe-hint { display:flex; }
    }
    .svc-swipe-hint { display:none; align-items:center; gap:6px; color: var(--muted); font-size:.76rem; font-weight:600; margin:-18px 0 18px; }
    .svc-swipe-hint i { color: var(--accent-light); }
    .svc-card { background: linear-gradient(160deg, var(--ov045) 0%, var(--ov012) 100%); border:1px solid var(--border); border-radius: var(--radius); padding:24px; transition: transform .22s, border-color .22s, box-shadow .22s; position:relative; overflow:hidden; cursor:pointer; }
    .svc-card::after { content:''; position:absolute; top:0; left:0; right:0; height:2px; background: linear-gradient(90deg, var(--accent), var(--accent-light)); opacity:0; transition:opacity .22s; }
    .svc-card:hover { transform: translateY(-4px); border-color: var(--border-md); box-shadow: 0 18px 52px rgba(0,0,0,.38); }
    .svc-card:hover::after { opacity:1; }
    .svc-ico { width:46px; height:46px; border-radius:12px; background: rgba(58,184,129,.1); border:1px solid rgba(58,184,129,.18); display:flex; align-items:center; justify-content:center; font-size:1.35rem; color: var(--accent-light); margin-bottom:13px; }
    .svc-card h3 { margin:0 0 8px; font-size:1rem; font-weight:800; }
    .svc-card p { margin:0; color: var(--muted); font-size:.88rem; line-height:1.65; }
    .svc-tags { display:flex; flex-wrap:wrap; gap:5px; margin-top:13px; }
    .svc-tag { font-size:.72rem; font-weight:700; color: var(--accent); background: rgba(58,184,129,.08); border-radius:100vmax; padding:.22rem .55rem; }
    .svc-card .svc-go { position:absolute; top:22px; right:22px; color: var(--muted); font-size:1.05rem; opacity:0; transition:opacity .2s, transform .2s; }
    .svc-card:hover .svc-go { opacity:1; transform: translateX(2px); }

    .price-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap:15px; }
    .price-card { border:1px solid var(--border); border-radius: var(--radius); padding:22px; background: linear-gradient(160deg, var(--ov045), var(--ov01)); display:flex; flex-direction:column; gap:10px; transition: transform .2s, border-color .2s; }
    .price-card:hover { transform: translateY(-3px); border-color: var(--border-md); }
    .price-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
    .price-ico { width:38px; height:38px; border-radius:10px; background: rgba(58,184,129,.1); border:1px solid rgba(58,184,129,.18); display:flex; align-items:center; justify-content:center; font-size:1.1rem; color: var(--accent-light); flex-shrink:0; }
    .price-card h4 { margin:0; font-size:.92rem; font-weight:800; line-height:1.35; }
    .price-tag { font-size:1.4rem; font-weight:900; color: var(--accent-light); line-height:1; }
    .price-tag small { font-size:.68rem; font-weight:700; color: var(--muted); display:block; margin-top:3px; }
    .price-badge span { display:inline-block; font-size:.82rem; font-weight:800; padding:.32rem .75rem; border-radius:100vmax; letter-spacing:.2px; }
    .price-badge.free span { color:#06140d; background: linear-gradient(135deg, var(--accent), var(--accent-light)); }
    .price-badge.over span { color: var(--muted); background: var(--ov06); border:1px solid var(--border-md); }
    .price-note { color: var(--muted); font-size:.78rem; line-height:1.55; }
    .price-disclaimer { display:flex; align-items:flex-start; gap:.6rem; border:1px dashed var(--border-md); border-radius:12px; padding:.9rem 1.1rem; background: rgba(58,184,129,.045); font-size:.83rem; color: var(--muted); line-height:1.6; margin-top:22px; }
    .price-disclaimer i { color: var(--accent-light); font-size:1.05rem; margin-top:1px; flex-shrink:0; }

    .why-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:15px; }
    .why-card { background: linear-gradient(160deg, var(--ov04), var(--ov01)); border:1px solid var(--border); border-radius: var(--radius); padding:22px; }
    .why-ico { width:42px; height:42px; border-radius:11px; background: rgba(58,184,129,.1); border:1px solid rgba(58,184,129,.18); display:flex; align-items:center; justify-content:center; font-size:1.2rem; color: var(--accent-light); margin-bottom:12px; }
    .why-card h4 { margin:0 0 6px; font-size:.94rem; font-weight:800; }
    .why-card p { margin:0; color: var(--muted); font-size:.83rem; line-height:1.6; }

    .steps-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:15px; }

    /* ── TESTIMONIALS ── */
    .testi-band { background: linear-gradient(160deg, rgba(58,184,129,.05), var(--ov015)); border:1px solid var(--border); border-radius: var(--radius); padding:32px 0 8px; overflow:hidden; }
    .testi-top { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; padding:0 28px 28px; }
    .testi-tagline { font-size: clamp(19px, 2.4vw, 26px); font-weight:800; margin:0; }
    .testi-tagline .hl { color: var(--accent-light); }
    .testi-stats { display:flex; gap: clamp(20px, 4vw, 44px); flex-wrap:wrap; }
    .testi-stat { text-align:center; }
    .testi-stat-num { font-size: clamp(20px, 2.6vw, 28px); font-weight:900; color: var(--txt); line-height:1; }
    .testi-stat-num .star { color:#ffb84d; }
    .testi-stat-label { font-size:.74rem; color: var(--muted); margin-top:5px; font-weight:600; }
    .testi-scroll { display:flex; gap:14px; width:max-content; padding:0 0 28px; animation: testiMarquee 52s linear infinite; }
    .testi-scroll.is-paused { animation-play-state: paused; }
    @keyframes testiMarquee { 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }
    @media (prefers-reduced-motion: reduce) {
      .testi-scroll { animation:none !important; overflow-x:auto; width:auto; padding:0 28px 28px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
    }
    .testi-card { flex: 0 0 300px; scroll-snap-align:start; border:1px solid var(--border); border-radius: var(--radius-sm); padding:22px; background: var(--ov03); display:flex; flex-direction:column; gap:10px; }
    .testi-quote-ico { color: var(--accent); font-size:1.6rem; line-height:1; opacity:.6; font-family: Georgia, serif; }
    .testi-quote { margin:0; color: var(--txt); font-size:.9rem; line-height:1.65; flex-grow:1; }
    .testi-divider { height:1px; background: var(--border); }
    .testi-name { font-weight:800; font-size:.88rem; }
    .testi-role { color: var(--muted); font-size:.77rem; margin-top:2px; }
    @media (max-width: 680px) { .testi-top { padding:0 16px 18px; } .testi-scroll { gap:12px; } .testi-card { flex-basis:86vw; max-width:340px; } @media (prefers-reduced-motion: reduce) { .testi-scroll { padding:0 16px 22px; } } }

    .testi-head { display:flex; align-items:center; gap:12px; }
    .testi-avatar { width:46px; height:46px; border-radius:50%; object-fit:cover; flex-shrink:0; }
    .testi-avatar-fallback { width:46px; height:46px; border-radius:50%; background: rgba(58,184,129,.1); border:1px solid rgba(58,184,129,.18); display:flex; align-items:center; justify-content:center; font-weight:800; color: var(--accent-light); font-size:.95rem; flex-shrink:0; }
    .testi-stars { color:#ffb84d; font-size:.8rem; letter-spacing:1px; }
    .testi-tag { display:inline-block; align-self:flex-start; border:1px solid rgba(58,184,129,.3); color: var(--accent-light); font-size:.7rem; font-weight:700; padding:4px 10px; border-radius:20px; }
    .testi-loc { color: var(--muted); font-size:.75rem; display:flex; align-items:center; gap:4px; }
    .step-card { border:1px solid var(--border); border-radius: var(--radius); padding:20px; background: var(--ov02); display:flex; flex-direction:column; gap:6px; }
    .step-n { font-size:.72rem; font-weight:800; color: var(--accent); letter-spacing:1px; text-transform:uppercase; }
    .step-card strong { font-size:.95rem; }
    .step-card span { color: var(--muted); font-size:.83rem; line-height:1.55; }

    /* ── CONSULT WIZARD ── */
    .consult-section { padding:80px 0; background: radial-gradient(ellipse 900px 500px at 50% 0%, rgba(58,184,129,.055) 0%, transparent 70%); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
    .ck-eyebrow { display:inline-flex; align-items:center; gap:7px; background: rgba(58,184,129,.1); border:1px solid rgba(58,184,129,.3); border-radius:100px; padding:5px 13px; font-size:11px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color: var(--accent-light); margin-bottom:12px; }
    .ck-stepper { display:flex; align-items:center; margin-bottom:30px; position:relative; max-width:520px; margin-left:auto; margin-right:auto; }
    .ck-stepper::before { content:''; position:absolute; top:18px; left:18px; right:18px; height:2px; background: rgba(58,184,129,.1); z-index:0; }
    .ck-fill { position:absolute; top:18px; left:18px; height:2px; background: linear-gradient(90deg, var(--accent), var(--accent-light)); z-index:1; border-radius:2px; transition:width .5s cubic-bezier(.4,0,.2,1); }
    .ck-node { display:flex; flex-direction:column; align-items:center; flex:1; position:relative; z-index:2; gap:7px; }
    .ck-circle { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; border:2px solid rgba(58,184,129,.2); background: var(--bg-2); color: var(--muted); transition: all .35s ease; }
    .ck-circle.on { border-color: var(--accent); background: rgba(58,184,129,.14); color: var(--accent-light); box-shadow: 0 0 0 4px rgba(58,184,129,.1); }
    .ck-circle.dn { border-color: var(--accent); background: var(--accent); color:#071a0f; }
    .ck-lbl { font-size:10px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color: var(--muted); text-align:center; white-space:nowrap; transition: color .3s; }
    .ck-lbl.on { color: var(--accent-light); }

    .ck-card { max-width:640px; margin:0 auto; border:1px solid var(--border-md); border-radius: var(--radius); background: linear-gradient(160deg, var(--ov05), var(--ov015)); box-shadow: var(--shadow); overflow:hidden; }
    .ck-panel { display:none; padding:26px 26px 6px; }
    .ck-panel.show { display:block; animation: ckIn .28s ease; }
    @keyframes ckIn { from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);} }
    .ck-ptitle { margin:0 0 4px; font-size:1.05rem; font-weight:800; }
    .ck-psub { margin:0 0 18px; color: var(--muted); font-size:.86rem; }
    .ck-svc-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap:9px; }
    .ck-svc-note { margin:12px 2px 0; font-size:.76rem; font-weight:700; color: var(--accent-light); display:flex; align-items:center; gap:6px; }
    .ck-svc { display:flex; align-items:center; gap:.6rem; border:1px solid var(--border); border-radius:11px; padding:.75rem .85rem; background: var(--ov02); cursor:pointer; transition:.18s; text-align:left; font-family:inherit; color: var(--txt); position:relative; touch-action:manipulation; }
    .ck-badge { position:absolute; top:-8px; right:-6px; background: linear-gradient(135deg, var(--accent), var(--accent-light)); color:#06140d; font-size:.6rem; font-weight:800; padding:2px 7px; border-radius:20px; box-shadow: 0 2px 8px rgba(0,0,0,.4); letter-spacing:.3px; white-space:nowrap; }
    .ck-svc i { color: var(--accent-light); font-size:1.05rem; flex-shrink:0; }
    .ck-svc span { font-size:.84rem; font-weight:700; }
    .ck-svc:hover { border-color: var(--border-md); background: rgba(58,184,129,.06); }
    .ck-svc.sel { border-color: var(--accent); background: rgba(58,184,129,.12); box-shadow: var(--ring); }
    .ck-svc-check { width:17px; height:17px; border-radius:5px; border:1.5px solid var(--border-hi); flex-shrink:0; display:flex; align-items:center; justify-content:center; margin-left:auto; transition:.18s; background: var(--ov02); }
    .ck-svc-check i { font-size:.7rem; color:transparent; }
    .ck-svc.sel .ck-svc-check { background: var(--accent); border-color: var(--accent); }
    .ck-svc.sel .ck-svc-check i { color:#071a0f; }
    .ck-svc-selbar { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; padding:.65rem .9rem; border-radius:10px; background: var(--ov03); border:1px solid var(--border); font-size:.8rem; color: var(--muted); }
    .ck-svc-selbar strong { color: var(--accent-light); font-weight:800; }
    .ck-field { margin-bottom:14px; }
    /* Honeypot field: visually and physically off-screen for sighted/mouse users,
       and pulled out of tab order + hidden from screen readers, but still present
       in the DOM so form-filling bots that grab every input tend to fill it in. */
    .ck-hp { position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden; }
    .ck-field label { display:block; font-size:.78rem; font-weight:700; color: var(--muted); margin-bottom:6px; }
    .ck-hint { font-size:.72rem; color: var(--muted); margin:5px 2px 0; line-height:1.5; display:flex; align-items:flex-start; gap:.3rem; }
    .ck-hint i { color: var(--accent-light); margin-top:1px; flex-shrink:0; }
    .ck-inp, .ck-txt { width:100%; padding:.75rem .9rem; border-radius:10px; border:1px solid var(--border-md); background: var(--ov03); color: var(--txt); font-family:inherit; font-size:16px; }
    .ck-inp:focus, .ck-txt:focus { outline:none; border-color: var(--accent); box-shadow: var(--ring); }
    .ck-txt { resize: vertical; min-height:78px; }
    .ck-row2 { display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
    .ck-returning-hint { background: rgba(58,184,129,.08); border:1px solid var(--border); border-radius:10px; padding:.65rem .85rem; margin:0 0 14px; color: var(--accent-light); }
    .ck-returning-hint i { color: var(--accent-light); }
    .ck-txt-wrap { position:relative; }
    .ck-txt-wrap .ck-txt { padding-right:46px; }
    .ck-mic-btn { position:absolute; right:8px; bottom:8px; width:32px; height:32px; border-radius:50%; border:1px solid var(--border-md); background: var(--ov05); color: var(--muted); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1rem; padding:0; transition: background .2s, border-color .2s, color .2s; }
    .ck-mic-btn:hover { border-color: var(--accent); color: var(--accent-light); }
    .ck-mic-btn.listening { background: linear-gradient(135deg, var(--accent), var(--accent-light)); border-color:transparent; color:#071a0f; animation: ckMicPulse 1.4s ease-in-out infinite; }
    @keyframes ckMicPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(58,184,129,.45); } 50% { box-shadow: 0 0 0 8px rgba(58,184,129,0); } }
    .ck-mic-hint { color: var(--accent-light); }
    .ck-mic-hint i { color: var(--accent-light); }
    .ck-rcard { border:1px solid var(--border); border-radius:12px; padding:16px; background: var(--ov02); margin-bottom:14px; }
    .ck-rhead { display:flex; align-items:center; gap:.7rem; margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid var(--border); }
    .ck-rico { width:38px; height:38px; border-radius:10px; background: rgba(58,184,129,.14); display:flex; align-items:center; justify-content:center; color: var(--accent-light); font-size:1.1rem; flex-shrink:0; }
    .ck-rrows { display:flex; flex-direction:column; gap:8px; }
    .ck-rrow { display:grid; grid-template-columns: 100px 1fr; gap:8px; font-size:.85rem; }
    .ck-rkey { color: var(--muted); font-weight:700; }
    .ck-rval { color: var(--txt); font-weight:600; word-break: break-word; }
    .ck-notice { display:flex; align-items:flex-start; gap:.6rem; border:1px solid var(--border-md); border-radius:11px; padding:.8rem .95rem; background: rgba(58,184,129,.06); font-size:.82rem; color: var(--muted); line-height:1.55; margin-bottom:8px; }
    .ck-notice i { color: var(--accent-light); font-size:1rem; margin-top:1px; flex-shrink:0; }

    /* ── Summary step (documents, add-ons, promo, pricing) ── */
    .ck-svc-chips { display:flex; flex-wrap:wrap; gap:6px; }
    .ck-svc-chip { display:inline-flex; align-items:center; gap:.4rem; border:1px solid var(--border-hi); background: rgba(58,184,129,.1); color: var(--accent-light); font-size:.78rem; font-weight:700; padding:.35rem .7rem; border-radius:100vmax; }
    .ck-sec-title { display:flex; align-items:center; gap:.5rem; font-size:.92rem; font-weight:800; margin:22px 0 4px; }
    .ck-sec-title i { color: var(--accent-light); }
    .ck-sec-sub { margin:0 0 12px; color: var(--muted); font-size:.8rem; line-height:1.5; }
    .ck-doc-group { border:1px solid var(--border); border-radius:11px; padding:14px 16px; background: var(--ov02); margin-bottom:10px; }
    .ck-doc-group-head { display:flex; align-items:center; gap:.55rem; font-weight:700; font-size:.85rem; margin-bottom:10px; }
    .ck-doc-group-head i { color: var(--accent-light); font-size:1rem; }
    .ck-addon-row { display:flex; align-items:flex-start; gap:.75rem; border:1px solid var(--border); border-radius:11px; padding:.85rem .95rem; background: var(--ov02); margin-bottom:9px; cursor:pointer; transition:.18s; }
    .ck-addon-row:hover { border-color: var(--border-md); background: rgba(58,184,129,.05); }
    .ck-addon-row.checked { border-color: var(--accent); background: rgba(58,184,129,.1); }
    .ck-addon-row.disabled { cursor:default; opacity:.7; }
    .ck-addon-check { width:19px; height:19px; border-radius:6px; border:1.5px solid var(--border-hi); flex-shrink:0; margin-top:1px; display:flex; align-items:center; justify-content:center; background: var(--ov02); }
    .ck-addon-check i { font-size:.75rem; color:transparent; }
    .ck-addon-row.checked .ck-addon-check { background: var(--accent); border-color: var(--accent); }
    .ck-addon-row.checked .ck-addon-check i { color:#071a0f; }
    .ck-addon-body { flex:1; min-width:0; }
    .ck-addon-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
    .ck-addon-name { font-weight:700; font-size:.86rem; display:flex; align-items:center; gap:.4rem; }
    .ck-addon-price { font-weight:800; font-size:.82rem; color: var(--accent-light); white-space:nowrap; }
    .ck-addon-desc { margin:3px 0 0; color: var(--muted); font-size:.78rem; line-height:1.5; }
    .ck-promo-suggest { display:flex; align-items:center; gap:.75rem; border:1.5px dashed var(--border-hi); border-radius:12px; padding:.85rem .95rem; background: rgba(58,184,129,.06); cursor:pointer; transition:.18s; }
    .ck-promo-suggest:hover { background: rgba(58,184,129,.12); border-style:solid; }
    .ck-promo-suggest-icon { width:38px; height:38px; border-radius:9px; background: rgba(58,184,129,.16); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .ck-promo-suggest-icon i { color: var(--accent-light); font-size:1.15rem; }
    .ck-promo-suggest-body { flex:1; min-width:0; }
    .ck-promo-suggest-code { font-weight:900; font-size:.88rem; letter-spacing:.03em; }
    .ck-promo-suggest-desc { margin:2px 0 0; color: var(--muted); font-size:.78rem; line-height:1.4; }
    .ck-promo-suggest-btn { background: var(--accent); color:#071a0f; border:none; border-radius:8px; padding:.5rem 1rem; font-weight:800; font-size:.78rem; font-family:inherit; white-space:nowrap; cursor:pointer; }
    .ck-promo-msg { margin-top:8px; font-size:.79rem; font-weight:700; display:flex; align-items:center; gap:6px; }
    .ck-promo-msg.ok { color: var(--accent-light); }
    .ck-promo-msg.err { color:#ff9d9d; }
    .ck-promo-applied { display:flex; align-items:center; justify-content:space-between; gap:8px; border:1px solid var(--border-hi); background: rgba(58,184,129,.1); border-radius:10px; padding:.65rem .9rem; }
    .ck-promo-applied span { font-size:.83rem; font-weight:700; color: var(--accent-light); }
    .ck-promo-remove { background:none; border:none; color: var(--muted); font-size:.76rem; font-weight:700; cursor:pointer; font-family:inherit; text-decoration:underline; }
    .ck-price-box { border:1px solid var(--border); border-radius:12px; padding:16px; background: var(--ov02); }
    .ck-price-line { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:.85rem; padding:6px 0; color: var(--txt); }
    .ck-price-line .ck-price-label { color: var(--muted); }
    .ck-price-line.custom .ck-price-label { color: var(--txt); font-weight:600; }
    .ck-price-line .ck-price-custom-tag { color: var(--muted); font-size:.76rem; font-style:italic; }
    .ck-price-line.discount { color:#ffb84d; }
    .ck-price-div { height:1px; background: var(--border); margin:6px 0; }
    .ck-price-line.total { font-size:1.02rem; font-weight:900; padding-top:10px; }
    .ck-price-line.total .ck-price-label { color: var(--txt); font-weight:900; }
    .ck-price-disclaimer { display:flex; align-items:flex-start; gap:.5rem; font-size:.76rem; color: var(--muted); margin-top:10px; line-height:1.5; }
    .ck-price-disclaimer i { color: var(--accent-light); margin-top:1px; flex-shrink:0; }
    .ck-err { display:none; margin:0 26px 14px; padding:.6rem .85rem; border-radius:9px; background: rgba(220,80,80,.12); border:1px solid rgba(220,80,80,.35); color:#ff9d9d; font-size:.82rem; font-weight:600; }
    .ck-toast { display:none; align-items:center; gap:8px; margin:0 26px 14px; padding:.7rem .9rem; border-radius:9px; background: rgba(58,184,129,.12); border:1px solid rgba(58,184,129,.35); color: var(--accent-light); font-size:.82rem; font-weight:700; }
    .ck-toast i { font-size:1.05rem; flex-shrink:0; }
    .ck-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:16px 26px; border-top:1px solid var(--border); background: var(--ov015); }
    .ck-back { background:none; border:1px solid var(--border-md); border-radius:9px; padding:.7rem 1rem; color: var(--muted); font-weight:700; font-size:.85rem; cursor:pointer; font-family:inherit; display:flex; align-items:center; gap:.4rem; touch-action:manipulation; }
    .ck-back:disabled { opacity:.35; cursor:not-allowed; }
    .ck-next { flex:1; max-width:260px; margin-left:auto; background: linear-gradient(135deg, var(--accent), var(--accent-light)); border:none; border-radius:9px; padding:.78rem 1.1rem; color:#071a0f; font-weight:800; font-size:.88rem; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:.45rem; font-family:inherit; transition: transform .18s, box-shadow .18s; touch-action:manipulation; }
    .ck-next:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(58,184,129,.35); }
    .ck-next:disabled { opacity:.65; cursor:default; pointer-events:none; }
    .ck-next.wa { background: linear-gradient(135deg, #25d366, #128c7e); color:#fff; }
    .ck-next.wa:hover { box-shadow: 0 8px 24px rgba(37,211,102,.35); }

    /* Premium success screen */
    .ck-success { display:none; flex-direction:column; align-items:center; text-align:center; padding:52px 26px 46px; }
    .ck-success.show { display:flex; }
    .ck-success-badge { position:relative; width:88px; height:88px; border-radius:50%; background: radial-gradient(circle at 32% 28%, var(--accent-light), var(--accent) 72%); display:flex; align-items:center; justify-content:center; margin-bottom:24px; animation: ckPop .6s cubic-bezier(.34,1.56,.64,1) both, ckRingPulse 1.9s ease-out .6s infinite; }
    .ck-success-badge svg { width:42px; height:42px; overflow:visible; }
    .ck-success-badge .ckCheckPath { stroke-dasharray:40; stroke-dashoffset:40; animation: ckDraw .5s ease .4s forwards; }
    .ck-spark { position:absolute; width:6px; height:6px; border-radius:50%; background: var(--accent-light); opacity:0; }
    .ck-spark.s1 { top:-4px; left:14px; animation: ckSpark .9s ease .5s forwards; }
    .ck-spark.s2 { top:8px; right:-8px; animation: ckSpark .9s ease .62s forwards; }
    .ck-spark.s3 { bottom:-2px; left:-6px; animation: ckSpark .9s ease .74s forwards; }
    .ck-success h3 { font-size:1.2rem; font-weight:800; margin:0 0 9px; animation: ckFadeUp .5s ease .3s both; }
    .ck-success p { color:var(--muted); font-size:.9rem; line-height:1.65; max-width:380px; margin:0 auto 26px; animation: ckFadeUp .5s ease .4s both; }
    .ck-done-btn { background: linear-gradient(135deg, var(--accent), var(--accent-light)); border:none; border-radius:9px; padding:.78rem 1.6rem; color:#071a0f; font-weight:800; font-size:.86rem; cursor:pointer; font-family:inherit; transition: transform .18s, box-shadow .18s; animation: ckFadeUp .5s ease .5s both; }
    .ck-done-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(58,184,129,.35); }
    .ck-caseid-box { display:flex; flex-direction:column; align-items:center; gap:6px; border:1px dashed var(--border-hi); border-radius:11px; padding:.7rem 1.1rem; background: rgba(58,184,129,.06); margin:0 0 22px; animation: ckFadeUp .5s ease .45s both; }
    .ck-caseid-label { font-size:.72rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
    .ck-caseid-row { display:flex; align-items:center; gap:8px; }
    .ck-caseid-val { font-size:1rem; font-weight:800; color:var(--accent-light); letter-spacing:.02em; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
    .ck-caseid-copy { display:flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:7px; border:1px solid var(--border-md); background:transparent; color:var(--muted); cursor:pointer; transition: color .18s, border-color .18s, background .18s; }
    .ck-caseid-copy:hover { color:var(--accent-light); border-color:var(--accent); background: rgba(58,184,129,.08); }
    .ck-caseid-copy.copied { color:var(--accent-light); border-color:var(--accent); }
    .ck-updates-block { margin-top:22px; padding-top:20px; border-top:1px solid var(--border); max-width:400px; animation: ckFadeUp .5s ease .55s both; }
    .ck-updates-msg { color:var(--muted); font-size:.8rem; line-height:1.6; margin:0 0 14px; }
    .ck-updates-btn { display:inline-flex; align-items:center; gap:.45rem; padding:.65rem 1.15rem; border-radius:9px; border:1px solid var(--border-hi); background: rgba(58,184,129,.09); color:var(--accent-light); font-weight:700; font-size:.84rem; cursor:pointer; font-family:inherit; transition: transform .18s, box-shadow .18s, background .18s; }
    .ck-updates-btn:hover { transform: translateY(-2px); background: rgba(58,184,129,.15); box-shadow: 0 8px 22px rgba(58,184,129,.22); }
    .ck-updates-options { display:none; align-items:center; justify-content:center; gap:10px; margin-top:12px; flex-wrap:wrap; }
    .ck-updates-options.show { display:flex; }
    .ck-updates-opt { display:inline-flex; align-items:center; gap:.4rem; padding:.6rem 1rem; border-radius:9px; border:1px solid var(--ov12); background:var(--ov05); color:var(--txt); font-weight:700; font-size:.8rem; cursor:pointer; font-family:inherit; transition: transform .18s, box-shadow .18s, border-color .18s; }
    .ck-updates-opt:hover { transform: translateY(-2px); }
    .ck-updates-opt.wa { border-color: rgba(37,211,102,.4); }
    .ck-updates-opt.wa:hover { background: rgba(37,211,102,.12); border-color:#25d366; }
    .ck-updates-opt.wa i { color: var(--wa); }
    .ck-updates-opt.login { border-color: var(--border-hi); }
    .ck-updates-opt.login:hover { background: rgba(58,184,129,.12); border-color: var(--accent); }
    .ck-updates-opt.login i { color: var(--accent-light); }
    .ck-updates-opt.em:hover { border-color: var(--accent); background: rgba(58,184,129,.09); }
    .ck-updates-opt.em i { color: var(--accent-light); }
    @keyframes ckPop { 0% { transform:scale(0); opacity:0; } 60% { transform:scale(1.14); opacity:1; } 100% { transform:scale(1); opacity:1; } }
    @keyframes ckRingPulse { 0% { box-shadow:0 0 0 0 rgba(58,184,129,.4); } 100% { box-shadow:0 0 0 20px rgba(58,184,129,0); } }
    @keyframes ckDraw { to { stroke-dashoffset:0; } }
    @keyframes ckFadeUp { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
    @keyframes ckSpark { 0% { opacity:0; transform:scale(.4) translateY(0); } 35% { opacity:1; } 100% { opacity:0; transform:scale(1.3) translateY(-10px); } }

    .faq-layout { display:grid; grid-template-columns: 1.4fr 1fr; gap:24px; align-items:start; }
    .faq-list details { border:1px solid var(--border); border-radius:12px; padding:16px 18px; margin-bottom:10px; background: var(--ov02); }
    .faq-list summary { cursor:pointer; font-weight:700; font-size:.94rem; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:10px; }
    .faq-list summary::-webkit-details-marker { display:none; }
    .faq-list summary::after { content:'+'; font-size:1.3rem; color: var(--accent); font-weight:400; flex-shrink:0; }
    .faq-list details[open] summary::after { content:'–'; }
    .faq-list p { margin:12px 0 0; color: var(--muted); font-size:.87rem; line-height:1.65; }
    .faq-contact-card { border:1px solid var(--border-md); border-radius: var(--radius); padding:26px; background: linear-gradient(160deg, rgba(58,184,129,.08), rgba(58,184,129,.02)); text-align:center; position:sticky; top:90px; }
    .fcc-icon { width:50px; height:50px; border-radius:13px; background: rgba(58,184,129,.14); display:flex; align-items:center; justify-content:center; font-size:1.4rem; color: var(--accent-light); margin:0 auto 14px; }
    .faq-contact-card h3 { margin:0 0 8px; font-size:1.05rem; }
    .faq-contact-card p { margin:0 0 18px; color: var(--muted); font-size:.85rem; line-height:1.6; }
    .fcc-actions { display:flex; flex-direction:column; gap:.6rem; }

    .contact-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap:14px; }
    .contact-card { background: linear-gradient(160deg, var(--ov045), var(--ov01)); border:1px solid var(--border); border-radius: var(--radius); padding:22px; }
    .contact-card h3 { margin:0 0 5px; font-size:.96rem; display:flex; align-items:center; gap:.55rem; }
    .contact-card h3 i { color: var(--accent); }
    .contact-card .c-desc { margin:0 0 15px; color: var(--muted); font-size:.86rem; line-height:1.6; }

    footer { padding:48px 0 20px; border-top:1px solid var(--border); }
    /* ── FOOTER BRAND LOGO ──
       Real <img> asset (assets/onnmore-logo.png) so the mark always shows up
       reliably — screenshots, previews, slow connections, anywhere inline
       SVG might not render. A second, mask-based accent layer sits exactly
       on top of the chevron and animates a soft light sweep across it for a
       bit of polish. In light theme the raster (white-ink) image is swapped
       for a mask-based mono mark tinted with --logo-fg so it stays legible. */
    .foot-brand-logo { position:relative; display:inline-block; width:140px; aspect-ratio: 293.43 / 87.63; margin-bottom:6px; transition: transform .25s ease; }
    .foot-brand-logo:hover { transform: translateY(-1px) scale(1.03); }
    .foot-logo-img { display:block; width:100%; height:100%; object-fit:contain; }
    .fbl-mono { display:none; }
    .fbl-accent {
      position:absolute; inset:0;
      -webkit-mask: url('logo-accent.svg') no-repeat center / contain;
      mask: url('logo-accent.svg') no-repeat center / contain;
      background: linear-gradient(120deg, var(--accent) 0%, var(--accent-light) 42%, #eafff4 50%, var(--accent-light) 58%, var(--accent) 100%);
      background-size: 240% 100%;
      animation: fblShine 5.5s ease-in-out infinite;
    }
    @keyframes fblShine {
      0%, 100% { background-position: 0% 50%; filter: drop-shadow(0 0 0 rgba(77,209,148,0)); }
      50%      { background-position: 100% 50%; filter: drop-shadow(0 0 7px rgba(77,209,148,.55)); }
    }
    .foot-brand-logo:hover .fbl-accent { animation-duration: 1.7s; }
    [data-theme="light"] .foot-logo-img { display:none; }
    [data-theme="light"] .fbl-mono {
      display:block; position:absolute; inset:0;
      -webkit-mask: url('logo-mono.svg') no-repeat center / contain;
      mask: url('logo-mono.svg') no-repeat center / contain;
      background: var(--logo-fg);
    }
    @media (prefers-reduced-motion: reduce) { .fbl-accent { animation: none; } }
    .foot-grid { display:grid; grid-template-columns: 1.3fr 1fr 1fr 1fr 1.2fr; gap:22px; margin-bottom:36px; }
    .foot-desc { color: var(--muted); font-size:.86rem; line-height:1.65; margin-top:10px; max-width:280px; }
    footer h5 { margin:0 0 14px; font-size:.72rem; text-transform:uppercase; letter-spacing:1.5px; color: var(--accent); font-weight:800; }
    .foot-links { display:flex; flex-direction:column; gap:8px; }
    .foot-links a { color: var(--muted); font-size:.86rem; transition: color .18s; }
    .foot-links a:hover { color: var(--txt); }
    .foot-areas { display:flex; flex-wrap:wrap; gap:6px; }
    .foot-area-chip { font-size:.76rem; color: var(--muted); background: var(--ov04); border:1px solid var(--border); border-radius:100vmax; padding:.28rem .62rem; }
    .foot-bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding-top:22px; border-top:1px solid var(--border); }
    .foot-copy { color: var(--muted); font-size:.76rem; line-height:1.65; }
    .foot-disclaimer { margin-top:20px; padding:16px 18px; border:1px solid var(--border); border-radius: var(--radius-sm); background: var(--ov025); color: var(--muted); font-size:.76rem; line-height:1.7; }
    .foot-disclaimer strong { display:block; color: var(--txt); font-size:.8rem; margin-bottom:6px; }
    .social-row { display:flex; gap:.6rem; }
    .soc-link { width:34px; height:34px; border-radius:8px; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color: var(--muted); transition:.18s; }
    .soc-link:hover { border-color: var(--accent); color: var(--accent-light); background: rgba(58,184,129,.07); }
    .soc-link svg { width:15px; height:15px; }

    .fab-wa { position:fixed; right:20px; bottom:20px; z-index:150; width:56px; height:56px; border-radius:50%; background: linear-gradient(135deg, #25d366, #128c7e); display:flex; align-items:center; justify-content:center; box-shadow: 0 10px 30px rgba(37,211,102,.45); font-size:1.6rem; color:#fff; animation: fabPulse 2.6s ease-in-out infinite; }
    @keyframes fabPulse { 0%,100%{ box-shadow: 0 10px 30px rgba(37,211,102,.45);} 50%{ box-shadow: 0 10px 30px rgba(37,211,102,.75), 0 0 0 8px rgba(37,211,102,.12);} }

    /* ── ADD TO HOME SCREEN: floating button ── */
    .fab-a2hs { position:fixed; right:20px; bottom:86px; z-index:150; width:52px; height:52px; border-radius:50%; border:none; background: linear-gradient(135deg, var(--accent), var(--accent-light)); display:flex; align-items:center; justify-content:center; box-shadow: 0 10px 28px rgba(58,184,129,.42); font-size:1.35rem; color:#071a0f; cursor:pointer; font-family:inherit; transition: transform .2s, box-shadow .2s; }
    .fab-a2hs:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 12px 34px rgba(58,184,129,.55); }
    .fab-a2hs.is-hidden { display:none !important; }

    .fab-a2hs-tip { position:fixed; right:84px; bottom:86px; height:52px; z-index:150; display:flex; align-items:center; gap:.3rem; padding:0 14px; border-radius:100vmax; background: var(--card); border:1px solid var(--border-hi); color:var(--txt); font-size:.82rem; font-weight:700; white-space:nowrap; box-shadow: var(--shadow); pointer-events:none; opacity:0; transform: translateX(8px) scale(.95); transition: opacity .32s ease, transform .32s ease; }
    .fab-a2hs-tip.show { opacity:1; transform: translateX(0) scale(1); }
    .fab-a2hs-tip.is-hidden { display:none !important; }
    .fab-a2hs-tip-arrow { color: var(--accent-light); font-size:1.15rem; margin-right:-4px; }
    @media (max-width: 380px) { .fab-a2hs-tip { font-size:.76rem; padding:0 11px; right:80px; } }

    /* ── ADD TO HOME SCREEN: guide modal ── */
    .a2hs-overlay { display:none; position:fixed; inset:0; z-index:400; background:rgba(6,6,10,.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); align-items:center; justify-content:center; padding:20px; }
    .a2hs-overlay.show { display:flex; animation: a2hsFadeIn .22s ease; }
    @keyframes a2hsFadeIn { from{opacity:0;} to{opacity:1;} }
    .a2hs-modal { position:relative; width:min(440px, 100%); max-height:88vh; overflow-y:auto; background: var(--card); border:1px solid var(--border-md); border-radius: var(--radius); padding:28px 26px 24px; box-shadow: var(--shadow); animation: a2hsPop .28s cubic-bezier(.22,1,.36,1); }
    @keyframes a2hsPop { from{opacity:0; transform:translateY(14px) scale(.97);} to{opacity:1; transform:translateY(0) scale(1);} }
    .a2hs-close { position:absolute; top:14px; right:14px; width:32px; height:32px; border-radius:9px; border:1px solid var(--border); background:transparent; color:var(--muted); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1.1rem; transition:.18s; }
    .a2hs-close:hover { color:var(--txt); border-color:var(--accent); background:rgba(58,184,129,.08); }
    .a2hs-icon { width:54px; height:54px; border-radius:15px; background: linear-gradient(145deg, rgba(58,184,129,.22), rgba(58,184,129,.05)); border:1px solid var(--border-md); display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:var(--accent-light); margin-bottom:16px; overflow:hidden; }
    .a2hs-icon img { width:100%; height:100%; object-fit:cover; }
    .a2hs-modal h3 { margin:0 0 8px; font-size:1.14rem; font-weight:800; padding-right:16px; line-height:1.35; }
    .a2hs-sub { margin:0 0 18px; color:var(--muted); font-size:.87rem; line-height:1.6; }
    .a2hs-install-now { margin-bottom:16px; display:none; }
    .a2hs-tabs { display:flex; gap:6px; border:1px solid var(--border); border-radius:11px; padding:4px; margin-bottom:18px; }
    .a2hs-tab { flex:1; display:flex; align-items:center; justify-content:center; gap:.35rem; padding:.62rem .4rem; border:none; background:transparent; color:var(--muted); font-weight:700; font-size:.78rem; border-radius:8px; cursor:pointer; font-family:inherit; transition:.18s; }
    .a2hs-tab i { font-size:.98rem; }
    .a2hs-tab.active { background: rgba(58,184,129,.16); color: var(--accent-light); }
    .a2hs-tab:hover:not(.active) { color:var(--txt); }
    .a2hs-steps { display:flex; flex-direction:column; gap:15px; }
    .a2hs-step { display:flex; align-items:flex-start; gap:12px; }
    .a2hs-step-num { flex-shrink:0; width:26px; height:26px; border-radius:50%; background: rgba(58,184,129,.14); border:1px solid var(--border-hi); color:var(--accent-light); font-size:.78rem; font-weight:800; display:flex; align-items:center; justify-content:center; margin-top:1px; }
    .a2hs-step-text { flex:1; min-width:0; }
    .a2hs-step-text strong { display:block; font-size:.88rem; font-weight:700; margin-bottom:2px; }
    .a2hs-step-text p { margin:0; color:var(--muted); font-size:.82rem; line-height:1.55; }
    .a2hs-step-ico { flex-shrink:0; font-size:1.15rem; color:var(--accent-light); opacity:.7; margin-top:2px; }
    .a2hs-note { margin-top:19px; padding-top:16px; border-top:1px solid var(--border); font-size:.76rem; color:var(--muted); line-height:1.6; display:flex; gap:8px; align-items:flex-start; }
    .a2hs-note i { color:var(--accent); flex-shrink:0; margin-top:1px; font-size:.95rem; }
    @media (max-width:420px) { .a2hs-modal { padding:22px 18px 20px; } }

    /* ── WHATSAPP CONNECT MODAL ── */
    .wa-modal-overlay { display:none; position:fixed; inset:0; z-index:410; background:rgba(6,6,10,.72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); align-items:center; justify-content:center; padding:20px; }
    .wa-modal-overlay.show { display:flex; animation: a2hsFadeIn .22s ease; }
    .wa-modal { position:relative; width:min(420px, 100%); max-height:88vh; overflow-y:auto; background:#fff; border-radius:22px; box-shadow: var(--shadow); animation: a2hsPop .28s cubic-bezier(.22,1,.36,1); }
    .wa-modal-head { position:relative; display:flex; align-items:flex-start; gap:16px; padding:26px 56px 26px 24px; background: linear-gradient(135deg, #1fae5c, #17974f); border-radius:22px 22px 0 0; }
    .wa-modal-icon { flex-shrink:0; width:52px; height:52px; border-radius:50%; background:rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center; font-size:1.5rem; color:#fff; }
    .wa-modal-head h3 { margin:0; color:#fff; font-size:1.26rem; font-weight:800; line-height:1.3; }
    .wa-modal-close { position:absolute; top:18px; right:18px; width:34px; height:34px; border-radius:50%; border:none; background:rgba(255,255,255,.18); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1.15rem; transition:.18s; flex-shrink:0; }
    .wa-modal-close:hover { background:rgba(255,255,255,.32); }
    .wa-modal-body { padding:26px 24px 24px; display:flex; flex-direction:column; gap:16px; }
    .wa-field { position:relative; display:flex; align-items:center; border:1.5px solid #e2e5eb; border-radius:100vmax; padding:0 18px; height:56px; transition:border-color .18s; background:#fff; }
    .wa-field:focus-within { border-color:#25d366; }
    .wa-field i { color:#9aa1b0; font-size:1.2rem; flex-shrink:0; }
    .wa-field input { border:none; outline:none; flex:1; min-width:0; font-family:inherit; font-size:1rem; color:#1a1a1a; padding:0 0 0 12px; background:transparent; }
    .wa-field input::placeholder { color:#9aa1b0; }
    .wa-field.wa-phone-field { padding-left:14px; }
    .wa-country { display:flex; align-items:center; gap:6px; flex-shrink:0; color:#1a1a1a; font-weight:700; font-size:1rem; padding-right:12px; margin-right:6px; border-right:1.5px solid #e2e5eb; height:60%; }
    .wa-country .flag { font-size:1.15rem; line-height:1; }
    .wa-modal-submit { display:flex; align-items:center; justify-content:center; gap:.6rem; width:100%; height:56px; border:none; border-radius:100vmax; background: linear-gradient(135deg, #25d366, #128c7e); color:#fff; font-weight:800; font-size:1.02rem; cursor:pointer; font-family:inherit; transition: transform .2s, box-shadow .2s; }
    .wa-modal-submit i { font-size:1.3rem; }
    .wa-modal-submit:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(37,211,102,.4); }
    .wa-modal-err { color:#e0433d; font-size:.8rem; font-weight:600; margin:-6px 0 0; display:none; }
    .wa-modal-err.show { display:block; }
    @media (max-width:420px) { .wa-modal-head { padding:22px 50px 22px 20px; } .wa-modal-body { padding:22px 20px 20px; } }

    /* ══════════ DOCUMENT CHECKLIST ══════════ */
    .doc-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap:14px; }
    .doc-list details { border:1px solid var(--border); border-radius:12px; padding:16px 18px; background: var(--ov02); transition: border-color .2s; }
    .doc-list details[open] { border-color: var(--border-hi); background: rgba(58,184,129,.03); }
    .doc-list summary { cursor:pointer; list-style:none; display:flex; align-items:center; gap:.65rem; }
    .doc-list summary::-webkit-details-marker { display:none; }
    .doc-sum-ico { width:36px; height:36px; border-radius:9px; background: rgba(58,184,129,.1); border:1px solid rgba(58,184,129,.18); display:flex; align-items:center; justify-content:center; font-size:1.05rem; color: var(--accent-light); flex-shrink:0; }
    .doc-sum-text { font-weight:700; font-size:.92rem; flex:1; }
    .doc-sum-count { font-size:.7rem; font-weight:700; color: var(--muted); background: var(--ov05); border-radius:100vmax; padding:.2rem .55rem; flex-shrink:0; }
    .doc-sum-chevron { font-size:1.15rem; color: var(--accent); transition: transform .2s; flex-shrink:0; }
    .doc-list details[open] .doc-sum-chevron { transform: rotate(45deg); }
    .doc-items { list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; }
    .doc-items li { display:flex; align-items:flex-start; gap:.55rem; font-size:.85rem; color: var(--muted); line-height:1.5; }
    .doc-items li i { color: var(--accent-light); font-size:1rem; margin-top:2px; flex-shrink:0; }
    .doc-note { display:flex; align-items:flex-start; gap:.5rem; font-size:.78rem; color: var(--muted); background: var(--ov02); border:1px dashed var(--border-md); border-radius:9px; padding:.6rem .75rem; margin-top:14px; line-height:1.5; }
    .doc-note i { color: var(--accent-light); flex-shrink:0; margin-top:1px; }
    .doc-start-btn { display:inline-flex; align-items:center; gap:.4rem; margin-top:12px; background:none; border:1px solid var(--border-md); border-radius:8px; padding:.5rem .85rem; color: var(--accent-light); font-weight:700; font-size:.78rem; cursor:pointer; font-family:inherit; transition:.18s; }
    .doc-start-btn:hover { border-color: var(--accent); background: rgba(58,184,129,.08); }

    @media (max-width: 1080px) { .foot-grid { grid-template-columns: 1fr 1fr 1fr; } }
    @media (max-width: 960px) { .why-grid, .steps-grid { grid-template-columns: 1fr 1fr; } }
    @media (max-width: 780px) {
      .faq-layout { grid-template-columns: 1fr; }
      .faq-contact-card { position:static; }
      .nav-links { display:none; }
      .mobile-toggle { display:flex; }
      .nav-actions .hide-mobile { display:none; }
      section { padding:52px 0; }
      .foot-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 680px) {
      .hero-grid { grid-template-columns: 1fr; text-align:center; gap:32px; }
      .hero-lead { max-width:100%; margin-left:auto; margin-right:auto; }
      .hero-cta { justify-content:center; }
      .hero-trust { justify-content:center; }
      .hero-img-card { max-width:320px; margin:0 auto; }
      h1 { font-size: clamp(28px, 7.8vw, 42px); }
      .hero-grid > div:first-child::before { width:300px; height:300px; top:-40px; left:-40px; }
    }
    @media (max-width: 560px) {
      .ck-panel { padding:18px 16px 4px; }
      .ck-foot { padding:14px 16px; }
      .ck-svc-grid { grid-template-columns: 1fr; }
      .ck-row2 { grid-template-columns: 1fr; }
      .ck-lbl { display:none; }
      .ck-rrow { grid-template-columns: 1fr; gap:2px; }
      .ck-err { margin:0 16px 12px; }
      .ck-toast { margin:0 16px 12px; }
      .foot-grid { grid-template-columns: 1fr; }
      .why-grid, .steps-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 400px) { .why-grid, .steps-grid { grid-template-columns: 1fr; } }

/* ══════════ SUBPAGE ADDITIONS ══════════ */
.breadcrumb { display:flex; align-items:center; gap:6px; font-size:.82rem; color: var(--muted); padding:18px 0 0; flex-wrap:wrap; }
.breadcrumb a { color: var(--muted); transition:.15s; }
.breadcrumb a:hover { color: var(--accent-light); }
.breadcrumb .sep { opacity:.5; }
.breadcrumb .current { color: var(--txt); font-weight:600; }

.subhero { padding: 40px 0 56px; position:relative; }
.subhero .badge { margin-bottom:16px; }
.subhero h1 { font-size: clamp(1.9rem, 3.6vw, 2.7rem); font-weight:800; line-height:1.16; margin:0 0 16px; letter-spacing:-.01em; max-width: 780px; }
.subhero .sub-lead { color: var(--muted); font-size:1.03rem; line-height:1.65; max-width:640px; margin:0 0 26px; }
.subhero .hero-cta { display:flex; gap:12px; flex-wrap:wrap; }

.content-section { padding: 12px 0 56px; }
.content-section h2 { font-size:1.5rem; font-weight:800; margin: 0 0 14px; letter-spacing:-.01em; }
.content-section h3 { font-size:1.12rem; font-weight:700; margin: 28px 0 10px; }
.content-section p { color: var(--muted); font-size:.97rem; line-height:1.7; margin:0 0 14px; max-width: 760px; }
.content-section p.lede { color: var(--txt); font-size:1.05rem; }

.check-list { list-style:none; margin: 8px 0 20px; padding:0; display:grid; grid-template-columns: 1fr 1fr; gap:10px 20px; max-width: 780px; }
.check-list li { display:flex; align-items:flex-start; gap:.55rem; color: var(--muted); font-size:.92rem; line-height:1.55; }
.check-list li i { color: var(--accent-light); font-size:1.05rem; margin-top:1px; flex-shrink:0; }
@media (max-width:640px) { .check-list { grid-template-columns: 1fr; } }

.info-card-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(250px,1fr)); gap:16px; margin: 10px 0 8px; }
.info-card { border:1px solid var(--border); background: var(--ov02); border-radius: var(--radius-sm); padding: 20px; transition: border-color .2s, transform .2s; }
.info-card:hover { border-color: var(--border-hi); transform: translateY(-2px); }
.info-card .ic-ico { width:40px; height:40px; border-radius:10px; background: rgba(58,184,129,.1); border:1px solid rgba(58,184,129,.18); display:flex; align-items:center; justify-content:center; font-size:1.15rem; color: var(--accent-light); margin-bottom:12px; }
.info-card h4 { margin:0 0 6px; font-size:.98rem; font-weight:700; }
.info-card p { margin:0; font-size:.85rem; color: var(--muted); line-height:1.55; }

.cta-banner { margin: 8px 0 0; border:1px solid var(--border-hi); background: linear-gradient(135deg, rgba(58,184,129,.1), rgba(58,184,129,.02)); border-radius: var(--radius); padding: 30px 32px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.cta-banner h3 { margin:0 0 6px; font-size:1.2rem; font-weight:800; }
.cta-banner p { margin:0; color: var(--muted); font-size:.9rem; max-width:480px; }
.cta-banner .btns { display:flex; gap:10px; flex-wrap:wrap; }

.related-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(220px,1fr)); gap:14px; margin-top:10px; }
.related-card { display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid var(--border); background: var(--ov02); border-radius: var(--radius-sm); padding:16px 18px; font-weight:700; font-size:.9rem; transition:.18s; }
.related-card:hover { border-color: var(--accent); background: rgba(58,184,129,.06); color: var(--accent-light); }
.related-card i { color: var(--accent-light); }

.legal-content { max-width: 820px; }
.legal-content h2 { font-size:1.25rem; margin: 30px 0 10px; }
.legal-content h2:first-child { margin-top:0; }
.legal-content p, .legal-content li { color: var(--muted); font-size:.92rem; line-height:1.75; }
.legal-content ul { margin:0 0 14px; padding-left:20px; }
.legal-updated { color: var(--muted); font-size:.82rem; margin-bottom:26px; display:block; }

.page-toc { display:flex; flex-wrap:wrap; gap:8px; margin: 0 0 30px; }
.page-toc a { border:1px solid var(--border-md); border-radius:100vmax; padding:.4rem .85rem; font-size:.78rem; font-weight:700; color:var(--muted); transition:.15s; }
.page-toc a:hover { border-color:var(--accent); color:var(--accent-light); background:rgba(58,184,129,.07); }

@media (max-width:780px) { .cta-banner { flex-direction:column; align-items:flex-start; } }

/* ══════════ FREE BUSINESS TOOLS — footer cross-link block (added site-wide) ══════════ */
.foot-tools { border-top: 1px solid var(--border); padding-top: 22px; margin-bottom: 22px; }
.foot-tools h5 { margin: 0 0 12px; font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 800; }
.foot-tools-links { display: flex; flex-wrap: wrap; gap: 8px; }
.foot-tools-links a { display: inline-flex; align-items: center; border: 1px solid var(--border-md); border-radius: 100vmax; padding: .4rem .85rem; font-size: .78rem; font-weight: 700; color: var(--muted); transition: .15s; background: var(--ov02); }
.foot-tools-links a:hover { border-color: var(--accent); color: var(--accent-light); background: rgba(58,184,129,.08); }