/* Contenedor */
.hero-gsap { position: relative; }

/* Quita el espacio por baseline del <img> */
.hero-gsap .frame { line-height: 0; font-size: 0; }
.hero-gsap .hero-img { display: block; width: 100%; height: auto; }

/* Asegura que la viñeta no sume alto */
.hero-gsap .hero-vignette {
  position: absolute; inset: 0;
  pointer-events: none;
}

/* (Opcional) si en móvil no quieres la viñeta, la ocultas */
@media (max-width: 768px) {
  .hero-gsap .hero-vignette { display: none; }
}
/* Contenedor a pantalla completa (safe viewport en iOS/Android) */
  .hero-full{
    position:relative;
    min-height:100svh;
    width:100%;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#0B0F17; /* fallback */
    isolation:isolate;
  }

  /* La imagen cubre siempre; ajustamos foco según breakpoint */
  .hero-img{
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover;
    object-position:center;
    transform-origin:center center;
    will-change: transform, opacity;
  }

  /* Overlay para legibilidad (ligeramente más fuerte en móvil) */
  .hero-overlay{
    position:absolute; inset:0; z-index:1; pointer-events:none;
    background: radial-gradient(900px 500px at 70% 10%, rgba(255,255,255,.05), transparent 60%),
                linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
    transition:opacity .3s ease;
  }
  @media (max-width: 640px){
    .hero-overlay{ background: linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.65)); }
  }

  /* Contenido (opcional) */
  .hero-content{
    position:relative; z-index:2; text-align:center; color:#E9EEFC;
    padding:clamp(16px,4vw,32px);
    max-width:min(92vw, 980px);
  }
  .hero-title{
    margin:0 0 .6rem 0;
    font-weight:900;
    font-size:clamp(1.6rem, 2.8vw, 3.2rem);
    line-height:1.15;
    letter-spacing:.2px;
  }
  .hero-sub{
    margin:0 0 1.1rem 0;
    color:#C0CAE9;
    font-size:clamp(.95rem, 1.5vw, 1.1rem);
  }
  .btn-hero{
    display:inline-block; margin-top:.4rem;
    padding:clamp(12px,1.2vw,14px) clamp(18px,2vw,22px);
    border-radius:12px; border:0; cursor:pointer; text-decoration:none;
    font-weight:900; font-size:clamp(1rem,1.6vw,1.1rem);
    background:linear-gradient(135deg,#D7BF78,#F1D27A); color:#1a1600;
    box-shadow:0 12px 30px rgba(241,210,122,.18), 0 2px 0 rgba(0,0,0,.25) inset;
    transition:transform .18s ease;
  }
  .btn-hero:hover{ transform:scale(1.03); }
  .btn-hero:focus-visible{ outline:3px solid #F1D27A; outline-offset:4px; }

  @media (max-width: 1024px){
    .hero-img{ object-position:center right; }
  }
  @media (max-width: 640px){
    .hero-img{ object-position:center; }
  }

  @media (prefers-reduced-motion: reduce){
    .hero-img{ transform:none !important; }
  }
    :root{
    --bg1:#0B0F17; --bg2:#0A0D15;
    --ink:#E9EEFC; --muted:#C0CAE9;
    --gold:#D7BF78; --gold-2:#F1D27A;
    --glassA:rgba(20,30,55,.44); --glassB:rgba(10,15,28,.36);
    --max:1200px; --radius:22px;
    --shadow:0 14px 40px rgba(0,0,0,.40);
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  html,body{height:100%}
  body{
    margin:0; color:var(--ink);
    font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    line-height:1.55;
    background:
      radial-gradient(1200px 600px at 70% 10%, rgba(255,255,255,.025), transparent 60%),
      linear-gradient(180deg, var(--bg1), var(--bg2));
  }
  a{color:inherit; text-decoration:none}
  a:focus-visible{ outline:2px dashed var(--gold-2); outline-offset:4px }

  /* ===== NAVBAR ===== */
  .nav{
    position:fixed; inset:0 0 auto 0; height:64px; z-index:1000;
    display:flex; align-items:center; justify-content:space-between;
    padding:0 min(5vw,24px);
    -webkit-backdrop-filter: blur(14px) saturate(120%);
            backdrop-filter: blur(14px) saturate(120%);
    background:linear-gradient(180deg, rgba(20,30,55,.55), rgba(10,15,28,.42));
    border-bottom:1px solid rgba(255,255,255,.08);
    transition: box-shadow .25s ease, background .25s ease;
  }
  .nav.scrolled{ box-shadow:0 10px 26px rgba(0,0,0,.35) }
  .brandmark{display:flex; align-items:center; gap:12px}
  .logo{
    width:34px; height:34px; border-radius:10px;
    background:linear-gradient(135deg, var(--gold), var(--gold-2));
    box-shadow:0 6px 14px rgba(241,210,122,.28);
  }
  .brandmark strong{letter-spacing:.2px; white-space:nowrap}

  .navlinks{display:flex; gap:6px; align-items:center; flex-wrap:wrap}
  .nav a{
    color:var(--ink); text-decoration:none; font-weight:600; opacity:.95;
    padding:10px 12px; border-radius:10px; display:inline-block;
  }
  .nav a:hover{ background:rgba(255,255,255,.06) }
  .cta-mini{
    background:linear-gradient(135deg,var(--gold),var(--gold-2));
    color:#1a1600!important; border-radius:12px; padding:10px 14px; font-weight:800;
    box-shadow:0 10px 24px rgba(241,210,122,.22);
  }
  /* Toggle móvil */
  .nav-toggle{
    display:none; background:none; border:0; font-size:1.8rem; color:var(--ink); cursor:pointer;
  }
  @media (max-width:900px){
    .brandmark strong{display:none}
  }
  @media (max-width:780px){
    .navlinks{ display:none; position:absolute; top:64px; right:0; left:0; padding:12px 16px; gap:8px; flex-direction:column; background:rgba(10,15,28,.88); border-bottom:1px solid rgba(255,255,255,.08) }
    .navlinks.open{ display:flex }
    .nav-toggle{ display:block }
  }
  .spacer-nav{height:64px}

  /* ===== CANVAS BG ===== */
  canvas.bg-layer{
    position:fixed; inset:0; z-index:-1; pointer-events:none;
    filter: drop-shadow(0 0 5px rgba(215,191,120,.7));
  }

  .wrap{width:min(100%, var(--max)); margin-inline:auto; padding: clamp(18px, 4vw, 28px);}
  .grid{display:grid; gap:clamp(16px,2.6vw,28px)}

  /* ===== HEADER ===== */
  header.hero{ padding-block: clamp(28px, 6vw, 56px); }
  .hero-stage{
    position:relative;
    min-height: clamp(560px, 66vw, 740px);
    display:grid; grid-template-columns: 1.05fr 1.2fr;
    gap: clamp(26px, 4.5vw, 50px); align-items:center;
  }
  @media (max-width:1024px){ .hero-stage{ grid-template-columns:1fr } }

  .ribbon{
    background:linear-gradient(135deg, #CDA43C, #F1D27A 45%, #CDA43C);
    color:#1d1603; border-radius:30px;
    padding: clamp(18px, 3.2vw, 28px) clamp(22px, 3.6vw, 34px);
    box-shadow:0 18px 50px rgba(241,210,122,.30);
    max-width: 680px;
  }
  .ribbon h1{ margin:0 0 12px 0; font-size:clamp(28px, 3.6vw, 46px); line-height:1.12; letter-spacing:.5px; font-weight:900 }
  .ribbon p{ margin:0; font-weight:600 }
  .hero-cta{ margin-top: clamp(14px, 2.2vw, 18px) }
  .btn{
    appearance:none; border:0; cursor:pointer; font-weight:900;
    padding:14px 22px; border-radius:12px; font-size:1.05rem;
    background:linear-gradient(135deg,var(--gold),var(--gold-2));
    color:#1a1600; box-shadow:0 12px 30px rgba(241,210,122,.18), 0 2px 0 rgba(0,0,0,.25) inset;
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .btn:hover{ transform:translateY(-2px); box-shadow:0 16px 34px rgba(241,210,122,.26)}
  .btn:active{ transform:translateY(0)}
  .btn:focus-visible{ outline:3px solid #f1d27a; outline-offset:4px }

  /* ===== ISLA ===== */
  .island{
    position:relative; border-radius:24px; overflow:hidden;
    -webkit-backdrop-filter: blur(16px) saturate(120%); backdrop-filter: blur(16px) saturate(120%);
    background:linear-gradient(180deg, var(--glassA), var(--glassB));
    border:1px solid rgba(255,255,255,.08); box-shadow: var(--shadow);
    min-height: clamp(500px, 56vw, 660px);
  }
  .island::before{
    content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
    background:linear-gradient(135deg, rgba(241,210,122,.55), rgba(215,191,120,.15) 35%, rgba(255,255,255,.06) 60%, rgba(241,210,122,.35));
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude; -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; pointer-events:none;
  }
  .island-inner{ position:absolute; inset: clamp(24px, 3vw, 36px); }

  .device{position:absolute; display:block; filter: drop-shadow(0 18px 26px rgba(0,0,0,.45));}
  .book{
    width: clamp(260px, 30vw, 360px);
    left:50%; top:56%; transform:translate(-50%,-50%); z-index:3;
  }
  .laptop{
    width: clamp(220px, 23vw, 300px);
    right: max(4%, 28px); top:max(5%, 28px); z-index:2;
  }
  .tablet{
    width: clamp(200px, 22vw, 270px);
    left:max(4%, 28px); bottom:max(6%, 32px); z-index:2;
  }
  .phone{
    width: clamp(92px, 11.5vw, 140px);
    right:max(7%, 42px); bottom:max(8%, 36px); z-index:4;
  }
  .frame{ background:#0f1524; border-radius:18px; padding:10px; border:1px solid rgba(255,255,255,.06) }
  .frame img{ display:block; width:100%; height:auto; border-radius:12px }

  @media (max-width:1200px){
    .book  { top:57% }
    .laptop{ transform:translate(6%, 0) }
    .tablet{ transform:translate(-4%, 0) }
    .phone { transform:translate(4%, 0) }
  }
  @media (max-width:900px){
    .book  { width: clamp(230px, 36vw, 320px); top:58% }
    .laptop{ width: clamp(190px, 26vw, 260px) }
    .tablet{ width: clamp(170px, 24vw, 240px) }
    .phone { width: clamp(90px, 14vw, 120px) }
  }
  @media (max-width:640px){
    .island-inner{ inset: clamp(16px, 4vw, 24px) }
    .book  { width: clamp(200px, 58vw, 290px); top:59% }
    .laptop{ top:6%; right:6% }
    .tablet{ left:6%; bottom:7% }
    .phone { right:7%; bottom:9% }
  }
/* ===== CTA Liquid Glass ===== */
.cta-wrap{
  display:flex; justify-content:center;
}
.cta-glass{
  position:relative;
  width:min(100%, 980px);
  margin-inline:auto;
  border-radius:24px;
  padding:clamp(18px, 4vw, 28px);
  background:linear-gradient(180deg, rgba(20,30,55,.36), rgba(10,15,28,.34));
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  backdrop-filter: blur(18px) saturate(130%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow: 0 20px 60px rgba(0,0,0,.40);
  overflow:hidden;
}

/* Borde líquido iridiscente */
.cta-glass::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(
    135deg,
    rgba(241,210,122,.65),
    rgba(180,200,255,.15) 40%,
    rgba(255,255,255,.06) 60%,
    rgba(241,210,122,.45)
  );

  /* Máscara estándar (Firefox/Edge) */
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;

  /* Prefijo WebKit (Chrome/Safari) */
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;

  pointer-events: none;
}

/* Brillo que recorre (suave) */
.cta-glass::after{
  content:""; position:absolute; inset:-40% -20% auto -20%; height:80%;
  background:linear-gradient(110deg, transparent 0 40%, rgba(255,255,255,.12) 50%, transparent 60% 100%);
  transform:translateX(-60%); filter: blur(10px); pointer-events:none; opacity:.7;
  animation: sheen 6.5s linear infinite;
}
@keyframes sheen{
  0% { transform:translateX(-60%) }
  100%{ transform:translateX(160%) }
}

/* Imagen "pre_venta" */
.cta-brand{
  display:block; margin-inline:auto;
  width:min(42%, 420px); height:auto;
}
@media (max-width:900px){ .cta-brand{ width:min(58%, 420px) } }
@media (max-width:640px){ .cta-brand{ width:min(70%, 420px) } }

/* Lista con iconos dorados */
.cta-benefits{
  display:grid; grid-template-columns: 1fr; gap:12px;
  margin: 14px 0 18px;
}
.cta-benefit{
  display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:flex-start;
}
.cta-ico{
  width:34px; height:34px; border-radius:9px;
  display:inline-flex; align-items:center; justify-content:center;
  color:#D7BF78; font-size:1.2rem;
  background:rgba(215,191,120,.12); border:1px solid rgba(215,191,120,.35);
}
.cta-benefit h4{
  margin:0; font-size:1.02rem; font-weight:800; line-height:1.25;
}
.cta-benefit p{
  margin:.1rem 0 0; color:#C0CAE9; font-size:.95rem;
}

/* CTA botón (usa tu .btn existente) */
.cta-actions{ text-align:center; margin-top:8px }

  /* ===== SECCIONES ===== */
  section{ padding-block: clamp(50px, 9vw, 50px); }
  .title{ font-size: clamp(24px, 3vw, 36px); margin:0 0 10px 0; font-weight:800 }
  .subtitle{ color:var(--muted); margin:0 0 22px 0 }

  .benefits{
    display:grid; gap:22px;
    grid-template-columns: repeat( auto-fit, minmax(240px, 1fr) );
    opacity: 0.9;
  }
  .benefit{
    position:relative; overflow:hidden;
    background:linear-gradient(180deg, var(--glassA), var(--glassB));
    -webkit-backdrop-filter: blur(14px) saturate(115%); backdrop-filter: blur(14px) saturate(115%);
    border:1px solid rgba(255,255,255,.08);
    border-radius:18px; padding:20px 18px; box-shadow:var(--shadow);
    min-height:150px;
  }
  .benefit::before{
    content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
    background:linear-gradient(135deg, rgba(241,210,122,.5), rgba(255,255,255,.06) 60%, rgba(241,210,122,.35));
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude; -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; pointer-events:none;
  }
  .benef-icon{
    font-size:1.35rem; color:var(--gold);
    display:inline-flex; align-items:center; justify-content:center;
    width:40px; height:40px; border-radius:9px;
    background:rgba(215,191,120,.12); border:1px solid rgba(215,191,120,.35);
    margin-bottom:10px;
  }
  .benefit h3{margin:4px 0 6px 0; font-size:1.06rem; font-weight:700}
  .benefit p{margin:0; color:var(--muted); font-size:.97rem}

  .content-block{
    position:relative; border-radius:20px; padding:clamp(20px, 3vw, 28px);
    background:linear-gradient(180deg, var(--glassA), var(--glassB));
    -webkit-backdrop-filter: blur(14px) saturate(115%); backdrop-filter: blur(14px) saturate(115%);
    border:1px solid rgba(255,255,255,.08); box-shadow:var(--shadow); overflow:hidden;
  }
  .content-block::before{
    content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
    background:linear-gradient(135deg, rgba(241,210,122,.55), rgba(215,191,120,.15) 35%, rgba(255,255,255,.06) 60%, rgba(241,210,122,.35));
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    mask-composite: exclude; -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; pointer-events:none;
  }
  .content-block ul{ margin:0; padding-left:1.1em; columns:1; column-gap:36px }
  .content-block li{ margin:.35em 0; color:var(--ink) }
  .content-block li::marker{ color:var(--gold) }
  @media (min-width:980px){
    .content-block ul.cols-2{ columns:2 }
    .content-block ul.cols-3{ columns:3 }
  }

  footer{
    padding:30px 0; color:var(--muted); text-align:center; font-size:.92rem;
    border-top:1px solid rgba(255,255,255,.06);
  }

  /* Botón volver arriba */
  .scroll-top{
    position:fixed; bottom:22px; right:22px; z-index:1200;
    width:48px; height:48px; border-radius:999px; border:0; cursor:pointer;
    display:none; align-items:center; justify-content:center;
    background:linear-gradient(135deg,var(--gold),var(--gold-2)); color:#1a1600;
    box-shadow: var(--shadow);
  }
  .scroll-top.show{ display:flex }

  @media (prefers-reduced-motion: reduce){
    *{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
  }
  @media (max-width:1024px){
  img[src$="logo_edit.png"]{
    width:20% !important;
    height:auto;
  }
}
@media (max-width:1024px){
  img[src$="logo_edit.png"]{
    width:20% !important;
    height:auto;
  }
}
.hero-img{ display:block; width:100%; height:auto; max-width:100%; }
@media (max-width: 767px){
  .hero-full{ display:none; }
}
/* ======= Contacto ======= */
#contacto {
  padding: clamp(48px, 8vw, 96px) 0;
  position: relative;
}

.contacto-grid {
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(20px, 4vw, 40px);
  align-items: start;
}

@media (max-width: 900px) {
  .contacto-grid { grid-template-columns: 1fr; }
}

.contacto-intro .title { margin-bottom: .25rem; }
.contacto-intro .subtitle { margin-bottom: 1rem; opacity: .9; }

.contacto-datos {
  list-style: none;
  padding: 0;
  margin: 1rem 0 1.5rem;
  display: grid;
  gap: .6rem;
}
.contacto-datos i {
  margin-right: .6rem;
  font-size: 1.1rem;
  vertical-align: -2px;
  opacity: .9;
}

.contacto-cta .btn { margin-top: .5rem; }

.contacto-form-card {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  padding: clamp(16px, 3vw, 28px);
  box-shadow: 0 10px 30px rgba(0,0,0,.15);
}

.contacto-form .field { margin-bottom: 14px; }
.contacto-form label {
  display: inline-block;
  font-weight: 600;
  margin-bottom: 6px;
}
.contacto-form input[type="text"],
.contacto-form input[type="email"],
.contacto-form input[type="tel"],
.contacto-form textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.04);
  color: inherit;
  border-radius: 10px;
  padding: 12px 14px;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.contacto-form textarea { resize: vertical; }

.contacto-form input:focus,
.contacto-form textarea:focus {
  border-color: var(--brand, #4ad0ff);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #4ad0ff) 30%, transparent);
  background: rgba(255,255,255,.06);
}

.contacto-form .consent {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .6rem .8rem;
  align-items: start;
}
.contacto-form .consent input { margin-top: .2rem; }

.contacto-form .actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: .4rem;
}
.btn.btn-ghost {
  background: transparent;
  border: 1px solid rgba(255,255,255,.22);
}

.contacto-form .error {
  display: block;
  color: #ff6b6b;
  font-size: .85rem;
  min-height: 1.1em;
  margin-top: 4px;
}

.hp-input { position: absolute !important; left: -9999px !important; }

/* Toast */
.contacto-toast {
  position: fixed;
  bottom: 22px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(20,20,20,.92);
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 12px;
  padding: .8rem 1rem;
  max-width: min(90vw, 560px);
  box-shadow: 0 12px 40px rgba(0,0,0,.35);
  z-index: 80;
  backdrop-filter: blur(8px);
}

/* Modo claro (si lo usas) */
@media (prefers-color-scheme: light) {
  .contacto-form-card { background: rgba(255,255,255,.75); border-color: rgba(0,0,0,.06); }
  .contacto-form input[type="text"],
  .contacto-form input[type="email"],
  .contacto-form input[type="tel"],
  .contacto-form textarea {
    background: rgba(255,255,255,.9);
    border-color: rgba(0,0,0,.08);
  }
  .btn.btn-ghost { border-color: rgba(0,0,0,.15); }
}

/* Header nw */

:root{
  --c1:#0b0d12; --c2:#1b2430;
  --acc:#e6c465; --acc2:#b88924;
  --txt:#eef3fa; --txt-d:#b8c2cf;
  --hero-h: clamp(560px, 68vh, 820px);

  /* Marco del bloque de imágenes */
  --frame-w: clamp(360px, 44vw, 620px);
  --frame-h: clamp(260px, 52vh, 520px);
}
/* Móvil */
@media (max-width: 768px){
  :root{
    --hero-h: clamp(157px, 10vh, 820px);
  }
}
.hero-gsap{
  position:relative; isolation:isolate;
  height:var(--hero-h); overflow:hidden;
  border-radius:0 0 28px 28px; background: #0b0d12bd;
}

/* Fondo SIEMPRE debajo y sin brillos/diagonales */
.hero-bg, .hero-vignette{
  position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0;
}
.hero-bg .shine,
.hero-bg .stripes,
.hero-shine{ display:none !important; } /* quita la línea diagonal */
.hero-vignette{
  background: radial-gradient(120% 80% at 50% 20%, transparent 0%, rgba(0,0,0,.22) 70%, rgba(0,0,0,.48) 100%);
  mix-blend-mode:multiply;
}

/* Layout principal */
.hero-inner{
  position:relative; z-index:2; height:100%;
  max-width:min(1200px, 94vw); margin:0 auto; padding:clamp(16px,3vw,32px);
  display:grid; gap:clamp(18px,4vw,40px); align-items:center;
  grid-template-columns: 1fr minmax(340px, 1fr);
}

/* Texto */
.hero-copy, .hero-copy *{ color:var(--txt); }
.eyebrow{ letter-spacing:.12em; text-transform:uppercase; font-weight:600; color:var(--acc); margin:.2rem 0 .4rem; }
.hero-title{ font-size:clamp(36px,6.2vw,47px); line-height:1.05; margin:.2rem 0 .6rem; text-wrap:balance; }
.hero-sub{ color:var(--txt-d); max-width:60ch; margin:0 0 1rem; }

/* Chips / CTA (sin cambios esenciales) */
.hero-claim{ display:inline-block; margin:.2rem 0 .8rem; padding:.55rem 1rem; border-radius:999px; font-weight:800;
  background:linear-gradient(90deg,var(--acc2),var(--acc)); color:#151515;
  box-shadow:0 8px 24px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.25); }
.hero-badges{ display:flex; gap:.7rem 1rem; flex-wrap:wrap; margin:0 0 1.2rem; padding:0; list-style:none; }
.hero-badges li{ display:flex; align-items:center; gap:.5rem; background:rgba(255,221,125,.06);
  padding:.45rem .7rem; border-radius:999px; font-weight:700; font-size:.95rem; color:var(--txt-d);
  box-shadow:inset 0 0 0 1px rgba(230,196,101,.18); }
.hero-cta .btn{ display:inline-block; padding:.9rem 1.2rem; border-radius:12px; font-weight:800;
  background:linear-gradient(90deg,var(--acc2),var(--acc)); color:#0a0a0a; box-shadow:0 12px 24px rgba(0,0,0,.25); }

/* ================= BLOQUE DE IMÁGENES (centradas y completas) ================= */
.hero-assets{
  justify-self:end; align-self:center;
  position:relative; z-index:2;
  width: var(--frame-w); height: var(--frame-h);
  max-width:100%; max-height:100%;
  /* nada de overflow hidden; dejamos que las sombras respiren */
  overflow:visible;
}

/* Cada asset ocupa el marco y se centra — SIN recortar */
.asset{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transform:scale(.98); /* el activo sube a 1 y scale(1) */
  filter: drop-shadow(0 24px 48px rgba(0,0,0,.35));
  transition: opacity .45s ease, transform .45s ease, filter .45s ease;
}
.asset img{
  /* clave para que SIEMPRE se vean COMPLETAS */
  max-width:100%; max-height:120%;
  width:auto; height:auto;
  object-fit:contain; object-position:center;
  display:block; border-radius:12px;
  -webkit-user-drag:none; user-select:none;
}

/* Si usas clases para el activo visible */
.asset.is-active{ opacity:1; transform:scale(1); filter:drop-shadow(0 28px 56px rgba(0,0,0,.4)); }

/* ---------- Responsivo ---------- */
@media (max-width:1100px){
  :root{ --frame-w: clamp(340px, 50vw, 620px); --frame-h: clamp(240px, 54vh, 520px); }
}
@media (max-width:900px){
  .hero-inner{ grid-template-columns:1fr; }
  .hero-assets{ justify-self:center; order:-1; margin-bottom:8px; }
}
@media (max-width:620px){
  :root{ --frame-w: clamp(300px, 90vw, 560px); --frame-h: clamp(220px, 60vh, 460px); }
}
@media (prefers-reduced-motion:reduce){
  .asset, .hero-cta .btn{ transition:none; }
}

/* Tema claro opcional */
:root.light{ --txt:#0b0d12; --txt-d:#2b3a4a; }
/* ===========================
   Fondo animado sutil (CSS only)
   =========================== */

/* Capa de brillo suave que deriva y pulsa detrás del contenido */
.hero-gsap::before{
  content:"";
  position:absolute; inset:-12%;
  z-index:1;                 /* fondo animado debajo del contenido (z=2) */
  pointer-events:none;
  opacity:.35;               /* intensidad global del efecto */
  filter: blur(14px);        /* suaviza el brillo */
  background:
    radial-gradient(40% 50% at 18% 12%, rgba(230,196,101,.10) 0%, rgba(230,196,101,0) 60%),
    radial-gradient(52% 62% at 84% 78%, rgba(184,137,36,.08) 0%, rgba(184,137,36,0) 70%),
    radial-gradient(30% 40% at 50% 10%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 65%);
  background-repeat:no-repeat;
  animation:
    bg-drift 26s ease-in-out infinite alternate,
    bg-pulse 8s ease-in-out infinite;
}

/* Deriva lenta (posición + ligera escala) */
@keyframes bg-drift{
  0%{
    transform: translate3d(0,0,0) scale(1);
    background-position: 18% 12%, 84% 78%, 50% 10%;
    background-size:     80% 80%,  86% 86%,  70% 70%;
  }
  100%{
    transform: translate3d(0,-2%,0) scale(1.02);
    background-position: 26% 24%, 70% 62%, 56% 18%;
    background-size:     92% 92%,  78% 78%,  84% 84%;
  }
}

/* Pulso suave de intensidad */
@keyframes bg-pulse{
  0%,100%{ opacity:.28; }
  50%    { opacity:.40; }
}

/* Si el usuario prefiere menos movimiento, desactiva la animación */
@media (prefers-reduced-motion: reduce){
  .hero-gsap::before{ animation:none; opacity:.25; }
}
/* Grano sutil encima del fondo (no afecta legibilidad) */
.hero-gsap::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  opacity:.05; mix-blend-mode:soft-light;
  background-image:
    radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,.35) 0, transparent 60%),
    radial-gradient(1px 1px at 70% 60%, rgba(255,255,255,.25) 0, transparent 60%),
    radial-gradient(1px 1px at 40% 80%, rgba(0,0,0,.35) 0, transparent 60%);
  background-repeat:repeat;
  background-size: 180px 180px, 220px 220px, 200px 200px;
  animation: grain-move 18s linear infinite;
}
@keyframes grain-move{
  0% { transform: translate3d(0,0,0); }
  100%{ transform: translate3d(-2%, -2%, 0); }
}
@media (prefers-reduced-motion:reduce){
  .hero-gsap::after{ animation:none; }
}

/* Expositores */
/* ====== Liquid Glass — sección de Autores ====== */
:root{
  --g-bg:#0b0d12;            /* fondo general (coincide con tu tema) */
  --g-fg:#eef3fa;            /* texto */
  --g-fg-2:#b8c2cf;          /* texto secundario */
  --g-acc:#e6c465;           /* dorado */
  --g-acc-2:#b88924;         /* dorado oscuro */
  --g-panel: rgba(255,255,255,.05); /* vidrio */
  --g-stroke: rgba(230,196,101,.35); /* borde vidrio */
  --g-blur: 16px;
}

#autores-vidrio {
    position: relative;
    padding: clamp(28px, 6vw, 72px) 0;
    background: radial-gradient(70% 90% at 12% 10%, rgba(230, 196, 101, .10), transparent 60%), radial-gradient(70% 100% at 88% 90%, rgba(184, 137, 36, .08), transparent 70%), #0b0d1299;
    color: var(--g-fg);
    overflow: hidden;
}

.glass-wrap{ width:min(1150px, 92vw); margin:0 auto; }

.glass-title{
  font-size:clamp(22px, 2.6vw, 32px);
  letter-spacing:.02em; text-transform:uppercase;
  margin:0 0 .6rem;
}
.glass-subtitle{ color:var(--g-fg-2); margin:0 0 1.2rem; }

/* Panel vidrio */
.glass-panel{
  position:relative;
  border-radius:18px;
  padding:clamp(16px, 2.2vw, 24px);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
  backdrop-filter: blur(var(--g-blur));
  -webkit-backdrop-filter: blur(var(--g-blur));
  isolation:isolate;
}

/* Borde y halo “liquid glass” */
.glass-panel::before{
  content:"";
  position:absolute; inset:0; border-radius:18px; z-index:-1;
  padding:1px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06)) border-box,
    linear-gradient(92deg, var(--g-acc), var(--g-acc-2)) border-box;

  /* Máscara doble: deja visible solo el borde (hueco al centro) */
  mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  mask-composite: exclude;

  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;

  animation: glass-breath 9s ease-in-out infinite;
}

.glass-panel::after{
  /* brillo suave que recorre el borde */
  content:""; position:absolute; inset:-1px; border-radius:20px; z-index:-2;
  background:
    radial-gradient(120px 60px at 12% -10%, rgba(255,255,255,.12), transparent 60%),
    radial-gradient(140px 80px at 90% 110%, rgba(255,255,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
  filter: blur(18px); opacity:.45;
  animation: glass-sheen 14s ease-in-out infinite alternate;
}
@keyframes glass-breath{
  0%,100%{ filter: drop-shadow(0 0 0 rgba(230,196,101,.0)); }
  50%    { filter: drop-shadow(0 0 10px rgba(230,196,101,.25)); }
}
@keyframes glass-sheen{
  0%   { transform: translate3d(0,0,0); }
  100% { transform: translate3d(-1.5%, -1.5%, 0); }
}

/* Grid de tarjetas */
.autores-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap:clamp(16px, 2.2vw, 24px);
}

/* Tarjeta */
.autor-glass{
  display:grid; grid-template-columns: 120px 1fr; gap:16px;
  align-items:start;
  background: rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px; padding:14px 16px;
  box-shadow: 0 14px 32px rgba(0,0,0,.25);
  transition: transform .25s ease, box-shadow .25s ease;
  transform: translateY(10px); opacity:0;
}
.autor-glass:where(:hover,:focus-within){
  transform: translateY(2px);
  box-shadow: 0 20px 44px rgba(0,0,0,.32);
}

/* Foto circular con anillo líquido */
.autor-foto{
  position:relative; width:120px; aspect-ratio:1/1; border-radius:50%;
  overflow:hidden; display:grid; place-items:center;
  background: radial-gradient(80% 80% at 50% 30%, rgba(255,255,255,.08), transparent 70%);
}
.autor-foto img{
  width:100%; height:105%; object-fit:cover; object-position:center; display:block;
  transform: scale(1.3);
}
.foto-ring{
  position:absolute; inset:0; border-radius:50%;
  pointer-events:none;
  background:
    radial-gradient(60% 60% at 40% 20%, rgba(255,255,255,.35), rgba(255,255,255,0) 70%),
    conic-gradient(from 210deg, var(--g-acc), var(--g-acc-2), var(--g-acc));

  /* Grosor del anillo */
  --ring-w: 2px;

  /* Máscaras: estándar + webkit (Safari) */
  mask: radial-gradient(circle at center,
        transparent calc(50% - var(--ring-w)),
        #000 calc(50% - var(--ring-w) + 1px));
  -webkit-mask: radial-gradient(circle at center,
        transparent calc(50% - var(--ring-w)),
        #000 calc(50% - var(--ring-w) + 1px));

  opacity:.85; filter: blur(.2px);
  animation: ring-flow 6.5s linear infinite;
}

@keyframes ring-flow{
  to { transform: rotate(360deg); }
}


/* Texto */
.autor-nombre{ margin:.1rem 0 .25rem; font-size:clamp(18px, 1.6vw, 22px); line-height:1.2; }
.autor-rol{ color:#d34d4d; font-weight:700; margin:0 0 .5rem; }
.autor-bio{ color:var(--g-fg-2); margin:0; line-height:1.65; }

/* Responsive */
@media (max-width:900px){
  .autores-grid{ grid-template-columns:1fr; }
}
@media (max-width:520px){
  .autor-glass{ grid-template-columns: 92px 1fr; }
  .autor-foto{ width:92px; }
}

/* Movimiento reducido */
@media (prefers-reduced-motion:reduce){
  .glass-panel::before,.glass-panel::after,.foto-ring{ animation:none; }
  .autor-glass{ transition:none; transform:none; opacity:1; }
}
/* ===== Tamaños y centrado ===== */
#autores-vidrio{ padding: clamp(40px,7vw,90px) 0; }
.glass-wrap{ width:min(1300px, 94vw); margin:0 auto; text-align:center; }
.glass-title{ font-size:clamp(26px,3vw,36px); }
.glass-subtitle{ margin-bottom: clamp(18px,2.6vw,28px); }

/* Panel vidrio más protagonista */
.glass-panel{
  padding: clamp(22px,2.6vw,28px);
  border-radius: 22px;
  box-shadow: 0 26px 70px rgba(0,0,0,.45);
}
.glass-panel::before{ border-radius: 22px; }
.glass-panel::after { border-radius: 28px; }

/* Grid centrado con tarjetas grandes */
.autores-grid{
  margin: 0 auto;
  grid-template-columns: repeat(2, minmax(440px, 1fr));
  gap: clamp(20px, 2.6vw, 34px);
  justify-items: center;
}

/* Tarjeta XL */
.autor-glass{
  width: min(620px, 100%);
  grid-template-columns: 160px 1fr;
  gap: 20px;
  padding: clamp(18px,2vw,22px);
  border-radius: 18px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
  transform: translateY(14px) scale(.98);
  opacity:0;
}

/* Foto circular grande */
.autor-foto{
  width: 160px; aspect-ratio:1/1; border-radius:50%;
}
.foto-ring{ --ring-w: 3px; }

/* Tipografías más grandes */
.autor-nombre{ font-size: clamp(20px, 2.1vw, 26px); }
.autor-rol{ font-size: clamp(14px, 1.4vw, 16px); margin-bottom: .6rem; }
.autor-bio{ font-size: clamp(15px, 1.35vw, 17px); }

/* Hover/focus más fino */
.autor-glass:where(:hover,:focus-within){
  transform: translateY(0) scale(1);
  box-shadow: 0 30px 70px rgba(0,0,0,.46);
}

/* Responsive */
@media (max-width: 980px){
  .autores-grid{ grid-template-columns:1fr; }
  .autor-glass{ width:min(760px, 96%); }
  .autor-glass{ grid-template-columns: 140px 1fr; }
  .autor-foto{ width:140px; }
}
@media (max-width: 560px){
  .autor-glass{ grid-template-columns: 1fr; text-align:left; }
  .autor-foto{ width:124px; margin-inline:auto; }
}

/* CTA 2*/
/* ===== CTA glass (colores originales) ===== */
:root{
  /* usa tus variables si ya existen; estas son fallback */
  --c1:#0b0d12; --c2:#1b2430; --c3:#2b3a4a;
  --gold:#e6c465; --gold2:#b88924;
  --txt:#eef3fa; --txt-d:#b8c2cf;
}

#cta-glass-pro {
    position: relative;
    overflow: hidden;
    padding: clamp(38px, 7vw, 96px) 0;
    background: radial-gradient(80% 100% at 12% 8%, rgba(230, 196, 101, .10), transparent 60%), radial-gradient(90% 110% at 88% 92%, rgba(184, 137, 36, .09), transparent 70%), linear-gradient(180deg, #1b243000, #0b0d1273 46%, #0a0c11cf);
    color: var(--txt);
    isolation: isolate;
}

.gp-wrap{ width:min(1200px, 94vw); margin:0 auto; }

.gp-panel{
  position:relative;
  display:grid; grid-template-columns: 1.2fr .8fr; gap:clamp(16px,3vw,36px);
  padding: clamp(18px, 2.6vw, 28px);
  border-radius:22px;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 26px 72px rgba(0,0,0,.45);
  overflow:hidden;
}

/* borde + halo liquid glass */
.gp-panel::before{
  content:""; position:absolute; inset:0; border-radius:22px; z-index:-1; padding:1px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.06)) border-box,
    linear-gradient(92deg, var(--gold), var(--gold2)) border-box;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  animation: gp-breath 9s ease-in-out infinite;
}
.gp-panel::after{
  content:""; position:absolute; inset:-1px; border-radius:28px; z-index:-2;
  background:
    radial-gradient(140px 80px at 6% -10%, rgba(255,255,255,.14), transparent 60%),
    radial-gradient(180px 100px at 96% 110%, rgba(255,255,255,.12), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
  filter: blur(18px); opacity:.45;
  animation: gp-sheen 14s ease-in-out infinite alternate;
}
@keyframes gp-breath{
  0%,100%{ filter: drop-shadow(0 0 0 rgba(230,196,101,0)); }
  50%    { filter: drop-shadow(0 0 10px rgba(230,196,101,.25)); }
}
@keyframes gp-sheen{
  0%{ transform: translate3d(0,0,0); }
  100%{ transform: translate3d(-1.5%, -1.5%, 0); }
}

.gp-left h2{
  font-size: clamp(28px, 4.2vw, 56px);
  line-height:1.08; letter-spacing:.01em; margin:0 0 .55rem;
}
.gp-sub{ color:var(--txt-d); margin:0 0 1rem; max-width: 68ch; }

.gp-list{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
.gp-list li{
  display:flex; align-items:center; gap:.7rem;
  font-weight:800; color:var(--txt);
  font-size: clamp(16px, 1.5vw, 22px);
}
.gp-check{
  width:1.25em; height:1.25em; border-radius:50%;
  display:grid; place-items:center; font-style:normal; font-weight:900;
  color:#2f2102;
  background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.9), rgba(255,255,255,.45));
  box-shadow: 0 1px 0 rgba(0,0,0,.25), inset 0 0 0 2px rgba(0,0,0,.15);
}

/* botón dorado */
.gp-right{ display:flex; align-items:flex-start; justify-content:flex-end; }
.gp-btn{
  display:inline-block; white-space:nowrap; font-weight:900; letter-spacing:.02em;
  padding:.95rem 1.35rem; border-radius:999px; color:#0b0d12; text-decoration:none;
  background: linear-gradient(96deg, var(--gold2), var(--gold));
  box-shadow:0 18px 36px rgba(0,0,0,.38), inset 0 0 0 1px rgba(255,255,255,.30);
  position:relative; overflow:hidden; transform: translateZ(0);
  transition: transform .2s ease, box-shadow .2s ease;
}
.gp-btn:hover{ transform: translateY(-2px); box-shadow:0 22px 42px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.34); }
.gp-btn::after{
  content:""; position:absolute; left:-140%; top:0; width:160%; height:100%;
  transform:skewX(-18deg); pointer-events:none; opacity:0;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.55), rgba(255,255,255,0));
  mix-blend-mode:screen;
}

