@font-face{font-family:"HelveticaNeue";src:url("/fuentes/helvetica-neue-light.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"HelveticaNeue";src:url("/fuentes/helvetica-neue-bold.woff2") format("woff2");font-weight:700;font-display:swap}
:root{--blanco:#f0f0f0;--negro:#1d1d1f;--tarjeta:#e7e7e7;--gris:#6e6e73;--linea:#cfcfd1}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--blanco);color:var(--negro);font:300 17px/1.5 "HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
b,h1,h2{font-weight:700}
a{color:inherit;text-underline-offset:.2em}
img{max-width:100%;display:block}
.wm{height:18px;width:auto}
.top{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;font-size:14px;color:var(--gris)}
.wrap{max-width:820px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:15px;color:var(--gris);margin-top:9vh}
h1{font-size:clamp(40px,7vw,72px);line-height:1;letter-spacing:-.035em;margin:18px 0 26px;max-width:14ch}
.lead{font-size:clamp(18px,2.2vw,22px);line-height:1.4;max-width:34em}
.datos{list-style:none;display:flex;flex-wrap:wrap;gap:12px 40px;margin:40px 0 0;padding-top:20px;border-top:1px solid var(--linea);font-size:14px;color:var(--gris)}
.datos b{display:block;font-size:26px;letter-spacing:-.02em;color:var(--negro)}
.bloque{margin-top:80px}
.cab{display:grid;grid-template-columns:48px 1fr auto;align-items:baseline;gap:8px;padding-bottom:14px;border-bottom:1.5px solid var(--negro)}
.cab span{font-size:15px;color:var(--gris)}
.cab h2{font-size:clamp(28px,4vw,40px);letter-spacing:-.03em;line-height:1}
.cab p{font-size:14px;color:var(--gris)}
.pasos{list-style:none;counter-reset:p}
.pasos>li{counter-increment:p;display:grid;grid-template-columns:48px 1fr;gap:8px;padding:24px 0;border-bottom:1px solid var(--linea)}
.pasos>li::before{content:counter(p,decimal-leading-zero);font-size:15px;color:var(--gris);padding-top:2px}
.pasos p+p{margin-top:10px}
.pasos img{width:min(100%,320px);border-radius:14px;margin-top:16px;box-shadow:0 0 0 1px var(--linea)}
.ruta{display:flex;flex-wrap:wrap;gap:6px;font-size:14px}
.ruta span{background:var(--tarjeta);border-radius:999px;padding:4px 12px}
.ruta span+span::before{content:"→ ";color:var(--gris)}
code{font:400 15px ui-monospace,Menlo,monospace;background:var(--tarjeta);padding:2px 7px;border-radius:6px}
.lista{list-style:none}
.lista li{padding:16px 0 16px 48px;border-bottom:1px solid var(--linea);position:relative}
.lista li::before{content:"✓";position:absolute;left:0;font-weight:700}
.pie{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;max-width:820px;margin:120px auto 0;padding:24px;border-top:1px solid var(--linea);font-size:14px;color:var(--gris)}
.indice{list-style:none;margin-top:40px;border-top:1.5px solid var(--negro)}
.indice a{display:grid;grid-template-columns:48px 1fr auto;gap:8px;padding:22px 0;border-bottom:1px solid var(--linea);text-decoration:none;font-size:clamp(22px,3vw,30px);font-weight:700;letter-spacing:-.02em}
.indice a span{font:300 15px/2 inherit;color:var(--gris)}
.indice a:hover{color:var(--gris)}
@media (max-width:560px){.cab{grid-template-columns:40px 1fr}.cab p{grid-column:2}.pasos>li,.cab{grid-template-columns:40px 1fr}.lista li{padding-left:40px}}
.copiar{display:inline-flex;align-items:center;gap:8px;border:0;background:none;padding:0;cursor:pointer;font:inherit;color:inherit;vertical-align:middle}
.copiar span{font-size:13px;background:var(--negro);color:var(--blanco);border-radius:999px;padding:3px 10px}
.copiar:hover span{background:var(--gris)}
.pasos img.ancho{width:100%;border-radius:10px}
.wrap{max-width:1120px}
.pie{max-width:1120px}
@media (min-width:900px){
  .pasos>li>div{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:48px;align-content:start}
  .pasos>li>div>*{grid-column:1}
  .pasos>li>div>img{grid-column:2;grid-row:1 / span 6;margin-top:0;align-self:start}
  .pasos>li>div>img:not(.ancho){width:min(100%,300px)}
}
