/* ════════════════════════════════════════════════════════════════════
   WAVE STUDIO FITNESS & HEALTH — style.css  v6.0  (Unificado)
   ────────────────────────────────────────────────────────────────────
   Arquitectura : Mobile-First | BEM | CSS Custom Properties
   Tipografia   : Cinzel (display/títulos) + Cormorant Garamond (corpo)
   WCAG 2.1 AA  : Todos os pares de cor verificados

   PALETA PRINCIPAL
   ┌─────────────────────────────────────────────────────────────────┐
   │  --salvia        #8FA882  fundo de botões, badges, destaques    │
   │  --salvia-hover  #7A9470  hover de botões primários             │
   │  --salvia-texto  #4E6943  texto verde: 6.1:1 ✅ AA sobre branco │
   │  --salvia-btn    #2D2A26  texto sobre botão sálvia: 5.5:1 ✅ AA │
   │  --wa            #25D366  WhatsApp                              │
   └─────────────────────────────────────────────────────────────────┘

   ESTRUTURA DE FICHEIROS
   ├── css/
   │   ├── style.css      ← ESTE FICHEIRO (design system completo)
   │   └── overrides.css  ← Bootstrap 5.3 overrides da marca
   ├── js/
   │   └── site.js        ← JavaScript único (todos os módulos)
   ├── index.html
   └── pages/
       ├── servicos.html | galeria.html | horarios.html
       ├── reservas.html | contactos.html | nosso-espaco.html
       ├── equipa.html   | privacidade.html | cookies.html | termos.html

   CARREGAMENTO EM TODAS AS PÁGINAS:
   index.html  → css/style.css   + css/overrides.css + js/site.js
   pages/*.html→ ../css/style.css + ../css/overrides.css + ../js/site.js
════════════════════════════════════════════════════════════════════ */


/* ────────────────────────────────────────────────────────────────
   1. DESIGN TOKENS — Fonte única da verdade visual
   ──────────────────────────────────────────────────────────────── */
:root {

  /* Sálvia — cor principal da marca */
  --salvia:        #8FA882;
  --salvia-hover:  #7A9470;
  --salvia-light:  #EBF2E8;
  --salvia-rgb:    143, 168, 130;
  --salvia-texto:  #4E6943;   /* 6.1:1 ✅ AA sobre branco */
  --salvia-btn:    #2D2A26;   /* 5.5:1 ✅ AA sobre fundo sálvia */

  /* WhatsApp */
  --wa:       #25D366;
  --wa-hover: #1da851;

  /* Neutros taupe */
  --taupe:       #7D7168;
  --taupe-esc:   #5E544C;
  --taupe-light: #EDE8E3;

  /* Fundos */
  --bege:   #D8CFC4;
  --creme:  #F5F2EE;
  --branco: #FFFFFF;

  /* Texto — todos WCAG AA mínimo */
  --txt-h:     #4A403A;  /* 10.1:1 ✅ AAA sobre branco */
  --txt-corpo: #4A403A;  /* 10.1:1 ✅ AAA */
  --txt-muted: #6B5F57;  /* 6.2:1  ✅ AA  */
  --txt-inv:   #FFFFFF;

  /* Tipografia */
  --f-h:    'Cinzel', Georgia, serif;
  --f-body: 'Cormorant Garamond', Georgia, serif;

  /* Espaçamento de secções */
  --sp:    6rem 0;
  --sp-sm: 3.5rem 0;

  /* Sombras */
  --sh-xs: 0 1px 4px  rgba(74, 64, 58, .06);
  --sh-sm: 0 2px 12px rgba(74, 64, 58, .08);
  --sh-md: 0 8px 32px rgba(74, 64, 58, .13);
  --sh-lg: 0 20px 60px rgba(74, 64, 58, .18);
  --sh-xl: 0 32px 80px rgba(74, 64, 58, .22);
  --sh-s:  0 8px 28px rgba(143, 168, 130, .35);  /* acento sálvia */

  /* Raios */
  --r:    8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;

  /* Transições */
  --tr:    .28s cubic-bezier(.4, 0, .2, 1);
  --tr-lg: .45s cubic-bezier(.4, 0, .2, 1);

  /* Layout */
  --nav-h: 96px;
}


/* ────────────────────────────────────────────────────────────────
   2. RESET & BASE
   ──────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--nav-h) + 1rem);
}

/* Respeita preferência de movimento reduzido — WCAG 2.3.3 */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration:        .01ms !important;
    animation-iteration-count: 1     !important;
    transition-duration:       .01ms !important;
  }
}

body {
  font-family: var(--f-body);
  font-size:   16px;
  line-height: 1.8;
  color:       var(--txt-corpo);
  background:  var(--branco);
  overflow-x:  hidden;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4, h5, h6 {
  font-family:    var(--f-h);
  font-weight:    600;
  line-height:    1.2;
  color:          var(--txt-h);
  letter-spacing: .02em;
}


/* ────────────────────────────────────────────────────────────────
   3. ACESSIBILIDADE — WCAG 2.1 AA
   ──────────────────────────────────────────────────────────────── */

/* Foco visível para teclado — WCAG 2.4.7 */
:focus-visible {
  outline:        3px solid var(--salvia-texto);
  outline-offset: 3px;
  border-radius:  3px;
}
:focus:not(:focus-visible) { outline: none; }

/* Skip link — WCAG 2.4.1 */
.skip-link {
  position:        absolute;
  top:             -100%;
  left:            1rem;
  z-index:         9999;
  padding:         .5rem 1.25rem;
  background:      var(--salvia-texto);
  color:           var(--txt-inv);
  font-family:     var(--f-h);
  font-size:       .85rem;
  font-weight:     600;
  text-decoration: none;
  border-radius:   0 0 var(--r) var(--r);
  transition:      top var(--tr);
}
.skip-link:focus { top: 0; }


/* ────────────────────────────────────────────────────────────────
   4. TIPOGRAFIA UTILITÁRIA
   ──────────────────────────────────────────────────────────────── */

/* Rótulo de secção (texto pequeno acima do título) */
.sec-label {
  display:        block;
  font-family:    var(--f-h);
  font-size:      .7rem;
  font-weight:    600;
  letter-spacing: .24em;
  text-transform: uppercase;
  color:          var(--salvia-texto);
  margin-bottom:  .75rem;
}

/* Título de secção */
.sec-title {
  font-size:      clamp(1.9rem, 4vw, 2.8rem);
  font-weight:    600;
  color:          var(--txt-h);
  margin-bottom:  1.25rem;
  letter-spacing: .01em;
}

/* Subtítulo / lead */
.sec-sub {
  font-size:   1.05rem;
  font-weight: 400;
  max-width:   560px;
  color:       var(--txt-muted);
  line-height: 1.85;
}

/* Texto de corpo de secção */
.sec-text {
  font-size:   1.05rem;
  font-weight: 400;
  line-height: 1.9;
  color:       var(--txt-corpo);
}

/* Cor de destaque */
.txt-accent { color: var(--salvia-texto); }

/* Linha decorativa */
.deco-line {
  display:       block;
  width:         3rem;
  height:        2px;
  background:    var(--salvia);
  margin:        .4rem 0 1.4rem;
  border-radius: 2px;
}
.deco-line--center { margin-left: auto; margin-right: auto; }


/* ────────────────────────────────────────────────────────────────
   5. LAYOUT — Secções e containers
   ──────────────────────────────────────────────────────────────── */
.section         { padding: var(--sp); }
.section--creme  { background: var(--creme); }
.section--light  { background: var(--salvia-light); }
.section--dark   { background: var(--taupe-esc); }

@media (max-width: 767px) { .section { padding: var(--sp-sm); } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1200px; } }


/* ────────────────────────────────────────────────────────────────
   6. NAVBAR (Versão Corrigida para Evitar Duplicação/Tremor)
   ──────────────────────────────────────────────────────────────── */
/* ══════════════════════════════════════════════════════════════════
   6. NAVBAR — Responsiva (mobile · tablet · desktop)
   Breakpoints: ≤575px mobile | 576–991px tablet | ≥992px desktop
   ══════════════════════════════════════════════════════════════════ */

/* ── Base — todos os tamanhos ── */
.navbar {
  min-height:              var(--nav-h);     /* 96px token */
  background:              rgba(255, 255, 255, .92);
  backdrop-filter:         blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom:           1px solid rgba(216, 207, 196, .40);
  padding:                 .4rem 0;
  -webkit-transform:       translate3d(0, 0, 0);
  transform:               translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility:     hidden;
  will-change:             transform, background, box-shadow;
  transition:              background var(--tr), box-shadow var(--tr),
                           min-height var(--tr), padding var(--tr);
}

/* ── Estado após scroll (JS adiciona .navbar--scrolled) ── */
.navbar--scrolled {
  background: rgba(255, 255, 255, .98);
  box-shadow: var(--sh-md);
  min-height: 60px;
  padding:    .1rem 0;
}
.navbar--scrolled .navbar-logo {
  height: 46px;
  width:  46px;
}
.navbar--scrolled .nav-link {
  padding: .3rem .7rem !important;
}
.navbar--scrolled .btn-nav {
  padding: .3rem 1rem !important;
}
.navbar--scrolled .navbar-toggler {
  padding: .18rem .38rem;
}
.navbar--scrolled .navbar-toggler-icon {
  width:  1.1em;
  height: 1.1em;
}