/* Orbes decor (liquid/bokeh) */
.gp-orb{
  position:absolute; border-radius:50%; pointer-events:none; filter: blur(14px); opacity:.5;
  background: radial-gradient(circle at 35% 35%, rgba(230,196,101,.75), rgba(184,137,36,.4) 60%, transparent 70%);
}
.orb-a{ width:160px; height:160px; left:6%;  top:10%; }
.orb-b{ width:220px; height:220px; right:10%; top:28%; }
.orb-c{ width:120px; height:120px; right:28%; bottom:12%; }

/* Responsive */
@media (max-width:980px){
  .gp-panel{ grid-template-columns:1fr; }
  .gp-right{ justify-content:flex-start; }
  .gp-btn{ margin-top:.6rem; }
}
@media (prefers-reduced-motion:reduce){
  .gp-panel::before,.gp-panel::after{ animation:none; }
}
/* Centrar el botón */
.gp-right{
  display:flex;
  justify-content:center;   /* centrado horizontal */
  align-items:center;       /* centrado vertical */
}
.gp-btn{ text-align:center; }

/* Lista con double-check y estilo benef-icon */
.gp-list{
  list-style:none; margin:0; padding:0;
  display:grid; gap:.7rem;
}
.gp-list li{
  display:flex; align-items:center; gap:.7rem;
  font-weight:800; color:var(--txt);
  font-size: clamp(16px, 1.5vw, 22px);
}

