body[data-page="introduccion"] .page-width{max-width:1120px}
.intro-hero{padding:24px 0 48px;background:var(--paper);border-bottom:1px solid var(--line)}
.intro-hero-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start;gap:48px}
.intro-welcome .eyebrow{font-size:12px;line-height:1.65;letter-spacing:1.2px}
.intro-welcome h1{font-size:40px;line-height:1.2;font-weight:700;letter-spacing:-.03em;margin:16px 0 24px}
.intro-lead,.intro-description{font-size:18px;line-height:1.65;color:var(--muted);max-width:680px}
.intro-description{margin-top:16px}
.intro-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.intro-actions .button{font-size:16px;border-radius:8px;padding-inline:16px}
.intro-scope{display:flex;align-items:flex-start;gap:12px;font-size:16px;line-height:1.65;color:var(--muted);margin-top:24px;max-width:680px}
.intro-scope .icon{color:var(--blue);margin-top:3px}
.intro-start{min-width:0;padding:24px;border:1px solid var(--line);border-top:3px solid var(--blue);border-radius:12px;background:white}
.intro-start-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--pale-blue);color:var(--blue);border-radius:12px;margin-bottom:20px}
.intro-start-icon .icon{width:24px;height:24px}
.intro-start h2{font-size:24px;line-height:1.35;font-weight:600;margin-bottom:12px}
.intro-start>p{font-size:17px;line-height:1.65;color:var(--muted)}
.intro-shortcuts{display:flex;flex-direction:column;margin-top:16px}
.intro-shortcuts>a{display:flex;align-items:flex-start;gap:12px;min-height:48px;padding-block:16px;text-decoration:none;border-top:1px solid var(--line);border-radius:4px}
.intro-shortcuts>a:hover{background:var(--paper)}
.intro-shortcuts>a>.icon{color:var(--blue);width:20px;height:20px;margin-top:3px}
.intro-shortcuts>a>.icon:last-child{width:18px;height:18px;margin-left:auto}
.intro-shortcuts strong{display:block;font-size:16px;line-height:1.5;font-weight:600;color:var(--blue);text-decoration:underline;text-underline-offset:4px}
.intro-shortcuts a>span>span{display:block;font-size:14px;line-height:1.65;color:var(--muted);margin-top:4px}
.intro-main{padding-block:48px 64px}
.intro-route-heading{margin-bottom:32px}
.intro-route-heading>.eyebrow{font-size:12px;line-height:1.65;letter-spacing:1.2px}
.intro-route-heading h2{font-size:24px;font-weight:600;line-height:1.35;margin:12px 0 16px}
.intro-route-heading>p{font-size:18px;line-height:1.65;color:var(--muted);max-width:720px}
.intro-route{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0}
.intro-step{display:flex;align-items:flex-start;gap:16px;min-width:0;padding:24px;border:1px solid var(--line);border-radius:12px;background:white;scroll-margin-top:120px}
.intro-step-number{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;border:1px solid #d7e6f0;border-radius:10px;background:var(--pale-blue);color:var(--blue);font-size:16px;font-weight:600}
.intro-step-content{display:flex;flex-direction:column;align-items:flex-start;min-width:0;align-self:stretch}
.intro-step h3{font-size:20px;line-height:1.4;font-weight:600;margin:6px 0 16px}
.intro-step p,.intro-step ul{font-size:18px;line-height:1.65;color:var(--muted)}
.intro-step p+p{margin-top:16px}
.intro-step ul{padding-left:20px;margin:12px 0 0}
.intro-step li+li{margin-top:8px}
.intro-step .intro-step-note{font-size:17px;color:var(--blue);padding-left:12px;border-left:2px solid var(--blue)}
.intro-step-link{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding-top:16px;font-size:16px;line-height:1.5;font-weight:600;margin-top:auto}
.intro-step-link .icon{width:18px;height:18px}
.intro-step:last-child{grid-column:1/-1;background:var(--paper)}
.intro-step:last-child p{max-width:720px}
.intro-closing{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:48px;padding:24px;background:var(--pale-blue);border:1px solid #d4e4ef;border-radius:12px}
.intro-closing h2{font-size:24px;line-height:1.35;font-weight:600;margin-bottom:12px}
.intro-closing p{max-width:680px;font-size:18px;line-height:1.65;color:var(--muted)}
.intro-closing .button{font-size:16px;border-radius:8px;flex-shrink:0}
@media(max-width:1023px){
 .intro-hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px}
 .intro-route{gap:16px}.intro-step{padding:20px;gap:12px}
 .intro-closing{flex-direction:column;align-items:flex-start}
}
@media(max-width:767px){
 .intro-hero{padding-block:20px 32px}.intro-hero-grid{grid-template-columns:1fr;gap:24px}
 .intro-welcome h1{font-size:30px;line-height:1.2}
 .intro-lead,.intro-description,.intro-route-heading>p,.intro-step p,.intro-step ul,.intro-closing p{font-size:17px}
 .intro-actions{flex-direction:column}.intro-actions .button{width:100%;font-size:16px}
 .intro-start{padding:20px}.intro-start h2,.intro-route-heading h2,.intro-closing h2{font-size:22px}
 .intro-main{padding-block:32px 40px}.intro-route{grid-template-columns:1fr;gap:16px}
 .intro-route-heading{margin-bottom:24px}.intro-step{scroll-margin-top:110px}
 .intro-step h3{font-size:18px;margin-top:8px}.intro-step-number{width:36px;height:36px;font-size:14px}
 .intro-closing{padding:20px;margin-top:32px}.intro-closing .button{width:100%;font-size:16px;text-align:center}
}
@media(max-width:374px){.intro-step{flex-direction:column}.intro-step h3{margin-top:0}}
@media print{
 .intro-hero{background:white}.intro-hero-grid,.intro-route{grid-template-columns:1fr}
 .intro-actions,.intro-shortcuts,.intro-step-link,.intro-closing .button{display:none}
 .intro-step,.intro-closing{break-inside:avoid}.intro-main{padding-block:24px}
}
