/* AION Assessoria: marketing para saúde.
   Design system AION (03/11/2026): Inter Tight Light nos títulos, Newsreader reto
   na palavra de destaque, Inter no texto. Um só azul-escuro (#0A1233), brand
   #1F4FE0, accent #8FAEFF no escuro. Cards só os cinco do guia; nada de arcos,
   círculos concêntricos ou anéis atrás do conteúdo. Grão leve nos fundos chapados. */
@font-face { font-family: "Inter Tight"; src: url(/assets/fontes/InterTight.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Inter"; src: url(/assets/fontes/Inter.woff2) format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url(/assets/fontes/Newsreader.woff2) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

:root {
  color-scheme: light;
  --bg: #FFFFFF;
  --bg-soft: #F5F6F9;
  --surface: #FFFFFF;
  --line: #E3E6EE;
  --line-strong: #C5CAD6;
  --fg: #0E1630;
  --muted: #4D5873;
  --subtle: #5A6580;
  --brand: #1F4FE0;
  --brand-hover: #1A43C4;
  --brand-text: #1C47CF;
  --brand-soft: #E8EEFD;
  --brand-glow: rgba(31, 79, 224, 0.16);
  /* Um só azul-escuro na marca. --navy-deep e --card-dark ficaram como apelido. */
  --navy: #0A1233;
  --navy-deep: var(--navy);
  --card-dark: var(--navy);
  --on-dark-muted: #C2C8D6;
  --em: var(--brand);
  --grad-icon: linear-gradient(160deg, #5C86FF 0%, #2448D8 100%);
  --grad-band: linear-gradient(140deg, #1638B0 0%, #1F4FE0 55%, #2E5AE8 100%);
  --grad-panel: var(--grad-band);
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  /* Grão leve para os fundos chapados: branco no escuro, tinta no claro. */
  --grain-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .04 0 0 0 0 .07 0 0 0 0 .2 0 0 0 .045 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --on-navy: #EDF1FB;
  --on-navy-muted: #A3AECB;
  --on-navy-accent: #8FAEFF;
  --accent-dark: #8FAEFF;
  --glass: rgba(255, 255, 255, .06);
  --glass-line: rgba(255, 255, 255, .14);
  --warn: #B45309;
  --green: #15803D;
  --radius-1: 10px; --radius-2: 16px; --radius-3: 28px; --radius-4: 56px; --radius-pill: 999px;
  --radius-sm: var(--radius-1); --radius-md: var(--radius-1); --radius-lg: var(--radius-2); --radius-xl: 24px; --radius-2xl: var(--radius-3);
  --shadow-sm: 0 1px 2px rgba(14, 30, 90, 0.06);
  --shadow-md: 0 22px 44px -22px rgba(14, 30, 90, 0.35);
  --shadow-lg: 0 30px 80px -30px rgba(14, 30, 90, 0.35);
  --serif: Newsreader, Georgia, serif;
  --display: "Inter Tight", Inter, system-ui, sans-serif;
  --font: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --maxw: 1200px;
  --gutter: clamp(16px, 4vw, 40px);
  /* nomes antigos, ainda usados por obrigado.html e pela política */
  --ink: var(--bg); --ink-2: var(--bg-soft); --text: var(--fg); --text-dim: var(--muted); --text-mute: var(--subtle); --accent: var(--brand-text);
}

* { box-sizing: border-box; margin: 0; padding: 0; min-width: 0; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 88px; }
body { font-family: var(--font); background: var(--bg); color: var(--fg); font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
h1, h2, h3, h4 { font-family: var(--display); font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; text-wrap: balance; }
/* Leve no grande: título de página e de seção em Inter Tight Light */
h1, h2 { font-weight: 300; letter-spacing: -0.035em; line-height: 1.06; }
p { text-wrap: pretty; }
strong, b { font-weight: 600; }
.wrap { width: min(var(--maxw), 100% - var(--gutter) * 2); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ic svg { width: 100%; height: 100%; }
/* Palavra de destaque em Newsreader reto (nunca itálico), na cor accent */
h1 em, h2 em { font-family: var(--serif); font-style: normal; font-weight: 400; font-size: 1.08em; line-height: 1; letter-spacing: -0.01em; color: var(--em); }
.hero-headline em, .method .section-title em, .final-cta-head em, .ethics .section-title em, .blog-sell h2 em { color: var(--accent-dark); }
/* Ícone redondo com degradê (check) */
.dot { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--grad-icon); color: #fff; }
.dot-sm { width: 20px; height: 20px; margin-top: 1px; }
/* Ícone em quadrado: navy no claro, translúcido no escuro */
.chip-ic { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--navy); color: #fff; }

:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; border-radius: 6px; }
.nav :focus-visible, .hero :focus-visible, .method :focus-visible, .attend :focus-visible, .fronts .fr-panel :focus-visible, .clients :focus-visible, footer :focus-visible, .final-cta :focus-visible, .ethics :focus-visible, .form-grid :focus-visible, .marquee-wrap :focus-visible, .blog-sell :focus-visible { outline-color: var(--accent-dark); }
.form-card :focus-visible, .nav-links.open :focus-visible, .live-panel :focus-visible { outline-color: var(--brand); }

.skip-link { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; left: 12px; top: 12px; z-index: 300; width: auto; height: auto; clip-path: none; padding: 10px 16px; background: var(--brand); color: #fff; border-radius: 10px; font-weight: 500; }

/* ===== Botões ===== */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 50px; padding: 0 22px; border-radius: var(--radius-1); font-size: 15px; font-weight: 600; white-space: nowrap; transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s; }
.btn .ic { width: 18px !important; height: 18px !important; transition: transform .15s; }
.btn:hover .ic { transform: translateX(2px); }
.btn-primary { background: var(--brand); color: #fff; box-shadow: 0 10px 30px -10px rgba(31, 79, 224, .75), inset 0 1px 0 rgba(255,255,255,.18); }
.btn-primary:hover { background: #2A5BF0; box-shadow: 0 18px 40px -12px rgba(31, 79, 224, .9), 0 0 0 6px rgba(31, 79, 224, .14), inset 0 1px 0 rgba(255,255,255,.22); }
/* Seta num bloco separado à direita: no hover o botão sobe 2px, o bloco cresce
   para a esquerda (a largura total não muda) e a seta anda 4px. */
.btn-primary, .nav-cta { --arrow-w: 50px; --arrow-gap: 14px; overflow: hidden; transition: background-color .15s, transform .18s, box-shadow .18s; }
.btn-primary:has(> .ic), .nav-cta:has(> .ic) { padding-right: 0; }
.btn-primary > .ic, .nav-cta > .ic { flex: none; align-self: stretch; width: var(--arrow-w) !important; height: auto !important; margin-left: var(--arrow-gap); padding: 0 16px; border-left: 1px solid rgba(255,255,255,.22); background: transparent; transform: none !important; transition: width .18s, margin-left .18s; }
.btn-primary > .ic svg, .nav-cta > .ic svg { transition: transform .18s; }
.btn-primary:hover, .nav-cta:hover { transform: translateY(-2px); }
.btn-primary:hover > .ic, .nav-cta:hover > .ic { width: calc(var(--arrow-w) + 8px) !important; margin-left: calc(var(--arrow-gap) - 8px); background: rgba(255,255,255,.12); }
.btn-primary:hover > .ic svg, .nav-cta:hover > .ic svg { transform: translateX(4px); }
.btn-ghost { background: var(--surface); color: var(--fg); border: 1px solid var(--line-strong); }
.btn-ghost:hover { border-color: var(--fg); }
.btn-glass { color: var(--on-navy); background: var(--glass); border: 1px solid var(--glass-line); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.btn-glass:hover { background: rgba(255, 255, 255, .1); border-color: rgba(143, 174, 255, .6); }
@media (max-width: 560px) { .btn { height: 44px; padding: 0 16px; font-size: 14px; } }

.pill { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 14px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius-pill); font-size: 13px; font-weight: 500; color: var(--fg); }
.pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.pill-soft { background: var(--bg-soft); border-color: var(--line); color: var(--brand-text); box-shadow: none; }
.pill-dark { background: var(--glass); border-color: var(--glass-line); color: var(--on-navy); box-shadow: none; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.pill-dark i { background: var(--on-navy-accent); box-shadow: 0 0 0 3px rgba(143, 174, 255, .22); animation: pl 1.8s infinite; }
.eyebrow { display: inline-flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 600; line-height: 1.3; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-bottom: 18px; }
.eyebrow b { color: var(--brand-text); }
.method .eyebrow, .ethics .eyebrow, .attend .eyebrow { color: var(--on-navy-muted); }
.method .eyebrow b, .ethics .eyebrow b, .attend .eyebrow b { color: var(--accent-dark); }
@keyframes pl { 0% { box-shadow: 0 0 0 0 rgba(143, 174, 255, .55); } 70% { box-shadow: 0 0 0 9px rgba(143, 174, 255, 0); } 100% { box-shadow: 0 0 0 0 rgba(143, 174, 255, 0); } }
@keyframes flutua { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }

/* ===== Seções base ===== */
section { padding: clamp(64px, 9vw, 112px) 0; position: relative; }
.section-title { font-size: clamp(32px, 4.6vw, 56px); color: var(--fg); }
.section-sub { margin-top: 18px; font-size: clamp(16px, 1.4vw, 18px); color: var(--muted); max-width: 62ch; }
.head-center { text-align: center; display: flex; flex-direction: column; align-items: center; margin-bottom: clamp(36px, 5vw, 56px); }
.head-center .pill { margin-bottom: 18px; }
.head-center .section-title { max-width: 20ch; }
.head-center .section-sub { margin-inline: auto; }

[data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1); }
[data-reveal].is-visible { opacity: 1; transform: none; }

/* ===== Faixa do topo ===== */

/* ===== Nav: vidro escuro, logo branca solta ===== */
.nav { position: sticky; top: 0; z-index: 100; padding: 10px var(--gutter) 0; }
.nav-inner { width: min(var(--maxw), 100%); margin-inline: auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 60px; padding: 0 10px 0 20px; background: rgba(10, 18, 51, .88); -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px); border: 1px solid rgba(255,255,255,.1); border-radius: 16px; box-shadow: 0 16px 40px -18px rgba(3, 8, 30, .6); }
.nav-logo img { height: 30px; width: auto; }
.nav-links { display: flex; gap: 28px; font-size: 14px; color: var(--on-dark-muted); }
.nav-links a { transition: color .15s; }
.nav-links a:hover { color: #fff; }
.nav-cta { display: inline-flex; align-items: center; height: 40px; padding: 0 16px; border-radius: var(--radius-1); background: var(--brand); color: #fff; font-size: 14px; font-weight: 600; white-space: nowrap; --arrow-w: 40px; --arrow-gap: 12px; }
.nav-cta > .ic { padding: 0 12px; }
.nav-cta:hover { background: var(--brand-hover); }
.nav-toggle { display: none; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 10px; color: #fff; border: 1px solid rgba(255,255,255,.16); }
.nav-toggle:hover { background: rgba(255,255,255,.08); }
@media (max-width: 860px) {
  .nav-inner { position: relative; }
  .nav-cta { margin-left: auto; }
  .nav-toggle { display: grid; }
  .nav-links { display: none; position: absolute; top: calc(100% + 8px); left: 0; right: 0; flex-direction: column; gap: 0; padding: 8px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-lg); font-size: 16px; color: var(--fg); }
  .nav-links.open { display: flex; }
  .nav-links a { display: flex; align-items: center; min-height: 48px; padding: 0 14px; border-radius: 10px; }
  .nav-links a:hover { background: var(--bg-soft); color: var(--fg); }
}
@media (max-width: 560px) { .nav { padding-top: 8px; } .nav-inner { height: 58px; gap: 8px; padding: 0 6px 0 14px; } .nav-logo img { height: 27px; } .nav-cta { height: 40px; padding: 0 0 0 12px; font-size: 13px; --arrow-w: 34px; --arrow-gap: 10px; } .nav-cta > .ic { padding: 0 9px; } }

/* ===== Hero: escuro, shader de grão, celular e cards flutuantes ===== */
.hero { position: relative; overflow: hidden; isolation: isolate; margin-top: -70px; padding: calc(70px + clamp(20px, 3vw, 44px)) 0 0; text-align: center; background: var(--navy); color: var(--on-navy); }
.grain-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; display: block; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(70% 58% at 50% 0%, rgba(10, 18, 51, .94), rgba(10, 18, 51, .6) 55%, rgba(10, 18, 51, .08) 100%), linear-gradient(to bottom, rgba(10, 18, 51, .25), rgba(10, 18, 51, 0) 60%); }
.hero-inner { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; }
.hero-headline { margin-top: 24px; font-size: clamp(42px, 7.4vw, 96px); line-height: 1.02; letter-spacing: -0.045em; max-width: 13ch; color: #fff; }
.hero-sub { margin-top: 24px; font-size: clamp(17px, 1.7vw, 20px); line-height: 1.5; color: #C2C8D6; max-width: 44ch; }
.hero-actions { margin-top: 32px; display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.hero-note { margin-top: 18px; font-size: 13px; color: var(--on-navy-muted); max-width: 60ch; }
@media (max-width: 600px) { .hero-sub { font-size: 15px; margin-top: 16px; } .hero-actions { margin-top: 24px; } }

.hero-stage { position: relative; display: flex; justify-content: center; align-items: flex-end; margin-top: clamp(44px, 6vw, 64px); height: 470px; text-align: left; }
.float { position: absolute; z-index: 3; background: rgba(10, 18, 51, .74); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: 1px solid var(--glass-line); border-radius: 18px; padding: 14px; color: var(--on-navy); box-shadow: 0 24px 60px -18px rgba(0, 0, 0, .6); animation: flutua 7s ease-in-out infinite; }
.f1 { left: calc(50% - 500px); top: 40px; width: 236px; rotate: -3deg; }
.f2 { right: calc(50% - 510px); top: 130px; width: 290px; rotate: 2deg; animation-delay: -3s; }
.mock-post-head { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; }
.mock-post-head i { width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(135deg, #7FA2FF, var(--brand)); }
.mock-post-head small { margin-left: auto; font-size: 11px; color: var(--on-navy-muted); font-weight: 400; }
.mock-post-img { margin-top: 12px; aspect-ratio: 1; border-radius: 12px; background: var(--grad-band); color: #fff; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 16px; }
.mock-post-img span { font-family: var(--display); font-size: 20px; line-height: 1.1; letter-spacing: -0.03em; font-weight: 300; }
.mock-post-img b { font-size: 12px; font-weight: 400; color: #DCE5FF; }
.mock-post-cta { margin-top: 10px; display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: 500; color: #fff; padding: 9px 10px; background: rgba(255,255,255,.08); border-radius: 9px; }
.mock-post-cta .ic { width: 14px; height: 14px; }
.mock-agenda-head { display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: 500; }
.mock-agenda-head small { display: inline-flex; gap: 4px; align-items: center; font-weight: 400; color: var(--on-navy-muted); font-size: 11px; }
.mock-grid { margin-top: 12px; display: grid; grid-template-columns: 40px repeat(5, 1fr); gap: 5px; align-items: center; }
.mock-day { font-size: 11px; color: var(--on-navy-muted); text-align: center; }
.mock-time { font-size: 11px; color: var(--on-navy-muted); font-variant-numeric: tabular-nums; }
.mock-slot { height: 26px; border-radius: 7px; }
.mock-slot.ok { background: rgba(255, 255, 255, .12); }
.mock-slot.new { background: var(--brand); box-shadow: 0 6px 14px -8px var(--brand); animation: acende 3.6s ease-in-out infinite; }
.mock-slot.free { border: 1px dashed rgba(255, 255, 255, .3); }
@keyframes acende { 0%, 100% { background: var(--brand); } 50% { background: #3D68F0; } }
.mock-legend { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 10px; font-size: 11px; color: var(--on-navy-muted); }
.mock-legend span { display: inline-flex; align-items: center; gap: 5px; }
.mock-legend i { width: 10px; height: 10px; border-radius: 3px; }
.mock-legend i.ok { background: rgba(255,255,255,.18); }
.mock-legend i.new { background: var(--brand); }
.mock-legend i.free { border: 1px dashed rgba(255,255,255,.4); }

/* Celular */
.phone { width: 300px; flex: none; aspect-ratio: 9 / 19; background: #0B0F1F; border-radius: 48px; padding: 10px; border: 1px solid #2A3253; box-shadow: 0 40px 90px rgba(0, 0, 0, .55), inset 0 0 0 2px #151A30; position: relative; }
.phone::before { content: ""; position: absolute; top: 20px; left: 50%; transform: translateX(-50%); width: 92px; height: 26px; background: #000; border-radius: 20px; z-index: 2; }
.screen { width: 100%; height: 100%; border-radius: 38px; overflow: hidden; background: var(--navy); color: var(--on-navy); display: flex; flex-direction: column; }
.hero .phone { margin-bottom: -150px; }
.st { display: flex; justify-content: space-between; padding: 16px 26px 6px; font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums; }
.chat-h { display: flex; align-items: center; gap: 10px; padding: 18px 16px 12px; border-bottom: 1px solid rgba(255,255,255,.08); }
.chat-av { width: 34px; height: 34px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #16A34A; color: #fff; }
.chat-h b { display: block; font-size: 14px; line-height: 1.2; }
.chat-h small { font-size: 11px; color: #86EFAC; }
.msgs { flex: 1; padding: 14px 12px; display: flex; flex-direction: column; gap: 8px; overflow: hidden; }
.m { max-width: 86%; padding: 9px 12px; border-radius: 16px; font-size: 12.5px; line-height: 1.4; }
.m.in { background: #1C2550; border-bottom-left-radius: 6px; }
.m time { display: block; margin-top: 3px; font-size: 10px; opacity: .6; text-align: right; font-variant-numeric: tabular-nums; }
.m.out { align-self: flex-end; background: var(--brand); color: #fff; border-bottom-right-radius: 6px; }
.mock-done { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 500; color: #BBF7D0; background: rgba(22, 163, 74, .18); border: 1px solid rgba(134, 239, 172, .28); padding: 6px 10px; border-radius: 999px; }
.mock-done .ic { width: 13px; height: 13px; }
.typing { align-self: flex-start; display: flex; gap: 4px; padding: 11px 14px; background: #1A2550; border-radius: 16px; }
.typing i { width: 6px; height: 6px; border-radius: 50%; background: var(--on-navy-muted); animation: tp 1.2s infinite; }
.typing i:nth-child(2) { animation-delay: .2s; } .typing i:nth-child(3) { animation-delay: .4s; }
@keyframes tp { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
/* Mensagens entram em sequência */
.msgs > * { animation: msgin .5s cubic-bezier(.2,.7,.2,1) both; }
.msgs > :nth-child(1) { animation-delay: .5s; } .msgs > :nth-child(2) { animation-delay: 1.3s; } .msgs > :nth-child(3) { animation-delay: 2.1s; } .msgs > :nth-child(4) { animation-delay: 2.8s; } .msgs > :nth-child(5) { animation-delay: 3.3s; }
@keyframes msgin { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 1060px) { .float { display: none; } }
@media (max-width: 640px) { .hero-stage { height: 380px; margin-top: 40px; } .phone { width: 256px; border-radius: 42px; } .screen { border-radius: 33px; } .hero .phone { margin-bottom: -130px; } }

/* ===== Garantias: card claro sobreposto ao hero ===== */
.guarantees { position: relative; z-index: 5; margin-top: -120px; padding-bottom: clamp(32px, 4vw, 56px); background: linear-gradient(to bottom, transparent 120px, var(--bg) 120px); }
.guarantee-list { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding: clamp(18px, 2.4vw, 28px); border-radius: var(--radius-2xl); background: var(--surface); border: 1px solid var(--line); box-shadow: 0 30px 80px -20px rgba(5, 10, 31, .35); }
.guarantee-list li { display: grid; gap: 8px; align-content: start; justify-items: start; padding: 20px; border: 1px solid var(--line); border-radius: 20px; transition: border-color .15s, box-shadow .2s, opacity .6s, transform .6s; }
.guarantee-list li:hover { border-color: var(--line-strong); box-shadow: var(--shadow-md); }
.guarantee-list .chip-ic { margin-bottom: 4px; }
.guarantee-list b { display: block; font-size: 16px; line-height: 1.3; color: var(--fg); }
.guarantee-list p { font-size: 14px; line-height: 1.5; color: var(--muted); }
@media (max-width: 1000px) { .guarantee-list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) {
  .guarantees { margin-top: -100px; background: linear-gradient(to bottom, transparent 100px, var(--bg) 100px); }
  .guarantee-list { grid-template-columns: 1fr; gap: 8px; padding: 10px; border-radius: 24px; }
  .guarantee-list li { grid-template-columns: 40px 1fr; gap: 2px 12px; padding: 14px; border-radius: 16px; }
  .guarantee-list .chip-ic { grid-row: span 2; width: 40px; height: 40px; margin: 0; }
  .guarantee-list b { font-size: 15px; }
  .guarantee-list p { font-size: 13.5px; }
}

/* ===== Marquee: faixa azul da marca ===== */
.marquee-wrap { position: relative; background: var(--grain-dark), var(--grad-band); color: #fff; overflow: hidden; }
.marquee-track { display: flex; width: max-content; animation: corre 40s linear infinite; }
.marquee-wrap:hover .marquee-track, .marquee-wrap:focus-within .marquee-track, .marquee-wrap.is-paused .marquee-track { animation-play-state: paused; }
.marquee-track span { display: inline-flex; align-items: center; gap: 28px; padding: 16px 0 16px 28px; font-size: 14px; font-weight: 600; letter-spacing: 0; white-space: nowrap; }
.marquee-track span::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #fff; opacity: .7; }
@keyframes corre { to { transform: translateX(-50%); } }
.marquee-toggle { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #2448D8; color: #fff; box-shadow: -16px 0 16px #2E5AE8; }
.marquee-toggle:hover { background: var(--navy); }

/* ===== Dores: cabeçalho em duas colunas e bento ===== */
.pains { background: var(--bg); padding-top: clamp(40px, 6vw, 72px); }
.pains-head { display: grid; grid-template-columns: 1fr 1fr; gap: 24px clamp(32px, 5vw, 72px); align-items: end; margin-bottom: clamp(32px, 4vw, 48px); }
.pains-head .section-sub:first-child { margin-top: 0; }
.pains-cta { margin-top: 24px; }
.bento { list-style: none; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.bx { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 26px; border-radius: var(--radius-xl); background: var(--surface); border: 1px solid var(--line); transition: border-color .15s, box-shadow .2s, opacity .6s, transform .6s; }
.bx:hover { border-color: var(--line-strong); box-shadow: var(--shadow-md); }
.bx .chip-ic { margin-bottom: 8px; }
.bx h3 { font-size: 19px; letter-spacing: -0.02em; }
.bx p { font-size: 15px; color: var(--muted); max-width: 44ch; }
.bx-0 { grid-column: span 2; grid-row: span 2; }
.bx-1 { grid-column: span 4; }
.bx-2, .bx-3 { grid-column: span 2; }
.bx-4, .bx-5 { grid-column: span 3; }
.bx-0, .bx-5 { background: var(--grain-dark), var(--navy); border-color: var(--navy); color: #fff; }
.bx-0 p, .bx-5 p { color: var(--on-dark-muted); }
.bx-0 .chip-ic, .bx-5 .chip-ic, .bx-1 .chip-ic { background: rgba(255,255,255,.1); color: #fff; }
.bx-1 { background: var(--grad-band); border-color: transparent; color: #fff; isolation: isolate; }
.bx-1::after { content: ""; position: absolute; z-index: -1; width: 520px; height: 520px; right: -200px; top: -260px; border-radius: 50%; background: radial-gradient(circle, rgba(160, 190, 255, .4), transparent 62%); }
.bx-1 p { color: #fff; }
.bx-agenda { margin-top: auto; padding-top: 22px; width: 100%; }
.bx-agenda .mock-slot.free { border-color: var(--on-navy-accent); animation: vaga 2.4s ease-in-out infinite; }
@keyframes vaga { 50% { border-color: rgba(143, 174, 255, .25); } }
.bx-timer { margin-top: 14px; width: 100%; display: grid; gap: 7px; }
.bx-timer span { display: block; height: 8px; border-radius: 999px; background: var(--bg-soft); border: 1px solid var(--line); }
.bx-timer span:nth-child(1) { width: 38%; } .bx-timer span:nth-child(2) { width: 72%; } .bx-timer span:nth-child(3) { width: 94%; }
.bx-timer span.on { background: var(--brand); border-color: var(--brand); }
@media (max-width: 1020px) {
  .pains-head { grid-template-columns: 1fr; align-items: start; }
  .bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bx-0, .bx-1 { grid-column: span 2; grid-row: auto; }
  .bx-2, .bx-3, .bx-4, .bx-5 { grid-column: span 1; }
}
@media (max-width: 640px) {
  .bento { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .bx-0, .bx-1, .bx-2, .bx-3, .bx-4, .bx-5 { grid-column: auto; }
  .bx { padding: 20px; }
  .bx h3 { font-size: 17px; }
  .bx p { font-size: 14px; }
  .bx .chip-ic { width: 38px; height: 38px; margin-bottom: 4px; }
}

/* ===== Para quem ===== */
.audience { background: var(--bg-soft); }
.audience-head { margin-bottom: 36px; }
.audience-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.audience-card { padding: 28px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-xl); position: relative; overflow: hidden; transition: border-color .15s, box-shadow .2s, translate .2s, opacity .6s, transform .6s; }
.audience-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-md); translate: 0 -4px; }
.audience-card h3 { margin-top: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--line); font-size: 20px; }
.svc-step ul, .audience-card ul { list-style: none; margin-top: 16px; display: grid; gap: 10px; }
.svc-step li, .audience-card li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; color: var(--fg); }
@media (max-width: 900px) { .audience-grid { grid-template-columns: 1fr; gap: 10px; } .audience-card { padding: 18px 20px; } .audience-card h3 { margin-top: 0; } .audience-card .svc-icon { display: none; } .audience-card ul { margin-top: 10px; gap: 6px; } .audience-card li { font-size: 14.5px; } .audience-head { margin-bottom: 24px; } }

/* ===== Clientes ===== */
.clients { background: var(--grain-dark), var(--navy); color: var(--on-navy); padding: clamp(48px, 6vw, 72px) 0; overflow: hidden; }
.clients .wrap { position: relative; }
.clients-title { text-align: center; font-family: var(--font); font-size: 12px; line-height: 1.3; letter-spacing: .2em; text-transform: uppercase; color: var(--on-navy-muted); font-weight: 600; }
.client-marquee { margin-top: 32px; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.client-logos { list-style: none; display: flex; align-items: center; width: max-content; animation: corre 40s linear infinite; }
.client-logos li { padding-right: clamp(40px, 5vw, 72px); flex-shrink: 0; }
.client-logos img { height: clamp(40px, 4.4vw, 60px); width: auto; }
.client-logos li.is-wide img { height: clamp(26px, 2.8vw, 38px); }

/* ===== Sobre ===== */
.about { background: var(--bg); }
.about-layout { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(40px, 6vw, 88px); align-items: center; }
.about-visual { position: relative; padding: 24px 28px 40px 0; }
.about-card { aspect-ratio: 5 / 4.2; border-radius: var(--radius-xl); background: var(--grain-dark), var(--navy); padding: clamp(28px, 4vw, 44px); display: flex; flex-direction: column; justify-content: space-between; box-shadow: var(--shadow-lg); position: relative; overflow: hidden; isolation: isolate; }
.about-card::after { content: ""; position: absolute; z-index: -1; width: 70%; aspect-ratio: 1; left: -20%; bottom: -40%; border-radius: 50%; background: radial-gradient(circle, rgba(31, 79, 224, .45), transparent 65%); }
.about-card img { width: clamp(110px, 14vw, 170px); height: auto; }
.about-card span { position: relative; z-index: 1; font-family: var(--display); font-weight: 300; font-size: clamp(24px, 2.8vw, 36px); line-height: 1.1; letter-spacing: -0.035em; color: #fff; max-width: 13ch; }
.about-float { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 11px 14px; background: rgba(255, 255, 255, .84); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 20px 50px -20px rgba(5, 10, 31, .45); font-size: 13px; font-weight: 500; color: var(--fg); animation: flutua 7s ease-in-out infinite; }
.about-float .ic { color: var(--brand); flex: none; }
.about-float.f1 { left: auto; right: 0; top: 34%; width: auto; rotate: 0deg; }
.about-float.f2 { right: auto; left: 24px; top: auto; bottom: 8px; width: auto; rotate: 0deg; animation-delay: -3.5s; }
.about-points { margin-top: 32px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.about-points > div { padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--bg-soft); }
.about-points h3 { font-size: 18px; color: var(--fg); }
.about-points p { margin-top: 6px; font-size: 14.5px; color: var(--muted); }
@media (max-width: 900px) { .about-layout { grid-template-columns: 1fr; } .about-visual { max-width: 520px; } }
@media (max-width: 600px) { .about-card { aspect-ratio: 16 / 9; width: 100%; } .about-visual { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; } .about-float, .about-float.f1, .about-float.f2 { position: static; font-size: 12px; padding: 8px 10px; animation: none; } .about-points { grid-template-columns: 1fr; margin-top: 24px; gap: 10px; } .about-points > div { padding: 16px; } }

/* ===== Método (escuro) + painel ao vivo com grade de pontos ===== */
.method { background: var(--grain-dark), var(--navy); color: var(--on-navy); overflow: hidden; isolation: isolate; }
.method .section-title { color: #fff; }
.method .section-sub { color: var(--on-navy-muted); }
.attend-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 88px); align-items: end; }
.attend .section-title { max-width: 15ch; }
/* Linha com pontos: ponto azul com halo claro, fio vertical ligando os passos */
.dots-line { list-style: none; position: relative; display: grid; gap: 22px; }
.dots-line::before { content: ""; position: absolute; left: 5px; top: 10px; bottom: 10px; width: 1px; background: linear-gradient(to bottom, var(--accent-dark), rgba(255,255,255,.12)); }
.dots-line li { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 4px 16px; padding-left: 28px; }
.dots-line li::before { content: ""; position: absolute; left: 0; top: 4px; width: 11px; height: 11px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 5px rgba(143, 174, 255, .2); }
.dots-line time { padding-top: 1px; font-size: 13px; font-weight: 600; color: var(--accent-dark); font-variant-numeric: tabular-nums; }
.dots-line b { display: block; font-size: 16px; color: #fff; }
.dots-line p { margin-top: 4px; font-size: 14.5px; color: var(--on-navy-muted); }
@media (max-width: 900px) { .attend-layout { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .dots-line li { grid-template-columns: 1fr; } }
.method .wrap { position: relative; }
.live { position: relative; margin-top: clamp(56px, 7vw, 96px); padding-top: 8px; }
.live-panel { position: relative; background: var(--surface); color: var(--fg); border-radius: var(--radius-2xl); padding: 10px; box-shadow: 0 40px 100px -20px rgba(0, 0, 0, .6); max-width: 1000px; margin-inline: auto; }
.live-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; flex-wrap: wrap; }
.live-top b { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; }
.live-top small { font-size: 12px; color: var(--subtle); }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--brand); animation: plb 1.6s infinite; }
@keyframes plb { 0% { box-shadow: 0 0 0 0 rgba(31, 79, 224, .55); } 70% { box-shadow: 0 0 0 10px rgba(31, 79, 224, 0); } 100% { box-shadow: 0 0 0 0 rgba(31, 79, 224, 0); } }
.tbl-scroll { overflow: hidden; border-radius: 22px; border: 1px solid var(--line); }
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th { text-align: left; font-size: 11.5px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--subtle); padding: 13px 18px; background: var(--bg-soft); border-bottom: 1px solid var(--line); }
.tbl td { padding: 13px 18px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl .mono { font-variant-numeric: tabular-nums; color: var(--muted); }
.tbl tr.new td { animation: rowin .9s ease; }
@keyframes rowin { from { background: var(--brand-soft); } to { background: transparent; } }
.st-p { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; padding: 5px 9px; border-radius: 999px; background: var(--bg-soft); }
.st-p::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.st-ok { color: #15803D; } .st-at { color: #B45309; } .st-na { color: var(--muted); }
.kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.kpi { border-radius: 22px; padding: 20px 22px; background: var(--bg-soft); border: 1px solid var(--line); display: grid; gap: 4px; }
.kpi .v { font-family: var(--display); font-size: clamp(32px, 4vw, 54px); line-height: 1; letter-spacing: -0.045em; font-weight: 300; font-variant-numeric: tabular-nums; }
.kpi .k { font-size: 14px; color: var(--muted); }
.kpi:first-child { background: var(--grad-band); border-color: transparent; color: #fff; }
.kpi:first-child .k { color: #E6ECFF; }
@media (max-width: 640px) {
  .live::before { inset: -60px -16px -30px; }
  .live-panel { padding: 6px; border-radius: 22px; }
  .tbl th:nth-child(3), .tbl td:nth-child(3), .tbl th:nth-child(4), .tbl td:nth-child(4) { display: none; }
  .tbl th, .tbl td { padding: 11px 10px; font-size: 12.5px; }
  .tbl th { font-size: 10.5px; }
  .tbl-scroll { border-radius: 16px; }
  .kpis { gap: 6px; margin-top: 6px; }
  .kpi { padding: 14px 12px; border-radius: 16px; }
  .kpi .k { font-size: 12px; line-height: 1.3; }
}

/* ===== Regras dos conselhos (escuro, celular com checklist) ===== */
.ethics { background: var(--grain-dark), var(--navy); color: var(--on-navy); overflow: hidden; }
.ethics .section-title { color: #fff; }
.ethics .section-sub { color: var(--on-navy-muted); }
.ethics-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(40px, 6vw, 80px); align-items: center; }
.ethics-stage { position: relative; display: flex; justify-content: center; padding-block: 20px; }
.screen-light { background: #F7F8FB; color: var(--fg); }
.ethics-stage .phone { aspect-ratio: 9 / 20.5; }
.par-h { padding: 22px 18px 14px; border-bottom: 1px solid var(--line); }
.par-h small { display: block; line-height: 1.4; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--subtle); }
.par-h b { display: block; font-size: 17px; line-height: 1.25; margin-top: 8px; }
.par-body { padding: 12px; display: grid; gap: 8px; }
.pr { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: #fff; border: 1px solid var(--line); font-size: 13px; animation: msgin .5s both; }
.pr small { display: block; font-size: 11px; color: var(--subtle); }
.pr:nth-child(2) { animation-delay: .15s; } .pr:nth-child(3) { animation-delay: .3s; } .pr:nth-child(4) { animation-delay: .45s; }
.pr .ok { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #16A34A; color: #fff; flex: none; }
.dec { margin: 4px 12px 0; padding: 16px; border-radius: 18px; background: var(--grad-band); color: #fff; display: grid; gap: 4px; }
.dec span { font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: #E6ECFF; }
.dec b { font-size: 18px; line-height: 1.2; letter-spacing: -0.01em; }
.ethics-note { margin-top: 18px; font-size: 13.5px; color: var(--on-navy-muted); padding-left: 14px; border-left: 2px solid rgba(255,255,255,.2); max-width: 56ch; }
.ethics-list { list-style: none; margin-top: 28px; display: grid; }
.ethics-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 16px; padding: 18px 0; border-top: 1px solid rgba(255,255,255,.1); }
.ethics-list li:last-child { border-bottom: 1px solid rgba(255,255,255,.1); }
.ethics-list .chip-ic { background: rgba(255,255,255,.08); color: var(--on-navy-accent); }
.ethics-list b { display: block; font-family: var(--display); font-size: 17px; font-weight: 600; letter-spacing: -0.015em; color: #fff; }
.ethics-list small { font-size: 12px; font-weight: 500; color: #C9D6FF; background: rgba(255,255,255,.1); padding: 2px 8px; border-radius: 6px; margin-left: 6px; white-space: nowrap; }
.ethics-list p { margin-top: 6px; font-size: 14.5px; color: var(--on-navy-muted); }
@media (max-width: 900px) { .ethics-layout { grid-template-columns: 1fr; gap: 32px; } .ethics-stage { order: 2; } .ethics-list li { padding: 14px 0; gap: 12px; grid-template-columns: 36px minmax(0, 1fr); } .ethics-list .chip-ic { width: 36px; height: 36px; } .ethics .section-sub { font-size: 15.5px; } }
@media (max-width: 640px) { .ethics-stage .phone { width: 264px; aspect-ratio: 9 / 21.5; } .ethics-stage .pr { padding: 8px 10px; } }

/* ===== Serviços (oferta) ===== */
.services { background: var(--bg); }
.services-head { margin-bottom: 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px 48px; align-items: end; }
.services-head .section-title { max-width: 22ch; }
.services-head .section-sub { margin-top: 0; }
.services-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.svc-card { padding: 26px; border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--surface); transition: border-color .15s, box-shadow .15s, opacity .6s, transform .6s; }
.svc-card:not(.featured):hover { border-color: var(--line-strong); box-shadow: var(--shadow-md); }
.svc-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--navy); color: #fff; }
.svc-card h3 { margin-top: 18px; font-size: 19px; }
.svc-card p { margin-top: 8px; color: var(--muted); font-size: 15px; }
.svc-card.featured { grid-column: 1 / -1; display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; align-items: center; padding: clamp(24px, 4vw, 48px); background: var(--grain-dark), var(--navy); border-color: var(--navy); color: var(--on-navy); position: relative; overflow: hidden; isolation: isolate; }
.svc-card.featured::after { content: ""; position: absolute; z-index: -1; width: 640px; aspect-ratio: 1; right: -160px; top: 50%; transform: translateY(-50%); border-radius: 50%; background: radial-gradient(circle, rgba(31, 79, 224, .5), transparent 62%); }
.svc-card.featured h3 { margin-top: 14px; font-size: clamp(28px, 3.2vw, 42px); font-weight: 300; letter-spacing: -0.035em; color: #fff; }
.svc-card.featured p { font-size: 16.5px; max-width: 48ch; color: var(--on-navy-muted); }
.service-label { display: inline-flex; align-items: center; height: 28px; font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--accent-dark); background: var(--glass); border: 1px solid var(--glass-line); padding: 0 12px; border-radius: var(--radius-pill); }
.svc-deliver { list-style: none; margin-top: 18px; display: grid; gap: 14px; }
.svc-deliver li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; }
.svc-deliver li > span { font-size: 13px; color: var(--on-navy-accent); font-variant-numeric: tabular-nums; padding-top: 2px; }
.svc-deliver b { font-weight: 600; font-size: 16px; color: #fff; }
.svc-card.featured .svc-deliver p { margin-top: 2px; font-size: 15px; }
.svc-card.featured .svc-discount { margin-top: 18px; display: flex; gap: 8px; align-items: center; font-size: 14.5px; color: #fff; }
.svc-discount .ic { color: var(--on-navy-accent); flex: none; }
.svc-cta { margin-top: 22px; }
.svc-step { padding: clamp(22px, 3vw, 32px); }
.svc-step-head { display: flex; justify-content: space-between; align-items: center; }
.svc-step-head span { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--subtle); font-variant-numeric: tabular-nums; }
.svc-step h3 { font-size: 24px; }
.svc-card.svc-step .svc-step-label { margin-top: 18px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--subtle); }
.svc-step-label + ul { margin-top: 10px; }
.svc-included { margin-top: 16px; padding: clamp(20px, 3vw, 32px); border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--bg-soft); }
.svc-included h3 { font-size: 19px; }
.svc-included ul { list-style: none; margin-top: 18px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
.svc-included li { display: flex; flex-direction: column; gap: 12px; }
.svc-included b { font-weight: 500; font-size: 15.5px; }
.svc-included p { margin-top: 4px; font-size: 14px; color: var(--muted); }
.svc-model { list-style: none; margin-top: 40px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; padding: 18px 22px; border-radius: var(--radius-xl); background: var(--grain-dark), var(--grad-band); font-weight: 600; color: #fff; font-size: 14.5px; }
.svc-model li { display: inline-flex; align-items: center; gap: 8px; }
.svc-model .ic { color: #fff; }
/* Painel do diagnóstico: card claro dentro do bloco escuro */
.demand-visual { position: relative; background: var(--surface); color: var(--fg); border-radius: var(--radius-xl); padding: 20px; box-shadow: 0 30px 70px -24px rgba(0, 0, 0, .6); }
.demand-top { display: flex; flex-wrap: wrap; gap: 6px 12px; justify-content: space-between; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.demand-caption { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--subtle); }
.demand-live { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: #15803D; }
.demand-live i { width: 7px; height: 7px; border-radius: 50%; background: #16A34A; animation: plg 1.6s infinite; }
@keyframes plg { 0% { box-shadow: 0 0 0 0 rgba(22, 163, 74, .5); } 70% { box-shadow: 0 0 0 8px rgba(22, 163, 74, 0); } 100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0); } }
.demand-step { display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }
.demand-step:last-child { border-bottom: 0; padding-bottom: 0; }
.demand-step > span { font-size: 12px; color: var(--brand-text); font-variant-numeric: tabular-nums; }
.demand-step b { display: block; font-size: 15px; color: var(--fg); }
.svc-card .demand-visual .demand-step p { grid-column: auto; margin: 2px 0 0; font-size: 13px; color: var(--muted); }
.demand-step em { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #16A34A; color: #fff; }
@media (max-width: 1100px) { .svc-included ul { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) { .services-head { grid-template-columns: 1fr; } .svc-included ul { grid-template-columns: 1fr 1fr; } .services-grid { grid-template-columns: 1fr 1fr; } .svc-card.featured { grid-template-columns: 1fr; gap: 24px; } }
@media (max-width: 560px) { .svc-included ul { grid-template-columns: 1fr; gap: 12px; } .svc-included li { flex-direction: row; } .svc-included .svc-icon { width: 34px; height: 34px; flex: none; } .svc-included p { font-size: 13.5px; } .svc-card.featured .svc-deliver p { font-size: 14px; } }
@media (max-width: 600px) {
  .services-head { margin-bottom: 28px; }
  .services-grid { grid-template-columns: 1fr; gap: 10px; }
  .svc-card { padding: 16px 18px; display: grid; grid-template-columns: 40px 1fr; gap: 4px 14px; }
  .svc-card h3 { margin-top: 0; font-size: 17px; align-self: center; }
  .svc-card p { grid-column: 2; margin-top: 0; font-size: 14px; }
  .svc-icon { width: 40px; height: 40px; grid-row: span 2; }
  .svc-card.featured { grid-template-columns: 1fr; padding: 20px; }
  .svc-card.featured p { grid-column: auto; margin-top: 8px; font-size: 15px; }
  .svc-card.featured h3 { margin-top: 10px; }
  .demand-visual { padding: 14px 16px; }
  .demand-step { padding: 9px 0; }
  .svc-card .demand-visual .demand-step p { display: none; }
  .svc-card.svc-step { display: block; padding: 18px; }
  .svc-step .svc-icon { width: 34px; height: 34px; }
  .svc-step h3 { margin-top: 10px; font-size: 20px; }
  .svc-card.svc-step p { margin-top: 4px; font-size: 14px; }
  .svc-step ul { margin-top: 10px; gap: 6px; }
  .svc-step li { font-size: 14px; }
  .svc-model { justify-content: flex-start; flex-direction: column; gap: 8px; }
}

/* ===== Time ===== */
.team { background: var(--bg-soft); }
.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.team-card { padding: 24px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-xl); transition: border-color .15s, box-shadow .2s, translate .2s, opacity .6s, transform .6s; }
.team-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-md); translate: 0 -4px; }
.team-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--grad-icon); color: #fff; }
.team-card h3 { margin-top: 18px; font-size: 17px; }
.team-card p { margin-top: 8px; font-size: 14.5px; color: var(--muted); }
@media (max-width: 1000px) { .team-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .team-grid { gap: 10px; } .team-card { padding: 16px; } .team-icon { width: 36px; height: 36px; } .team-card h3 { margin-top: 12px; font-size: 15px; } .team-card p { font-size: 13px; } }

/* ===== FAQ (claro, numerado) ===== */
.faq { background: var(--bg); }
.faq-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(32px, 6vw, 80px); align-items: start; }
.faq-intro { position: sticky; top: 100px; }
.faq-intro p { margin-top: 14px; color: var(--muted); max-width: 34ch; }
.faq-cta { margin-top: 28px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-q-head { font-size: inherit; letter-spacing: 0; }
.faq-q { width: 100%; display: flex; align-items: center; gap: 16px; padding: 22px 0; text-align: left; font-family: var(--display); font-size: 19px; font-weight: 600; letter-spacing: -0.015em; color: var(--fg); }
.faq-num { flex: none; width: 26px; font-family: var(--font); font-size: 13px; letter-spacing: 0; font-variant-numeric: tabular-nums; color: var(--brand-text); }
.faq-q-text { flex: 1; }
.faq-toggle { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; border: 1px solid var(--line-strong); font-size: 18px; transition: background-color .15s, border-color .15s, color .15s; }
.faq-q:hover .faq-toggle { border-color: var(--fg); }
.faq-toggle span { display: inline-block; line-height: 1; transition: transform .2s; }
.faq-item.open .faq-toggle { background: var(--brand); border-color: var(--brand); color: #fff; }
.faq-item.open .faq-toggle span { transform: rotate(45deg); }
.faq-a { padding: 0 50px 22px 42px; color: var(--muted); font-size: 15.5px; line-height: 1.65; animation: msgin .35s ease both; }
@media (max-width: 900px) { .faq-grid { grid-template-columns: 1fr; gap: 20px; } .faq-intro { position: static; } }
@media (max-width: 600px) { .faq-cta { margin-top: 18px; } .faq-q { font-size: 15.5px; padding: 16px 0; gap: 12px; } .faq-num { width: 20px; font-size: 12px; } .faq-a { padding: 0 0 18px 32px; font-size: 14.5px; } }

/* ===== Formulário ===== */
.form-section { padding-top: clamp(48px, 7vw, 88px); }
.form-grid { position: relative; display: grid; grid-template-columns: minmax(0, 520px) 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; padding: clamp(20px, 4vw, 52px); border-radius: var(--radius-xl); background: var(--grad-panel); isolation: isolate; }
.form-card { position: relative; background: var(--surface); border-radius: var(--radius-lg); padding: clamp(20px, 3vw, 32px); box-shadow: 0 40px 80px -30px rgba(5, 15, 60, .6); display: flex; flex-direction: column; gap: 10px; }
.form-heading { margin-bottom: 8px; }
.form-heading .eyebrow { margin-bottom: 8px; }
.form-heading h2 { font-size: clamp(26px, 2.8vw, 34px); }
.form-heading p { margin-top: 6px; color: var(--muted); font-size: 14px; }
.field { position: relative; }
.field input, .cselect-trigger, .country-trigger { width: 100%; height: 48px; padding: 0 14px; border: 1px solid var(--line-strong); border-radius: 10px; background-color: var(--surface); font: inherit; font-size: 15px; color: var(--fg); transition: border-color .15s, box-shadow .15s; }
.field input::placeholder { color: var(--subtle); }
.field input:hover, .cselect-trigger:hover, .country-trigger:hover { border-color: #93A3CC; }
.field input:focus, .cselect-trigger:focus, .cselect-trigger.open { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px #C9D6FA; }
.field input.input-invalid { border-color: #C2410C; }
.field-inline-error { font-size: 13px; color: #B42318; margin-top: 6px; }
.form-error { font-size: 13px; color: #B42318; background: #FEF1F0; border: 1px solid #F8CFCB; padding: 10px 12px; border-radius: 10px; }
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 40px #fff inset; -webkit-text-fill-color: var(--fg); }
.phone-wrap { display: grid; grid-template-columns: auto 1fr; gap: 8px; }
.country-select { position: relative; }
.country-trigger { display: inline-flex; align-items: center; gap: 6px; width: auto; padding: 0 12px; font-size: 14px; }
.country-trigger svg { width: 10px; height: 6px; color: var(--subtle); }
.country-dropdown { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; width: 280px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lg); overflow: hidden; }
.country-search { padding: 8px; border-bottom: 1px solid var(--line); }
.country-search input { width: 100%; height: 38px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: 8px; font: inherit; font-size: 14px; }
.country-list { max-height: 240px; overflow-y: auto; padding: 4px; }
.country-option { display: grid; grid-template-columns: 30px 1fr auto; gap: 8px; width: 100%; text-align: left; padding: 8px 10px; border-radius: 8px; font-size: 14px; }
.country-option:hover, .country-option.active { background: var(--bg-soft); }
.country-dial { color: var(--subtle); }
.country-empty { padding: 12px; font-size: 14px; color: var(--subtle); }
.cselect { position: relative; }
.cselect-trigger { text-align: left; padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%2366718C' stroke-width='1.6'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cselect-trigger.placeholder { color: var(--subtle); }
.cselect-menu { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; right: 0; max-height: 260px; overflow-y: auto; padding: 4px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lg); }
.cselect-option { display: block; width: 100%; text-align: left; padding: 9px 12px; border-radius: 8px; font-size: 14px; }
.cselect-option:hover, .cselect-option:focus { background: var(--bg-soft); outline: none; }
.cselect-option:focus-visible { box-shadow: inset 0 0 0 2px var(--brand); }
.cselect-option.selected { color: var(--brand-text); font-weight: 500; }
.form-submit { margin-top: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 52px; border-radius: var(--radius-1); background: var(--brand); color: #fff; font-size: 16px; font-weight: 600; box-shadow: 0 10px 24px -12px var(--brand); transition: background-color .15s; }
.form-submit:hover { background: var(--brand-hover); }
.form-submit:disabled { opacity: .75; cursor: default; }
.form-submit.sent { background: var(--green); }
.form-submit .ic { width: 18px !important; height: 18px !important; }
.form-privacy { font-size: 12px; color: var(--subtle); text-align: center; }
.form-privacy a { color: var(--brand-text); text-decoration: underline; text-underline-offset: 2px; }
.req { color: #B42318; }
.form-urgency-col { color: #fff; }
.form-steps { display: flex; flex-direction: column; max-width: 440px; }
.form-step { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding-bottom: 34px; }
.form-step:not(.form-step-final)::after { content: ""; position: absolute; left: 22px; top: 48px; bottom: 6px; width: 1px; background: rgba(255,255,255,.35); }
.form-step-num { font-family: var(--display); font-weight: 300; font-size: 38px; line-height: 1; letter-spacing: -0.045em; color: #D6E0FF; font-variant-numeric: tabular-nums; }
.form-step h4 { font-size: 20px; color: #fff; }
.form-step p { margin-top: 6px; font-size: 15px; color: #E6ECFF; }
.form-step-final { padding-bottom: 0; }
.form-step-final .form-step-num { color: #fff; }
.form-step-final h4 { font-size: 24px; }
@media (max-width: 900px) {
  .form-grid { grid-template-columns: 1fr; }
  .form-urgency-col { order: -1; }
  .form-steps { flex-direction: row; gap: 12px; max-width: none; }
  .form-step { display: flex; flex-direction: column; gap: 6px; padding: 0; flex: 1; }
  .form-step::after { display: none; }
  .form-step-num { font-size: 20px; }
  .form-step h4, .form-step-final h4 { font-size: 14px; line-height: 1.25; }
  .form-step p { display: none; }
}
@media (max-width: 600px) { .form-section .wrap { width: calc(100% - 16px); } .form-grid { padding: 18px 10px 10px; gap: 18px; border-radius: 20px; } .form-urgency-col { padding: 0 8px; } }

/* ===== Blog (home e listagem) ===== */
.blog-section { background: var(--bg); }
.test-head { text-align: center; margin-bottom: 40px; }
.blog-sub { margin-top: 12px; color: var(--muted); }
.blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.blog-card { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; background: var(--surface); transition: border-color .15s, box-shadow .2s, translate .2s, opacity .6s, transform .6s; }
.blog-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-md); translate: 0 -5px; }
.blog-card-body { padding: 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.blog-card-tag { align-self: flex-start; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; color: var(--brand-text); }
.blog-card-date, .blog-card time { font-size: 12px; color: var(--subtle); }
.blog-card h2, .blog-card h3 { font-size: 19px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.25; }
.blog-card p { font-size: 14.5px; color: var(--muted); }
.blog-card-more { margin-top: auto; padding-top: 8px; font-size: 14px; font-weight: 500; color: var(--brand-text); }
.blog-card-cover { aspect-ratio: 16 / 7; background: var(--grain-dark), var(--navy); position: relative; overflow: hidden; }
.blog-card-cover[data-i="1"] { background: var(--grain-dark), var(--grad-band); }
.blog-card-cover img { width: 100%; height: 100%; object-fit: cover; }
.blog-card-art { position: absolute; inset: 0; display: flex; justify-content: space-between; align-items: flex-end; padding: 16px 18px; }
.blog-card-art img { width: 64px; height: auto; object-fit: contain; }
.blog-card-art span { font-size: 12px; color: #E6ECFF; }
.blog-more-wrap { margin-top: 32px; display: flex; justify-content: center; }
@media (max-width: 900px) { .blog-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .blog-section .blog-card:nth-child(3) { display: none; } .blog-grid { grid-template-columns: 1fr; gap: 12px; } .blog-card-cover { display: none; } .blog-card-body { padding: 18px; } }

.blog-hero { padding: clamp(40px, 6vw, 72px) 0 32px; background: var(--bg); }
.blog-hero-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 32px; align-items: end; }
.blog-hero h1 { font-size: clamp(34px, 5vw, 56px); }
.blog-hero p { margin-top: 12px; color: var(--muted); font-size: 17px; }
.blog-hero-cta { padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); }
.blog-hero-cta p { margin: 0 0 12px; font-size: 15px; }
.blog-back { display: inline-block; margin: 20px 0; font-size: 14px; color: var(--brand-text); }
.blog-filtros { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.blog-filtros-label { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--subtle); }
.blog-filtros-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.blog-filtro { height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-strong); font-size: 14px; background: var(--surface); }
.blog-filtro.on { background: var(--fg); color: #fff; border-color: var(--fg); }
.blog-empty, .blog-loading { padding: 60px 0; text-align: center; color: var(--muted); }
.blog-list-page > .wrap { padding-bottom: 72px; }
@media (max-width: 800px) { .blog-hero-grid { grid-template-columns: 1fr; } }

/* ===== Artigo ===== */
.blog-article-wrap { padding: 8px 0 72px; }
.blog-article { width: min(760px, 100% - var(--gutter) * 2); margin-inline: auto; }
.blog-post-head { display: grid; grid-template-columns: 1fr; gap: 20px; margin-bottom: 32px; }
.blog-title { font-size: clamp(34px, 5vw, 56px); line-height: 1.06; letter-spacing: -0.04em; }
.blog-excerpt { margin-top: 16px; font-size: 19px; color: var(--muted); }
.blog-meta { margin-top: 16px; display: flex; gap: 8px; font-size: 14px; color: var(--subtle); }
.blog-cover-wrap img { width: 100%; border-radius: var(--radius-lg); }
.blog-body { font-size: 18px; line-height: 1.75; color: #232C45; }
.blog-body > * + * { margin-top: 1.1em; }
.blog-body h2 { margin-top: 2em; font-size: 30px; line-height: 1.15; color: var(--fg); }
.blog-body h3 { margin-top: 1.6em; font-size: 21px; color: var(--fg); }
.blog-body ul, .blog-body ol { padding-left: 1.3em; }
.blog-body li + li { margin-top: .4em; }
.blog-body li::marker { color: var(--brand); }
.blog-body a { color: var(--brand-text); text-decoration: underline; text-underline-offset: 3px; }
.blog-body blockquote { padding: 16px 20px; border-left: 3px solid var(--brand); background: var(--surface); border-radius: 0 12px 12px 0; color: var(--fg); }
.blog-body img { border-radius: var(--radius-lg); }
.blog-bridge { margin-top: 48px; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 24px; border-radius: var(--radius-xl); background: var(--grain-dark), var(--grad-band); color: #fff; font-size: 18px; font-weight: 600; }
.blog-bridge:hover { background: var(--grain-dark), var(--brand-hover); }
.blog-bridge svg { flex: none; }
.blog-sell { text-align: center; background: var(--grain-dark), var(--navy); color: var(--on-navy); }
.blog-sell h2 { font-size: clamp(28px, 4vw, 44px); color: #fff; }
.blog-sell p { margin: 14px auto 28px; max-width: 52ch; color: var(--on-navy-muted); }
.blog-inline-editable { outline: 1px dashed var(--line-strong); outline-offset: 4px; }
.blog-inline-bar { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 200; display: flex; gap: 8px; align-items: center; padding: 8px; background: var(--navy); color: #fff; border-radius: 14px; box-shadow: var(--shadow-lg); }
.blog-inline-bar button { height: 36px; padding: 0 14px; border-radius: 9px; background: rgba(255,255,255,.1); }
.blog-inline-bar .bi-save { background: var(--brand); }
.blog-inline-hint { font-size: 13px; padding: 0 8px; color: var(--on-navy-muted); }
.blog-cover-empty { width: 100%; padding: 40px; border: 1px dashed var(--line-strong); border-radius: var(--radius-lg); color: var(--subtle); }
.blog-cover-bar { display: flex; gap: 6px; margin-top: 8px; }
.blog-cover-bar button { padding: 4px 10px; border: 1px solid var(--line); border-radius: 6px; font-size: 13px; }
.blog-cover-bar button.on { background: var(--fg); color: #fff; }
@media (max-width: 600px) { .blog-body { font-size: 16.5px; } .blog-bridge { font-size: 16px; padding: 18px; } }

/* ===== Rodapé ===== */
footer { background: var(--grain-dark), var(--navy); color: var(--on-navy-muted); border-top: 1px solid rgba(255,255,255,.08); padding: 48px 0 28px; font-size: 14px; }
.foot-row { display: grid; grid-template-columns: 1.3fr .8fr 1.4fr 1fr; gap: 32px; align-items: start; padding-bottom: 32px; border-bottom: 1px solid rgba(255,255,255,.08); }
.foot-col h2 { font-family: var(--font); font-size: 12px; font-weight: 600; line-height: 1.3; letter-spacing: .2em; text-transform: uppercase; color: #fff; margin-bottom: 14px; }
.foot-col ul { list-style: none; display: grid; gap: 12px; }
.foot-posts a { line-height: 1.4; }
.foot-posts span { color: var(--on-navy-accent); }
.foot-posts a:hover, .foot-contact a:hover { color: #fff; }
.foot-contact a { display: inline-flex; align-items: center; gap: 8px; }
.foot-contact p { margin-top: 4px; font-size: 13px; }
.foot-logo { width: 96px; height: auto; }
.foot-brand p { margin-top: 14px; max-width: 34ch; }
.foot-links { display: grid; gap: 12px; }
.foot-links a:hover, .foot-meta a:hover { color: #fff; }
.foot-meta { display: flex; flex-wrap: wrap; gap: 8px 24px; padding-top: 20px; font-size: 13px; }
@media (max-width: 900px) { .foot-row { grid-template-columns: 1fr 1fr; } .foot-brand { grid-column: 1 / -1; } }
@media (max-width: 600px) { .foot-row { grid-template-columns: 1fr; gap: 28px; } }


/* ===== Formulário: faixa azul da marca com grão e brilho ===== */
.form-section { background: var(--grad-band); color: #fff; overflow: hidden; isolation: isolate; padding: clamp(64px, 9vw, 112px) 0; }
.form-section::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .2; mix-blend-mode: multiply; background-image: var(--noise); pointer-events: none; }
.form-grid { background: none; padding: 0; border-radius: 0; }
.form-card { color: var(--fg); border-radius: var(--radius-xl); box-shadow: 0 40px 90px -30px rgba(5, 10, 31, .7); }
.form-step:not(.form-step-final)::after { background: rgba(255,255,255,.4); }
.form-step-num { color: #fff; }
.form-step p { color: #EEF2FF; }
@media (max-width: 600px) { .form-section .wrap { width: calc(100% - 32px); } .form-grid { padding: 0; } .form-urgency-col { padding: 0; } }

/* ===== Blog na home ===== */
.blog-section { background: var(--bg-soft); }
.blog-card { border-radius: var(--radius-xl); }

/* ===== CTA final: azul-noite com brilho azul subindo do rodapé ===== */
.final-cta { text-align: center; background: var(--grain-dark), var(--navy); color: var(--on-navy); overflow: hidden; isolation: isolate; }
.final-cta-text { display: flex; flex-direction: column; align-items: center; }
.final-cta-head { font-size: clamp(36px, 6vw, 76px); color: #fff; max-width: 14ch; letter-spacing: -0.045em; }
.final-cta-sub { margin: 18px 0 32px; color: var(--on-navy-muted); font-size: 18px; max-width: 48ch; }

/* ===== Três frentes: card branco, card branco, painel azul-noite com brilho ===== */
.fronts { background: var(--grain-light), var(--bg-soft); }
.fronts-head { display: grid; grid-template-columns: 1fr 1fr; gap: 24px clamp(32px, 5vw, 72px); align-items: end; margin-bottom: clamp(48px, 6vw, 72px); }
.fronts-head .section-sub { margin-top: 0; }
/* Linha com pontos ligando as três frentes */
.fronts-grid { list-style: none; position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.fronts-grid::before { content: ""; position: absolute; left: 28px; right: 28px; top: -28px; height: 1px; background: linear-gradient(90deg, var(--brand), var(--line-strong)); }
.fr-card { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 28px; border-radius: var(--radius-xl); background: var(--surface); border: 1px solid var(--line); transition: transform .45s cubic-bezier(.2,.9,.25,1), box-shadow .45s ease, border-color .3s, opacity .6s; }
.fr-card::before { content: ""; position: absolute; left: 28px; top: -33px; width: 11px; height: 11px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 5px rgba(31, 79, 224, .16); }
.fr-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: var(--line-strong); }
.fr-step { position: absolute; right: 24px; top: 24px; font-size: 12px; font-weight: 600; letter-spacing: .2em; color: var(--subtle); font-variant-numeric: tabular-nums; }
.fr-card .chip-ic { margin-bottom: 10px; }
.fr-card h3 { font-size: clamp(26px, 2.6vw, 32px); font-weight: 300; letter-spacing: -0.035em; }
.fr-card > p { font-size: 15.5px; color: var(--muted); }
.fr-card ul { list-style: none; margin-top: 14px; padding-top: 18px; border-top: 1px solid var(--line); display: grid; gap: 12px; }
.fr-card li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.fr-panel { background: var(--grain-dark), radial-gradient(70% 60% at 100% 100%, rgba(31, 79, 224, .6), transparent 70%), var(--navy); border-color: var(--navy); color: #fff; }
.fr-panel:hover { border-color: var(--navy); }
.fr-panel .chip-ic { background: rgba(255,255,255,.1); }
.fr-panel > p { color: var(--on-dark-muted); }
.fr-panel ul { border-top-color: rgba(255,255,255,.12); }
.fr-panel .fr-step { color: var(--accent-dark); }
.fr-link { margin-top: auto; padding-top: 22px; display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 600; color: var(--accent-dark); }
.fr-link .ic { transition: transform .2s; }
.fr-link:hover .ic { transform: translateX(3px); }
@media (max-width: 960px) {
  .fronts-head { grid-template-columns: 1fr; align-items: start; }
  .fronts-grid { grid-template-columns: 1fr; gap: 12px; padding-left: 28px; }
  .fronts-grid::before { left: 5px; right: auto; top: 30px; bottom: 30px; width: 1px; height: auto; background: linear-gradient(to bottom, var(--brand), var(--line-strong)); }
  .fr-card::before { left: -28px; top: 32px; }
  .fr-card { padding: 22px; }
}

/* ===== Depois do diagnóstico: linha com pontos na horizontal ===== */
.after-label { margin-top: clamp(48px, 6vw, 72px); }
.steps-line { list-style: none; position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding-top: 30px; }
.steps-line::before { content: ""; position: absolute; left: 5px; right: 0; top: 5px; height: 1px; background: linear-gradient(90deg, var(--brand), var(--line)); }
.steps-line li { position: relative; display: grid; gap: 6px; align-content: start; }
.steps-dot { position: absolute; left: 0; top: -30px; width: 11px; height: 11px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 5px rgba(31, 79, 224, .16); }
.steps-line small { font-size: 12px; font-weight: 600; letter-spacing: .2em; color: var(--brand-text); font-variant-numeric: tabular-nums; }
.steps-line b { font-family: var(--display); font-size: 19px; letter-spacing: -0.02em; }
.steps-line p { font-size: 14.5px; color: var(--muted); }
@media (max-width: 900px) {
  .steps-line { grid-template-columns: 1fr; gap: 18px; padding: 0 0 0 28px; }
  .steps-line::before { left: 5px; right: auto; top: 6px; bottom: 6px; width: 1px; height: auto; background: linear-gradient(to bottom, var(--brand), var(--line)); }
  .steps-dot { left: -28px; top: 2px; }
}

/* Grão leve nos fundos claros chapados */

/* ===== Fundos granulados: o GrainShader (21st.dev) em canvas, por seção =====
   Hero, sistema com IA, formulário, conselhos, CTA final e chamada do blog. As
   props de cada fundo ficam em FUNDOS (sections.jsx). Seções claras: liso. */
.hero, .method, .form-section, .ethics, .final-cta, .blog-sell { isolation: isolate; }
.method, .ethics, .final-cta, .blog-sell { background: var(--navy); }
.form-section { background: var(--navy); }
.form-section::before, .form-section::after, .method::before, .ethics::before, .final-cta::before, .final-cta::after, .blog-sell::before { content: none; }
.final-cta { padding-bottom: clamp(140px, 16vw, 220px); overflow: hidden; }
.method, .ethics, .blog-sell { overflow: hidden; }
.pains, .fronts, .audience, .team, .faq, .blog-section, .services { background-image: none; }
.fronts { background: var(--bg-soft); }
/* ===== Movimento reduzido: tudo parado, conteúdo visível ===== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .float, .about-float, .msgs > *, .pr, .faq-a, .typing i, .mock-slot, .pill-dark i, .pulse, .demand-live i { animation: none !important; }
  .fr-card:hover, .bx:hover { transform: none !important; translate: none !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
  .btn-primary:hover, .nav-cta:hover, .blog-card:hover, .audience-card:hover, .team-card:hover { transform: none !important; translate: none !important; }
  html .btn-primary:hover > .ic, html .nav-cta:hover > .ic { width: var(--arrow-w) !important; margin-left: var(--arrow-gap) !important; }
  .btn-primary:hover > .ic svg, .nav-cta:hover > .ic svg { transform: none !important; }
  .marquee-track { animation: none !important; flex-wrap: wrap; justify-content: center; width: auto !important; }
  .marquee-track span[aria-hidden] { display: none; }
  .client-logos { animation: none !important; flex-wrap: wrap; justify-content: center; width: auto; row-gap: 24px; }
  .client-logos li[aria-hidden] { display: none; }
  .marquee-toggle { display: none; }
}

/* =====================================================================
   Componentes do design system (08 Componentes), CSS copiado do original.
   Só o escopo mudou (prefixos .btn.ds, .tag, .ind, .form-card, .bento)
   para não colidir com classes do site. Movimento reduzido como nos arquivos.
   ===================================================================== */

/* ---- Botao.html ---- */
.btn.ds{--x:50%;--y:50%;--mx:0px;--my:0px;position:relative;display:inline-flex;align-items:center;justify-content:flex-start;gap:12px;height:50px;padding:0 22px;border-radius:10px;font:600 15px/1 var(--font);text-decoration:none;border:0;cursor:pointer;isolation:isolate;overflow:hidden;white-space:nowrap;box-shadow:none;
 transform:scale(var(--s,1));transition:transform .5s cubic-bezier(.2,.9,.25,1.2),box-shadow .4s ease,background-color .3s ease;-webkit-tap-highlight-color:transparent}
.btn.ds:hover{transform:none}
.btn.ds:active{--s:.97;transition-duration:.12s}
.btn.ds:focus-visible{outline:2px solid #8FAEFF;outline-offset:3px}
.btn.ds::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.16),transparent 60%);opacity:0;transition:opacity .35s ease}
.btn.ds:hover::before{opacity:1}
.btn.ds.p{background:#1F4FE0;color:#fff;padding-right:0;box-shadow:0 10px 30px -10px rgba(31,79,224,.75),inset 0 1px 0 rgba(255,255,255,.18)}
.btn.ds.p:hover{background:#2A5BF0;box-shadow:0 18px 40px -12px rgba(31,79,224,.9),0 0 0 6px rgba(31,79,224,.14),inset 0 1px 0 rgba(255,255,255,.22)}
.btn.ds.p .lb{position:relative;display:inline-block;overflow:hidden;height:18px}
.btn.ds.p .lb span{display:block;line-height:18px;transition:transform .55s cubic-bezier(.65,0,.2,1)}
.btn.ds.p .lb span+span{position:absolute;left:0;top:0;transform:translateY(110%)}
.btn.ds.p:hover .lb span:first-child{transform:translateY(-110%)}
.btn.ds.p:hover .lb span+span{transform:translateY(0)}
.btn.ds.p .ar{position:relative;display:inline-grid;place-items:center;width:50px;height:50px;border-left:1px solid rgba(255,255,255,.22);overflow:hidden;transition:background-color .4s ease}
.btn.ds.p:hover .ar{background:rgba(255,255,255,.12)}
.btn.ds.p .ar svg{grid-area:1/1;transition:transform .55s cubic-bezier(.65,0,.2,1)}
.btn.ds.p .ar svg+svg{transform:translateX(-46px)}
.btn.ds.p:hover .ar svg:first-child{transform:translateX(46px)}
.btn.ds.p:hover .ar svg+svg{transform:translateX(0)}
.btn.ds.p::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;z-index:1;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg) translateX(0);animation:sheen 5s cubic-bezier(.6,0,.2,1) infinite}
@keyframes sheen{0%,70%{transform:skewX(-18deg) translateX(0)}100%{transform:skewX(-18deg) translateX(520%)}}
.btn.ds.v{background:rgba(255,255,255,.06);color:#EDF1FB;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn.ds.v .rim{position:absolute;inset:0;border-radius:inherit;padding:1px;z-index:-1;background:conic-gradient(from var(--a,0deg),rgba(255,255,255,.14) 0 60%,#8FAEFF 75%,rgba(255,255,255,.14) 90%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.6;transition:opacity .4s}
.btn.ds.v:hover .rim{opacity:1;animation:spin 2.4s linear infinite}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes spin{to{--a:360deg}}
.btn.ds.v.lt{background:#fff;color:#0E1630}
.btn.ds.v.lt .rim{background:conic-gradient(from var(--a,0deg),#E3E6EE 0 60%,#1F4FE0 75%,#E3E6EE 90%)}
.btn.ds.lt::before{background:linear-gradient(180deg,rgba(31,79,224,.06),transparent 70%)}
.btn.ds.p.lt::before{background:linear-gradient(180deg,rgba(255,255,255,.16),transparent 60%)}
.btn.ds.pl{border-radius:999px;height:44px;padding:0 20px;font-weight:500}
.btn.ds.pl i{width:8px;height:8px;border-radius:50%;background:#8FAEFF;box-shadow:0 0 0 0 rgba(143,174,255,.5);animation:pulse 2.2s ease-out infinite}
.btn.ds.t{background:none;color:#8FAEFF;padding:0 2px;height:auto;overflow:visible}
.btn.ds.t.lt{color:#2348C8}
.btn.ds.t::before{display:none}
.btn.ds.t u{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;padding-bottom:5px;transition:background-size .5s cubic-bezier(.65,0,.2,1)}
.btn.ds.t:hover u{background-size:0 1.5px;background-position:100% 100%;animation:draw .9s .25s cubic-bezier(.65,0,.2,1) forwards}
@keyframes draw{0%{background-size:0 1.5px;background-position:0 100%}100%{background-size:100% 1.5px;background-position:0 100%}}
.btn.ds.t svg{transition:transform .45s cubic-bezier(.2,.9,.25,1.2)}
.btn.ds.t:hover svg{transform:translate(3px,-3px)}
/* Encaixe no site: botão do nav menor, foco azul nos fundos claros, envio do formulário */
.btn.ds.nav-cta{height:40px;font-size:14px;padding-left:16px;--arrow-w:auto}
.btn.ds.nav-cta .ar{width:40px;height:40px}
.btn.ds.lt:focus-visible,.pains .btn.ds:focus-visible,.services .btn.ds:focus-visible:not(.svc-cta),.faq .btn.ds:focus-visible,.blog-section .btn.ds:focus-visible,.form-card .btn.ds:focus-visible,.blog-list-page .btn.ds:focus-visible{outline-color:#1F4FE0}
.form-card .form-submit.btn.ds{width:100%;height:52px;justify-content:space-between;padding-left:22px}
.form-card .form-submit.btn.ds .ar{height:52px;width:52px}
.form-card .form-submit.btn.ds[disabled]{justify-content:center;padding-right:22px;cursor:default}
.form-card .form-submit.btn.ds.sent{background:var(--green)}
@media (max-width:560px){.btn.ds.nav-cta{font-size:13px;padding-left:12px}.btn.ds.nav-cta .ar{width:36px}}

/* ---- Rotulo.html ---- */
.eyebrow b{color:var(--brand-text);margin-right:14px;font-weight:600}
.method .eyebrow b,.ethics .eyebrow b,.attend .eyebrow b,.blog-sell .eyebrow b{color:#8FAEFF}
.count{display:flex;align-items:center;gap:12px;font:500 13px/1 var(--font);color:var(--muted)}.count b{color:var(--fg)}
.count i{position:relative;width:60px;height:1px;background:var(--line-strong);overflow:hidden}.count i::after{content:"";position:absolute;inset:0;width:10%;background:var(--brand);animation:prog 2.4s cubic-bezier(.65,0,.2,1) infinite alternate}
@keyframes prog{to{width:100%}}
.live-panel .count{color:#A3AECB}.live-panel .count b{color:#EDF1FB}.live-panel .count i{background:rgba(255,255,255,.15)}.live-panel .count i::after{background:#8FAEFF}
.tag{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:999px;font:500 13px/1 var(--font);animation:pop .6s cubic-bezier(.2,.9,.25,1.3) both}
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.96)}}
.tag.glass{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#EDF1FB}
.tag.live i{width:7px;height:7px;border-radius:50%;background:#8FAEFF;animation:pulse 2s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(143,174,255,.6)}80%,100%{box-shadow:0 0 0 8px rgba(143,174,255,0)}}
.tag.grad{position:relative;background:rgba(10,18,51,.6);color:#EDF1FB}
.tag.grad::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(90deg,#1F4FE0,#8FAEFF,#1F4FE0);background-size:200% 100%;animation:sh 4s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
@keyframes sh{to{background-position:200% 0}}
.tag.st{background:rgba(255,255,255,.04);border:1px solid;height:28px;padding:0 11px;font-size:12px;animation:none}
.tag.st.ok{color:#4ADE80;border-color:rgba(74,222,128,.35)}.tag.st.wa{color:#FBBF24;border-color:rgba(251,191,36,.35)}.tag.st.da{color:#F87171;border-color:rgba(248,113,113,.35)}
.tag.st svg{flex:none}

/* ---- Indicador.html ---- */
.ind{margin-top:14px}
.ind .wrap-k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ind .k{position:relative;overflow:hidden;isolation:isolate;padding:24px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.1);display:grid;gap:14px;transition:border-color .3s,transform .4s cubic-bezier(.2,.9,.25,1)}
.ind .k:hover{border-color:rgba(143,174,255,.35);transform:translateY(-3px)}
.ind .k.hl{background:linear-gradient(140deg,#1638B0 0%,#1F4FE0 55%,#2E5AE8 100%);border-color:transparent}
.ind .k.hl::after{content:"";position:absolute;z-index:-1;width:420px;height:420px;right:-180px;top:-220px;border-radius:50%;background:radial-gradient(circle,rgba(160,190,255,.4),transparent 62%)}
.ind .top{display:flex;justify-content:space-between;align-items:center}
.ind .eb{font:600 11px/1 var(--font);letter-spacing:.2em;text-transform:uppercase;color:#A3AECB}
.ind .hl .eb{color:#fff;opacity:.85}
.ind .n{font:300 54px/1 var(--display);letter-spacing:-.045em;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:8px;color:#EDF1FB}
.ind .n small{font:400 18px/1 var(--font);letter-spacing:0;color:#A3AECB}
.ind .hl .n small{color:#fff;opacity:.8}
.ind svg.sp{width:100%;height:46px;overflow:visible}
.ind svg.sp path.l{fill:none;stroke:#8FAEFF;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.4s cubic-bezier(.65,0,.2,1) .2s}
.ind svg.sp path.a{fill:url(#indg);opacity:0;transition:opacity .8s ease 1s}
.ind .hl svg.sp path.l{stroke:#fff}
.ind .on svg.sp path.l{stroke-dashoffset:0}.ind .on svg.sp path.a{opacity:1}
.ind svg.sp circle{fill:#8FAEFF;opacity:0;transition:opacity .3s 1.5s}.ind .hl svg.sp circle{fill:#fff}.ind .on svg.sp circle{opacity:1}
.ind .d{font:400 13px/1.4 var(--font);color:#A3AECB}.ind .hl .d{color:#fff;opacity:.85}
.ind .goal{height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.ind .goal i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#1F4FE0,#8FAEFF);transition:width 1.4s cubic-bezier(.65,0,.2,1) .3s}
.ind-nota{margin-top:12px;font:400 12px/1 var(--font);color:#8C98BA}
@media (max-width:640px){.ind .wrap-k{grid-template-columns:1fr}.ind .n{font-size:46px}}

/* ---- Campo.html (formulário de diagnóstico) ---- */
.form-card .f{position:relative;display:grid;gap:8px}
.form-card .box{position:relative;height:58px;border-radius:12px;background:#fff;border:1px solid #C5CAD6;display:flex;align-items:center;gap:12px;padding:0 16px;transition:border-color .25s ease,box-shadow .35s cubic-bezier(.2,.9,.25,1)}
.form-card .box svg.ic{flex:none;color:#858FA8;transition:color .25s}
.form-card .box input{all:unset;flex:1;min-width:0;height:100%;padding-top:16px;font:400 15px/1 var(--font);color:#0E1630}
.form-card .box label{position:absolute;left:46px;top:50%;transform:translateY(-50%);font:400 15px/1 var(--font);color:#4D5873;pointer-events:none;transform-origin:0 0;transition:transform .3s cubic-bezier(.65,0,.2,1),color .25s,top .3s cubic-bezier(.65,0,.2,1)}
.form-card .box input:focus+label,.form-card .box input:not(:placeholder-shown)+label,.form-card .box.sel.has label,.form-card .box.sel:focus-within label{top:14px;transform:translateY(-50%) scale(.78);color:#4D5873;font-weight:600}
.form-card .box:focus-within{border-color:#1F4FE0;box-shadow:0 0 0 4px rgba(31,79,224,.14),0 10px 24px -14px rgba(31,79,224,.5)}
.form-card .box:focus-within svg.ic{color:#1F4FE0}
.form-card .box:focus-within label{color:#1F4FE0}
.form-card .hint{font:400 13px/1.4 var(--font);color:#4D5873;display:flex;justify-content:space-between}
.form-card .err .box{border-color:#C2331F;box-shadow:0 0 0 4px rgba(194,51,31,.10)}
.form-card .err .box svg.ic,.form-card .err .box label{color:#C2331F}
.form-card .err .hint{color:#A82A18}
.form-card .msg{display:flex;align-items:center;gap:6px;animation:in .4s cubic-bezier(.2,.9,.25,1) both}
@keyframes in{from{opacity:0;transform:translateY(-4px)}}
.form-card .ok{position:absolute;right:14px;top:50%;width:22px;height:22px;border-radius:50%;background:linear-gradient(160deg,#5C86FF,#2448D8);display:grid;place-items:center;transform:translateY(-50%) scale(0);transition:transform .45s cubic-bezier(.2,.9,.25,1.4)}
.form-card .valid .ok{transform:translateY(-50%) scale(1)}
.form-card .chev{flex:none;color:#4D5873;pointer-events:none}
/* select do Campo: o gatilho do CSelect ocupa a caixa e o rótulo sobe quando há valor */
.form-card .box.sel .cselect{position:static;flex:1;min-width:0;height:100%}
.form-card .box.sel .cselect-trigger{all:unset;box-sizing:border-box;display:block;width:100%;height:100%;padding-top:20px;font:400 15px/1.2 var(--font);color:#0E1630;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.form-card .box.sel .cselect-menu{left:0;right:0;top:calc(100% + 6px)}
.form-card .phone-wrap{display:grid;grid-template-columns:auto 1fr;gap:8px}
.form-card .country-trigger{height:58px;border-radius:12px;border-color:#C5CAD6}
.form-card .country-trigger:focus-visible{border-color:#1F4FE0;box-shadow:0 0 0 4px rgba(31,79,224,.14);outline:none}

/* ---- CardServico.html (bento das dores) ---- */
.bento{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.bento .c{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:24px;background:#fff;border:1px solid #E3E6EE;color:#0E1630}
.bento .c h3{margin:6px 0 0;font:600 19px/1.2 var(--display);letter-spacing:-.02em}
.bento .c p{margin:0;font-size:14.5px;line-height:1.5;color:#4D5873;max-width:44ch}
.bento .ci{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#0A1233;color:#fff}
.bento .n{background:#0A1233;border-color:#0A1233;color:#fff}.bento .n p{color:#C2C8D6}.bento .n .ci,.bento .g .ci{background:rgba(255,255,255,.1)}
.bento .g{background:linear-gradient(140deg,#1638B0 0%,#1F4FE0 55%,#2E5AE8 100%);border-color:transparent;color:#fff}.bento .g p{color:#fff}
.bento .g::after{content:"";position:absolute;z-index:-1;width:520px;height:520px;right:-200px;top:-260px;border-radius:50%;background:radial-gradient(circle,rgba(160,190,255,.4),transparent 62%)}
.bento .k0{grid-column:span 2;grid-row:span 2}.bento .k1{grid-column:span 4}.bento .k2,.bento .k3{grid-column:span 2}.bento .k4,.bento .k5{grid-column:span 3}
.bento .ag{margin-top:auto;padding-top:18px;display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.bento .ag i{height:22px;border-radius:6px;background:rgba(255,255,255,.1)}.bento .ag i.f{background:none;border:1px dashed rgba(143,174,255,.6)}
.bento .tm{margin-top:12px;display:grid;gap:6px}.bento .tm span{display:block;height:7px;border-radius:99px;background:#F5F6F9;border:1px solid #E3E6EE}.bento .tm span.on{background:#1F4FE0;border-color:#1F4FE0;width:38%}.bento .tm span:nth-child(2){width:72%}.bento .tm span:nth-child(3){width:94%}
.bento .c{transition:transform .45s cubic-bezier(.2,.9,.25,1),box-shadow .45s ease,border-color .3s}
.bento .c:hover{transform:translateY(-4px);box-shadow:0 22px 44px -22px rgba(14,30,90,.35);border-color:#C5CAD6}
.bento .n:hover,.bento .g:hover{border-color:transparent}
.bento .ci{transition:transform .5s cubic-bezier(.2,.9,.25,1.4)}
.bento .c:hover .ci{transform:scale(1.08) rotate(-4deg)}
.bento .ag i.f{animation:vaga 2.4s ease-in-out infinite}
.bento .ag i.f:nth-of-type(3n){animation-delay:.6s}.bento .ag i.f:nth-of-type(3n+1){animation-delay:1.2s}
@keyframes vaga{0%,100%{border-color:rgba(143,174,255,.35);background:none}50%{border-color:#8FAEFF;background:rgba(143,174,255,.12)}}
.bento .tm span.on{animation:fill 2.6s cubic-bezier(.65,0,.2,1) infinite}
@keyframes fill{0%{width:8%}60%,100%{width:38%}}
.bento .g::after{animation:glow 6s ease-in-out infinite alternate}
@keyframes glow{to{transform:translate(-60px,40px)}}
@media (max-width:1020px){.bento{grid-template-columns:repeat(2,minmax(0,1fr))}.bento .k0,.bento .k1{grid-column:span 2;grid-row:auto}.bento .k2,.bento .k3,.bento .k4,.bento .k5{grid-column:span 1}}
@media (max-width:640px){.bento{grid-template-columns:1fr!important}.bento>.c{grid-column:auto!important;grid-row:auto!important}.bento .c{padding:20px}}

/* ---- Logo.html (entrada e hover) ---- */
@keyframes up{from{opacity:0;transform:translateY(10px)}}
.logo-in img,.foot-logo{animation:up .8s cubic-bezier(.2,.9,.25,1) both;transition:transform .6s cubic-bezier(.2,.9,.25,1)}
.logo-in:hover img,.foot-brand:hover .foot-logo{transform:scale(1.04)}
.logo-tile{animation:up .8s cubic-bezier(.2,.9,.25,1) both;transition:transform .45s cubic-bezier(.2,.9,.25,1),box-shadow .45s}
.logo-tile:hover{transform:translateY(-3px);box-shadow:0 22px 44px -22px rgba(14,30,90,.4)}
.logo-tile img{transition:transform .6s cubic-bezier(.2,.9,.25,1)}
.logo-tile:hover img{transform:scale(1.04)}

/* ---- Simbolo.html (pop e brilho no hover), nos quadrados de ícone ---- */
.chip-ic,.team-icon,.svc-icon{position:relative;overflow:hidden;isolation:isolate;transition:transform .45s cubic-bezier(.2,.9,.25,1.3),box-shadow .45s}
.chip-ic::after,.team-icon::after,.svc-icon::after{content:"";position:absolute;inset:-20%;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.35) 50%,transparent 60%);transform:translateX(-120%);transition:transform .9s cubic-bezier(.65,0,.2,1)}
.fr-card:hover .chip-ic::after,.team-card:hover .team-icon::after,.audience-card:hover .svc-icon::after,.ethics-list li:hover .chip-ic::after{transform:translateX(120%)}
.fr-card:hover .chip-ic,.team-card:hover .team-icon,.audience-card:hover .svc-icon{transform:translateY(-2px) scale(1.03)}
.is-visible .chip-ic,.is-visible .team-icon,.is-visible .svc-icon{animation:popi .7s cubic-bezier(.2,.9,.25,1.35) .15s both}
@keyframes popi{from{opacity:0;transform:scale(.85)}}

/* ---- SlideCapa.html (rise, pulse, breathe) ---- */
.rise{display:inline-block;animation:rise 1s cubic-bezier(.2,.9,.25,1) both}
.hero-headline .rise{display:block}
p.rise,div.rise{display:block}.hero-actions.rise{display:flex}
@keyframes rise{from{opacity:0;transform:translateY(40px)}}
.d1{animation-delay:.1s}.d2{animation-delay:.22s}.d3{animation-delay:.34s}.d4{animation-delay:.46s}.d5{animation-delay:.58s}
.final-cta-head .rise{display:block}
/* Entrada das seções: o rise da capa, em cascata por item (app.jsx) */
[data-reveal]{opacity:0;transform:none;transition:none}
[data-reveal].is-visible{opacity:1;animation:rise 1s cubic-bezier(.2,.9,.25,1) both}
/* Painel azul-noite com brilho: o brilho respira como na capa */
.svc-card.featured::after{animation:breathe 8s ease-in-out infinite alternate}
@keyframes breathe{to{transform:translateY(-50%) translate(-120px,60px) scale(1.06)}}

@media (prefers-reduced-motion:reduce){
  .btn.ds,.btn.ds *,.btn.ds::before,.btn.ds::after{animation:none!important;transition:none!important}.btn.ds{transform:none!important}
  .tag,.tag *,.tag::before,.count i::after,.ind *,.form-card .box,.form-card .box *,.form-card .msg,.bento .c,.bento .c *,.bento .c::after,.logo-in img,.foot-logo,.logo-tile,.logo-tile img,.chip-ic,.team-icon,.svc-icon,.rise,[data-reveal],.svc-card.featured::after{animation:none!important;transition:none!important}
  .bento .c:hover,.ind .k:hover,.logo-tile:hover{transform:none}
}

/* Painel ao vivo sobre o azul-noite, como o Indicador e o Rotulo foram desenhados */
.live-panel{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);color:#EDF1FB;box-shadow:none}
.live-top{padding:14px 16px}
.live-top .eb{font:600 11px/1.3 var(--font);letter-spacing:.2em;text-transform:uppercase;color:#A3AECB}.live-top .eb b{color:#8FAEFF;margin-right:14px}
.live .tbl-scroll{border-color:rgba(255,255,255,.1)}
.live .tbl th{background:rgba(255,255,255,.04);color:#A3AECB;border-bottom-color:rgba(255,255,255,.1)}
.live .tbl td{border-bottom-color:rgba(255,255,255,.08)}
.live .tbl .mono{color:#A3AECB}
@keyframes rowin2{from{background:rgba(143,174,255,.14)}to{background:transparent}}
.live .tbl tr.new td{animation:rowin2 .9s ease}
.after-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:clamp(48px,6vw,72px) 0 22px}
.after-row .after-label{margin:0}
.audience-card p{margin-top:8px;font-size:15px;color:var(--muted)}
.audience-card h3{border-bottom:0;padding-bottom:0}
.form-heading h2 em{color:var(--brand)}
.form-card{gap:14px}

.tag.rise{display:inline-flex}
@media (max-width:640px){.live .tbl td{white-space:normal}.live .tag.st{padding:0 8px;gap:5px}.live .tag.st svg{display:none}.live-top{flex-wrap:wrap;gap:8px}}
.live .tag.st{white-space:nowrap}
@media (max-width:640px){.live .tbl th,.live .tbl td{padding:11px 8px}}

/* Botao: o ímã e o brilho consomem --mx/--my e --x/--y (alimentados em sections.jsx) */
.btn.ds,.btn.ds:hover{transform:none}
.btn.ds:hover::before{background:radial-gradient(140px circle at var(--x) var(--y),rgba(255,255,255,.22),transparent 60%),linear-gradient(180deg,rgba(255,255,255,.16),transparent 60%)}
.btn.ds.lt:not(.p):hover::before{background:radial-gradient(140px circle at var(--x) var(--y),rgba(31,79,224,.10),transparent 60%),linear-gradient(180deg,rgba(31,79,224,.06),transparent 70%)}
.btn.ds.t{transform:none}
@media (prefers-reduced-motion:reduce){.btn.ds,.btn.ds:hover{transform:none!important}}

/* ===== Pedaços de interface de marketing (hero, dores e bento de marketing) ===== */
.estrelas{display:inline-flex;gap:1px;color:#F5A524}
.estrelas .ic{width:12px!important;height:12px!important}
.g-nota{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600}
.g-nota small{font-weight:400;color:#5A6580}
/* Hero: busca no Google no celular */
.screen-light .g-busca{margin:14px 12px 10px;display:flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:12.5px;color:#0E1630;box-shadow:0 4px 14px -8px rgba(14,30,90,.3)}
.screen-light .g-busca .ic{color:#5A6580}
.g-anuncio{margin:0 12px 8px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;gap:3px;animation:msgin .5s .4s both}
.g-anuncio small{font-size:10.5px;font-weight:600;color:#0E1630}
.g-anuncio b{font-size:13.5px;color:#1C47CF;font-weight:600}
.g-anuncio p{font-size:11.5px;color:#4D5873}
.g-perfil{margin:0 12px 8px;padding:12px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;gap:5px;animation:msgin .5s .9s both}
.g-perfil b{font-size:15px;font-family:var(--display);color:#0E1630}
.g-perfil > small{font-size:11px;color:#4D5873}
.g-acoes{margin-top:4px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.g-acoes span{height:28px;display:grid;place-items:center;border-radius:999px;border:1px solid var(--line-strong);font-size:11px;font-weight:600;color:#1C47CF}
.g-acoes span.on{background:#1F4FE0;border-color:#1F4FE0;color:#fff}
.g-review{margin:0 12px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid var(--line);display:grid;gap:4px;animation:msgin .5s 1.4s both}
.g-review p{font-size:11.5px;line-height:1.4;color:#0E1630}
.g-review small{font-size:10px;color:#5A6580}
/* Hero: WhatsApp como complemento */
.float-zap{display:grid;gap:8px}
.zap-h{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600}
.zap-h .chat-av{width:24px;height:24px}
.zap-h small{margin-left:auto;font-size:11px;font-weight:400;color:var(--on-navy-muted)}
.float-zap .m{max-width:none;font-size:12px}
.float-zap .tag{justify-self:start}
/* Dores: barra de busca e grade de posts */
.bento .sb{margin-top:auto;padding-top:16px;display:grid;gap:6px}
.bento .sb > span{display:flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:999px;font-size:12px}
.bento .sb .sb-bar{background:rgba(255,255,255,.95);color:#0E1630}
.bento .sb .sb-bar .ic{color:#5A6580}
.bento .sb .sb-r{background:rgba(255,255,255,.14);color:#fff;justify-content:space-between;border-radius:8px}
.bento .sb .sb-r.voce{background:none;border:1px dashed rgba(255,255,255,.5);color:#E6ECFF}
.bento .pg{margin-top:auto;padding-top:14px;display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.bento .pg i{aspect-ratio:1;border-radius:6px;background:#E8EEFD;display:grid;place-items:center;color:#1F4FE0}
.bento .pg i:nth-child(2n){background:#0A1233;color:#fff}
.bento .pg i:nth-child(3n){background:linear-gradient(140deg,#1638B0,#2E5AE8);color:#fff}
/* Bento de marketing: outro arranjo, para não repetir o das dores */
.bento.mk .m0,.bento.mk .m1{grid-column:span 3}
.bento.mk .m2,.bento.mk .m3,.bento.mk .m4{grid-column:span 2}
.bento.mk .m5{grid-column:span 6}
.bento .mk-f{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#5A6580;margin-bottom:4px}
.bento .n .mk-f,.bento .g .mk-f{color:#C9D6FF}
.bento .mk-ad{margin-top:auto;padding:14px;border-radius:14px;background:rgba(255,255,255,.95);color:#0E1630;display:grid;gap:3px;max-width:340px}
.bento .mk-ad small{font-size:10.5px;font-weight:600}
.bento .mk-ad b{font-size:15px;color:#1C47CF}
.bento .mk-ad p{font-size:12.5px;color:#4D5873}
.bento .mk-ad span{justify-self:start;margin-top:6px;height:28px;padding:0 14px;display:grid;place-items:center;border-radius:999px;background:#1F4FE0;color:#fff;font-size:12px;font-weight:600}
.bento .mk-rev{margin-top:auto;padding-top:14px;display:grid;gap:8px}
.bento .mk-rev p{font-size:13px;color:#0E1630;padding:10px 12px;border-radius:12px;background:#F5F6F9;border:1px solid #E3E6EE;max-width:none}
.bento .mk-rev p.resp{margin-left:24px;background:#fff;color:#4D5873}
.bento .mk-page{margin-top:auto;padding:12px;border-radius:12px;border:1px solid #E3E6EE;background:#F5F6F9;display:grid;gap:7px}
.bento .mk-page i{height:8px;width:40%;border-radius:99px;background:#C5CAD6}
.bento .mk-page b{height:10px;border-radius:99px;background:#0A1233;width:80%}.bento .mk-page b.s{width:60%;background:#C5CAD6;height:8px}
.bento .mk-page span{justify-self:start;height:26px;padding:0 12px;display:grid;place-items:center;border-radius:8px;background:#1F4FE0;color:#fff;font-size:11.5px;font-weight:600}
.bento .mk-ed{list-style:none;margin-top:auto;padding-top:12px;display:grid;gap:6px}
.bento .mk-ed li{display:flex;gap:10px;align-items:center;font-size:13px;color:#0E1630;padding:8px 10px;border-radius:10px;background:#F5F6F9;border:1px solid #E3E6EE}
.bento .mk-ed span{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#1C47CF;width:28px}
.bento .mk-grid{grid-template-columns:repeat(6,minmax(0,1fr));max-width:620px}
@media (max-width:1020px){.bento.mk .m0,.bento.mk .m1,.bento.mk .m5{grid-column:span 2}.bento.mk .m2,.bento.mk .m3,.bento.mk .m4{grid-column:span 1}}
@media (max-width:640px){.bento .pg{grid-template-columns:repeat(3,1fr)}.bento .mk-ad{max-width:none}}
.bento .mk-pos{margin-top:auto;padding-top:14px;display:flex;flex-wrap:wrap;gap:8px}
.bento .mk-pos span{height:30px;padding:0 12px;display:inline-flex;align-items:center;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);font-size:12.5px;color:#EDF1FB}
.bento .mk-pos span:last-child{border-color:#8FAEFF;color:#8FAEFF}
.attend .ind{margin-top:clamp(40px,5vw,64px)}

/* Pedido do João (03/11): nada sobe, cresce ou gira no hover. Fica só cor, borda,
   brilho e a seta/rótulo deslizando dentro do botão. */
.btn-primary:hover, .nav-cta:hover, .fr-card:hover, .ind .k:hover, .bento .c:hover,
.bento .c:hover .ci, .logo-in:hover img, .foot-brand:hover .foot-logo, .logo-tile:hover,
.logo-tile:hover img, .fr-card:hover .chip-ic, .team-card:hover .team-icon,
.audience-card:hover .svc-icon, .blog-card:hover, .audience-card:hover, .team-card:hover,
.bx:hover { transform: none !important; }

/* ===== Rodada 5: estrutura nova (serviços, método, resultados, como começa) ===== */
/* Hero: linha de prova */
.hero-prova{list-style:none;margin-top:28px;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.hero-prova li{display:grid;gap:2px;justify-items:center;padding:12px 18px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);min-width:200px}
.hero-prova b{font-family:var(--display);font-weight:400;font-size:22px;letter-spacing:-.03em;color:#fff}
.hero-prova span{font-size:12.5px;color:#C2C8D6}
@media (max-width:640px){.hero-prova{flex-direction:column;align-items:stretch;width:100%}.hero-prova li{min-width:0}}
/* Resultados: Indicador sobre azul-noite */
.resultados{background:var(--navy);color:var(--on-navy);padding:clamp(56px,7vw,88px) 0}
.resultados .section-title{color:#fff;margin-bottom:clamp(24px,3vw,36px)}
.resultados .section-title em{color:var(--accent-dark)}
.resultados .ind{margin-top:0}
.ind .n .pre{font:400 22px/1 var(--display);color:#fff;opacity:.85;letter-spacing:0;align-self:flex-start;margin-top:6px}
.ind .k.logo-k{background:#fff;border-color:#fff}
.ind .k.logo-k .eb{color:#4D5873}
.ind .k.logo-k .d{color:#4D5873}
.ind .k-logo{width:auto;height:46px;max-width:100%;object-fit:contain;justify-self:start}
/* Serviços: 7 cards */
.bento.mk .s0,.bento.mk .s1{grid-column:span 3}
.bento.mk .s2,.bento.mk .s3,.bento.mk .s4{grid-column:span 2}
.bento.mk .s5,.bento.mk .s6{grid-column:span 3}
.bento .mk-zap{margin-top:auto;padding-top:14px;display:grid;gap:8px}
.bento .mk-zap .m{max-width:88%;font-size:12.5px}
.bento .mk-zap .m.in{background:#1C2550;color:#EDF1FB}
.bento .mk-rel{list-style:none;margin-top:auto;padding-top:14px;display:grid;gap:8px}
.bento .mk-rel li{display:grid;grid-template-columns:130px 1fr;align-items:center;gap:10px;font-size:12.5px;color:#4D5873}
.bento .mk-rel i{display:block;height:8px;border-radius:99px;background:#C5CAD6}
.bento .mk-rel i.on{background:#1F4FE0}
@media (max-width:1020px){.bento.mk .s0,.bento.mk .s1,.bento.mk .s5,.bento.mk .s6{grid-column:span 2}.bento.mk .s2,.bento.mk .s3,.bento.mk .s4{grid-column:span 1}.bento.mk .s4{grid-column:span 2}}
/* Método AION */
.metodo{background:var(--bg)}
.metodo-line{grid-template-columns:repeat(4,minmax(0,1fr));padding-top:34px}
.metodo-line li{gap:8px}
.met-l{font-family:var(--serif);font-weight:400;font-size:clamp(64px,7vw,96px);line-height:.9;color:var(--brand)}
.metodo-line b{font-size:20px}
.metodo-line p{font-size:15px}
/* Como começa: 4 passos */
.comeca-line{grid-template-columns:repeat(4,minmax(0,1fr))}
.services .services-head{align-items:center}
.services .comeca-cta{justify-self:end}
@media (max-width:900px){.metodo-line,.comeca-line{grid-template-columns:1fr}.services .comeca-cta{justify-self:start}}
/* Para quem: 4 cards; equipe: 5 papéis */
.audience-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.audience-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.audience-grid{grid-template-columns:1fr}}
.team-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1100px){.team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.team-grid{grid-template-columns:1fr 1fr}}
.bento .mk-zap .m.out{color:#fff}.bento .mk-zap .m.in{color:#EDF1FB}.bento .mk-zap .m time{color:inherit}

/* ===== Frente A, home da estratégia (identificação, calculadora, virada, relatório, objetivos, AION OS, duas opções) ===== */
/* Identificação: as quatro cenas no bento do CardServico (arranjo original do DS) */
.bento.ident .k0{grid-column:span 2;grid-row:span 2}.bento.ident .k1{grid-column:span 4}.bento.ident .k2,.bento.ident .k3{grid-column:span 2}
.bento.ident .k3{grid-column:span 2}
.bento .c p.cena{font:400 clamp(19px,1.7vw,23px)/1.3 var(--display);letter-spacing:-.02em;color:inherit;max-width:30ch;margin-top:6px}
.bento .n p.cena,.bento .g p.cena{color:#fff}
.pains-head{align-items:end}
@media (max-width:1020px){.bento.ident .k0,.bento.ident .k1{grid-column:span 2;grid-row:auto}.bento.ident .k2,.bento.ident .k3{grid-column:span 1}}

/* Calculadora: Campo no cartão branco, Indicador no azul-noite */
.calc{background:var(--navy);color:var(--on-navy);isolation:isolate;overflow:hidden}
.calc .section-title{color:#fff}.calc .section-title em{color:var(--accent-dark)}
.calc .section-sub{color:var(--on-navy-muted)}
.calc-head{display:grid;grid-template-columns:1fr 1fr;gap:24px clamp(32px,5vw,72px);align-items:end;margin-bottom:clamp(28px,4vw,44px)}
.calc-head .section-sub{margin-top:0}
.calc-grid{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:16px;align-items:stretch}
.calc-card{gap:14px;box-shadow:none}
.calc-card .box input{padding-right:70px}
.calc-suf{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:13px;color:#5A6580}
.calc-nota{font-size:13px;line-height:1.5;color:#4D5873;margin-top:4px}
.calc-res{margin-top:0;display:grid;gap:14px}
.calc-res .wrap-k{grid-template-columns:repeat(3,minmax(0,1fr))}
.calc-res .k{gap:10px}
.calc-res .n{font-size:clamp(28px,3vw,42px)}
.calc-res .k.hl .n{font-size:clamp(32px,3.6vw,50px)}
.calc-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-radius:24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.calc-cta p{color:#EDF1FB;font-size:15.5px}
@media (max-width:1020px){.calc-head,.calc-grid{grid-template-columns:1fr}.calc-res .wrap-k{grid-template-columns:1fr 1fr}.calc-res .k.hl{grid-column:1/-1}}
@media (max-width:480px){.calc-res .wrap-k{grid-template-columns:1fr}}

/* Virada: tabela comparativa */
.virada{background:var(--bg)}
.virada .section-title{max-width:22ch;margin-bottom:clamp(28px,4vw,44px)}
.cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:15px}
.cmp thead th{padding:0 20px 14px;text-align:left;font:600 12px/1.3 var(--font);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.cmp thead .cmp-aion img{height:24px;width:auto}
.cmp tbody th{width:22%;padding:18px 20px 18px 0;text-align:left;font:600 15px/1.35 var(--display);color:var(--fg);border-top:1px solid var(--line)}
.cmp td{padding:18px 20px;border-top:1px solid var(--line);vertical-align:top;line-height:1.45}
.cmp td.cmp-x{color:var(--muted)}
.cmp td.cmp-ok{background:var(--navy);color:#EDF1FB;border-top-color:rgba(255,255,255,.08)}
.cmp tbody tr:last-child td.cmp-ok{border-radius:0 0 24px 24px}
.cmp thead .cmp-aion{background:var(--navy);border-radius:24px 24px 0 0;padding-top:18px}
.cmp tbody tr:first-child td.cmp-ok{border-radius:0}
.cmp td .cmp-ic,.cmp td .dot{display:inline-grid;vertical-align:-4px;margin-right:10px}
.cmp-ic{place-items:center;width:20px;height:20px;border-radius:50%;background:#EEF0F5;color:#5A6580}
@media (max-width:760px){
  .cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block;width:auto}
  .cmp thead{display:none}
  .cmp tbody tr{margin-bottom:12px;border:1px solid var(--line);border-radius:20px;overflow:hidden}
  .cmp tbody th{padding:14px 16px 6px;border:0}
  .cmp td{padding:8px 16px 12px;border:0}
  .cmp td.cmp-x::before{content:"Agência comum";display:block;font:600 11px/1.3 var(--font);letter-spacing:.2em;text-transform:uppercase;color:#5A6580;margin-bottom:4px}
  .cmp td.cmp-ok{border-radius:0!important;padding-top:12px}
  .cmp td.cmp-ok::before{content:"AION";display:block;font:600 11px/1.3 var(--font);letter-spacing:.2em;color:#8FAEFF;margin-bottom:4px}
}

/* Método: o que muda para o paciente */
.met-muda{margin-top:6px;padding-top:10px;border-top:1px solid var(--line);color:var(--fg)!important}
.met-muda span{display:block;font:600 11px/1.3 var(--font);letter-spacing:.2em;text-transform:uppercase;color:var(--brand-text);margin-bottom:4px}

/* AION OS: logo + nome do produto separados por um fio (arquitetura de marca) */
.os-lockup{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.os-lockup img{height:30px;width:auto}
.os-lockup i{width:1px;height:26px;background:rgba(255,255,255,.3)}
.os-lockup span{font:300 26px/1 var(--display);letter-spacing:-.03em;color:var(--on-navy-muted)}
.attend .section-title{max-width:16ch}
.os-cta{margin-top:24px}

/* Relatório mensal */
.relatorio{background:var(--bg-soft)}
.relatorio-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,88px);align-items:center}
.rel-card{margin:0;padding:24px;border-radius:24px;background:#fff;border:1px solid var(--line)}
.rel-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.rel-top b{font:600 17px/1.2 var(--display)}
.rel-card .tag.st.ok{color:#15803D;border-color:rgba(21,128,61,.35);background:#F0FDF4}
.rel-card ul{list-style:none;display:grid}
.rel-card li{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:14px 0;border-top:1px solid var(--line)}
.rel-card li span{font-size:14.5px;color:var(--muted)}
.rel-card li b{font:300 24px/1 var(--display);letter-spacing:-.03em;color:var(--fg)}
.rel-card li i{grid-column:1/-1;height:6px;border-radius:99px;background:#EEF0F5;overflow:hidden}
.rel-card li i em{display:block;height:100%;border-radius:inherit;background:#C5CAD6}
.rel-card li:last-child i em{background:var(--brand)}
.rel-card figcaption{margin-top:10px;font-size:12px;color:#5A6580}
@media (max-width:900px){.relatorio-layout{grid-template-columns:1fr}}

/* Serviços por objetivo */
.bento.obj{grid-template-columns:repeat(3,minmax(0,1fr))}
.bento.obj > .c{grid-column:auto!important;gap:10px}
.bento.obj h3{font-size:clamp(22px,2vw,26px);font-weight:300;letter-spacing:-.035em}
.bento.obj .sb,.bento.obj .pg,.bento.obj .mk-zap{margin-top:6px;padding-top:0}
.bento.obj .sb-bar{border:1px solid #E3E6EE}
.bento.obj .sb .sb-r.voce-1{background:#E8EEFD;color:#0E1630;border-radius:8px;justify-content:space-between}
.bento.obj .pg{grid-template-columns:repeat(6,1fr)}
.obj-itens{list-style:none;margin-top:8px;display:grid}
.obj-itens li{display:grid;gap:3px;padding:12px 0;border-top:1px solid #E3E6EE}
.bento .n .obj-itens li{border-top-color:rgba(255,255,255,.12)}
.obj-itens a{display:inline-flex;align-items:center;gap:6px;color:inherit}
.obj-itens a:hover b{text-decoration:underline;text-underline-offset:3px}
.obj-itens b{font:600 15.5px/1.3 var(--display);letter-spacing:-.01em}
.obj-itens a .ic{color:var(--brand-text)}
.bento .n .obj-itens a .ic{color:#8FAEFF}
.obj-itens span{font-size:14px;line-height:1.45;color:#4D5873}
.bento .n .obj-itens span{color:#C2C8D6}
@media (max-width:1020px){.bento.obj{grid-template-columns:1fr}}

/* Para quem: card inteiro leva à página do segmento */
.audience-card{position:relative}
.audience-card .card-link{color:inherit}
.audience-card .card-link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.audience-card .card-link:focus-visible{outline:none}
.audience-card:has(.card-link:focus-visible){outline:2px solid var(--brand);outline-offset:2px}
.aud-mais{margin-top:14px;display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--brand-text)}
.aud-extra{position:relative;z-index:1;display:inline-block;margin-top:8px;font-size:13.5px;color:var(--brand-text);text-decoration:underline;text-underline-offset:3px}
.audience-card:hover{border-color:var(--line-strong)}

/* Conselhos: link para o guia */
.ethics-guia{margin-top:22px}

/* FAQ: texto de apoio */
.faq-intro p{margin:12px 0 0;color:var(--muted);max-width:34ch}

/* Duas opções */
.opcoes{background:var(--bg)}
.opcoes .section-title{text-align:center;margin-bottom:clamp(28px,4vw,44px)}
.opcoes-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:980px;margin-inline:auto}
.op{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:clamp(24px,3vw,36px);border-radius:24px}
.op-1{background:#fff;border:1px solid var(--line);color:var(--fg)}
.op-1 p{color:var(--muted)}
.op-2{background:var(--grain-dark),radial-gradient(70% 80% at 100% 0%,rgba(31,79,224,.55),transparent 70%),var(--navy);color:#fff}
.op-2 p{color:#C2C8D6}
.op h3{font:300 clamp(24px,2.4vw,30px)/1.1 var(--display);letter-spacing:-.035em}
.op p{font-size:15.5px;line-height:1.5;max-width:38ch}
.op-n{font:600 11px/1.3 var(--font);letter-spacing:.2em;text-transform:uppercase;color:#5A6580}
.op-2 .op-n{color:#8FAEFF}
.op-2 .btn{margin-top:12px}
@media (max-width:760px){.opcoes-grid{grid-template-columns:1fr}}
.calc-res .wrap-k{grid-template-columns:1.25fr 1fr .8fr}
.calc-res .n{font-size:clamp(24px,2.3vw,34px);white-space:nowrap}
@media (max-width:1020px){.calc-res .wrap-k{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.calc-res .wrap-k{grid-template-columns:1fr}}
@media (max-width:760px){.cmp tbody th{width:auto}}