.benef-icon{
  display:inline-grid; place-items:center;
  width:1.6em; height:1.6em; border-radius:50%;
  font-size:1em;            
  color:#213;              
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.95) 0%, rgba(255,255,255,.65) 60%, rgba(255,255,255,.35) 100%);
  box-shadow:
    0 1px 0 rgba(0,0,0,.25),
    inset 0 0 0 2px rgba(0,0,0,.18),
    0 4px 10px rgba(0,0,0,.25);
}

.benef-icon::after{
  content:"";
  position:absolute; inset:-2px; border-radius:50%;
  pointer-events:none;
  background: radial-gradient(60% 60% at 35% 30%, rgba(230,196,101,.28), transparent 70%);
  filter: blur(4px); opacity:.65;
}
/* ===== Paleta (usa tus variables si ya existen) ===== */
:root{
  --c1:#0b0d12; --c2:#1b2430; --c3:#2b3a4a;
  --gold:#e6c465; --gold2:#b88924;
  --txt:#eef3fa; --txt-d:#b8c2cf;
}

/* ===== Sección ===== */
#ventas {
    position: relative;
    overflow: hidden;
    padding: clamp(32px, 6vw, 84px) 0;
    background: radial-gradient(80% 100% at 12% 8%, rgba(230, 196, 101, .10), transparent 60%), radial-gradient(90% 110% at 88% 92%, rgba(184, 137, 36, .08), transparent 70%), linear-gradient(180deg, #1b24307a, #0b0d12bf 46%, #0a0c11ad);
    color: var(--txt);
    isolation: isolate;
}
.ventas-wrap{ width:min(1200px, 94vw); margin:0 auto; }

