/* ============================================================
   STRÍPOLI — Landing Page B2B (PGR / NR-1)
   Brand tokens from DESIGN-SYSTEM.md
   ============================================================ */

/* ---------- FONTS (self-hosted) ---------- */
@font-face { font-family:'Playfair Display'; font-weight:500; font-style:italic; font-display:swap; src:url('fonts/PlayfairDisplay-MediumItalic.ttf') format('truetype'); }
@font-face { font-family:'Playfair Display'; font-weight:600; font-style:italic; font-display:swap; src:url('fonts/PlayfairDisplay-SemiBoldItalic.ttf') format('truetype'); }
@font-face { font-family:'Playfair Display'; font-weight:400; font-style:italic; font-display:swap; src:url('fonts/PlayfairDisplay-Italic.ttf') format('truetype'); }
@font-face { font-family:'Playfair Display'; font-weight:600; font-style:normal; font-display:swap; src:url('fonts/PlayfairDisplay-SemiBold.ttf') format('truetype'); }

@font-face { font-family:'Host Grotesk'; font-weight:300; font-style:normal; font-display:swap; src:url('fonts/HostGrotesk-Light.ttf') format('truetype'); }
@font-face { font-family:'Host Grotesk'; font-weight:400; font-style:normal; font-display:swap; src:url('fonts/HostGrotesk-Regular.ttf') format('truetype'); }
@font-face { font-family:'Host Grotesk'; font-weight:500; font-style:normal; font-display:swap; src:url('fonts/HostGrotesk-Medium.ttf') format('truetype'); }
@font-face { font-family:'Host Grotesk'; font-weight:600; font-style:normal; font-display:swap; src:url('fonts/HostGrotesk-SemiBold.ttf') format('truetype'); }

/* ============================================================
   TOKENS
   ============================================================ */
:root {
  /* Brand palette */
  --ink:        #232323;
  --paper:      #fafafa;
  --green:      #2c6b52;
  --green-soft: #96d1ad;
  --bege:       #be9d7a;
  --offwhite:   #fffbf6;

  /* Gold */
  --gold:       #e4b03b;
  --gold-deep:  #c57f00;
  --gold-light: #fff1a0;
  --gold-grad:  linear-gradient(135deg, #c57f00 0%, #e4b03b 50%, #fff1a0 100%);
  --gold-grad-hover: linear-gradient(135deg, #d88c08 0%, #ecbb50 50%, #fff6c6 100%);

  /* Fonts */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'Host Grotesk', 'Helvetica Neue', Arial, sans-serif;

  /* Type scale */
  --fs-hero:    clamp(38px, 4.8vw, 64px);
  --fs-h2:      clamp(32px, 4.2vw, 54px);
  --fs-h3:      clamp(22px, 2vw, 27px);
  --fs-lead:    clamp(18px, 1.5vw, 21px);
  --fs-body:    17px;
  --fs-small:   15px;
  --fs-eyebrow: 13px;

  /* Spacing (system of 8) */
  --sp-1: 8px;  --sp-2: 16px;  --sp-3: 24px;  --sp-4: 32px;
  --sp-5: 40px; --sp-6: 48px;  --sp-8: 64px;  --sp-10: 80px;
  --sp-12: 96px; --sp-16: 128px;
  --sp-half: 4px; --sp-1-5: 12px; --sp-2-5: 20px; --sp-3-5: 28px;

  /* Layout */
  --pad-x: clamp(24px, 8vw, 160px);
  --maxw: 1200px;

  --r-card: 24px;
  --r-card-sm: 16px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- THEME: LIGHT ---------- */
[data-theme="light"] {
  --bg:          var(--offwhite);
  --bg-alt:      #ffffff;
  --bg-tint:     #eef4ef;            /* faint green tint section */
  --surface:     #ffffff;
  --text:        var(--ink);
  --text-soft:   #565b54;
  --text-mut:    rgba(35,35,35,0.52);
  --border:      rgba(35,35,35,0.12);
  --border-soft: rgba(35,35,35,0.07);
  --eyebrow:     var(--green);
  --logo-fill:   var(--green);
  --num-fill:    var(--green);
  --rule:        rgba(35,35,35,0.14);

  --hero-overlay: linear-gradient(180deg, rgba(255,251,246,0.88) 0%, rgba(255,251,246,0.50) 14%, rgba(28,28,26,0.16) 36%, rgba(28,28,26,0.38) 58%, rgba(28,28,26,0.48) 100%);
  --hero-text:    var(--ink);
  --hero-soft:    #3c413a;
  --hero-logo:    var(--green);
  --hero-eyebrow: var(--green);

  --form-bg:      var(--green);     /* seção do formulário no verde principal da marca */
  --shadow-card:  0 1px 2px rgba(35,35,35,0.04), 0 12px 40px -18px rgba(35,35,35,0.18);
}

/* ---------- THEME: DARK (cinza-escuro, never pure black) ---------- */
[data-theme="dark"] {
  --bg:          #242422;
  --bg-alt:      #2b2b28;
  --bg-tint:     #2b322c;            /* greenish deep panel */
  --surface:     #2e2e2b;
  --text:        var(--paper);
  --text-soft:   rgba(250,250,250,0.74);
  --text-mut:    rgba(250,250,250,0.50);
  --border:      rgba(250,250,250,0.14);
  --border-soft: rgba(250,250,250,0.08);
  --eyebrow:     var(--green-soft);
  --logo-fill:   var(--gold-grad);
  --num-fill:    var(--gold-grad);
  --rule:        rgba(250,250,250,0.16);

  --hero-overlay: linear-gradient(180deg, rgba(28,28,26,0.58) 0%, rgba(28,28,26,0.40) 40%, rgba(28,28,26,0.72) 100%);
  --hero-text:    var(--paper);
  --hero-soft:    rgba(250,250,250,0.80);
  --hero-logo:    var(--gold-grad);
  --hero-eyebrow: var(--green-soft);

  --form-bg:      #2b2b28;
  --shadow-card:  0 1px 2px rgba(0,0,0,0.25), 0 18px 50px -22px rgba(0,0,0,0.6);
}

/* ============================================================
   BASE
   ============================================================ */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: var(--fs-body);
  line-height: 1.62;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  transition: background-color .5s var(--ease), color .5s var(--ease);
  overflow-x: hidden;
}

h1, h2, h3 {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  line-height: 1.06;
  letter-spacing: -0.01em;
}

.wrap { max-width: var(--maxw); margin: 0 auto; padding-inline: var(--pad-x); }

.eyebrow {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--fs-eyebrow);
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--eyebrow);
}

