/* Hallmark · shape: Long Document, soft chapters · genre: editorial · theme: Specimen (deal 1/3, seed gina-terapia-casal-psican-fc16·26d3f207·2026-11-06·r0), reshaped by client direction: rose and black from the logo, rounded and organic, Fraunces over DM Sans · job: book · draw: manual
 * hero: Stage, head left, portrait right melting into the blush field, butterflies in front and behind · nav: the script name alone, four links, one action · footer: mast with the full logo over address and links · imagery: client's own studio portraits, hero background replaced to match the page · signature: the casal / individual toggle that rewrites the session card in place
 * axes: light/soft-serif/warm-rose · posture: soft · contrast: pass · fold: pass · v2.0.0 */
/* Hallmark · pre-emit critique: P3 H3 E3 S3 R3 V3 · weakest: R, butterflies stay sparse and faint so they read as the brand mark, not wallpaper */
@import url("./tokens.css");
@import url("./base.css");

h1, h2, h3 { font-variation-settings: "SOFT" 100, "WONK" 0; }
h1, h2 { font-optical-sizing: auto; line-height: 1.08; }
body { font-size: 1.0625rem; }

.skip { position: absolute; left: var(--space-md); top: -100px; background: var(--color-ink); color: var(--color-paper); padding: var(--space-xs) var(--space-md); border-radius: var(--radius-pill); z-index: var(--z-modal); }
.skip:focus-visible { top: var(--space-md); }

/* borboletas da marca */
.bf { position: absolute; display: block; width: var(--bf, 96px); aspect-ratio: 250 / 174; background: var(--bf-color, var(--color-accent)); opacity: var(--bf-o, 0.2); -webkit-mask: url("img/borboleta.svg") center / contain no-repeat; mask: url("img/borboleta.svg") center / contain no-repeat; rotate: var(--bf-r, -12deg); pointer-events: none; z-index: 0; }

/* nav */
.nav { position: sticky; top: 0; z-index: var(--z-sticky-nav); background: color-mix(in oklab, var(--color-blush) 88%, transparent); backdrop-filter: blur(10px); }
.nav__in { display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg); min-height: 76px; }
.nav__logo { display: block; }
.nav__logo img { width: 210px; height: auto; }
.nav__links { display: flex; gap: var(--space-xs); list-style: none; margin: 0; padding: 0; font-size: var(--text-sm); font-weight: 500; }
.nav__links a { display: block; padding: var(--space-xs) var(--space-md); border-radius: var(--radius-pill); text-decoration: none; color: var(--color-ink-2); transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out); }
.nav__links a:hover { background: color-mix(in oklab, var(--color-paper) 70%, transparent); color: var(--color-ink); }

/* botões */
.btn { position: relative; overflow: hidden; isolation: isolate; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs); min-height: 54px; padding: 0 var(--space-xl); border: 0; border-radius: var(--radius-pill); font-weight: 600; font-size: var(--text-md); text-decoration: none; cursor: pointer; transition: transform var(--dur-short) var(--ease-out), background-color var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out); }
.btn--primary { background: var(--color-accent); color: var(--color-accent-ink); box-shadow: var(--shadow-btn); }
.btn--primary:hover { background: var(--color-ink); transform: translateY(-2px); }
.btn--primary:active { transform: translateY(0); box-shadow: none; }
.btn--secondary { background: var(--color-paper); color: var(--color-ink); box-shadow: inset 0 0 0 1.5px var(--color-ink); }
.btn--secondary:hover { background: var(--color-ink); color: var(--color-paper); }
.btn--secondary:active { background: var(--color-ink-2); color: var(--color-paper); }
.btn:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.btn:disabled { background: var(--color-paper-3); color: var(--color-muted); box-shadow: none; transform: none; cursor: progress; }
.btn--sm { min-height: 44px; padding: 0 var(--space-lg); font-size: var(--text-sm); }
.btn svg { width: 20px; height: 20px; fill: currentColor; }

