  /* ============================================================
     Design system — skill: "Trust & Authority" style,
     booking-themed palette (calendar blue + available green),
     Plus Jakarta Sans. No AI purple gradients.
     ============================================================ */
  :root {
    --blue-700:#075985; --blue-600:#0284C7; --blue-500:#0EA5E9; --blue-100:#E0F2FE; --blue-50:#F0F9FF;
    --green-600:#059669; --green-500:#10B981; --green-100:#D1FAE5;
    --ink:#0B1F33;            /* deep navy text */
    --ink-2:#3F5A72;          /* muted */
    --line:#DCEAF3;
    --surface:#FFFFFF;
    --bg:#F4FAFE;
    --amber:#F59E0B;
    --danger:#E11D48;

    --r-sm:10px; --r:16px; --r-lg:24px; --r-xl:30px;
    --sh-1:0 1px 2px rgba(11,31,51,.05), 0 4px 14px rgba(11,31,51,.05);
    --sh-2:0 12px 30px rgba(11,31,51,.10);
    --sh-3:0 30px 70px rgba(7,89,133,.22);
    --ring:0 0 0 4px rgba(2,132,199,.16);

    --ease:cubic-bezier(.22,1,.36,1);
    --t1:160ms var(--ease); --t2:280ms var(--ease); --t3:520ms var(--ease);
    --maxw:1160px;
    --grad:linear-gradient(135deg,var(--blue-600),var(--blue-500));
  }
  * { box-sizing:border-box; }
  html { scroll-behavior:smooth; }
  body {
    margin:0; background:var(--bg); color:var(--ink);
    font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
    line-height:1.6; -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  h1,h2,h3,h4 { margin:0; line-height:1.08; letter-spacing:-.02em; font-weight:800; }
  p { margin:0; }
  a { color:inherit; text-decoration:none; }
  ul { margin:0; padding:0; list-style:none; }
  .wrap { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px; }
  img,svg { display:block; }

  /* dotted calendar-grid backdrop */
  body::before{
    content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
    background-image:radial-gradient(rgba(2,132,199,.06) 1px, transparent 1px);
    background-size:26px 26px; mask-image:linear-gradient(180deg,#000,transparent 80%);
  }

  /* ---------- buttons ---------- */
  .btn{ display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:1rem;
    padding:14px 24px; border-radius:999px; cursor:pointer; border:2px solid transparent;
    transition:transform var(--t1),box-shadow var(--t1),background var(--t1),color var(--t1); white-space:nowrap; }
  .btn-primary{ background:var(--green-600); color:#fff; box-shadow:0 8px 20px rgba(5,150,105,.28); }
  .btn-primary:hover{ background:var(--green-500); transform:translateY(-2px); box-shadow:0 14px 28px rgba(5,150,105,.34); }
  .btn-blue{ background:var(--grad); color:#fff; box-shadow:0 8px 20px rgba(2,132,199,.28); }
  .btn-blue:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(2,132,199,.36); }
  .btn-ghost{ background:#fff; color:var(--blue-700); border-color:var(--line); }
  .btn-ghost:hover{ transform:translateY(-2px); box-shadow:var(--sh-1); border-color:var(--blue-100); }
  .btn-lg{ padding:17px 30px; font-size:1.06rem; }
  :focus-visible{ outline:3px solid var(--blue-600); outline-offset:3px; border-radius:8px; }

  .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:.78rem;
    letter-spacing:.12em; text-transform:uppercase; color:var(--blue-700);
    background:var(--blue-100); padding:7px 14px; border-radius:999px; }
  .live-dot{ width:8px;height:8px;border-radius:50%;background:var(--green-500); box-shadow:0 0 0 0 rgba(16,185,129,.5); animation:pulse 2s infinite; }
  @keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(16,185,129,.5);} 70%{box-shadow:0 0 0 9px rgba(16,185,129,0);} 100%{box-shadow:0 0 0 0 rgba(16,185,129,0);} }

  /* ============ promo bar ============ */
  .promo{ background:var(--ink); color:#dbeafe; font-size:.9rem; text-align:center; padding:9px 16px; font-weight:500; }
  .promo b{ color:#fff; }
  .promo .tag{ background:var(--amber); color:#3a2a00; font-weight:800; padding:2px 9px; border-radius:999px; font-size:.78rem; margin-right:8px; }

  /* ============ nav ============ */
  header.nav{ position:sticky; top:0; z-index:60; background:rgba(244,250,254,.8);
    backdrop-filter:saturate(160%) blur(12px); transition:box-shadow var(--t1),border-color var(--t1);
    border-bottom:1px solid transparent; }
  header.nav.sticky{ box-shadow:var(--sh-1); border-bottom-color:var(--line); }
  .nav-in{ display:flex; align-items:center; justify-content:space-between; height:70px; gap:18px; }
  .logo{ display:flex; align-items:center; gap:11px; font-weight:800; font-size:1.22rem; letter-spacing:-.02em; }
  .logo .glyph{ width:38px; height:38px; border-radius:11px; background:var(--grad); display:grid; place-items:center;
    color:#fff; box-shadow:0 6px 16px rgba(2,132,199,.35); }
  .logo .glyph svg{ width:22px; height:22px; }
  .logo b{ color:var(--blue-700); } .logo span.pro{ color:var(--green-600); }
  .nav-links{ display:flex; align-items:center; gap:28px; }
  .nav-links a{ font-weight:600; color:var(--ink-2); transition:color var(--t1); }
  .nav-links a:hover{ color:var(--blue-700); }
  .nav-right{ display:flex; align-items:center; gap:14px; }
  .nav-phone{ font-weight:700; color:var(--blue-700); display:inline-flex; align-items:center; gap:7px; }
  .burger{ display:none; background:none; border:none; cursor:pointer; color:var(--ink); }

  /* ============ hero ============ */
  .hero{ position:relative; padding:64px 0 72px; }
  .hero::after{ content:""; position:absolute; top:-120px; right:-160px; width:560px; height:560px; z-index:-1;
    background:radial-gradient(circle,rgba(14,165,233,.18),transparent 65%); filter:blur(10px); }
  .hero-grid{ display:grid; grid-template-columns:1.04fr .96fr; gap:54px; align-items:center; }
  .hero h1{ font-size:clamp(2.4rem,5.4vw,4rem); color:var(--ink); margin:20px 0 18px; }
  .hero h1 .hl{ position:relative; color:var(--blue-700); white-space:nowrap; }
  .hero h1 .hl::after{ content:""; position:absolute; left:-2px; right:-2px; bottom:4px; height:32%; z-index:-1;
    background:var(--green-100); border-radius:4px; transform:skewX(-6deg); }
  .hero .lead{ font-size:1.16rem; color:var(--ink-2); max-width:36ch; margin-bottom:28px; }
  .hero-cta{ display:flex; flex-wrap:wrap; gap:13px; margin-bottom:26px; }
  .trustrow{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; color:var(--ink-2); font-size:.92rem; font-weight:600; }
  .stars{ display:inline-flex; gap:2px; color:var(--amber); } .stars svg{ width:17px; height:17px; }

  /* ---------- live booking widget ---------- */
  .widget-stage{ position:relative; }
  .widget{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-xl);
    box-shadow:var(--sh-3); overflow:hidden; position:relative; z-index:2; }
  .w-top{ background:var(--grad); color:#fff; padding:16px 20px; display:flex; align-items:center; justify-content:space-between; }
  .w-top .biz{ display:flex; align-items:center; gap:11px; }
  .w-top .biz .ava{ width:38px; height:38px; border-radius:11px; background:rgba(255,255,255,.18); display:grid; place-items:center; font-weight:800; }
  .w-top .biz small{ opacity:.85; font-weight:600; display:block; font-size:.74rem; }
  .w-top .biz strong{ font-size:1rem; }
  .w-live{ display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.16); padding:5px 11px; border-radius:999px; font-size:.74rem; font-weight:700; }
  .w-body{ padding:20px; }
  .w-step-label{ font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--blue-600); margin-bottom:11px; display:flex; align-items:center; gap:8px; }
  .w-step-label .n{ width:20px; height:20px; border-radius:50%; background:var(--blue-100); color:var(--blue-700); display:grid; place-items:center; font-size:.72rem; }

  .svc-list{ display:grid; gap:9px; }
  .svc{ display:flex; align-items:center; gap:12px; padding:13px 14px; border:1.5px solid var(--line); border-radius:var(--r-sm);
    cursor:pointer; transition:border-color var(--t1),background var(--t1),transform var(--t1); background:#fff; text-align:left; width:100%; font-family:inherit; }
  .svc:hover{ border-color:var(--blue-500); transform:translateX(2px); }
  .svc.sel{ border-color:var(--blue-600); background:var(--blue-50); box-shadow:var(--ring); }
  .svc .ic{ width:36px; height:36px; border-radius:9px; background:var(--blue-100); color:var(--blue-700); display:grid; place-items:center; flex:none; }
  .svc .ic svg{ width:19px; height:19px; }
  .svc .meta{ flex:1; } .svc .meta .nm{ font-weight:700; font-size:.95rem; } .svc .meta .du{ font-size:.8rem; color:var(--ink-2); }
  .svc .pr{ font-weight:800; color:var(--ink); }

  .days{ display:grid; grid-template-columns:repeat(6,1fr); gap:8px; margin-bottom:16px; }
  .day{ border:1.5px solid var(--line); border-radius:11px; padding:9px 0; text-align:center; cursor:pointer; background:#fff;
    transition:border-color var(--t1),background var(--t1),transform var(--t1); font-family:inherit; }
  .day:hover{ border-color:var(--blue-500); transform:translateY(-2px); }
  .day.sel{ border-color:var(--blue-600); background:var(--blue-600); color:#fff; box-shadow:0 6px 14px rgba(2,132,199,.3); }
  .day .dow{ font-size:.68rem; font-weight:700; opacity:.7; text-transform:uppercase; }
  .day .dnum{ font-size:1.05rem; font-weight:800; }

  .slots{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
  .slot{ border:1.5px solid var(--line); border-radius:10px; padding:11px 0; text-align:center; font-weight:700; font-size:.9rem; cursor:pointer; background:#fff;
    transition:border-color var(--t1),background var(--t1),color var(--t1),transform var(--t1); font-family:inherit; position:relative; }
  .slot:hover{ border-color:var(--green-500); color:var(--green-600); transform:translateY(-2px); }
  .slot.sel{ background:var(--green-600); border-color:var(--green-600); color:#fff; }
  .slot.taken{ opacity:.45; cursor:not-allowed; text-decoration:line-through; background:#f1f5f9; }
  .slot.taken:hover{ border-color:var(--line); color:inherit; transform:none; }

  .w-foot{ margin-top:18px; }
  .w-confirm{ width:100%; justify-content:center; }
  .w-confirm:disabled{ opacity:.5; cursor:not-allowed; transform:none; box-shadow:none; }

  /* success state */
  .w-success{ text-align:center; padding:14px 8px 6px; }
  .check-circle{ width:74px; height:74px; border-radius:50%; background:var(--green-100); display:grid; place-items:center; margin:0 auto 16px; }
  .check-circle svg{ width:38px; height:38px; color:var(--green-600); }
  .check-circle svg path{ stroke-dasharray:30; stroke-dashoffset:30; animation:draw .6s var(--ease) .15s forwards; }
  @keyframes draw{ to{ stroke-dashoffset:0; } }
  .w-success h4{ font-size:1.3rem; margin-bottom:6px; }
  .w-success p{ color:var(--ink-2); font-size:.95rem; }
  .w-success .recap{ background:var(--blue-50); border:1px solid var(--line); border-radius:var(--r); padding:14px; margin:16px 0; text-align:left; display:grid; gap:7px; }
  .recap .rr{ display:flex; justify-content:space-between; font-size:.9rem; } .recap .rr span{ color:var(--ink-2); } .recap .rr b{ color:var(--ink); }
  .link-reset{ background:none; border:none; color:var(--blue-600); font-weight:700; cursor:pointer; font-family:inherit; font-size:.92rem; }

  .step-pane{ display:none; } .step-pane.active{ display:block; animation:fade .35s var(--ease); }
  @keyframes fade{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none;} }

  /* floating toast */
  .toast{ position:absolute; left:-26px; bottom:48px; z-index:5; background:#fff; border:1px solid var(--line);
    border-radius:14px; box-shadow:var(--sh-2); padding:11px 15px 11px 12px; display:flex; align-items:center; gap:11px;
    transform:translateX(-130%); opacity:0; transition:transform var(--t3),opacity var(--t3); max-width:240px; }
  .toast.show{ transform:translateX(0); opacity:1; }
  .toast .tic{ width:34px;height:34px;border-radius:9px;background:var(--green-100);color:var(--green-600);display:grid;place-items:center;flex:none; }
  .toast .tic svg{ width:18px;height:18px; }
  .toast .tt{ font-weight:800; font-size:.86rem; } .toast .ts{ font-size:.78rem; color:var(--ink-2); }
  .widget-badge{ position:absolute; right:-18px; top:-18px; z-index:5; background:var(--ink); color:#fff; font-weight:800; font-size:.72rem;
    padding:8px 13px; border-radius:999px; box-shadow:var(--sh-2); display:flex; align-items:center; gap:7px; }

  /* ============ industries strip ============ */
  .strip{ padding:30px 0 8px; }
  .strip p.k{ text-align:center; color:var(--ink-2); font-weight:700; font-size:.82rem; letter-spacing:.12em; text-transform:uppercase; margin-bottom:18px; }
  .chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:11px; }
  .chip{ display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--line); border-radius:999px;
    padding:9px 16px; font-weight:700; color:var(--ink-2); box-shadow:var(--sh-1); transition:transform var(--t1),color var(--t1),border-color var(--t1); }
  .chip:hover{ transform:translateY(-2px); color:var(--blue-700); border-color:var(--blue-100); }
  .chip svg{ width:17px; height:17px; color:var(--blue-600); }

  /* ============ section scaffold ============ */
  section.block{ padding:78px 0; }
  .head{ text-align:center; max-width:680px; margin:0 auto 50px; }
  .head .k{ color:var(--green-600); font-weight:800; letter-spacing:.12em; text-transform:uppercase; font-size:.8rem; }
  .head h2{ font-size:clamp(2rem,4.4vw,3rem); margin:10px 0 14px; }
  .head p{ color:var(--ink-2); font-size:1.1rem; }

  /* ============ before / after ============ */
  .ba{ display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:stretch; }
  .ba-card{ border-radius:var(--r-lg); padding:30px; position:relative; overflow:hidden; }
  .ba-before{ background:#fff5f6; border:1px solid #fbd9df; }
  .ba-after{ background:linear-gradient(160deg,#ecfdf5,#f0f9ff); border:1px solid var(--green-100); }
  .ba-tag{ display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase;
    padding:6px 12px; border-radius:999px; margin-bottom:18px; }
  .ba-before .ba-tag{ background:#ffe4e8; color:var(--danger); } .ba-after .ba-tag{ background:var(--green-100); color:var(--green-600); }
  .ba-card h3{ font-size:1.5rem; margin-bottom:8px; } .ba-card>p{ color:var(--ink-2); margin-bottom:18px; }
  .ba-list li{ display:flex; gap:11px; align-items:flex-start; padding:8px 0; font-weight:600; }
  .ba-list svg{ width:20px; height:20px; flex:none; margin-top:2px; }
  .ba-before .ba-list svg{ color:var(--danger); } .ba-after .ba-list svg{ color:var(--green-600); }

  /* missed call jitter */
  .missed{ position:absolute; right:18px; top:20px; background:#fff; border:1px solid #fbd9df; border-radius:12px; box-shadow:var(--sh-1);
    padding:8px 12px; font-size:.78rem; font-weight:700; color:var(--danger); display:flex; align-items:center; gap:7px; animation:jitter 1.6s var(--ease) infinite; }
  .missed svg{ width:15px; height:15px; }
  @keyframes jitter{ 0%,100%{transform:rotate(-3deg);} 50%{transform:rotate(3deg);} }

  /* ============ features ============ */
  .feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  .feat{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); padding:30px 26px; box-shadow:var(--sh-1);
    transition:transform var(--t2),box-shadow var(--t2),border-color var(--t2); }
  .feat:hover{ transform:translateY(-6px); box-shadow:var(--sh-2); border-color:var(--blue-100); }
  .feat .fic{ width:54px; height:54px; border-radius:15px; background:var(--blue-50); color:var(--blue-600); display:grid; place-items:center; margin-bottom:18px;
    transition:transform var(--t2),background var(--t2); }
  .feat:hover .fic{ transform:rotate(-6deg) scale(1.05); background:var(--blue-100); }
  .feat .fic svg{ width:26px; height:26px; }
  .feat h3{ font-size:1.22rem; margin-bottom:7px; } .feat p{ color:var(--ink-2); }
  .feat ul{ margin-top:12px; display:grid; gap:6px; }
  .feat ul li{ display:flex; gap:8px; align-items:center; font-size:.9rem; color:var(--ink-2); font-weight:600; }
  .feat ul li svg{ width:15px; height:15px; color:var(--green-600); flex:none; }

  /* ============ how it works ============ */
  .steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; position:relative; }
  .steps::before{ content:""; position:absolute; top:34px; left:14%; right:14%; height:2px; background:repeating-linear-gradient(90deg,var(--blue-100) 0 10px,transparent 10px 20px); z-index:0; }
  .step{ text-align:center; position:relative; z-index:1; }
  .step .num{ width:68px; height:68px; border-radius:50%; background:#fff; border:2px solid var(--blue-100); color:var(--blue-700);
    display:grid; place-items:center; font-size:1.5rem; font-weight:800; margin:0 auto 18px; box-shadow:var(--sh-1); }
  .step h3{ font-size:1.18rem; margin-bottom:7px; } .step p{ color:var(--ink-2); max-width:30ch; margin:0 auto; }

  /* ============ stats band ============ */
  .band{ background:var(--ink); color:#fff; border-radius:var(--r-xl); padding:54px 40px; position:relative; overflow:hidden; }
  .band::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px); background-size:24px 24px; }
  .band-grid{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:26px; text-align:center; }
  .band .num{ font-size:clamp(2.6rem,5vw,3.6rem); font-weight:800; background:linear-gradient(120deg,#7dd3fc,#34d399); -webkit-background-clip:text; background-clip:text; color:transparent; line-height:1; }
  .band .lbl{ color:#a9c5dc; font-weight:600; margin-top:8px; }
  .band .disclaim{ position:relative; text-align:center; color:#6f8aa3; font-size:.8rem; margin-top:26px; }

  /* ============ testimonial ============ */
  .quote-wrap{ max-width:780px; margin:0 auto; text-align:center; }
  .quote-mark{ font-size:5rem; line-height:.4; color:var(--blue-100); font-weight:800; }
  .quote-wrap blockquote{ font-size:clamp(1.4rem,3vw,2rem); font-weight:700; color:var(--ink); margin:0 0 20px; letter-spacing:-.02em; }
  .quote-wrap .stars{ justify-content:center; margin-bottom:14px; }
  .quote-wrap cite{ font-style:normal; color:var(--ink-2); font-weight:600; }

  /* ============ pricing ============ */
  .price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:start; }
  .plan{ background:#fff; border:1.5px solid var(--line); border-radius:var(--r-xl); padding:32px 28px; box-shadow:var(--sh-1);
    position:relative; transition:transform var(--t2),box-shadow var(--t2); }
  .plan:hover{ transform:translateY(-6px); box-shadow:var(--sh-2); }
  .plan.popular{ border-color:var(--blue-600); box-shadow:var(--sh-3); transform:scale(1.02); }
  .plan.popular:hover{ transform:scale(1.02) translateY(-6px); }
  .pop-badge{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--grad); color:#fff;
    font-weight:800; font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; padding:6px 16px; border-radius:999px; box-shadow:var(--sh-1); }
  .plan .pname{ font-size:1.3rem; font-weight:800; } .plan .pdesc{ color:var(--ink-2); font-size:.92rem; margin-bottom:18px; }
  .plan .price{ display:flex; align-items:baseline; gap:4px; }
  .plan .price .amt{ font-size:3rem; font-weight:800; letter-spacing:-.03em; } .plan .price .per{ color:var(--ink-2); font-weight:700; }
  .setup{ display:inline-flex; align-items:center; gap:9px; margin:12px 0 20px; font-weight:700; color:var(--ink-2); font-size:.9rem; }
  .setup .off{ background:var(--green-100); color:var(--green-600); font-weight:800; padding:3px 9px; border-radius:999px; font-size:.74rem; }
  .plan .cta{ width:100%; justify-content:center; margin-bottom:22px; }
  .plan .incl-h{ font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-2); margin-bottom:12px; }
  .plan ul.incl li{ display:flex; gap:10px; align-items:flex-start; padding:6px 0; font-size:.93rem; font-weight:500; }
  .plan ul.incl svg{ width:18px; height:18px; color:var(--green-600); flex:none; margin-top:3px; }

  /* ============ faq ============ */
  .faq-wrap{ max-width:760px; margin:0 auto; display:grid; gap:12px; }
  .faq{ background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; transition:box-shadow var(--t1); }
  .faq[open]{ box-shadow:var(--sh-1); }
  .faq summary{ cursor:pointer; padding:20px 22px; font-weight:700; font-size:1.05rem; display:flex; justify-content:space-between; align-items:center; gap:16px; list-style:none; }
  .faq summary::-webkit-details-marker{ display:none; }
  .faq summary .pm{ width:26px; height:26px; border-radius:50%; background:var(--blue-50); color:var(--blue-700); display:grid; place-items:center; flex:none; transition:transform var(--t2),background var(--t2); }
  .faq[open] summary .pm{ transform:rotate(45deg); background:var(--blue-600); color:#fff; }
  .faq .ans{ padding:0 22px 20px; color:var(--ink-2); }

  /* ============ final cta ============ */
  .final{ background:var(--grad); border-radius:var(--r-xl); padding:58px 40px; text-align:center; color:#fff; position:relative; overflow:hidden; }
  .final::before{ content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px); background-size:22px 22px; }
  .final-in{ position:relative; }
  .final h2{ font-size:clamp(2rem,4.4vw,3rem); margin-bottom:12px; }
  .final p{ color:rgba(255,255,255,.9); max-width:48ch; margin:0 auto 26px; font-size:1.1rem; }
  .demo-form{ display:flex; gap:11px; justify-content:center; flex-wrap:wrap; }
  .demo-form input{ padding:15px 20px; border-radius:999px; border:2px solid rgba(255,255,255,.3); background:rgba(255,255,255,.14);
    color:#fff; font-size:1rem; min-width:290px; font-family:inherit; font-weight:500; }
  .demo-form input::placeholder{ color:rgba(255,255,255,.75); }
  .demo-form .btn-primary{ background:#fff; color:var(--blue-700); }
  .demo-form .btn-primary:hover{ background:var(--blue-50); }
  .final .ok{ margin-top:16px; font-weight:700; }

  /* ============ footer ============ */
  footer{ background:var(--ink); color:#a9c5dc; padding:54px 0 30px; margin-top:4px; }
  .foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:36px; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,.1); }
  footer .logo{ color:#fff; margin-bottom:14px; } footer .logo b{ color:#7dd3fc; } footer .logo span.pro{ color:#34d399; }
  .foot-grid p{ max-width:34ch; }
  .foot-grid h4{ color:#fff; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px; font-weight:800; }
  .foot-grid a{ display:block; padding:5px 0; transition:color var(--t1); } .foot-grid a:hover{ color:#fff; }
  .socials{ display:flex; gap:11px; margin-top:14px; }
  .socials a{ width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,.08); display:grid; place-items:center; transition:background var(--t1),transform var(--t1); }
  .socials a:hover{ background:var(--blue-600); transform:translateY(-2px); } .socials svg{ width:19px; height:19px; color:#fff; }
  .foot-bot{ display:flex; justify-content:space-between; align-items:center; gap:14px; padding-top:24px; font-size:.86rem; flex-wrap:wrap; }

  /* ============ reveal ============ */
  .rv{ opacity:0; transform:translateY(28px); transition:opacity .7s var(--ease),transform .7s var(--ease); }
  .rv.in{ opacity:1; transform:none; }

  /* ============ responsive ============ */
  @media (max-width:1024px){
    .hero-grid{ gap:32px; } .feat-grid,.price-grid{ grid-template-columns:1fr 1fr; }
    .plan.popular{ transform:none; } .plan.popular:hover{ transform:translateY(-6px); }
  }
  @media (max-width:860px){
    .nav-links,.nav-phone{ display:none; } .burger{ display:inline-flex; }
    .nav-links.open{ display:flex; position:absolute; top:70px; left:0; right:0; flex-direction:column; background:#fff;
      padding:18px 24px; gap:16px; box-shadow:var(--sh-2); border-bottom:1px solid var(--line); }
    .hero-grid{ grid-template-columns:1fr; } .widget-stage{ max-width:440px; margin:0 auto; }
    .ba,.steps,.band-grid,.foot-grid{ grid-template-columns:1fr; } .steps::before{ display:none; }
    .feat-grid,.price-grid{ grid-template-columns:1fr; } .toast{ display:none; }
  }
  @media (max-width:480px){
    .wrap{ padding:0 18px; } section.block{ padding:56px 0; }
    .days{ grid-template-columns:repeat(3,1fr); } .band,.final,.band{ padding:40px 22px; }
    .demo-form input{ min-width:0; width:100%; }
  }
  @media (prefers-reduced-motion:reduce){
    html{ scroll-behavior:auto; }
    *,*::before,*::after{ animation:none !important; transition:none !important; }
    .rv{ opacity:1; transform:none; }
  }

  /* ============ final CTA buttons ============ */
  .final-actions{ display:flex; gap:13px; justify-content:center; flex-wrap:wrap; }
  .final .btn-primary{ background:#fff; color:var(--blue-700); }
  .final .btn-primary:hover{ background:var(--blue-50); }
  .final-ghost{ background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.45); }
  .final-ghost:hover{ background:rgba(255,255,255,.24); }

  /* ============================================================
     GET STARTED PAGE (get-started.html)
     ============================================================ */
  .gs-main{ padding:54px 0 90px; }
  .gs-wrap{ max-width:720px; margin:0 auto; }
  .gs-head{ text-align:center; margin-bottom:36px; }
  .gs-head h1{ font-size:clamp(2rem,4.4vw,2.8rem); margin-bottom:12px; }
  .gs-head p{ color:var(--ink-2); font-size:1.08rem; max-width:46ch; margin:0 auto; }
  .gs-steps-note{ display:inline-flex; align-items:center; gap:8px; margin-top:16px; color:var(--green-600); font-weight:700; font-size:.92rem; }

  .gs-card{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-2); padding:32px; }
  .gs-label{ font-size:.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--blue-600); margin:4px 0 14px; display:flex; align-items:center; gap:8px; }
  .gs-label .n{ width:22px; height:22px; border-radius:50%; background:var(--blue-100); color:var(--blue-700); display:grid; place-items:center; font-size:.74rem; }

  /* plan picker */
  .plan-pick{ display:grid; grid-template-columns:repeat(3,1fr); gap:11px; margin-bottom:30px; }
  .pick{ border:2px solid var(--line); border-radius:var(--r); padding:16px 14px; cursor:pointer; background:#fff; text-align:left;
    transition:border-color var(--t1),box-shadow var(--t1),transform var(--t1); position:relative; }
  .pick:hover{ border-color:var(--blue-500); transform:translateY(-2px); }
  .pick.sel{ border-color:var(--blue-600); box-shadow:var(--ring); }
  .pick .pk-name{ font-weight:800; font-size:1.05rem; }
  .pick .pk-price{ color:var(--ink); font-weight:800; font-size:1.3rem; margin-top:4px; } .pick .pk-price span{ font-size:.8rem; color:var(--ink-2); font-weight:700; }
  .pick .pk-desc{ font-size:.8rem; color:var(--ink-2); margin-top:4px; }
  .pick .pk-check{ position:absolute; top:12px; right:12px; width:20px; height:20px; border-radius:50%; border:2px solid var(--line); display:grid; place-items:center; }
  .pick.sel .pk-check{ background:var(--blue-600); border-color:var(--blue-600); }
  .pick .pk-check svg{ width:12px; height:12px; color:#fff; opacity:0; } .pick.sel .pk-check svg{ opacity:1; }
  .pick .pk-pop{ display:inline-block; margin-top:8px; font-size:.66rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--blue-700); background:var(--blue-100); padding:2px 8px; border-radius:999px; }

  /* fields */
  .field{ margin-bottom:18px; }
  .field label{ display:block; font-weight:700; font-size:.92rem; margin-bottom:7px; color:var(--ink); }
  .field label .req{ color:var(--danger); }
  .field input, .field textarea{ width:100%; padding:14px 16px; border:1.5px solid var(--line); border-radius:var(--r-sm);
    font-family:inherit; font-size:1rem; color:var(--ink); background:#fff; transition:border-color var(--t1),box-shadow var(--t1); }
  .field input:focus, .field textarea:focus{ outline:none; border-color:var(--blue-600); box-shadow:var(--ring); }
  .field textarea{ min-height:104px; resize:vertical; }
  .field .hint{ font-size:.82rem; color:var(--ink-2); margin-top:6px; }
  .field.err input, .field.err textarea{ border-color:var(--danger); }
  .field .err-msg{ color:var(--danger); font-size:.82rem; font-weight:600; margin-top:6px; display:none; }
  .field.err .err-msg{ display:block; }

  .gs-submit{ width:100%; justify-content:center; margin-top:6px; }
  .gs-submit:disabled{ opacity:.6; cursor:not-allowed; }
  .gs-privacy{ text-align:center; font-size:.82rem; color:var(--ink-2); margin-top:14px; }

  /* success */
  .gs-success{ text-align:center; padding:18px 6px; }
  .gs-success .check-circle{ margin-bottom:18px; }
  .gs-success h2{ font-size:1.8rem; margin-bottom:10px; }
  .gs-success p{ color:var(--ink-2); max-width:42ch; margin:0 auto 8px; }
  .gs-recap{ background:var(--blue-50); border:1px solid var(--line); border-radius:var(--r); padding:16px; margin:20px auto; max-width:420px; text-align:left; display:grid; gap:8px; }
  .gs-recap .rr{ display:flex; justify-content:space-between; gap:14px; font-size:.92rem; } .gs-recap .rr span{ color:var(--ink-2); } .gs-recap .rr b{ color:var(--ink); text-align:right; }

  .gs-topbar{ position:sticky; top:0; z-index:40; background:rgba(244,250,254,.85); backdrop-filter:saturate(160%) blur(12px); border-bottom:1px solid var(--line); }
  .gs-topbar .nav-in{ height:66px; }
  .gs-back{ font-weight:700; color:var(--ink-2); display:inline-flex; align-items:center; gap:7px; transition:color var(--t1); }
  .gs-back:hover{ color:var(--blue-700); }

  @media (max-width:560px){
    .plan-pick{ grid-template-columns:1fr; } .gs-card{ padding:22px; }
  }
