/* Praia.Online — native, dependency-free experience */
:root {
  --bg: #07111f;
  --bg-soft: #0b1829;
  --surface: rgba(14, 30, 50, 0.74);
  --surface-solid: #102238;
  --surface-raised: #142943;
  --text: #f7f3e9;
  --muted: #aab7c8;
  --line: rgba(255, 255, 255, 0.13);
  --line-strong: rgba(255, 255, 255, 0.24);
  --blue: #2f7dff;
  --blue-bright: #70a7ff;
  --coral: #ff6942;
  --coral-soft: #ff9b7f;
  --sand: #f4ead7;
  --ink: #06101c;
  --green: #41d987;
  --shadow: 0 28px 80px rgba(0, 0, 0, 0.3);
  --header-h: 80px;
  --container: min(1180px, calc(100vw - 40px));
  --radius: 28px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --reveal-x: 50vw;
  --reveal-y: 40px;
  --reveal-radius: 150vmax;
}

html[data-theme="light"] {
  --bg: #f7f2e8;
  --bg-soft: #eee6d7;
  --surface: rgba(255, 252, 245, 0.76);
  --surface-solid: #fffdf7;
  --surface-raised: #ffffff;
  --text: #071321;
  --muted: #586474;
  --line: rgba(7, 19, 33, 0.13);
  --line-strong: rgba(7, 19, 33, 0.23);
  --blue: #145fe7;
  --blue-bright: #2f7dff;
  --coral: #f3522f;
  --coral-soft: #ff7656;
  --sand: #fffaf0;
  --ink: #071321;
  --shadow: 0 28px 70px rgba(44, 35, 25, 0.13);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 18px);
  background: var(--bg);
}

body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--text);
  font-family: "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  transition: background-color 0.35s ease, color 0.35s ease;
}

body.menu-open {
  overflow: hidden;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button,
input {
  font: inherit;
}

button {
  color: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

p,
h1,
h2,
h3,
blockquote {
  margin-top: 0;
}

::selection {
  background: var(--coral);
  color: white;
}

.container {
  width: var(--container);
  margin-inline: auto;
}

.section-pad {
  padding: clamp(92px, 12vw, 164px) 0;
  content-visibility: auto;
  contain-intrinsic-size: 900px;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 9999;
  transform: translateY(-150%);
  padding: 11px 16px;
  border-radius: 10px;
  background: var(--text);
  color: var(--bg);
  font-weight: 700;
  transition: transform 0.2s ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000;
  height: 2px;
  pointer-events: none;
}

.scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, var(--blue), var(--coral));
  transform: scaleX(0);
  transform-origin: left;
  will-change: transform;
}

.cursor-glow {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0.12;
  background: radial-gradient(circle, var(--blue) 0, transparent 64%);
  transform: translate3d(-50%, -50%, 0);
  mix-blend-mode: screen;
  will-change: transform;
}

html[data-theme="light"] .cursor-glow {
  opacity: 0.08;
  mix-blend-mode: multiply;
}

/* Radial theme change starts exactly at the toggle. */
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-new(root) {
  z-index: 9999;
  clip-path: circle(0 at var(--reveal-x) var(--reveal-y));
  animation: theme-reveal 0.82s var(--ease-out) forwards;
}

@keyframes theme-reveal {
  to { clip-path: circle(var(--reveal-radius) at var(--reveal-x) var(--reveal-y)); }
}

.theme-wash {
  position: fixed;
  z-index: 9998;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  pointer-events: none;
  background: var(--next-theme-color);
  transform: translate(-50%, -50%) scale(0);
  animation: fallback-theme-reveal 0.72s var(--ease-out) forwards;
}

@keyframes fallback-theme-reveal {
  50% { transform: translate(-50%, -50%) scale(var(--wash-scale)); }
  100% { transform: translate(-50%, -50%) scale(var(--wash-scale)); opacity: 0; }
}

/* Header */
.site-header {
  position: fixed;
  top: 12px;
  left: 50%;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(1240px, calc(100vw - 24px));
  height: 64px;
  padding: 8px 10px 8px 18px;
  border: 1px solid transparent;
  border-radius: 19px;
  transform: translateX(-50%);
  transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.site-header.is-scrolled,
.site-header.menu-active {
  border-color: var(--line);
  background: color-mix(in srgb, var(--bg) 78%, transparent);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
}

.brand {
  position: relative;
  z-index: 2;
  display: block;
  width: 178px;
  flex: 0 0 auto;
}

.brand-logo,
.brand-logo img {
  display: block;
  width: 100%;
  height: auto;
}

.footer-brand { width: 210px; }

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 31px;
  margin-left: auto;
  margin-right: 28px;
}

.desktop-nav a {
  position: relative;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.01em;
  transition: color 0.2s ease;
}

.desktop-nav a::after {
  position: absolute;
  right: 0;
  bottom: -6px;
  left: 0;
  height: 1px;
  background: var(--coral);
  content: "";
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.35s var(--ease-out);
}

.desktop-nav a:hover,
.desktop-nav a:focus-visible { color: var(--text); }
.desktop-nav a:hover::after,
.desktop-nav a:focus-visible::after { transform: scaleX(1); transform-origin: left; }

.header-actions {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 8px;
}

.theme-toggle,
.menu-toggle {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface-solid) 65%, transparent);
  cursor: pointer;
  transition: transform 0.25s var(--ease-spring), background 0.2s ease;
}

.theme-toggle:hover { transform: rotate(8deg) scale(1.04); }
.theme-toggle:focus-visible,
.menu-toggle:focus-visible,
.button:focus-visible,
.choice:focus-visible,
.faq-item button:focus-visible,
.specialist:focus-visible,
.whatsapp-dock button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--blue) 52%, transparent);
  outline-offset: 3px;
}

.theme-icon {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  transition: transform 0.6s var(--ease-spring);
}

.theme-icon::before {
  color: var(--text);
  content: "☀";
  font-family: Georgia, serif;
  font-size: 20px;
  line-height: 1;
}

html[data-theme="dark"] .theme-icon { transform: rotate(18deg); }
html[data-theme="light"] .theme-icon { transform: rotate(-15deg); }
html[data-theme="light"] .theme-icon::before { content: "☾"; font-size: 22px; }

.menu-toggle { display: none; }
.menu-toggle span { width: 18px; height: 1.5px; background: var(--text); transition: transform 0.3s ease; }
.menu-toggle span + span { margin-top: -9px; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }

.mobile-menu { display: none; }

/* Shared buttons and labels */
.button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 0 24px;
  overflow: hidden;
  border: 0;
  border-radius: 15px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.02em;
  transition: transform 0.3s var(--ease-spring), box-shadow 0.3s ease, background 0.3s ease;
}

.button span { margin-left: 22px; font-size: 17px; transition: transform 0.25s ease; }
.button:hover { transform: translateY(-3px); }
.button:hover span { transform: translate(3px, -3px); }

.button-primary {
  background: var(--coral);
  color: white;
  box-shadow: 0 14px 36px color-mix(in srgb, var(--coral) 30%, transparent);
}

.button-primary::before {
  position: absolute;
  inset: 0;
  background: linear-gradient(115deg, transparent 20%, rgba(255,255,255,0.25) 45%, transparent 70%);
  content: "";
  transform: translateX(-130%);
  transition: transform 0.7s ease;
}

.button-primary:hover::before { transform: translateX(130%); }
.button-small { min-height: 44px; padding-inline: 17px; border-radius: 13px; font-size: 12px; }
.button-small span { margin-left: 13px; }
.button-light { background: var(--sand); color: var(--ink); }

.section-kicker,
.eyebrow,
.card-index,
.screen-label,
.search-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--blue-bright);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.section-kicker::before {
  width: 24px;
  height: 1px;
  background: currentColor;
  content: "";
}

.section-head,
.split-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
  align-items: end;
  gap: 70px;
}

.section-head h2,
.split-heading h2,
.method h2,
.results h2,
.diagnosis h2,
.faq h2 {
  margin: 18px 0 0;
  font-size: clamp(46px, 6.4vw, 88px);
  line-height: 0.98;
  letter-spacing: -0.068em;
}

.section-head h2,
.method h2,
.results h2 { font-size: clamp(46px, 5.5vw, 76px); }
.section-lead { max-width: 530px; color: var(--muted); font-size: clamp(16px, 1.5vw, 19px); line-height: 1.68; }

/* Hero */
.hero {
  position: relative;
  display: flex;
  min-height: 100svh;
  overflow: hidden;
  padding: 138px 0 94px;
  background:
    radial-gradient(circle at 72% 44%, color-mix(in srgb, var(--blue) 18%, transparent), transparent 32%),
    radial-gradient(circle at 25% 10%, color-mix(in srgb, var(--coral) 8%, transparent), transparent 28%),
    var(--bg);
}