/* hero */
.hero { position: relative; background: var(--color-blush); padding-top: var(--space-xl); overflow: clip; border-radius: 0 0 var(--radius-card) var(--radius-card); }
.hero__grid { position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); align-items: center; }
.hero__text { position: relative; z-index: 2; grid-column: 1 / 7; display: grid; gap: var(--space-lg); padding-bottom: var(--space-2xl); }
.hero__text h1 { max-width: 12ch; font-size: clamp(2.75rem, 5vw + 1rem, 5rem); }
.hero__text .lead { color: var(--color-ink-2); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-xs); }
.hero__stage { position: relative; grid-column: 7 / 13; align-self: end; }
.hero__photo { position: relative; z-index: 1; margin: 0 auto; max-width: 480px; aspect-ratio: 874 / 1216; -webkit-mask-image: linear-gradient(to right, transparent 0, black 10%, black 90%, transparent 100%), linear-gradient(to bottom, transparent 0, black 6%, black 86%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(to right, transparent 0, black 10%, black 90%, transparent 100%), linear-gradient(to bottom, transparent 0, black 6%, black 86%, transparent 100%); mask-composite: intersect; }
.hero__photo img { width: 100%; height: 100%; object-fit: cover; }
.hero__badge { position: absolute; z-index: 3; left: 0; bottom: 18%; display: flex; align-items: center; gap: var(--space-sm); background: var(--color-paper); border-radius: var(--radius-pill); padding: var(--space-xs) var(--space-lg) var(--space-xs) var(--space-xs); box-shadow: var(--shadow-card); text-decoration: none; transition: transform var(--dur-short) var(--ease-out); }
.hero__badge:hover { transform: translateY(-2px); }
.hero__badge:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.hero__badge strong { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--color-accent); color: var(--color-accent-ink); font-family: var(--font-display); font-weight: 600; font-size: var(--text-lg); }
.hero__badge span { font-size: var(--text-sm); line-height: 1.3; color: var(--color-ink-2); }
.hero__badge span b { display: block; color: var(--color-ink); font-weight: 600; }
.hero .bf--a { --bf: 96px; --bf-r: -18deg; --bf-o: 0.28; top: 12%; right: 4%; z-index: 2; }
.hero .bf--b { --bf: 58px; --bf-r: 14deg; --bf-o: 0.32; top: 30%; left: 6%; z-index: 2; }
.hero .bf--c { --bf: 80px; --bf-r: -6deg; --bf-o: 0.16; bottom: 12%; left: 44%; }

/* seções */
.section { position: relative; padding-block: var(--section-gap-s); }
.section > .container { position: relative; z-index: 1; }
.section__head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); margin-bottom: var(--space-2xl); align-items: end; }
.section__head h2 { grid-column: 1 / 8; }
.section__head p { grid-column: 8 / 13; color: var(--color-ink-2); }

/* situações */
.signs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-sm); max-width: 46rem; }
.signs li { position: relative; justify-self: start; max-width: 88%; padding: var(--space-md) var(--space-lg); border-radius: var(--radius-card) var(--radius-card) var(--radius-card) var(--space-2xs); background: var(--color-paper-2); font-family: var(--font-display); font-size: var(--text-lg); line-height: 1.35; font-variation-settings: "SOFT" 100; box-shadow: var(--shadow-card); }
.signs li::before { content: ""; position: absolute; bottom: 0; left: calc(-1 * var(--space-xs)); width: var(--space-md); height: var(--space-md); background: inherit; clip-path: polygon(100% 0, 100% 100%, 0 100%); }
.signs li:nth-child(even) { justify-self: end; background: var(--color-blush); border-radius: var(--radius-card) var(--radius-card) var(--space-2xs) var(--radius-card); }
.signs li:nth-child(even)::before { left: auto; right: calc(-1 * var(--space-xs)); clip-path: polygon(0 0, 100% 100%, 0 100%); }
.section__head:has(+ .signs) { margin-bottom: var(--space-xl); }