/* ===== Encabezado ===== */
.ventas-head{ margin-bottom: clamp(18px,3vw,28px); }
.ventas-kicker{
  text-transform:uppercase; letter-spacing:.18em; font-weight:800;
  color:var(--gold); margin:0 0 .3rem;
}
#ventas-title{
  margin:0; font-size: clamp(24px, 3.6vw, 40px); line-height:1.05;
}
.ventas-underline{
  display:block; height:3px; width: clamp(120px, 18vw, 200px);
  margin-top:.6rem; border-radius:999px;
  background: linear-gradient(90deg, var(--gold2), var(--gold));
  box-shadow: 0 0 18px rgba(230,196,101,.45);
}

/* ===== Grid ===== */
.ventas-grid{
  display:grid; gap: clamp(18px, 2.6vw, 26px);
  grid-template-columns: repeat(2, minmax(280px, 1fr));
}
@media (max-width: 900px){
  .ventas-grid{ grid-template-columns:1fr; }
}

/* ===== Tarjeta (liquid glass) ===== */
.v-card{
  position:relative;
  display:grid; grid-template-columns: 128px 1fr; gap: clamp(14px, 2vw, 18px);
  align-items:start; padding: clamp(14px, 2vw, 18px);
  border-radius:18px; overflow:hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 18px 46px rgba(0,0,0,.42);
  border:1px solid rgba(255,255,255,.12);
  transform: translateY(14px) scale(.98);
  opacity:0;
}
.v-card::before{
  /* borde dorado respirando */
  content:""; position:absolute; inset:0; border-radius:18px; z-index:-1; padding:1px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.06)) border-box,
    linear-gradient(92deg, var(--gold), var(--gold2)) border-box;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  animation: v-breath 9s ease-in-out infinite;
}
@keyframes v-breath{
  0%,100%{ filter: drop-shadow(0 0 0 rgba(230,196,101,0)); }
  50%    { filter: drop-shadow(0 0 10px rgba(230,196,101,.25)); }
}

