.maintenance-page { background:radial-gradient(circle at 85% 3%,rgba(21,201,255,.24),transparent 29rem),radial-gradient(circle at 6% 48%,rgba(8,121,219,.18),transparent 27rem),#071b3e; }
.maintenance-page::before { opacity:.42; }.app-header { background:rgba(4,15,37,.75); }.maintenance-hero { display:grid; grid-template-columns:1fr .9fr; align-items:center; gap:clamp(2.5rem,8vw,7rem); min-height:calc(100vh - 6rem); padding-block:clamp(4rem,8vw,7rem); }.maintenance-hero h1 { max-width:12ch; margin-bottom:1.25rem; }.maintenance-hero h1 span { color:#3bd6ff; }.maintenance-hero__lead { max-width:58ch; color:#c5e6f7; font-size:1.13rem; }.maintenance-hero__actions,.final-cta__actions { display:flex; flex-wrap:wrap; gap:1rem; margin-top:2rem; }.button-ghost,.button-outline { display:inline-flex; justify-content:center; align-items:center; gap:.5rem; padding:.85rem 1.1rem; border:1px solid rgba(111,225,255,.5); border-radius:.35rem; color:#e9faff; font-weight:800; text-decoration:none; transition:background .2s,border-color .2s,transform .2s; }.button-ghost:hover,.button-outline:hover { border-color:#75e6ff; background:rgba(48,209,255,.13); transform:translateY(-2px); }.hero-trust { display:flex; gap:.5rem; align-items:center; margin:1.4rem 0 0; color:#9fd8f0; font-size:.88rem; }.hero-trust span { display:grid; place-items:center; width:1.2rem; height:1.2rem; border-radius:50%; background:#10b981; color:#03261d; font-weight:900; }
.maintenance-hero__visual { position:relative; min-height:41rem; }.phone-halo { position:absolute; top:11%; left:12%; width:80%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(59,214,255,.42),rgba(9,92,186,.17) 43%,transparent 68%); filter:blur(5px); }.phone-mockup { position:absolute; z-index:1; top:1%; left:50%; width:min(24rem,70%); max-height:40rem; object-fit:contain; transform:translateX(-50%) rotate(-2deg); filter:drop-shadow(0 30px 36px rgba(0,0,0,.52)); }.mockup-disclaimer { position:absolute; z-index:2; bottom:0; left:50%; transform:translateX(-50%); color:#9ccfe6; font-size:.72rem; white-space:nowrap; }.hero-float-card { position:absolute; z-index:3; display:flex; align-items:center; gap:.7rem; padding:.8rem .9rem; border:1px solid rgba(119,225,255,.42); border-radius:.5rem; background:rgba(4,27,65,.88); box-shadow:0 14px 35px rgba(0,0,0,.32); backdrop-filter:blur(10px); }.hero-float-card small { display:block; color:#aad5e9; font-size:.7rem; }.hero-float-card strong { display:block; color:#fff; font-size:.82rem; }.hero-float-card--schedule { top:19%; left:0; }.float-icon { display:grid; place-items:center; width:1.7rem; height:1.7rem; border-radius:.35rem; background:#18bb8a; color:#042a25; font-weight:900; }.hero-float-card--income { right:0; bottom:17%; display:grid; grid-template-columns:1fr auto; column-gap:.65rem; }.hero-float-card--income small { grid-column:1 / -1; }.hero-float-card--income span { grid-column:2; grid-row:2; color:#54e5a8; font-weight:900; }
.section-intro { max-width:48rem; }.section-intro h2,.solution-panel h2,.showcase-copy h2,.agenda-copy h2,.reports-copy h2 { margin-bottom:1.15rem; font-size:clamp(2.1rem,4vw,3.6rem); }.section-intro>p:last-child { color:#b4daed; }.section-intro--center { margin-inline:auto; text-align:center; }.problems-section { padding-block:clamp(5rem,9vw,7.5rem); background:linear-gradient(120deg,rgba(3,12,31,.7),rgba(5,47,104,.55)); }.problem-list { display:grid; grid-template-columns:repeat(5,1fr); gap:1rem; padding:0; margin:3rem 0 0; list-style:none; }.problem-list li { min-height:10.5rem; padding:1.25rem; border-top:2px solid #42d6ff; background:rgba(6,35,80,.68); color:#e7f8ff; font-weight:800; }.problem-list span { display:block; margin-bottom:2.8rem; color:#71e4ff; font-size:.75rem; }
.solution-section { padding-block:clamp(5rem,9vw,7.5rem); }.solution-panel { display:grid; grid-template-columns:1fr .8fr; gap:3rem; align-items:center; padding:clamp(2rem,5vw,4rem); border:1px solid rgba(108,220,255,.35); border-radius:.75rem; background:radial-gradient(circle at 92% 10%,rgba(24,205,255,.21),transparent 18rem),linear-gradient(145deg,rgba(11,65,133,.9),rgba(4,22,58,.98)); box-shadow:var(--shadow); }.solution-panel p:not(.eyebrow) { max-width:50ch; color:#bfe7f7; }.solution-stats { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }.solution-stats span { padding:1rem; border:1px solid rgba(119,225,255,.26); border-radius:.4rem; background:rgba(3,25,62,.58); color:#e9faff; font-weight:800; text-align:center; }
.features-section { padding-block:clamp(5rem,9vw,7.5rem); }.feature-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:3rem; }.feature-card { padding:1.35rem; border:1px solid rgba(108,220,255,.22); border-radius:.55rem; background:linear-gradient(150deg,rgba(12,57,118,.72),rgba(3,20,53,.9)); box-shadow:inset 0 1px rgba(158,234,255,.08); }.feature-card:hover { border-color:#56dcff; transform:translateY(-5px); transition:border-color .2s,transform .2s; }.feature-icon { display:grid; place-items:center; width:2.55rem; height:2.55rem; margin-bottom:2.5rem; border-radius:.5rem; background:linear-gradient(145deg,#0879db,#18caff); color:#fff; font-size:1.35rem; font-weight:900; box-shadow:0 8px 20px rgba(19,201,255,.25); }.feature-card h3 { margin-bottom:.6rem; font-size:1.16rem; }.feature-card p { margin:0; color:#b5d9ec; font-size:.92rem; }
.steps-section { padding-block:clamp(5rem,9vw,7.5rem); background:linear-gradient(100deg,#031432,#062f6c); }.steps-list { display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; padding:0; margin:3rem 0 0; list-style:none; }.steps-list li { position:relative; padding:1.35rem 1.1rem; border:1px solid rgba(117,225,255,.25); border-radius:.5rem; background:rgba(4,21,55,.55); }.steps-list li:not(:last-child)::after { position:absolute; top:2.1rem; right:-1.8rem; z-index:2; content:"→"; color:#5edfff; font-size:1.5rem; }.steps-list span { display:block; margin-bottom:2.6rem; color:#58ddff; font-weight:900; }.steps-list h3 { margin-bottom:.6rem; font-size:1.12rem; }.steps-list p { margin:0; color:#b4d9ed; font-size:.9rem; }
.showcase-section,.reports-section { display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:clamp(2rem,8vw,7rem); padding-block:clamp(5rem,9vw,7.5rem); }.showcase-copy>p:not(.eyebrow),.agenda-copy>p:not(.eyebrow),.reports-copy>p:not(.eyebrow) { color:#bddff0; }.quote-preview { padding:1.4rem; border:1px solid rgba(108,220,255,.3); border-radius:.7rem; background:#f8fdff; color:#082b54; box-shadow:0 24px 55px rgba(0,0,0,.4); transform:rotate(2deg); }.quote-preview__top,.quote-preview__total { display:flex; align-items:center; justify-content:space-between; }.quote-preview__top { padding-bottom:1.1rem; border-bottom:1px solid #cce9f7; }.quote-preview__top span { display:grid; place-items:center; width:2.4rem; height:2.4rem; border-radius:.4rem; background:#0879db; color:#fff; font-weight:900; }.quote-preview__top small { color:#4d6f8f; font-weight:800; }.quote-preview__client { display:grid; gap:.2rem; padding:1.4rem 0; }.quote-preview__client span { color:#6787a3; font-size:.75rem; }.quote-preview__lines { display:grid; gap:.7rem; padding:1rem 0; border-top:1px solid #d9edf7; }.quote-preview__lines i { display:block; height:.7rem; border-radius:99px; background:#d5edf9; }.quote-preview__lines i:nth-child(2){width:82%}.quote-preview__lines i:nth-child(3){width:64%}.quote-preview__total { margin-top:1rem; padding:1rem 0; border-top:2px solid #0879db; }.quote-preview__footer { padding-top:.8rem; color:#157154; font-size:.78rem; font-weight:800; }
.agenda-section { padding-block:clamp(5rem,9vw,7.5rem); background:radial-gradient(circle at 16% 48%,rgba(20,201,255,.18),transparent 22rem),#041a3e; }.agenda-layout { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:clamp(2rem,8vw,7rem); }.agenda-visual { position:relative; min-height:25rem; }.mini-calendar,.map-card { position:absolute; border:1px solid rgba(121,225,255,.3); border-radius:.65rem; background:linear-gradient(150deg,rgba(12,61,124,.95),rgba(4,25,65,.94)); box-shadow:0 20px 46px rgba(0,0,0,.33); }.mini-calendar { z-index:2; top:0; left:0; width:60%; padding:1.1rem; }.mini-calendar header { display:flex; justify-content:space-between; color:#fff; font-weight:800; }.mini-calendar header i { color:#66e1ff; font-size:.75rem; font-style:normal; }.calendar-days { display:grid; grid-template-columns:repeat(7,1fr); gap:.4rem; margin:1.2rem 0; text-align:center; }.calendar-days b { color:#b8e7fa; font-size:.68rem; }.calendar-days span { display:grid; place-items:center; aspect-ratio:1; border-radius:50%; background:rgba(127,220,255,.11); color:#62e1ff; font-size:.75rem; }.calendar-days .active { background:#19c8f5; color:#06204b; }.mini-calendar p { margin:0; color:#c1e9f9; font-size:.75rem; }.map-card { right:0; bottom:0; width:65%; height:64%; overflow:hidden; background:linear-gradient(140deg,#06447e,#082358); }.map-card::before { position:absolute; inset:0; content:""; opacity:.22; background-image:linear-gradient(25deg,transparent 47%,#8de8ff 48%,transparent 50%),linear-gradient(-35deg,transparent 47%,#8de8ff 48%,transparent 50%); background-size:5rem 4rem; }.map-line { position:absolute; z-index:1; height:.36rem; border-radius:99px; background:#37d1fb; box-shadow:0 0 14px #21caff; }.map-line--one { top:44%; left:14%; width:70%; transform:rotate(-25deg); }.map-line--two { top:64%; left:11%; width:66%; transform:rotate(35deg); }.map-pin { position:absolute; z-index:2; display:block; width:1rem; height:1rem; border:3px solid #fff; border-radius:50% 50% 50% 0; background:#1acbf7; transform:rotate(-45deg); box-shadow:0 0 14px #1acbf7; }.map-pin--one { top:25%; left:57%; }.map-pin--two { bottom:22%; left:25%; }.map-card b { position:absolute; z-index:3; bottom:1rem; left:1rem; color:#e8fbff; font-size:.78rem; }
.reports-section { grid-template-columns:1fr .9fr; }.report-tags { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:1.5rem; }.report-tags span { padding:.45rem .65rem; border:1px solid rgba(111,225,255,.25); border-radius:99px; color:#ccefff; font-size:.78rem; font-weight:800; }.report-chart { padding:1.25rem; border:1px solid rgba(110,221,255,.3); border-radius:.65rem; background:linear-gradient(145deg,#0a4a98,#041c4d); box-shadow:var(--shadow); }.report-chart__head,.report-summary { display:flex; justify-content:space-between; color:#dff8ff; font-size:.82rem; font-weight:800; }.report-chart__head i { color:#65e0ff; font-style:normal; }.report-bars { display:flex; align-items:end; height:13rem; gap:.65rem; margin:1.5rem 0; padding:1rem; border-radius:.4rem; background:rgba(2,22,60,.54); }.report-bars i { display:block; flex:1; height:38%; border-radius:.22rem .22rem 0 0; background:linear-gradient(to top,#057ce0,#25d1fa); }.report-bars i:nth-child(2){height:56%}.report-bars i:nth-child(3){height:45%}.report-bars i:nth-child(4){height:80%}.report-bars i:nth-child(5){height:64%}.report-bars i:nth-child(6){height:94%;background:linear-gradient(to top,#10b981,#72f4c7)}.report-summary { padding-top:1rem; border-top:1px solid rgba(123,221,255,.22); }.report-summary b { color:#75e4ff; }
.plans-section { padding-block:clamp(5rem,9vw,7.5rem); background:linear-gradient(120deg,#03112d,#073b81); }.plan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; max-width:62rem; margin:3rem auto 1.6rem; }.plan-card { display:grid; align-content:start; gap:.9rem; padding:1.6rem; border:1px solid rgba(119,225,255,.25); border-radius:.65rem; background:rgba(4,27,68,.76); }.plan-card>p { margin:0; color:#aee6fa; font-weight:800; }.plan-card strong { color:#fff; font-size:2.6rem; line-height:1; letter-spacing:-.06em; }.plan-card>span { min-height:2.7rem; color:#b6dced; font-size:.86rem; }.plan-card a { margin-top:1rem; }.plan-card--featured { position:relative; border-color:#4edaff; background:linear-gradient(150deg,#0c64ba,#06316e); transform:translateY(-.7rem); box-shadow:0 22px 45px rgba(0,0,0,.35); }.plan-card--featured::before { position:absolute; top:-.75rem; left:50%; padding:.25rem .7rem; border-radius:99px; background:#2dd4bf; color:#05352e; content:"Mejor valor"; font-size:.7rem; font-weight:900; transform:translateX(-50%); }.license-note { display:flex; gap:.8rem; max-width:55rem; margin:2.4rem auto 0; padding:1rem 1.15rem; border:1px solid rgba(255,188,98,.5); border-radius:.5rem; background:rgba(222,126,30,.14); color:#ffe6bf; }.license-note span { color:#ffbd64; font-size:1.25rem; }.license-note p { margin:0; font-size:.9rem; }
.trust-section { padding-block:clamp(4rem,7vw,6rem); }.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }.trust-grid p { margin:0; padding:1.2rem; border-left:2px solid #4bdcff; color:#d8f3ff; font-weight:800; }.faq-section { padding-block:clamp(5rem,9vw,7.5rem); }.faq-list { display:grid; grid-template-columns:1fr 1fr; gap:.8rem; margin-top:2.5rem; }.faq-list details { padding:1rem 1.1rem; border:1px solid rgba(112,221,255,.25); border-radius:.45rem; background:rgba(7,39,85,.58); }.faq-list summary { color:#e8f9ff; font-weight:800; cursor:pointer; }.faq-list p { margin:1rem 0 0; color:#b8ddec; font-size:.9rem; }.final-cta { padding-block:clamp(5rem,9vw,7.5rem); background:radial-gradient(circle at 70% 28%,rgba(22,203,255,.24),transparent 22rem),#07224c; text-align:center; }.final-cta>div { max-width:48rem; }.final-cta h2 { margin-bottom:1.15rem; font-size:clamp(2.3rem,4.5vw,4rem); }.final-cta p:not(.eyebrow):not(.download-note) { color:#c5e7f7; }.final-cta__actions { justify-content:center; }.download-note { min-height:1.3em; margin:1.2rem 0 0; color:#a9d9ee; font-size:.8rem; }
@media (prefers-reduced-motion:no-preference) { .phone-mockup { animation:phone-drift 7s ease-in-out infinite; }.hero-float-card--schedule { animation:card-drift 5s ease-in-out infinite; }.hero-float-card--income { animation:card-drift 5s ease-in-out -2.5s infinite; }.report-bars i { transform-origin:bottom; animation:report-pulse 2.8s ease-in-out infinite; }.report-bars i:nth-child(2){animation-delay:.12s}.report-bars i:nth-child(3){animation-delay:.24s}.report-bars i:nth-child(4){animation-delay:.36s}.report-bars i:nth-child(5){animation-delay:.48s}.report-bars i:nth-child(6){animation-delay:.6s} }
@keyframes phone-drift { 0%,100%{transform:translateX(-50%) rotate(-2deg) translateY(0)}50%{transform:translateX(-50%) rotate(1deg) translateY(-13px)} } @keyframes card-drift { 0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)} } @keyframes report-pulse { 0%,100%{transform:scaleY(.86);opacity:.74}50%{transform:scaleY(1);opacity:1} }
@media(max-width:900px) { .maintenance-hero,.showcase-section,.agenda-layout,.reports-section { grid-template-columns:1fr; }.maintenance-hero { min-height:auto; }.maintenance-hero__copy { text-align:center; }.maintenance-hero__lead { margin-inline:auto; }.maintenance-hero__actions,.hero-trust { justify-content:center; }.maintenance-hero__visual { min-height:36rem; max-width:35rem; width:100%; margin:auto; }.feature-grid { grid-template-columns:repeat(2,1fr); }.problem-list { grid-template-columns:repeat(3,1fr); }.solution-panel { grid-template-columns:1fr; }.agenda-visual { max-width:35rem; width:100%; margin:auto; }.agenda-copy { order:-1; }.reports-copy { max-width:42rem; }.trust-grid { grid-template-columns:1fr 1fr; }.steps-list { grid-template-columns:1fr 1fr; }.steps-list li:nth-child(2)::after { display:none; } }
@media(max-width:600px) { .maintenance-hero { padding-top:3.5rem; }.maintenance-hero h1 { font-size:clamp(2.55rem,13vw,3.4rem); }.maintenance-hero__visual { min-height:31rem; }.phone-mockup { width:min(21rem,72%); max-height:30rem; }.hero-float-card--schedule { left:-.3rem; }.hero-float-card--income { right:-.3rem; }.problem-list,.feature-grid,.steps-list,.plan-grid,.trust-grid,.faq-list { grid-template-columns:1fr; }.problem-list li { min-height:auto; }.problem-list span { margin-bottom:1rem; }.steps-list li::after { display:none; }.plan-card--featured { transform:none; }.plan-card--featured::before { position:static; width:max-content; transform:none; }.showcase-section,.reports-section,.agenda-section,.features-section,.faq-section { padding-block:4.5rem; }.quote-preview { transform:none; }.hero-trust { align-items:start; text-align:left; }.maintenance-hero__actions>a { width:100%; }.hero-float-card { padding:.65rem .7rem; }.hero-float-card--income { bottom:8%; }.mockup-disclaimer { bottom:-.4rem; } }