/* como funciona */
.toggle { display: inline-grid; grid-template-columns: 1fr 1fr; gap: var(--space-2xs); padding: var(--space-2xs); border-radius: var(--radius-pill); background: var(--color-paper-2); margin-bottom: var(--space-xl); }
.toggle button { min-height: 48px; padding: 0 var(--space-lg); border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--color-ink-2); font-weight: 600; cursor: pointer; transition: background-color var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out); }
.toggle button:hover { color: var(--color-ink); background: color-mix(in oklab, var(--color-paper) 60%, transparent); }
.toggle button[aria-selected="true"] { background: var(--color-paper); color: var(--color-accent); box-shadow: var(--shadow-card); }
.toggle button:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.session { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); align-items: start; }
.session__lead { grid-column: 1 / 6; font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.35; }
.session__rows { grid-column: 7 / 13; margin: 0; padding: var(--space-md) var(--space-xl); border-radius: var(--radius-card); background: var(--color-paper-2); }
.session__rows div { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: var(--space-md); padding: var(--space-md) 0; }
.session__rows div + div { border-top: var(--rule-hair) solid var(--color-rule); }
.session__rows dt { color: var(--color-muted); font-size: var(--text-sm); font-weight: 600; padding-top: var(--space-3xs); }
.session__rows dd { margin: 0; }
.session [hidden] { display: none; }

/* sobre */
.about { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); align-items: center; }
.about__photo { grid-column: 1 / 6; margin: 0; aspect-ratio: 4 / 5; border-radius: 999px 999px var(--radius-card) var(--radius-card); overflow: hidden; box-shadow: var(--shadow-card); }
.about__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.about__text { grid-column: 7 / 13; display: grid; gap: var(--space-lg); }
.about__text p { color: var(--color-ink-2); }
.about__text blockquote { margin: 0; padding: var(--space-lg) var(--space-xl); border-radius: var(--radius-card); background: var(--color-blush); font-family: var(--font-display); font-size: var(--text-lg); line-height: 1.45; }
.about .bf--foto { --bf: 120px; --bf-r: 16deg; --bf-o: 0.55; z-index: 2; top: 6%; left: calc((100% + var(--gap-columns)) * 5 / 12 - var(--gap-columns) - 90px); }

/* avaliações (pico) */
.reviews { background: var(--color-paper-2); border-radius: var(--radius-card); margin-inline: var(--space-md); }
.score { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); align-items: center; margin-bottom: var(--space-2xl); }
.score__num { grid-column: 1 / 5; font-family: var(--font-display); font-weight: 500; font-size: clamp(6rem, 15vw, 12rem); line-height: 0.9; letter-spacing: -0.03em; margin: 0; color: var(--color-ink); font-variation-settings: "SOFT" 100; }
.score__txt { grid-column: 5 / 13; display: grid; gap: var(--space-md); }
.quotes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.quotes li { padding: var(--space-xl); border-radius: var(--radius-card); background: var(--color-paper); box-shadow: var(--shadow-card); display: grid; gap: var(--space-md); align-content: space-between; }
.quotes blockquote { margin: 0; font-size: var(--text-lg); line-height: 1.5; }
.quotes cite { font-style: normal; font-size: var(--text-sm); font-weight: 600; color: var(--color-ink); }
.reviews .bf { --bf: 90px; --bf-r: -20deg; --bf-o: 0.18; top: 6%; right: 5%; }

/* perguntas */
.faq { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); }
.faq h2 { grid-column: 1 / 5; }
.faq__list { grid-column: 6 / 13; display: grid; gap: var(--space-sm); }
.faq details { border-radius: var(--radius-soft); background: var(--color-paper-2); padding-inline: var(--space-lg); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: var(--space-md); padding: var(--space-lg) 0; font-weight: 600; font-size: var(--text-lg); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--color-accent); color: var(--color-accent-ink); font-size: var(--text-lg); line-height: 1; transition: transform var(--dur-short) var(--ease-out); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq summary:hover { color: var(--color-accent); }
.faq summary:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; border-radius: var(--radius-soft); }
.faq details p { padding: 0 0 var(--space-lg); color: var(--color-ink-2); }

