/* ==========================================================================
   FYOO — página única
   Paleta: abismo #031a29 · marinho #08384f · oceano #0a6799 · ciano #66b8c3 · névoa #e3eaee
   Tipos:  Outfit (títulos e texto) · JetBrains Mono (rótulos pequenos)
   ========================================================================== */

:root {
  --abyss: #031a29;
  --deep: #06273a;
  --navy: #08384f;
  --ocean: #0a6799;
  --cyan: #66b8c3;
  --cyan-soft: #9bd5dd;
  --mist: #e3eaee;
  --mist-2: #f4f7f9;
  --ink: #06273a;
  --ink-2: #3c5565;
  --on-dark: #f2f8fa;
  --on-dark-2: #a9c7d1;

  --font: "Outfit", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --gutter: clamp(20px, 5vw, 88px);
  --maxw: 1240px;
  --pad: clamp(72px, 11vw, 150px);
  --header-h: 68px;

  --hot: #ff6b4a;
  --warm: #ffb02e;
  --cold: #3b9dff;

  --stars:
    radial-gradient(1.2px 1.2px at 12% 22%, #d4eaf0 50%, transparent 51%),
    radial-gradient(1px 1px at 38% 64%, #a4d3dc 50%, transparent 51%),
    radial-gradient(1.4px 1.4px at 71% 18%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 86% 72%, #bfdde4 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 54% 88%, #d4eaf0 50%, transparent 51%),
    radial-gradient(.9px .9px at 24% 90%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 93% 38%, #a4d3dc 50%, transparent 51%);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-weight: 350;
  font-size: 1.0625rem;
  line-height: 1.55;
  color: var(--on-dark);
  background: var(--abyss);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, svg, canvas { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, p, figure, blockquote, dl, dd { margin: 0; }
strong, b { font-weight: 650; }
em { font-style: normal; color: var(--cyan); }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 6px; }

.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip {
  position: fixed; left: 12px; top: -60px; z-index: 100;
  padding: .7rem 1rem; border-radius: 10px; background: var(--cyan); color: var(--abyss); font-weight: 600;
  transition: top .2s;
}
.skip:focus { top: 12px; }

.i {
  width: 1.15em; height: 1.15em; flex: none;
  fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}

/* ---------- Estrutura das faixas ---------- */
#metodo { scroll-margin-top: var(--header-h); }
.band { position: relative; isolation: isolate; padding: var(--pad) var(--gutter); scroll-margin-top: var(--header-h); }
.band__in { max-width: var(--maxw); margin-inline: auto; }

.band--dark { color: var(--on-dark); overflow: clip; }
.band--dark::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: var(--stars); background-size: 720px 480px; opacity: .5;
}
.band--light {
  color: var(--ink);
  background:
    radial-gradient(900px 400px at 85% 0%, rgba(255,255,255,.7), transparent 70%),
    linear-gradient(180deg, #eef2f5 0%, #dfe7ec 100%);
}

.eyebrow {
  font: 500 .78rem/1.3 var(--mono);
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 1.4rem;
}
.band--light .eyebrow { color: var(--ink-2); }

h1, h2 { font-weight: 300; letter-spacing: -.035em; line-height: 1.04; text-wrap: balance; }
h1 strong, h2 strong { font-weight: 700; }
h2 { font-size: clamp(2.1rem, 4.6vw, 3.9rem); }
h3 { font-weight: 500; letter-spacing: -.015em; line-height: 1.2; }

.lead { font-size: clamp(1.05rem, 1.5vw, 1.2rem); line-height: 1.6; max-width: 36em; }
.sub { font-size: clamp(1.02rem, 1.4vw, 1.15rem); max-width: 34em; margin-top: 1.5rem; }
.band--light .sub, .band--light .lead { color: var(--ink-2); }
.band--light strong { color: var(--ink); }
.band--light em { color: #0a6799; }

/* ---------- Botões ---------- */
.actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 2.2rem; }
.actions--center { justify-content: center; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  padding: .95em 1.7em; border-radius: 999px;
  font-weight: 500; font-size: 1rem; line-height: 1.1; letter-spacing: -.005em;
  transition: transform .2s, box-shadow .25s, background-color .25s, border-color .25s;
}
.btn .i { width: 1.1em; height: 1.1em; }
.btn--primary {
  color: #06273a;
  background: linear-gradient(180deg, #9bdbe4 0%, #5bbccb 100%);
  box-shadow: 0 0 0 1px rgba(255,255,255,.25) inset, 0 12px 38px -10px rgba(102, 184, 195,.8);
}
.btn--primary:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(255,255,255,.35) inset, 0 18px 46px -10px rgba(102, 184, 195,.95); }
.btn--ghost { color: var(--on-dark); border: 1px solid rgba(150, 205, 215,.38); background: rgba(4, 32, 48,.35); }
.btn--ghost:hover { border-color: var(--cyan); background: rgba(102, 184, 195,.1); }
.btn--block { display: flex; width: 100%; }

/* ---------- Vidro (cartões escuros) ---------- */
.glass {
  border-radius: 22px;
  border: 1px solid rgba(102, 190, 205, .38);
  background: linear-gradient(165deg, rgba(10, 103, 153, .50), rgba(8, 80, 100, .52));
  box-shadow: 0 24px 60px -24px rgba(0, 12, 20, .8), inset 0 1px 0 rgba(255,255,255,.14);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.chip {
  display: inline-block; padding: .38em .95em; border-radius: 999px;
  font: 500 .7rem/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase;
  color: var(--cyan-soft); background: rgba(102, 184, 195,.14); border: 1px solid rgba(102, 184, 195,.28);
}

/* ---------- Cabeçalho ---------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 50; height: var(--header-h);
  background: rgba(3, 26, 41, .74);
  -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3);
  border-bottom: 1px solid rgba(143, 205, 215, .14);
}
.site-header__in {
  height: 100%; max-width: 1480px; margin-inline: auto; padding-inline: var(--gutter);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.logo { display: inline-flex; align-items: center; color: #fff; }
.logo svg { display: block; height: 2.1rem; width: auto; aspect-ratio: 229 / 58; overflow: visible; }
.logo--lg svg { height: 3rem; }

.nav { display: flex; gap: clamp(1.2rem, 2.6vw, 2.6rem); font-size: .95rem; }
.nav a { color: #d9e8ee; padding: .4rem 0; border-bottom: 1.5px solid transparent; transition: color .2s, border-color .2s; }
.nav a:hover { color: #fff; }
.nav a[aria-current="true"] { color: var(--cyan); border-color: var(--cyan); }

.nav-toggle { display: none; width: 44px; height: 44px; position: relative; border-radius: 12px; }
.nav-toggle span { position: absolute; left: 11px; right: 11px; height: 2px; border-radius: 2px; background: #fff; transition: transform .25s, top .25s; }
.nav-toggle span:first-child { top: 17px; }
.nav-toggle span:last-child { top: 25px; }
.nav-toggle[aria-expanded="true"] span:first-child { top: 21px; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:last-child { top: 21px; transform: rotate(-45deg); }

/* ---------- Hero ---------- */
.hero {
  min-height: max(100svh, 720px);
  padding-top: calc(var(--header-h) + clamp(32px, 7vh, 80px));
  padding-bottom: clamp(48px, 9vh, 110px);
  display: grid; align-items: center;
  background:
    radial-gradient(900px 620px at 80% 22%, rgba(10, 103, 153, .38), transparent 65%),
    radial-gradient(700px 520px at 8% 95%, rgba(8, 80, 100, .42), transparent 60%),
    linear-gradient(180deg, #05212f 0%, #06293b 65%, var(--deep) 100%);
}
.hero__net { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; }
.hero__grid {
  width: 100%; max-width: var(--maxw); margin-inline: auto;
  display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); align-items: center;
  gap: clamp(24px, 5vw, 80px);
}
.hero h1 { font-size: clamp(2.8rem, 6.2vw, 5.5rem); max-width: 13em; text-wrap: wrap; }
.hero .lead { margin-top: 2rem; max-width: 33em; }
.hero__phone { display: flex; justify-content: center; perspective: 1500px; }

.facts { display: flex; flex-wrap: wrap; gap: .7rem 2rem; margin-top: 2.2rem; font: 700 .8rem/1.2 var(--mono); letter-spacing: .04em; color: #cfe3ea; }

/* Entrada da página: uma única sequência, só no hero */
@keyframes rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes settle { from { opacity: 0; transform: translateY(40px) rotateY(-30deg) rotateX(10deg) rotateZ(4deg); } to { opacity: 1; } }
.hero__copy > * { animation: rise .9s cubic-bezier(.2, .7, .2, 1) both; }
.hero__copy > :nth-child(2) { animation-delay: .08s; }
.hero__copy > :nth-child(3) { animation-delay: .2s; }
.hero__copy > :nth-child(4) { animation-delay: .3s; }
.hero__copy > :nth-child(5) { animation-delay: .4s; }
.hero__phone .phone { animation: settle 1.3s cubic-bezier(.2, .7, .2, 1) .15s both; }

/* ---------- Cenas ---------- */
.scenes { background: linear-gradient(180deg, var(--deep) 0%, #0b5b7d 52%, #0a4a66 100%); }
.scenes h2 { max-width: 12em; }
.scenes__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: clamp(40px, 6vw, 72px); }
.scene { display: flex; flex-direction: column; gap: 1.1rem; padding: 1.9rem 1.7rem 1.7rem; }
.scene .chip { align-self: flex-start; }
.scene h3 { font-size: 1.4rem; }
.scene p { font-size: .98rem; line-height: 1.6; color: #d1e3e9; }
.scene strong { color: #fff; }
.scene__end { margin-top: auto; padding-top: 1.2rem; border-top: 1px solid rgba(150, 210, 220, .3); font-size: 1.05rem !important; color: #fff !important; font-weight: 400; }

/* ---------- Retrato ---------- */
.portrait h2 { max-width: 11em; }
.stats {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: clamp(36px, 5vw, 60px);
  border: 1px solid var(--line, rgba(6, 39, 58, .14)); border-radius: 18px; overflow: hidden;
  background: rgba(255, 255, 255, .55); box-shadow: 0 20px 50px -30px rgba(6, 39, 58, .35);
}
.stat { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: .55rem; padding: 1.8rem 1.6rem; border-left: 1px solid rgba(6, 39, 58, .12); }
.stat:first-child { border-left: 0; }
.stat dt { display: flex; align-items: center; gap: .55rem; font-size: 1rem; color: var(--ink-2); }
.stat--hot dt::before, .stat--warm dt::before, .stat--cold dt::before { content: ""; width: .6rem; height: .6rem; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 20%, transparent); }
.stat--hot { --c: var(--hot); } .stat--warm { --c: var(--warm); } .stat--cold { --c: var(--cold); }
.stat__n { font-weight: 300; font-size: clamp(2.6rem, 5vw, 4.2rem); line-height: 1; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.portrait__note { margin-top: 2.4rem; max-width: 33em; font-size: 1.12rem; color: var(--ink-2); }

/* ---------- Carrossel 3D ---------- */
.showcase {
  padding-block: clamp(56px, 8vw, 110px);
  background: radial-gradient(900px 500px at 50% 45%, rgba(13, 120, 160, .35), transparent 70%), linear-gradient(180deg, #0a5272 0%, #08354c 100%);
}
.flow {
  --dx: 215px; --dz: 130px; --ry: -36deg; --pw: 270px;
  position: relative; height: calc(var(--pw) * 19 / 9 + 70px); margin-inline: auto; max-width: 1100px;
  perspective: 1700px; perspective-origin: 50% 40%; touch-action: pan-y; user-select: none; cursor: grab; border-radius: 24px;
}
.flow:active { cursor: grabbing; }
.flow__item {
  position: absolute; left: 50%; top: 24px; margin-left: calc(var(--pw) / -2);
  transform-style: preserve-3d;
  transform: translateX(calc(var(--d, 0) * var(--dx))) translateZ(calc(var(--abs, 0) * var(--dz) * -1)) rotateY(calc(var(--d, 0) * var(--ry)));
  transition: transform .9s cubic-bezier(.2, .7, .2, 1), opacity .6s, filter .6s;
  opacity: calc(1 - var(--abs, 0) * .22);
  filter: brightness(calc(1 - var(--abs, 0) * .16));
}
.flow__item .phone { --w: var(--pw); }

/* ---------- A virada ---------- */
.turn {
  background:
    radial-gradient(1000px 520px at 28% 12%, rgba(77, 147, 177, .3), transparent 62%),
    linear-gradient(180deg, #08354c 0%, #062f43 100%);
}
.turn__in { max-width: 760px; margin-inline: auto; }
.turn h2 { font-size: clamp(2.1rem, 4.3vw, 3.5rem); }
.turn p { margin-top: 1.7rem; font-size: 1.12rem; color: #d1e3e9; }
.turn h2 + p { margin-top: 2.2rem; }
.turn strong { color: #fff; }
.turn__quote {
  margin-top: 2.6rem; padding: .4rem 0 .4rem 1.7rem; border-left: 2px solid var(--cyan);
  font-size: clamp(1.3rem, 2.3vw, 1.7rem); line-height: 1.35; letter-spacing: -.02em; font-weight: 500; color: #fff;
}

/* ---------- Método ---------- */
.method-intro { padding-bottom: clamp(48px, 7vw, 90px); }
.method-intro__in { max-width: 860px; margin-inline: auto; text-align: center; }
.method-intro .sub { margin-inline: auto; }
.method-intro h2 { font-size: clamp(2rem, 4.2vw, 3.4rem); }

.method { background: radial-gradient(900px 600px at 25% 40%, rgba(10, 103, 153, .3), transparent 65%), linear-gradient(180deg, #052a3c 0%, #041f2e 100%); padding-block: clamp(56px, 8vw, 110px); }
.method__in { max-width: 1200px; margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.method__orb { position: sticky; top: calc(var(--header-h) + 3vh); align-self: start; display: grid; place-items: center; height: min(calc(100svh - var(--header-h) - 6vh), 640px); }
.orb { width: min(100%, 580px); aspect-ratio: 1; }

.steps { display: flex; flex-direction: column; gap: 22px; padding: 8vh 0 14vh; }
.step {
  --shift: 0px;
  position: relative; padding: 1.7rem 1.9rem 1.8rem 4.3rem; border-radius: 20px;
  border: 1px solid rgba(102, 170, 195, .28);
  background: linear-gradient(160deg, rgba(10, 82, 108, .6), rgba(6, 52, 70, .6));
  box-shadow: 0 24px 60px -30px rgba(0, 12, 20, .9), inset 0 1px 0 rgba(255,255,255,.1);
  margin-left: var(--shift);
  opacity: .3; transform: translateX(26px);
  transition: opacity .7s, transform .7s cubic-bezier(.2, .7, .2, 1), border-color .7s;
}
.step:nth-child(2) { --shift: clamp(0px, 3.4vw, 54px); }
.step:nth-child(3) { --shift: clamp(0px, 6.8vw, 108px); }
.step:nth-child(4) { --shift: clamp(0px, 10.2vw, 162px); }
.step:nth-child(5) { --shift: clamp(0px, 13.6vw, 216px); }
.step.is-on { opacity: 1; transform: none; border-color: rgba(130, 215, 228, .5); }
.step__dot {
  position: absolute; left: 1.5rem; top: 1.65rem; width: 1.6rem; height: 1.6rem; border-radius: 50%;
  background: radial-gradient(circle at 36% 30%, #b4e4ea, #3fa6b6 58%, #0a6799);
  box-shadow: 0 0 0 5px rgba(102, 184, 195, .14), 0 0 22px rgba(102, 184, 195, .55);
}
.step__n { font: 500 .72rem/1 var(--mono); letter-spacing: .2em; text-transform: uppercase; color: var(--cyan-soft); margin-bottom: .7rem; }
.step h3 { font-size: 1.55rem; margin-bottom: .7rem; }
.step p:last-child { color: #d1e3e9; line-height: 1.6; }
.step strong { color: #fff; }

/* ---------- Fyoo ID ---------- */
.fyooid__grid { max-width: var(--maxw); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.fyooid h2 { font-size: clamp(2.1rem, 4.4vw, 3.6rem); max-width: 11em; }
.fyooid .lead { margin-top: 2rem; }
.ticks { margin-top: 2.6rem; max-width: 34em; border-top: 1px solid rgba(6, 39, 58, .16); }
.ticks li { display: flex; align-items: baseline; gap: 1.1rem; padding: 1.15rem 0; border-bottom: 1px solid rgba(6, 39, 58, .16); font-size: 1.1rem; color: var(--ink-2); }
.ticks strong { font-weight: 600; }
.ticks__n { font: 400 .75rem/1 var(--mono); color: var(--ink-2); opacity: .75; }
.fyooid__phone { display: flex; justify-content: center; perspective: 1500px; }
.phone--lean { transform: rotateY(-12deg) rotateX(3deg) rotateZ(2deg); filter: drop-shadow(0 40px 40px rgba(6, 39, 58, .35)); }
.fyooid .phone { --w: 300px; }

/* ---------- Planos ---------- */
.ocean { background: radial-gradient(1000px 600px at 50% 18%, rgba(9, 140, 165, .35), transparent 65%), linear-gradient(180deg, #08384f 0%, #0a5c7f 60%, #08445d 100%); }
.ocean .band--dark { background: transparent; }
.plans { padding-bottom: clamp(40px, 6vw, 80px); }
.plans__in { text-align: center; }
.plans h2 { max-width: 12em; margin-inline: auto; }
.plans .sub { margin-inline: auto; }

.billing {
  position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; margin-top: 2.4rem; padding: 6px; border-radius: 999px;
  border: 1px solid rgba(140, 205, 215, .32); background: rgba(3, 22, 34, .6);
}
.billing::before {
  content: ""; position: absolute; top: 6px; bottom: 6px; left: 6px; width: calc(50% - 6px); border-radius: 999px;
  background: linear-gradient(180deg, #9bdbe4, #5bbccb); box-shadow: 0 6px 24px -6px rgba(102, 184, 195, .8);
  transition: transform .35s cubic-bezier(.2, .7, .2, 1);
}
.billing[data-period="anual"]::before { transform: translateX(100%); }
.billing button { position: relative; z-index: 1; min-width: 7.2rem; padding: .75em 1.4em; border-radius: 999px; font-size: .95rem; font-weight: 500; color: #d9e8ee; transition: color .25s; }
.billing button[aria-checked="true"] { color: #06273a; }
.billing__hint { margin-top: 1rem; font: 500 .75rem/1 var(--mono); letter-spacing: .08em; color: var(--cyan-soft); }

.plans__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; align-items: stretch; margin-top: clamp(40px, 6vw, 70px); text-align: left; padding-top: 18px; }
.plan { display: flex; flex-direction: column; gap: .5rem; padding: 1.5rem 1.5rem 1.6rem; }
.plan__tag { display: block; text-align: center; padding: .6em 1em; margin-bottom: 1rem; border-radius: 999px; border: 1px solid rgba(140, 205, 215, .38); font: 500 .68rem/1.2 var(--mono); letter-spacing: .15em; text-transform: uppercase; color: var(--cyan-soft); }
.plan h3 { font-size: 1.7rem; font-weight: 500; }
.plan__for { color: var(--on-dark-2); font-size: .98rem; }
.plan__price { margin-top: 1.1rem; display: flex; align-items: baseline; gap: .4rem; }
.plan__price .amount { font-size: clamp(2rem, 2.8vw, 2.5rem); font-weight: 400; letter-spacing: -.03em; line-height: 1.1; white-space: nowrap; }
.plan__price .per { font-size: .9rem; color: var(--on-dark-2); }
.plan__note { min-height: 3.1em; font-size: .88rem; color: var(--on-dark-2); line-height: 1.45; }
.plan__note b { color: #fff; }
.plan__list { margin: .8rem 0 1.5rem; display: grid; gap: .65rem; font-size: .96rem; }
.plan__list li { display: flex; gap: .7rem; align-items: baseline; }
.plan__list li::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); flex: none; transform: translateY(-.1em); }
.plan .btn { margin-top: auto; }
.plan--featured {
  margin-top: -18px; padding-block: 1.9rem 1.9rem; border-color: rgba(160, 226, 234, .85);
  background: linear-gradient(165deg, rgba(9, 140, 165, .65), rgba(8, 80, 100, .6));
  box-shadow: 0 0 0 1px rgba(160, 226, 234, .35), 0 36px 90px -20px rgba(9, 140, 165, .55), inset 0 1px 0 rgba(255,255,255,.2);
}
.plans__foot { margin-top: 2.2rem; font-size: .95rem; color: var(--on-dark-2); max-width: 46em; margin-inline: auto; }
.plans__foot strong { color: #fff; }

.compare { margin: clamp(32px, 4vw, 52px) auto 0; max-width: 880px; text-align: left; border-radius: 18px; border: 1px solid rgba(140, 205, 215, .3); background: rgba(3, 22, 34, .45); }
.compare summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.4rem; cursor: pointer; list-style: none; font-weight: 500; }
.compare summary::-webkit-details-marker { display: none; }
.compare summary .faq__ic::before, .compare summary .faq__ic::after { background: var(--cyan-soft); }
.compare[open] summary .faq__ic::after { transform: rotate(0); }
.compare__scroll { overflow-x: auto; padding: 0 1.4rem; }
.compare table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .95rem; }
.compare th, .compare td { padding: .8rem .6rem; text-align: left; border-top: 1px solid rgba(150, 210, 220, .18); }
.compare thead th { font: 500 .72rem/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cyan-soft); border-top: 0; }
.compare tbody th { font-weight: 400; color: var(--on-dark-2); }
.compare td { font-variant-numeric: tabular-nums; color: #fff; }
.compare__note { padding: 1rem 1.4rem 1.3rem; font-size: .88rem; color: var(--on-dark-2); }

/* ---------- Depoimentos ---------- */
.quotes { padding-top: clamp(60px, 9vw, 120px); }
.quotes h2 { max-width: 11em; font-size: clamp(2rem, 4.2vw, 3.4rem); }
.quotes__wrap { position: relative; margin-top: clamp(36px, 5vw, 60px); }
.quotes__track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 6px 2px 14px; border-radius: 22px; }
.quotes__track::-webkit-scrollbar { display: none; }
.quote { flex: 0 0 calc((100% - 40px) / 3); scroll-snap-align: start; display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; padding: 2rem 1.9rem 1.6rem; min-height: 15rem; }
.quote p { font-size: 1.18rem; line-height: 1.45; letter-spacing: -.01em; font-weight: 400; color: #f2f8ff; }
.quote figcaption { padding-top: 1.1rem; border-top: 1px solid rgba(150, 210, 220, .3); font-size: .9rem; color: var(--on-dark-2); }
.quotes__btn {
  position: absolute; top: 50%; z-index: 2; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%;
  background: #052233; border: 1px solid rgba(140, 205, 215, .45); color: #fff; transform: translateY(-50%);
  box-shadow: 0 10px 30px -8px rgba(0, 12, 20, .9); transition: background-color .2s, opacity .2s, border-color .2s;
}
.quotes__btn:hover:not(:disabled) { background: #0a3c55; border-color: var(--cyan); }
.quotes__btn:disabled { opacity: .35; cursor: default; }
.quotes__btn--prev { left: -26px; }
.quotes__btn--next { right: -26px; }

/* ---------- Dúvidas ---------- */
.faq__in { max-width: 780px; margin-inline: auto; }
.faq h2 { max-width: 10em; }
.faq__list { margin-top: clamp(32px, 5vw, 56px); border-top: 1px solid rgba(6, 39, 58, .18); }
.faq__item { border-bottom: 1px solid rgba(6, 39, 58, .18); }
.faq__item h3 { font-weight: 350; }
.faq__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.4rem 0; text-align: left; font-size: 1.15rem; letter-spacing: -.01em; color: var(--ink); transition: color .2s; }
.faq__q:hover { color: #0a6799; }
.faq__ic { position: relative; width: 1rem; height: 1rem; flex: none; }
.faq__ic::before, .faq__ic::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1.5px; margin-top: -.75px; background: currentColor; transition: transform .3s; }
.faq__ic::after { transform: rotate(90deg); }
.faq__item.is-open .faq__ic::after { transform: rotate(0); }
.faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s cubic-bezier(.2, .7, .2, 1); }
.faq__a > div { overflow: hidden; visibility: hidden; transition: visibility .35s; }
.faq__a p { padding: 0 3rem 1.5rem 0; color: var(--ink-2); max-width: 38em; }
.faq__item.is-open .faq__a { grid-template-rows: 1fr; }
.faq__item.is-open .faq__a > div { visibility: visible; }

/* ---------- Último passo ---------- */
.final { text-align: center; background: radial-gradient(900px 500px at 50% 30%, rgba(9, 140, 165, .32), transparent 65%), linear-gradient(180deg, #0a4a66 0%, #04202f 100%); padding-block: clamp(90px, 13vw, 180px); }
.final__in { max-width: 820px; margin-inline: auto; }
.final h2 { font-size: clamp(2.3rem, 5vw, 4.2rem); }
.final .lead { margin: 2rem auto 0; }
.final strong { color: #fff; }

/* ---------- Rodapé ---------- */
.site-footer { background: #04202f; border-top: 1px solid rgba(102, 184, 195, .35); padding: 2.6rem var(--gutter); }
.site-footer__in { max-width: var(--maxw); margin-inline: auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.5rem; }
.site-footer__tag { font-size: .98rem; color: #d9e8ee; text-align: center; }
.site-footer__links { display: flex; justify-content: flex-end; gap: 1.8rem; font-size: .92rem; color: var(--on-dark-2); }
.site-footer__links a:hover { color: #fff; }
.site-footer__legal { max-width: var(--maxw); margin: 1.8rem auto 0; padding-top: 1.4rem; border-top: 1px solid rgba(143, 205, 215, .14); font-size: .82rem; line-height: 1.6; color: var(--on-dark-2); }
.site-footer__links { flex-wrap: wrap; }

/* ==========================================================================
   Celular (tamanho tudo em em: 1em = largura / 28)
   ========================================================================== */
.phone {
  --w: 280px;
  position: relative; flex: none; width: var(--w); aspect-ratio: 9 / 19; font-size: calc(var(--w) / 28);
  padding: .75em; border-radius: 4.6em;
  background: linear-gradient(145deg, #d3deea 0%, #7f90a5 17%, #2a3647 44%, #92a4b8 70%, #3a485b 100%);
  box-shadow: 0 0 0 .1em rgba(255,255,255,.28) inset, 0 3em 6em -1.5em rgba(0, 10, 18, .75), 0 0 7em rgba(102, 184, 195, .14);
}
.phone--teal { background: linear-gradient(145deg, #3e7f8f 0%, #174a5e 40%, #0f3446 70%, #2d6b7c 100%); }
.phone--hero { --w: clamp(250px, 26vw, 330px); transform: rotateY(-16deg) rotateX(5deg) rotateZ(2deg); transform-origin: 50% 55%; }
.phone__screen { position: relative; height: 100%; border-radius: 3.9em; overflow: hidden; background: #f2f6fb; color: #0d1c33; display: flex; flex-direction: column; font-weight: 400; line-height: 1.25; text-align: left; letter-spacing: 0; }
.phone__screen::before { content: ""; position: absolute; top: .9em; left: 50%; z-index: 4; width: 7.4em; height: 2.1em; border-radius: 1.2em; background: #04070d; transform: translateX(-50%); }

.app__bar { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 1em; padding: 3.8em 1.5em 1.15em; background: linear-gradient(135deg, #0e7fa5, #0a6799); color: #fff; }
.app__logo { display: inline-flex; align-items: center; }
.app__logo svg { width: 7.6em; height: auto; aspect-ratio: 229 / 58; }
.app__bar strong { display: block; font-size: 1.35em; font-weight: 600; line-height: 1.1; }
.app__bar small { display: block; font-size: 1em; opacity: .85; margin-top: .25em; }
.app__icons { display: flex; gap: .9em; }
.app__icons .i { width: 1.5em; height: 1.5em; stroke-width: 2; }

.app__body { flex: 1; min-height: 0; padding: 1.2em 1.2em 0; overflow: hidden; display: flex; flex-direction: column; gap: 1em; }
.app__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1em; }
.app__head strong { display: block; font-size: 1.25em; font-weight: 650; }
.app__head small { display: block; font-size: .95em; color: #52687a; margin-top: .2em; }
.app__head .i { width: 1.4em; height: 1.4em; color: #3b4d68; }

.app__list { display: flex; flex-direction: column; gap: .7em; }
.app__list li { display: flex; align-items: center; gap: .9em; padding: .7em .8em; border-radius: 1.1em; background: #fff; box-shadow: 0 .1em .5em rgba(6, 39, 58, .09); }
.app__list li > div { flex: 1; min-width: 0; }
.app__list b { display: block; font-size: 1.1em; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app__list small { display: flex; align-items: center; gap: .35em; font-size: .9em; color: #5d7482; margin-top: .15em; }
.app__list small .i { width: 1em; height: 1em; }
.app__list em { flex: none; padding: .35em .7em; border-radius: 99em; font: 600 .72em/1 var(--font); letter-spacing: .04em; text-transform: uppercase; color: #0a6799; background: #e0eff2; }
.av { flex: none; width: 2.9em; height: 2.9em; display: grid; place-items: center; border-radius: 50%; font-size: 1em; font-weight: 650; color: #fff; background: linear-gradient(140deg, hsl(var(--h) 62% 58%), hsl(calc(var(--h) + 30) 60% 38%)); }
.av--lg { width: 5em; height: 5em; font-size: 1.4em; border: .15em solid #fff; }

.app__card { display: flex; gap: .9em; align-items: center; padding: .9em 1em; border-radius: 1.1em; background: #fff; box-shadow: 0 .1em .5em rgba(6, 39, 58, .09); }
.app__card > .i { flex: none; width: 2.2em; height: 2.2em; padding: .5em; border-radius: .7em; color: #0a6799; background: #e0eff2; }
.app__card b { display: block; font-size: 1.02em; font-weight: 650; }
.app__card small { display: block; font-size: .9em; color: #0a6799; margin-top: .2em; font-weight: 600; }

.app__tabs { flex: none; display: grid; grid-template-columns: repeat(5, 1fr); padding: .9em .6em 1.5em; background: #fff; border-top: 1px solid #e3eaf3; }
.app__tabs span { display: flex; flex-direction: column; align-items: center; gap: .3em; font-size: .78em; color: #7d8ea6; }
.app__tabs .i { width: 1.9em; height: 1.9em; }
.app__tabs .is-on { color: #0a6799; font-weight: 650; }
.app__fab { position: absolute; right: 1.4em; bottom: 6.6em; width: 3.4em; height: 3.4em; display: grid; place-items: center; border-radius: 1.1em; background: linear-gradient(135deg, #2ad0ee, #1c93d6); color: #fff; box-shadow: 0 .6em 1.4em rgba(9, 140, 165, .5); }
.app__fab .i { width: 1.6em; height: 1.6em; stroke-width: 2.2; }

.app__banner { position: relative; overflow: hidden; border-radius: 1.2em; min-height: 11em; padding: 1.2em; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; background: radial-gradient(circle at 85% 20%, #f5c518 0 18%, transparent 19%), linear-gradient(140deg, #0c2a5c, #123e86 60%, #1a5aa8); }
.app__banner strong { font-size: 1.7em; line-height: 1; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; }
.app__banner span { margin-top: .6em; font-size: .9em; font-weight: 600; opacity: .9; }
.app__tagrow { display: flex; align-items: center; gap: .7em; font-size: .9em; color: #52687a; }
.app__tagrow i { font-style: normal; padding: .3em .8em; border-radius: 99em; background: #d6ebf0; color: #0a6799; font-weight: 650; }
.app__news { display: flex; gap: .9em; padding: .8em; border-radius: 1.1em; background: #fff; box-shadow: 0 .1em .5em rgba(6, 39, 58, .09); }
.app__news .ph { flex: none; width: 6em; height: 5.2em; border-radius: .8em; background: linear-gradient(140deg, #c9a37a, #7b5a3d); }
.app__news b { display: block; font-size: 1em; font-weight: 650; }
.app__news small { display: block; margin-top: .3em; font-size: .85em; color: #5d7482; }

.app__id { padding: 1.3em; border-radius: 1.4em; color: #fff; background: linear-gradient(150deg, #1d9ad8, #1d70bd); display: grid; gap: .55em; box-shadow: 0 .5em 1.4em rgba(10, 103, 153, .3); }
.app__id .top { display: flex; align-items: center; gap: 1em; }
.app__id b { display: block; font-size: 1.35em; font-weight: 650; }
.app__id small { display: block; font-size: .95em; opacity: .9; }
.app__id .row { display: flex; align-items: center; gap: .6em; font-size: .92em; }
.app__id .row .i { width: 1.2em; height: 1.2em; }
.app__soc { display: flex; gap: .6em; margin-top: .3em; }
.app__soc span { width: 2.5em; height: 2.5em; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.2); }
.app__soc .i { width: 1.3em; height: 1.3em; }
.app__qr { display: grid; place-items: center; gap: .8em; padding-top: .5em; }
.app__qr svg { width: 11em; height: 11em; }
.app__qr small { font-size: .78em; color: #5d7482; text-align: center; }

.app__legend { display: flex; gap: .5em; }
.app__legend span { flex: 1; padding: .55em .5em; border-radius: .9em; background: #fff; text-align: center; font-size: .85em; color: #51647f; box-shadow: 0 .1em .5em rgba(6, 39, 58,.08); }
.app__legend b { display: block; font-size: 1.5em; font-weight: 650; color: var(--c); line-height: 1.1; }
.dot { flex: none; width: .9em; height: .9em; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 .3em color-mix(in srgb, var(--c) 22%, transparent); }

.app__day { display: flex; gap: .9em; align-items: flex-start; padding: .8em .9em; border-radius: 1.1em; background: #fff; box-shadow: 0 .1em .5em rgba(6, 39, 58,.09); }
.app__day time { flex: none; width: 3.4em; text-align: center; font-size: .85em; color: #5d7482; line-height: 1.2; }
.app__day time b { display: block; font-size: 1.7em; color: #0a6799; font-weight: 650; line-height: 1.1; }
.app__day b { display: block; font-size: 1.02em; }
.app__day small { display: block; font-size: .88em; color: #5d7482; margin-top: .2em; }

/* ==========================================================================
   Páginas legais (Termos, Privacidade, Cookies)
   ========================================================================== */
.legal { padding-top: calc(var(--header-h) + clamp(40px, 6vw, 84px)); padding-bottom: clamp(64px, 9vw, 120px); }
.legal__in { max-width: 800px; margin-inline: auto; }
.legal h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); }
.legal__meta { display: grid; gap: .45rem; margin-top: 1.8rem; padding-top: 1.4rem; border-top: 1px solid rgba(6, 39, 58, .16); font-size: .95rem; }
.legal__meta div { display: grid; grid-template-columns: 6.5rem 1fr; gap: 1rem; }
.legal__meta dt { font: 500 .72rem/1.9 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }
.legal__meta dd { margin: 0; color: var(--ink); }
.legal__toc { margin: 2.4rem 0 0; padding: 1.3rem 1.5rem 1.4rem; border-radius: 16px; border: 1px solid rgba(6, 39, 58, .14); background: rgba(255, 255, 255, .55); }
.legal__toc-title { font: 500 .72rem/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-2); margin-bottom: .9rem; }
.legal__toc ol { columns: 2; column-gap: 2rem; padding-left: 0; font-size: .92rem; line-height: 1.45; list-style: none; }
.legal__toc li { break-inside: avoid; padding: .22rem 0; }
.legal__toc a { color: var(--ink-2); }
.legal__toc a:hover { color: #0a6799; text-decoration: underline; }

.legal__body { margin-top: clamp(32px, 5vw, 56px); color: var(--ink); font-weight: 400; line-height: 1.7; }
.legal__body h2 { margin: 3rem 0 1rem; font-size: 1.05rem; font-weight: 600; letter-spacing: .04em; line-height: 1.35; scroll-margin-top: calc(var(--header-h) + 16px); padding-top: 1.6rem; border-top: 1px solid rgba(6, 39, 58, .14); }
.legal__body h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.legal__body h3 { margin: 2rem 0 .7rem; font-size: 1.12rem; font-weight: 600; letter-spacing: -.01em; }
.legal__body p { margin: 0 0 1rem; }
.legal__body strong { font-weight: 650; color: var(--ink); }
.legal__body ul, .legal__body ol { margin: 0 0 1.2rem; padding-left: 1.5rem; }
.legal__body ul { list-style: disc; }
.legal__body ol { list-style: decimal; }
.legal__body li { margin-bottom: .45rem; padding-left: .2rem; }
.legal__body li::marker { color: #0a6799; }
.legal__body a, .faq__a a { color: #0a6799; text-decoration: underline; text-underline-offset: 3px; }
.legal__body a:hover, .faq__a a:hover { color: #075d82; }
.legal__table { margin: 1.4rem 0 1.8rem; overflow-x: auto; border: 1px solid rgba(6, 39, 58, .16); border-radius: 14px; background: rgba(255, 255, 255, .6); }
.legal__table table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: .9rem; line-height: 1.5; }
.legal__table .legal__wide { min-width: 720px; }
.legal__table th, .legal__table td { padding: .75rem .9rem; text-align: left; vertical-align: top; border-top: 1px solid rgba(6, 39, 58, .12); }
.legal__table thead th { border-top: 0; background: rgba(6, 39, 58, .06); font: 500 .72rem/1.3 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
.legal__novo { position: relative; margin: 1.6rem 0; padding: .2rem 0 .2rem 1.2rem; border-left: 3px solid #66b8c3; background: linear-gradient(90deg, rgba(102, 184, 195, .12), transparent 45%); }
.legal__novo::before { content: attr(data-rotulo); display: block; margin-bottom: .6rem; font: 500 .68rem/1.2 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #0a6799; }
.legal__body .legal__novo h2 { margin-top: .4rem; padding-top: 0; border-top: 0; }
.legal__back { margin-top: 3.4rem; padding-top: 1.6rem; border-top: 1px solid rgba(6, 39, 58, .14); }
.legal__back a { color: #0a6799; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 640px) {
  .legal__toc ol { columns: 1; }
  .legal__meta div { grid-template-columns: 1fr; gap: 0; }
}

/* ==========================================================================
   Movimento reduzido
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .step { opacity: 1; transform: none; }
}

/* ==========================================================================
   Telas menores
   ========================================================================== */
@media (max-width: 1100px) {
  .scenes__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plans__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plan--featured { margin-top: 0; }
  .quote { flex-basis: calc((100% - 20px) / 2); }
  .step:nth-child(n) { --shift: 0px; }
  .step:nth-child(2) { --shift: 24px; } .step:nth-child(3) { --shift: 48px; } .step:nth-child(4) { --shift: 72px; } .step:nth-child(5) { --shift: 96px; }
  .flow { --dx: 180px; --pw: 240px; }
}

@media (max-width: 900px) {
  .nav-toggle { display: block; }
  .nav {
    position: absolute; top: var(--header-h); left: 0; right: 0; flex-direction: column; gap: 0; padding: .6rem var(--gutter) 1.2rem;
    background: #031a29; border-bottom: 1px solid rgba(143, 205, 215, .18);
    transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .25s, transform .25s, visibility .25s;
  }
  .nav.is-open { opacity: 1; transform: none; visibility: visible; }
  .nav a { padding: 1rem 0; border-bottom: 1px solid rgba(143, 205, 215, .12); font-size: 1.05rem; }

  .hero { min-height: 0; }
  .hero__grid { grid-template-columns: 1fr; }
  .hero__phone { margin-top: 1rem; }
  .phone--hero { transform: rotateY(-10deg) rotateX(3deg); --w: min(72vw, 300px); }

  .method__in { grid-template-columns: 1fr; }
  .method__orb { position: relative; top: 0; height: auto; }
  .orb { width: min(86vw, 440px); }
  .steps { padding: 2vh 0 4vh; }

  .fyooid__grid { grid-template-columns: 1fr; }
  .fyooid__phone { order: 2; }
  .fyooid .phone { --w: min(70vw, 290px); }

  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat:nth-child(3) { border-left: 0; }
  .stat:nth-child(n+3) { border-top: 1px solid rgba(6, 39, 58, .12); }

  .site-footer__in { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .site-footer__legal { text-align: center; }
  .site-footer__links { justify-content: center; }
  .quotes__btn--prev { left: -8px; } .quotes__btn--next { right: -8px; }
}

@media (max-width: 640px) {
  :root { --header-h: 62px; }
  .logo span { font-size: 1.9rem; }
  .scenes__grid, .plans__grid { grid-template-columns: 1fr; }
  .quote { flex-basis: 86%; }
  .step:nth-child(n) { --shift: 0px; }
  .step { padding: 1.5rem 1.3rem 1.5rem 3.6rem; }
  .step__dot { left: 1.1rem; }
  .flow { --dx: 118px; --dz: 110px; --ry: -32deg; --pw: 190px; }
  .stat { padding: 1.3rem 1.1rem; }
  .actions .btn { flex: 1 1 100%; }
  .faq__a p { padding-right: 0; }
  .quotes__btn { width: 44px; height: 44px; }
}

/* ==========================================================================
   Movimento: progresso, holofote, topo
   ========================================================================== */
.progresso {
  position: fixed; inset: 0 0 auto 0; z-index: 60; height: 2px; transform-origin: 0 50%; transform: scaleX(0);
  background: linear-gradient(90deg, #098ca5, #66b8c3 60%, #c8d3da); box-shadow: 0 0 10px rgba(102, 184, 195, .7); pointer-events: none;
}
.holofote {
  position: fixed; inset: 0; z-index: 2; pointer-events: none; opacity: 0; transition: opacity .4s; mix-blend-mode: screen;
  background: radial-gradient(420px circle at var(--sx, 50%) var(--sy, 50%), rgba(102, 184, 195, .14), transparent 70%);
}
.holofote.is-on { opacity: 1; }

.hero__stage { --px: 0; --py: 0; --hs: 0; position: relative; perspective: 1500px; width: max-content; max-width: 100%; }
.hero__tilt {
  transform-style: preserve-3d;
  transform: rotateY(calc(var(--px) * 7deg)) rotateX(calc(var(--py) * -5deg)) translateY(calc(var(--hs) * 36px));
  will-change: transform;
}
.hero__chip {
  position: absolute; z-index: 3; display: flex; align-items: center; gap: .6rem; padding: .7rem 1rem; border-radius: 16px;
  font-size: .86rem; line-height: 1.25; color: #eaf6f8; white-space: nowrap;
  background: rgba(6, 39, 58, .74); border: 1px solid rgba(143, 211, 220, .36);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px -18px rgba(0, 12, 20, .9), inset 0 1px 0 rgba(255,255,255,.1);
  translate: calc(var(--px) * var(--d, 1) * -24px) calc(var(--py) * var(--d, 1) * -18px + var(--hs) * var(--d, 1) * -80px);
  animation: chipIn .8s cubic-bezier(.2, .7, .2, 1) var(--delay, 1s) both, flutuar 7s ease-in-out calc(var(--delay, 1s) + .8s) infinite;
}
.hero__chip .i { width: 1.3rem; height: 1.3rem; padding: .25rem; border-radius: 8px; color: #06273a; background: #8fd3dc; box-sizing: content-box; }
.hero__chip b { font-weight: 650; color: #fff; }
.hero__chip .dot { width: .8rem; height: .8rem; margin: .25rem; }
.hero__chip--a { top: 12%; left: -26%; }
.hero__chip--b { top: 47%; right: -30%; }
.hero__chip--c { bottom: 10%; left: -20%; }
@keyframes chipIn { from { opacity: 0; transform: translateY(16px) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes flutuar { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes acordar { 0% { opacity: .35; text-shadow: none; } 55% { opacity: 1; text-shadow: 0 0 44px rgba(102, 184, 195, .9); } 100% { opacity: 1; text-shadow: 0 0 0 transparent; } }
.hero h1 strong { animation: acordar 2.4s ease .9s both; }

/* ==========================================================================
   Telas do app que se mexem
   ========================================================================== */
.app__view {
  position: absolute; inset: 0; display: flex; flex-direction: column; opacity: 0; pointer-events: none; transform: translateX(9%);
  transition: opacity .45s, transform .6s cubic-bezier(.2, .7, .2, 1);
}
.app__view.is-on { opacity: 1; transform: none; pointer-events: auto; }
.app__view.is-out { transform: translateX(-9%); }
@keyframes itemIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes surge { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.app__view.is-on .app__list li, .flow__item.is-center .app__list li { animation: itemIn .5s cubic-bezier(.2, .7, .2, 1) both; animation-delay: calc(var(--i, 0) * 70ms + 140ms); }
.app__view.is-on .app__card, .flow__item.is-center .app__card { animation: itemIn .55s cubic-bezier(.2, .7, .2, 1) .45s both; }

.app__tap {
  position: absolute; z-index: 6; width: 3.4em; height: 3.4em; margin: -1.7em 0 0 -1.7em; border-radius: 50%; opacity: 0; pointer-events: none;
  background: rgba(102, 184, 195, .38); border: .18em solid rgba(255, 255, 255, .92); box-shadow: 0 0 1.4em rgba(102, 184, 195, .85);
}
.app__tap.is-tap { animation: tap .7s ease-out; }
@keyframes tap { 0% { opacity: .95; transform: scale(.35); } 60% { opacity: .6; } 100% { opacity: 0; transform: scale(1.5); } }
.is-press { animation: press .5s ease; }
@keyframes press { 35% { transform: scale(.965); box-shadow: 0 0 0 .35em rgba(102, 184, 195, .4); } }

.app__body--compor { gap: .9em; }
.app__ctx { display: flex; gap: .8em; padding: .9em 1em; border-radius: 1.1em; background: #fff; box-shadow: 0 .1em .5em rgba(6, 39, 58, .09); }
.app__ctx > .i { flex: none; width: 2.2em; height: 2.2em; padding: .5em; border-radius: .7em; color: #0a6799; background: #e0eff2; }
.app__ctx b { display: block; font-size: 1.02em; font-weight: 650; }
.app__ctx small { display: block; margin-top: .2em; font-size: .9em; color: #52687a; }
.app__btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; padding: .85em 1.1em; border-radius: 99em; font-size: 1.05em; font-weight: 650; text-align: center; transition: transform .2s; }
.app__btn .i { width: 1.3em; height: 1.3em; }
.app__btn--ia, .app__btn--pri { color: #fff; background: linear-gradient(135deg, #0a6799, #098ca5); box-shadow: 0 .4em 1em rgba(9, 140, 165, .35); }
.app__btn--sec { color: #0a6799; background: #fff; box-shadow: inset 0 0 0 .12em #bcd7df; }
.app__msg { position: relative; overflow: hidden; min-height: 9.6em; padding: 1em; border-radius: 1.1em; background: #fff; box-shadow: 0 .1em .5em rgba(6, 39, 58, .09); }
.app__msg p { margin: 0; font-size: 1.05em; line-height: 1.5; color: #0d1c33; min-height: 7em; }
.app__msg.is-gerando::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 20%, rgba(102, 184, 195, .35) 50%, transparent 80%); animation: brilho 1.1s linear infinite; }
@keyframes brilho { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.app__msg p.is-digitando::after { content: ""; display: inline-block; width: .12em; height: 1.05em; margin-left: .12em; vertical-align: -.15em; background: #0a6799; animation: pisca .8s steps(1) infinite; }
@keyframes pisca { 50% { opacity: 0; } }
.app__msg.is-pronta { box-shadow: 0 0 0 .14em #66b8c3, 0 .1em .5em rgba(6, 39, 58, .09); }
.app__acoes { display: grid; grid-template-columns: 1fr 1fr; gap: .7em; }
.app__toast { display: flex; align-items: center; gap: .6em; margin-top: auto; margin-bottom: 1em; padding: .85em 1em; border-radius: 1em; font-size: 1em; font-weight: 600; color: #fff; background: #06273a; transform: translateY(140%); opacity: 0; transition: transform .45s cubic-bezier(.2, .7, .2, 1), opacity .3s; }
.app__toast .i { width: 1.3em; height: 1.3em; color: #66b8c3; }
.app__toast.is-on { transform: none; opacity: 1; }

.app__qr { position: relative; }
.app__qrbig { position: relative; width: 15em; height: 15em; padding: 1.1em; border-radius: 1.4em; background: #fff; box-shadow: 0 .4em 1.4em rgba(6, 39, 58, .14); }
.app__qrbig svg { width: 100%; height: 100%; }
.app__scan { position: absolute; left: 6%; right: 6%; top: .5em; height: .28em; border-radius: 9em; background: linear-gradient(90deg, transparent, #2fd0e6, transparent); box-shadow: 0 0 .9em #2fd0e6; animation: scan 2.6s ease-in-out infinite; }
.app__qr .app__scan { top: .5em; }
@keyframes scan { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(10.6em); } }
.app__qrbig .app__scan { top: 1em; }
.app__qrbig .app__scan { animation-name: scan2; }
@keyframes scan2 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(12.6em); } }
.app__body--c { align-items: center; justify-content: center; text-align: center; gap: 1em; padding-bottom: 5em; }
.app__cap { font-size: 1.2em; font-weight: 650; }
.app__sub { font-size: 1em; color: #52687a; margin-top: -.6em; }
.app__video { position: relative; height: 12.5em; border-radius: 1.2em; overflow: hidden; display: grid; place-items: center; color: #fff; background: radial-gradient(circle at 30% 20%, #098ca5, transparent 60%), linear-gradient(140deg, #0a6799, #06273a); }
.app__play { width: 4.2em; height: 4.2em; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .22); box-shadow: 0 0 0 .5em rgba(255, 255, 255, .1); }
.app__play .i { width: 1.9em; height: 1.9em; fill: #fff; stroke: #fff; margin-left: .2em; }
.app__video small { position: absolute; left: 1em; bottom: 1.7em; font-size: .95em; font-weight: 600; }
.app__prog { position: absolute; left: 1em; right: 1em; bottom: .8em; height: .35em; border-radius: 9em; background: rgba(255, 255, 255, .26); }
.app__prog::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 0; border-radius: inherit; background: #8fd3dc; }
.app__view.is-on .app__prog::after { animation: prog 6s linear infinite; }
@keyframes prog { to { width: 100%; } }
.app__card--troca .old { text-decoration: line-through; opacity: .55; }
.app__card--troca .new { color: #0a6799; font-weight: 650; opacity: 0; }
.app__view.is-on .app__card--troca .new { animation: surge .6s 1s both; }
.app__card--troca > .i { animation: giraInfinito 3s linear infinite; }
@keyframes giraInfinito { to { transform: rotate(360deg); } }
.app__anel { position: relative; width: 12em; height: 12em; }
.app__anel svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.app__anel .bg { fill: none; stroke: #d6e1e6; stroke-width: 3; }
.app__anel .fg { fill: none; stroke: #098ca5; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 97.4; stroke-dashoffset: 97.4; }
.app__view.is-on .app__anel .fg { animation: anel 1.4s .25s ease-out forwards; }
@keyframes anel { to { stroke-dashoffset: 83.5; } }
.app__anel b { position: absolute; inset: 0; display: grid; place-items: center; font-size: 2.2em; font-weight: 300; color: #06273a; }
.app__ticks { display: grid; gap: .6em; font-size: 1.05em; text-align: left; }
.app__ticks li { display: flex; gap: .6em; align-items: center; }
.app__ticks .i { width: 1.4em; height: 1.4em; color: #098ca5; }
.app__view.is-on .app__ticks li { animation: itemIn .5s both; }
.app__view.is-on .app__ticks li:nth-child(2) { animation-delay: .2s; }
.app__view.is-on .app__ticks li:nth-child(3) { animation-delay: .4s; }
.flow__item.is-center .phone { animation: respira 6s ease-in-out infinite; }
@keyframes respira { 50% { transform: translateY(-7px); } }

/* retrato: pontos do radar */
.radar { margin: clamp(28px, 4vw, 44px) 0 0; }
.dots { display: block; margin-inline: auto; max-width: 100%; }
.radar__leg { display: flex; flex-wrap: wrap; gap: .6rem 1.8rem; justify-content: center; margin-top: 1.1rem; font-size: .92rem; color: var(--ink-2); }
.radar__leg span { display: inline-flex; align-items: center; gap: .55rem; }
.radar__leg .dot { width: .6rem; height: .6rem; }

/* método: legenda da esfera */
.method__orb { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem; }
.orb__leg { min-height: 2.6em; max-width: 24em; text-align: center; font: 500 .74rem/1.5 var(--mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cyan-soft); }
.orb__leg.is-troca { animation: surge .5s both; }

/* Fyoo ID: lista que acompanha o celular */
.ticks li { transition: color .3s, background-color .3s, padding .3s; cursor: default; }
.ticks li.is-on { color: var(--ink); background: linear-gradient(90deg, rgba(102, 184, 195, .16), transparent); padding-left: .6rem; }
.ticks li.is-on .ticks__n { color: #0a6799; opacity: 1; }
.ticks li:focus-visible { outline-offset: -2px; }

/* ==========================================================================
   Títulos, leitura e cartões vivos
   ========================================================================== */
.tit .mw { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .14em; margin-bottom: -.14em; }
.tit .mw > span { display: inline-block; transform: translateY(112%); transition: transform .9s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--i, 0) * 55ms); }
.tit.is-in .mw > span { transform: none; }
.turn.is-leitura .w { opacity: var(--o, .2); transition: opacity .25s linear; }

.glass { position: relative; overflow: hidden; }
.glass::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s;
  background: radial-gradient(280px circle at var(--mx, 50%) var(--my, 50%), rgba(170, 228, 236, .18), transparent 70%);
}
.glass:hover::after { opacity: 1; }
.plan, .quote, .scene { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .3s ease-out; }
@property --ang { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.plan--featured::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.6px; pointer-events: none;
  background: conic-gradient(from var(--ang), rgba(190, 240, 246, .95), rgba(9, 140, 165, .15), rgba(190, 240, 246, .95));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  animation: giro 5s linear infinite;
}
@keyframes giro { to { --ang: 360deg; } }
.amount.is-flip { display: inline-block; animation: virar .55s cubic-bezier(.2, .7, .2, 1); }
@keyframes virar { from { opacity: 0; transform: translateY(40%) rotateX(70deg); } to { opacity: 1; transform: none; } }

/* ==========================================================================
   Seção da Fyoona
   ========================================================================== */
.fyoona { background: radial-gradient(900px 520px at 22% 40%, rgba(9, 140, 165, .30), transparent 65%), linear-gradient(180deg, #0a4a66 0%, #062f43 100%); padding-block: clamp(70px, 10vw, 130px); }
.fyoona__grid { max-width: 1100px; margin-inline: auto; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 90px); align-items: center; }
.fyoona__retrato { text-align: center; }
.fyoona__moldura { position: relative; width: min(400px, 72vw); aspect-ratio: 1; margin-inline: auto; border-radius: 50%; padding: 8px; background: conic-gradient(from var(--ang), #66b8c3, #098ca5, #c8d3da, #66b8c3); animation: giro 9s linear infinite; box-shadow: 0 0 90px rgba(9, 140, 165, .45); }
.fyoona__moldura img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; background: #fff; animation: respira 7s ease-in-out infinite; }
.fyoona__lema { margin-top: 1.6rem; font: 500 .78rem/1.4 var(--mono); letter-spacing: .2em; text-transform: uppercase; color: var(--cyan-soft); }
.fyoona h2 { font-size: clamp(2rem, 4.2vw, 3.3rem); max-width: 11em; }
.fyoona .lead { margin-top: 1.6rem; }
.fyoona__pergunte { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.8rem; }
.fyoona__pergunte button { padding: .7em 1.15em; border-radius: 99em; font-size: .95rem; color: var(--on-dark); border: 1px solid rgba(150, 210, 220, .4); background: rgba(6, 39, 58, .4); transition: border-color .2s, background-color .2s, transform .2s; }
.fyoona__pergunte button:hover { border-color: var(--cyan); background: rgba(102, 184, 195, .16); transform: translateY(-2px); }

/* ==========================================================================
   Chat da Fyoona
   ========================================================================== */
.fy-lanc { position: fixed; right: 20px; bottom: 20px; z-index: 70; width: 66px; height: 66px; padding: 0; border-radius: 50%; border: 0; cursor: pointer; background: none; transition: transform .25s; }
.fy-lanc:hover { transform: scale(1.06); }
.fy-lanc img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; border: 3px solid #66b8c3; background: #fff; box-shadow: 0 12px 30px -8px rgba(0, 12, 20, .8); }
.fy-lanc__anel { position: absolute; inset: -4px; border-radius: 50%; border: 2px solid rgba(102, 184, 195, .8); animation: ping 2.8s ease-out infinite; }
@keyframes ping { 0% { transform: scale(.92); opacity: .9; } 80%, 100% { transform: scale(1.5); opacity: 0; } }
.fy-lanc__on { position: absolute; z-index: 2; right: 0; bottom: 2px; width: 16px; height: 16px; border-radius: 50%; background: #098ca5; border: 2.5px solid #06273a; }
.fy-dica { position: fixed; right: 24px; bottom: 100px; z-index: 70; display: flex; align-items: center; gap: .6rem; max-width: 250px; padding: .8rem 1rem; border-radius: 16px 16px 4px 16px; font-size: .92rem; color: #06273a; background: #fff; box-shadow: 0 16px 40px -12px rgba(0, 12, 20, .7); animation: surge .5s both; cursor: pointer; }
.fy-dica[hidden] { display: none; }
.fy-dica button { flex: none; width: 24px; height: 24px; border-radius: 50%; font-size: 1.1rem; line-height: 1; color: #52687a; }
.fy-dica button:hover { background: #e3eaee; }

.fy-painel {
  position: fixed; right: 20px; bottom: 100px; z-index: 71; width: min(390px, calc(100vw - 32px)); height: min(640px, calc(100svh - 130px));
  display: flex; flex-direction: column; overflow: hidden; border-radius: 22px; color: var(--on-dark);
  background: linear-gradient(180deg, rgba(8, 56, 79, .97), rgba(4, 32, 47, .98));
  border: 1px solid rgba(143, 211, 220, .35); box-shadow: 0 40px 90px -20px rgba(0, 12, 20, .9);
  opacity: 0; transform: translateY(18px) scale(.97); transform-origin: 100% 100%; transition: opacity .25s, transform .3s cubic-bezier(.2, .7, .2, 1);
}
.fy-painel[hidden] { display: none; }
.fy-painel.is-open { opacity: 1; transform: none; }
.fy-topo { display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem; background: linear-gradient(135deg, rgba(10, 103, 153, .55), rgba(9, 140, 165, .35)); border-bottom: 1px solid rgba(143, 211, 220, .22); }
.fy-avatar { position: relative; flex: none; width: 48px; height: 48px; border-radius: 50%; overflow: hidden; border: 2px solid #8fd3dc; background: #fff; }
.fy-avatar img, .fy-avatar video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fy-avatar img { transition: opacity .14s; }
.fy-avatar img.is-troca { opacity: 0; }
.fy-avatar video { opacity: 0; transition: opacity .3s; }
.fy-avatar video.is-on { opacity: 1; }
.fy-quem { flex: 1; min-width: 0; line-height: 1.2; }
.fy-quem b { display: block; font-size: 1.05rem; font-weight: 600; }
.fy-quem small { display: block; font-size: .8rem; color: #bfe3ea; }
.fy-fechar { flex: none; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: #e6f4f6; }
.fy-fechar:hover { background: rgba(255, 255, 255, .12); }
.fy-msgs { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .8rem; scroll-behavior: smooth; }
.fy-msg { display: flex; align-items: flex-end; gap: .5rem; max-width: 94%; animation: surge .35s both; }
.fy-msg--eu { align-self: flex-end; }
.fy-msg__av { flex: none; width: 28px; height: 28px; border-radius: 50%; object-fit: cover; background: #fff; border: 1.5px solid #66b8c3; }
.fy-bolha { padding: .7rem .95rem; border-radius: 16px 16px 16px 4px; font-size: .95rem; line-height: 1.5; background: rgba(255, 255, 255, .09); border: 1px solid rgba(143, 211, 220, .2); }
.fy-msg--eu .fy-bolha { border-radius: 16px 16px 4px 16px; color: #06273a; background: linear-gradient(135deg, #9bdbe4, #66b8c3); border: 0; }
.fy-bolha p { margin: 0; }
.fy-bolha p + p, .fy-bolha p + ul, .fy-bolha ul + p { margin-top: .6em; }
.fy-bolha ul { margin: 0; padding-left: 1.15em; list-style: disc; }
.fy-bolha li { margin-top: .25em; }
.fy-bolha a { color: #9bdbe4; text-decoration: underline; text-underline-offset: 2px; }
.fy-pontos { display: inline-flex; gap: 4px; padding: .2rem 0; }
.fy-pontos i { width: 7px; height: 7px; border-radius: 50%; background: #8fd3dc; animation: pulinho 1s ease-in-out infinite; }
.fy-pontos i:nth-child(2) { animation-delay: .15s; }
.fy-pontos i:nth-child(3) { animation-delay: .3s; }
@keyframes pulinho { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-5px); opacity: 1; } }
.fy-chips { display: flex; flex-wrap: wrap; gap: .45rem; padding: 0 1rem .6rem; }
.fy-chips:empty { display: none; }
.fy-chips button { padding: .5em .9em; border-radius: 99em; font-size: .85rem; color: #d9eef2; border: 1px solid rgba(143, 211, 220, .4); background: rgba(6, 39, 58, .5); animation: surge .4s both; transition: background-color .2s, border-color .2s; }
.fy-chips button:hover { background: rgba(102, 184, 195, .2); border-color: var(--cyan); }
.fy-form { display: flex; gap: .5rem; padding: .7rem 1rem; border-top: 1px solid rgba(143, 211, 220, .2); }
.fy-form input { flex: 1; min-width: 0; padding: .75em 1em; border-radius: 99em; font: inherit; font-size: .95rem; color: var(--on-dark); background: rgba(255, 255, 255, .08); border: 1px solid rgba(143, 211, 220, .3); }
.fy-form input::placeholder { color: #8fb3be; }
.fy-form input:focus { outline: 2px solid var(--cyan); outline-offset: 1px; }
.fy-form button { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: #06273a; background: linear-gradient(135deg, #9bdbe4, #5bbccb); }
.fy-aviso { margin: 0; padding: 0 1rem .8rem; font-size: .74rem; line-height: 1.4; color: #8fb3be; }

/* ==========================================================================
   Banner de cookies
   ========================================================================== */
.consent {
  position: fixed; left: 50%; bottom: 18px; translate: -50% 0; z-index: 80; width: min(860px, calc(100vw - 32px)); padding: 1rem 1.2rem; border-radius: 20px; color: var(--on-dark);
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .35rem 1.6rem;
  background: linear-gradient(180deg, rgba(8, 56, 79, .98), rgba(4, 32, 47, .98)); border: 1px solid rgba(143, 211, 220, .35); box-shadow: 0 30px 70px -18px rgba(0, 12, 20, .9);
  opacity: 0; transform: translateY(20px); transition: opacity .3s, transform .4s cubic-bezier(.2, .7, .2, 1);
}
.consent.is-on { opacity: 1; transform: none; }
.consent > b { grid-column: 1; display: block; font-size: 1.02rem; font-weight: 600; }
.consent > p { grid-column: 1; margin: 0; font-size: .86rem; line-height: 1.5; color: #cfe3ea; }
.consent a { color: #9bdbe4; text-decoration: underline; text-underline-offset: 2px; }
.consent__acoes { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; }
.consent__prefs { grid-column: 1 / -1; }
.consent__prefs { margin-top: 1rem; display: grid; gap: .2rem; }
.consent__prefs[hidden] { display: none; }
.consent__linha { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-top: 1px solid rgba(143, 211, 220, .18); cursor: pointer; }
.consent__linha b { display: block; font-size: .9rem; font-weight: 600; }
.consent__linha small { display: block; margin-top: .15rem; font-size: .78rem; line-height: 1.4; color: #a9c7d1; }
.consent__linha input { position: absolute; opacity: 0; pointer-events: none; }
.consent__linha i { flex: none; position: relative; width: 42px; height: 24px; border-radius: 99em; background: rgba(255, 255, 255, .18); transition: background-color .2s; }
.consent__linha i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .2s; }
.consent__linha input:checked + i { background: #098ca5; }
.consent__linha input:checked + i::after { transform: translateX(18px); }
.consent__linha input:disabled + i { opacity: .6; }
.consent__linha input:focus-visible + i { outline: 2px solid var(--cyan); outline-offset: 2px; }
.consent__acoes { display: grid; grid-template-columns: repeat(3, minmax(7.2rem, 1fr)); gap: .5rem; }
@media (max-width: 860px) { .consent__acoes { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.consent__acoes button { padding: .75em .5em; border-radius: 12px; font-size: .84rem; font-weight: 500; line-height: 1.2; color: #fff; background: rgba(255, 255, 255, .08); border: 1px solid rgba(143, 211, 220, .5); transition: background-color .2s, border-color .2s; }
.consent__acoes button:hover { background: rgba(102, 184, 195, .22); border-color: var(--cyan); }
.site-footer__links .link { padding: 0; font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.site-footer__links .link:hover { color: #fff; }

/* ==========================================================================
   Ajustes de tela e movimento reduzido para o que foi acrescentado
   ========================================================================== */
@media (max-width: 900px) {
  .fyoona__grid { grid-template-columns: 1fr; text-align: center; }
  .fyoona h2, .fyoona .lead { margin-inline: auto; }
  .fyoona__pergunte, .fyoona .actions { justify-content: center; }
  .hero__chip { font-size: .78rem; padding: .55rem .8rem; }
  .hero__chip--a { top: 4%; left: -4%; }
  .hero__chip--b { top: 52%; right: -6%; }
  .hero__chip--c { display: none; }
}
@media (max-width: 640px) {
  .fy-lanc { right: 14px; bottom: 14px; width: 58px; height: 58px; }
  .fy-dica { right: 16px; bottom: 84px; }
  .fy-painel { inset: auto 0 0 0; width: 100%; height: min(88svh, 680px); border-radius: 22px 22px 0 0; }
  body.fy-aberta .fy-lanc { display: none; }
  .consent { bottom: 10px; width: calc(100vw - 20px); grid-template-columns: 1fr; }
  .consent__acoes, .consent > b, .consent > p { grid-column: 1; grid-row: auto; }
  body.tem-consent .fy-lanc, body.tem-consent .fy-dica { display: none; }
  .consent__acoes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .consent__acoes button { font-size: .78rem; padding: .7em .3em; }
}
@media (max-width: 860px) {
  .consent { grid-template-columns: 1fr; }
  .consent__acoes { grid-column: 1; grid-row: auto; margin-top: .7rem; }
}
@media (prefers-reduced-motion: reduce) {
  .holofote { display: none; }
  .hero__tilt, .hero__chip { translate: none; transform: none; }
  .fy-lanc__anel { display: none; }
}