strong, .b { font-weight: 600; color: var(--text); }
[data-theme="dark"] strong, [data-theme="dark"] .b { color: var(--paper); }

/* ---------- LOGO (gold-gradient via mask) ---------- */
.logo {
  display: block;
  width: 50px;
  aspect-ratio: 447.56 / 488.23;
  background: var(--logo-fill);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20id%3D%22Camada_2%22%20data-name%3D%22Camada%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20447.56%20488.23%22%3E%20%3Cdefs%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22Camada_1-2%22%20data-name%3D%22Camada%201%22%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M100.76%2C209.49c0%2C29-28.5%2C38.25-52%2C38.25-26.66%2C0-48.75-17.51-48.75-31.25%2C0-5.5%2C3.75-10.25%2C9.75-10.25%2C5%2C0%2C9.25%2C3.75%2C10%2C8.5%2C2.5%2C16%2C8.75%2C31%2C32.75%2C31%2C5.75%2C0%2C29.25-2.5%2C29.25-26%2C0-41.5-80.51-30.75-80.51-77.26%2C0-26%2C23-36.25%2C46-36.25%2C31.12%2C0%2C49.5%2C22.44%2C49.5%2C31.5%2C0%2C5-3.75%2C9.5-9.25%2C9.5-4.5%2C0-8.5-3.25-9.25-7.5-2.75-17.25-13.25-31.5-32.5-31.5-5.5%2C0-24%2C2.75-24%2C24%2C0%2C41%2C79%2C30.75%2C79%2C77.25Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M260.04%2C128.14c-3.43-6.86-8.34-12.5-15.69-12.5-19.12%2C0-26.72%2C25.01-30.4%2C41.43v72.32c0%2C14.46%2C3.43%2C15.2%2C7.6%2C15.2h1.72v1.96c-6.86-.74-13.73-.98-20.84-.98s-13.97.25-20.84.98v-1.96h1.96c4.17%2C0%2C7.6-.74%2C7.6-15.2v-97.57c0-14.46-3.43-15.2-7.6-15.2h-1.96v-1.96c.98%2C0%2C2.21.25%2C3.68.25%2C8.09%2C0%2C20.84-1.96%2C28.68-7.11v44.13c5.64-24.52%2C18.63-45.84%2C37.75-45.84%2C10.05%2C0%2C19.61%2C5.39%2C23.54%2C13.24%2C1.59%2C3.18%2C1.9%2C8.64-.98%2C11.52-4.58%2C4.58-11.69%2C2.36-14.22-2.7Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M331.32%2C244.59v1.96c-6.86-.74-13.73-.98-20.84-.98s-13.73.25-20.84.98v-1.96h1.96c4.17%2C0%2C7.6-.74%2C7.6-15.2v-97.57c0-14.22-3.43-15.2-7.6-15.2h-1.96v-1.96c.98%2C0%2C2.45.25%2C3.92.25%2C7.85%2C0%2C20.59-1.96%2C28.44-7.11v121.6c0%2C14.46%2C3.43%2C15.2%2C7.6%2C15.2h1.72Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M400.65%2C410.22c-6.35-.68-12.7-.91-19.27-.91s-12.7.23-19.27.91v-1.81h1.81c3.85%2C0%2C7.03-.68%2C7.03-14.06v-169.84c0-13.38-3.18-14.06-7.03-14.06h-1.81v-1.81c.91%2C0%2C2.27.23%2C3.63.23%2C7.26%2C0%2C19.05-1.81%2C26.3-6.58v192.06c0%2C13.38%2C3.17%2C14.06%2C7.03%2C14.06h1.59v1.81Z%22%3E%3C%2Fpath%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M447.56%2C408.41v1.81c-6.35-.68-12.7-.91-19.27-.91s-12.7.23-19.27.91v-1.81h1.81c3.85%2C0%2C7.03-.68%2C7.03-14.06v-90.25c0-13.15-3.18-14.06-7.03-14.06h-1.81v-1.81c.91%2C0%2C2.27.23%2C3.63.23%2C7.26%2C0%2C19.05-1.81%2C26.3-6.58v112.47c0%2C13.38%2C3.17%2C14.06%2C7.03%2C14.06h1.59Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M413.54%2C250.36c0-8.16%2C6.57-14.74%2C14.74-14.74s14.97%2C6.58%2C14.97%2C14.74-6.8%2C14.97-14.97%2C14.97-14.74-6.8-14.74-14.97Z%22%3E%3C%2Fpath%3E%20%3C%2Fg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M330.91%2C289.22c-30.21-18.97-63.17-4.24-82.77%2C26.97-19.6%2C31.21-18.56%2C67.3%2C11.65%2C86.27%2C2.53%2C1.59%2C5.08%2C2.94%2C7.64%2C4.06-12.88-3.53-27.17-10.9-42.27-23.17-3.02-2.45-5.94-4.76-8.78-6.94%2C3.9-9.61%2C5.95-20.66%2C5.95-32.43%2C0-34.43-14.02-63.46-45.98-63.46-11.47%2C0-29.85%2C6.76-36.38%2C30.38v-29.03c-6.97%2C4.73-18.67%2C6.53-26.1%2C6.53-1.35%2C0-2.48-.22-3.38-.22v1.8h1.58c3.83%2C0%2C6.98.67%2C6.98%2C13.95v168.54c0%2C13.28-3.15%2C13.96-6.98%2C13.96h-1.58v1.8c6.31-.68%2C12.61-.9%2C19.13-.9s12.6.22%2C19.13.9v-1.8h-1.8c-3.83%2C0-6.98-.68-6.98-13.96v-73.13c6.08%2C5.85%2C13.36%2C12.05%2C26.44%2C12.05%2C23.22%2C0%2C40.07-12.98%2C48.9-32.48%2C2.64%2C2.03%2C5.37%2C4.19%2C8.19%2C6.48%2C23.06%2C18.75%2C44.62%2C26%2C62.13%2C26%2C6.31%2C0%2C11.89-.97%2C16.9-2.64.05-.01.1-.03.15-.05%2C15.53-4.69%2C29.71-16.56%2C40.09-33.08%2C19.6-31.21%2C18.35-67.42-11.86-86.4ZM164.84%2C408.46c-9.45%2C0-18.79-5.29-24.87-10.7v-48.48c1.54-.74%2C3.6-1.42%2C6.24-1.77%2C9.47-1.24%2C25.76%2C1.75%2C52.58%2C19.54-4.27%2C25.01-16.33%2C41.41-33.95%2C41.41ZM199.24%2C364.21c-27.13-17.77-43.83-20.65-53.61-19.29-2.25.32-4.12.85-5.66%2C1.47v-29.41c2.93-15.98%2C13.65-31.73%2C29.18-31.73%2C22.05%2C0%2C31.36%2C26.1%2C31.36%2C60.31%2C0%2C6.58-.43%2C12.83-1.27%2C18.65ZM322.88%2C362.17c-18.87%2C30.05-42.44%2C49.14-61.8%2C36.98-19.37-12.17-12.41-41.69%2C6.46-71.73%2C18.87-30.04%2C42.44-49.14%2C61.8-36.97%2C19.37%2C12.16%2C12.41%2C41.68-6.46%2C71.72Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M333.22%2C40.36h0c-2.66%2C17.64-17.25%2C25.99-33.88%2C26.93-4.24.32-7.83%2C3.91-8.27%2C8.32-.55%2C5.4%2C3.5%2C9.51%2C8.39%2C10.01%2C8.84.9%2C35.99-12.5%2C33.76-45.26Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M313.47%2C8.01c-7.91-3.57-16.4-5.25-24.88-5.29-44.9-.08-76.43%2C36.21-108.01%2C63.38-12.08%2C10.38-25.09%2C20.04-39.65%2C26.67v135.61c0%2C9.17%2C4.71%2C11.9%2C9.43%2C11.9%2C14.09%2C0%2C16.82-23.53%2C16.82-23.53%2C0%2C0%2C1%2C.49%2C1.25.73-1.49%2C12.64-8.68%2C29.73-27.5%2C29.73-17.82%2C0-23.03-12.88-23.03-29.97v-113.46c-4.9%2C2.85-10.15%2C3.75-15.04%2C3.06h-.04c-1.23-.17-2.44-.46-3.62-.88l.02-2.56c.2.07%2C3.05.7%2C4.4.76.36.01.7.02%2C1.05.02%2C11.27%2C0%2C23.66-9.44%2C29.74-24.63%2C2.26-5.64%2C3.47-11.91%2C4.24-17.93.11-.88.3-5.12.3-5.12h1.98v32.79c37.09-18.53%2C61.87-54.56%2C97.69-75.23%2C15.07-8.75%2C32.41-15.09%2C50.08-13.94%2C8.77.55%2C17.53%2C3.05%2C24.78%2C7.87Z%22%3E%3C%2Fpath%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg%20id%3D%22Camada_2%22%20data-name%3D%22Camada%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20447.56%20488.23%22%3E%20%3Cdefs%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22Camada_1-2%22%20data-name%3D%22Camada%201%22%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M100.76%2C209.49c0%2C29-28.5%2C38.25-52%2C38.25-26.66%2C0-48.75-17.51-48.75-31.25%2C0-5.5%2C3.75-10.25%2C9.75-10.25%2C5%2C0%2C9.25%2C3.75%2C10%2C8.5%2C2.5%2C16%2C8.75%2C31%2C32.75%2C31%2C5.75%2C0%2C29.25-2.5%2C29.25-26%2C0-41.5-80.51-30.75-80.51-77.26%2C0-26%2C23-36.25%2C46-36.25%2C31.12%2C0%2C49.5%2C22.44%2C49.5%2C31.5%2C0%2C5-3.75%2C9.5-9.25%2C9.5-4.5%2C0-8.5-3.25-9.25-7.5-2.75-17.25-13.25-31.5-32.5-31.5-5.5%2C0-24%2C2.75-24%2C24%2C0%2C41%2C79%2C30.75%2C79%2C77.25Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M260.04%2C128.14c-3.43-6.86-8.34-12.5-15.69-12.5-19.12%2C0-26.72%2C25.01-30.4%2C41.43v72.32c0%2C14.46%2C3.43%2C15.2%2C7.6%2C15.2h1.72v1.96c-6.86-.74-13.73-.98-20.84-.98s-13.97.25-20.84.98v-1.96h1.96c4.17%2C0%2C7.6-.74%2C7.6-15.2v-97.57c0-14.46-3.43-15.2-7.6-15.2h-1.96v-1.96c.98%2C0%2C2.21.25%2C3.68.25%2C8.09%2C0%2C20.84-1.96%2C28.68-7.11v44.13c5.64-24.52%2C18.63-45.84%2C37.75-45.84%2C10.05%2C0%2C19.61%2C5.39%2C23.54%2C13.24%2C1.59%2C3.18%2C1.9%2C8.64-.98%2C11.52-4.58%2C4.58-11.69%2C2.36-14.22-2.7Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M331.32%2C244.59v1.96c-6.86-.74-13.73-.98-20.84-.98s-13.73.25-20.84.98v-1.96h1.96c4.17%2C0%2C7.6-.74%2C7.6-15.2v-97.57c0-14.22-3.43-15.2-7.6-15.2h-1.96v-1.96c.98%2C0%2C2.45.25%2C3.92.25%2C7.85%2C0%2C20.59-1.96%2C28.44-7.11v121.6c0%2C14.46%2C3.43%2C15.2%2C7.6%2C15.2h1.72Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M400.65%2C410.22c-6.35-.68-12.7-.91-19.27-.91s-12.7.23-19.27.91v-1.81h1.81c3.85%2C0%2C7.03-.68%2C7.03-14.06v-169.84c0-13.38-3.18-14.06-7.03-14.06h-1.81v-1.81c.91%2C0%2C2.27.23%2C3.63.23%2C7.26%2C0%2C19.05-1.81%2C26.3-6.58v192.06c0%2C13.38%2C3.17%2C14.06%2C7.03%2C14.06h1.59v1.81Z%22%3E%3C%2Fpath%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M447.56%2C408.41v1.81c-6.35-.68-12.7-.91-19.27-.91s-12.7.23-19.27.91v-1.81h1.81c3.85%2C0%2C7.03-.68%2C7.03-14.06v-90.25c0-13.15-3.18-14.06-7.03-14.06h-1.81v-1.81c.91%2C0%2C2.27.23%2C3.63.23%2C7.26%2C0%2C19.05-1.81%2C26.3-6.58v112.47c0%2C13.38%2C3.17%2C14.06%2C7.03%2C14.06h1.59Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M413.54%2C250.36c0-8.16%2C6.57-14.74%2C14.74-14.74s14.97%2C6.58%2C14.97%2C14.74-6.8%2C14.97-14.97%2C14.97-14.74-6.8-14.74-14.97Z%22%3E%3C%2Fpath%3E%20%3C%2Fg%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M330.91%2C289.22c-30.21-18.97-63.17-4.24-82.77%2C26.97-19.6%2C31.21-18.56%2C67.3%2C11.65%2C86.27%2C2.53%2C1.59%2C5.08%2C2.94%2C7.64%2C4.06-12.88-3.53-27.17-10.9-42.27-23.17-3.02-2.45-5.94-4.76-8.78-6.94%2C3.9-9.61%2C5.95-20.66%2C5.95-32.43%2C0-34.43-14.02-63.46-45.98-63.46-11.47%2C0-29.85%2C6.76-36.38%2C30.38v-29.03c-6.97%2C4.73-18.67%2C6.53-26.1%2C6.53-1.35%2C0-2.48-.22-3.38-.22v1.8h1.58c3.83%2C0%2C6.98.67%2C6.98%2C13.95v168.54c0%2C13.28-3.15%2C13.96-6.98%2C13.96h-1.58v1.8c6.31-.68%2C12.61-.9%2C19.13-.9s12.6.22%2C19.13.9v-1.8h-1.8c-3.83%2C0-6.98-.68-6.98-13.96v-73.13c6.08%2C5.85%2C13.36%2C12.05%2C26.44%2C12.05%2C23.22%2C0%2C40.07-12.98%2C48.9-32.48%2C2.64%2C2.03%2C5.37%2C4.19%2C8.19%2C6.48%2C23.06%2C18.75%2C44.62%2C26%2C62.13%2C26%2C6.31%2C0%2C11.89-.97%2C16.9-2.64.05-.01.1-.03.15-.05%2C15.53-4.69%2C29.71-16.56%2C40.09-33.08%2C19.6-31.21%2C18.35-67.42-11.86-86.4ZM164.84%2C408.46c-9.45%2C0-18.79-5.29-24.87-10.7v-48.48c1.54-.74%2C3.6-1.42%2C6.24-1.77%2C9.47-1.24%2C25.76%2C1.75%2C52.58%2C19.54-4.27%2C25.01-16.33%2C41.41-33.95%2C41.41ZM199.24%2C364.21c-27.13-17.77-43.83-20.65-53.61-19.29-2.25.32-4.12.85-5.66%2C1.47v-29.41c2.93-15.98%2C13.65-31.73%2C29.18-31.73%2C22.05%2C0%2C31.36%2C26.1%2C31.36%2C60.31%2C0%2C6.58-.43%2C12.83-1.27%2C18.65ZM322.88%2C362.17c-18.87%2C30.05-42.44%2C49.14-61.8%2C36.98-19.37-12.17-12.41-41.69%2C6.46-71.73%2C18.87-30.04%2C42.44-49.14%2C61.8-36.97%2C19.37%2C12.16%2C12.41%2C41.68-6.46%2C71.72Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M333.22%2C40.36h0c-2.66%2C17.64-17.25%2C25.99-33.88%2C26.93-4.24.32-7.83%2C3.91-8.27%2C8.32-.55%2C5.4%2C3.5%2C9.51%2C8.39%2C10.01%2C8.84.9%2C35.99-12.5%2C33.76-45.26Z%22%3E%3C%2Fpath%3E%20%3Cpath%20class%3D%22cls-1%22%20d%3D%22M313.47%2C8.01c-7.91-3.57-16.4-5.25-24.88-5.29-44.9-.08-76.43%2C36.21-108.01%2C63.38-12.08%2C10.38-25.09%2C20.04-39.65%2C26.67v135.61c0%2C9.17%2C4.71%2C11.9%2C9.43%2C11.9%2C14.09%2C0%2C16.82-23.53%2C16.82-23.53%2C0%2C0%2C1%2C.49%2C1.25.73-1.49%2C12.64-8.68%2C29.73-27.5%2C29.73-17.82%2C0-23.03-12.88-23.03-29.97v-113.46c-4.9%2C2.85-10.15%2C3.75-15.04%2C3.06h-.04c-1.23-.17-2.44-.46-3.62-.88l.02-2.56c.2.07%2C3.05.7%2C4.4.76.36.01.7.02%2C1.05.02%2C11.27%2C0%2C23.66-9.44%2C29.74-24.63%2C2.26-5.64%2C3.47-11.91%2C4.24-17.93.11-.88.3-5.12.3-5.12h1.98v32.79c37.09-18.53%2C61.87-54.56%2C97.69-75.23%2C15.07-8.75%2C32.41-15.09%2C50.08-13.94%2C8.77.55%2C17.53%2C3.05%2C24.78%2C7.87Z%22%3E%3C%2Fpath%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E") no-repeat center / contain;
  transition: background .4s var(--ease);
}
.logo.on-hero { background: var(--hero-logo); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 18px;
  color: var(--ink);
  background: var(--gold-grad);
  border: none;
  border-radius: 999px;
  padding: 21px 44px;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 10px 30px -12px rgba(197,127,0,0.6);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease);
}
.btn-gold:hover {
  background: var(--gold-grad-hover);
  transform: translateY(-2px);
  box-shadow: 0 16px 38px -12px rgba(197,127,0,0.72);
}
.btn-gold:active { transform: translateY(0); }
.btn-gold .arrow { transition: transform .35s var(--ease); }
.btn-gold:hover .arrow { transform: translateX(4px); }

.btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  color: var(--text);
  background: transparent;
  border: 1px solid var(--rule);
  border-radius: 999px;
  padding: 14px 28px;
  cursor: pointer;
  text-decoration: none;
  transition: border-color .3s var(--ease), background .3s var(--ease);
}
.btn-ghost:hover { border-color: var(--text); }

/* foco visível para navegação por teclado */
a:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
  border-radius: 4px;
}
.btn-gold:focus-visible, .btn-ghost:focus-visible {
  outline: 2px solid var(--gold-deep);
  outline-offset: 3px;
}

/* ============================================================
   NAVBAR
   ============================================================ */
.nav {
  position: fixed;
  inset: 32px 32px auto 32px;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px var(--pad-x);
  transition: background .4s var(--ease), backdrop-filter .4s var(--ease), padding .4s var(--ease), border-color .4s var(--ease), inset .4s var(--ease);
  border-bottom: 1px solid transparent;
}
.nav.scrolled {
  inset: 0 0 auto 0;          /* ao rolar: volta full-width, sem recuo nem cantos arredondados */
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  -webkit-backdrop-filter: blur(14px);
          backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border-soft);
  padding-top: 14px;
  padding-bottom: 14px;
}
.nav__links {
  display: flex;
  align-items: center;
  gap: 40px;
  list-style: none;
}
.nav__links a {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 16px;
  color: var(--nav-fg, var(--hero-text));
  text-decoration: none;
  position: relative;
  padding-bottom: 3px;
  transition: color .3s var(--ease);
}
.nav__links a::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 1px;
  background: var(--green-soft);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease);
}
.nav__links a:hover::after { transform: scaleX(1); }
.nav.scrolled .nav__links a { --nav-fg: var(--text); }
.nav.scrolled .logo { background: var(--logo-fill); }
.nav .logo { background: var(--hero-logo); }
.nav__cta { display: none; }
.nav.scrolled .nav__cta {
  display: inline-flex;
  padding: 11px 24px;
  font-size: 15px;
}
/* once the CTA appears on scroll, the redundant "Fale Conosco" link hides */
.nav.scrolled .lk-contato { display: none; }

