/* Estilos exclusivos del servicio mensual; sin recursos ni dependencias externas. */
.web-maintenance-page { min-width: 0; }
.mw-hero { position: relative; padding: 28px 0 0; overflow: hidden; color: #e4edff; background: radial-gradient(ellipse at 85% 20%, #143e82 0, transparent 52%), #041737; }
.mw-hero .breadcrumbs { margin-bottom: 42px; color: #bfd5ff; }
.mw-hero .breadcrumbs a, .mw-hero .breadcrumbs span { color: #c8d9f7; }
.mw-hero__grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(32px, 5vw, 70px); align-items: center; padding-bottom: 56px; }
.mw-hero__grid > *, .mw-packs > *, .mw-fit > * { min-width: 0; }
.mw-eyebrow { display: inline-block; color: #ffad29; font-size: .79rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.mw-hero h1 { margin: 20px 0 24px; color: #fff; font-size: clamp(2.35rem, 4vw, 3.8rem); line-height: 1.08; letter-spacing: -.045em; }
.mw-hero h1 span { color: #ffad29; }
.mw-lead { max-width: 38rem; font-size: 1.08rem; line-height: 1.8; }
.mw-starting-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px; margin: 22px 0 0; color: #dbe8ff; font-size: 1rem; }
.mw-starting-price strong { color: #fff; font-size: 2.05rem; font-weight: 800; letter-spacing: -.045em; }
.mw-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; margin: 28px 0 18px; }
.mw-actions .button { white-space: normal; text-align: center; }
.mw-secondary { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 650; }
.mw-secondary:hover { color: #ffad29; }
.mw-hero__note { max-width: 34rem; font-size: .85rem; color: #b7cae9; }
.mw-plan { color: #0a1f43; background: #fff; border: 1px solid #fff; border-radius: 24px; padding: 26px; box-shadow: 0 24px 80px #0004; transform: rotate(1deg); }
.mw-plan__heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 22px; border-bottom: 1px solid #e2e9f2; font-size: .92rem; font-weight: 750; }
.mw-plan__badge { padding: 5px 10px; color: #0752d6; background: #e8f1ff; border-radius: 100px; font-size: .75rem; }
.mw-plan__row { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; align-items: start; padding: 23px 0; border-bottom: 1px solid #e2e9f2; }
.mw-plan__icon, .mw-card__icon { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; color: #0752d6; background: #e8f1ff; }
.mw-plan__icon--orange { color: #9b5800; background: #fff1da; }
.mw-plan__icon--green { color: #096b49; background: #e8f8f1; }
.mw-plan__row small { display: block; color: #53627a; font-size: .71rem; letter-spacing: .08em; text-transform: uppercase; }
.mw-plan__row strong { display: block; margin: 4px 0; font-size: 1.13rem; line-height: 1.35; }
.mw-plan__row p { margin: 0; font-size: .85rem; color: #53627a; line-height: 1.5; }
.mw-plan__footer { display: flex; align-items: center; gap: 10px; padding-top: 20px; font-size: .8rem; color: #53627a; }
.mw-plan__footer .icon { flex: 0 0 20px; color: #0752d6; }
.mw-pillars { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 24px; margin: 0; padding: 23px 0; list-style: none; border-top: 1px solid #ffffff26; font-size: .88rem; }
.mw-pillars li { display: flex; align-items: center; gap: 10px; }
.mw-pillars .icon { color: #ffad29; flex-shrink: 0; }
.mw-heading { max-width: 760px; margin: 0 auto 38px; text-align: center; }
.mw-heading h2, .mw-fit h2 { margin: 12px 0 18px; font-size: clamp(1.85rem, 3vw, 2.65rem); line-height: 1.15; letter-spacing: -.035em; }
.mw-heading p { margin: 0; }
.mw-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.mw-card { padding: 27px 23px; border: 1px solid #dfe7f2; border-radius: 20px; background: #fff; }
.mw-card h3 { margin: 20px 0 12px; color: #0a1f43; font-size: 1.17rem; }
.mw-card > p { font-size: .92rem; line-height: 1.7; }
.mw-card ul { margin: 20px 0 0; padding-left: 18px; color: #53627a; font-size: .86rem; }
.mw-card li { padding-left: 2px; margin: 10px 0; }
.mw-card li::marker { color: #0b63f6; }
.mw-card--summary { background: #f4f8ff; }
.mw-packs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; gap: 22px; }
.mw-pack { display: flex; flex-direction: column; padding: clamp(24px, 2.5vw, 34px); color: #53627a; background: #fff; border: 1px solid #d5e0ef; border-radius: 24px; box-shadow: 0 12px 35px #071f4b08; }
.mw-pack__caption { color: #0752d6; font-size: .76rem; font-weight: 750; line-height: 1.5; }
.mw-pack h3 { margin: 12px 0 0; color: #0a1f43; font-size: 1.5rem; line-height: 1.2; letter-spacing: -.025em; }
.mw-pack__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px; margin: 22px 0 18px; color: #53627a; font-size: .95rem; }
.mw-pack__price strong { color: #0a1f43; font-size: clamp(2.7rem, 3.4vw, 3.35rem); font-weight: 800; line-height: 1.1; letter-spacing: -.06em; white-space: nowrap; }
.mw-pack__price strong span { font-size: .62em; letter-spacing: -.03em; }
.mw-pack__price--custom strong { font-size: clamp(1.9rem, 2.6vw, 2.4rem); letter-spacing: -.035em; }
.mw-pack__hours { align-self: flex-start; margin: 0 0 18px; padding: 8px 12px; color: #0752d6; background: #edf4ff; border: 1px solid #cfdef6; border-radius: 10px; font-size: .92rem; font-weight: 750; line-height: 1.4; }
.mw-pack__description { margin: 0; font-size: .9rem; line-height: 1.75; }
.mw-pack ul { display: grid; gap: 15px; margin: 25px 0 28px; padding: 23px 0 0; border-top: 1px solid #e1e8f2; list-style: none; }
.mw-pack li { display: flex; align-items: start; gap: 10px; font-size: .87rem; line-height: 1.6; }
.mw-pack li .icon { flex: 0 0 19px; width: 19px; height: 19px; margin-top: 2px; color: #0752d6; }
.mw-pack .button { display: flex; justify-content: center; width: 100%; min-height: 52px; margin-top: auto; white-space: normal; text-align: center; font-size: .88rem; }
.mw-pack--featured { color: #dbe8ff; background: #071f4b; border-color: #071f4b; box-shadow: 0 18px 40px #071f4b20; }
.mw-pack--featured .mw-pack__caption, .mw-pack--featured li .icon { color: #ffad29; }
.mw-pack--featured h3, .mw-pack--featured .mw-pack__price strong { color: #fff; }
.mw-pack--featured .mw-pack__price { color: #bfd5ff; }
.mw-pack--featured .mw-pack__hours { color: #ffbd4a; background: #ffffff0d; border-color: #ffbd4a55; }
.mw-pack--featured ul { border-top-color: #ffffff24; }
.mw-pack--custom { background: #eef5ff; border-color: #b8cff1; }
.mw-packs__note { max-width: 920px; margin: 25px auto 0; color: #53627a; font-size: .82rem; line-height: 1.8; text-align: center; }
.mw-terms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; margin: 30px 0 0; }
.mw-terms > div { border-top: 1px solid #dfe7f2; padding: 20px 0 0; }
.mw-terms dt { color: #0a1f43; font-weight: 750; }
.mw-terms dd { margin: 5px 0 0; font-size: .92rem; }
.mw-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; list-style: none; margin: 0; padding: 0; counter-reset: none; }
.mw-steps li { border-top: 2px solid #bfd5ff; padding-top: 22px; }
.mw-steps li > span { color: #0752d6; font-weight: 800; font-size: 1.9rem; letter-spacing: -.05em; }
.mw-steps h3 { margin: 14px 0 10px; font-size: 1.1rem; }
.mw-steps p { font-size: .92rem; }
.mw-fit { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(32px, 6vw, 75px); align-items: center; }
.mw-platforms { display: flex; flex-wrap: wrap; gap: 9px; list-style: none; padding: 0; margin: 24px 0; }
.mw-platforms li { padding: 7px 12px; border: 1px solid #cbd8e9; border-radius: 7px; color: #0a1f43; background: #fff; font-size: .82rem; font-weight: 650; }
.mw-scope-note { padding: 30px; border: 1px solid #cbd8e9; border-radius: 20px; background: #fff; }
.mw-scope-note h3 { font-size: 1.15rem; margin: 0 0 16px; }
.mw-scope-note p { font-size: .92rem; }
.mw-scope-note .text-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 12px; font-size: .87rem; }
.web-maintenance-page .faq-toggle > svg { grid-area: 1 / 1; width: 1rem; height: 1rem; }
.web-maintenance-page :is(a, summary, button):focus-visible { outline: 3px solid #ff9d00; outline-offset: 5px; }
.web-maintenance-page :is(#que-incluye, #cuota-mensual, #solicitud-presupuesto, .mw-pack) { scroll-margin-top: 110px; }
@media (max-width: 1180px) {
    .mw-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mw-packs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mw-plan { padding: 22px; transform: none; }
    .mw-plan__row { gap: 12px; }
}
@media (max-width: 820px) {
    .mw-hero__grid, .mw-fit { grid-template-columns: minmax(0, 1fr); }
    .mw-hero__grid { gap: 36px; padding-bottom: 36px; }
    .mw-hero .breadcrumbs { margin-bottom: 30px; }
    .mw-hero h1 { max-width: 680px; font-size: clamp(2.3rem, 6.6vw, 3.5rem); }
    .mw-plan { max-width: 600px; width: 100%; }
    .mw-pillars { justify-content: flex-start; }
    .mw-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mw-packs { gap: 18px; }
    .mw-pack { padding: 30px; }
    .mw-pack__price strong { font-size: 3rem; }
    .mw-pack__price--custom strong { font-size: 2.2rem; }
}
@media (max-width: 640px) {
    .mw-packs { grid-template-columns: minmax(0, 1fr); max-width: 600px; margin: 0 auto; }
}
@media (max-width: 520px) {
    .mw-hero { padding-top: 20px; }
    .mw-hero .breadcrumbs { font-size: .72rem; }
    .mw-hero h1 { font-size: clamp(2rem, 8.5vw, 2.7rem); }
    .mw-eyebrow { font-size: .7rem; letter-spacing: .08em; }
    .mw-lead { font-size: 1rem; }
    .mw-actions { align-items: stretch; flex-direction: column; }
    .mw-secondary { align-self: flex-start; }
    .mw-pillars { flex-direction: column; font-size: .82rem; }
    .mw-plan { padding: 20px; border-radius: 18px; }
    .mw-plan__heading { align-items: start; font-size: .86rem; }
    .mw-plan__row strong { font-size: 1.02rem; }
    .mw-plan__row { grid-template-columns: 40px minmax(0, 1fr); }
    .mw-plan__icon { width: 40px; height: 40px; border-radius: 12px; }
    .mw-cards, .mw-steps, .mw-terms { grid-template-columns: minmax(0, 1fr); }
    .mw-pack { padding: 25px; }
    .mw-packs__note { text-align: left; }
    .mw-card { padding: 25px; }
    .mw-heading { text-align: left; }
    .mw-heading h2, .mw-fit h2 { font-size: 1.85rem; }
    .mw-scope-note { padding: 24px; }
}