/* contato */
.contact { position: relative; overflow: clip; background: var(--color-ink); color: var(--color-paper); padding-block: var(--section-gap-s); border-radius: var(--radius-card); margin: 0 var(--space-md); }
.contact__grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); align-items: end; }
.contact h2 { grid-column: 1 / 8; color: var(--color-paper); }
.contact__info { grid-column: 8 / 13; display: grid; gap: var(--space-lg); }
.contact__info address { font-style: normal; color: color-mix(in oklab, var(--color-paper) 82%, transparent); }
.contact__note { color: var(--color-paper); max-width: 36ch; }
.contact__info a:not(.btn) { color: var(--color-paper); text-decoration-color: var(--color-paper-3); }
.contact__info p .maps-link { display: inline-flex; align-items: center; gap: var(--space-xs); min-height: 44px; padding: var(--space-2xs) var(--space-lg) var(--space-2xs) var(--space-md); border-radius: var(--radius-pill); box-shadow: inset 0 0 0 1.5px color-mix(in oklab, var(--color-paper) 40%, transparent); text-decoration: none; font-weight: 600; transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out); }
.maps-link svg { width: 20px; height: 20px; }
.maps-link .pin { fill: var(--color-g-red); }
.maps-link .pin-dot { fill: color-mix(in oklab, var(--color-g-red) 45%, var(--color-ink)); }
.contact__info p .maps-link:hover { background: var(--color-paper); color: var(--color-ink); }
.contact__info p .maps-link:active { background: var(--color-paper-2); color: var(--color-ink); }
.contact .btn--primary { justify-self: start; }
.contact .btn--primary:hover { background: var(--color-paper); color: var(--color-ink); }
.contact .btn:focus-visible { outline-color: var(--color-paper); }
.contact .bf { --bf: 160px; --bf-r: 12deg; --bf-o: 0.14; --bf-color: var(--color-paper); top: 12%; left: 52%; }

/* rodapé */
.footer { padding-block: var(--space-2xl) var(--space-xl); }
.footer__in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); align-items: end; }
.footer__logo { grid-column: 1 / 5; }
.footer__logo img { width: 220px; height: auto; }
.footer__meta { grid-column: 6 / 13; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-lg); font-size: var(--text-sm); color: var(--color-muted); }
.footer__meta a { color: var(--color-ink-2); }

/* WhatsApp flutuante */
.wa-float { position: fixed; right: var(--space-lg); bottom: var(--space-lg); z-index: var(--z-sticky); display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; background: var(--color-wa); color: var(--color-wa-ink); box-shadow: var(--shadow-wa); transition: transform var(--dur-short) var(--ease-out); }
.wa-float svg { width: 32px; height: 32px; fill: currentColor; }
.wa-float:hover { transform: scale(1.06); }
.wa-float:active { transform: scale(0.98); }
.wa-float:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }

/* botão depois das avaliações */
.reviews__cta { margin-top: var(--space-2xl); display: flex; justify-content: center; }