@media (max-width: 720px) {
  .nav__links li.lk { display: none; }
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative;
  min-height: calc(100svh - 64px);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
  border-radius: 32px;
  margin: 32px;
  padding: 140px var(--pad-x) 96px;
}
.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
}
/* dark = stone texture, light = photo */
[data-theme="dark"] .hero__bg.tex-stone { background-image: url('assets/pedra-textura.jpg'); }
[data-theme="light"] .hero__bg.tex-photo { background-image: url('assets/hero.webp'); }
.hero__bg.tex-stone { background-image: url('assets/pedra-textura.jpg'); }
.hero__bg.tex-photo { background-image: url('assets/hero.webp'); }

.hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--hero-overlay);
}
/* subtle brand-ink wash to lift the hero text off the photo */
.hero__overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(35, 35, 35, 0.10);
}
/* sage glow detail — luz verde suave entrando pela lateral direita */
.hero__glow {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: radial-gradient(ellipse 42% 80% at 100% 52%, rgba(150,209,173,0.20) 0%, rgba(44,107,82,0.11) 42%, transparent 74%);
  pointer-events: none;
  opacity: 0;
  transition: opacity .8s var(--ease);
}
[data-glow="on"] .hero__glow { opacity: 1; }

.hero__inner { position: relative; z-index: 2; max-width: 940px; }
.hero h1 {
  color: var(--offwhite);
  font-size: var(--fs-hero);
  margin-bottom: 20px;
}
[data-theme="light"] .hero h1 { text-shadow: 0 1px 20px rgba(0,0,0,0.35); }

