/* GENERADO por tools/port-concept-css.py desde concept/assets/style.css — no editar a mano. */
/* Fuentes del propio tema (sin pedirlas a Google: más rápido y sin enviar la IP del visitante). */
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/poppins-500.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/poppins-600.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/poppins-700.woff2) format('woff2');}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/poppins-800.woff2) format('woff2');}
@font-face{font-family:'Mulish';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/mulish-variable.woff2) format('woff2');}
/* ============================================================
   GMMSR — hoja de estilos compartida para páginas internas del
   concepto estático. Extraída de concept/index.html (Home) para no
   duplicar ~700 líneas de CSS por página — mismos tokens, tipografía
   y componentes de "chrome" (topbar, header, footer, tabbar).
   No se tocó concept/index.html: el cliente lo está revisando tal
   cual está publicado.
   ============================================================ */
:root{
  --bg:            #F3F5FB;
  --bg-panel:      #FFFFFF;
  --bg-panel-alt:  #EAF7E6;
  --ink:           #0A1A3D;
  --ink-soft:      #4C577A;
  --ink-faint:     #626E93;
  --border:        #D9DFEF;
  --blue:          #124DB0;
  --blue-deep:     #071A3D;
  --blue-mid:      #0B2E80;
  --gold:          #FCE400;
  --gold-deep:     #866C08;
  --gold-ink:      #4A3B00;
  --green:         #1F7A45;
  --green-deep:    #134929;
  --shadow: 0 1px 2px rgba(7,26,61,.06), 0 12px 32px -16px rgba(7,26,61,.18);
  --shadow-lg: 0 24px 64px -24px rgba(7,26,61,.35);
  --radius-panel: 22px;
  --radius-card: 16px;
  --radius-chip: 999px;
  --maxw: 1440px;
  --accent-ink: var(--blue);
}
*{ box-sizing:border-box; }
html{ color-scheme: light; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Mulish', system-ui, -apple-system, sans-serif;
  font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3,h4{
  font-family:'Poppins', system-ui, sans-serif;
  font-weight:600; line-height:1.15; margin:0; text-wrap:balance; color:var(--ink);
}
p{ margin:0; }
.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(20px,4vw,64px); }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Poppins', system-ui, sans-serif;
  font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-ink);
}
.eyebrow svg{ width:15px; height:15px; }
section{ padding-block:96px; }
@media (max-width:900px){ section{ padding-block:72px; } }
@media (max-width:720px){ section{ padding-block:56px; } }
@media (max-width:640px){ section{ padding-block:40px; } }
.section-head h2{ font-size:clamp(1.7rem,1.2rem + 1.6vw,2.5rem); margin-top:12px; }
@media (max-width:640px){ .section-head h2{ font-size:1.4rem; } }
.body-copy{ margin-top:18px; color:var(--ink-soft); font-size:1rem; max-width:58ch; }
.btn{
  display:inline-flex; align-items:center; gap:9px;
  font-family:'Poppins',sans-serif; font-weight:700; font-size:.9rem; letter-spacing:.02em;
  padding:15px 28px; border-radius:var(--radius-chip); text-decoration:none;
  border:1.5px solid transparent; cursor:pointer; transition:transform .15s ease, box-shadow .15s ease;
}
.btn:hover{ transform:translateY(-1px); }
.btn:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.btn svg{ width:16px; height:16px; }
@media (max-width:900px){ .btn{ padding:13px 24px; font-size:.85rem; } }
@media (max-width:640px){ .btn{ padding:11px 20px; font-size:.8rem; gap:7px; } .btn svg{ width:14px; height:14px; } }
.btn--gold{ background:var(--gold); color:var(--gold-ink); box-shadow:var(--shadow); }
.btn--line-light{ background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.btn--line-light:hover{ border-color:#fff; }
.btn--outline{ background:transparent; color:var(--blue); border-color:var(--blue); }
.inline-link{ display:inline-flex; align-items:center; gap:6px; font-weight:700; color:var(--accent-ink); text-decoration:none; }
.inline-link svg{ width:15px; height:15px; transition:transform .15s ease; }
.inline-link:hover svg{ transform:translateX(3px); }