/* ===== Suárez Media · El Método Suárez 90 · /sistema/ · v1 · 21-oct-2026 =====
   Página estática sin JavaScript. Clases sms- colgadas de #sms para no chocar con nada del sitio.
   Barlow Condensed y Archivo servidas desde sistema/assets/fonts (licencia OFL), solo para esta página. */
@font-face{font-family:"SM Barlow Condensed";src:url("fonts/barlow-condensed-800-latin.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:"SM Barlow Condensed";src:url("fonts/barlow-condensed-600-latin.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"SM Archivo";src:url("fonts/archivo-latin-var.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}

.sms-body{margin:0;background:#0b0b0c}
#sms{
  --ink:#0b0b0c;--c1:#141414;--borde:#2a2a2a;--borde2:#3d3d3d;
  --amber:#FFD400;--amber-fondo:#17150a;
  --t:#ffffff;--t2:#e8e5de;--gris:#b8b4ab;--gris2:#8a867e;
  --display:"SM Barlow Condensed","Barlow Condensed","Arial Narrow",sans-serif;
  --texto:"SM Archivo","Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--ink);color:var(--t);font-family:var(--texto);font-size:16px;line-height:1.55;
  -webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased
}
#sms *,#sms *:before,#sms *:after{box-sizing:border-box}
#sms ::selection{background:var(--amber);color:var(--ink)}
:where(#sms) a{color:inherit}
#sms :focus-visible{outline:2px solid var(--amber);outline-offset:2px}
#sms em{font-style:normal;color:var(--amber)}
.sms-w{max-width:1080px;margin:0 auto;padding:0 16px}
@media(min-width:600px){.sms-w{padding:0 28px}}

/* ---- nav ---- */
.sms-nav{position:sticky;top:0;z-index:40;background:rgba(11,11,12,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--borde)}
.sms-nav .sms-w{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:62px}
.sms-logo{display:inline-flex;align-items:center;min-height:44px;font-family:var(--display);font-weight:800;font-size:26px;letter-spacing:1px;text-transform:uppercase;text-decoration:none;color:var(--t);white-space:nowrap}
.sms-logo span{margin-left:.25em;color:var(--amber)}
.sms-nav-link{display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)!important;text-decoration:none}
.sms-nav-link:hover{color:var(--t)!important}

/* ---- cabeza ---- */
.sms-cabeza{padding:46px 0 36px}
.sms-kicker{display:block;font-size:12.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--gris)}
.sms-h1{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(58px,14vw,126px);line-height:.9;letter-spacing:1px;margin:12px 0 24px}
.sms-h1-caja{display:inline-block;background:var(--amber);color:var(--ink);padding:0 .14em .04em;margin-top:.06em}
@media(max-width:599px){.sms-h1-caja{display:table}}
.sms-lede{font-size:clamp(18px,2.4vw,22px);line-height:1.5;max-width:30em;margin:0;color:var(--t2)}

/* ---- cinta ---- */
.sms-cinta{background:var(--amber);color:var(--ink);font-family:var(--display);font-weight:800;font-size:19px;letter-spacing:2px;text-transform:uppercase;padding:10px 0;white-space:nowrap;overflow:hidden}
.sms-cinta span{display:block;padding-left:16px}

/* ---- secciones ---- */
.sms-sec{padding:54px 0 10px}
.sms-sec-fin{padding-bottom:64px}
.sms-h2{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:clamp(38px,6.4vw,62px);line-height:.95;margin:0 0 18px;color:var(--t)}
.sms-h2 em{color:var(--amber)}
.sms-p{max-width:38em;margin:0 0 16px;font-size:16.5px;color:var(--t2)}
.sms-p b{color:var(--t)}

/* ---- dolor ---- */
.sms-dolor{padding:56px 0 18px}
.sms-dolor-display{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:clamp(34px,7vw,72px);line-height:.95;margin:0 0 22px;max-width:14em}
.sms-dolor-display em{color:var(--amber)}

/* ---- filas de las dos horas ---- */
.sms-filas{list-style:none;margin:26px 0 0;padding:0}
.sms-fila{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;align-items:start;border-top:1px solid var(--borde);padding:22px 0}
.sms-fila:last-child{border-bottom:1px solid var(--borde)}
.sms-fila-num{font-family:var(--display);font-weight:800;font-size:clamp(40px,8vw,64px);line-height:.85;color:var(--amber)}
.sms-fila-txt b{display:block;font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.5px;font-size:clamp(22px,3.2vw,28px);line-height:1;margin-bottom:8px}
.sms-fila-txt p{margin:0;max-width:36em;font-size:15.5px;line-height:1.5;color:var(--gris)}
@media(min-width:600px){.sms-fila{grid-template-columns:96px minmax(0,1fr);gap:22px}}

/* ---- bloque regla ---- */
.sms-regla{margin:34px 0 8px;background:var(--amber);color:var(--ink);padding:26px 20px 28px}
@media(min-width:600px){.sms-regla{padding:32px 30px 34px}}
.sms-regla b{display:block;font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:clamp(28px,4.6vw,42px);line-height:.95;margin-bottom:12px}
.sms-regla p{margin:0;max-width:36em;font-size:16.5px;font-weight:600;line-height:1.5}

/* ---- lista día 90 ---- */
.sms-lista{list-style:none;margin:24px 0 0;padding:0;max-width:40em}
.sms-lista li{position:relative;padding:0 0 14px 34px;font-size:16.5px;line-height:1.5;color:var(--t2)}
.sms-lista li:before{content:"";position:absolute;left:0;top:7px;width:14px;height:14px;background:var(--amber)}
.sms-lista li b{color:var(--t)}
.sms-honesta{margin:18px 0 0;max-width:38em;padding:16px 18px;background:var(--c1);border-left:4px solid var(--amber);font-size:16.5px;color:var(--t2)}

/* ---- precio ---- */
.sms-precio-bloque{margin-top:10px;border-top:1px solid var(--borde);border-bottom:1px solid var(--borde);padding:30px 0 34px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px 40px}
@media(min-width:760px){.sms-precio-bloque{grid-template-columns:auto minmax(0,1fr);align-items:center}}
.sms-precio{font-family:var(--display);font-weight:800;font-size:clamp(96px,20vw,180px);line-height:.85;color:var(--amber);white-space:nowrap}
.sms-precio-nota{max-width:26em;font-size:16.5px;color:var(--t2)}
.sms-precio-nota b{display:block;font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.5px;font-size:clamp(20px,3vw,26px);color:var(--t);margin-bottom:8px}

/* ---- cta ---- */
.sms-cta{margin:56px 0 0;background:var(--c1);border:1px solid var(--borde);padding:36px 20px 40px;text-align:left}
@media(min-width:600px){.sms-cta{padding:44px 36px 48px}}
.sms-cta .sms-h2{margin-bottom:10px}
.sms-cta p{margin:0 0 24px;max-width:34em;font-size:16.5px;color:var(--t2)}
.sms-btn{display:inline-block;background:var(--amber);color:var(--ink);font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:clamp(22px,3.6vw,30px);line-height:1;text-decoration:none;padding:18px 26px 19px}
.sms-btn:hover{background:#E6BF00}
.sms-cta small{display:block;margin-top:14px;font-size:13.5px;letter-spacing:.06em;color:var(--gris2)}

/* ---- pie ---- */
.sms-pie{margin-top:70px;border-top:1px solid var(--borde);padding:30px 0 46px;color:var(--gris)}
.sms-pie p{margin:0 0 6px;max-width:44em;font-size:14.5px;line-height:1.55}
.sms-pie b{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:1px;font-size:18px;color:var(--t)}
.sms-pie a{color:var(--amber);text-decoration:none}
.sms-pie a:hover{text-decoration:underline;text-underline-offset:3px}