/* selo de unicidade — primeira clínica temática e sensorial do país */
.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--fs-eyebrow);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--gold-light);
  padding: 10px 22px;
  border-radius: 999px;
  border: 1px solid rgba(228,176,59,0.55);
  background: rgba(35,35,35,0.45);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 2px 14px rgba(0,0,0,0.18);
  margin-bottom: 26px;
}
.hero__sub {
  color: var(--offwhite);
  font-size: var(--fs-lead);
  font-weight: 300;
  line-height: 1.55;
  max-width: 560px;
  margin: 0 auto 26px;
  text-shadow: 0 1px 16px rgba(0,0,0,0.32);
}
.hero__sub strong { color: var(--offwhite); font-weight: 600; }
.hero__eyebrow { color: var(--hero-eyebrow); margin-bottom: 22px; display: block; }

/* serviços ofertados — chips de vidro sobre a foto */
.hero__services {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 12px;
  max-width: 680px;
  margin: 0 auto 38px;
}
.hero__services li {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.01em;
  color: var(--offwhite);
  padding: 9px 18px;
  border-radius: 999px;
  border: 1px solid rgba(255,251,246,0.34);
  background: rgba(35,35,35,0.30);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 2px 14px rgba(0,0,0,0.16);
  white-space: nowrap;
  transition: transform .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease);
}
.hero__services li:hover {
  transform: translateY(-2px);
  background: rgba(44,107,82,0.46);
  border-color: rgba(150,209,173,0.62);
}