.hero::before {
  position: absolute;
  inset: auto -10% -30% 20%;
  height: 50%;
  border-radius: 50%;
  background: var(--blue);
  content: "";
  opacity: 0.08;
  filter: blur(120px);
}

.hero-canvas,
.final-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.hero-noise {
  position: absolute;
  inset: 0;
  opacity: 0.055;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.hero-grid {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(430px, 0.98fr);
  align-items: center;
  gap: clamp(30px, 5vw, 80px);
}

.hero-copy { max-width: 670px; }
.eyebrow { color: var(--muted); }
.live-dot {
  position: relative;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--green) 15%, transparent);
}

.live-dot::after {
  position: absolute;
  inset: -5px;
  border: 1px solid var(--green);
  border-radius: 50%;
  content: "";
  animation: live-ping 1.8s ease-out infinite;
}

@keyframes live-ping { to { transform: scale(2.2); opacity: 0; } }

.hero h1 {
  max-width: 720px;
  margin: 24px 0 26px;
  font-size: clamp(58px, 6.8vw, 104px);
  font-weight: 750;
  line-height: 0.83;
  letter-spacing: -0.082em;
}

.hero h1 .hero-line {
  display: block;
  padding-right: 0.08em;
  white-space: nowrap;
}

.hero h1 .hero-line-accent {
  background: linear-gradient(93deg, var(--blue-bright), var(--coral-soft) 92%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-style: italic;
  font-weight: 500;
}

.hero h1 .hero-line-plain {
  color: var(--text);
}

.hero-lead {
  max-width: 610px;
  margin-bottom: 31px;
  color: var(--muted);
  font-size: clamp(17px, 1.55vw, 21px);
  line-height: 1.65;
}

.hero-actions { display: flex; align-items: center; gap: 28px; }
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-size: 13px;
  font-weight: 750;
}
.text-link span { color: var(--coral); transition: transform 0.3s var(--ease-spring); }
.text-link:hover span { transform: translateY(4px); }

.hero-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 11px 22px;
  margin: 33px 0 0;
  padding: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  list-style: none;
}
.hero-trust span { margin-right: 5px; color: var(--green); }

.hero-visual {
  position: relative;
  min-height: 590px;
  perspective: 1200px;
  transform-style: preserve-3d;
}

.hero-visual::before {
  position: absolute;
  inset: 8% 3%;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--blue) 12%, transparent), transparent 62%);
  box-shadow: inset 0 0 80px color-mix(in srgb, var(--blue) 8%, transparent);
  content: "";
  transform: rotateX(65deg) rotateZ(-12deg) scale(1.05);
}

.orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid var(--line);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotateX(66deg) rotateZ(14deg);
}
.orbit::after { position: absolute; top: -4px; left: 50%; width: 8px; height: 8px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 26px var(--coral); content: ""; }
.orbit-one { width: 480px; height: 480px; animation: orbit-spin 14s linear infinite; }
.orbit-two { width: 350px; height: 350px; animation: orbit-spin-reverse 11s linear infinite; }
.orbit-two::after { background: var(--blue-bright); box-shadow: 0 0 26px var(--blue); }
@keyframes orbit-spin { to { transform: translate(-50%, -50%) rotateX(66deg) rotateZ(374deg); } }
@keyframes orbit-spin-reverse { to { transform: translate(-50%, -50%) rotateX(66deg) rotateZ(-346deg); } }

.signal-core { position: absolute; top: 46%; left: 52%; width: 130px; height: 130px; transform: translate(-50%, -50%); }
.signal-ring,
.signal-ring::before,
.signal-ring::after { position: absolute; inset: 0; border: 1px solid var(--blue-bright); border-radius: 50%; content: ""; animation: signal-wave 2.8s ease-out infinite; }
.signal-ring::before { animation-delay: 0.9s; }
.signal-ring::after { animation-delay: 1.8s; }
@keyframes signal-wave { from { transform: scale(0.25); opacity: 0.8; } to { transform: scale(2.2); opacity: 0; } }

.signal-pin {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  border: 8px solid color-mix(in srgb, var(--coral) 18%, transparent);
  border-radius: 50% 50% 50% 10px;
  background: var(--coral);
  box-shadow: 0 24px 60px color-mix(in srgb, var(--coral) 42%, transparent);
  transform: translate(-50%, -58%) rotate(-45deg);
}
.signal-pin i { width: 16px; height: 16px; border-radius: 50%; background: white; transform: rotate(45deg); }

.glass-card {
  position: absolute;
  z-index: 3;
  border: 1px solid var(--line-strong);
  background: color-mix(in srgb, var(--surface-solid) 74%, transparent);
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  will-change: transform;
}

.search-card { top: 9%; left: -2%; width: 310px; padding: 19px; border-radius: 19px; transform: rotate(-3deg); }
.search-label { color: var(--muted); font-size: 9px; }
.search-card > p { margin: 9px 0 13px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); font-size: 13px; }
.search-line { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; font-size: 11px; font-weight: 750; }
.search-line i { width: 22px; height: 22px; border-radius: 7px; background: linear-gradient(135deg, var(--blue), var(--coral)); }
.search-line b { padding: 4px 6px; border-radius: 5px; background: color-mix(in srgb, var(--green) 14%, transparent); color: var(--green); font-size: 7px; letter-spacing: 0.08em; }

.message-card { right: -2%; bottom: 20%; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; width: 330px; padding: 16px; border-radius: 18px; transform: rotate(3deg); }
.avatar { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 12px; background: var(--coral); color: white; font-size: 13px; font-weight: 800; }
.message-card b { display: block; font-size: 11px; }
.message-card p { margin: 2px 0 0; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.message-time { color: var(--green); font-size: 8px; }

.metric-card { bottom: 4%; left: 8%; width: 180px; padding: 17px; border-radius: 18px; transform: rotate(-4deg); }
.metric-card > span { color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: 0.14em; }
.metric-card strong { display: block; margin: 4px 0 11px; font-size: 32px; letter-spacing: -0.05em; }
.mini-chart { display: flex; align-items: end; gap: 4px; height: 28px; }
.mini-chart i { flex: 1; height: 24%; border-radius: 3px; background: var(--blue); animation: chart-rise 2.4s ease-in-out infinite alternate; transform-origin: bottom; }
.mini-chart i:nth-child(2) { height: 38%; animation-delay: 0.2s; }
.mini-chart i:nth-child(3) { height: 54%; animation-delay: 0.4s; }
.mini-chart i:nth-child(4) { height: 72%; animation-delay: 0.6s; }
.mini-chart i:nth-child(5) { height: 100%; background: var(--coral); animation-delay: 0.8s; }
@keyframes chart-rise { to { transform: scaleY(0.72); opacity: 0.7; } }

.drag-hint { position: absolute; right: 20px; bottom: 2px; display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; transform: rotate(-90deg); transform-origin: right bottom; }
.drag-hint i { color: var(--coral); font-size: 15px; animation: hint-bounce 1.4s ease-in-out infinite; }
@keyframes hint-bounce { 50% { transform: translateY(5px); } }

.hero-marquee {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 4;
  overflow: hidden;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 75%, transparent);
}
.hero-marquee > div { display: flex; width: max-content; align-items: center; gap: 28px; padding: 13px 0; animation: marquee 28s linear infinite; }
.hero-marquee span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: 0.15em; text-transform: uppercase; }
.hero-marquee i { color: var(--coral); font-style: normal; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* Proof and problem */
.proof-bar { position: relative; z-index: 3; border-bottom: 1px solid var(--line); background: var(--bg); }
.proof-grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); }
.proof-grid > div { display: flex; min-height: 138px; flex-direction: column; justify-content: center; padding: 27px 36px; border-left: 1px solid var(--line); }
.proof-grid > div:last-child { border-right: 1px solid var(--line); }
.proof-main { flex-direction: row !important; align-items: center; gap: 20px; }
.proof-grid strong { font-size: 24px; letter-spacing: -0.05em; }
.proof-main strong { color: var(--coral); font-size: 58px; line-height: 1; }
.proof-grid span { max-width: 170px; color: var(--muted); font-size: 11px; line-height: 1.45; }