/* Avatar circular */
.v-avatar{
  width:128px; aspect-ratio:1/1; border-radius:50%; overflow:hidden;
  background: radial-gradient(70% 70% at 50% 30%, rgba(255,255,255,.10), transparent 70%);
  display:grid; place-items:center;
}
.v-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }

/* Texto */
.v-name{ margin:.1rem 0 .2rem; font-size: clamp(18px,2vw,22px); }
.v-role{ margin:0 0 .7rem; color:var(--txt-d); }

.v-contact{ list-style:none; margin:0; padding:0; display:grid; gap:.55rem; }
.v-contact li{ display:flex; gap:.7rem; align-items:center; }
.v-contact i{ color:var(--gold); font-size:1.05rem; }
.v-contact a{
  color:var(--txt); text-decoration:none; font-weight:700;
  background: linear-gradient(90deg, rgba(230,196,101,.9), rgba(255,255,255,.98) 40%, rgba(230,196,101,.9));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  text-shadow: 0 1px 0 rgba(0,0,0,.25);
}
.v-contact a:hover{ text-decoration:underline; }

/* Destellos sutiles de fondo */
.ventas-sparkles{
  position:absolute; inset:0; pointer-events:none; opacity:.65;
  background-image:
    radial-gradient(2px 2px at 12% 24%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 22% 76%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 34% 40%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 66% 28%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 78% 72%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 90% 46%, rgba(255,230,160,.9), transparent 60%);
  background-repeat:no-repeat;
}
/* ===== Tarjeta: más aire, mejor alineación ===== */
.v-card{
  /* más alto y espacioso */
  grid-template-columns: 160px 1fr;         /* foto | contenido */
  gap: clamp(18px, 2.6vw, 24px);
  padding: clamp(18px, 2.6vw, 24px);
  border-radius: 20px;
}

/* foto más grande y separada */
.v-avatar{
  width: 160px;
  margin-top: 2px;                   /* micro alineación con el nombre */
}

/* cuerpo alineado y con buen ritmo vertical */
.v-body{
  align-self: center;
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: clamp(6px, 1.4vw, 10px);
}

/* tipografías */
.v-name{ font-size: clamp(20px, 2.2vw, 26px); margin:0; }
.v-role{ font-size: clamp(14px, 1.4vw, 16px); margin:0 0 .4rem; }

/* contactos con más respiración */
.v-contact{
  gap: clamp(8px, 1.6vw, 10px);
}
.v-contact li{
  gap: .6rem;
  align-items: center;
  line-height: 1.35;
}
.v-contact i{ font-size: 1.1rem; }

/* ===== Responsive ===== */
@media (max-width: 860px){
  .v-card{
    grid-template-columns: 1fr;           /* foto arriba, texto abajo */
    text-align: left;
  }
  .v-avatar{
    margin-inline: auto;                   /* centra la foto en móvil */
    width: 150px;
  }
  .v-body{
    justify-items: center;                 /* nombre/rol centrados */
    text-align: center;
  }
  .v-contact{
    justify-items: center;
  }
  .v-contact li{
    justify-content: center;
    flex-wrap: wrap;
  }
}

/* ===== Hover: elevación + brillo fino ===== */
.v-card{ transition: transform .25s ease, box-shadow .25s ease; }
.v-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 26px 70px rgba(0,0,0,.48);
}
.v-card:hover::before{ filter: drop-shadow(0 0 12px rgba(230,196,101,.28)); }

/* ====== LAYOUT con aire real ====== */
.v-card{
  /* más espacio interno y columna de avatar más amplia */
  grid-template-columns: 220px 1fr;     /* avatar | contenido */
  gap: clamp(22px, 3vw, 32px);
  padding: clamp(22px, 3vw, 30px);
  border-radius: 22px;
  align-items: center;                  /* centra verticalmente avatar y texto */
  min-height: 220px;                    /* evita que colapse si la bio es corta */
}

/* Avatar grande y estable */
.v-avatar{
  width: 173px;                         /* diámetro del círculo */
  aspect-ratio: 1/1;
  margin: 0;                            /* sin “empuje” vertical raro */
  justify-self: center;                 /* centrado en su columna */
}

/* Cuerpo con ritmo y respiración */
.v-body{
  display: grid;
  grid-template-rows: auto auto 1fr;    /* nombre | rol | contactos */
  gap: clamp(10px, 1.6vw, 14px);
  align-content: center;
}

.v-name{
  font-size: clamp(22px, 2.4vw, 30px);
  margin: 0;
  line-height: 1.15;
}

.v-role{
  margin: 0;
  color: var(--txt-d);
  font-size: clamp(14px, 1.5vw, 16px);
  line-height: 1.35;
}

/* Contactos: mejor legibilidad */
.v-contact{
  display: grid;
  gap: clamp(10px, 1.6vw, 14px);
}
.v-contact li{
  display: grid;
  grid-template-columns: 22px 1fr;      /* icono | texto */
  align-items: center;
  column-gap: .6rem;
  line-height: 1.5;                     /* más alto de línea */
}
.v-contact i{ font-size: 1.15rem; }
.v-contact a{
  font-size: clamp(15px, 1.6vw, 15px);
  font-weight: 700;
}

/* ====== RESPONSIVE ====== */
@media (max-width: 980px){
  .v-card{
    grid-template-columns: 1fr;         /* apila */
    text-align: center;
    gap: clamp(16px, 2.6vw, 22px);
  }
  .v-avatar{ width: 180px; margin-inline: auto; }
  .v-body{ justify-items: center; }
  .v-contact{
    width: min(560px, 94%);
    margin-inline: auto;
  }
  .v-contact li{
    grid-template-columns: 22px 1fr;
    justify-content: center;
  }
}

@media (max-width: 560px){
  .v-avatar{ width: 150px; }
  .v-contact li{ grid-template-columns: 20px 1fr; }
}


/* LA */
:root{
  --c1:#0b0d12; --c2:#1b2430; --c3:#2b3a4a;
  --gold:#e6c465; --gold2:#b88924;
  --txt:#eef3fa; --txt-d:#b8c2cf;
}

#st-digital {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    padding: clamp(34px, 6.8vw, 96px) 0;
    background: radial-gradient(80% 100% at 12% 8%, rgba(230, 196, 101, .10), transparent 60%), radial-gradient(90% 110% at 88% 92%, rgba(184, 137, 36, .08), transparent 70%), linear-gradient(180deg, #1b2430b3, #0b0d12ad 46%, #0a0c11d9);
    color: var(--txt);
}
.stg-wrap{ width:min(1200px, 94vw); margin:0 auto; }

/* Banda de título (parecido a tu referencia) */
.stg-band{
  position:relative;
  display:inline-block;
  background: linear-gradient(90deg, var(--gold2), var(--gold));
  color:#0b0d12;
  padding:.65rem 1.2rem; border-radius:14px;
  font-weight:900; letter-spacing:.01em;
  box-shadow:0 18px 40px rgba(0,0,0,.35);
}
.stg-band h2{ margin:0; font-size: clamp(18px, 2.2vw, 24px); }
.stg-band-shine{
  position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.6), rgba(255,255,255,0));
  transform: translateX(-140%) skewX(-18deg); opacity:.0; mix-blend-mode:screen;
}

/* Subtítulo */
.stg-sub{
  text-align:center; margin: .9rem 0 1.2rem;
  color:var(--txt); font-weight:700;
}
.stg-sub em{ color:var(--txt-d); font-style:normal; font-weight:700; }

/* Badges como tu segunda imagen */
.stg-badges{
  display:flex; flex-wrap:wrap; gap:.7rem .9rem;
  justify-content:center; margin:0 0 1.3rem;
}
.stg-badges span{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.55rem .9rem; border-radius:999px; font-weight:900;
  color:var(--txt);
  background: rgba(255,255,255,.02);
  border:1px solid rgba(230,196,101,.28);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.stg-badges i{ color:var(--gold); }

/* Páginas (dos imágenes lado a lado) */
.stg-pages{
  display:grid; gap: clamp(14px, 2vw, 22px);
  grid-template-columns: 1fr 1fr;
  margin: 0 0 1.4rem;
}
.stg-page{
  border-radius:18px; overflow:hidden; background:#0b0d12;
  backdrop-filter: blur(14px);
  box-shadow:0 24px 60px rgba(0,0,0,.45),
             inset 0 0 0 1px rgba(255,255,255,.08);
  transform-origin: 50% 60%;
}
.stg-page img{ width:100%; height:100%; object-fit:contain; display:block; }

.stg-front{ transform: rotate(-1.6deg); }
.stg-back { transform: rotate( 1.6deg); }

@media (max-width: 900px){
  .stg-pages{ grid-template-columns:1fr; }
  .stg-front,.stg-back{ transform:none; }
}

/* Listas de beneficios (dos columnas) */
.stg-grid{
  display:grid; gap: clamp(14px, 2vw, 22px);
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 900px){
  .stg-grid{ grid-template-columns:1fr; }
}
.stg-list{
  list-style:none; margin:0; padding:0; display:grid; gap:.9rem;
}
.stg-list h3{
  margin:0 0 .25rem; font-size: clamp(16px, 1.7vw, 20px); font-weight:900;
  display:flex; align-items:center; gap:.55rem;
  background: linear-gradient(90deg, var(--gold2), var(--gold));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.stg-list h3 i{ color:var(--gold); -webkit-text-fill-color:initial; }
.stg-list p{ margin:0; color:var(--txt-d); line-height:1.5; }

/* Destellos */
.stg-sparkles{
  position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:
    radial-gradient(2px 2px at 12% 24%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 22% 76%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 34% 40%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 66% 28%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 78% 72%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 90% 46%, rgba(255,230,160,.9), transparent 60%);
  background-repeat:no-repeat;
}
/* ===== CINTA DORADA CENTRADA + LIQUID GLASS ===== */
.stg-band{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin: 0 auto 1rem;                 /* centrada */
  padding: .7rem 1.2rem;
  border-radius: 14px;
  color: #0b0d12;
  font-weight: 900;
  letter-spacing: .01em;

  /* “oro” + glass */
  background:
    linear-gradient(90deg, rgba(184,137,36,.85), rgba(230,196,101,.85));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
  overflow: hidden;
}
.stg-band h2{ margin:0; font-size: clamp(18px, 2.2vw, 24px); }

/* brillo que recorre la cinta */
.stg-band-shine{
  position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.50), rgba(255,255,255,0));
  transform: translateX(-140%) skewX(-18deg);
  mix-blend-mode:screen; opacity:.0;
}