.scroll-cue {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 34px;
  transform: translateX(-50%);
  width: 26px; height: 42px;
  border: 1.5px solid var(--offwhite);
  border-radius: 14px;
  opacity: .7;
}
.scroll-cue::after {
  content: "";
  position: absolute;
  left: 50%; top: 8px;
  width: 3px; height: 8px;
  border-radius: 2px;
  background: var(--offwhite);
  transform: translateX(-50%);
  animation: cue 1.1s var(--ease) infinite;
}
@keyframes cue { 0%{opacity:1;transform:translate(-50%,0)} 70%{opacity:0;transform:translate(-50%,12px)} 100%{opacity:0} }

/* ============================================================
   SECTION SHELL
   ============================================================ */
.section { padding: var(--sp-16) 0; position: relative; }
.section--tint { background: var(--bg-tint); border-radius: 32px; margin-inline: 32px; }
.section--alt  { background: var(--bg-alt); }

.section__head { max-width: 760px; margin-bottom: var(--sp-8); }
.section__head.center { margin-inline: auto; text-align: center; }
.section__head .eyebrow { display: block; margin-bottom: 20px; }
.section h2 { color: var(--text); font-size: var(--fs-h2); }

/* ============================================================
   CONTRASTE
   ============================================================ */
.contrast { text-align: center; }
.contrast__title {
  font-size: var(--fs-h2);
  max-width: 900px;
  margin: 22px auto 0;
  color: var(--text);
}
.contrast__title .accent { color: var(--green); font-style: italic; }
[data-theme="dark"] .contrast__title .accent { color: var(--green-soft); }
.contrast__text {
  max-width: 640px;
  margin: var(--sp-5) auto 0;
  font-size: var(--fs-lead);
  color: var(--text-soft);
  font-weight: 300;
}
.contrast__rule {
  width: 64px; height: 2px;
  background: var(--gold-grad);
  margin: var(--sp-8) auto 0;
  border-radius: 2px;
}

/* ============================================================
   JORNADA — 3 etapas
   ============================================================ */
.steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-4);
  margin-top: var(--sp-6);
}
.step {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-card);
  padding: 16px 16px 40px;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-card);
  transition: transform .4s var(--ease), border-color .4s var(--ease);
}
.step__photo {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  object-fit: cover;
  border-radius: 14px;
  margin-bottom: 28px;
}
.step__num, .step h3, .step p { margin-left: 20px; margin-right: 20px; }
.step:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--green) 40%, var(--border)); }
.step__num {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 46px;
  line-height: 1;
  background: var(--num-fill);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-bottom: 22px;
}
.step h3 { color: var(--text); margin-bottom: 16px; font-size: var(--fs-h3); }
.step p { color: var(--text-soft); font-size: var(--fs-body); font-weight: 300; }

/* closing statement — simple, not a quote */
.closing {
  margin-top: var(--sp-10);
  padding-top: var(--sp-6);
  border-top: 1px solid var(--rule);
  max-width: 880px;
}
.section__head.center ~ .steps + .closing,
.closing { margin-inline: auto; }
.closing p {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: var(--fs-lead);
  line-height: 1.6;
  color: var(--text-soft);
  text-wrap: pretty;
}

/* stone-texture closing banner */
.stone-banner {
  position: relative;
  overflow: hidden;
  margin-top: var(--sp-8);
  border-radius: var(--r-card);
  padding: var(--sp-8) var(--sp-6);
  background: url('assets/pedra-textura.jpg') center/cover no-repeat;
}
.stone-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(35, 35, 35, 0.80);
}
.stone-banner p {
  position: relative;
  z-index: 1;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(20px, 2.1vw, 27px);
  line-height: 1.5;
  color: var(--offwhite);
  max-width: 880px;
  text-wrap: pretty;
}