.problem { background: var(--sand); color: var(--ink); }
.problem .section-kicker { color: #145fe7; }
.split-heading { align-items: center; }
.split-heading h2 em { color: var(--coral); font-weight: 500; }
.problem-copy { padding-top: 38px; }
.problem-copy p { color: #586474; font-size: clamp(17px, 1.7vw, 21px); line-height: 1.7; }
.problem-copy .ink-note { color: var(--ink); font-weight: 800; }

.missed-opportunities {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  margin-top: 80px;
  overflow: hidden;
  border: 1px solid rgba(7, 19, 33, 0.13);
  border-radius: var(--radius);
  background: #07111f;
  color: white;
}

.search-stream { display: flex; gap: 12px; min-width: 0; padding: 26px; overflow: hidden; }
.search-stream span { flex: 0 0 auto; padding: 13px 17px; border: 1px solid rgba(255,255,255,0.13); border-radius: 100px; color: #aab7c8; font-size: 12px; white-space: nowrap; animation: stream 14s ease-in-out infinite alternate; }
@keyframes stream { to { transform: translateX(-240px); } }
.lost-counter { min-width: 200px; padding: 25px 30px; border-left: 1px solid rgba(255,255,255,0.13); background: #0b1829; }
.lost-counter span { display: block; color: #7f8ea3; font-size: 8px; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.lost-counter b { color: var(--coral-soft); font-size: 28px; font-variant-numeric: tabular-nums; letter-spacing: -0.04em; }

/* Method */
.method { position: relative; overflow: clip; background: var(--bg); isolation: isolate; }
.method::before { position: absolute; top: 18%; right: -18%; z-index: -1; width: min(760px, 78vw); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--blue) 16%, transparent), transparent 66%); content: ""; filter: blur(24px); animation: method-orb 12s ease-in-out infinite alternate; }
@keyframes method-orb { to { transform: translate(-10%, 16%) scale(1.14); } }
.method-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr); gap: 90px; }
.method-copy > .section-lead { margin: 26px 0 55px; }
.story-steps { display: grid; gap: 10px; }
.story-step { display: grid; grid-template-columns: 44px 1fr; gap: 19px; padding: 22px 22px 22px 0; border-bottom: 1px solid var(--line); border-radius: 14px; opacity: 0.42; cursor: pointer; transition: opacity 0.35s ease, transform 0.35s var(--ease-out), background .3s ease; }
.story-step.is-active { opacity: 1; transform: translateX(10px); }
.story-step:hover { background: color-mix(in srgb, var(--blue) 5%, transparent); }
.story-step:focus-visible { outline: 3px solid color-mix(in srgb, var(--blue) 35%, transparent); outline-offset: 4px; opacity: 1; }
.story-step > span { display: grid; place-items: center; width: 39px; height: 39px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); font-size: 10px; font-weight: 800; transition: background 0.3s ease, color 0.3s ease; }
.story-step.is-active > span { border-color: var(--coral); background: var(--coral); color: white; }
.story-step h3 { margin: 0 0 4px; font-size: 19px; letter-spacing: -0.035em; }
.story-step p { max-width: 390px; margin: 0; color: var(--muted); font-size: 13px; }

.method-stage {
  position: sticky;
  top: 105px;
  align-self: start;
  min-height: 690px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 38px;
  background:
    radial-gradient(circle at 50% 47%, color-mix(in srgb, var(--blue) 26%, transparent), transparent 38%),
    linear-gradient(145deg, color-mix(in srgb, var(--surface-solid) 92%, transparent), var(--bg-soft));
  box-shadow: var(--shadow);
  isolation: isolate;
}

.stage-grid {
  position: absolute;
  inset: 0;
  opacity: 0.16;
  background-image: linear-gradient(var(--line-strong) 1px, transparent 1px), linear-gradient(90deg, var(--line-strong) 1px, transparent 1px);
  background-size: 46px 46px;
  transform: perspective(650px) rotateX(62deg) scale(1.5) translateY(18%);
  mask-image: linear-gradient(to bottom, transparent, black 18%, transparent 83%);
}

.stage-radar {
  position: absolute;
  top: 49%;
  left: 50%;
  width: min(82%, 470px);
  aspect-ratio: 1;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--blue) 10%, transparent), transparent 68%);
  transform: translate(-50%, -50%);
}

.stage-radar i { position: absolute; inset: 16%; border: 1px solid var(--line); border-radius: 50%; }
.stage-radar i:nth-child(2) { inset: 32%; }
.stage-radar i:nth-child(3) { inset: 47%; }

.radar-sweep {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(from 8deg, transparent 0 72%, color-mix(in srgb, var(--blue) 4%, transparent) 78%, color-mix(in srgb, var(--blue) 28%, transparent) 98%, color-mix(in srgb, var(--blue-bright) 55%, transparent) 100%);
  transform-origin: 50% 50%;
  animation: radar-sweep-rotation 5.2s linear infinite;
}

.radar-sweep::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 48%;
  height: 1px;
  background: linear-gradient(90deg, var(--blue-bright), transparent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--blue) 70%, transparent);
  content: "";
  transform-origin: 0 50%;
}

@keyframes radar-sweep-rotation { to { transform: rotate(1turn); } }

.stage-satellite {
  position: absolute;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-solid) 80%, transparent);
  box-shadow: 0 12px 38px rgba(0, 0, 0, 0.18);
  color: var(--muted);
  font-size: 7px;
  font-weight: 850;
  letter-spacing: 0.12em;
  backdrop-filter: blur(12px);
  animation: satellite-float 4.8s ease-in-out infinite;
}

.stage-satellite i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 13px var(--green); }
.satellite-one { top: 19%; left: 7%; }
.satellite-two { right: 6%; bottom: 20%; animation-delay: -2.2s; }
@keyframes satellite-float { 50% { transform: translateY(-9px); } }

.stage-phone {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 4;
  width: 276px;
  height: 548px;
  overflow: hidden;
  border: 6px solid color-mix(in srgb, var(--text) 82%, transparent);
  border-radius: 44px;
  background: var(--surface-solid);
  box-shadow: 0 46px 100px rgba(0,0,0,0.4), 0 0 0 1px color-mix(in srgb, var(--text) 12%, transparent) inset;
  transform: translate(-50%, -50%) perspective(900px) rotateY(-5deg) rotateX(2deg);
  transition: transform 0.8s var(--ease-out);
}

.stage-phone::after {
  position: absolute;
  inset: 0;
  z-index: 9;
  background: linear-gradient(115deg, transparent 28%, rgba(255,255,255,0.09) 47%, transparent 65%);
  content: "";
  pointer-events: none;
  transform: translateX(-120%);
  animation: phone-glint 7s ease-in-out infinite;
}

@keyframes phone-glint { 20%, 100% { transform: translateX(120%); } }
.method-stage[data-active="1"] .stage-phone { transform: translate(-50%, -50%) perspective(900px) rotateY(4deg) rotateX(-1deg); }
.method-stage[data-active="2"] .stage-phone { transform: translate(-50%, -50%) perspective(900px) rotateY(-2deg) scale(1.02); }

.phone-top {
  position: absolute;
  inset: 0 0 auto;
  z-index: 10;
  display: grid;
  grid-template-columns: 1fr 72px 1fr;
  align-items: center;
  height: 38px;
  padding: 0 15px;
  border-bottom: 1px solid var(--line);
  font-size: 7px;
  font-weight: 750;
}

.phone-top span { justify-self: start; }
.phone-top i { align-self: start; width: 72px; height: 22px; border-radius: 0 0 13px 13px; background: color-mix(in srgb, var(--text) 88%, transparent); }
.phone-top b { justify-self: end; font-size: 5px; letter-spacing: 0.08em; }

.phone-screen {
  position: absolute;
  inset: 42px 9px 15px;
  display: flex;
  min-height: 0;
  flex-direction: column;
  overflow: hidden;
  padding: 15px 13px 24px;
  border: 1px solid var(--line);
  border-radius: 31px;
  background: linear-gradient(155deg, color-mix(in srgb, var(--surface-raised) 96%, transparent), color-mix(in srgb, var(--bg-soft) 95%, transparent));
  opacity: 0;
  pointer-events: none;
  transform: translateY(24px) scale(0.97);
  transition: opacity 0.45s ease, transform 0.7s var(--ease-out);
}

.method-stage[data-active="0"] [data-screen="0"],
.method-stage[data-active="1"] [data-screen="1"],
.method-stage[data-active="2"] [data-screen="2"] { opacity: 1; transform: none; }

.screen-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.screen-head strong { font-size: 13px; letter-spacing: -0.035em; }
.screen-head > b { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: color-mix(in srgb, var(--coral) 14%, transparent); color: var(--coral); font-size: 7px; }
.screen-label { color: var(--blue-bright); font-size: 7px; }

.screen-search {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  margin: 9px 0 10px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface-solid) 72%, transparent);
  color: var(--muted);
  font-size: 8px;
}

.screen-search > i { position: relative; width: 11px; height: 11px; border: 1px solid var(--muted); border-radius: 50%; }
.screen-search > i::after { position: absolute; right: -3px; bottom: -2px; width: 4px; height: 1px; background: var(--muted); content: ""; transform: rotate(45deg); }
.screen-search b { color: var(--coral); }