/* ── Logo ── */
.navbar-logo {
  height:        80px;
  width:         80px;
  object-fit:    cover;
  border-radius: 50%;
  display:       block;
  flex-shrink:   0;
  transition:    height var(--tr), width var(--tr), opacity var(--tr);
}
.navbar-logo:hover { opacity: .88; }

/* ── Links de navegação ── */
.nav-link {
  font-family:    var(--f-h);
  font-weight:    500;
  font-size:      .8rem;
  letter-spacing: .08em;
  color:          var(--txt-h)     !important;
  padding:        .5rem .85rem     !important;
  border-radius:  var(--r);
  transition:     color var(--tr)  !important;
}
.nav-link:hover,
.nav-link.active { color: var(--salvia-texto) !important; }

/* ── Botão CTA na navbar ── */
.btn-nav {
  font-size: .78rem !important;
  padding:   .5rem 1.4rem !important;
}

/* ── Botão sanduíche ── */
.navbar-toggler {
  border:        1.5px solid rgba(216, 207, 196, .7);
  border-radius: var(--r);
  padding:       .28rem .48rem;
  line-height:   1;
  transition:    border-color var(--tr), background var(--tr),
                 padding var(--tr);
}
.navbar-toggler:hover {
  border-color: var(--salvia-texto);
  background:   rgba(143, 168, 130, .08);
}
.navbar-toggler:focus         { box-shadow: none; }
.navbar-toggler:focus-visible {
  outline:        2px solid var(--salvia-texto);
  outline-offset: 3px;
  box-shadow:     none;
}
.navbar-toggler-icon {
  width:            1.3em;
  height:           1.3em;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2878%2C105%2C67%2C0.85%29' stroke-linecap='round' stroke-width='2.2' d='M4 8h22M4 15h22M4 22h22'/%3e%3c/svg%3e");
  transition:       width var(--tr), height var(--tr);
}

/* ══ TABLET + MOBILE ≤991px — menu colapsa ══════════════════════ */
@media (max-width: 991px) {
  .navbar .container {
    position: relative;
  }

  /* Dropdown flutua por cima do conteúdo, não empurra a página */
  .navbar-collapse {
    position:              absolute;
    top:                   100%;
    left:                  0;
    right:                 0;
    z-index:               1040;
    background:            rgba(255, 255, 255, .98);
    backdrop-filter:       blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-radius:         0 0 var(--r-md) var(--r-md);
    border-top:            1px solid rgba(216, 207, 196, .4);
    box-shadow:            0 16px 48px rgba(74, 64, 58, .16);
    padding:               .2rem 1rem .6rem;
    transform-origin:      top center;
  }

  /* Links compactos no dropdown */
  #menuNav .nav-link {
    font-size:      .8rem         !important;
    padding:        .42rem .6rem  !important;
    border-bottom:  1px solid rgba(216, 207, 196, .22);
    border-radius:  0;
    letter-spacing: .05em;
  }
  #menuNav .nav-item:last-of-type .nav-link { border-bottom: none; }
  #menuNav .nav-link.active,
  #menuNav .nav-link:hover { color: var(--salvia-texto) !important; }

  /* Botão CTA largura total, compacto */
  #menuNav .btn-nav {
    width:           100%        !important;
    justify-content: center      !important;
    margin-top:      .4rem       !important;
    font-size:       .8rem       !important;
    padding:         .5rem 1rem  !important;
  }
}

/* ══ TABLET 576–991px ═══════════════════════════════════════════ */
@media (min-width: 576px) and (max-width: 991px) {
  .navbar-logo          { height: 68px; width: 68px; }
  .navbar-toggler       { padding: .3rem .52rem; }
  .navbar-toggler-icon  { width: 1.25em; height: 1.25em; }
  .navbar--scrolled     { min-height: 56px; }
  .navbar--scrolled .navbar-logo { height: 44px; width: 44px; }
}

/* ══ MOBILE ≤575px ══════════════════════════════════════════════ */
@media (max-width: 575px) {
  :root { --nav-h: 72px; }

  .navbar               { min-height: var(--nav-h); padding: .25rem 0; }
  .navbar-logo          { height: 56px; width: 56px; }
  .navbar-toggler       { padding: .25rem .44rem; }
  .navbar-toggler-icon  { width: 1.2em; height: 1.2em; }
  .navbar--scrolled     { min-height: 52px; padding: .08rem 0; }
  .navbar--scrolled .navbar-logo { height: 40px; width: 40px; }

  /* Links — área de toque mínima 44px (WCAG 2.5.5) */
  #menuNav .nav-link {
    font-size: .85rem      !important;
    padding:   .55rem .5rem !important;
  }
}


/* ────────────────────────────────────────────────────────────────
   7. HERO — index.html
   ──────────────────────────────────────────────────────────────── */
.hero {
  min-height:  100vh;
  padding-top: var(--nav-h);
  position:    relative;
  display:     flex;
  align-items: center;
  overflow:    hidden;
  background:  var(--creme);
}

/* Camada 1: foto de fundo desfocada */
.hero__bg {
  position:            absolute;
  inset:               0;
  z-index:             0;
  background-size:     cover;
  background-position: center right;
  background-repeat:   no-repeat;
  filter:              blur(3px) brightness(.85);
  transform:           scale(1.04);
}

/* Camada 2: gradiente que protege a legibilidade do texto */
.hero__overlay {
  position:  absolute;
  inset:     0;
  z-index:   1;
  background: linear-gradient(
    105deg,
    rgba(245, 242, 238, .97) 0%,
    rgba(245, 242, 238, .91) 32%,
    rgba(245, 242, 238, .62) 54%,
    rgba(245, 242, 238, .20) 72%,
    rgba(245, 242, 238, .05) 88%
  );
}

/* Camada 3: conteúdo */
.hero__inner {
  position: relative;
  z-index:  2;
  padding:  4rem 1.5rem;
  width:    100%;
}

.hero__pretitulo {
  display:        flex;
  align-items:    center;
  gap:            .75rem;
  font-family:    var(--f-h);
  font-size:      .72rem;
  font-weight:    500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color:          var(--salvia-texto);
  margin-bottom:  1.5rem;
}
.hero__pretitulo::before {
  content:       '';
  display:       block;
  width:         2rem;
  height:        1.5px;
  background:    var(--salvia);
  border-radius: 2px;
}

.hero__titulo {
  font-size:      clamp(2.6rem, 5vw, 4.2rem);
  font-weight:    700;
  color:          var(--txt-h);
  line-height:    1.1;
  margin-bottom:  .5rem;
  letter-spacing: -.01em;
}
.hero__titulo-em {
  font-style:  italic;
  font-weight: 400;
  color:       var(--salvia-texto);
}
.hero__subtitulo {
  font-family:    var(--f-h);
  font-size:      clamp(1.1rem, 2vw, 1.75rem);
  font-style:     italic;
  font-weight:    400;
  color:          var(--salvia-texto);
  line-height:    1.2;
  margin-bottom:  1.5rem;
  letter-spacing: -.01em;
  white-space:    nowrap;
}
.hero__subtitulo em {
  font-style: italic;
}

.hero__sub {
  font-size:     1.05rem;
  font-weight:   400;
  color:         var(--txt-muted);
  line-height:   1.85;
  max-width:     500px;
  margin-bottom: 2rem;
}

.hero__ctas {
  display:       flex;
  flex-wrap:     wrap;
  gap:           1rem;
  margin-bottom: 3rem;
}

.hero__trust {
  display:     flex;
  flex-wrap:   wrap;
  gap:         1.5rem;
  padding-top: 1.5rem;
  border-top:  1px solid var(--bege);
}
.trust-item {
  display:     flex;
  align-items: center;
  gap:         .45rem;
  font-family: var(--f-h);
  font-size:   .78rem;
  font-weight: 500;
  color:       var(--txt-muted);
}
.trust-icon { color: var(--salvia-texto); font-size: .95rem; }

/* Logo animado */
.hero__logo-col {
  display:         flex;
  align-items:     center;
  justify-content: center;
  padding:         2rem;
}
.hero__logo-wrap {
  position:        relative;
  display:         flex;
  align-items:     center;
  justify-content: center;
}
.hero__logo-aura {
  position:      absolute;
  width:         115%; height: 115%;
  border-radius: 50%;
  background:    radial-gradient(
    circle,
    rgba(143, 168, 130, .28) 0%,
    rgba(216, 207, 196, .22) 50%,
    transparent 75%
  );
  animation: auraPulse 4s ease-in-out infinite;
}
@keyframes auraPulse {
  0%, 100% { transform: scale(1);    opacity: .7; }
  50%       { transform: scale(1.08); opacity: 1;  }
}
.hero__logo-ring {
  position:      absolute;
  width:         108%; height: 108%;
  border-radius: 50%;
  border:        1.5px solid rgba(143, 168, 130, .22);
  animation:     ringRotate 22s linear infinite;
}
.hero__logo-ring::after {
  content:       '';
  position:      absolute;
  top:  -4px; left: 40%;
  width:         8px; height: 8px;
  border-radius: 50%;
  background:    var(--salvia);
  opacity:       .65;
}
@keyframes ringRotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
.hero__logo-img {
  width:         min(340px, 80vw);
  height:        min(340px, 80vw);
  object-fit:    cover;
  border-radius: 50%;
  position:      relative;
  z-index:       1;
  filter:
    drop-shadow(0 24px 60px rgba(74, 64, 58, .42))
    drop-shadow(0 8px 24px rgba(143, 168, 130, .30));
  animation: logoFloat 6s ease-in-out infinite;
}
@keyframes logoFloat {
  0%, 100% { transform: translateY(0);    }
  50%       { transform: translateY(-14px); }
}