/* closing quote */
.quote {
  margin-top: var(--sp-10);
  padding: var(--sp-8) var(--sp-6);
  border-radius: var(--r-card);
  background: var(--bg-tint);
  border: 1px solid var(--border-soft);
  position: relative;
}
.section--tint .quote { background: var(--surface); }
.quote__mark {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 100px;
  line-height: .6;
  color: var(--green-soft);
  opacity: .4;
  display: block;
  height: 42px;
}
.quote p {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: clamp(20px, 2.1vw, 27px);
  line-height: 1.5;
  color: var(--text);
  max-width: 880px;
}

/* ============================================================
   DIFERENCIAIS
   ============================================================ */
.diffs { display: flex; flex-direction: column; margin-top: var(--sp-4); }
.diff {
  display: grid;
  grid-template-columns: minmax(0, 440px) 1fr;
  gap: var(--sp-6);
  padding: var(--sp-6) 0;
  border-top: 1px solid var(--rule);
  align-items: center;
}
.diff:last-child { border-bottom: 1px solid var(--rule); }

/* zigzag — imagem à direita nos blocos pares, mantendo as proporções */
.diff:nth-child(even) { grid-template-columns: 1fr minmax(0, 440px); }
.diff:nth-child(even) .diff__media { order: 2; }

.diff__media {
  border-radius: var(--r-card);
  overflow: hidden;
  box-shadow: var(--shadow-card);
}
.diff__media img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  height: auto;
  object-fit: cover;
  transition: transform .6s var(--ease);
}
.diff:hover .diff__media img { transform: scale(1.04); }

.diff__num {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: 40px;
  background: var(--num-fill);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.diff__body h3 { color: var(--green); font-size: var(--fs-h3); margin-bottom: 12px; }
[data-theme="dark"] .diff__body h3 { color: var(--green-soft); }
.diff__body p { color: var(--text-soft); font-weight: 300; max-width: 620px; }
.diff__body p + p { margin-top: 14px; }

@media (max-width: 720px) {
  .diff,
  .diff:nth-child(even) { grid-template-columns: 1fr; gap: var(--sp-3); }
  .diff:nth-child(even) .diff__media { order: 0; }
  .diff__media img { aspect-ratio: 16 / 9; }
  .diff__num { font-size: 34px; }
}

/* ============================================================
   PROVA SOCIAL — vídeo + avaliações do Google
   ============================================================ */
.proof__layout {
  margin-top: var(--sp-6);
  display: grid;
  grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
  gap: var(--sp-8);
  align-items: center;
}
.proof__media {
  display: flex;
  justify-content: center;
}
.proof__slot {
  display: block;
  width: 100%;
  max-width: 340px;            /* player vertical (9:16) */
  aspect-ratio: 9 / 16;
  object-fit: cover;
  background: #000;
  border-radius: var(--r-card);
  overflow: hidden;
  border: 1px solid var(--border);
  box-shadow: var(--shadow-card);
}

/* avaliações do Google (placeholder — dev conecta a API depois) */
.greviews { min-width: 0; }
.greviews__head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: var(--sp-3);
}
.greviews__glogo { flex: none; }
.greviews__score strong {
  display: block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-body);
  color: var(--text);
}
.greviews__rating {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: var(--fs-small);
  color: var(--text-soft);
}
.stars {
  color: var(--gold);
  font-size: 15px;
  letter-spacing: 2px;
  white-space: nowrap;
}
.greviews__list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.greview {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-card-sm);
  padding: var(--sp-3);
  box-shadow: var(--shadow-card);
}
.greview__top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.greview__avatar {
  flex: none;
  width: 40px; height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 16px;
  color: var(--offwhite);
  background: var(--green);
}
.greview__who { flex: 1; min-width: 0; }
.greview__who strong {
  display: block;
  font-size: var(--fs-small);
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
}
.greview__who span {
  display: block;
  font-size: 13px;
  color: var(--text-mut);
}
.greview p {
  font-size: var(--fs-small);
  font-weight: 300;
  color: var(--text-soft);
  line-height: 1.55;
}
.greviews__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: var(--sp-1-5);
  padding: 10px 0;
  min-height: 44px;            /* alvo de toque WCAG 2.5.5 */
  font-family: var(--font-body);
  font-weight: 400;
  font-size: var(--fs-small);
  color: var(--green);
  text-decoration: none;
  transition: color .25s var(--ease);
}
.greviews__link:hover { color: var(--gold-deep); }
.greviews__link .arrow { transition: transform .3s var(--ease); }
.greviews__link:hover .arrow { transform: translateX(4px); }

@media (max-width: 860px) {
  .proof__layout { grid-template-columns: 1fr; gap: var(--sp-6); }
}

/* ============================================================
   FORMULÁRIO
   ============================================================ */