.search-results {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
  gap: 7px;
  overflow: hidden;
}

.search-results-meta {
  margin: 1px 2px 0;
  color: var(--muted);
  font-size: 6px;
  font-weight: 700;
  letter-spacing: .025em;
}

.search-result {
  position: relative;
  display: grid;
  grid-template-columns: 17px 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 69px;
  padding: 9px 9px 9px 7px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface-solid) 78%, transparent);
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
  transform: translateY(7px);
  opacity: .78;
}

.method-stage[data-active="0"] .search-result { animation: result-enter .58s var(--ease-out) both; }
.method-stage[data-active="0"] .search-result:nth-child(3) { animation-delay: .09s; }
.method-stage[data-active="0"] .search-result:nth-child(4) { animation-delay: .18s; }
@keyframes result-enter { to { opacity: 1; transform: none; } }

.search-result.is-featured {
  min-height: 78px;
  border-color: color-mix(in srgb, var(--blue-bright) 48%, var(--line));
  background: linear-gradient(110deg, color-mix(in srgb, var(--blue) 15%, var(--surface-solid)), color-mix(in srgb, var(--surface-solid) 93%, transparent));
  box-shadow: 0 14px 30px color-mix(in srgb, var(--blue) 15%, transparent), 0 0 0 1px color-mix(in srgb, var(--blue-bright) 8%, transparent) inset;
}

.search-result.is-featured::after {
  position: absolute;
  inset: 0 auto 0 -42%;
  width: 35%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.13), transparent);
  content: "";
  transform: skewX(-18deg);
  animation: result-shine 3.8s ease-in-out infinite 1s;
}

@keyframes result-shine { 45%, 100% { left: 125%; } }
.result-rank { color: var(--muted); font-size: 6px; font-weight: 900; letter-spacing: .08em; }
.result-brand { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, var(--blue), var(--coral)); color: white; font-size: 10px; font-style: normal; font-weight: 900; }
.result-brand-alt { background: color-mix(in srgb, var(--blue) 30%, var(--surface-raised)); color: var(--blue-bright); }
.result-brand-muted { background: color-mix(in srgb, var(--muted) 20%, var(--surface-raised)); color: var(--muted); }
.search-result div { min-width: 0; }
.search-result b, .search-result span, .search-result small { display: block; }
.search-result b { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.search-result div > span { margin-top: 2px; color: #f3b72f; font-size: 6px; letter-spacing: .025em; }
.search-result small { margin-top: 2px; color: var(--muted); font-size: 5.5px; }
.search-result em { display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: color-mix(in srgb, var(--green) 15%, transparent); color: var(--green); font-size: 9px; font-style: normal; font-weight: 900; }

.business-card { display: flex; gap: 11px; margin-top: 13px; padding: 13px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-raised); }
.business-card > i { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 auto; border-radius: 12px; background: linear-gradient(135deg, var(--blue), var(--coral)); color: white; font-style: normal; font-weight: 800; }
.business-card div { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.business-card b { font-size: 10px; }.business-card span { color: #f3b72f; font-size: 8px; letter-spacing: .04em; }.business-card small { margin-top: 3px; color: var(--muted); font-size: 6px; }

.trust-bars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 11px; }
.trust-bars i { display: flex; min-width: 0; min-height: 78px; flex-direction: column; justify-content: flex-end; padding: 9px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(145deg, var(--surface-raised), transparent); font-style: normal; }
.trust-bars i b, .trust-bars i span { display: block; }.trust-bars i b { font-size: 14px; }.trust-bars i span { color: var(--muted); font-size: 6px; }

.chat-bubble { max-width: 84%; margin-top: 20px; padding: 12px; border-radius: 14px 14px 14px 4px; background: var(--surface-raised); font-size: 8px; }.chat-bubble.answer { margin: 10px 0 0 auto; border-radius: 14px 14px 4px 14px; background: var(--blue); color: white; }
.typing { display: flex; gap: 3px; width: 38px; margin-top: 9px; padding: 9px; border-radius: 10px; background: var(--surface-raised); }.typing i { width: 4px; height: 4px; border-radius: 50%; background: var(--muted); animation: typing 1s ease-in-out infinite; }.typing i:nth-child(2) { animation-delay: .15s; }.typing i:nth-child(3) { animation-delay: .3s; } @keyframes typing { 50% { transform: translateY(-3px); } }
.phone-home { position: absolute; z-index: 11; bottom: 7px; left: 50%; width: 70px; height: 3px; border-radius: 99px; background: color-mix(in srgb, var(--text) 52%, transparent); transform: translateX(-50%); }
.stage-controls { position: absolute; bottom: 16px; left: 24px; z-index: 12; display: flex; align-items: center; gap: 5px; }
.stage-controls button { display: grid; place-items: center; width: 23px; height: 23px; padding: 0; border: 0; border-radius: 99px; background: transparent; cursor: pointer; transition: width .35s var(--ease-out), background .3s ease; }
.stage-controls button i { width: 5px; height: 5px; border-radius: 99px; background: var(--muted); transition: width .35s var(--ease-out), background .3s ease, box-shadow .3s ease; }
.stage-controls button[aria-pressed="true"] { width: 36px; background: color-mix(in srgb, var(--blue) 10%, transparent); }
.stage-controls button[aria-pressed="true"] i { width: 18px; background: var(--blue-bright); box-shadow: 0 0 12px color-mix(in srgb, var(--blue) 65%, transparent); }
.stage-controls button:focus-visible { outline: 2px solid var(--blue-bright); outline-offset: 2px; }
.stage-caption { position: absolute; right: 25px; bottom: 22px; color: var(--muted); font-size: 7px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }

/* Solutions */
.solutions {
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--line);
  background: var(--bg-soft);
  isolation: isolate;
}

.solutions::before {
  position: absolute;
  top: 7%;
  left: 50%;
  z-index: -1;
  width: min(850px, 90vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: conic-gradient(from 120deg, color-mix(in srgb, var(--blue) 18%, transparent), transparent 36%, color-mix(in srgb, var(--coral) 13%, transparent), transparent 78%);
  content: "";
  filter: blur(70px);
  opacity: 0.7;
  transform: translateX(-50%);
  animation: solution-orbit 18s ease-in-out infinite alternate;
}

@keyframes solution-orbit { to { transform: translate(-50%, 10%) rotate(55deg) scale(1.08); } }
.solutions > .container { position: relative; z-index: 1; }
.bento-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; margin-top: 70px; }
.bento-card {
  --spot-x: 50%;
  --spot-y: 50%;
  position: relative;
  min-height: 350px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-solid);
  padding: 32px;
  isolation: isolate;
  transform-style: preserve-3d;
  transition: border-color .35s ease, box-shadow .35s ease, transform .18s ease-out;
}

.bento-card::before {
  position: absolute;
  inset: -1px;
  z-index: -1;
  border-radius: inherit;
  background: radial-gradient(320px circle at var(--spot-x) var(--spot-y), color-mix(in srgb, var(--blue-bright) 18%, transparent), transparent 64%);
  content: "";
  opacity: 0.8;
  pointer-events: none;
}

.bento-card:hover { border-color: var(--line-strong); box-shadow: 0 28px 70px rgba(0,0,0,.16); }
.bento-coral::before { background: radial-gradient(300px circle at var(--spot-x) var(--spot-y), rgba(255,255,255,.24), transparent 62%); }
.bento-card h3 { max-width: 620px; margin: 22px 0 13px; font-size: clamp(29px, 3vw, 42px); line-height: 1.05; letter-spacing: -0.055em; }
.bento-card p { max-width: 430px; color: var(--muted); font-size: 14px; }
.bento-card > a { position: absolute; bottom: 31px; left: 32px; display: flex; align-items: center; gap: 14px; font-size: 12px; font-weight: 800; }
.bento-card > a span { color: var(--coral); }
.bento-feature { grid-row: span 2; min-height: 720px; }
.bento-dark { background: #07111f; color: #f7f3e9; }
.bento-dark p { color: #aab7c8; }
.bento-coral { background: var(--coral); color: white; }.bento-coral .card-index, .bento-coral p { color: rgba(255,255,255,.78); }
.bento-wide { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 270px; }
.card-index { color: var(--muted); font-size: 8px; }

.local-visual {
  position: absolute;
  inset: 35% 6% 10%;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 30px;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 13%, var(--line) 13.3% 13.7%, transparent 14% 27%, var(--line) 27.3% 27.7%, transparent 28% 42%, var(--line) 42.3% 42.7%, transparent 43%),
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px),
    color-mix(in srgb, var(--blue) 7%, var(--surface-solid));
  background-size: 100% 100%, 36px 36px, 36px 36px, 100% 100%;
  box-shadow: inset 0 0 70px color-mix(in srgb, var(--blue) 8%, transparent);
  isolation: isolate;
}