/* Scroll indicator */
.hero__scroll {
  position:       absolute;
  bottom:         2rem; left: 50%;
  transform:      translateX(-50%);
  display:        flex;
  flex-direction: column;
  align-items:    center;
  gap:            .4rem;
  z-index:        2;
  animation:      scrollFade 2.2s ease-in-out infinite;
}
.hero__scroll-line {
  width:         1.5px; height: 24px;
  background:    linear-gradient(to bottom, var(--salvia-texto), transparent);
  border-radius: 2px;
}
.hero__scroll-txt {
  font-family:    var(--f-h);
  font-size:      .6rem;
  font-weight:    500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color:          var(--txt-muted);
}
@keyframes scrollFade {
  0%, 100% { opacity: .35; }
  50%       { opacity: .9;  }
}

@media (max-width: 767px) {
  .hero__sub   { max-width: 100%; }
  .hero__logo-img { width: min(240px, 80vw); height: min(240px, 80vw); }
  .hero__ctas .btn { width: 100%; justify-content: center; }
}


/* ────────────────────────────────────────────────────────────────
   8. ANIMAÇÕES DE ENTRADA
   ──────────────────────────────────────────────────────────────── */
/* Animação CSS simples para hero */
.fade-up {
  opacity:   0;
  transform: translateY(20px);
  animation: fadeUp .75s ease forwards;
}
@keyframes fadeUp { to { opacity: 1; transform: translateY(0); } }

/* Reveal via JS (IntersectionObserver) — classe única para todo o site */
.reveal {
  opacity:    0;
  transform:  translateY(28px);
  transition: opacity .65s ease, transform .65s ease;
}
.reveal.is-visible { opacity: 1; transform: translateY(0); }


/* ────────────────────────────────────────────────────────────────
   9. PÁGINA HERO — Subpáginas (pages/)
   ──────────────────────────────────────────────────────────────── */
.page-hero {
  background:    var(--creme);
  padding:       calc(var(--nav-h) + 4rem) 0 4rem;
  position:      relative;
  overflow:      hidden;
  border-bottom: 1px solid var(--bege);
}
.page-hero::before {
  content:  '';
  position: absolute;
  inset:    0;
  background:
    radial-gradient(ellipse 70% 60% at 80% 50%, rgba(143,168,130,.10) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 20% 80%, rgba(216,207,196,.30) 0%, transparent 60%);
  pointer-events: none;
}

/* Variante com imagem de fundo */
.page-hero--img {
  background-size:     cover;
  background-position: center;
  padding:             calc(var(--nav-h) + 5rem) 0 5rem;
  color:               var(--txt-inv);
}
.page-hero--img .page-hero__overlay {
  position:  absolute;
  inset:     0;
  background: linear-gradient(
    to right,
    rgba(74, 64, 58, .92) 0%,
    rgba(74, 64, 58, .72) 50%,
    rgba(74, 64, 58, .38) 100%
  );
}

.page-hero__inner {
  position: relative;
  z-index:  1;
}

/* Breadcrumb */
.breadcrumb-wave {
  display:        flex;
  align-items:    center;
  gap:            .5rem;
  font-family:    var(--f-h);
  font-size:      .7rem;
  font-weight:    500;
  letter-spacing: .15em;
  text-transform: uppercase;
  color:          var(--salvia-texto);
  margin-bottom:  1.25rem;
}
.page-hero--img .breadcrumb-wave { color: rgba(255,255,255,.75); }
.breadcrumb-wave a {
  color:           inherit;
  text-decoration: none;
  transition:      opacity var(--tr);
}
.breadcrumb-wave a:hover { opacity: .8; }

.page-hero__titulo {
  font-size:      clamp(2.2rem, 5vw, 3.8rem);
  font-weight:    700;
  color:          var(--txt-h);
  margin-bottom:  1rem;
  line-height:    1.15;
}
.page-hero--img .page-hero__titulo { color: var(--txt-inv); }

.page-hero__sub {
  font-size:   1.05rem;
  font-weight: 400;
  color:       var(--txt-muted);
  max-width:   540px;
  line-height: 1.85;
}
.page-hero--img .page-hero__sub { color: rgba(255,255,255,.82); }


/* ────────────────────────────────────────────────────────────────
   10. COMPONENTES REUTILIZÁVEIS
   ──────────────────────────────────────────────────────────────── */

/* Card base */
.card-wave {
  background:    var(--branco);
  border:        1.5px solid var(--bege);
  border-radius: var(--r-xl);
  padding:       2rem;
  height:        100%;
  box-shadow:    var(--sh-sm);
  position:      relative;
  overflow:      hidden;
  transition:    transform var(--tr), box-shadow var(--tr), border-color var(--tr);
}
.card-wave::before {
  content:          '';
  position:         absolute;
  top: 0; left: 0; right: 0;
  height:           3px;
  background:       linear-gradient(90deg, var(--salvia), var(--salvia-texto));
  transform:        scaleX(0);
  transform-origin: left;
  transition:       transform var(--tr);
}
.card-wave:hover {
  transform:    translateY(-5px);
  box-shadow:   var(--sh-md);
  border-color: rgba(143, 168, 130, .40);
}
.card-wave:hover::before { transform: scaleX(1); }

/* Variante destaque (fundo sálvia) */
.card-wave--accent {
  background:   var(--salvia-texto);
  border-color: var(--salvia-texto);
  color:        var(--txt-inv);
}
.card-wave--accent::before {
  background: rgba(255, 255, 255, .25);
  transform:  scaleX(1);
}

/* Ícone de card */
.card-icon {
  width:           48px;
  height:          48px;
  background:      var(--salvia-light);
  border-radius:   var(--r-lg);
  display:         flex;
  align-items:     center;
  justify-content: center;
  margin-bottom:   1.25rem;
  flex-shrink:     0;
}
.card-icon i { font-size: 1.4rem; color: var(--salvia-texto); }
.card-wave--accent .card-icon { background: rgba(255,255,255,.18); }
.card-wave--accent .card-icon i { color: var(--txt-inv); }

/* Número de card */
.card-num {
  font-family:    var(--f-h);
  font-size:      .68rem;
  font-weight:    500;
  letter-spacing: .15em;
  color:          var(--txt-muted);
  margin-bottom:  .35rem;
  display:        block;
}
.card-wave--accent .card-num { color: rgba(255,255,255,.55); }

/* Título de card */
.card-title { font-size: 1.25rem; margin-bottom: .65rem; }
.card-wave--accent .card-title { color: var(--txt-inv); }

/* Texto de card */
.card-text {
  font-size:   .95rem;
  line-height: 1.8;
  color:       var(--txt-corpo);
  margin-bottom: 1rem;
}
.card-wave--accent .card-text { color: rgba(255,255,255,.88); }

/* Lista de card */
.card-list {
  list-style: none;
  padding:    0;
  margin:     0 0 1.25rem;
  font-size:  .9rem;
}
.card-list li {
  display:     flex;
  align-items: flex-start;
  gap:         .5rem;
  padding:     .3rem 0;
  color:       var(--txt-corpo);
}
.card-list .bi-check2 { color: var(--salvia-texto); font-size: 1rem; flex-shrink: 0; margin-top: .1rem; }
.card-wave--accent .card-list li { color: rgba(255,255,255,.88); }
.card-wave--accent .card-list .bi-check2 { color: rgba(255,255,255,.75); }

/* CTA de card (link com seta) */
.card-cta {
  font-family:     var(--f-h);
  font-size:       .8rem;
  font-weight:     600;
  letter-spacing:  .08em;
  text-transform:  uppercase;
  color:           var(--salvia-texto);
  text-decoration: none;
  border-bottom:   1.5px solid rgba(78, 105, 67, .35);
  padding-bottom:  2px;
  display:         inline-flex;
  align-items:     center;
  gap:             .4rem;
  transition:      border-color var(--tr), gap var(--tr);
  margin-top:      auto;
}
.card-cta:hover { border-color: var(--salvia-texto); gap: .7rem; }
.card-wave--accent .card-cta { color: var(--txt-inv); border-color: rgba(255,255,255,.45); }

