/* Homepage, built from design/homepage-mockup-v5.html */
:root { --navy:#0B1B33; --blue:#0A66FF; --sky:#4DA3FF; --yellow:#FFC400; --bg:#F2F4F8; --tint:#EAF1FF; --muted:#56657C; --line:#E2E8F1; --green:#1DA851; }
  * { box-sizing:border-box; }
  body { margin:0; background:#fff; color:var(--navy); font-family:var(--font); -webkit-font-smoothing:antialiased; }
  a { color:inherit; text-decoration:none; }
  svg.i { width:20px; height:20px; flex:none; }
  .wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
  h1,h2,h3 { font-family:var(--font-head); font-weight:800; letter-spacing:-.025em; margin:0; }
  .btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:52px; padding:0 26px; border-radius:999px; font-weight:800; font-size:16px; background:var(--blue); color:#fff; border:0; }
  .btn.ghost { background:#fff; color:var(--navy); box-shadow:inset 0 0 0 1.5px var(--line); }
  .btn.small { height:42px; padding:0 18px; font-size:15px; }
  .eyebrow { display:block; font-size:13px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--blue); }
  section { padding:96px 0; }
  .alt { background:var(--bg); }
  .head { text-align:center; max-width:700px; margin:0 auto 52px; }
  .head h2 { font-size:clamp(30px,4vw,44px); margin:10px 0 14px; line-height:1.1; }
  .head p { font-size:18px; color:var(--muted); margin:0; line-height:1.55; }

  /* nav */
  .nav { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
  .nav .wrap { display:flex; align-items:center; justify-content:space-between; height:68px; }
  .nav nav { display:flex; align-items:center; gap:30px; font-weight:700; font-size:15px; }
  .sa-lockup { font-size:19px; }

  /* hero */
  .hero { padding:72px 0 88px; background:linear-gradient(180deg,#fff 0%,var(--bg) 100%); }
  .hero .wrap { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
  .pill { display:inline-flex; gap:8px; align-items:center; background:var(--tint); color:var(--blue); border-radius:999px; padding:7px 14px; font-weight:800; font-size:13.5px; }
  .pill svg { width:16px; height:16px; }
  .hero h1 { font-size:clamp(40px,4.6vw,58px); line-height:1.05; margin:18px 0 18px; }
  .hero h1 em { font-style:normal; color:var(--blue); }
  .lead { font-size:19px; line-height:1.55; color:#33435C; margin:0 0 30px; max-width:500px; }
  .ctas { display:flex; gap:12px; flex-wrap:wrap; }
  .meta { margin-top:18px; font-size:14px; color:var(--muted); font-weight:600; }
  .meta b { color:var(--navy); }
  .works { margin-top:34px; padding-top:22px; border-top:1px solid var(--line); }
  .works span { display:block; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#8A97AB; margin-bottom:10px; }
  .works div { display:flex; flex-wrap:wrap; gap:8px 18px; font-weight:800; color:#5B6B82; font-size:15px; }

  .art { display:flex; flex-direction:column; align-items:center; }
  .stage { position:relative; width:540px; height:520px; }
  .stage .sheet-img { position:absolute; left:0; top:40px; width:270px; transform:rotate(-4deg); border-radius:6px; box-shadow:0 30px 60px -32px rgba(11,27,51,.55); }
  .stage .phone { position:absolute; right:0; top:0; width:256px; height:520px; background:var(--navy); border-radius:44px; padding:10px; box-shadow:0 36px 70px -34px rgba(11,27,51,.7); }
  .scan-tag { position:absolute; left:18px; top:440px; z-index:3; background:#fff; border-radius:14px; padding:10px 12px; display:flex; gap:8px; align-items:center; font-weight:800; font-size:13px; box-shadow:0 14px 30px -14px rgba(11,27,51,.45); }
  .scan-tag svg { color:var(--blue); }
  .scr { background:#fff; border-radius:34px; height:100%; overflow:hidden; display:flex; flex-direction:column; }
  .scr .top { padding:14px 14px 8px; } .scr .top .sa-lockup { font-size:13px; gap:5px; }
  .scr img.photo { width:100%; height:126px; object-fit:cover; object-position:40% 60%; }
  .scr .b { padding:12px; display:flex; flex-direction:column; gap:8px; }
  .scr .t { font-family:var(--font-head); font-weight:800; font-size:14px; line-height:1.2; }
  .scr .m { display:flex; gap:6px; align-items:center; }
  .scr .p { font-family:var(--font-head); font-weight:800; font-size:19px; }
  .chip { background:#EEF3FB; border-radius:99px; padding:2px 8px; font-size:10.5px; font-weight:700; color:#3B4A63; white-space:nowrap; }
  .lab { font-size:8.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#6E7B91; }
  .ext { display:flex; justify-content:space-between; align-items:center; border:1.5px solid var(--blue); color:var(--blue); border-radius:11px; padding:7px 10px; font-weight:800; font-size:12px; }
  .ext small { display:block; color:#6E7B91; font-size:8.5px; font-weight:600; }
  .ext svg { width:14px; height:14px; }
  .note-s { display:flex; gap:6px; align-items:center; background:#EEF3FB; color:#3B4A63; border-radius:9px; padding:6px 8px; font-size:9.5px; font-weight:700; }
  .note-s svg { width:12px; height:12px; }
  .warn-s { display:flex; gap:6px; align-items:center; background:#FFF6D6; color:#5A4500; border-radius:9px; padding:6px 8px; font-size:9.5px; font-weight:700; }
  .warn-s svg { width:12px; height:12px; }
  .share-s { background:var(--blue); color:#fff; border-radius:99px; padding:7px; text-align:center; font-size:11px; font-weight:800; display:flex; justify-content:center; gap:6px; align-items:center; }
  .share-s svg { width:12px; height:12px; }
  .example { margin:26px 0 0; font-size:12.5px; color:var(--muted); text-align:center; }


  .hgal { position:relative; margin:0 8px; border-radius:16px; overflow:hidden; }
  .hgal .photo { display:block; height:168px; }
  .htag { position:absolute; top:8px; left:8px; background:#fff; border-radius:99px; padding:3px 8px; font-size:9.5px; font-weight:800; display:flex; gap:4px; align-items:center; }
  .htag svg { width:11px; height:11px; color:var(--blue); }
  .hcnt { position:absolute; top:8px; right:8px; background:rgba(11,27,51,.72); color:#fff; border-radius:99px; padding:2px 7px; font-size:9.5px; font-weight:700; }
  .hsub { font-size:10.5px; color:#6E7B91; font-weight:600; margin-top:-5px; }
  .hmi { font-size:10.5px; color:#6E7B91; font-weight:700; }
  .hfacts { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; }
  .hfacts div { background:#fff; border-radius:10px; padding:6px 2px; text-align:center; box-shadow:inset 0 0 0 1px var(--line); }
  .hfacts svg { width:13px; height:13px; color:var(--blue); display:block; margin:0 auto 2px; }
  .hfacts b { font-size:9.5px; }
  .hmain { display:flex; align-items:center; justify-content:space-between; gap:6px; background:var(--blue); color:#fff; border-radius:12px; padding:8px 10px; }
  .hmain b { display:block; font-size:12px; } .hmain small { display:block; font-size:8.5px; opacity:.9; font-weight:600; }
  .hmain svg { width:14px; height:14px; flex:none; }
  /* flow */
  .flow { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; position:relative; }
  .flow::before { content:''; position:absolute; top:31px; left:12%; right:12%; height:2px; background:repeating-linear-gradient(90deg,var(--line) 0 8px,transparent 8px 14px); }
  .fstep { text-align:center; position:relative; }
  .fstep .ic { width:64px; height:64px; border-radius:20px; background:var(--tint); color:var(--blue); display:grid; place-items:center; margin:0 auto 18px; position:relative; }
  .fstep .ic svg { width:28px; height:28px; }
  .fstep .n { position:absolute; top:-8px; right:-8px; width:26px; height:26px; border-radius:50%; background:var(--yellow); color:var(--navy); font-weight:800; font-size:13px; display:grid; place-items:center; }
  .fstep h3 { font-size:19px; margin-bottom:8px; }
  .fstep p { margin:0 auto; color:var(--muted); line-height:1.5; font-size:15.5px; max-width:230px; }

  /* privacy compare */
  .compare { display:grid; grid-template-columns:1fr 1fr; gap:28px; max-width:920px; margin:0 auto; }
  .cbox { background:#fff; border-radius:26px; padding:30px; box-shadow:inset 0 0 0 1px var(--line); display:flex; flex-direction:column; gap:18px; }
  .cbox h3 { font-size:20px; display:flex; align-items:center; gap:10px; }
  .badge-x, .badge-ok { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; flex:none; }
  .badge-x { background:#FDE7E5; color:#C0392B; } .badge-ok { background:#E3F6EA; color:#12804A; }
  .badge-x svg, .badge-ok svg { width:16px; height:16px; }
  .oldsign { height:190px; border-radius:14px; background:#FFF; border:3px solid #E53935; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; font-family:var(--font-head); }
  .oldsign b { font-size:40px; color:#E53935; letter-spacing:.02em; }
  .oldsign span { font-size:26px; font-weight:800; color:var(--navy); }
  .newsign { height:190px; border-radius:14px; background:var(--bg); display:grid; place-items:center; overflow:hidden; }
  .newsign img { height:172px; border-radius:4px; box-shadow:0 10px 24px -16px rgba(11,27,51,.6); }
  .cbox ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
  .cbox li { display:flex; gap:10px; font-size:15.5px; line-height:1.45; color:#33435C; }
  .cbox li svg { width:18px; height:18px; margin-top:2px; }
  .cbox.bad li svg { color:#C0392B; } .cbox.good li svg { color:#12804A; }


  /* reasons */
  .reasons { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .reason { background:#fff; border-radius:22px; padding:24px; display:flex; gap:16px; align-items:flex-start; box-shadow:inset 0 0 0 1px var(--line); }
  .ri { width:44px; height:44px; border-radius:14px; background:#FDECEA; color:#C0392B; display:grid; place-items:center; flex:none; }
  .ri svg { width:22px; height:22px; }
  .reason h3 { font-size:17.5px; margin:2px 0 6px; }
  .reason p { margin:0; font-size:15px; color:var(--muted); line-height:1.5; }
  .instead { margin:28px auto 0; max-width:1072px; background:var(--navy); color:#fff; border-radius:22px; padding:22px 26px; display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
  .instead p { margin:0; flex:1 1 360px; color:#C9D5E8; font-size:16px; line-height:1.55; }
  .instead p b { color:#fff; }
  .ok-ic { width:44px; height:44px; border-radius:50%; background:#1F8F55; display:grid; place-items:center; flex:none; }
  .ok-ic svg { width:22px; height:22px; color:#fff; }
  .instead .btn { background:var(--yellow); color:var(--navy); }
  @media (max-width: 900px) { .reasons { grid-template-columns:1fr; } }
  /* print options */
  .popts { display:grid; grid-template-columns:1fr 1fr; gap:20px; max-width:900px; margin:44px auto 0; }
  .popt { background:#fff; border-radius:22px; padding:24px; display:flex; gap:16px; align-items:flex-start; box-shadow:inset 0 0 0 1px var(--line); }
  .popt .ic { width:46px; height:46px; border-radius:14px; background:var(--tint); color:var(--blue); display:grid; place-items:center; flex:none; }
  .popt h3 { font-size:18px; margin:2px 0 6px; } .popt p { margin:0; font-size:15px; color:var(--muted); line-height:1.55; }
  .popts + .try { margin-top:20px; }
  @media (max-width: 900px) { .popts { grid-template-columns:1fr; } }
  /* signs */
  .signs { display:flex; gap:40px; justify-content:center; align-items:flex-end; flex-wrap:wrap; }
  .signs figure { margin:0; text-align:center; }
  .signs img { display:block; border-radius:6px; box-shadow:0 26px 50px -32px rgba(11,27,51,.55); }
  .signs figure:first-child img { width:320px; } .signs figure:last-child img { width:414px; }
  .signs figcaption { margin-top:16px; } .signs figcaption b { display:block; font-family:var(--font-head); font-size:18px; } .signs figcaption span { color:var(--muted); font-size:14px; }
  .try { max-width:900px; margin:44px auto 0; background:var(--tint); border-radius:22px; padding:22px 26px; display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
  .try .ic { width:48px; height:48px; border-radius:14px; background:#fff; color:var(--blue); display:grid; place-items:center; flex:none; }
  .try .tx { flex:1 1 300px; } .try b { display:block; font-family:var(--font-head); font-size:18px; margin-bottom:4px; } .try span { color:#3B4A63; font-size:15px; line-height:1.5; }
  .try .bt { display:flex; gap:10px; flex-wrap:wrap; }
  .fine { text-align:center; font-size:13.5px; color:var(--muted); margin:20px 0 0; line-height:1.6; }

  /* features */
  .feats { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
  .feat { background:#fff; border-radius:22px; padding:26px; box-shadow:inset 0 0 0 1px var(--line); }
  .feat .ic { width:46px; height:46px; border-radius:14px; background:var(--tint); color:var(--blue); display:grid; place-items:center; margin-bottom:18px; }
  .feat h3 { font-size:18px; margin-bottom:6px; } .feat p { margin:0; font-size:15px; color:var(--muted); line-height:1.5; }


  /* privacy promise */
  #privacy { }
  .promise { background:var(--navy); border-radius:32px; padding:56px 52px; color:#fff; }
  .promise .pe { color:var(--yellow); }
  .promise h2 { font-size:clamp(30px,4vw,44px); margin:10px 0 12px; line-height:1.08; color:#fff; }
  .plead { color:#B9C6DA; font-size:18px; line-height:1.55; margin:0 0 34px; max-width:720px; }
  .promises { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
  .pr { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:20px; padding:22px; }
  .pr .ic { width:42px; height:42px; border-radius:12px; background:rgba(77,163,255,.18); color:#7DB8FF; display:grid; place-items:center; margin-bottom:14px; }
  .pr h3 { font-size:17.5px; margin:0 0 6px; color:#fff; }
  .pr p { margin:0; color:#B9C6DA; font-size:14.5px; line-height:1.5; }
  .you { margin-top:26px; background:#fff; color:var(--navy); border-radius:22px; padding:26px 28px; display:grid; grid-template-columns:260px 1fr; gap:28px; align-items:start; }
  .you h3 { font-size:22px; margin:8px 0 8px; line-height:1.2; }
  .ysub { color:var(--muted); font-size:15px; line-height:1.5; margin:0; }
  .ytag { display:inline-block; background:#FFF3C4; color:#6B5000; border-radius:99px; padding:4px 10px; font-size:12px; font-weight:800; }
  .tips { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 22px; }
  .tips li { display:flex; gap:10px; font-size:15px; line-height:1.45; color:#33435C; }
  .tips li svg { color:var(--blue); width:18px; height:18px; margin-top:2px; }
  .tips b { color:var(--navy); }
  .pnote { margin:22px 0 0; color:#8FA0BA; font-size:13.5px; }
  .pnote a { color:#B9C6DA; text-decoration:underline; }
  @media (max-width: 900px) { .promise { padding:36px 22px; border-radius:24px; } .promises, .tips { grid-template-columns:1fr; } .you { grid-template-columns:1fr; gap:16px; padding:22px; } }

  /* why big sites */
  .whys { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .why { background:#fff; border-radius:22px; padding:26px; box-shadow:inset 0 0 0 1px var(--line); }
  .why .ic { width:46px; height:46px; border-radius:14px; background:var(--tint); color:var(--blue); display:grid; place-items:center; margin-bottom:16px; }
  .why h3 { font-size:19px; margin:0 0 6px; } .why p { margin:0; font-size:15.5px; color:var(--muted); line-height:1.55; }
  .bridge { margin-top:28px; background:#fff; border-radius:22px; padding:22px; box-shadow:inset 0 0 0 1px var(--line); display:flex; align-items:center; justify-content:space-between; gap:10px; }
  .bridge .node { flex:1; text-align:center; display:flex; flex-direction:column; align-items:center; gap:4px; padding:10px; border-radius:16px; }
  .bridge .node svg { width:26px; height:26px; color:var(--blue); margin-bottom:4px; }
  .bridge .node b { font-size:15.5px; } .bridge .node span { font-size:13px; color:var(--muted); }
  .bridge .node.strong { background:var(--tint); }
  .bridge .arrow { display:flex; flex-direction:column; align-items:center; gap:4px; color:var(--blue); font-size:12px; font-weight:800; flex:none; width:96px; }
  .bridge .arrow svg { width:20px; height:20px; }
  .bridge .arrow::before { content:''; display:block; width:100%; height:2px; background:repeating-linear-gradient(90deg,var(--blue) 0 6px,transparent 6px 11px); }
  @media (max-width: 900px) { .whys { grid-template-columns:1fr; } .bridge { flex-direction:column; } .bridge .arrow { width:auto; } .bridge .arrow::before { width:2px; height:22px; background:repeating-linear-gradient(180deg,var(--blue) 0 6px,transparent 6px 11px); } }

  /* v5: why box inside How it works */
  .whybox { margin-top:56px; background:var(--bg); border-radius:24px; padding:28px; display:grid; grid-template-columns:240px 1fr; gap:24px; align-items:center; }
  .whybox h3 { font-size:22px; margin:8px 0 0; line-height:1.2; }
  .whybox .whys { grid-template-columns:repeat(3,1fr); gap:14px; }
  .whybox .why { display:flex; gap:12px; align-items:flex-start; padding:18px; }
  .whybox .why .ic { margin:0; width:40px; height:40px; flex:none; }
  .whybox .why h4 { margin:2px 0 4px; font-family:var(--font-head); font-size:16px; }
  .whybox .why p { font-size:14px; }
  /* v5: never put your number */
  .never { background:#fff; border-radius:24px; padding:26px 28px; display:grid; grid-template-columns:270px 1fr; gap:24px; align-items:center; box-shadow:inset 0 0 0 1px var(--line); margin-bottom:24px; }
  .never h3 { font-size:21px; margin:0 0 6px; line-height:1.25; } .never .nt p { margin:0; color:var(--muted); font-size:15px; }
  .nlist { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 22px; }
  .nlist li { display:flex; gap:10px; font-size:15px; line-height:1.45; color:#33435C; }
  .nlist li svg { width:20px; height:20px; color:#C0392B; flex:none; margin-top:1px; }
  .nlist b { color:var(--navy); }
  .promise h2 { font-size:clamp(24px,2.8vw,32px) !important; margin:10px 0 28px !important; max-width:760px; }
  .promises { grid-template-columns:repeat(4,1fr) !important; }
  .feats.three { grid-template-columns:repeat(3,1fr); }
  @media (max-width: 900px) { .feats.three { grid-template-columns:1fr; } .whybox, .never { grid-template-columns:1fr; } .whybox .whys, .nlist { grid-template-columns:1fr; } .promises { grid-template-columns:1fr !important; } }
  /* dealers */
  .dealer { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
  .dealer h2 { font-size:clamp(30px,3.8vw,42px); margin:10px 0 16px; line-height:1.1; }
  .dealer p { color:var(--muted); font-size:17.5px; line-height:1.6; margin:0 0 22px; }
  .dealer ul { list-style:none; padding:0; margin:0 0 28px; display:grid; gap:12px; }
  .dealer li { display:flex; gap:10px; font-size:16px; } .dealer li svg { color:var(--blue); width:20px; height:20px; }
  .dcard { background:#fff; border-radius:26px; padding:24px; box-shadow:0 30px 60px -36px rgba(11,27,51,.45), inset 0 0 0 1px var(--line); display:flex; flex-direction:column; gap:14px; }
  .biz { display:flex; align-items:center; gap:12px; }
  .biz .logo { width:46px; height:46px; border-radius:12px; background:var(--navy); color:#fff; display:grid; place-items:center; font-weight:800; font-family:var(--font-head); }
  .biz b { display:block; font-size:16px; } .biz span { font-size:13px; color:var(--muted); }
  .vb { margin-left:auto; display:inline-flex; gap:4px; align-items:center; background:#E3F6EA; color:#12804A; border-radius:99px; padding:4px 10px; font-size:12px; font-weight:800; }
  .vb svg { width:14px; height:14px; }
  .row-l { display:flex; justify-content:space-between; align-items:center; }
  .row-l .lab { font-size:11px; }
  .open { background:#E3F6EA; color:#12804A; border-radius:99px; padding:3px 9px; font-size:12px; font-weight:800; }
  .g2 { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .g2 span { display:flex; align-items:center; gap:8px; background:var(--blue); color:#fff; border-radius:14px; padding:12px; font-weight:800; font-size:15px; }
  .g2 span.wa { background:var(--green); }
  .hrs { font-size:13px; color:var(--muted); font-weight:600; }

  /* pricing */
  .plans { display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:860px; margin:0 auto; align-items:stretch; }
  .plan { background:#fff; border-radius:28px; padding:34px; display:flex; flex-direction:column; box-shadow:inset 0 0 0 1px var(--line); position:relative; }
  .plan.pro { box-shadow:inset 0 0 0 2px var(--blue); }
  .plan .tag { position:absolute; top:-13px; left:34px; background:var(--blue); color:#fff; border-radius:99px; padding:5px 12px; font-size:12px; font-weight:800; }
  .plan h3 { font-size:22px; } .plan .sub { color:var(--muted); margin:4px 0 20px; }
  .plan .amt { font-family:var(--font-head); font-size:52px; font-weight:800; letter-spacing:-.03em; line-height:1; }
  .plan .per { color:var(--muted); font-size:14px; margin:8px 0 24px; }
  .plan ul { list-style:none; padding:0; margin:0 0 30px; display:grid; gap:12px; align-content:start; flex:1; }
  .plan li { display:flex; gap:10px; font-size:15.5px; line-height:1.45; } .plan li svg { color:var(--blue); width:18px; height:18px; margin-top:2px; }
  .plan .btn { width:100%; }
  .plan .pn { margin:14px 0 0; font-size:13px; line-height:1.5; color:var(--muted); text-align:center; min-height:58px; }
  .plan .pn a { color:var(--blue); font-weight:700; }

  /* faq */
  .faq { max-width:780px; margin:0 auto; display:grid; gap:10px; }
  .faq details { background:#fff; border-radius:16px; padding:0 22px; }
  .faq summary { list-style:none; cursor:pointer; padding:18px 0; display:flex; justify-content:space-between; gap:16px; font-weight:700; }
  .faq summary::-webkit-details-marker { display:none; }
  .faq summary::after { content:'+'; color:var(--blue); font-weight:800; }
  .faq details[open] summary::after { content:'-'; }
  .faq details p { margin:0 0 18px; color:var(--muted); line-height:1.6; }
  .faq a { color:var(--blue); font-weight:700; }

  /* final cta + footer */
  .final { background:var(--navy); color:#fff; border-radius:32px; padding:56px; text-align:center; }
  .final h2 { font-size:clamp(28px,3.6vw,40px); color:#fff; margin-bottom:12px; }
  .final p { color:#B9C6DA; font-size:18px; margin:0 0 28px; }
  .final .btn { background:var(--yellow); color:var(--navy); }
  footer { padding:44px 0 56px; text-align:center; font-size:14px; color:var(--muted); background:var(--bg); }
  footer .links { display:flex; gap:20px; justify-content:center; flex-wrap:wrap; margin:16px 0 12px; font-weight:700; color:var(--blue); }
  footer p { max-width:680px; margin:0 auto; font-size:13px; line-height:1.55; }

  @media (max-width: 900px) {
    .nav nav a:not(.btn) { display:none; }
    section { padding:64px 0; }
    .hero { padding:40px 0 56px; }
    .hero .wrap, .dealer, .compare { grid-template-columns:1fr; }
    .art { overflow:hidden; } .stage { zoom:.62; }
    .flow, .feats, .plans { grid-template-columns:1fr; }
    .flow::before { display:none; }
    .signs figure:first-child img { width:min(290px,80vw); } .signs figure:last-child img { width:min(380px,88vw); }
    .final { padding:36px 22px; border-radius:24px; }
    .plan .pn { min-height:0; }
  }