.form-section {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  margin-top: var(--sp-8);     /* respiro entre Depoimento e Formulário */
  margin-inline: 32px;
  background: var(--form-bg);
}
[data-theme="dark"] .form-section::before {
  content: "";
  position: absolute; inset: 0;
  background: url('assets/pedra-textura.jpg') center/cover;
  opacity: .22;
}
.form-section .wrap { position: relative; z-index: 2; }
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-10);
  align-items: center;
}
.form-copy, .form-card { min-width: 0; }
.form-copy h2 { color: var(--paper); font-size: var(--fs-h2); margin-bottom: 24px; }
.form-copy p { color: #e9f1ec; font-weight: 300; max-width: 440px; }
.form-copy .eyebrow { display:block; margin-bottom: 20px; color: #cdeed9; }

.form-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-card);
  padding: 44px 40px;
  box-shadow: var(--shadow-card);
}
.field { margin-bottom: 20px; }
.field label {
  display: block;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--text-soft);
  margin-bottom: 8px;
}
.field input {
  width: 100%;
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 16px;
  color: var(--text);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 15px 16px;
  transition: border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.field input::placeholder { color: var(--text-mut); }
.field input:focus {
  outline: none;
  border-color: var(--green);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 22%, transparent);
}
.field.err input { border-color: var(--bege); }
.field .msg { font-size: 12px; color: var(--bege); margin-top: 6px; min-height: 0; display: none; }
.field.err .msg { display: block; }
.form-card .btn-gold { width: 100%; margin-top: 8px; }
.form-note { font-size: 13px; color: var(--text-mut); margin-top: 18px; text-align: center; }

.form-success {
  display: none;
  text-align: center;
  padding: 20px 0;
}
.form-success.show { display: block; }
.form-success .check {
  width: 64px; height: 64px; margin: 0 auto 20px;
  border-radius: 50%;
  background: var(--gold-grad);
  display: flex; align-items: center; justify-content: center;
}
.form-success .check::after {
  content:""; width: 22px; height: 12px;
  border-left: 3px solid var(--ink); border-bottom: 3px solid var(--ink);
  transform: rotate(-45deg) translate(1px,-2px);
}
.form-success h3 { color: var(--text); font-size: 26px; margin-bottom: 12px; }
.form-success p { color: var(--text-soft); font-weight: 300; }

@media (max-width: 860px) {
  .form-grid { grid-template-columns: 1fr; gap: var(--sp-6); }
}

@media (max-width: 560px) {
  .steps { grid-template-columns: 1fr; }
  .hero__badge { font-size: 11px; letter-spacing: 0.16em; padding: 8px 16px; }
  .hero__services li { white-space: normal; padding: 8px 14px; font-size: 13px; }
  .greview { padding: var(--sp-2-5); }
}

/* respiro lateral menor no mobile para não apertar o conteúdo */
@media (max-width: 720px) {
  .hero { margin: 16px; min-height: calc(100svh - 32px); }
  .section--tint, .form-section { margin-inline: 16px; }
  .nav { inset: 16px 16px auto 16px; }
  .hero .btn-gold { padding-left: 28px; padding-right: 28px; white-space: nowrap; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--bg-alt);
  border-top: 1px solid var(--border);
  padding: var(--sp-8) 0 var(--sp-5);
}
.footer__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--sp-6);
  flex-wrap: wrap;
}
.footer .logo { background: var(--logo-fill); width: 44px; }
.footer__tag { color: var(--text-soft); font-weight: 300; max-width: 320px; margin-top: 18px; font-size: var(--fs-small); }
.footer__nav { display: flex; gap: 56px; flex-wrap: wrap; }
.footer__col h4 {
  font-family: var(--font-body); font-weight: 600; font-size: 13px;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-mut);
  margin-bottom: 16px;
}
.footer__col a, .footer__col span {
  display: block; color: var(--text-soft); text-decoration: none;
  font-weight: 300; font-size: var(--fs-small); margin-bottom: 10px;
  transition: color .25s var(--ease);
}
.footer__col a:hover { color: var(--text); }
.footer__base {
  margin-top: var(--sp-6); padding-top: var(--sp-3);
  border-top: 1px solid var(--border-soft);
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  font-size: 13px; color: var(--text-mut);
}
.footer__social {
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--text-mut); text-decoration: none;
  transition: color .25s var(--ease), transform .25s var(--ease);
}
.footer__social:hover { color: var(--gold); transform: translateY(-1px); }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
/* Visible by default. Only hidden once JS marks the page ready (.js),
   so a stalled script/animation can never leave content invisible. */
.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(16px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.js .reveal.in { opacity: 1; transform: none; }
.js .reveal.d1 { transition-delay: .08s; }
.js .reveal.d2 { transition-delay: .16s; }
.js .reveal.d3 { transition-delay: .24s; }
.js .reveal.d4 { transition-delay: .32s; }

/* Ultimate failsafe — snaps everything visible with no transition (cannot freeze). */
.reveal-all .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }

@media (prefers-reduced-motion: reduce) {
  .js .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
  .scroll-cue::after { animation: none; }
}

/* ============================================================
   BOTÃO FLUTUANTE WHATSAPP
   ============================================================ */
.wa-float {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 60;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.35), 0 2px 8px rgba(0, 0, 0, 0.18);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.wa-float:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 12px 30px rgba(37, 211, 102, 0.45), 0 4px 12px rgba(0, 0, 0, 0.22);
}
.wa-float:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
}
.wa-float__icon { display: block; }

/* pulso sutil para chamar atenção */
.wa-float::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #25D366;
  z-index: -1;
  animation: wa-pulse 2.4s var(--ease) infinite;
}
@keyframes wa-pulse {
  0%   { transform: scale(1);   opacity: .6; }
  70%  { transform: scale(1.6); opacity: 0; }
  100% { transform: scale(1.6); opacity: 0; }
}

@media (max-width: 720px) {
  .wa-float { right: 16px; bottom: 16px; width: 54px; height: 54px; }
  .wa-float__icon { width: 28px; height: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .wa-float::before { animation: none; }
  .wa-float, .wa-float:hover { transition: none; transform: none; }
}