/* avaliações do Google */
.g-logo { flex: none; width: 18px; height: 18px; }
.g-r { fill: var(--color-g-red); } .g-b { fill: var(--color-g-blue); } .g-y { fill: var(--color-g-yellow); } .g-g { fill: var(--color-g-green); }
.stars { display: inline-block; width: 80px; height: 15px; background: var(--color-g-yellow); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.2 6.6.7-5 4.5 1.4 6.6L12 17.2l-5.9 3.3 1.4-6.6-5-4.5 6.6-.7z'/%3E%3C/svg%3E") 0 0 / 16px 15px repeat-x; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l2.9 6.2 6.6.7-5 4.5 1.4 6.6L12 17.2l-5.9 3.3 1.4-6.6-5-4.5 6.6-.7z'/%3E%3C/svg%3E") 0 0 / 16px 15px repeat-x; }
.gsrc { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-xs); margin: 0; font-size: var(--text-sm); color: var(--color-ink-2); }
.faces { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-md); }
.faces__row { display: flex; }
.faces__row img, .faces__more { width: 44px; height: 44px; border-radius: 50%; border: 3px solid var(--color-paper-2); object-fit: cover; }
.faces__row > * + * { margin-left: calc(-1 * var(--space-sm)); }
.faces__more { display: grid; place-items: center; background: var(--color-accent); color: var(--color-accent-ink); font-size: var(--text-xs, 0.75rem); font-weight: 600; }
.q__who { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: var(--space-sm); }
.q__who img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.q__who div { display: grid; gap: var(--space-3xs); }
.q__who .g-logo { align-self: start; opacity: 0.9; }
.quotes li { align-content: start; }
@media (prefers-reduced-motion: no-preference) {
  .faces__row > * { transition: translate var(--dur-short) var(--ease-out); }
  .faces__row:hover > * { translate: 0 -3px; }
  .faces__row:hover > :nth-child(even) { translate: 0 3px; }
}

/* situações: título à esquerda, conversa à direita */
.chat { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap-columns); align-items: center; }
.chat .section__head { grid-column: 1 / 6; display: block; margin: 0; }
.chat .signs { grid-column: 6 / 13; max-width: none; }

/* rodapé: ícone do Instagram e espaço para o flutuante */
.footer { padding-bottom: calc(var(--space-2xl) + var(--space-3xl)); }
.footer__meta { align-items: center; }
.footer__meta a { display: inline-block; padding-block: var(--space-2xs); }
.footer__ig { display: grid !important; place-items: center; width: 44px; height: 44px; padding: 0 !important; border-radius: 50%; color: var(--color-ink); background: var(--color-blush); transition: transform var(--dur-short) var(--ease-out), background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out); }
.footer__ig svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.footer__ig .dot { fill: currentColor; stroke: none; }
.footer__ig:hover { background: var(--color-accent); color: var(--color-accent-ink); transform: rotate(-8deg); }
.footer__ig:active { transform: scale(0.96); }
.footer__ig:focus-visible, .footer__meta a:focus-visible, .score__txt a:focus-visible, .contact__info a:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; border-radius: var(--radius-soft); }
.score__txt a, .contact__info p a { display: inline-block; padding-block: var(--space-2xs); }