/* Badge pulsante */
.badge-pulse {
  position:       absolute;
  top:            1.1rem;
  right:          1.25rem;
  background:     var(--txt-inv);
  color:          var(--salvia-texto);
  font-family:    var(--f-h);
  font-size:      .6rem;
  font-weight:    800;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding:        .22rem .75rem;
  border-radius:  50px;
  box-shadow:     0 2px 10px rgba(var(--salvia-rgb), .35);
  animation:      badgePulse 2.5s ease-in-out infinite;
}
@keyframes badgePulse {
  0%, 100% { transform: scale(1);    box-shadow: 0 2px 10px rgba(143,168,130,.35); }
  50%       { transform: scale(1.05); box-shadow: 0 4px 20px rgba(143,168,130,.55); }
}

/* Info pill */
.info-pill {
  display:      inline-flex;
  align-items:  center;
  gap:          .4rem;
  font-family:  var(--f-h);
  font-size:    .7rem;
  font-weight:  600;
  letter-spacing: .05em;
  color:        var(--salvia-texto);
  background:   var(--salvia-light);
  border:       1px solid rgba(143, 168, 130, .35);
  border-radius: 50px;
  padding:      .3rem .85rem;
}

/* Urgência / exclusividade */
.urgencia-bar {
  display:      flex;
  align-items:  center;
  gap:          .75rem;
  background:   rgba(74, 64, 58, .05);
  border:       1px solid var(--bege);
  border-radius: var(--r-md);
  padding:      .75rem 1.25rem;
  margin-bottom: 2.5rem;
  font-size:    .82rem;
  color:        var(--txt-muted);
}
.urgencia-bar strong { color: var(--txt-h); font-family: var(--f-h); }
.urgencia-dot {
  width:         8px; height: 8px;
  border-radius: 50%;
  background:    #22c55e;
  flex-shrink:   0;
  animation:     dotPulse 1.5s ease-in-out infinite;
}
@keyframes dotPulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: .35; }
}


/* ────────────────────────────────────────────────────────────────
   11. SECÇÃO SOBRE
   ──────────────────────────────────────────────────────────────── */
.sobre__img-wrap {
  border-radius: var(--r-xl);
  overflow:      hidden;
  box-shadow:    var(--sh-xl);
  position:      relative;
}
.sobre__img {
  width:      100%;
  height:     480px;
  object-fit: cover;
  display:    block;
  transition: transform .6s ease;
}
.sobre__img-wrap:hover .sobre__img { transform: scale(1.03); }
.sobre__badge {
  position:        absolute;
  bottom:          1.5rem;
  left:            1.5rem;
  background:      rgba(255, 255, 255, .96);
  backdrop-filter: blur(8px);
  border-radius:   var(--r-lg);
  padding:         1rem 1.5rem;
  box-shadow:      var(--sh-md);
  border-left:     3px solid var(--salvia);
}
.sobre__badge-num {
  display:     block;
  font-family: var(--f-h);
  font-size:   2rem;
  font-weight: 700;
  color:       var(--salvia-texto);
  line-height: 1;
}
.sobre__badge-lbl {
  font-family:    var(--f-h);
  font-size:      .7rem;
  font-weight:    500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color:          var(--txt-muted);
  margin-top:     .2rem;
  display:        block;
}

/* Stat grid */
.stat-grid {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  gap:                   1rem;
  margin-top:            2rem;
}
.stat-card {
  background:    var(--creme);
  border-radius: var(--r-lg);
  padding:       1.25rem 1rem;
  text-align:    center;
  border:        1px solid var(--bege);
}
.stat-num {
  display:     block;
  font-family: var(--f-h);
  font-size:   2rem;
  font-weight: 700;
  color:       var(--salvia-texto);
  line-height: 1;
}
.stat-lbl {
  font-family:    var(--f-h);
  font-size:      .7rem;
  font-weight:    500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color:          var(--txt-muted);
  margin-top:     .3rem;
  display:        block;
}

@media (max-width: 767px) {
  .sobre__img   { height: 300px; }
  .sobre__badge { display: none; }
  .stat-grid    { gap: .5rem; }
}


/* ────────────────────────────────────────────────────────────────
   12. GIFT CARD — Secção especial (index.html)
   ──────────────────────────────────────────────────────────────── */