/* ===== BLOQUE DE PÁGINAS CON LIQUID GLASS ===== */
.stg-pages{
  position: relative;
  display: grid; gap: clamp(14px, 2vw, 22px);
  grid-template-columns: 1fr 1fr;
  padding: clamp(14px, 2vw, 20px);
  margin: 0 0 1.4rem;

  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 26px 66px rgba(0,0,0,.45);
  isolation: isolate;                   /* para el borde animado */
}

/* borde dorado respirando */
.stg-pages::before{
  content:"";
  position:absolute; inset:0; border-radius:20px; padding:1px; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06)) border-box,
    linear-gradient(92deg, var(--gold), var(--gold2)) border-box;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  animation: stg-breath 9s ease-in-out infinite;
}
@keyframes stg-breath{
  0%,100%{ filter: drop-shadow(0 0 0 rgba(230,196,101,0)); }
  50%    { filter: drop-shadow(0 0 10px rgba(230,196,101,.25)); }
}

/* ===== PÁGINAS IGUALADAS Y ALINEADAS ===== */
.stg-page{
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  background:#0b0d12;
  box-shadow: 0 22px 50px rgba(0,0,0,.35),
              inset 0 0 0 1px rgba(255,255,255,.08);
  transform-origin: 50% 60%;
  will-change: transform;

  /* MISMA ALTURA para ambas (desktop) */
  height: min(60vh, 520px);
  display:flex; align-items:center; justify-content:center;
}
.stg-page img{
  width:100%; height:100%; object-fit:contain; display:block;
}

/* Rotación sutil “como libro” */
.stg-front{ transform: rotate(-1.6deg); }
.stg-back { transform: rotate( 1.6deg); }

/* ===== Badges ===== */
.stg-badges{
  display:flex; flex-wrap:wrap; gap:.7rem .9rem; justify-content:center;
  margin: .4rem 0 1.3rem;
}
.stg-badges span{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.55rem .9rem; border-radius:999px; font-weight:900;
  color:var(--txt);
  background: rgba(255,255,255,.02);
  border:1px solid rgba(230,196,101,.28);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.stg-badges i{ color:var(--gold); }

/* Subtítulo */
.stg-sub{
  text-align:center; margin: .9rem 0 1.2rem;
  color:var(--txt); font-weight:700;
}
.stg-sub em{ color:var(--txt-d); font-style:normal; font-weight:700; }

/* Listas (dos columnas) */
.stg-grid{
  display:grid; gap: clamp(14px, 2vw, 22px);
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 900px){
  .stg-grid{ grid-template-columns:1fr; }
  .stg-pages{ grid-template-columns:1fr; }
  .stg-page{ height: 58vw; max-height: 420px; }   /* misma altura en móvil */
  .stg-front,.stg-back{ transform:none; }         /* sin rotación en pantallas pequeñas */
}
.stg-list{ list-style:none; margin:0; padding:0; display:grid; gap:.9rem; }
.stg-list h3{
  margin:0 0 .25rem; font-size: clamp(16px, 1.7vw, 20px); font-weight:900;
  display:flex; align-items:center; gap:.55rem;
  background: linear-gradient(90deg, var(--gold2), var(--gold));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.stg-list h3 i{ color:var(--gold); -webkit-text-fill-color:initial; }
.stg-list p{ margin:0; color:var(--txt-d); line-height:1.5; }

/* Destellos del fondo (ya lo tenías) */
.stg-sparkles{
  position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:
    radial-gradient(2px 2px at 12% 24%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 22% 76%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 34% 40%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 66% 28%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 78% 72%, rgba(255,230,160,.9), transparent 60%),
    radial-gradient(2px 2px at 90% 46%, rgba(255,230,160,.9), transparent 60%);
  background-repeat:no-repeat;
}
/* Fallback por si no existiera la variable en tu hoja */
:root{ --gold: #e6c465; --txt:#eef3fa; --txt-d:#b8c2cf; }

/* Base */
.contacto-datos{
  list-style:none; margin:0; padding:0; display:grid; gap:.6rem;
}
.contacto-datos li{
  display:flex; align-items:center; gap:.6rem;
  line-height:1.5;
}
.contacto-datos i{
  font-size:1.1rem; color:var(--txt-d);
  transition: color .25s ease, transform .25s ease;
}

/* Enlaces con subrayado animado y transición de color */
.contacto-datos a{
  color:var(--txt);
  text-decoration:none;
  position:relative;
  transition: color .25s ease, text-shadow .25s ease;

  /* subrayado “ink” animado */
  background-image:
    linear-gradient(var(--gold), var(--gold)); /* línea dorada */
  background-size: 0% 2px;
  background-repeat:no-repeat;
  background-position: 0 100%;
  padding-bottom: 2px;
}

/* Hover + focus = dorado */
.contacto-datos a:hover,
.contacto-datos a:focus-visible{
  color:var(--gold);
  background-size: 100% 2px;
  text-shadow: 0 0 10px rgba(230,196,101,.35);
  outline: none;
}

/* Al pasar por el <li> también doramos el icono */
.contacto-datos li:hover i{
  color:var(--gold);
  transform: translateY(-1px);
}

/* Espaciado si usas “y” entre dos enlaces en la misma línea */
.contacto-datos li a + span.and,
.contacto-datos li span.and{
  margin: 0 .35rem; color: var(--txt-d);
}

/* Footer */
/* ===== Ajustes globales del footer ===== */
#footer-isef {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    color: var(--txt);
    background: radial-gradient(42% 70% at 16% 14%, rgba(230, 196, 101, .10) 0%, rgba(230, 196, 101, 0) 60%), radial-gradient(55% 80% at 86% 62%, rgba(184, 137, 36, .12) 0%, rgba(184, 137, 36, 0) 65%), linear-gradient(180deg, #1b24306e 0%, #0b0d12d1 60%, #0a0c1100 100%);
    padding: clamp(34px, 4.2vw, 54px) 0 0;
}

/* Destellos: más discretos y “en retícula” */
#footer-isef .ft-stars{
  opacity:.65;
  background-image:
    radial-gradient(2px 2px at 10% 22%, rgba(255,230,160,.85), transparent 60%),
    radial-gradient(2px 2px at 24% 40%, rgba(255,230,160,.85), transparent 60%),
    radial-gradient(2px 2px at 38% 70%, rgba(255,230,160,.85), transparent 60%),
    radial-gradient(2px 2px at 56% 28%, rgba(255,230,160,.85), transparent 60%),
    radial-gradient(2px 2px at 70% 58%, rgba(255,230,160,.85), transparent 60%),
    radial-gradient(2px 2px at 86% 36%, rgba(255,230,160,.85), transparent 60%),
    radial-gradient(2px 2px at 92% 78%, rgba(255,230,160,.85), transparent 60%);
}

/* ===== Grid y alineación ===== */
#footer-isef .ft-wrap{
  width:min(1200px, 94vw);
  margin:0 auto;
  display:grid;
  column-gap: clamp(24px, 3.4vw, 48px);
  row-gap: clamp(18px, 2.2vw, 28px);
  /* 1:about + 3 columnas simétricas */
  grid-template-columns: 1.25fr repeat(3, 1fr);
  align-items:start;
  /* guía base-line para que todo caiga mejor */
  padding-bottom: clamp(24px, 3.2vw, 36px);
}

@media (max-width: 1080px){
  #footer-isef .ft-wrap{
    grid-template-columns: 1.1fr 1fr;
  }
}
@media (max-width: 640px){
  #footer-isef .ft-wrap{
    grid-template-columns: 1fr;
  }
}

/* Ritmo vertical unificado */
#footer-isef .ft-col{ min-width:0; }
#footer-isef p, #footer-isef li{ line-height:1.55; }

/* ===== Columna izquierda ===== */
#footer-isef .ft-about{ padding-right: clamp(6px, 1vw, 10px); }

#footer-isef .ft-badge{
  display:inline-block;
  margin-bottom: .9rem;
  padding:.7rem 1.05rem;
  border-radius:16px;
  background: linear-gradient(90deg, var(--gold2), var(--gold));
  color:#0b0d12; font-weight:900; letter-spacing:.02em;
  box-shadow:0 18px 42px rgba(0,0,0,.35);
}

#footer-isef .ft-claim{
  color:var(--txt-d);
  margin:.75rem 0 1.15rem;
  max-width: 48ch;
}

#footer-isef .ft-address p{
  display:flex; gap:.6rem; margin:.38rem 0;
}
#footer-isef .ft-address i{ color:var(--gold); margin-top:.15rem; }
#footer-isef .ft-address a{
  color:var(--txt); text-decoration:none;
  border-bottom:1px dashed rgba(230,196,101,.30);
}
#footer-isef .ft-address a:hover{ color:var(--gold); border-color:var(--gold); }

/* Redes: se veían corridas, igualamos tamaños/márgenes */
#footer-isef .ft-social{
  display:flex; gap:.55rem; margin:.8rem 0 0; padding:0; list-style:none;
}
#footer-isef .ft-social a{
  width:38px; height:38px; border-radius:999px; display:grid; place-items:center;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(230,196,101,.22);
  color:var(--txt); transition: .25s ease;
}
#footer-isef .ft-social a:hover{
  color:#0b0d12; background: linear-gradient(90deg, var(--gold2), var(--gold));
  box-shadow:0 0 0 4px rgba(230,196,101,.16);
}

/* ===== Columnas de links: indentación y bullets ===== */
#footer-isef .ft-title{
  margin: 0 0 .55rem;
  font-weight:900; letter-spacing:.02em;
  background: linear-gradient(90deg, var(--gold2), var(--gold));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}

#footer-isef .ft-links ul{
  display:grid; gap:.4rem; margin:0; padding:0; list-style:none;
}
#footer-isef .ft-links a{
  color:var(--txt); text-decoration:none; padding-left:18px; position:relative;
}
#footer-isef .ft-links a::before{
  content:"›"; position:absolute; left:0; top:0; color:var(--gold);
  transform: translateY(1px); transition: transform .18s ease;
}
#footer-isef .ft-links a:hover{ color:var(--gold); }
#footer-isef .ft-links a:hover::before{ transform: translate(3px,1px); }

/* ===== Barra legal ===== */
#footer-isef .ft-legal{
  border-top:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
#footer-isef .ft-legal-inner{
  width:min(1200px, 94vw); margin:0 auto; text-align:center;
  padding: .85rem 0; color:var(--txt-d); font-weight:700;
}

