/* ============================================================
   CLAF — Implanon NXT · Landing Page v2
   Marca REAL: malva #957799 + dourado #D6B185 · Poppins
   Ângulo: a proteção que não depende da sua memória.
   ============================================================ */
:root {
  /* brand */
  --malva:#957799; --malva-700:#7C5E80; --malva-800:#5E4462; --malva-dark:#8A678E;
  --malva-50:#F4EFF4; --malva-100:#E9E0EA;
  --dourado:#D6B185; --dourado-600:#C79A5E; --dourado-50:#FBF6EE; --dourado-100:#F3E8D6;
  /* neutrals */
  --bg:#FFFFFF; --surface:#F7F4F7; --surface-2:#EFE9EF; --border:#EBEBEB; --border-accent:#D6B185;
  --text:#32373C; --text-muted:#7A6E7C; --text-on-malva:#FFFFFF;
  --cta-text:#3C2A40; /* deep malva for legibility on gold */
  /* status */
  --success:#2F9E72; --warning-bg:#FFF6E9; --warning-text:#8A5A1B; --warning-border:#F2DFC2;
  /* type */
  --font:'Poppins',system-ui,sans-serif;
  /* radius */
  --r-sm:13px; --r-md:20px; --r-lg:26px; --r-xl:32px; --r-pill:100px;
  /* spacing */
  --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px;
  /* shadow (malva-tinted) */
  --shadow-sm:0 1px 3px rgba(50,55,60,.06);
  --shadow-md:0 8px 24px rgba(149,119,153,.12);
  --shadow-lg:0 16px 44px rgba(149,119,153,.18);
  --container:1140px; --measure:62ch;
  --ease-out:cubic-bezier(.22,.61,.36,1); --dur-fast:180ms; --dur-mid:560ms;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  font-family:var(--font); color:var(--text); background:var(--bg);
  line-height:1.62; font-size:16px; font-weight:400; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img { max-width:100%; display:block; }

.container { width:100%; max-width:var(--container); margin:0 auto; padding:0 20px; }

h1,h2,h3 { font-family:var(--font); line-height:1.16; text-wrap:pretty; letter-spacing:-0.015em; }
h1 { font-size:clamp(1.95rem,5.4vw,3.1rem); font-weight:700; color:var(--malva-800); }
h2 { font-size:clamp(1.55rem,4.1vw,2.3rem); font-weight:600; color:var(--malva-800); max-width:20ch; }
h3 { font-weight:600; }
.lead { font-size:clamp(1.02rem,2.4vw,1.18rem); color:var(--text-muted); max-width:var(--measure); }

.gold-rule { display:block; width:54px; height:3px; border-radius:2px; background:var(--dourado); margin-bottom:18px; }
.center { text-align:center; }
.center .gold-rule { margin-left:auto; margin-right:auto; }
.center h2 { margin-left:auto; margin-right:auto; }
.eyebrow {
  display:inline-block; font-family:var(--font); font-weight:600; font-size:.78rem;
  letter-spacing:.07em; text-transform:uppercase; color:var(--malva-700);
  background:var(--malva-50); border:1px solid var(--malva-100); border-radius:var(--r-pill);
  padding:6px 16px;
}

/* ---------------- Buttons ---------------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--font); font-weight:600; font-size:1rem; text-decoration:none;
  border-radius:var(--r-pill); padding:15px 30px; cursor:pointer; border:none;
  transition:transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast), background var(--dur-fast);
  text-align:center; line-height:1.25;
}
.btn:hover { transform:translateY(-2px); }
.btn:active { transform:translateY(0); }
/* primary CTA = brand gold pill, deep-malva text for legibility */
.btn-cta {
  background:var(--dourado); color:var(--cta-text);
  box-shadow:0 8px 20px rgba(214,177,133,.42);
}
.btn-cta:hover { background:var(--dourado-600); box-shadow:0 10px 24px rgba(199,154,94,.5); }
.btn-malva { background:var(--malva); color:#fff; box-shadow:0 8px 20px rgba(149,119,153,.3); }
.btn-malva:hover { background:var(--malva-700); }
.btn-ghost { background:#fff; color:var(--malva-800); border:1.5px solid var(--border-accent); }
.btn-ghost:hover { background:var(--dourado-50); }
.btn-sm { padding:12px 22px; font-size:.92rem; }
.btn .wa-icon { width:19px; height:19px; flex-shrink:0; }

/* ---------------- Top bar ---------------- */
.topbar { background:var(--malva); color:#fff; font-size:.82rem; font-weight:500; text-align:center; padding:8px 16px; }
.topbar span { opacity:.95; }
.topbar .sep { opacity:.45; margin:0 8px; }

/* ---------------- Header ---------------- */
.site-header {
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.93); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.site-header .container { display:flex; align-items:center; justify-content:space-between; padding:11px 20px; }
.brand { display:flex; align-items:center; gap:11px; text-decoration:none; }
.brand img { width:44px; height:44px; }
.brand .wordmark { font-family:var(--font); font-weight:700; font-size:1.34rem; color:var(--malva-800); line-height:1; letter-spacing:.02em; }
.brand .wordmark small { display:block; font-weight:500; font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; color:var(--text-muted); margin-top:3px; }
.header-cta { display:none; }

/* ---------------- Hero ---------------- */
.hero { padding:44px 0 56px; background:linear-gradient(180deg,var(--malva-50) 0%,#fff 72%); }
.hero-grid { display:grid; grid-template-columns:1fr; gap:32px; align-items:center; }
.hero-copy .eyebrow { margin-bottom:20px; }
.hero-copy h1 { margin-bottom:18px; }
.hero-copy h1 .accent { color:var(--malva); }
.hero-copy .lead { margin-bottom:24px; }
.hero-copy .lead strong { color:var(--text); font-weight:600; }
.hero-badges { display:flex; flex-wrap:wrap; gap:9px; margin-bottom:26px; }
.badge-pill {
  display:inline-flex; align-items:center; gap:7px; background:#fff; border:1px solid var(--border);
  border-radius:var(--r-pill); padding:8px 15px; font-size:.85rem; font-weight:500; color:var(--text);
  box-shadow:var(--shadow-sm);
}
.badge-pill b { color:var(--malva-700); font-weight:700; }
.hero-note { margin-top:14px; font-size:.82rem; color:var(--text-muted); }
.hero-photo { position:relative; }
.hero-photo img { width:100%; height:auto; border-radius:var(--r-xl); box-shadow:var(--shadow-lg); object-fit:cover; aspect-ratio:4/3.1; object-position:60% center; }
.hero-float {
  position:absolute; left:16px; bottom:16px; background:rgba(255,255,255,.95); backdrop-filter:blur(6px);
  border-radius:var(--r-md); padding:11px 16px; box-shadow:var(--shadow-md); display:flex; align-items:center; gap:10px;
}
.hero-float .dot { width:9px; height:9px; border-radius:50%; background:var(--success); flex-shrink:0; box-shadow:0 0 0 4px rgba(47,158,114,.16); }
.hero-float span { font-size:.82rem; font-weight:600; color:var(--text); }

/* ---------------- Sections ---------------- */
section.block { padding:var(--sp-9) 0; }
@media (max-width:768px){ section.block { padding:60px 0; } }
.block.alt { background:var(--surface); }
.block.tint { background:var(--malva-50); }
.sec-head { margin-bottom:44px; }

/* §2 Enemy */
.enemy-grid { display:grid; grid-template-columns:1fr; gap:32px; align-items:center; }
.enemy-copy p { color:var(--text-muted); margin-bottom:16px; max-width:var(--measure); }
.enemy-copy p strong { color:var(--text); font-weight:600; }
.enemy-copy h2 { margin-bottom:22px; }
.enemy-photo img { width:100%; height:auto; border-radius:var(--r-xl); box-shadow:var(--shadow-md); object-fit:cover; aspect-ratio:4/4.4; object-position:center 30%; }
.enemy-copy .btn { margin-top:8px; }

/* §3 Future pacing */
.future-grid { display:grid; grid-template-columns:1fr; gap:36px; align-items:center; }
.future-photo img { width:100%; height:auto; border-radius:var(--r-xl); box-shadow:var(--shadow-lg); object-fit:cover; aspect-ratio:4/3.4; object-position:62% center; }
.future-copy h2 { margin-bottom:18px; }
.future-copy .intro { color:var(--text-muted); margin-bottom:22px; max-width:var(--measure); }
.benefit-list { list-style:none; display:grid; gap:13px; margin-bottom:22px; }
.benefit-list li { display:flex; gap:13px; align-items:flex-start; font-size:.99rem; }
.benefit-list .tick { flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--malva-50); display:grid; place-items:center; margin-top:1px; }
.benefit-list .tick svg { width:14px; height:14px; }
.benefit-list b { color:var(--text); font-weight:600; }
.ist-warning { display:flex; gap:12px; align-items:flex-start; background:var(--warning-bg); border:1px solid var(--warning-border); border-radius:var(--r-md); padding:15px 18px; max-width:var(--measure); }
.ist-warning .ic { flex-shrink:0; width:24px; height:24px; border-radius:50%; border:2px solid #C9963F; color:#C9963F; font-family:var(--font); font-weight:700; font-size:.9rem; display:grid; place-items:center; margin-top:1px; }
.ist-warning p { font-size:.9rem; color:var(--warning-text); }
.ist-warning b { color:#6B4A12; }

/* §4 Mechanism + numbers */
.mech-grid { display:grid; grid-template-columns:1fr; gap:36px; align-items:center; margin-bottom:var(--sp-8); }
.mech-photo img { width:100%; height:auto; border-radius:var(--r-xl); box-shadow:var(--shadow-md); object-fit:cover; aspect-ratio:4/3; }
.mech-copy h2 { margin-bottom:18px; }
.mech-copy p { color:var(--text-muted); margin-bottom:14px; max-width:var(--measure); }
.mech-copy p strong { color:var(--text); font-weight:600; }
.mech-copy .contrast { background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--dourado); border-radius:var(--r-md); padding:16px 20px; font-size:1.02rem; color:var(--text); margin-top:8px; box-shadow:var(--shadow-sm); }
.stats-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.stat-card { background:var(--malva-50); border:1px solid var(--malva-100); border-radius:var(--r-md); padding:26px 20px; text-align:center; position:relative; overflow:hidden; }
.stat-card::before { content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:42px; height:3px; border-radius:0 0 2px 2px; background:var(--dourado); }
.stat-card .num { font-family:var(--font); font-weight:700; font-size:clamp(1.7rem,4.4vw,2.3rem); color:var(--malva-800); line-height:1.05; margin-bottom:7px; }
.stat-card .lbl { font-size:.86rem; color:var(--text-muted); line-height:1.4; }

/* §5 Proof: procedure */
.proc-wrap { display:grid; grid-template-columns:1fr; gap:40px; align-items:start; margin-bottom:var(--sp-8); }
.steps { display:grid; gap:0; }
.step { display:flex; gap:18px; position:relative; padding-bottom:28px; }
.step:last-child { padding-bottom:0; }
.step::before { content:""; position:absolute; left:19px; top:46px; bottom:2px; width:2px; background:var(--malva-100); }
.step:last-child::before { display:none; }
.step-num { flex-shrink:0; width:40px; height:40px; border-radius:50%; background:var(--malva); color:#fff; font-family:var(--font); font-weight:600; font-size:1.05rem; display:grid; place-items:center; box-shadow:0 4px 12px rgba(149,119,153,.3); }
.step-body h3 { font-size:1.08rem; color:var(--text); margin-bottom:5px; }
.step-body p { font-size:.95rem; color:var(--text-muted); max-width:46ch; }
.proc-photos { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.proc-photos img { width:100%; height:100%; object-fit:cover; border-radius:var(--r-md); box-shadow:var(--shadow-sm); aspect-ratio:1/1; }

/* §5 Testimonials */
.tst-head { margin-bottom:36px; }
.testimonials { display:grid; grid-template-columns:1fr; gap:18px; margin-bottom:var(--sp-8); }
.tst { background:#fff; border:1px solid var(--border); border-radius:var(--r-md); padding:28px 26px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; }
.tst .qmark { font-family:var(--font); font-size:2.5rem; font-weight:700; color:var(--dourado); line-height:.55; margin-bottom:14px; }
.tst .stars { color:var(--dourado-600); font-size:.85rem; letter-spacing:2px; margin-bottom:10px; }
.tst p { font-size:.95rem; color:var(--text); flex-grow:1; margin-bottom:16px; }
.tst cite { font-style:normal; font-weight:600; font-size:.9rem; color:var(--malva-800); }
.tst.pending { background:var(--surface); border-style:dashed; align-items:flex-start; justify-content:center; }
.tst.pending .ph { font-family:'Courier New',monospace; font-size:.8rem; color:var(--text-muted); line-height:1.6; }

/* §5 Authority */
.authority { display:grid; grid-template-columns:1fr; gap:28px; align-items:center; background:#fff; border:1px solid var(--border); border-radius:var(--r-xl); padding:24px; box-shadow:var(--shadow-md); }
.authority-photo img { width:100%; height:100%; object-fit:cover; border-radius:var(--r-md); aspect-ratio:4/3; object-position:center 25%; }
.authority-copy h3 { font-size:1.3rem; color:var(--malva-800); margin-bottom:12px; }
.authority-copy p { color:var(--text-muted); margin-bottom:18px; max-width:52ch; }
.crm-badge { display:inline-flex; align-items:center; gap:10px; background:var(--malva); color:#fff; border-radius:var(--r-pill); padding:9px 18px; font-size:.88rem; font-weight:500; }
.crm-badge .dot { width:7px; height:7px; border-radius:50%; background:var(--dourado); }

/* §6 Offer */
.offer-card { display:grid; grid-template-columns:1fr; gap:0; background:#fff; border:1px solid var(--border); border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); }
.offer-photo { min-height:240px; }
.offer-photo img { width:100%; height:100%; object-fit:cover; object-position:62% center; }
.offer-body { padding:36px 30px; }
.offer-body h2 { margin-bottom:20px; max-width:24ch; }
.offer-incl { list-style:none; display:grid; gap:16px; margin-bottom:26px; }
.offer-incl li { display:flex; gap:13px; align-items:flex-start; font-size:.97rem; color:var(--text-muted); }
.offer-incl li strong { color:var(--text); font-weight:600; }
.offer-incl .ic { flex-shrink:0; width:28px; height:28px; border-radius:8px; background:var(--malva-50); display:grid; place-items:center; margin-top:1px; }
.offer-incl .ic svg { width:15px; height:15px; }
.offer-incl .reverse-risk { background:var(--dourado-50); border:1px solid var(--dourado-100); border-radius:var(--r-md); padding:14px 16px; color:var(--text); }
.offer-incl .reverse-risk .ic { background:var(--dourado-100); }
.convs { margin-top:4px; }
.convs .clbl { font-size:.74rem; font-weight:600; text-transform:uppercase; letter-spacing:.07em; color:var(--text-muted); margin-bottom:10px; }
.conv-pills { display:flex; flex-wrap:wrap; gap:7px; }
.conv-pills span { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-pill); padding:6px 13px; font-size:.8rem; font-weight:500; color:var(--text); }
.conv-wall { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.conv-tile { background:#fff; border:1px solid var(--border); border-radius:12px; height:58px; display:grid; place-items:center; padding:8px 14px; box-shadow:var(--shadow-sm); }
.conv-tile img { max-height:34px; max-width:100%; width:auto; object-fit:contain; }
.conv-tile.text { font-size:.82rem; font-weight:600; color:var(--malva-700); text-align:center; line-height:1.2; }
.conv-tile.more { background:var(--dourado-50); border-color:var(--dourado-100); color:var(--malva-800); }
.conv-note { font-size:.8rem; color:var(--text-muted); margin-top:12px; line-height:1.5; }
@media (min-width:480px){ .conv-wall { grid-template-columns:repeat(3,1fr); } }

/* §7 FAQ */
.faq-list { max-width:760px; margin:0 auto; display:grid; gap:12px; }
.faq-list details { background:#fff; border:1px solid var(--border); border-radius:var(--r-md); box-shadow:var(--shadow-sm); overflow:hidden; }
.faq-list summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:19px 22px; font-family:var(--font); font-weight:600; font-size:1rem; color:var(--text); }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary .tg { flex-shrink:0; width:28px; height:28px; border-radius:50%; background:var(--malva-50); color:var(--malva-700); display:grid; place-items:center; font-weight:600; font-size:1.15rem; transition:transform var(--dur-fast); }
.faq-list details[open] summary .tg { transform:rotate(45deg); }
.faq-list .ans { padding:0 22px 20px; font-size:.95rem; color:var(--text-muted); }

/* §8 Reversal + CTA final */
.final { background:linear-gradient(135deg,var(--malva-800) 0%,var(--malva) 100%); text-align:center; padding:84px 0; color:#fff; }
.final h2 { color:#fff; max-width:24ch; margin:0 auto 16px; }
.final p { color:rgba(255,255,255,.9); max-width:54ch; margin:0 auto 30px; }
.final .micro { margin-top:16px; font-size:.85rem; color:rgba(255,255,255,.8); }
.final .micro a { color:var(--dourado); text-decoration:underline; }

/* §9 Location */
.loc-grid { display:grid; grid-template-columns:1fr; gap:18px; margin-bottom:22px; }
.loc-card { background:#fff; border:1px solid var(--border); border-radius:var(--r-md); padding:26px; box-shadow:var(--shadow-sm); }
.loc-card h3 { font-size:1.15rem; color:var(--malva-800); margin-bottom:10px; }
.loc-card address { font-style:normal; font-size:.95rem; color:var(--text-muted); margin-bottom:14px; }
.loc-card .maplink { font-size:.9rem; font-weight:600; color:var(--malva-700); text-decoration:none; }
.loc-card .maplink:hover { text-decoration:underline; }
.loc-map { width:100%; height:200px; border:0; border-radius:var(--r-md); box-shadow:var(--shadow-sm); display:block; margin:0 0 16px; }
.loc-card .btn { width:100%; }
.hours { display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:center; font-size:.95rem; color:var(--text); margin-bottom:26px; }
.hours strong { color:var(--malva-800); }
.hours .hours-wa { color:var(--malva-700); font-weight:600; text-decoration:none; }
.hours .hours-wa:hover { text-decoration:underline; }
.map { width:100%; height:300px; border:0; border-radius:var(--r-xl); box-shadow:var(--shadow-sm); }

/* ---------------- Footer ---------------- */
.site-footer { background:var(--malva-800); color:rgba(255,255,255,.82); padding:46px 0 120px; font-size:.84rem; }
.site-footer .fbrand { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.site-footer .fbrand img { height:48px; width:auto; }
.footer-grid { display:grid; gap:24px; margin-bottom:26px; }
.site-footer h4 { font-family:var(--font); font-size:.92rem; font-weight:600; color:#fff; margin-bottom:8px; }
.site-footer p { margin-bottom:4px; line-height:1.6; }
.site-footer .flink a { display:inline-flex; align-items:center; gap:7px; color:rgba(255,255,255,.85); text-decoration:none; font-weight:500; }
.site-footer .flink a:hover { color:#fff; text-decoration:underline; }
.site-footer .flink svg { width:16px; height:16px; flex-shrink:0; }
.site-footer .legal { border-top:1px solid rgba(255,255,255,.2); padding-top:22px; line-height:1.7; color:rgba(255,255,255,.66); font-size:.8rem; }

/* ---------------- Sticky WhatsApp (mobile) ---------------- */
.sticky-wa {
  position:fixed; left:0; right:0; bottom:0; z-index:100;
  padding:11px 16px calc(11px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.96); backdrop-filter:blur(8px);
  border-top:1px solid var(--border); box-shadow:0 -4px 20px rgba(50,55,60,.1);
  transform:translateY(120%); transition:transform var(--dur-mid) var(--ease-out);
}
.sticky-wa.show { transform:translateY(0); }
.sticky-wa .btn { width:100%; padding:14px 24px; font-size:.96rem; }

/* ---------------- Reveal animation ---------------- */
.reveal { opacity:0; transform:translateY(22px); transition:opacity var(--dur-mid) var(--ease-out), transform var(--dur-mid) var(--ease-out); }
.reveal.in { opacity:1; transform:none; }

/* ---------------- Micro-interactions ---------------- */
@media (prefers-reduced-motion: no-preference) {

  /* Hero entrance cascade (on load) */
  @keyframes riseIn { from { opacity:0; transform:translateY(24px); } }
  @keyframes photoIn { from { opacity:0; transform:scale(.97) translateY(16px); } }
  .hero-copy .eyebrow { animation:riseIn .6s var(--ease-out) .05s backwards; }
  .hero-copy h1 { animation:riseIn .7s var(--ease-out) .15s backwards; }
  .hero-copy .lead { animation:riseIn .7s var(--ease-out) .28s backwards; }
  .hero-badges { animation:riseIn .7s var(--ease-out) .4s backwards; }
  .hero-copy .btn { animation:riseIn .7s var(--ease-out) .52s backwards; }
  .hero-note { animation:riseIn .7s var(--ease-out) .62s backwards; }
  .hero-photo { animation:photoIn .9s var(--ease-out) .3s backwards; }
  .hero-float { animation:riseIn .7s var(--ease-out) .95s backwards; }

  /* Gold rule grows when its section reveals */
  .reveal .gold-rule { width:0; transition:width .7s var(--ease-out) .2s; }
  .reveal.in .gold-rule { width:54px; }

  /* Staggered grids: siblings that reveal together cascade */
  .stats-grid .reveal:nth-child(2) { transition-delay:.1s; }
  .stats-grid .reveal:nth-child(3) { transition-delay:.2s; }
  .stats-grid .reveal:nth-child(4) { transition-delay:.3s; }
  .testimonials .reveal:nth-child(2) { transition-delay:.12s; }
  .testimonials .reveal:nth-child(3) { transition-delay:.24s; }
  .loc-grid .reveal:nth-child(2) { transition-delay:.12s; }

  /* Benefit list items cascade inside their revealed parent */
  .reveal .benefit-list li { opacity:0; transform:translateY(14px); transition:opacity .55s var(--ease-out), transform .55s var(--ease-out); }
  .reveal.in .benefit-list li { opacity:1; transform:none; }
  .reveal.in .benefit-list li:nth-child(1) { transition-delay:.12s; }
  .reveal.in .benefit-list li:nth-child(2) { transition-delay:.22s; }
  .reveal.in .benefit-list li:nth-child(3) { transition-delay:.32s; }
  .reveal.in .benefit-list li:nth-child(4) { transition-delay:.42s; }
  .reveal.in .benefit-list li:nth-child(5) { transition-delay:.52s; }

  /* Offer checklist cascade */
  .reveal .offer-incl li { opacity:0; transform:translateY(14px); transition:opacity .55s var(--ease-out), transform .55s var(--ease-out); }
  .reveal.in .offer-incl li { opacity:1; transform:none; }
  .reveal.in .offer-incl li:nth-child(1) { transition-delay:.15s; }
  .reveal.in .offer-incl li:nth-child(2) { transition-delay:.27s; }
  .reveal.in .offer-incl li:nth-child(3) { transition-delay:.39s; }

  /* Convênio tiles pop in */
  .reveal .conv-tile { opacity:0; transform:translateY(10px) scale(.97); transition:opacity .5s var(--ease-out), transform .5s var(--ease-out); }
  .reveal.in .conv-tile { opacity:1; transform:none; }
  .reveal.in .conv-tile:nth-child(1) { transition-delay:.3s; }
  .reveal.in .conv-tile:nth-child(2) { transition-delay:.36s; }
  .reveal.in .conv-tile:nth-child(3) { transition-delay:.42s; }
  .reveal.in .conv-tile:nth-child(4) { transition-delay:.48s; }
  .reveal.in .conv-tile:nth-child(5) { transition-delay:.54s; }
  .reveal.in .conv-tile:nth-child(6) { transition-delay:.6s; }
  .reveal.in .conv-tile:nth-child(7) { transition-delay:.66s; }
  .reveal.in .conv-tile:nth-child(8) { transition-delay:.72s; }
  .reveal.in .conv-tile:nth-child(9) { transition-delay:.78s; }

  /* Procedure: steps slide in from the left, photos scale in */
  .steps.reveal .step { opacity:0; transform:translateX(-16px); transition:opacity .55s var(--ease-out), transform .55s var(--ease-out); }
  .steps.reveal.in .step { opacity:1; transform:none; }
  .steps.reveal.in .step:nth-child(1) { transition-delay:.1s; }
  .steps.reveal.in .step:nth-child(2) { transition-delay:.24s; }
  .steps.reveal.in .step:nth-child(3) { transition-delay:.38s; }
  .steps.reveal.in .step:nth-child(4) { transition-delay:.52s; }
  .proc-photos.reveal img { opacity:0; transform:scale(.95); transition:opacity .6s var(--ease-out), transform .6s var(--ease-out); }
  .proc-photos.reveal.in img { opacity:1; transform:scale(1); }
  .proc-photos.reveal.in img:nth-child(2) { transition-delay:.12s; }
  .proc-photos.reveal.in img:nth-child(3) { transition-delay:.24s; }
  .proc-photos.reveal.in img:nth-child(4) { transition-delay:.36s; }

  /* Hover lifts */
  @media (hover:hover) {
    .stat-card, .tst, .loc-card, .conv-tile, .id-card, .authority { transition:transform .25s var(--ease-out), box-shadow .25s var(--ease-out); }
    .stat-card:hover, .tst:hover, .loc-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
    .conv-tile:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
    .hero-photo img, .enemy-photo img, .future-photo img, .mech-photo img, .proc-photos img, .authority-photo img, .offer-photo img { transition:transform .6s var(--ease-out); }
    .hero-photo:hover img, .enemy-photo:hover img, .future-photo:hover img, .mech-photo:hover img, .authority-photo:hover img, .offer-photo:hover img { transform:scale(1.02); }
    .proc-photos img:hover { transform:scale(1.03); }
    .step:hover .step-num { transform:scale(1.08); }
    .step-num { transition:transform .25s var(--ease-out); }
  }
}

/* Smooth FAQ expansion (progressive enhancement) */
@supports (interpolate-size: allow-keywords) {
  @media (prefers-reduced-motion: no-preference) {
    :root { interpolate-size: allow-keywords; }
    .faq-list details::details-content { block-size:0; overflow:hidden; transition:block-size .35s var(--ease-out), content-visibility .35s allow-discrete; }
    .faq-list details[open]::details-content { block-size:auto; }
  }
}

/* ---------------- Desktop ---------------- */
@media (min-width:880px) {
  .header-cta { display:inline-flex; }
  .hero { padding:64px 0 80px; }
  .hero-grid { grid-template-columns:1.02fr .98fr; gap:52px; }
  .enemy-grid { grid-template-columns:.62fr 1fr; gap:52px; }
  .future-grid { grid-template-columns:1fr 1fr; gap:60px; }
  .future-grid .future-photo { order:2; }
  .future-grid .future-copy { order:1; }
  .mech-grid { grid-template-columns:1fr 1fr; gap:60px; }
  .stats-grid { grid-template-columns:repeat(4,1fr); }
  .proc-wrap { grid-template-columns:1fr 1fr; gap:60px; }
  .testimonials { grid-template-columns:repeat(3,1fr); }
  .authority { grid-template-columns:.85fr 1.15fr; gap:36px; padding:28px; }
  .offer-card { grid-template-columns:.82fr 1.18fr; }
  .offer-body { padding:48px 44px; }
  .loc-grid { grid-template-columns:1fr 1fr; }
  .footer-grid { grid-template-columns:1.2fr 1fr 1fr; }
  .site-footer { padding-bottom:46px; }
  .sticky-wa { display:none; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .reveal, .reveal .benefit-list li, .reveal .offer-incl li, .reveal .conv-tile, .steps.reveal .step, .proc-photos.reveal img { opacity:1; transform:none; transition:none; }
  .btn, .sticky-wa { transition:none; }
}