/* ══ acido-hialuronico.css — Paleta Verde profundo · Ácido Hialurónico ══ */
:root {
  --bg:         #15543a;
  --bg-dark:    #0d3626;
  --bg-mid:     #1c6a49;
  --bg-deep:    #061a12;
  --gold:       #ffd06e;
  --gold-dim:   rgba(255,208,110,0.35);
  --accent:     #a8e6c4;
  --text:       #eefaf3;
  --text-sec:   #a8e6c4;
  --text-dim:   rgba(238,250,243,0.45);
  --border:     rgba(255,208,110,0.18);
  --border-l:   rgba(238,250,243,0.1);
  --hero-glow:  rgba(28,106,73,0.70);
  --cta-stripe: rgba(13,54,38,0.06);
  --cta-border: rgba(13,54,38,0.35);
}
.section-que-es::before { content:'HIALURÓNICO'; }
.protocolo-step:hover { background:rgba(28,106,73,0.35); }

/* El título «hialurónico» es largo: se reduce para no desbordar la columna */
.hero-title { font-size:60px; }
@media (max-width:1100px) { .hero-title { font-size:46px; } }

/* ══ Panel derecho del hero — cita en lugar de vídeo ══ */
.hero-quote-wrap { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; padding:0 56px; text-align:center; max-width:540px; }
.hero-quote-mark { font-family:var(--font-display); font-size:72px; line-height:0.6; color:var(--gold); opacity:0.5; }
.hero-quote-text { font-family:var(--font-display); font-size:var(--text-xl); font-style:italic; font-weight:300; line-height:1.5; color:var(--text); }
.hero-quote-author { display:flex; flex-direction:column; gap:2px; margin-top:4px; }
.hero-quote-name { font-size:var(--text-sm); letter-spacing:var(--ls-label); text-transform:uppercase; color:var(--gold); }
.hero-quote-role { font-size:var(--text-micro); letter-spacing:var(--ls-label); text-transform:uppercase; color:var(--text-dim); }

/* ══ Aviso de precios — remite a la página de tratamientos ══ */
.ah-precios-aviso { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px; margin-top:48px; padding:22px 28px; background:var(--bg-mid); border:0.5px solid var(--border); }
.ah-precios-aviso p { font-size:var(--text-sm); line-height:var(--lh-body); color:var(--text-sec); margin:0; }
.ah-precios-aviso a { font-size:var(--text-xs); letter-spacing:var(--ls-label); text-transform:uppercase; color:var(--gold); text-decoration:none; border:0.5px solid var(--border); padding:9px 20px; transition:background .2s, color .2s; }
.ah-precios-aviso a:hover { background:var(--gold); color:var(--bg-dark); }