/* ===== Accesibilidad foco ===== */
#footer-isef a:focus-visible{
  outline:2px dashed var(--gold); outline-offset:3px; border-radius:6px;
}
/* ========== ALINEACIÓN TIPO “REFERENCIA” ========== */

/* 1) Grid maestro: 1ª columna fija (panel) + 3 columnas iguales */
#footer-isef .ft-wrap{
  width:min(1200px, 92vw);
  margin:0 auto;
  display:grid;
  /* Panel fijo de ~420px + 3 columnas iguales */
  grid-template-columns: 420px 1fr 1fr 1fr;
  column-gap: 40px;
  row-gap: 24px;
  align-items:start;          /* todas arrancan desde arriba */
  padding-bottom: 28px;
}

/* 2) Panel de la izquierda: ancho fijo y “tarjeta” */
#footer-isef .ft-about{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(230,196,101,.18);
  border-radius: 16px;
  padding: 22px 22px 16px;
  box-shadow: 0 12px 40px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.05);
}
#footer-isef .ft-badge{
  display:block;
  margin: 0 auto 10px;       /* centrada como la referencia */
  text-align:center;
  padding:.7rem 1.1rem;
  max-width: 94%;
}
#footer-isef .ft-claim{
  text-align:center;
  margin:.6rem auto 1rem;
  max-width: 34ch;           /* controla anchura del párrafo */
}

/* 3) Bloque de datos: ítems separados y centrados visualmente */
#footer-isef .ft-address{ margin: .6rem 0 .5rem; }
#footer-isef .ft-address p{
  margin:.5rem 0;
  gap:.55rem;
}
#footer-isef .ft-social{
  justify-content:center;    /* redes centradas en el panel */
  margin-top: .8rem;
}

/* 4) Columnas de enlaces: misma altura visual y sangrados iguales */
#footer-isef .ft-links{ padding-top: 8px; }     /* arranque a misma altura */
#footer-isef .ft-title{
  margin:0 0 .65rem;
  line-height:1.1;
}
#footer-isef .ft-links ul{
  --indent: 18px;
  display:grid;
  gap:.55rem;
  margin:0;
  padding:0;
  list-style:none;
}
#footer-isef .ft-links a{
  padding-left: var(--indent);
  position:relative;
}
#footer-isef .ft-links a::before{
  left:0; top:0; transform: translateY(1px);
}

/* 5) Ajustes de tipografía/ritmo para que no “bailen” las líneas */
#footer-isef p, #footer-isef li{ line-height: 1.55; }
#footer-isef .ft-address p,
#footer-isef .ft-links li{ margin: .45rem 0; }

/* 6) Responsive — 2 columnas (panel + 1 columna) en tablet */
@media (max-width: 1100px){
  #footer-isef .ft-wrap{
    grid-template-columns: 420px 1fr;
    column-gap: 28px;
  }
  #footer-isef .ft-links:nth-of-type(2){ order: 2; } /* mantiene orden legible */
}

/* 7) Responsive — 1 columna en móvil */
@media (max-width: 640px){
  #footer-isef .ft-wrap{
    grid-template-columns: 1fr;
    row-gap: 18px;
  }
  #footer-isef .ft-about{
    padding:18px 16px 14px;
  }
  #footer-isef .ft-claim{ max-width: 36ch; }
  #footer-isef .ft-social{ justify-content:flex-start; }
}
/* ===== ACABADOS – layout ===== */
#acabados { position: relative; padding: 4rem 0 1rem; }
.acabados-wrap .title { margin-bottom: .25rem; }
.acabados-wrap .subtitle { margin-bottom: 2rem; }

.acabados-gallery{
  display:grid; gap:1.2rem;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 960px){
  .acabados-gallery{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .acabados-gallery{ grid-template-columns: 1fr; }
}

/* tarjetas */
.acab-card{
  position:relative; overflow:hidden; border-radius:14px;
  background: #0f0f10;
  box-shadow: 0 10px 30px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.06);
  isolation:isolate;
}
.acab-card img{
  width:100%; height: min(40vh, 420px); object-fit: cover; display:block;
  transform: scale(1.01);
  transform: translate(0%, 0%) scale(1.01, 1.01) !important;
}
.acab-card figcaption{
  font-size:.9rem; line-height:1.35; padding:.85rem 1rem 1rem;
  color: #e9e6df;
  background: linear-gradient(to top, rgba(15,15,16,.8), rgba(15,15,16,0));
  position: absolute; inset: auto 0 0 0;
  backdrop-filter: blur(2px);
}
.acab-card .glow{
  position:absolute; inset:-30% -30% auto auto; width:60%; height:60%;
  background: radial-gradient(60% 60% at 50% 50%, rgba(215,191,120,.45), rgba(215,191,120,0));
  opacity:.0; transform: translate3d(0,10px,0); pointer-events:none;
}

