/* ============================================================
   SmartBeat — overrides sobre el template "Greta"
   Respeta la paleta: 071313 · 00C1C1 · 66B0B0 · 99B0B0 · DFE0E2
   Solo reskin de color/acentos; no toca el CSS del template.
   ============================================================ */
/* Anclas del menú no quedan bajo la barra fija */
html{ scroll-padding-top:96px; }

:root{
  --sb-ink:#071313;      /* teal casi negro (fondo/overlay) */
  --sb-cyan:#00C1C1;     /* acento de marca */
  --sb-teal1:#66B0B0;
  --sb-teal2:#99B0B0;
  --sb-mist:#DFE0E2;     /* texto/etiquetas claras */
}

/* Video de fondo: tinte teal-oscuro de marca en lugar del negro puro */
.background_overlay{
  background-image:linear-gradient(rgba(7,19,19,.60), rgba(7,19,19,.74)) !important;
}

/* ---------- Tipografía ---------- */
/* Títulos: fuente del template (Inter). Acento: Fraunces italic cyan (moderno, editorial). */
.text-secondary{
  color:var(--sb-cyan) !important;
  font-family:'Fraunces','Playfair Display',serif !important;
  font-style:italic !important;
  font-weight:500;
}

/* Quitar la sangría de primera línea (text-indent:5vw del template) en los <p> */
p{ text-indent:0 !important; }

/* CTA principal (nav + intro) en cyan; el resto de botones quedan blancos */
.navbar_button-wrapper .button{
  background-color:var(--sb-cyan) !important;
  color:var(--sb-ink) !important;
}
.button:hover{
  background-color:var(--sb-cyan) !important;
  color:var(--sb-ink) !important;
}

/* Marquee como etiquetas mono (MIHA, sede, redes) mientras llegan los íconos reales */
.sb-logo-text{
  font-family:Inconsolata,monospace;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:1.05rem;
  color:var(--sb-mist);
  white-space:nowrap;
  opacity:.92;
}
.sb-logo-text .accent{ color:var(--sb-cyan); }

/* Wordmark de la nav */
.navbar_logo-text{ letter-spacing:-.01em; }

/* Logo real (blanco) en la nav */
.navbar_logo-img{ height:26px; width:auto; display:block; }

/* Video de fondo plano cubriendo el wrap fijo */
.sb-bgvideo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }

/* Wordmark del hero: "Smart / Beat" en dos líneas, como el mockup del cliente */
.hero_heading{ font-size:clamp(3rem, 10vw, 7rem) !important; line-height:.9 !important; letter-spacing:-.02em !important; }

/* Ocultar el badge "Made in Webflow" (export self-host) */
.w-webflow-badge{ display:none !important; }

/* ---------- Secciones nuevas (precios, horarios, FAQ) en estilo del template ---------- */
.sb-table{ border-top:1px solid rgba(223,224,226,.25); margin:.5rem 0 1rem; }
.sb-row{
  display:grid; grid-template-columns:1fr auto; gap:.2rem 1.5rem; align-items:baseline;
  padding:1rem 0; border-bottom:1px solid rgba(223,224,226,.18);
}
.sb-row span{ color:var(--sb-mist); font-size:1.05rem; }
.sb-row b{ font-family:Inconsolata,monospace; color:var(--sb-cyan); font-size:1.35rem; white-space:nowrap; text-align:right; }
.sb-row b i{ font-style:normal; color:var(--sb-teal2); font-size:.9rem; }
.sb-row em{ grid-column:1 / -1; color:var(--sb-teal2); font-style:normal; font-size:.85rem; opacity:.85; }
.sb-fine{ color:var(--sb-teal2); font-size:.82rem; opacity:.8; }

/* Estrellas de testimonio (no botón) */
.sb-stars{
  background:transparent !important; color:var(--sb-cyan) !important;
  border:1px solid rgba(0,193,196,.45) !important; letter-spacing:.25em;
  pointer-events:none; display:inline-block;
}

/* ---------- Testimonios: cita más grande (antes 16px, se veía chica) ---------- */
.work_item .content p{
  font-size:clamp(1.25rem, 1.9vw, 1.6rem) !important;
  line-height:1.55 !important;
  color:var(--sb-mist);
}

/* Botón "Cómo llegar" en el Estudio */
.sb-comollegar{ margin-top:1.5rem; }

/* FAQ con <details> nativo */
.sb-faq{ border-bottom:1px solid rgba(223,224,226,.18); padding:1rem 0; }
.sb-faq summary{
  cursor:pointer; list-style:none; color:var(--sb-mist); font-size:1.1rem;
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
}
.sb-faq summary::-webkit-details-marker{ display:none; }
.sb-faq summary::after{ content:"+"; color:var(--sb-cyan); font-size:1.4rem; line-height:1; }
.sb-faq[open] summary::after{ content:"–"; }
.sb-faq p{ color:var(--sb-teal2); margin:.7rem 0 0; }