.local-visual::before {
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 0;
  width: 1px;
  height: 62%;
  background: linear-gradient(var(--blue-bright), transparent);
  box-shadow: 0 0 20px var(--blue);
  content: "";
  transform-origin: 0 0;
  animation: local-beam 6s linear infinite;
}

.local-visual::after { position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--blue) 13%, transparent), transparent 48%); content: ""; pointer-events: none; }
@keyframes local-beam { to { transform: rotate(1turn); } }
.local-scan { position: absolute; inset: -30%; z-index: 0; border-radius: 50%; background: conic-gradient(from 90deg, transparent 0 80%, color-mix(in srgb, var(--blue) 24%, transparent) 100%); transform-origin: 50% 50%; animation: radar-sweep-rotation 6s linear infinite; }
.local-pin { position: absolute; top: 50%; left: 50%; z-index: 3; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 17px color-mix(in srgb, var(--coral) 13%, transparent), 0 0 0 41px color-mix(in srgb, var(--coral) 7%, transparent), 0 18px 38px color-mix(in srgb, var(--coral) 32%, transparent); transform: translate(-50%, -50%); }.local-pin i { width: 16px; height: 16px; border-radius: 50%; background: white; }
.local-route { position: absolute; z-index: 2; width: 37%; height: 29%; border: 2px dashed var(--blue); border-left: 0; border-bottom: 0; border-radius: 50%; filter: drop-shadow(0 0 5px color-mix(in srgb, var(--blue) 45%, transparent)); }.route-a { top: 15%; left: 7%; transform: rotate(-10deg); }.route-b { right: 5%; bottom: 14%; transform: rotate(170deg); }
.local-chip { position: absolute; z-index: 4; padding: 8px 12px; border: 1px solid var(--line); border-radius: 100px; background: color-mix(in srgb, var(--surface-solid) 88%, transparent); box-shadow: 0 10px 25px rgba(0,0,0,.12); color: var(--muted); font-size: 8px; font-weight: 800; backdrop-filter: blur(10px); animation: chip-float 4.5s ease-in-out infinite; }.chip-a { top: 12%; right: 7%; }.chip-b { bottom: 13%; left: 6%; animation-delay: -2.2s; }
.local-status { position: absolute; right: 12px; bottom: 12px; z-index: 4; display: flex; align-items: center; gap: 6px; padding: 7px 9px; border-radius: 99px; background: color-mix(in srgb, var(--surface-solid) 90%, transparent); color: var(--muted); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }.local-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); }.local-status b { font-weight: 800; }
@keyframes chip-float { 50% { transform: translateY(-7px); } }

.radar-mini { position: absolute; right: -36px; bottom: -102px; width: 300px; aspect-ratio: 1; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; background: radial-gradient(circle, rgba(47,125,255,.09), transparent 68%); }
.radar-mini::before, .radar-mini::after { position: absolute; inset: 20%; z-index: 2; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; pointer-events: none; }.radar-mini::after { inset: 40%; }
.radar-mini-sweep { position: absolute; inset: 0; z-index: 1; border-radius: 50%; background: conic-gradient(from 10deg, transparent 0 70%, rgba(47,125,255,.03) 76%, rgba(47,125,255,.3) 98%, rgba(112,167,255,.6)); transform-origin: 50% 50%; animation: radar-sweep-rotation 4.2s linear infinite; }
.radar-mini-sweep::after { position: absolute; top: 50%; left: 50%; width: 48%; height: 1px; background: linear-gradient(90deg, var(--blue-bright), transparent); box-shadow: 0 0 12px var(--blue); content: ""; }
.radar-mini span, .radar-mini b { position: absolute; z-index: 3; width: 8px; height: 8px; border-radius: 50%; background: var(--blue-bright); box-shadow: 0 0 18px var(--blue); }.radar-mini span { top: 21%; left: 38%; }.radar-mini b { top: 53%; left: 24%; background: var(--coral); }
.play-orbit { position: absolute; right: 12%; bottom: 12%; display: grid; place-items: center; width: 145px; height: 145px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; }.play-orbit span { display: grid; place-items: center; width: 68px; height: 68px; padding-left: 4px; border-radius: 50%; background: white; color: var(--coral); }.play-orbit i { position: absolute; inset: -16px; border: 1px dashed rgba(255,255,255,.4); border-radius: 50%; animation: orbit-flat 10s linear infinite; } @keyframes orbit-flat { to { transform: rotate(360deg); } }
.conversion-flow { display: flex; align-items: center; justify-content: flex-end; gap: 14px; }.conversion-flow span { padding: 13px 16px; border: 1px solid var(--line); border-radius: 100px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .12em; }.conversion-flow span.active { border-color: var(--green); background: color-mix(in srgb, var(--green) 12%, transparent); color: var(--green); }.conversion-flow i { color: var(--coral); font-style: normal; }

/* Results */
.results { overflow: hidden; background: var(--bg); }
.results-intro { margin-bottom: 62px; }
.testimonials-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .045em; text-transform: uppercase; }.testimonials-toolbar > span { display: flex; align-items: center; gap: 8px; }.testimonials-toolbar > span i { color: var(--blue-bright); font-size: 16px; font-style: normal; }.testimonials-arrows { display: flex; gap: 7px; }.testimonials-arrows button { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-solid); color: var(--text); font-size: 17px; cursor: pointer; transition: transform .25s var(--ease-spring), border-color .2s ease, opacity .2s ease; }.testimonials-arrows button:hover:not(:disabled) { border-color: var(--blue-bright); transform: translateY(-2px); }.testimonials-arrows button:disabled { opacity: .32; cursor: default; }.testimonials-arrows button:focus-visible, .testimonials-track:focus-visible { outline: 3px solid color-mix(in srgb, var(--blue) 45%, transparent); outline-offset: 3px; }
.testimonials-track { display: flex; gap: 18px; width: min(1360px, calc(100vw - 20px)); margin-left: max(20px, calc((100vw - 1180px) / 2)); overflow-x: auto; overscroll-behavior-inline: contain; padding: 0 20px 25px 0; scroll-behavior: smooth; scroll-snap-type: x mandatory; touch-action: pan-x pan-y; scrollbar-width: none; -webkit-overflow-scrolling: touch; }.testimonials-track::-webkit-scrollbar { display: none; }
.testimonial { position: relative; flex: 0 0 min(430px, 82vw); min-height: 390px; padding: 34px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-solid); scroll-snap-align: start; scroll-snap-stop: always; }.testimonial:nth-child(2) { transform: translateY(26px); }.testimonial-example { background: linear-gradient(145deg, color-mix(in srgb, var(--blue) 5%, var(--surface-solid)), var(--surface-solid)); }.quote-mark { display: block; color: var(--coral); font-family: Georgia, serif; font-size: 72px; line-height: .7; }.testimonial blockquote { margin: 36px 0 50px; font-size: clamp(20px, 2vw, 26px); line-height: 1.45; letter-spacing: -0.035em; }.testimonial footer { display: flex; align-items: center; gap: 13px; }.testimonial footer > span { display: grid; place-items: center; width: 43px; height: 43px; flex: 0 0 auto; border-radius: 50%; background: linear-gradient(135deg, var(--blue), var(--coral)); color: white; font-size: 10px; font-weight: 800; }.testimonial footer div { min-width: 0; }.testimonial footer b, .testimonial footer small { display: block; }.testimonial footer b { font-size: 12px; }.testimonial footer small { color: var(--muted); font-size: 9px; }
.result-statement { display: flex; justify-content: space-between; margin-top: 110px; padding-top: 36px; border-top: 1px solid var(--line); font-size: clamp(20px, 2.5vw, 34px); letter-spacing: -0.045em; }.result-statement span { color: var(--muted); }.result-statement strong { color: var(--coral); }