/* ===== CORRELACIONES ===== */
.correl-wrap{ padding:3.5rem 0; }
.title-sm{ font-size: clamp(1.2rem, 1.1rem + .6vw, 1.6rem); margin:0 0 1rem; }
.correl-text{
  display:grid; gap:1.2rem; margin-bottom:2rem;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (max-width: 900px){ .correl-text{ grid-template-columns: 1fr; } }

.correl-item{
  border-radius:14px; padding:1.1rem 1.2rem;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.correl-item h4{ margin:0 0 .35rem; font-size:1.05rem;}
.correl-item .refs{ opacity:.7; font-size:.9rem; margin:.4rem 0 0; }

/* tableros */
.correl-grids{
  display:grid; gap:1rem;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 1100px){ .correl-grids{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 700px){ .correl-grids{ grid-template-columns: 1fr; } }

.c-board{
  border-radius:16px; overflow:hidden;
  background: rgba(18,18,20,.6);
  box-shadow: 0 10px 30px rgba(0,0,0,.2), inset 0 0 0 1px rgba(255,255,255,.06);
}
.c-head{
  display:grid; grid-template-columns:2fr 1fr; gap:.75rem;
  background: linear-gradient(90deg, rgba(215,191,120,.18), rgba(255,255,255,0));
  padding:.85rem 1rem; font-weight:700; letter-spacing:.02em;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.c-head.single{ grid-template-columns:1fr; }
.c-list{ list-style: disc; margin: .8rem 1.25rem 1rem 1.6rem; }
.c-list li{ margin:.35rem 0; }

/* accesibilidad ligera en hover/focus */
.acab-card:focus-within, .acab-card:hover { outline: none; }
.acab-card:hover img{ transform: scale(1.06); transition: transform .6s ease; }
.acab-card:hover .glow{ opacity:.9; transition: opacity .6s ease; }

/* pequeñas utilidades */
#acabados .bi{ color:#D7BF78; }

/* ===== Testimonios estilo "tarjeta centrada" (corregido) ===== */

.t2__head{ text-align:center; }
.t2__kicker{ margin: 6px 0 18px; font-weight: 800; }
.t2__kicker-accent{ color: #b11226; }

/* Bloque carrusel */
.t2{
  position: relative;
  padding: 0 !important;
}

/* Viewport centrado */
.t2__viewport{
  width: 100%;
  overflow: hidden;
  outline: none;
  display: flex;
  justify-content: center; /* centra el carrusel dentro del contenedor */
}

/* Track sin gap/padding para evitar corrimientos */
.t2__track{
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  gap: 0 !important;
  will-change: transform;
  transform: translate3d(0,0,0);
}

/* Cada slide ocupa exactamente el ancho del viewport */
.t2__slide{
  flex: 0 0 100%;
  min-width: 100%;
  padding: 0 !important;
  box-sizing: border-box;
  display: flex;
  justify-content: center; /* centra la tarjeta */
}

/* Tarjeta */
.t2__card{
  width: min(860px, 100%);
  margin: 0 auto;
  background: rgba(12,17,28,.96);
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(0,0,0,.18);
  padding: 42px 26px 28px;
  text-align: center;
}

/* Estrellas */
.t2__stars{
  color: #d4af37;
  letter-spacing: 4px;
  font-size: 20px;
  margin-bottom: 16px;
}

/* Texto + comillas */
.t2__quote{
  position: relative;
  margin: 0 auto 22px;
  max-width: 720px;
  line-height: 1.75;
  font-weight: 700;
  color: #fff;
}

.t2__q{
  position: absolute;
  font-size: 46px;
  line-height: 1;
  opacity: .25;
  color: #d4af37;
}
.t2__q--l{ left: -8px; top: -20px; }
.t2__q--r{ right: -8px; bottom: -26px; }

/* Avatar */
.t2__avatar{
  width: 84px; height: 84px;
  border-radius: 999px;
  margin: 10px auto 12px;
  background: radial-gradient(circle at 30% 30%, rgba(0,0,0,.08), rgba(0,0,0,.22));
  display: grid;
  place-items: center;
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}
.t2__initials{
  width: 70px; height: 70px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.92);
  font-weight: 900;
  color: #222;
  letter-spacing: .5px;
}

/* Nombre / rol */
.t2__name{
  margin: 0;
  font-weight: 900;
  color: #fff;
  font-size: 18px;
}
.t2__role{
  margin: 8px 0 0;
  font-weight: 800;
  color: #d4af37;
}

/* Controles */
.t2__controls{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 16px;
}

.t2__btn{
  width: 44px; height: 44px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(10,15,26,.96);
  box-shadow: 0 16px 40px rgba(0,0,0,.16);
  font-size: 24px;
  line-height: 44px;
  color: #d4af37;
}
.t2__btn:disabled{ opacity: .45; cursor: not-allowed; }

.t2__dots{
  display: flex;
  gap: 10px;
  align-items: center;
}
.t2__dot{
  width: 10px; height: 10px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(0,0,0,.12);
}
.t2__dot[aria-selected="true"]{
  width: 26px;
  background: #d4af37;
}

/* ===== Responsive (solo ajustes necesarios) ===== */
@media (max-width: 980px){
  .t2__card{ width: min(720px, 100%); padding: 36px 20px 24px; }
  .t2__quote{ font-size: 15px; }
  .t2__name{ font-size: 17px; }
  .t2__btn{ width: 42px; height: 42px; font-size: 22px; line-height: 42px; }
}

@media (max-width: 720px){
  .t2__q--l, .t2__q--r{ display:none; }
  .t2__card{ width: 100%; padding: 28px 16px 20px; border-radius: 16px; }
  .t2__stars{ font-size: 18px; letter-spacing: 3px; margin-bottom: 12px; }
  .t2__quote{ max-width: 100%; font-size: 14.5px; line-height: 1.65; }
  .t2__avatar{ width: 72px; height: 72px; }
  .t2__initials{ width: 60px; height: 60px; }
  .t2__controls{ gap: 12px; margin-top: 12px; }
  .t2__dot[aria-selected="true"]{ width: 22px; }
}

@media (max-width: 420px){
  .t2__card{ padding: 24px 14px 18px; }
  .t2__quote{ font-size: 14px; }
  .t2__name{ font-size: 16px; }
  .t2__role{ font-size: 13px; }
  .t2__btn{ width: 40px; height: 40px; font-size: 21px; line-height: 40px; }
  .t2__controls{ gap: 10px; }
}

/* =========================
   GALERÍA (multi-card 4/3/2/1)
========================= */
.g2{
  position: relative;
  padding: 0 !important;
  --gap: 16px;
  --per-view: 4;
}
@media (max-width: 1200px){ .g2{ --per-view: 3; } }
@media (max-width: 980px){  .g2{ --per-view: 2; } }
@media (max-width: 720px){  .g2{ --per-view: 1; --gap: 12px; } }

.g2__viewport{
  width: 100%;
  overflow: hidden;
  outline: none;
  display: flex;
  justify-content: center;
}

.g2__track{
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  gap: var(--gap);
  will-change: transform;
}

.g2__slide{
  flex: 0 0 calc((100% - (var(--gap) * (var(--per-view) - 1))) / var(--per-view));
  min-width: calc((100% - (var(--gap) * (var(--per-view) - 1))) / var(--per-view));
  padding: 0 !important;
  box-sizing: border-box;
  display: flex;
}

.g2__card{
  width: 100%;
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 45px rgba(0,0,0,.20);
}
@media (max-width: 720px){ .g2__card{ border-radius: 16px; } }

.g2__imgBtn{
  width: 100%;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  display: block;
}

.g2__img{
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* Controles */
.g2__controls{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 16px;
}
.g2__btn{
  width: 44px; height: 44px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(9,14,26,.96);
  box-shadow: 0 16px 40px rgba(0,0,0,.16);
  font-size: 24px;
  line-height: 44px;
  color: #d4af37;
}
.g2__btn:disabled{ opacity: .45; cursor: not-allowed; }
@media (max-width: 980px){ .g2__btn{ width: 42px; height: 42px; font-size: 22px; line-height: 42px; } }
@media (max-width: 420px){ .g2__btn{ width: 40px; height: 40px; font-size: 21px; line-height: 40px; } }

.g2__dots{
  display: flex;
  gap: 10px;
  align-items: center;
}
.g2__dot{
  width: 10px; height: 10px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(255,255,255,.25);
}
.g2__dot[aria-selected="true"]{
  width: 26px;
  background: #d4af37;
}
@media (max-width: 720px){
  .g2__controls{ gap: 12px; margin-top: 12px; }
  .g2__dot[aria-selected="true"]{ width: 22px; }
}

/* =========================
   LIGHTBOX (rápido + completo)
========================= */
.g2__lightbox[hidden]{ display: none !important; }

.g2__lightbox{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 16px;
}

.g2__lbBackdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(5px);
}

.g2__lbPanel{
  position: relative;
  width: min(1100px, 100%);
  max-height: calc(100dvh - 32px);
  display: flex;
  flex-direction: column;
  background: rgba(12,16,26,.92);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(0,0,0,.55);
  overflow: hidden;
}

.g2__lbMedia{
  flex: 1;
  min-height: 0;
  display: grid;
  place-items: center;
  background: rgba(0,0,0,.35);
}

.g2__lbImg{
  width: 100%;
  height: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

.g2__lbClose{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(255,255,255,.92);
  color: #111;
  font-size: 18px;
  line-height: 42px;
  z-index: 2;
}

body.g2--lock{ overflow: hidden; }

@media (max-width: 720px){
  .g2__lightbox{ padding: 10px; }
  .g2__lbPanel{ border-radius: 16px; max-height: calc(100dvh - 20px); }
  .g2__lbClose{ width: 40px; height: 40px; line-height: 40px; }
}

/* ===== FIX TESTIMONIOS EN MÓVIL (alineación) ===== */
@media (max-width: 720px){

  /* asegúrate que el viewport y el slide centren el card */
  .t2__viewport{
    display: flex;
    justify-content: center;
    align-items: stretch;
  }

  .t2__track{
    gap: 0 !important;
  }

  .t2__slide{
    min-width: 100%;
    flex: 0 0 100%;
    padding: 0 !important;
    display: flex;
    justify-content: center;
    align-items: stretch; /* evita que el card “flote” */
  }

  /* el card toma todo el ancho y ordena el contenido verticalmente */
  .t2__card{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 26px 16px 22px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 420px; /* clave: misma altura para evitar saltos/desalineo */
  }

  /* tipografías y espacios consistentes */
  .t2__stars{ margin-bottom: 12px !important; }
  .t2__quote{
    max-width: 100% !important;
    margin: 0 0 18px 0 !important;
    line-height: 1.65 !important;
  }

  .t2__avatar{ margin: 8px auto 12px !important; }
  .t2__name{ margin-top: 0 !important; }
  .t2__role{ margin-top: 6px !important; }

  /* controles centrados */
  .t2__controls{
    width: 100%;
    justify-content: center;
    gap: 12px;
  }
}

/* FAQ */
 :root{
    --bg0:#070a12;
    --bg1:#0b1223;
    --card:#0b1020cc;
    --text:#e9eefc;
    --muted:#b9c3dd;
    --gold:#d9bf74;
    --stroke2: rgba(217,191,116,.25);
    --shadow: 0 24px 60px rgba(0,0,0,.55);
    --radius: 18px;
  }

  /* Responsive por defecto: usa clamp(), grid flexible y padding dinámico */
  .faq-qr{
    position: relative;
    padding: clamp(36px, 6vw, 70px) clamp(14px, 3.2vw, 22px);
    color: var(--text);
    background:
      radial-gradient(1200px 650px at 25% 10%, rgba(217,191,116,.10), transparent 55%),
      radial-gradient(900px 520px at 80% 30%, rgba(217,191,116,.08), transparent 60%),
      linear-gradient(180deg, var(--bg0), var(#0b122326));
    overflow: hidden;
    isolation: isolate;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  }

  /* Estrellas escalables */
  .faq-qr::before{
    content:"";
    position:absolute; inset:-40px;
    background:
      radial-gradient(circle at 12% 18%, rgba(217,191,116,.85) 0 1px, transparent 2px),
      radial-gradient(circle at 42% 28%, rgba(217,191,116,.65) 0 1px, transparent 2px),
      radial-gradient(circle at 72% 22%, rgba(217,191,116,.70) 0 1px, transparent 2px),
      radial-gradient(circle at 88% 54%, rgba(217,191,116,.55) 0 1px, transparent 2px),
      radial-gradient(circle at 18% 66%, rgba(217,191,116,.60) 0 1px, transparent 2px),
      radial-gradient(circle at 56% 72%, rgba(217,191,116,.50) 0 1px, transparent 2px),
      radial-gradient(circle at 78% 78%, rgba(217,191,116,.75) 0 1px, transparent 2px);
    opacity:.75;
    filter: blur(.2px);
    z-index:-2;
  }
  .faq-qr::after{
    content:"";
    position:absolute; inset:0;
    background: radial-gradient(900px 420px at 50% 0%, rgba(0,0,0,.15), transparent 60%);
    z-index:-1;
  }

  /* Contenedor: se adapta con max-width + padding natural */
  .faq-qr__inner{
    width: min(100%, 980px);
    margin-inline: auto;
  }

  .faq-qr__title{
    font-size: clamp(26px, 4vw, 44px);
    margin: 0 0 10px 0;
    font-weight: 800;
    text-wrap: balance;
  }
  .faq-qr__subtitle{
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
    font-size: clamp(14px, 1.7vw, 15px);
    max-width: 72ch;
  }

  .faq-qr__card{
    margin-top: clamp(14px, 2.6vw, 24px);
    border-radius: clamp(14px, 2.2vw, var(--radius));
    background: var(--card);
    border: 1px solid var(--stroke2);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden;
  }

  /* Borde dorado responsive (corrige el warning: mask estándar + webkit) */
  .faq-qr__card::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(90deg, transparent, rgba(217,191,116,.55), transparent);
    opacity:.9;
    pointer-events:none;

    -webkit-mask:
      linear-gradient(#000 0 0) content-box,
      linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;

    mask:
      linear-gradient(#000 0 0) content-box,
      linear-gradient(#000 0 0);
    mask-composite: exclude;
  }

  .faq-qr__faq{
    padding: clamp(12px, 2.4vw, 18px);
    display: grid;
    gap: clamp(10px, 1.7vw, 12px);
  }

  .faq-item{
    border: 1px solid rgba(217,191,116,.18);
    border-radius: clamp(12px, 2vw, 14px);
    background: rgba(10,14,28,.55);
    overflow: hidden;
  }
  .faq-item.is-open{ border-color: rgba(217,191,116,.35); }

  /* Botón: tipografía y padding adaptables */
  .faq-item__trigger{
    width: 100%;
    cursor: pointer;
    padding: clamp(12px, 2vw, 14px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(10px, 2vw, 12px);
    user-select: none;
    background: transparent;
    border: 0;
    color: var(--text);
    text-align: left;
  }

  .faq-item__trigger span{
    font-weight: 700;
    line-height: 1.35;
    font-size: clamp(14px, 1.9vw, 15px);
  }

  /* Icono: escala con clamp() */
  .faq-item__icon{
    width: clamp(26px, 3.5vw, 28px);
    height: clamp(26px, 3.5vw, 28px);
    border-radius: 999px;
    border: 1px solid rgba(217,191,116,.35);
    position: relative;
    flex: 0 0 auto;
    box-shadow: 0 10px 22px rgba(0,0,0,.25);
    background: rgba(0,0,0,.18);
  }
  .faq-item__icon::before,
  .faq-item__icon::after{
    content:"";
    position:absolute;
    left: 50%; top: 50%;
    width: clamp(10px, 1.6vw, 12px);
    height: 2px;
    background: var(--gold);
    transform: translate(-50%,-50%);
    border-radius: 2px;
  }
  .faq-item__icon::after{
    width: 2px;
    height: clamp(10px, 1.6vw, 12px);
    opacity: var(--vbar, 1);
    transition: opacity .2s ease;
  }

  .faq-item__panel{ overflow: hidden; }
  .faq-item__content{
    padding: 0 clamp(12px, 2vw, 14px) clamp(12px, 2vw, 14px);
    color: var(--muted);
    line-height: 1.65;
    font-size: clamp(13px, 1.8vw, 14px);
  }

  .mini-title{
    margin: 14px 0 8px;
    font-weight: 800;
    color: var(--text);
    font-size: clamp(12px, 1.7vw, 13px);
    letter-spacing: .3px;
  }

  .gold-list{
    margin: 0;
    padding-left: 18px;
  }
  .gold-list li{ margin: 6px 0; }
  .gold-list li::marker{ color: var(--gold); }

  /* Mejora móvil: reduce brillos y sombras para performance */
  @media (max-width: 420px){
    .faq-qr__card{ box-shadow: 0 18px 46px rgba(0,0,0,.5); }
    .faq-qr::before{ opacity: .6; }
  }