/* formulário de triagem */
.tri { width: min(520px, calc(100% - 2 * var(--space-md))); max-height: calc(100dvh - 2 * var(--space-md)); padding: 0; border: 0; border-radius: var(--radius-card); background: var(--color-paper); color: var(--color-ink); box-shadow: var(--shadow-card); overflow: hidden; }
.tri[open] { display: flex; flex-direction: column; }
.tri::backdrop { background: color-mix(in oklab, var(--color-ink) 55%, transparent); backdrop-filter: blur(4px); }
.tri__form { position: relative; display: flex; flex-direction: column; flex: 1; min-height: 0; }
.tri__body { position: relative; display: grid; gap: var(--space-lg); padding: var(--space-xs) var(--space-xl) var(--space-xl); overflow: auto; overscroll-behavior: contain; }
.tri .bf { --bf: 70px; --bf-r: 18deg; --bf-o: 0.18; top: auto; bottom: var(--space-md); right: var(--space-md); }
.tri__top { position: relative; z-index: 3; flex: none; padding: var(--space-lg) var(--space-xl) var(--space-sm); background: var(--color-paper); display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: var(--space-sm); }
.tri__back, .tri__close { grid-row: 1; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--color-paper-2); color: var(--color-ink); cursor: pointer; transition: background-color var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out); }
.tri__back { grid-column: 1; }
.tri__close { grid-column: 3; }
.tri__back[hidden] { display: grid; visibility: hidden; }
.tri__back svg, .tri__close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tri__back:hover, .tri__close:hover { background: var(--color-blush); }
.tri__back:active, .tri__close:active { transform: scale(0.94); }
.tri__back:focus-visible, .tri__close:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.tri__bar { grid-column: 2; grid-row: 1; height: 6px; border-radius: var(--radius-pill); background: var(--color-paper-2); overflow: hidden; }
.tri__bar span { display: block; height: 100%; background: var(--color-accent); border-radius: inherit; transform-origin: left; transform: scaleX(0.14); transition: transform var(--dur-long) var(--ease-out); }
.tri__intro { position: relative; z-index: 1; margin: 0; color: var(--color-ink-2); font-size: var(--text-sm); }
.tri__step { position: relative; z-index: 1; display: grid; gap: var(--space-md); margin: 0; padding: 0; border: 0; min-width: 0; }
.tri__step legend { padding: 0; margin-bottom: var(--space-md); font-family: var(--font-display); font-size: var(--text-xl); line-height: 1.2; font-variation-settings: "SOFT" 100; }
.tri__hint { margin: calc(-1 * var(--space-sm)) 0 0; color: var(--color-muted); font-size: var(--text-sm); }
.tri__opts { display: grid; gap: var(--space-xs); }
.opt { position: relative; display: block; cursor: pointer; }
.opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.opt span { display: flex; align-items: center; min-height: 52px; padding: var(--space-xs) var(--space-lg); border-radius: var(--radius-soft); background: var(--color-paper-2); box-shadow: inset 0 0 0 1.5px transparent; font-weight: 500; transition: background-color var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out); }
.opt:hover span { background: var(--color-blush); transform: translateX(4px); }
.opt input:focus-visible + span { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.opt input:checked + span { background: var(--color-blush); color: var(--color-accent); box-shadow: inset 0 0 0 1.5px var(--color-accent); font-weight: 600; }
.opt input:active + span { transform: scale(0.98); }
.opt input:disabled + span { color: var(--color-muted); cursor: not-allowed; }
.field { display: grid; gap: var(--space-2xs); font-size: var(--text-sm); font-weight: 600; color: var(--color-ink-2); }
.field input { min-height: 52px; padding: 0 var(--space-md); border: 0; border-radius: var(--radius-soft); background: var(--color-paper-2); box-shadow: inset 0 0 0 1.5px var(--color-rule); color: var(--color-ink); font: inherit; font-size: var(--text-md); font-weight: 400; transition: box-shadow var(--dur-short) var(--ease-out), background-color var(--dur-short) var(--ease-out); }
.field input::placeholder { color: var(--color-muted); }
.field input:hover { box-shadow: inset 0 0 0 1.5px var(--color-ink-2); }
.field input:focus-visible { outline: 2px solid var(--color-accent); outline-offset: -2px; background: var(--color-paper); }
.field input[aria-invalid="true"] { box-shadow: inset 0 0 0 2px var(--color-accent); }
.field input:disabled { opacity: 0.6; cursor: not-allowed; }
.field__err { min-height: 1em; color: var(--color-accent); font-size: var(--text-sm); font-weight: 600; }
.field__err:empty { min-height: 0; }
.check { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: var(--space-sm); align-items: start; font-size: var(--text-sm); color: var(--color-ink-2); cursor: pointer; }
.check input { width: 22px; height: 22px; margin: 0; accent-color: var(--color-accent); cursor: pointer; }
.check input:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.tri__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.tri__next, .tri__send { width: 100%; margin-top: var(--space-xs); }
.tri__skip { position: relative; z-index: 1; justify-self: center; padding: var(--space-2xs) var(--space-xs); color: var(--color-muted); font-size: var(--text-sm); }
.tri__skip:hover { color: var(--color-ink); }
.tri__skip:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 2px; border-radius: var(--radius-soft); }
@media (prefers-reduced-motion: no-preference) {
  .tri[open] { animation: rise 420ms var(--ease-out) backwards; }
  .tri[open]::backdrop { animation: fade 300ms var(--ease-out) backwards; }
  .tri__step:not([hidden]) { animation: rise 380ms var(--ease-out) backwards; }
  @keyframes fade { from { opacity: 0; } }
}