/* Diagnosis */
.diagnosis { background: var(--sand); color: var(--ink); }
.diagnosis-shell { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; padding: clamp(30px, 5vw, 72px); border-radius: 40px; background: #07111f; color: #f7f3e9; box-shadow: 0 36px 100px rgba(7,17,31,.22); }
.diagnosis .section-kicker { color: var(--blue-bright); }.diagnosis h2 { margin: 20px 0 25px; font-size: clamp(42px, 5vw, 70px); }.diagnosis-copy p { max-width: 440px; color: #aab7c8; }
.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.choice { min-height: 77px; padding: 15px 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 15px; background: rgba(255,255,255,.035); color: #aab7c8; text-align: left; cursor: pointer; transition: border-color .25s ease, background .25s ease, color .25s ease, transform .25s var(--ease-spring); }.choice:hover { transform: translateY(-2px); border-color: rgba(255,255,255,.28); }.choice.is-selected { border-color: var(--coral); background: rgba(255,105,66,.12); color: white; box-shadow: inset 4px 0 0 var(--coral); }
.specialists { margin-top: 30px; }.specialists > p { margin-bottom: 12px; color: #aab7c8; font-size: 11px; font-weight: 700; }.specialist-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.specialist { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; min-width: 0; padding: 13px; border: 1px solid rgba(255,255,255,.14); border-radius: 15px; transition: transform .3s var(--ease-spring), border-color .3s ease; }.specialist:hover { transform: translateY(-3px); border-color: var(--green); }.specialist-avatar { position: relative; display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 13px; background: var(--coral); color: white; font-size: 13px; font-weight: 800; }.specialist-avatar.alt { background: var(--blue); }.specialist-avatar i { position: absolute; right: -2px; bottom: -2px; width: 10px; height: 10px; border: 2px solid #07111f; border-radius: 50%; background: var(--green); }.specialist b, .specialist small { display: block; }.specialist b { color: white; font-size: 11px; }.specialist small { overflow: hidden; color: #7f8ea3; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.specialist em { color: var(--green); font-size: 16px; font-style: normal; }.privacy-note { display: block; margin-top: 14px; color: #718198; font-size: 8px; text-align: center; }

/* FAQ and final */
.faq { background: var(--bg-soft); }.faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 100px; }.faq h2 { font-size: clamp(50px, 6vw, 78px); }.faq-list { border-top: 1px solid var(--line); }.faq-item { border-bottom: 1px solid var(--line); }.faq-item button { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 20px; width: 100%; padding: 27px 0; border: 0; background: transparent; color: var(--text); font-weight: 750; text-align: left; cursor: pointer; }.faq-item button i { position: relative; width: 20px; height: 20px; }.faq-item button i::before, .faq-item button i::after { position: absolute; top: 50%; left: 50%; width: 13px; height: 1px; background: var(--text); content: ""; transition: transform .3s ease; transform: translate(-50%, -50%); }.faq-item button i::after { transform: translate(-50%, -50%) rotate(90deg); }.faq-item.is-open button i::after { transform: translate(-50%, -50%) rotate(0); }.faq-answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s var(--ease-out); }.faq-answer > p { min-height: 0; overflow: hidden; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }.faq-item.is-open .faq-answer { grid-template-rows: 1fr; }.faq-item.is-open .faq-answer > p { padding-bottom: 27px; }

.final-cta { position: relative; display: grid; place-items: center; min-height: min(800px, 90svh); overflow: hidden; background: #115de7; color: white; text-align: center; }.final-cta::before { position: absolute; inset: -20%; background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.16), transparent 25%), radial-gradient(circle at 70% 68%, rgba(255,105,66,.42), transparent 30%); content: ""; animation: gradient-drift 10s ease-in-out infinite alternate; } @keyframes gradient-drift { to { transform: translate3d(4%, -3%, 0) scale(1.08); } }
.final-cta-inner { position: relative; z-index: 2; }.final-cta .section-kicker { color: rgba(255,255,255,.72); }.final-cta .section-kicker::before { display: none; }.final-cta h2 { margin: 25px auto 39px; font-size: clamp(49px, 7.2vw, 104px); line-height: .94; letter-spacing: -.075em; }.final-cta h2 em { color: var(--sand); font-weight: 450; }.final-cta .button { min-height: 60px; }

.site-footer { background: #06101c; color: #f7f3e9; }.footer-top { display: grid; grid-template-columns: .9fr .8fr 1.3fr; align-items: start; gap: 50px; padding: 75px 0; }.footer-brand { font-size: 24px; }.footer-top p { margin: 0; color: #8392a6; font-size: 13px; }.footer-contact { display: grid; gap: 15px; }.footer-email { width: fit-content; padding: 8px 11px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; color: #b9c7d9; font-size: 10px; font-weight: 750; transition: border-color .2s ease, color .2s ease, transform .25s var(--ease-spring); }.footer-email:hover { border-color: rgba(255,139,105,.55); color: var(--coral-soft); transform: translateY(-2px); }.footer-links { display: flex; flex-wrap: wrap; gap: 12px 22px; font-size: 10px; font-weight: 700; }.footer-links a, .footer-links button { color: #a9b4c3; transition: color .2s ease; }.footer-links button { padding: 0; border: 0; background: transparent; font: inherit; cursor: pointer; }.footer-links a:hover, .footer-links button:hover { color: var(--coral-soft); }.footer-bottom { display: flex; justify-content: space-between; padding: 20px 300px 28px 72px; border-top: 1px solid rgba(255,255,255,.11); color: #66768a; font-size: 9px; }.footer-bottom a { color: #9babbd; font-weight: 750; transition: color .2s ease; }.footer-bottom a:hover { color: var(--coral-soft); }.footer-heart { display: inline-block; filter: drop-shadow(0 0 5px rgba(255,82,82,.35)); animation: footer-heartbeat 2.8s ease-in-out infinite; }.footer-bottom a:focus-visible, .footer-email:focus-visible { outline: 2px solid var(--coral-soft); outline-offset: 3px; }.footer-bottom > span { min-width: 0; overflow-wrap: anywhere; }.footer-bottom > span:first-child { line-height: 1.7; } @keyframes footer-heartbeat { 8% { transform: scale(1.18); } 15% { transform: scale(1); } 22% { transform: scale(1.1); } 30%, 100% { transform: scale(1); } }

/* Discreet LGPD and cookie choice. */
.privacy-toast {
  position: fixed;
  right: 50%;
  bottom: max(14px, env(safe-area-inset-bottom));
  z-index: 96;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  width: min(650px, calc(100vw - 156px));
  padding: 12px 13px 12px 16px;
  border: 1px solid var(--line-strong);
  border-radius: 17px;
  background: color-mix(in srgb, var(--surface-solid) 91%, transparent);
  box-shadow: 0 18px 55px rgba(0,0,0,.22);
  color: var(--text);
  opacity: 0;
  visibility: hidden;
  transform: translate(50%, 14px) scale(.98);
  transition: opacity .3s ease, visibility .3s ease, transform .45s var(--ease-out);
  backdrop-filter: blur(18px) saturate(145%);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
}

.privacy-toast[hidden] { display: none; }
.privacy-toast.is-visible { opacity: 1; visibility: visible; transform: translate(50%, 0) scale(1); }
.privacy-toast.is-hiding { opacity: 0; transform: translate(50%, 10px) scale(.98); }
.privacy-copy { min-width: 0; }
.privacy-copy strong { display: block; margin-bottom: 2px; font-size: 10px; letter-spacing: -.01em; }
.privacy-copy p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.5; }
.privacy-copy a { color: var(--blue-bright); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--blue) 45%, transparent); text-underline-offset: 2px; }
.privacy-actions { display: flex; align-items: center; gap: 7px; }
.privacy-actions button { min-height: 36px; padding: 0 11px; border: 1px solid var(--line); border-radius: 10px; font-size: 8px; font-weight: 800; white-space: nowrap; cursor: pointer; transition: transform .2s var(--ease-spring), border-color .2s ease; }
.privacy-actions button:hover { transform: translateY(-2px); border-color: var(--line-strong); }
.privacy-essential { background: transparent; color: var(--muted); }
.privacy-accept { border-color: var(--coral) !important; background: var(--coral); color: white; }

/* Animated return-to-top rocket. */
.launch-warp {
  position: fixed;
  inset: 0;
  z-index: 88;
  overflow: hidden;
  background:
    repeating-linear-gradient(92deg, transparent 0 8vw, color-mix(in srgb, var(--blue-bright) 16%, transparent) 8.2vw 8.28vw, transparent 8.5vw 16vw),
    radial-gradient(ellipse at 50% 110%, color-mix(in srgb, var(--blue) 24%, transparent), transparent 58%);
  opacity: 0;
  pointer-events: none;
  transform: scaleY(.7);
  transform-origin: bottom;
}

.launch-warp.is-active { animation: warp-flash 1.45s var(--ease-out) forwards; }
@keyframes warp-flash { 0% { opacity: 0; transform: scaleY(.65); } 28% { opacity: .72; } 100% { opacity: 0; transform: scaleY(1.35) translateY(-15%); } }

.back-top-rocket {
  position: fixed;
  left: max(14px, env(safe-area-inset-left));
  bottom: max(12px, env(safe-area-inset-bottom));
  z-index: 89;
  display: grid;
  place-items: center;
  width: 62px;
  height: 78px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: color-mix(in srgb, var(--surface-solid) 78%, transparent);
  box-shadow: 0 15px 40px rgba(0,0,0,.18);
  color: var(--text);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  cursor: pointer;
  transform: translateY(18px) scale(.86);
  transition: opacity .35s ease, visibility .35s ease, transform .5s var(--ease-spring), border-color .25s ease;
  backdrop-filter: blur(15px);
}

.back-top-rocket.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.back-top-rocket:hover, .back-top-rocket.is-ignited { border-color: color-mix(in srgb, var(--coral) 65%, var(--line)); transform: translateY(-4px); }
.back-top-rocket:focus-visible { outline: 3px solid color-mix(in srgb, var(--blue) 45%, transparent); outline-offset: 3px; }
.rocket-object { position: relative; display: block; width: 32px; height: 54px; margin-top: -8px; animation: rocket-float 2.2s ease-in-out infinite; }
.rocket-body { position: absolute; top: 3px; left: 50%; z-index: 3; width: 22px; height: 36px; border: 1px solid rgba(255,255,255,.48); border-radius: 50% 50% 36% 36%; background: linear-gradient(155deg, var(--blue-bright), var(--blue) 62%, #0b3d9b); box-shadow: 0 8px 18px color-mix(in srgb, var(--blue) 34%, transparent); transform: translateX(-50%); }
.rocket-body::before { position: absolute; top: -5px; left: 50%; width: 11px; height: 11px; border: 1px solid rgba(255,255,255,.4); border-radius: 50% 50% 5px 5px; background: var(--coral); content: ""; transform: translateX(-50%) rotate(45deg); }
.rocket-window { position: absolute; top: 10px; left: 50%; width: 8px; height: 8px; border: 2px solid rgba(255,255,255,.65); border-radius: 50%; background: #07111f; transform: translateX(-50%); }
.rocket-fin { position: absolute; top: 27px; z-index: 2; width: 11px; height: 16px; border-radius: 70% 15% 60% 10%; background: var(--coral); }
.fin-left { left: 1px; transform: rotate(14deg); }.fin-right { right: 1px; transform: scaleX(-1) rotate(14deg); }
.rocket-flame { position: absolute; top: 38px; left: 50%; z-index: 1; display: flex; gap: 1px; transform: translateX(-50%); transform-origin: top; transition: transform .28s var(--ease-spring), filter .25s ease; }
.rocket-flame i { display: block; width: 5px; height: 13px; border-radius: 0 0 70% 70%; background: linear-gradient(#fff7bb, #ff9b3d 42%, var(--coral) 74%, transparent); animation: flame-dance .38s ease-in-out infinite alternate; }.rocket-flame i:nth-child(2) { height: 17px; animation-delay: -.14s; }.rocket-flame i:nth-child(3) { animation-delay: -.25s; }
.back-top-rocket:hover .rocket-flame, .back-top-rocket.is-ignited .rocket-flame { filter: drop-shadow(0 5px 8px var(--coral)); transform: translateX(-50%) scaleY(1.7) scaleX(1.25); }
.back-top-rocket:active .rocket-flame, .back-top-rocket.is-launching .rocket-flame { transform: translateX(-50%) scaleY(2.6) scaleX(1.55); }
.rocket-copy { position: absolute; right: 0; bottom: 6px; left: 0; color: var(--muted); font-size: 7px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; transition: opacity .2s ease; }
@keyframes rocket-float { 50% { transform: translateY(-4px) rotate(1.5deg); } }
@keyframes flame-dance { to { height: 19px; transform: scaleX(.72); } }

.back-top-rocket.is-launching {
  z-index: 110;
  visibility: visible;
  pointer-events: none;
  animation: rocket-loop 1.65s cubic-bezier(.45,.05,.25,1) forwards;
}
.back-top-rocket.is-launching .rocket-copy { opacity: 0; }
@keyframes rocket-loop {
  0% { opacity: 1; transform: translate3d(0,0,0) rotate(0deg) scale(1); }
  28% { opacity: 1; transform: translate3d(0,calc(-100vh + 104px),0) rotate(0deg) scale(1.04); }
  38% { opacity: 1; transform: translate3d(50px,calc(-100vh + 104px),0) rotate(90deg) scale(.96); }
  58% { opacity: 1; transform: translate3d(calc(100vw - 142px),calc(-100vh + 104px),0) rotate(90deg) scale(.96); }
  68% { opacity: 1; transform: translate3d(calc(100vw - 142px),calc(-100vh + 104px),0) rotate(180deg) scale(.94); }
  92% { opacity: 1; transform: translate3d(calc(100vw - 142px),18px,0) rotate(180deg) scale(.9); }
  100% { opacity: 0; transform: translate3d(calc(100vw - 142px),42px,0) rotate(180deg) scale(.72); }
}

/* Floating WhatsApp with two real attendants */
.whatsapp-dock { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 90; display: flex; align-items: center; gap: 10px; }
.whatsapp-label { padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--bg) 84%, transparent); box-shadow: 0 10px 30px rgba(0,0,0,.12); color: var(--muted); font-size: 9px; font-weight: 800; backdrop-filter: blur(14px); }
.whatsapp-dock > button { position: relative; display: grid; place-items: center; width: 58px; height: 58px; border: 0; border-radius: 19px; background: #24d366; color: white; box-shadow: 0 16px 40px rgba(36,211,102,.32); cursor: pointer; transition: transform .35s var(--ease-spring); }.whatsapp-dock > button:hover { transform: translateY(-4px) rotate(3deg); }.whatsapp-dock > button > i { position: absolute; inset: -5px; border: 1px solid #24d366; border-radius: 23px; animation: whatsapp-ping 2.2s ease-out infinite; } @keyframes whatsapp-ping { to { transform: scale(1.35); opacity: 0; } }.whatsapp-icon { position: relative; z-index: 1; display: block; width: 36px; height: 36px; filter: drop-shadow(0 3px 7px rgba(0,0,0,.16)); transition: transform .3s var(--ease-spring); }.whatsapp-dock > button:hover .whatsapp-icon { transform: scale(1.08) rotate(-3deg); }
.whatsapp-menu { position: absolute; right: 0; bottom: 74px; width: min(330px, calc(100vw - 32px)); padding: 10px; border: 1px solid var(--line); border-radius: 21px; background: color-mix(in srgb, var(--surface-solid) 92%, transparent); box-shadow: var(--shadow); opacity: 0; visibility: hidden; transform: translateY(14px) scale(.96); transform-origin: bottom right; transition: opacity .25s ease, visibility .25s ease, transform .35s var(--ease-spring); backdrop-filter: blur(22px); }.whatsapp-dock.is-open .whatsapp-menu { opacity: 1; visibility: visible; transform: none; }.whatsapp-head { padding: 8px 10px 14px; }.whatsapp-head b, .whatsapp-head span { display: block; }.whatsapp-head b { font-size: 13px; }.whatsapp-head span { margin-top: 2px; color: var(--muted); font-size: 9px; }.whatsapp-menu > a { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; padding: 11px; border-radius: 14px; }.whatsapp-menu > a:hover { background: color-mix(in srgb, var(--blue) 8%, transparent); }.whatsapp-menu a b, .whatsapp-menu a small { display: block; }.whatsapp-menu a b { font-size: 11px; }.whatsapp-menu a small { color: var(--muted); font-size: 8px; }.whatsapp-menu a em { color: var(--green); font-style: normal; }.whatsapp-menu .specialist-avatar i { border-color: var(--surface-solid); }

/* Entry animation progressively enhanced */
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .9s var(--ease-out); }.js .reveal.is-visible { opacity: 1; transform: none; }.js .reveal-delay-1 { transition-delay: .08s; }.js .reveal-delay-2 { transition-delay: .16s; }.js .reveal-delay-3 { transition-delay: .24s; }

@media (max-width: 1000px) {
  :root { --container: min(100% - 32px, 760px); }
  .desktop-nav, .header-cta { display: none; }
  .menu-toggle { display: grid; }
  .mobile-menu { position: absolute; top: 72px; right: 0; left: 0; display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid var(--line); border-radius: 19px; background: color-mix(in srgb, var(--bg) 94%, transparent); box-shadow: var(--shadow); opacity: 0; visibility: hidden; transform: translateY(-8px) scale(.98); transition: opacity .25s ease, visibility .25s ease, transform .35s var(--ease-out); backdrop-filter: blur(22px); }
  .site-header.menu-active .mobile-menu { opacity: 1; visibility: visible; transform: none; }
  .mobile-menu > a:not(.button) { padding: 14px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 14px; font-weight: 700; }
  .mobile-menu .button { margin-top: 8px; }
  .hero { padding-top: 124px; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 720px; }
  .hero h1 { font-size: clamp(66px, 9vw, 92px); }
  .hero-visual { min-height: 540px; }
  .proof-grid { grid-template-columns: 1fr 1fr; }
  .proof-grid > div:nth-child(2) { border-right: 1px solid var(--line); }
  .split-heading, .section-head, .faq-grid { grid-template-columns: 1fr; gap: 40px; }
  .problem-copy { padding-top: 0; }
  .method-grid { grid-template-columns: 1fr; }
  .method-stage { position: relative; top: auto; min-height: 660px; }
  .bento-grid { grid-template-columns: 1fr 1fr; }
  .bento-feature { grid-column: 1 / -1; grid-row: auto; min-height: 680px; }
  .bento-wide { grid-template-columns: 1fr; }
  .conversion-flow { justify-content: flex-start; }
  .diagnosis-shell { grid-template-columns: 1fr; }
  .faq-grid { gap: 60px; }
}

@media (max-width: 680px) {
  :root { --header-h: 70px; --container: calc(100vw - 28px); --radius: 22px; }
  .section-pad { padding: 88px 0; }
  .site-header { top: 8px; width: calc(100vw - 16px); height: 58px; padding-left: 13px; border-radius: 17px; }
  .brand { width: 146px; }.footer-brand { width: 210px; }.theme-toggle, .menu-toggle { width: 40px; height: 40px; border-radius: 12px; }
  .hero { min-height: auto; padding: 116px 0 84px; }
  .hero-grid { gap: 0; }
  .hero h1 { margin-top: 21px; font-size: clamp(49px, 15.2vw, 66px); line-height: .88; }
  .hero-lead { font-size: 17px; }
  .hero-actions { align-items: stretch; flex-direction: column; gap: 18px; }
  .hero-actions .button { width: 100%; }
  .text-link { justify-content: center; }
  .hero-trust { display: grid; gap: 8px; }
  .hero-visual { min-height: 460px; margin-top: 22px; transform: scale(.94); }
  .hero-visual::before { inset: 10% -25%; }
  .orbit-one { width: 360px; height: 360px; }.orbit-two { width: 255px; height: 255px; }
  .signal-core { left: 50%; }
  .search-card { top: 7%; left: -4%; width: min(275px, 78vw); }.message-card { right: -4%; bottom: 17%; width: min(290px, 80vw); }.metric-card { bottom: 0; left: 0; }.drag-hint { display: none; }
  .proof-grid { grid-template-columns: 1fr 1fr; }.proof-grid > div { min-height: 122px; padding: 20px; }.proof-main { grid-column: 1 / -1; border-right: 1px solid var(--line); }.proof-main strong { font-size: 50px; }.proof-grid > div:nth-child(3) { border-right: 1px solid var(--line); }
  .section-head h2, .split-heading h2, .method h2, .results h2, .diagnosis h2, .faq h2 { font-size: clamp(42px, 13vw, 61px); }
  .missed-opportunities { grid-template-columns: 1fr; margin-top: 55px; }.lost-counter { border-top: 1px solid rgba(255,255,255,.13); border-left: 0; }.search-stream { padding: 18px; }
  .method-grid { gap: 55px; }.method-copy > .section-lead { margin-bottom: 32px; }.story-step { grid-template-columns: 38px 1fr; gap: 14px; }.story-step.is-active { transform: translateX(3px); }.method-stage { min-height: 630px; border-radius: 27px; }.stage-radar { width: 350px; }.stage-phone { top: 47%; width: min(244px, calc(100% - 72px)); height: 500px; }.stage-satellite { display: none; }.stage-controls { right: 0; bottom: 34px; left: 0; justify-content: center; }.stage-caption { right: 0; bottom: 14px; left: 0; text-align: center; }.phone-screen { inset: 42px 8px 14px; padding: 14px 11px 23px; }.screen-head strong { font-size: 12px; }.search-result { min-height: 65px; padding-block: 8px; }.search-result.is-featured { min-height: 73px; }
  .bento-grid { grid-template-columns: 1fr; gap: 13px; margin-top: 48px; }.bento-card { min-height: 330px; padding: 25px; }.bento-feature { grid-column: auto; min-height: 630px; }.bento-wide { grid-column: auto; min-height: 340px; }.local-visual { inset: 41% 14px 76px; border-radius: 23px; }.local-pin { width: 56px; height: 56px; }.local-chip { padding: 7px 9px; }.local-status { right: 9px; bottom: 9px; }.radar-mini { right: -42px; bottom: -86px; width: 258px; }.bento-card > a { right: 24px; bottom: 25px; left: 25px; }.conversion-flow { flex-wrap: wrap; gap: 8px; }.conversion-flow span { padding: 9px 11px; }.conversion-flow i { display: none; }.play-orbit { right: 8%; bottom: 8%; width: 115px; height: 115px; }
  .results-intro { margin-bottom: 34px; }.testimonials-toolbar { margin-bottom: 13px; }.testimonials-track { width: 100%; margin-left: 0; gap: 12px; padding: 0 14px 22px; scroll-padding-inline: 14px; }.testimonial { flex-basis: calc(100vw - 48px); min-height: 372px; padding: 28px 28px 94px; scroll-snap-align: center; }.testimonial:nth-child(2) { transform: none; }.testimonial blockquote { margin-bottom: 38px; font-size: 21px; }.result-statement { align-items: flex-start; flex-direction: column; gap: 10px; margin-top: 65px; }
  .diagnosis-shell { gap: 40px; padding: 29px 20px; border-radius: 26px; }.choice-grid, .specialist-grid { grid-template-columns: 1fr; }.choice { min-height: 62px; }.diagnosis h2 { font-size: 45px; }
  .faq-grid { gap: 45px; }.faq-item button { padding: 22px 0; font-size: 14px; }
  .final-cta { min-height: 740px; }.final-cta h2 { font-size: clamp(49px, 14vw, 70px); }
  .footer-top { grid-template-columns: 1fr; gap: 22px; padding: 52px 0 32px; }.footer-brand { width: 190px; }.footer-contact { gap: 12px; padding: 17px; border: 1px solid rgba(255,255,255,.09); border-radius: 18px; background: rgba(255,255,255,.025); }.footer-top p { font-size: 12px; line-height: 1.65; }.footer-email { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 42px; padding: 0 12px; font-size: 10px; line-height: 1; text-align: center; }.footer-links { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 18px; background: rgba(255,255,255,.025); }.footer-links a, .footer-links button { display: flex; align-items: center; min-height: 44px; padding: 0 11px; border: 1px solid rgba(255,255,255,.07); border-radius: 12px; background: rgba(255,255,255,.025); color: #b7c2d0; font-size: 9px; line-height: 1.25; text-align: left; }.footer-links a[target="_blank"]::after { margin-left: auto; padding-left: 6px; color: var(--coral-soft); content: "↗"; }.footer-links button { grid-column: 1 / -1; justify-content: center; }.footer-bottom { display: grid; grid-template-columns: 68px minmax(0, 1fr) 84px; gap: 8px; padding: 18px 0 24px; }.footer-bottom > span { grid-column: 2; width: 100%; max-width: none; text-align: center; }.footer-bottom > span:first-child { padding: 13px 10px; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; background: rgba(255,255,255,.025); font-size: 8px; line-height: 1.7; }.footer-bottom > span:last-child { color: #77879b; font-size: 8px; }
  .privacy-toast { right: 10px; bottom: max(90px, calc(env(safe-area-inset-bottom) + 80px)); left: 10px; grid-template-columns: 1fr; gap: 9px; width: auto; padding: 11px 12px; border-radius: 15px; transform: translateY(14px) scale(.98); }.privacy-toast.is-visible { transform: none; }.privacy-toast.is-hiding { transform: translateY(10px) scale(.98); }.privacy-copy strong { font-size: 9px; }.privacy-copy p { font-size: 7px; line-height: 1.45; }.privacy-actions { justify-content: flex-end; }.privacy-actions button { min-height: 34px; padding-inline: 10px; }
  .back-top-rocket { width: 54px; height: 70px; border-radius: 19px; }.rocket-object { transform: scale(.9); }.rocket-copy { bottom: 4px; }
  .whatsapp-label { display: none; }.whatsapp-dock > button { width: 55px; height: 55px; }.whatsapp-menu { bottom: 68px; }
  .cursor-glow { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .js .reveal { opacity: 1; transform: none; }
  .hero-canvas, .final-canvas, .cursor-glow, .launch-warp { display: none; }
}

@media (hover: none), (pointer: coarse) {
  .cursor-glow { display: none; }
  .button:hover, .specialist:hover, .choice:hover { transform: none; }
  .bento-card::before { background-size: 190% 190%; animation: mobile-card-glow 8s ease-in-out infinite alternate; }
}

@keyframes mobile-card-glow { to { background-position: 100% 100%; } }