.gift-section {
  background: linear-gradient(135deg, var(--taupe-esc) 0%, #2d2420 55%, #180f0c 100%);
  padding:    var(--sp);
  position:   relative;
  overflow:   hidden;
}
.gift-section::before {
  content:       '';
  position:      absolute;
  top: -80px; right: -80px;
  width:         400px; height: 400px;
  border-radius: 50%;
  background:    radial-gradient(circle, rgba(143,168,130,.14) 0%, transparent 70%);
}
.gift-section::after {
  content:       '';
  position:      absolute;
  bottom: -60px; left: -50px;
  width:         250px; height: 250px;
  border-radius: 50%;
  background:    radial-gradient(circle, rgba(216,207,196,.08) 0%, transparent 70%);
}

/* Mockup cartão físico */
/* ── Fotografia real do cartão presente ── */
.gift-photo-wrap {
  position:   relative;
  max-width:  480px;
  width:      100%;
  transform:  perspective(900px) rotateY(-5deg) rotateX(2deg);
  transition: transform .5s ease;
  filter:     drop-shadow(0 40px 80px rgba(0,0,0,.45));
}
.gift-photo-wrap:hover {
  transform: perspective(900px) rotateY(0deg) rotateX(0deg) translateY(-8px);
  filter:    drop-shadow(0 50px 100px rgba(0,0,0,.35));
}
.gift-photo {
  width:         100%;
  border-radius: 16px;
  display:       block;
  position:      relative;
  z-index:       1;
}
.gift-photo__glow {
  position:      absolute;
  bottom:        -30px;
  left:          10%;
  right:         10%;
  height:        60px;
  background:    radial-gradient(ellipse at center, rgba(143,168,130,.45) 0%, transparent 70%);
  filter:        blur(18px);
  z-index:       0;
  pointer-events:none;
}

/* Opções de gift pill */
.gift-opt {
  display:        inline-flex;
  align-items:    center;
  gap:            .4rem;
  font-family:    var(--f-h);
  font-size:      .72rem;
  font-weight:    600;
  letter-spacing: .05em;
  padding:        .4rem 1rem;
  border-radius:  50px;
  border:         1.5px solid rgba(255,255,255,.22);
  color:          rgba(255,255,255,.72);
  background:     transparent;
}

@media (max-width: 767px) {
  .gift-photo-wrap {
    transform: none;
    max-width: 320px;
    margin: 0 auto;
  }
}


/* ────────────────────────────────────────────────────────────────
   13. SECÇÃO DE TESTEMUNHOS + CONTADORES
   ──────────────────────────────────────────────────────────────── */
.test-card {
  background:    var(--branco);
  border-radius: var(--r-xl);
  padding:       2rem;
  height:        100%;
  border:        1px solid var(--bege);
  box-shadow:    var(--sh-sm);
  position:      relative;
  margin:        0;
  transition:    transform var(--tr), box-shadow var(--tr);
}
.test-card:hover { transform: translateY(-4px); box-shadow: var(--sh-md); }
.test-card--star { background: var(--creme); border-color: var(--salvia); border-width: 2px; }
.test-card::before {
  content:   '\201C';
  font-family: var(--f-h);
  font-size:   5rem;
  line-height: 1;
  color:       var(--salvia);
  opacity:     .13;
  position:    absolute;
  top:         .5rem; right: 1.5rem;
}
.test-stars {
  display:       flex;
  gap:           .15rem;
  color:         var(--salvia-texto);
  font-size:     .82rem;
  margin-bottom: .9rem;
}
.test-txt {
  font-style:    italic;
  font-size:     1.02rem;
  line-height:   1.85;
  color:         var(--txt-corpo);
  margin-bottom: 1.35rem;
}
.test-footer { display: flex; align-items: center; gap: .8rem; }
.test-avatar {
  width:           44px; height: 44px;
  border-radius:   50%;
  font-family:     var(--f-h);
  font-size:       1.05rem;
  font-weight:     700;
  display:         flex;
  align-items:     center;
  justify-content: center;
  flex-shrink:     0;
}
.test-avatar--a { background: var(--salvia-texto); color: var(--txt-inv); }
.test-avatar--b { background: var(--taupe);        color: var(--txt-inv); }
.test-avatar--c { background: #A5C8A0;              color: var(--txt-h);  }
.test-name    { font-family: var(--f-h); font-size: .92rem; font-weight: 600; color: var(--txt-h); display: block; }
.test-service { font-size: .75rem; color: var(--txt-muted); display: block; margin-top: .1rem; }

/* Contadores */
.counters-wrap {
  background:    var(--salvia-texto);
  border-radius: var(--r-xl);
  padding:       3rem 2rem;
  margin-top:    3rem;
}
.counters-label {
  font-family:    var(--f-h);
  font-size:      .7rem;
  font-weight:    500;
  letter-spacing: .22em;
  text-transform: uppercase;
  color:          rgba(255,255,255,.70);
  margin-bottom:  2rem;
  text-align:     center;
}
.counter-num {
  display:     block;
  font-family: var(--f-h);
  font-size:   clamp(2.2rem, 5vw, 3.2rem);
  font-weight: 700;
  color:       var(--txt-inv);
  line-height: 1;
  margin-bottom: .35rem;
}
.counter-lbl {
  font-family: var(--f-h);
  font-size:   .75rem;
  color:       rgba(255,255,255,.72);
}

@media (max-width: 575px) { .counters-wrap { padding: 2rem 1rem; } }


/* ────────────────────────────────────────────────────────────────
   14. HORÁRIO
   ──────────────────────────────────────────────────────────────── */
.horario-wrap {
  background:    var(--creme);
  border-radius: var(--r-xl);
  overflow:      hidden;
  box-shadow:    var(--sh-sm);
  border:        1px solid var(--bege);
}
.horario-table { width: 100%; border-collapse: collapse; }
.horario-table th {
  font-family:    var(--f-h);
  font-size:      .72rem;
  font-weight:    600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color:          var(--txt-muted);
  padding:        .85rem 1.25rem;
  border-bottom:  2px solid var(--bege);
  text-align:     left;
  background:     rgba(216, 207, 196, .18);
}
.horario-table td {
  padding:      .85rem 1.25rem;
  border-bottom: 1px solid var(--bege);
  font-size:    .95rem;
  color:        var(--txt-corpo);
}
.horario-table tr:last-child td { border-bottom: none; }
.horario-table tr:hover td      { background: var(--salvia-light); }
.hora-day    { font-family: var(--f-h); font-weight: 600; color: var(--txt-h); }
.hora-time   { color: var(--salvia-texto); font-weight: 600; }
.hora-closed { color: var(--txt-muted); font-style: italic; }
.hora-star   { color: #ca8a04; } /* dourado para abertura especial */

/* Cards de aula */
.horario-dia-card {
  background:    var(--branco);
  border:        1px solid var(--bege);
  border-radius: var(--r-xl);
  overflow:      hidden;
  box-shadow:    var(--sh-sm);
  margin-bottom: 1.5rem;
}
.horario-dia-card__header {
  background:    var(--creme);
  padding:       1rem 1.5rem;
  border-bottom: 1px solid var(--bege);
  display:       flex;
  align-items:   center;
  gap:           .75rem;
}
.horario-dia-card__nome {
  font-family: var(--f-h);
  font-size:   1rem;
  font-weight: 700;
  color:       var(--txt-h);
  margin:      0;
}
.horario-aula {
  display:       grid;
  grid-template-columns: 80px 1fr auto;
  align-items:   center;
  gap:           1rem;
  padding:       .85rem 1.5rem;
  border-bottom: 1px solid var(--creme);
  transition:    background var(--tr);
}
.horario-aula:last-child { border-bottom: none; }
.horario-aula:hover      { background: var(--creme); }
.horario-aula__hora {
  font-family: var(--f-h);
  font-size:   .88rem;
  font-weight: 700;
  color:       var(--salvia-texto);
}
.horario-aula__nome {
  font-family: var(--f-h);
  font-size:   .88rem;
  font-weight: 600;
  color:       var(--txt-h);
  margin:      0 0 .15rem;
}
.horario-aula__treinador { font-size: .78rem; color: var(--txt-muted); }
.horario-aula__vagas {
  font-family:    var(--f-h);
  font-size:      .65rem;
  font-weight:    700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding:        .2rem .65rem;
  border-radius:  50px;
  white-space:    nowrap;
}
.horario-aula__vagas--livre  { background: var(--salvia-light); color: var(--salvia-texto); }
.horario-aula__vagas--lotado { background: #FEE2E2; color: #991B1B; }

@media (max-width: 575px) {
  .horario-aula { grid-template-columns: 70px 1fr; }
  .horario-aula__vagas { display: none; }
}


/* ────────────────────────────────────────────────────────────────
   15. FORMULÁRIO DE RESERVA — WhatsApp
   ──────────────────────────────────────────────────────────────── */
.reserva-wrap {
  background:    var(--creme);
  border-radius: var(--r-xl);
  overflow:      hidden;
  box-shadow:    var(--sh-xl);
  border:        1px solid var(--bege);
}
.reserva-head {
  background:  var(--salvia-texto);
  padding:     2rem 2.5rem;
  position:    relative;
  overflow:    hidden;
}
.reserva-head::before {
  content:       '';
  position:      absolute;
  bottom: -30px; right: -30px;
  width:         120px; height: 120px;
  border-radius: 50%;
  background:    rgba(255,255,255,.08);
}
.reserva-head__title { font-size: 1.5rem; color: var(--txt-inv); margin: 0 0 .25rem; }
.reserva-head__sub   { font-size: .88rem; color: rgba(255,255,255,.88); margin: 0; font-weight: 400; }
.reserva-head__logo  { width: 52px; height: 52px; object-fit: contain; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); }

.reserva-body { padding: 2.5rem; }
@media (max-width: 575px) { .reserva-body { padding: 1.5rem; } .reserva-head { padding: 1.5rem; } }

/* Seletor visual de serviço */
.srv-selector { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.srv-sel-btn {
  font-family:    var(--f-h);
  font-size:      .72rem;
  font-weight:    600;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding:        .45rem 1rem;
  border-radius:  50px;
  border:         1.5px solid var(--bege);
  background:     var(--branco);
  color:          var(--txt-muted);
  cursor:         pointer;
  transition:     all var(--tr);
}
.srv-sel-btn:hover { border-color: var(--salvia); color: var(--salvia-texto); background: var(--salvia-light); }
.srv-sel-btn.active {
  background:   var(--salvia-texto);
  border-color: var(--salvia-texto);
  color:        var(--txt-inv);
}
.srv-sel-btn:focus-visible { outline: 2px solid var(--salvia-texto); outline-offset: 2px; }

/* Contexto dinâmico */
.srv-context {
  display:       none;
  align-items:   flex-start;
  gap:           .75rem;
  background:    var(--salvia-light);
  border:        1px solid rgba(143,168,130,.30);
  border-radius: var(--r-md);
  padding:       .85rem 1.1rem;
  margin-bottom: 1.5rem;
  font-size:     .88rem;
  color:         var(--salvia-texto);
}
.srv-context.is-visible { display: flex; }
.srv-context i           { font-size: 1.1rem; flex-shrink: 0; margin-top: .05rem; }

/* Campos de formulário */
.form-label {
  font-family:    var(--f-h);
  font-size:      .8rem;
  font-weight:    500;
  letter-spacing: .04em;
  color:          var(--txt-corpo);
  margin-bottom:  .4rem;
}
.form-control,
.form-select {
  border:        1.5px solid var(--bege);
  border-radius: var(--r);
  padding:       .7rem 1rem;
  font-family:   var(--f-body);
  font-size:     .95rem;
  color:         var(--txt-h);
  background:    var(--branco);
  transition:    border-color var(--tr), box-shadow var(--tr);
}
.form-control:focus,
.form-select:focus {
  border-color: var(--salvia-texto);
  box-shadow:   0 0 0 3px rgba(78, 105, 67, .20);
  outline:      none;
}
.form-control::placeholder { color: #A09488; }
.form-check-input:checked { background-color: var(--salvia-texto); border-color: var(--salvia-texto); }
.form-check-input:focus   { box-shadow: 0 0 0 3px rgba(78,105,67,.20); border-color: var(--salvia-texto); }

.campo-req  { color: var(--salvia-texto); }
.link-rgpd  { color: var(--salvia-texto); text-decoration: underline; }
.invalid-feedback { font-size: .75rem; color: #b91c1c; margin-top: .3rem; }

/* Sucesso */
.form-success { padding: 3rem 2rem; text-align: center; }
.form-success__icon  { font-size: 3.5rem; color: var(--salvia-texto); display: block; margin-bottom: 1rem; }
.form-success__title { font-size: 1.4rem; color: var(--txt-h); margin-bottom: .6rem; }
.form-success__text  { font-size: .95rem; color: var(--txt-muted); }

/* Passos */
.passos-list { list-style: none; padding: 0; margin: 0; }
.passo       { display: flex; gap: 1rem; margin-bottom: 1.4rem; align-items: flex-start; }
.passo__num  {
  width:           36px; height: 36px;
  border-radius:   50%;
  background:      var(--salvia-light);
  border:          1.5px solid var(--salvia);
  color:           var(--salvia-texto);
  font-family:     var(--f-h);
  font-size:       .88rem;
  font-weight:     700;
  display:         flex;
  align-items:     center;
  justify-content: center;
  flex-shrink:     0;
}
.passo__h { font-family: var(--f-h); font-weight: 600; font-size: .92rem; color: var(--txt-h); margin: 0 0 .15rem; }
.passo__p { font-size: .84rem; color: var(--txt-muted); margin: 0; }

/* Contacto direto */
.contacto-dir { margin-top: 1.75rem; }
.contacto-dir__lbl {
  font-family:    var(--f-h);
  font-size:      .68rem;
  font-weight:    600;
  letter-spacing: .15em;
  text-transform: uppercase;
  color:          var(--txt-muted);
  margin-bottom:  .6rem;
}
.contacto-dir__link {
  display:         flex;
  align-items:     center;
  gap:             .5rem;
  color:           var(--txt-corpo);
  text-decoration: none;
  font-size:       .92rem;
  margin-bottom:   .45rem;
  transition:      color var(--tr);
}
.contacto-dir__link:hover    { color: var(--salvia-texto); }
.contacto-dir__link .bi      { color: var(--salvia-texto); }
.contacto-dir__link--wa      { color: var(--wa); font-weight: 600; }
.contacto-dir__link--wa .bi  { color: var(--wa); }
.contacto-dir__link--wa:hover { color: var(--wa-hover); }


/* ────────────────────────────────────────────────────────────────
   16. CTA STRIP — Faixa de chamada à ação
   ──────────────────────────────────────────────────────────────── */
.cta-strip {
  background:  var(--salvia);
  padding:     5rem 1.5rem;
  position:    relative;
  overflow:    hidden;
  text-align:  center;
}
.cta-strip::before,
.cta-strip::after {
  content:       '';
  position:      absolute;
  border-radius: 50%;
  background:    rgba(255,255,255,.07);
}
.cta-strip::before { width: 400px; height: 400px; top: -100px; right: -100px; }
.cta-strip::after  { width: 250px; height: 250px; bottom: -80px; left: -60px; }
.cta-strip__inner  { max-width: 680px; margin: 0 auto; position: relative; z-index: 1; }
.cta-strip__pre    { font-family: var(--f-h); font-size: .7rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: rgba(255,255,255,.75); margin-bottom: .75rem; }
.cta-strip__h      { font-size: clamp(1.9rem, 4vw, 2.8rem); color: var(--txt-inv); font-weight: 700; margin-bottom: .7rem; line-height: 1.25; }
.cta-strip__p      { font-size: 1.05rem; color: rgba(255,255,255,.82); font-weight: 400; margin-bottom: 2rem; }
.cta-strip__note   { font-family: var(--f-h); font-size: .78rem; color: rgba(255,255,255,.60); margin-top: 1.25rem; }

@media (max-width: 575px) { .cta-strip { padding: 4rem 1.5rem; } }


/* ────────────────────────────────────────────────────────────────
   17. GALERIA + LIGHTBOX
   ──────────────────────────────────────────────────────────────── */
.galeria-grid {
  columns:    3 240px;
  gap:        1rem;
}
.galeria-item {
  break-inside:  avoid;
  margin-bottom: 1rem;
  position:      relative;
  overflow:      hidden;
  border-radius: var(--r-lg);
  cursor:        pointer;
}
.galeria-item img {
  width:      100%;
  display:    block;
  transition: transform .45s ease;
}
.galeria-item:hover img { transform: scale(1.05); }
.galeria-item__overlay {
  position:        absolute;
  inset:           0;
  background:      rgba(74, 64, 58, 0);
  display:         flex;
  align-items:     center;
  justify-content: center;
  transition:      background var(--tr);
}
.galeria-item:hover .galeria-item__overlay { background: rgba(74, 64, 58, .40); }
.galeria-item__overlay i {
  color:      var(--txt-inv);
  font-size:  2rem;
  opacity:    0;
  transform:  scale(.7);
  transition: all var(--tr);
}
.galeria-item:hover .galeria-item__overlay i { opacity: 1; transform: scale(1); }

/* Lightbox */
.lightbox {
  position:        fixed;
  inset:           0;
  z-index:         9999;
  background:      rgba(10, 8, 7, .95);
  display:         flex;
  align-items:     center;
  justify-content: center;
  opacity:         0;
  pointer-events:  none;
  transition:      opacity .3s ease;
}
.lightbox.is-open {
  opacity:        1;
  pointer-events: auto;
}
.lightbox__img {
  max-width:     90vw;
  max-height:    85vh;
  object-fit:    contain;
  border-radius: var(--r-lg);
  box-shadow:    0 30px 80px rgba(0,0,0,.6);
}
.lightbox__btn {
  position:        absolute;
  background:      rgba(255,255,255,.12);
  border:          1px solid rgba(255,255,255,.20);
  color:           var(--txt-inv);
  border-radius:   50%;
  width:           48px; height: 48px;
  display:         flex;
  align-items:     center;
  justify-content: center;
  font-size:       1.3rem;
  cursor:          pointer;
  transition:      background var(--tr);
}
.lightbox__btn:hover { background: rgba(255,255,255,.25); }
.lightbox__close { top: 1.5rem;       right: 1.5rem; }
.lightbox__prev  { left: 1.5rem;      top: 50%; transform: translateY(-50%); }
.lightbox__next  { right: 1.5rem;     top: 50%; transform: translateY(-50%); }
.lightbox__caption {
  position:       absolute;
  bottom:         1.5rem; left: 50%;
  transform:      translateX(-50%);
  font-family:    var(--f-h);
  font-size:      .8rem;
  color:          rgba(255,255,255,.65);
  letter-spacing: .08em;
}

@media (max-width: 575px) { .galeria-grid { columns: 1; } }
@media (max-width: 767px) { .galeria-grid { columns: 2 150px; } }


/* ────────────────────────────────────────────────────────────────
   18. EQUIPA — Cards de membros
   ──────────────────────────────────────────────────────────────── */
.equipa-avatar {
  width:         120px;
  height:        120px;
  border-radius: 50%;
  overflow:      hidden;
  border:        3px solid var(--salvia);
  margin:        0 auto 1.25rem;
}
.equipa-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: top; }


/* ────────────────────────────────────────────────────────────────
   19. REDES SOCIAIS
   ──────────────────────────────────────────────────────────────── */
.btn-ig {
  border:          1.5px solid #C13584;
  color:           #C13584;
  background:      transparent;
  font-family:     var(--f-h);
  font-size:       .85rem;
  font-weight:     500;
  letter-spacing:  .05em;
  padding:         .7rem 1.75rem;
  border-radius:   50px;
  transition:      all var(--tr);
  text-decoration: none;
  display:         inline-flex;
  align-items:     center;
  gap:             .5rem;
}
.btn-ig:hover { background: #C13584; color: var(--txt-inv); }
.btn-fb {
  border:          1.5px solid #1877F2;
  color:           #1877F2;
  background:      transparent;
  font-family:     var(--f-h);
  font-size:       .85rem;
  font-weight:     500;
  letter-spacing:  .05em;
  padding:         .7rem 1.75rem;
  border-radius:   50px;
  transition:      all var(--tr);
  text-decoration: none;
  display:         inline-flex;
  align-items:     center;
  gap:             .5rem;
}
.btn-fb:hover { background: #1877F2; color: var(--txt-inv); }


/* ────────────────────────────────────────────────────────────────
   20. FOOTER
   ──────────────────────────────────────────────────────────────── */
.footer {
  background: var(--txt-h);
  padding:    4rem 0 0;
  color:      rgba(255,255,255,.65);
  border-top: 3px solid var(--salvia-texto);
}
.footer__logo    { width: 52px; height: 52px; object-fit: contain; border-radius: 50%; margin-bottom: 1rem; }
.footer__tagline { font-family: var(--f-body); font-size: .88rem; color: rgba(255,255,255,.58); margin-bottom: .35rem; }
.footer__addr    { font-family: var(--f-body); font-size: .82rem; color: rgba(255,255,255,.52); margin: 0; }
.footer__h       { font-family: var(--f-h); font-size: .68rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.52); margin-bottom: 1rem; }
.footer__links   { list-style: none; padding: 0; margin: 0; }
.footer__links li { margin-bottom: .6rem; }
.footer__link    { color: rgba(255,255,255,.72); text-decoration: none; font-family: var(--f-body); font-size: .88rem; transition: color var(--tr); }
.footer__link:hover { color: #A5C8A0; }
.footer__horario strong {
  font-weight: 700; color: rgba(255,255,255,.82);
  display: block; font-family: var(--f-h);
  font-size: .68rem; font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; margin-top: .6rem; margin-bottom: .2rem;
}
.footer__horario strong:first-child { margin-top: 0; }
.footer__horario span { font-size: .82rem; color: rgba(255,255,255,.58); }
.footer__base {
  border-top:      1px solid rgba(255,255,255,.08);
  margin-top:      3rem;
  padding:         1.5rem 0;
  display:         flex;
  flex-wrap:       wrap;
  justify-content: space-between;
  align-items:     center;
  gap:             1rem;
}
.footer__copy       { font-family: var(--f-body); font-size: .78rem; color: rgba(255,255,255,.52); margin: 0; }
.footer__legal      { display: flex; gap: 1rem; align-items: center; }
.footer__legal-link { color: rgba(255,255,255,.62); text-decoration: none; font-family: var(--f-body); font-size: .78rem; transition: color var(--tr); }
.footer__legal-link:hover { color: #A5C8A0; }

@media (max-width: 767px) {
  .footer__base  { flex-direction: column; text-align: center; }
  .footer__legal { justify-content: center; }
}


/* ────────────────────────────────────────────────────────────────
   21. COOKIE BANNER
   ──────────────────────────────────────────────────────────────── */
.cookie-banner {
  position:    fixed;
  bottom:      0; left: 0; right: 0;
  z-index:     1060;
  background:  rgba(74, 64, 58, .97);
  border-top:  2px solid var(--salvia);
  padding:     1rem 1.5rem;
  backdrop-filter: blur(12px);
}
.cookie-banner__inner {
  max-width:       1000px;
  margin:          0 auto;
  display:         flex;
  flex-wrap:       wrap;
  align-items:     center;
  justify-content: space-between;
  gap:             1rem;
}
.cookie-banner__txt strong { color: var(--txt-inv); font-family: var(--f-h); font-size: .9rem; display: block; margin-bottom: .2rem; }
.cookie-banner__txt p      { color: rgba(255,255,255,.80); font-size: .85rem; margin: 0; }
.cookie-banner__link       { color: #A5C8A0; text-decoration: underline; }
.cookie-banner__btns       { display: flex; gap: .75rem; flex-wrap: wrap; }
.btn-ck-recusar {
  background:  transparent;
  border:      1.5px solid rgba(255,255,255,.45);
  color:       rgba(255,255,255,.88);
  font-family: var(--f-h);
  font-size:   .78rem;
  font-weight: 500;
  padding:     .4rem 1rem;
  border-radius: var(--r);
  cursor:      pointer;
  transition:  all var(--tr);
}
.btn-ck-recusar:hover { background: rgba(255,255,255,.12); color: var(--txt-inv); }

@media (max-width: 575px) { .cookie-banner__inner { flex-direction: column; align-items: flex-start; } }


/* ────────────────────────────────────────────────────────────────
   22. WHATSAPP FLUTUANTE
   ──────────────────────────────────────────────────────────────── */
.btn-whatsapp {
  position:        fixed;
  bottom:          1.75rem; right: 1.75rem;
  z-index:         1050;
  width:           56px; height: 56px;
  border-radius:   50%;
  background:      var(--wa);
  color:           var(--txt-inv);
  display:         flex;
  align-items:     center;
  justify-content: center;
  font-size:       1.55rem;
  box-shadow:      0 4px 20px rgba(37, 211, 102, .45);
  text-decoration: none;
  border:          none;
  transition:      transform var(--tr), box-shadow var(--tr);
}
.btn-whatsapp:hover {
  transform:  scale(1.1) translateY(-2px);
  box-shadow: 0 8px 28px rgba(37, 211, 102, .55);
  color:      var(--txt-inv);
}


/* ────────────────────────────────────────────────────────────────
   23. PÁGINAS LEGAIS
   ──────────────────────────────────────────────────────────────── */
.legal-content { max-width: 760px; margin: 0 auto; }
.legal-content h2 {
  font-size:      1.25rem;
  color:          var(--txt-h);
  margin-top:     2.5rem;
  margin-bottom:  .75rem;
  padding-bottom: .5rem;
  border-bottom:  1px solid var(--bege);
}
.legal-content h3   { font-size: 1.05rem; color: var(--txt-h); margin-top: 1.5rem; margin-bottom: .5rem; }
.legal-content p    { font-size: .95rem; color: var(--txt-corpo); line-height: 1.85; margin-bottom: 1rem; }
.legal-content ul,
.legal-content ol   { font-size: .95rem; color: var(--txt-corpo); line-height: 1.85; padding-left: 1.5rem; margin-bottom: 1rem; }
.legal-content li   { margin-bottom: .4rem; }
.legal-content a    { color: var(--salvia-texto); text-decoration: underline; }
.legal-content a:hover { color: var(--taupe-esc); }
.legal-update-date  {
  font-family:    var(--f-h);
  font-size:      .75rem;
  font-weight:    500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color:          var(--txt-muted);
  background:     var(--creme);
  padding:        .4rem .85rem;
  border-radius:  50px;
  border:         1px solid var(--bege);
  display:        inline-block;
  margin-bottom:  2rem;
}


/* ════════════════════════════════════════════════════════════════════
   BLOG — Estilos adicionados em v6.1
   Cobertura: listagem de artigos, card de post, página de artigo,
   sidebar, tags, author box, related posts, newsletter CTA.
════════════════════════════════════════════════════════════════════ */

/* ────────────────────────────────────────────────────────────────
   BLOG — Card de artigo (listagem)
   ──────────────────────────────────────────────────────────────── */
.post-card {
  background:    var(--branco);
  border:        1.5px solid var(--bege);
  border-radius: var(--r-xl);
  overflow:      hidden;
  height:        100%;
  box-shadow:    var(--sh-sm);
  transition:    transform var(--tr), box-shadow var(--tr), border-color var(--tr);
  display:       flex;
  flex-direction: column;
}
.post-card:hover {
  transform:    translateY(-6px);
  box-shadow:   var(--sh-md);
  border-color: rgba(143, 168, 130, .40);
}

/* Imagem de capa */
.post-card__img-wrap {
  overflow:  hidden;
  height:    220px;
  flex-shrink: 0;
  position:  relative;
}
.post-card__img {
  width:      100%;
  height:     100%;
  object-fit: cover;
  display:    block;
  transition: transform .55s ease;
}
.post-card:hover .post-card__img { transform: scale(1.05); }

/* Categoria badge sobre a imagem */
.post-card__cat {
  position:       absolute;
  top:            1rem;
  left:           1rem;
  font-family:    var(--f-h);
  font-size:      .62rem;
  font-weight:    700;
  letter-spacing: .12em;
  text-transform: uppercase;
  background:     var(--salvia);
  color:          var(--salvia-btn);
  padding:        .22rem .75rem;
  border-radius:  50px;
}

/* Corpo do card */
.post-card__body {
  padding:        1.75rem;
  display:        flex;
  flex-direction: column;
  flex:           1;
}

/* Meta — data + tempo de leitura */
.post-meta {
  display:     flex;
  align-items: center;
  gap:         1rem;
  margin-bottom: .75rem;
  flex-wrap:   wrap;
}
.post-meta__item {
  display:        flex;
  align-items:    center;
  gap:            .35rem;
  font-family:    var(--f-h);
  font-size:      .68rem;
  font-weight:    500;
  letter-spacing: .06em;
  color:          var(--txt-muted);
}
.post-meta__item i { color: var(--salvia-texto); font-size: .8rem; }

/* Título do post */
.post-card__title {
  font-size:      1.2rem;
  font-weight:    700;
  color:          var(--txt-h);
  margin-bottom:  .65rem;
  line-height:    1.35;
  text-decoration: none;
  display:        block;
  transition:     color var(--tr);
}
.post-card__title:hover { color: var(--salvia-texto); }

/* Excerpt */
.post-card__excerpt {
  font-size:   .95rem;
  line-height: 1.8;
  color:       var(--txt-muted);
  margin-bottom: 1.25rem;
  flex:        1;
}

/* CTA do card */
.post-card__cta {
  font-family:     var(--f-h);
  font-size:       .78rem;
  font-weight:     600;
  letter-spacing:  .08em;
  text-transform:  uppercase;
  color:           var(--salvia-texto);
  text-decoration: none;
  border-bottom:   1.5px solid rgba(78, 105, 67, .35);
  padding-bottom:  2px;
  display:         inline-flex;
  align-items:     center;
  gap:             .4rem;
  transition:      border-color var(--tr), gap var(--tr);
  align-self:      flex-start;
  margin-top:      auto;
}
.post-card__cta:hover { border-color: var(--salvia-texto); gap: .7rem; }

/* Card destaque (primeiro artigo, maior) */
.post-card--featured {
  flex-direction: row;
}
.post-card--featured .post-card__img-wrap {
  width:  45%;
  height: auto;
  min-height: 320px;
  flex-shrink: 0;
}
.post-card--featured .post-card__body { padding: 2.5rem; }
.post-card--featured .post-card__title { font-size: 1.5rem; }

@media (max-width: 767px) {
  .post-card--featured { flex-direction: column; }
  .post-card--featured .post-card__img-wrap { width: 100%; height: 220px; min-height: unset; }
  .post-card--featured .post-card__body { padding: 1.75rem; }
}


/* ────────────────────────────────────────────────────────────────
   BLOG — Filtros de categoria
   ──────────────────────────────────────────────────────────────── */
.blog-filters {
  display:         flex;
  flex-wrap:       wrap;
  gap:             .5rem;
  margin-bottom:   2.5rem;
}
.blog-filter {
  font-family:     var(--f-h);
  font-size:       .72rem;
  font-weight:     600;
  letter-spacing:  .08em;
  text-transform:  uppercase;
  padding:         .45rem 1.1rem;
  border-radius:   50px;
  border:          1.5px solid var(--bege);
  background:      transparent;
  color:           var(--txt-muted);
  cursor:          pointer;
  text-decoration: none;
  transition:      all var(--tr);
}
.blog-filter:hover,
.blog-filter.active {
  background:   var(--salvia);
  border-color: var(--salvia);
  color:        var(--salvia-btn);
}


/* ────────────────────────────────────────────────────────────────
   ARTIGO — Página individual
   ──────────────────────────────────────────────────────────────── */

/* Hero do artigo */
.article-hero {
  background:    var(--creme);
  padding:       calc(var(--nav-h) + 3.5rem) 0 3rem;
  border-bottom: 1px solid var(--bege);
  position:      relative;
  overflow:      hidden;
}
.article-hero::before {
  content:  '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 70% 60% at 80% 50%, rgba(143,168,130,.08) 0%, transparent 70%);
  pointer-events: none;
}
.article-hero__inner { position: relative; z-index: 1; }
.article-hero__cat {
  font-family:    var(--f-h);
  font-size:      .68rem;
  font-weight:    700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color:          var(--salvia-texto);
  margin-bottom:  1rem;
  display:        flex;
  align-items:    center;
  gap:            .4rem;
}
.article-hero__title {
  font-size:     clamp(1.8rem, 4vw, 3rem);
  font-weight:   700;
  color:         var(--txt-h);
  line-height:   1.2;
  margin-bottom: 1.25rem;
  max-width:     760px;
}
.article-hero__lead {
  font-size:   1.1rem;
  color:       var(--txt-muted);
  line-height: 1.85;
  max-width:   640px;
  margin-bottom: 1.75rem;
}

/* Imagem de capa do artigo */
.article-cover {
  width:         100%;
  max-height:    480px;
  object-fit:    cover;
  border-radius: var(--r-xl);
  box-shadow:    var(--sh-lg);
  display:       block;
  margin-bottom: 3rem;
}

/* Corpo do artigo */
.article-body {
  font-family:   var(--f-body);
  font-size:     1.05rem;
  line-height:   1.9;
  color:         var(--txt-corpo);
  max-width:     720px;
}
.article-body h2 {
  font-size:      1.5rem;
  color:          var(--txt-h);
  margin:         2.5rem 0 .9rem;
  padding-bottom: .5rem;
  border-bottom:  2px solid var(--bege);
}
.article-body h3 {
  font-size:    1.2rem;
  color:        var(--txt-h);
  margin:       2rem 0 .7rem;
}
.article-body p    { margin-bottom: 1.25rem; }
.article-body ul,
.article-body ol   { padding-left: 1.5rem; margin-bottom: 1.25rem; }
.article-body li   { margin-bottom: .5rem; line-height: 1.8; }
.article-body strong { font-weight: 700; color: var(--txt-h); }
.article-body em     { font-style: italic; color: var(--txt-muted); }
.article-body a      { color: var(--salvia-texto); text-decoration: underline; transition: color var(--tr); }
.article-body a:hover { color: var(--taupe-esc); }

/* Destaque / blockquote */
.article-body blockquote {
  border-left:     4px solid var(--salvia);
  background:      var(--salvia-light);
  border-radius:   0 var(--r-lg) var(--r-lg) 0;
  padding:         1.25rem 1.75rem;
  margin:          2rem 0;
  font-style:      italic;
  font-size:       1.1rem;
  color:           var(--salvia-texto);
  line-height:     1.85;
}
.article-body blockquote cite {
  display:     block;
  font-style:  normal;
  font-family: var(--f-h);
  font-size:   .75rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color:       var(--txt-muted);
  margin-top:  .75rem;
}

/* Caixa de dica / tip */
.tip-box {
  background:    var(--salvia-light);
  border:        1px solid rgba(143, 168, 130, .35);
  border-radius: var(--r-lg);
  padding:       1.25rem 1.5rem;
  margin:        2rem 0;
  display:       flex;
  gap:           1rem;
  align-items:   flex-start;
}
.tip-box__icon { font-size: 1.3rem; color: var(--salvia-texto); flex-shrink: 0; margin-top: .1rem; }
.tip-box__txt  { font-size: .95rem; color: var(--txt-corpo); line-height: 1.8; margin: 0; }
.tip-box__txt strong { color: var(--salvia-texto); }


/* ────────────────────────────────────────────────────────────────
   SIDEBAR
   ──────────────────────────────────────────────────────────────── */
.sidebar-widget {
  background:    var(--creme);
  border:        1px solid var(--bege);
  border-radius: var(--r-xl);
  padding:       1.75rem;
  margin-bottom: 1.75rem;
}
.sidebar-widget__title {
  font-family:    var(--f-h);
  font-size:      .72rem;
  font-weight:    700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color:          var(--salvia-texto);
  margin-bottom:  1.25rem;
  padding-bottom: .6rem;
  border-bottom:  2px solid var(--salvia);
  display:        block;
}

/* Post recente na sidebar */
.sidebar-post {
  display:       flex;
  gap:           .85rem;
  align-items:   flex-start;
  padding:       .75rem 0;
  border-bottom: 1px solid var(--bege);
  text-decoration: none;
  transition:    opacity var(--tr);
}
.sidebar-post:last-child { border-bottom: none; }
.sidebar-post:hover      { opacity: .8; }
.sidebar-post__img {
  width:         64px;
  height:        64px;
  object-fit:    cover;
  border-radius: var(--r);
  flex-shrink:   0;
}
.sidebar-post__title {
  font-family:  var(--f-h);
  font-size:    .85rem;
  font-weight:  600;
  color:        var(--txt-h);
  line-height:  1.4;
  margin-bottom: .3rem;
  display:      block;
}
.sidebar-post__date {
  font-family:    var(--f-h);
  font-size:      .65rem;
  font-weight:    500;
  letter-spacing: .06em;
  color:          var(--txt-muted);
}

/* Tags */
.tag-cloud { display: flex; flex-wrap: wrap; gap: .5rem; }
.tag {
  font-family:     var(--f-h);
  font-size:       .68rem;
  font-weight:     600;
  letter-spacing:  .06em;
  text-transform:  uppercase;
  color:           var(--salvia-texto);
  background:      var(--salvia-light);
  border:          1px solid rgba(143, 168, 130, .30);
  border-radius:   50px;
  padding:         .25rem .75rem;
  text-decoration: none;
  transition:      all var(--tr);
}
.tag:hover {
  background: var(--salvia);
  color:      var(--salvia-btn);
  border-color: var(--salvia);
}

/* Newsletter CTA na sidebar */
.sidebar-newsletter {
  background:    var(--salvia-texto);
  border-radius: var(--r-xl);
  padding:       1.75rem;
  text-align:    center;
  margin-bottom: 1.75rem;
}
.sidebar-newsletter__icon { font-size: 2rem; color: rgba(255,255,255,.7); margin-bottom: .75rem; display: block; }
.sidebar-newsletter__title { font-size: 1.1rem; color: #fff; margin-bottom: .5rem; }
.sidebar-newsletter__txt   { font-size: .85rem; color: rgba(255,255,255,.78); line-height: 1.7; margin-bottom: 1.25rem; }
.sidebar-newsletter .form-control {
  background:    rgba(255,255,255,.12) !important;
  border-color:  rgba(255,255,255,.25) !important;
  color:         #fff !important;
  margin-bottom: .65rem;
}
.sidebar-newsletter .form-control::placeholder { color: rgba(255,255,255,.5) !important; }
.sidebar-newsletter .form-control:focus {
  background:   rgba(255,255,255,.2) !important;
  border-color: rgba(255,255,255,.5) !important;
  box-shadow:   none !important;
}


/* ────────────────────────────────────────────────────────────────
   AUTHOR BOX
   ──────────────────────────────────────────────────────────────── */
.author-box {
  background:    var(--creme);
  border:        1px solid var(--bege);
  border-radius: var(--r-xl);
  padding:       2rem;
  display:       flex;
  gap:           1.5rem;
  align-items:   flex-start;
  margin-top:    3rem;
}
.author-box__avatar {
  width:         80px;
  height:        80px;
  border-radius: 50%;
  object-fit:    cover;
  flex-shrink:   0;
  border:        3px solid var(--salvia);
}
.author-box__name {
  font-size:     1.05rem;
  margin-bottom: .2rem;
  color:         var(--txt-h);
}
.author-box__role {
  font-family:    var(--f-h);
  font-size:      .7rem;
  font-weight:    600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color:          var(--salvia-texto);
  display:        block;
  margin-bottom:  .65rem;
}
.author-box__bio { font-size: .92rem; color: var(--txt-muted); line-height: 1.75; margin: 0; }

@media (max-width: 575px) {
  .author-box { flex-direction: column; align-items: center; text-align: center; }
}


/* ────────────────────────────────────────────────────────────────
   ARTIGOS RELACIONADOS
   ──────────────────────────────────────────────────────────────── */
.related-posts { margin-top: 4rem; }
.related-posts__title {
  font-family:    var(--f-h);
  font-size:      .72rem;
  font-weight:    700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color:          var(--salvia-texto);
  margin-bottom:  1.5rem;
  padding-bottom: .6rem;
  border-bottom:  2px solid var(--salvia);
  display:        block;
}


/* ────────────────────────────────────────────────────────────────
   PAGINAÇÃO DO BLOG
   ──────────────────────────────────────────────────────────────── */
.blog-pagination {
  display:         flex;
  justify-content: center;
  align-items:     center;
  gap:             .5rem;
  margin-top:      3rem;
}
.blog-page-btn {
  font-family:     var(--f-h);
  font-size:       .8rem;
  font-weight:     600;
  width:           40px;
  height:          40px;
  border-radius:   var(--r);
  border:          1.5px solid var(--bege);
  background:      var(--branco);
  color:           var(--txt-muted);
  display:         flex;
  align-items:     center;
  justify-content: center;
  text-decoration: none;
  transition:      all var(--tr);
}
.blog-page-btn:hover,
.blog-page-btn.active {
  background:   var(--salvia);
  border-color: var(--salvia);
  color:        var(--salvia-btn);
}