@media (max-width: 60rem) {
  .nav__links { display: none; }
  .hero__text, .hero__stage, .section__head h2, .section__head p, .session__lead, .session__rows, .about__photo, .about__text, .score__num, .score__txt, .faq h2, .faq__list, .contact h2, .contact__info, .footer__logo, .footer__meta { grid-column: 1 / -1; }
  .hero__text { padding-bottom: 0; }
  .hero__stage { max-width: 420px; justify-self: center; width: 100%; }
  .about__photo { max-width: 420px; }
  .about .bf--foto { --bf: 96px; top: 0; left: min(300px, calc(100% - 110px)); }
  .chat .section__head, .chat .signs { grid-column: 1 / -1; }
  .chat .section__head { margin-bottom: var(--space-md); }
  .footer__meta { justify-content: flex-start; }
}
@media (max-width: 40rem) {
  .nav__logo img { width: 170px; }
  .hero__text h1 { max-width: none; font-size: clamp(2.5rem, 11vw, 3rem); }
  .nav .btn { display: none; }
  .nav__in { justify-content: center; min-height: 64px; }
  .nav { transition: transform var(--dur-long) var(--ease-out); }
  .nav--oculta { transform: translateY(-100%); }
  .hero .bf--b { right: 8%; top: 52%; }
  .hero__stage { max-width: none; width: calc(100% + 2 * var(--gutter)); margin-inline: calc(-1 * var(--gutter)); }
  .hero__photo { max-width: none; width: 112%; margin-left: -6%; }
  .hero__badge { left: var(--gutter); }
  .quotes { grid-template-columns: minmax(0, 1fr); }
  .quotes li { padding: var(--space-lg); }
  .signs li { max-width: 92%; padding: var(--space-sm) var(--space-md); }
  .toggle { display: grid; width: 100%; }
  .toggle button { padding: 0 var(--space-sm); font-size: var(--text-sm); }
  .session__rows { padding: var(--space-xs) var(--space-lg); }
  .session__rows div { grid-template-columns: minmax(0, 1fr); gap: var(--space-2xs); }
  .reviews, .contact { margin-inline: var(--space-xs); }
  .wa-float { right: var(--space-md); bottom: var(--space-md); }
  .footer__logo { justify-self: center; }
  .footer__meta { justify-content: center; text-align: center; }
  .hero__actions .btn--secondary { min-height: 44px; padding: 0 var(--space-xs); background: transparent; box-shadow: none; text-decoration: underline; text-underline-offset: 4px; }
  .hero__actions .btn--secondary:hover { background: transparent; color: var(--color-accent); }
  .tri { width: 100%; max-width: none; max-height: 92dvh; margin: auto 0 0; border-radius: var(--radius-card) var(--radius-card) 0 0; }
  .tri__top { padding: var(--space-md) var(--space-lg) var(--space-sm); }
  .tri__body { padding: var(--space-xs) var(--space-lg) var(--space-xl); }
  .tri .bf { display: none; }
}

/* movimento: só transform e opacity, tudo some com reduced motion */
@media (prefers-reduced-motion: no-preference) {
  /* borboletas: deriva lenta + bater de asas, propriedades separadas pra não brigar */
  .bf { animation: bf-drift 9s var(--ease-in-out) infinite alternate, bf-flap 2.6s var(--ease-in-out) infinite; animation-delay: var(--bf-d, 0s), var(--bf-d, 0s); }
  .hero .bf--b, #sobre .bf { --bf-d: -3s; }
  .hero .bf--c, .contact .bf { --bf-d: -5.5s; }
  @keyframes bf-drift { from { translate: 0 0; } 50% { translate: 10px -16px; } to { translate: -6px -6px; } }
  @keyframes bf-flap { 0%, 70%, 100% { scale: 1 1; } 78% { scale: 0.72 1; } 86% { scale: 1 1; } 92% { scale: 0.84 1; } }

  /* entrada do hero */
  .hero__text > *, .hero__photo, .hero__badge { animation: rise var(--dur-rise, 650ms) var(--ease-out) backwards; }
  .hero__text > :nth-child(2) { animation-delay: 120ms; }
  .hero__text > :nth-child(3) { animation-delay: 240ms; }
  .hero__photo { --dur-rise: 1400ms; animation-name: melt; animation-delay: 100ms; }
  .hero__badge { animation-name: pop; animation-delay: 700ms; }
  @keyframes rise { from { opacity: 0; transform: translateY(24px); } }
  @keyframes melt { from { transform: scale(1.04); } }
  @keyframes pop { from { opacity: 0; transform: translateY(12px) scale(0.92); } }

  /* brilho que atravessa o botão */
  .btn--primary::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 30%, color-mix(in oklab, var(--color-paper) 38%, transparent) 50%, transparent 70%); transform: translateX(-120%); transition: transform 700ms var(--ease-out); }
  .btn--primary:hover::after { transform: translateX(120%); }
  .btn svg { transition: transform var(--dur-short) var(--ease-out); }
  .btn:hover svg { transform: rotate(-10deg) scale(1.1); }

  /* WhatsApp flutuante: anel que respira */
  .wa-float::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--color-wa); z-index: -1; animation: ring 2.8s var(--ease-out) infinite; }
  .wa-float svg { transition: transform var(--dur-long) var(--ease-out); }
  .wa-float:hover svg { transform: rotate(-12deg); }
  @keyframes ring { 0% { opacity: 0.45; transform: scale(1); } 70%, 100% { opacity: 0; transform: scale(1.6); } }

  /* selo 5,0 pulsa de leve */
  .hero__badge strong { animation: beat 4s var(--ease-in-out) 2s infinite; }
  @keyframes beat { 0%, 88%, 100% { transform: scale(1); } 93% { transform: scale(1.1); } }

  /* cartões erguem no hover */
  .signs li, .quotes li, .faq details { transition: translate var(--dur-long) var(--ease-out), rotate var(--dur-long) var(--ease-out), box-shadow var(--dur-long) var(--ease-out); }
  .signs li:hover, .quotes li:hover { translate: 0 -6px; rotate: -0.4deg; box-shadow: var(--shadow-card); }
  .faq details:hover { translate: 4px 0; }

  /* troca casal / individual e resposta do FAQ entram suaves */
  .session:not([hidden]) > * { animation: rise 520ms var(--ease-out) backwards; }
  .session:not([hidden]) > :nth-child(2) { animation-delay: 80ms; }
  .faq details[open] p { animation: rise 420ms var(--ease-out) backwards; }

  /* rolagem suave nos links internos */
  html { scroll-behavior: smooth; scroll-padding-top: var(--space-3xl); }

  /* elementos aparecem ao rolar; a classe .js só existe com script, sem ele tudo fica visível */
  .js .rv { opacity: 0; transform: translateY(28px); transition: opacity 800ms var(--ease-out), transform 900ms var(--ease-out), translate var(--dur-long) var(--ease-out), rotate var(--dur-long) var(--ease-out), box-shadow var(--dur-long) var(--ease-out); transition-delay: calc(var(--i, 0) * 90ms), calc(var(--i, 0) * 90ms), 0s, 0s, 0s; }
  .js .rv.in { opacity: 1; transform: none; }
  .js .signs .rv { transform: translateY(16px) scale(0.92); transform-origin: bottom left; transition-delay: calc(var(--i, 0) * 280ms), calc(var(--i, 0) * 280ms), 0s, 0s, 0s; }
  .js .signs .rv:nth-child(even) { transform-origin: bottom right; }
  .js .signs .rv.in { transform: none; }
  .js .score__num.rv { transform: scale(0.85); }
  .js .score__num.rv.in { transform: none; }
}
.wa-float { isolation: isolate; }
[data-pagina="anuncio"] .nav__in { justify-content: center; }
.hero__micro { margin: calc(-1 * var(--space-sm)) 0 0; color: var(--color-ink-2); font-size: var(--text-sm); }
