@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Outfit:wght@500;600;700&display=swap');
:root{--navy:#071a2b;--navy2:#0b253a;--blue:#0d5bdd;--cyan:#13c6b3;--ice:#e8f7f5;--text:#142231;--muted:#607080;--line:#dce5ea;--bg:#f5f8fa;--white:#fff;--shadow:0 24px 70px rgba(6,25,44,.13)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.65}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container{width:min(1180px,calc(100% - 40px));margin:auto}.section{padding:108px 0}.section-dark{background:var(--navy);color:#fff}.site-header{height:78px;position:fixed;z-index:50;top:0;left:0;right:0;background:rgba(7,26,43,.82);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.08);transition:.25s}.site-header.scrolled{height:68px;background:rgba(7,26,43,.96);box-shadow:0 10px 30px rgba(0,0,0,.13)}.nav-wrap{height:100%;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:10px;color:#fff;min-width:190px}.brand-mark{width:39px;height:39px;display:grid;place-items:center;background:linear-gradient(145deg,var(--cyan),#24dfc8);border-radius:12px;box-shadow:0 8px 22px rgba(19,198,179,.22)}.brand-mark svg{width:29px;height:29px;fill:none;stroke:#062432;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.brand>span:last-child{display:flex;align-items:baseline;gap:5px;letter-spacing:.6px}.brand strong{font-family:Outfit;font-size:18px}.brand small{font-weight:800;color:var(--cyan);font-size:12px}.main-nav{display:flex;gap:27px;margin:auto}.main-nav a{font-size:13.5px;color:#c7d3dc;font-weight:600;transition:.2s}.main-nav a:hover{color:#fff}.nav-actions{display:flex;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:11px;padding:12px 20px;font-weight:700;font-size:13px;border:1px solid transparent;cursor:pointer;transition:.22s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--cyan),#20ddc3);color:#062432;box-shadow:0 12px 30px rgba(19,198,179,.2)}.btn-ghost{border-color:rgba(255,255,255,.18);color:#fff}.btn-secondary{color:#fff;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.05)}.btn-outline{border-color:#bacbd5;background:#fff;color:#17334a}.btn-lg{padding:15px 23px;font-size:14px}.menu-toggle{display:none;background:none;border:0;padding:8px}.menu-toggle span{display:block;width:24px;height:2px;background:#fff;margin:5px}.hero{padding:150px 0 0;overflow:hidden;background:radial-gradient(circle at 80% 20%,rgba(17,164,170,.17),transparent 32%),linear-gradient(120deg,#071a2b,#09263b 65%,#073b49)}.hero-grid{display:grid;grid-template-columns:47% 53%;align-items:center;min-height:650px}.hero-copy{padding:25px 0 80px}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:1.8px;color:#65e8d7;font-weight:800;display:inline-flex;align-items:center;gap:9px}.eyebrow i{width:23px;height:2px;background:var(--cyan)}.eyebrow.light{color:#0e7b77}.hero h1{font-family:Outfit;font-size:clamp(43px,5.2vw,70px);line-height:1.04;letter-spacing:-2px;margin:20px 0 22px;max-width:700px}.hero h1 em{font-style:normal;color:#7de8da}.hero-copy>p{font-size:17px;color:#bbcad4;max-width:610px;margin:0 0 30px}.hero-actions{display:flex;gap:13px;flex-wrap:wrap}.trust-row{display:flex;gap:22px;color:#9eb1bd;font-size:12px;font-weight:600;margin-top:30px;flex-wrap:wrap}.trust-row span:before{color:var(--cyan)}.product-stage{position:relative;height:560px;margin-left:20px}.stage-glow{position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(26,215,190,.16),transparent 66%);top:-50px;left:20px}.dashboard-card{position:absolute;width:690px;height:456px;top:47px;left:25px;background:#f7fafb;border-radius:17px;overflow:hidden;box-shadow:0 35px 100px rgba(0,0,0,.38);border:1px solid rgba(255,255,255,.22);transform:perspective(1200px) rotateY(-4deg) rotateX(2deg)}.dash-top{height:48px;background:#fff;border-bottom:1px solid #e7edf0;display:flex;align-items:center;padding:0 15px;gap:15px;color:#14293a}.mini-brand{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:800}.mini-brand b{background:var(--cyan);width:22px;height:22px;display:grid;place-items:center;border-radius:6px}.dash-search{width:170px;height:19px;background:#eef2f4;border-radius:8px;margin-left:auto}.avatar{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#d8edf0;font-size:8px;font-weight:800}.dash-body{display:flex;height:408px}.dash-body aside{width:48px;background:#0a2235;display:flex;align-items:center;flex-direction:column;gap:18px;padding-top:22px}.dash-body aside span{width:19px;height:19px;border:2px solid #547183;border-radius:6px}.dash-body aside span.active{border-color:var(--cyan);background:rgba(19,198,179,.2)}.dash-content{padding:20px;width:calc(100% - 48px);color:#193044}.dash-heading{display:flex;justify-content:space-between;align-items:center}.dash-heading div{display:flex;flex-direction:column}.dash-heading small{font-size:7px;color:#81919c}.dash-heading strong{font-size:15px}.dash-heading button{border:0;background:#0d5bdd;color:#fff;border-radius:6px;padding:7px 10px;font-size:7px}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:16px 0}.kpis div{background:#fff;border:1px solid #e5ecef;border-radius:8px;padding:10px}.kpis small{font-size:6px;display:block;color:#81909b}.kpis b{font-size:18px}.kpis i{font-style:normal;font-size:6px;color:#0aa08e;margin-left:5px}.kpis .warn{color:#e27931}.map-panel{height:180px;position:relative;background:#eaf2f3;border-radius:10px;overflow:hidden;border:1px solid #dbe8ea}.map-panel svg{width:100%;height:100%;position:absolute}.map-grid path{stroke:#d6e2e4;stroke-width:1}.road{fill:none;stroke:#fff;stroke-width:26}.route{fill:none;stroke:#14b9a6;stroke-width:4;stroke-dasharray:7 5}.map-panel circle{fill:#fff;stroke:#0eaa99;stroke-width:4}.vehicle{position:absolute;background:#0d5bdd;color:white;font-size:6px;font-weight:800;width:21px;height:21px;border-radius:7px;display:grid;place-items:center;border:3px solid white;box-shadow:0 4px 8px #819ba5}.v1{left:24%;top:48%}.v2{left:61%;top:29%}.v3{left:83%;top:42%}.map-label{position:absolute;right:12px;bottom:12px;background:#fff;padding:8px 11px;border-radius:7px;display:flex;flex-direction:column;box-shadow:0 5px 18px rgba(11,43,56,.15)}.map-label b{font-size:8px}.map-label span{font-size:6px;color:#7a8b96}.trip-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}.trip-list>div{height:48px;border:1px solid #e4ebef;background:white;border-radius:8px;display:flex;align-items:center;padding:7px;gap:8px}.trip-list i{width:7px;height:7px;border-radius:50%;background:var(--cyan)}.trip-list span{display:flex;flex-direction:column}.trip-list b{font-size:6px}.trip-list small{font-size:6px;color:#82929c}.trip-list strong{font-size:6px;color:#0b9b8b;margin-left:auto}.float-card{position:absolute;background:rgba(255,255,255,.96);color:#183145;border-radius:11px;box-shadow:0 20px 40px rgba(0,0,0,.25);display:flex}.float-a{left:-8px;top:88px;padding:12px 16px;align-items:center;gap:9px}.float-a div{display:flex;flex-direction:column}.float-a small{font-size:8px;color:#758895}.float-a b{font-size:10px}.pulse{width:10px;height:10px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 6px rgba(19,198,179,.15)}.float-b{right:-45px;bottom:35px;padding:13px 17px;flex-direction:column}.float-b b{font-size:19px;color:#0c9e91}.float-b span{font-size:8px}.logo-strip{height:75px;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;gap:25px;color:#7f99a9;font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:700}.logo-strip i{width:3px;height:3px;background:#3a596a;border-radius:50%}.section-head{max-width:680px;margin-bottom:45px}.section-head.centered{text-align:center;margin-left:auto;margin-right:auto}.section-head h2{font-family:Outfit;font-size:clamp(35px,4vw,50px);line-height:1.12;letter-spacing:-1.3px;margin:13px 0 16px}.section-head p{color:var(--muted);font-size:16px}.problem-section{background:#fff}.before-after{display:grid;grid-template-columns:1fr 70px 1fr;align-items:stretch}.before-after article{padding:37px;border-radius:18px;border:1px solid var(--line)}.before{background:#f7f8f9}.after{background:linear-gradient(145deg,#ebfaf7,#f7fcfb);border-color:#bdebe5!important}.tag{display:inline-block;border-radius:20px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1px;padding:6px 11px;background:#e6eaed;color:#6a7881}.after .tag{background:#c9f2ec;color:#08776d}.before-after h3{font-size:23px;margin:18px 0}.before-after ul{list-style:none;padding:0;margin:0}.before-after li{padding:10px 0 10px 27px;position:relative;color:#566976}.before li:before{content:'×';position:absolute;left:2px;color:#b16a6a;font-weight:800}.after li:before{content:'✓';position:absolute;left:2px;color:#099989;font-weight:800}.transform-arrow{display:grid;place-items:center;font-size:31px;color:#0a9d8e}.features-section{background:var(--bg)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card{background:#fff;border:1px solid #e1e9ed;border-radius:17px;padding:29px;min-height:230px;transition:.25s;position:relative;overflow:hidden}.feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:#c6e6e3}.feature-card.featured{grid-row:span 2;min-height:478px;background:linear-gradient(155deg,#09283d,#0c3c4c);color:white;border:0}.feature-card .icon{width:42px;height:42px;border-radius:11px;background:#e5f7f4;color:#088f82;display:grid;place-items:center;font-size:22px;margin-bottom:24px}.featured .icon{background:rgba(90,235,216,.15);color:#6ce9d9}.feature-card>span{text-transform:uppercase;letter-spacing:1px;font-size:9px;color:#61d8c9;font-weight:800}.feature-card h3{font-size:20px;line-height:1.35;margin:12px 0}.featured h3{font-size:28px}.feature-card p{color:#6b7b87;font-size:13px;margin-bottom:0}.featured p{color:#acc2cb}.mini-ui.schedule{height:156px;background:#fff;border-radius:12px;margin-top:29px;padding:16px;position:relative}.mini-ui span{display:block;height:14px;border-radius:5px;background:#e7eef1;margin-bottom:10px}.mini-ui span:nth-child(1){width:55%;background:#caeee9}.mini-ui span:nth-child(2){width:90%}.mini-ui span:nth-child(3){width:72%}.mini-ui i{position:absolute;right:14px;bottom:15px;width:75px;height:70px;background:linear-gradient(135deg,#e2f4f2,#bce8e3);border-radius:8px}.mobile-section{overflow:hidden}.mobile-grid{display:grid;grid-template-columns:48% 52%;align-items:center}.phone-wrap{height:620px;display:grid;place-items:center;position:relative;background:radial-gradient(circle,#d6f5ef 0,transparent 62%)}.phone{width:285px;height:565px;border:9px solid #102c3d;border-radius:39px;background:#fff;position:relative;box-shadow:0 35px 70px rgba(9,38,55,.25);overflow:hidden}.phone-notch{position:absolute;z-index:4;width:98px;height:21px;background:#102c3d;left:50%;transform:translateX(-50%);top:-1px;border-radius:0 0 14px 14px}.phone-screen{height:100%;background:#f3f6f7;padding-top:28px}.mobile-head{height:48px;padding:0 18px;display:flex;justify-content:space-between;align-items:center;background:#fff;font-size:12px}.mobile-map{height:254px;position:relative;background:#e4edef;overflow:hidden}.mobile-map svg{width:100%;height:100%}.mobile-map path{fill:none;stroke:white;stroke-width:21}.mobile-map .mr{stroke:#18b8a7;stroke-width:4}.mobile-map circle{fill:#fff;stroke:#15ad9d;stroke-width:4}.driver-dot{position:absolute;left:111px;top:130px;width:30px;height:30px;border-radius:50%;background:#0d5bdd;color:#fff;display:grid;place-items:center;border:4px solid white;transform:rotate(-30deg);font-size:12px}.route-sheet{background:#fff;margin:-9px 8px 0;border-radius:17px 17px 0 0;position:relative;padding:17px 14px;box-shadow:0 -5px 18px rgba(31,61,77,.08);display:flex;flex-direction:column}.route-sheet small{font-size:8px;color:#70818c;text-transform:uppercase;font-weight:700}.route-sheet b{font-size:13px}.route-sheet span{font-size:9px;color:#7a8b95}.progress{height:4px;background:#e8eff1;border-radius:5px;margin:13px 0}.progress i{display:block;width:64%;height:100%;background:var(--cyan);border-radius:5px}.mobile-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.mobile-actions button{border:0;border-radius:8px;background:#e7f1f3;color:#315363;font-size:7px;padding:9px 3px;font-weight:800}.mobile-actions button:last-child{background:#0d5bdd;color:#fff}.phone-shadow{position:absolute;width:300px;height:42px;background:rgba(15,54,74,.18);filter:blur(20px);bottom:12px;border-radius:50%}.mobile-copy{padding-left:60px}.mobile-copy h2{font-family:Outfit;font-size:47px;line-height:1.12;letter-spacing:-1.3px;margin:14px 0 20px}.mobile-copy>p{color:var(--muted);font-size:16px}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:29px 0}.check-grid span{font-size:13px;font-weight:700}.check-grid span::first-letter{color:#0a9d8e}.text-link{font-weight:800;color:#087d77;font-size:13px}.text-link b{margin-left:7px}.sectors-section{background:#eff5f6}.sector-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#d8e3e6;border:1px solid #d8e3e6}.sector-grid article{background:#fff;padding:35px 28px;min-height:250px}.sector-grid article:hover{background:#f4fbfa}.sector-grid .sector-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#e6f7f4,#d3f2ed);color:#0b9b8e;box-shadow:inset 0 0 0 1px rgba(11,155,142,.08)}.sector-grid .sector-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.sector-grid h3{font-size:20px;margin:26px 0 12px;line-height:1.35}.sector-grid p{font-size:13px;color:#687a86}.metrics-section{padding:60px 0}.metrics-grid{display:grid;grid-template-columns:repeat(4,1fr)}.metrics-grid div{text-align:center;border-right:1px solid rgba(255,255,255,.12)}.metrics-grid div:last-child{border:0}.metrics-grid b{display:block;font-family:Outfit;font-size:35px;color:#5be2d1}.metrics-grid span{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#9eb1bd}.plans-section{background:#fff}.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:center}.plan{border:1px solid var(--line);border-radius:18px;padding:34px;background:#fff;min-height:520px;display:flex;flex-direction:column}.plan.popular{border:2px solid var(--cyan);box-shadow:var(--shadow);min-height:565px;position:relative}.popular-tag{position:absolute;top:-15px;left:50%;transform:translateX(-50%);background:var(--cyan);color:#062c34;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:1px;padding:7px 14px;border-radius:20px;white-space:nowrap}.plan-name{font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:800;color:#0b9086}.plan h3{font-size:24px;margin:16px 0 10px}.plan p{font-size:13px;color:#6a7b87;min-height:65px}.plan ul{list-style:none;padding:0;margin:20px 0 30px;border-top:1px solid #ebf0f2}.plan li{font-size:13px;padding:10px 0 10px 23px;border-bottom:1px solid #ebf0f2;position:relative}.plan li:before{content:'✓';position:absolute;left:0;color:#0b9a8e;font-weight:800}.plan .btn{margin-top:auto}.plan-note{text-align:center;color:#71818b;font-size:11px;margin-top:27px}.demo-section{background:linear-gradient(130deg,#071a2b,#0a3043);color:#fff}.demo-grid{display:grid;grid-template-columns:42% 58%;gap:70px;align-items:start}.demo-copy h2{font-family:Outfit;font-size:50px;line-height:1.1;margin:15px 0}.demo-copy>p{color:#b4c5cf}.demo-copy ul{list-style:none;padding:0;margin:30px 0}.demo-copy li{margin:12px 0;padding-left:25px;color:#d3dee3;font-size:13px;position:relative}.demo-copy li:before{content:'✓';position:absolute;left:0;color:var(--cyan)}.contact-direct{border-top:1px solid rgba(255,255,255,.12);padding-top:25px;display:flex;flex-direction:column}.contact-direct span{font-size:10px;color:#91a7b3;text-transform:uppercase}.contact-direct a{color:#5be2d1;font-weight:800}.demo-form{background:#fff;color:var(--text);padding:34px;border-radius:18px;box-shadow:0 30px 70px rgba(0,0,0,.25)}.form-title{display:flex;flex-direction:column;margin-bottom:23px}.form-title b{font-size:21px}.form-title span{font-size:12px;color:#768791}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.demo-form label{font-size:11px;font-weight:800;color:#425866;display:flex;flex-direction:column;gap:7px;margin-bottom:15px}.demo-form input,.demo-form select,.demo-form textarea{border:1px solid #d8e2e7;border-radius:9px;padding:12px;background:#fbfcfd;outline:none;color:#203645}.demo-form input:focus,.demo-form select:focus,.demo-form textarea:focus{border-color:#12a999;box-shadow:0 0 0 3px rgba(19,198,179,.1)}.consent{flex-direction:row!important;align-items:flex-start;font-weight:500!important;font-size:10px!important}.consent input{margin-top:2px}.btn-submit{width:100%;padding:14px}.form-status{text-align:center;font-size:11px;margin:10px 0 0;min-height:18px}.form-status.ok{color:#078676}.form-status.error{color:#c04b4b}.faq-section{background:#f5f8f9}.faq-grid{display:grid;grid-template-columns:35% 65%;gap:70px}.faq-list details{background:#fff;border:1px solid #dfe7ea;border-radius:12px;margin-bottom:11px;padding:0 20px}.faq-list summary{padding:19px 0;font-weight:800;font-size:14px;cursor:pointer;list-style:none;display:flex;justify-content:space-between}.faq-list summary:after{content:'+';color:#0a9d8e;font-size:20px}.faq-list details[open] summary:after{content:'−'}.faq-list p{color:#657782;font-size:13px;margin:0 0 20px}footer{background:#041421;color:#a8bac5;padding:70px 0 22px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:50px}.footer-brand p{font-size:12px;max-width:280px}.footer-grid h4{color:white;font-size:12px;text-transform:uppercase;letter-spacing:1px;margin:4px 0 18px}.footer-grid>div:not(:first-child){display:flex;flex-direction:column;gap:10px}.footer-grid a{font-size:11px}.footer-grid a:hover{color:#56dfcf}.footer-bottom{border-top:1px solid rgba(255,255,255,.09);margin-top:50px;padding-top:20px;display:flex;justify-content:space-between;font-size:10px}.footer-bottom span:last-child{display:flex;gap:20px}.whatsapp-float{position:fixed;z-index:30;right:24px;bottom:24px;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#fff;font-size:28px;font-weight:800;box-shadow:0 14px 35px rgba(37,211,102,.35);border:2px solid rgba(255,255,255,.22)}.whatsapp-float:hover{transform:translateY(-2px) scale(1.02);background:#22c55e}.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:1050px){.main-nav{display:none}.nav-actions{margin-left:auto}.hero-grid{grid-template-columns:1fr}.hero-copy{padding-bottom:20px}.product-stage{margin:auto;width:760px;transform:scale(.9);transform-origin:center top}.hero{padding-top:115px}.feature-grid{grid-template-columns:repeat(2,1fr)}.feature-card.featured{grid-row:span 2}.sector-grid{grid-template-columns:repeat(2,1fr)}.demo-grid{gap:35px}.mobile-copy{padding-left:20px}.dashboard-card{left:42px}}
@media(max-width:780px){.container{width:min(100% - 28px,1180px)}.section{padding:75px 0}.site-header{height:68px}.nav-actions .btn-ghost{display:none}.nav-actions .btn-primary{padding:10px 12px}.menu-toggle{display:block;margin-left:auto;order:2}.nav-actions{margin:0;order:3}.main-nav{position:absolute;display:none;top:68px;left:0;right:0;background:#071a2b;padding:20px;flex-direction:column;border-top:1px solid rgba(255,255,255,.1)}.main-nav.open{display:flex}.brand{min-width:auto}.brand>span:last-child{display:none}.hero{padding-top:95px}.hero-grid{min-height:auto}.hero-copy{padding-bottom:40px}.hero h1{font-size:43px;letter-spacing:-1.2px}.hero-copy>p{font-size:15px}.product-stage{width:710px;height:470px;transform:scale(.53);transform-origin:left top;margin-bottom:-210px}.logo-strip{overflow:auto;justify-content:flex-start;white-space:nowrap}.before-after{grid-template-columns:1fr}.transform-arrow{height:55px;transform:rotate(90deg)}.feature-grid{grid-template-columns:1fr}.feature-card.featured{grid-row:auto}.mobile-grid{grid-template-columns:1fr}.phone-wrap{height:570px}.mobile-copy{padding:25px 0 0}.mobile-copy h2,.demo-copy h2{font-size:38px}.sector-grid,.plans-grid,.metrics-grid{grid-template-columns:1fr}.metrics-grid div{border-right:0;border-bottom:1px solid rgba(255,255,255,.12);padding:20px}.plan.popular{min-height:520px;margin:12px 0}.demo-grid,.faq-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:10px}.section-head h2{font-size:36px}}
@media(max-width:450px){.nav-actions .btn-primary{font-size:11px}.hero h1{font-size:37px}.hero-actions .btn{width:100%}.trust-row{gap:10px;flex-direction:column}.product-stage{transform:scale(.47);margin-bottom:-240px}.check-grid{grid-template-columns:1fr}.sector-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.demo-form{padding:23px}.before-after article{padding:25px}}

/* =========================================================
   Ajustes responsive v2 — prioridad móvil y tablet
   ========================================================= */
html{scroll-padding-top:88px;overflow-x:hidden}
body{overflow-x:hidden}
img,svg{max-width:100%}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}

@media (max-width:1050px){
  .nav-wrap{gap:16px}
  .product-stage{margin-left:0;max-width:100%}
  .demo-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
}

@media (max-width:780px){
  html{scroll-padding-top:72px}
  .container{width:min(100% - 32px,1180px)}
  .site-header,.site-header.scrolled{height:68px}
  .nav-wrap{gap:10px;position:relative}
  .brand{min-width:0;flex:1}
  .brand-mark{width:37px;height:37px;border-radius:10px;flex:0 0 auto}
  .brand>span:last-child{display:flex}
  .brand strong{font-size:16px}
  .brand small{font-size:10px}
  .menu-toggle{order:2;margin-left:auto;width:44px;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.14);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:rgba(255,255,255,.04);padding:0}
  .menu-toggle span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:.25s}
  .menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav-actions{display:none}
  .main-nav{position:fixed;display:flex;visibility:hidden;opacity:0;transform:translateY(-10px);top:68px;left:12px;right:12px;margin:0;padding:12px;background:rgba(5,23,37,.98);border:1px solid rgba(255,255,255,.1);border-radius:0 0 16px 16px;box-shadow:0 25px 55px rgba(0,0,0,.35);flex-direction:column;gap:4px;transition:.22s;pointer-events:none;max-height:calc(100vh - 84px);overflow:auto}
  .main-nav.open{visibility:visible;opacity:1;transform:none;pointer-events:auto}
  .main-nav a{display:flex;align-items:center;min-height:46px;padding:0 14px;border-radius:9px;font-size:14px;color:#e7f0f4}
  .main-nav a:hover,.main-nav a:focus{background:rgba(255,255,255,.07);color:#65e8d7}
  .main-nav:after{content:'Solicitar demostración';display:flex;align-items:center;justify-content:center;min-height:46px;margin-top:6px;border-radius:10px;background:linear-gradient(135deg,var(--cyan),#20ddc3);color:#062432;font-size:13px;font-weight:800}

  .hero{padding:100px 0 38px}
  .hero-grid{display:flex;flex-direction:column;min-height:0;gap:22px}
  .hero-copy{padding:0;text-align:left;width:100%}
  .eyebrow{font-size:10px;letter-spacing:1.35px;line-height:1.5}
  .hero h1{font-size:clamp(36px,10.8vw,50px);line-height:1.06;letter-spacing:-1.35px;margin:17px 0 18px}
  .hero-copy>p{font-size:15px;line-height:1.68;margin-bottom:24px}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .hero-actions .btn{width:100%;min-height:50px}
  .trust-row{display:grid;grid-template-columns:1fr;gap:8px;margin-top:20px;font-size:12px}

  .product-stage{width:100%;height:300px;margin:0;overflow:hidden;border-radius:18px}
  .stage-glow{width:420px;height:420px;left:50%;top:-60px;transform:translateX(-50%)}
  .dashboard-card{width:690px;height:456px;top:15px;left:50%;transform:translateX(-50%) scale(.43);transform-origin:top center;border-radius:17px}
  .float-card{display:none}
  .logo-strip{width:100%;padding:18px 16px 0;gap:14px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .logo-strip::-webkit-scrollbar{display:none}
  .logo-strip span{font-size:10px;flex:0 0 auto}

  .section{padding:66px 0}
  .section-head{margin-bottom:30px}
  .section-head h2{font-size:clamp(31px,8.5vw,40px);line-height:1.12;letter-spacing:-.7px}
  .section-head p{font-size:14px;line-height:1.65}
  .before-after{grid-template-columns:1fr;gap:12px}
  .before-after article{padding:26px 22px}
  .transform-arrow{height:34px;transform:rotate(90deg);font-size:24px}
  .before-after h3{font-size:21px}
  .before-after li{font-size:14px;line-height:1.45}

  .feature-grid{grid-template-columns:1fr;gap:14px}
  .feature-card,.feature-card.featured{min-height:0;padding:25px 22px}
  .feature-card h3{font-size:20px;line-height:1.25}
  .feature-card p{font-size:14px;line-height:1.6}
  .mini-ui{max-width:100%}

  .mobile-grid{grid-template-columns:1fr;gap:20px}
  .phone-wrap{height:515px;overflow:hidden}
  .phone{width:250px;height:495px;border-width:8px;border-radius:34px}
  .mobile-copy{padding:6px 0 0}
  .mobile-copy h2,.demo-copy h2{font-size:clamp(32px,9vw,42px);line-height:1.12}
  .mobile-copy>p{font-size:14px;line-height:1.65}
  .check-grid{grid-template-columns:1fr 1fr;gap:10px}
  .check-grid span{font-size:12px}

  .sector-grid,.plans-grid,.metrics-grid{grid-template-columns:1fr}
  .sector-grid{gap:13px}
  .sector-grid article{min-height:205px;padding:24px}
  .sector-grid h3{margin-top:32px}
  .metrics-grid div{padding:20px 12px}
  .plan,.plan.popular{min-height:0;padding:28px 23px;margin:0}
  .plan p{min-height:0}
  .plans-grid{gap:24px}

  .demo-grid,.faq-grid{grid-template-columns:1fr;gap:34px}
  .demo-form{padding:25px 20px;border-radius:15px}
  .form-grid{grid-template-columns:1fr;gap:0}
  .demo-form input,.demo-form select,.demo-form textarea{font-size:16px;min-height:47px}
  .faq-list details{padding:0 16px}
  .faq-list summary{font-size:13px;line-height:1.4;gap:12px}

  .footer-grid{grid-template-columns:1fr 1fr;gap:32px 22px}
  .footer-brand{grid-column:1/-1}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:12px}
  .footer-bottom span:last-child{flex-wrap:wrap}
  .whatsapp-float{right:16px;bottom:16px;width:52px;height:52px}
}

@media (max-width:520px){
  .container{width:min(100% - 24px,1180px)}
  .brand>span:last-child{display:flex}
  .product-stage{height:270px}
  .dashboard-card{transform:translateX(-50%) scale(.385)}
  .check-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-brand{grid-column:auto}
}

@media (max-width:380px){
  .brand strong{font-size:14px}
  .brand small{font-size:9px}
  .hero h1{font-size:34px}
  .product-stage{height:244px}
  .dashboard-card{transform:translateX(-50%) scale(.345)}
  .demo-form{padding:21px 16px}
}

body.menu-open{overflow:hidden}


/* =========================================================
   Responsive v3 — corrección definitiva de ancho móvil
   ========================================================= */
@media (max-width: 780px) {
  html, body { width: 100%; max-width: 100%; overflow-x: clip !important; }
  body, main, header, section, footer { min-width: 0 !important; max-width: 100% !important; }
  *, *::before, *::after { min-width: 0; }

  .site-header { width: 100%; }
  .nav-wrap { width: calc(100% - 24px) !important; max-width: none; padding: 0; }
  .brand { flex: 1 1 auto; min-width: 0 !important; }
  .brand > span:last-child { display: flex !important; }
  .nav-actions { display: none !important; }
  .menu-toggle { flex: 0 0 44px; margin-left: 8px; }

  .hero, .hero-grid, .hero-copy { width: 100%; max-width: 100%; min-width: 0; }
  .hero { overflow: hidden !important; padding-top: 92px; }
  .hero-grid { padding-left: 0; padding-right: 0; }
  .hero-copy { overflow: visible; }
  .eyebrow {
    display: flex;
    width: 100%;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    letter-spacing: 1.1px;
  }
  .eyebrow i { flex: 0 0 23px; }
  .hero h1 {
    width: 100%;
    max-width: 100%;
    font-size: clamp(33px, 9.7vw, 44px);
    line-height: 1.08;
    letter-spacing: -1px;
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: none;
  }
  .hero h1 em { display: inline; }
  .hero-copy > p {
    width: 100%;
    max-width: 100%;
    overflow-wrap: break-word;
  }
  .hero-actions { width: 100%; }
  .hero-actions .btn {
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    text-align: center;
    white-space: normal;
    line-height: 1.3;
  }
  .trust-row { width: 100%; }
  .trust-row span { overflow-wrap: anywhere; }

  .product-stage { max-width: 100% !important; }
  .logo-strip { max-width: 100%; }
  .section, .section .container, .section-head, .before-after,
  .feature-grid, .mobile-grid, .sector-grid, .plans-grid,
  .demo-grid, .faq-grid, .footer-grid { min-width: 0; max-width: 100%; }
  .section h2, .section h3, .section p, .section li,
  .plan, .feature-card, .sector-grid article { overflow-wrap: break-word; }
}

@media (max-width: 420px) {
  .container { width: calc(100% - 24px) !important; }
  .brand strong { font-size: 15px; }
  .brand small { font-size: 9px; }
  .hero h1 { font-size: clamp(32px, 9.4vw, 39px); }
  .eyebrow { font-size: 9px; }
}


/* =========================================================
   Hero portada v4 — imagen más sobria y profesional
   ========================================================= */
.hero{padding:152px 0 0;overflow:hidden;background:radial-gradient(circle at 78% 14%,rgba(26,175,164,.14),transparent 28%),linear-gradient(112deg,#061726 0%,#082235 52%,#0a3b47 100%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.96fr);align-items:center;gap:54px;min-height:685px}
.hero-copy{padding:30px 0 84px}
.hero h1{font-family:Outfit;font-size:clamp(48px,5.2vw,72px);line-height:1.02;letter-spacing:-2.4px;margin:20px 0 22px;max-width:690px}
.hero h1 em{font-style:normal;color:#73e6d9}
.hero-copy>p{font-size:18px;color:#c0ccd6;max-width:640px;margin:0 0 30px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-actions .btn-lg{min-height:54px;padding:16px 24px;border-radius:14px}
.hero-proof{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:32px;max-width:760px}
.hero-proof div{padding:18px 18px 16px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border-radius:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.hero-proof strong{display:block;font-size:14px;line-height:1.3;color:#fff;margin-bottom:6px}
.hero-proof span{display:block;font-size:12px;line-height:1.55;color:#94a9b7}
.product-stage{position:relative;height:590px;margin-left:0;display:flex;align-items:center;overflow:visible}
.stage-glow{position:absolute;width:560px;height:560px;background:radial-gradient(circle,rgba(30,218,192,.14),transparent 64%);top:-36px;left:50%;transform:translateX(-45%)}
.ops-shell{position:relative;width:100%;padding:24px;border-radius:28px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.03));box-shadow:0 34px 90px rgba(0,0,0,.34);backdrop-filter:blur(10px)}
.ops-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}
.ops-pill{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:999px;border:1px solid rgba(111,237,220,.25);background:rgba(19,198,179,.12);font-size:11px;font-weight:800;letter-spacing:.2px;color:#9df0e4;text-transform:uppercase}
.ops-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:18px}
.ops-summary{display:flex;flex-direction:column;gap:18px}
.ops-kpi{padding:22px;border-radius:22px;background:#fff;color:#17334a;box-shadow:0 10px 30px rgba(6,24,41,.08)}
.ops-kpi small{display:block;font-size:11px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:#0d837c}
.ops-kpi strong{display:block;font-family:Outfit;font-size:32px;line-height:1.12;letter-spacing:-1px;margin:12px 0 10px}
.ops-kpi p{margin:0;font-size:14px;line-height:1.6;color:#5c6f7b}
.ops-metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ops-metric-grid article{padding:18px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(4,18,29,.32)}
.ops-metric-grid small{display:block;font-size:11px;color:#85a1b2;margin-bottom:7px}
.ops-metric-grid b{font-size:18px;line-height:1.3;color:#fff}
.ops-board{padding:22px;border-radius:22px;background:#fff;color:#183145}
.ops-board-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid #e5edf2}
.ops-board-head small{display:block;font-size:10px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:#5f7380}
.ops-board-head strong{display:block;margin-top:6px;font-size:22px;font-family:Outfit;line-height:1.15}
.ops-board-head span{display:inline-flex;align-items:center;padding:10px 12px;border-radius:999px;background:#e8fbf7;font-size:11px;font-weight:800;color:#0d897d;white-space:nowrap}
.ops-list{display:grid;gap:12px;margin-top:18px}
.ops-list article{padding:16px;border:1px solid #e4ebf0;border-radius:17px;background:#f8fbfc}
.ops-list b{display:block;margin-bottom:6px;font-size:15px;line-height:1.35;color:#11293a}
.ops-list span{display:block;font-size:13px;line-height:1.55;color:#607080}
.ops-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.ops-tags span{display:inline-flex;align-items:center;padding:10px 12px;border-radius:999px;background:#0b2236;color:#d7e8ee;font-size:11px;font-weight:700}
.float-a{left:-14px;top:58px;padding:14px 16px;align-items:center;gap:9px}
.float-a small{font-size:8px;color:#7b8d98}.float-a b{font-size:11px}
.float-b{right:-18px;bottom:24px;padding:15px 18px;flex-direction:column;align-items:flex-start}
.float-b b{font-size:16px;color:#0d8d83;line-height:1.25}.float-b span{font-size:10px;line-height:1.4}
.logo-strip{height:78px;border-top:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;gap:24px;color:#8ca4b0;font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:700}

@media (max-width: 1100px){
  .hero-grid{grid-template-columns:1fr;gap:34px;min-height:0}
  .hero-copy{padding:10px 0 0}
  .hero-proof{max-width:100%}
  .product-stage{height:auto;padding-bottom:24px}
}

@media (max-width: 780px){
  .hero{padding:96px 0 38px}
  .hero-grid{display:grid;grid-template-columns:1fr;gap:28px}
  .hero-copy{padding:0}
  .hero h1{font-size:clamp(38px,11.2vw,52px);line-height:1.04;letter-spacing:-1.4px;margin:16px 0 18px}
  .hero-copy>p{font-size:16px;line-height:1.7;margin-bottom:22px}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .hero-actions .btn-lg{width:100%;min-height:52px;padding:15px 18px}
  .hero-proof{grid-template-columns:1fr;gap:10px;margin-top:22px}
  .hero-proof div{padding:16px 16px 14px}
  .product-stage{height:auto;overflow:visible;border-radius:0;margin-top:2px}
  .stage-glow{width:360px;height:360px;top:-20px;left:50%;transform:translateX(-50%)}
  .ops-shell{padding:18px;border-radius:22px}
  .ops-header{flex-direction:column;align-items:flex-start;margin-bottom:18px}
  .ops-pill{padding:8px 11px;font-size:10px}
  .ops-grid{grid-template-columns:1fr;gap:14px}
  .ops-kpi{padding:18px}
  .ops-kpi strong{font-size:26px}
  .ops-metric-grid{grid-template-columns:1fr 1fr;gap:10px}
  .ops-metric-grid article{padding:14px}
  .ops-metric-grid b{font-size:16px}
  .ops-board{padding:18px}
  .ops-board-head{flex-direction:column;align-items:flex-start}
  .ops-board-head strong{font-size:20px}
  .ops-list article{padding:14px}
  .ops-list b{font-size:14px}
  .ops-list span{font-size:12px}
  .ops-tags{gap:8px}
  .ops-tags span{padding:8px 10px;font-size:10px}
  .float-card{display:none}
}

@media (max-width: 520px){
  .hero h1{font-size:clamp(35px,10.5vw,44px)}
  .hero-copy>p{font-size:15px}
  .ops-metric-grid{grid-template-columns:1fr}
  .ops-kpi strong{font-size:24px}
  .logo-strip{padding-top:16px;justify-content:flex-start;overflow-x:auto;white-space:nowrap}
}

@media (max-width: 400px){
  .hero h1{font-size:33px}
  .hero-proof strong{font-size:13px}
  .hero-proof span{font-size:11.5px}
}

/* =========================================================
   Visual refresh v5 — hero e imágenes de apoyo
   ========================================================= */
.product-stage{position:relative;height:auto;display:flex;align-items:center;justify-content:center;padding:22px 0 74px}
.hero-visual-card{position:relative;width:100%;max-width:760px;border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);box-shadow:0 30px 80px rgba(0,0,0,.34)}
.hero-visual-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.hero-visual-card::after{content:"";position:absolute;inset:auto 0 0 0;height:42%;background:linear-gradient(180deg,rgba(5,18,30,0) 0%,rgba(5,18,30,.85) 100%)}
.hero-visual-caption{position:absolute;left:26px;right:26px;bottom:24px;z-index:2;display:grid;gap:8px;max-width:480px}
.hero-visual-caption strong{font-family:Outfit;font-size:28px;line-height:1.08;letter-spacing:-.7px;color:#fff}
.hero-visual-caption span{font-size:14px;line-height:1.55;color:#d5e4eb}
.hero-float{backdrop-filter:blur(10px)}
.hero-float.float-a{left:-8px;top:22px;padding:16px 18px;max-width:235px}
.hero-float.float-a small{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:#89a0ab}
.hero-float.float-a b{font-size:13px;line-height:1.45;color:#17364b}
.hero-float.float-b{right:-12px;bottom:18px;padding:16px 18px;max-width:240px}
.hero-float.float-b b{font-size:18px;color:#0c8b7e}
.hero-float.float-b span{font-size:11px;color:#4d6570}

.visual-showcase-section{padding-top:32px}
.visual-showcase-grid,.platform-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:34px;align-items:center}
.showcase-media img,.platform-media img{display:block;width:100%;height:auto;border-radius:28px;border:1px solid rgba(10,38,57,.08);box-shadow:0 22px 50px rgba(11,34,54,.12)}
.showcase-copy h2,.platform-copy h2{margin:14px 0 16px}
.showcase-copy>p,.platform-copy>p{margin:0 0 18px}
.showcase-list{display:grid;gap:12px;margin:22px 0 0;padding:0;list-style:none}
.showcase-list li{position:relative;padding-left:26px;color:#405765;line-height:1.65}
.showcase-list li::before{content:"✓";position:absolute;left:0;top:0;color:var(--primary);font-weight:800}
.platform-showcase{padding:54px 0;background:radial-gradient(circle at 20% 20%,rgba(25,191,182,.13),transparent 20%),linear-gradient(180deg,#071a2b 0%,#0a2235 100%)}
.platform-copy{max-width:530px}
.platform-points{display:grid;gap:14px;margin-top:22px}
.platform-points article{padding:18px 18px 16px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.05)}
.platform-points b{display:block;font-size:16px;line-height:1.35;color:#fff;margin-bottom:6px}
.platform-points span{display:block;font-size:13px;line-height:1.6;color:#a9bfca}

@media (max-width:1100px){
  .visual-showcase-grid,.platform-grid{grid-template-columns:1fr;gap:26px}
  .visual-showcase-grid .showcase-copy{order:1}
  .visual-showcase-grid .showcase-media{order:2}
  .platform-media{order:2}
  .platform-copy{order:1;max-width:none}
}

@media (max-width:780px){
  .product-stage{padding:8px 0 20px}
  .hero-visual-card{border-radius:22px}
  .hero-visual-caption{left:18px;right:18px;bottom:16px;max-width:unset}
  .hero-visual-caption strong{font-size:22px}
  .hero-visual-caption span{font-size:13px;line-height:1.5}
  .hero-float{display:none}
  .visual-showcase-section{padding-top:12px}
  .showcase-media img,.platform-media img{border-radius:22px}
  .showcase-list{gap:10px;margin-top:18px}
  .platform-showcase{padding:34px 0}
  .platform-points article{padding:16px}
}

@media (max-width:520px){
  .hero-visual-card img{aspect-ratio:5/4}
  .hero-visual-card::after{height:58%}
  .hero-visual-caption strong{font-size:20px}
  .hero-visual-caption span{font-size:12.5px}
  .showcase-list li{font-size:14px;line-height:1.6}
  .platform-points b{font-size:15px}
  .platform-points span{font-size:12.5px}
}


/* =========================================================
   Background route-map overlay v5.1
   ========================================================= */
.hero{
  position:relative;
  isolation:isolate;
}
.hero::before,
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.hero::before{
  z-index:0;
  opacity:.22;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' viewBox='0 0 1600 900'%3E%3Cg fill='none' stroke='%2385c9d7' stroke-opacity='.22' stroke-width='1.2'%3E%3Cpath d='M0 90 C160 60 240 120 360 92 S610 40 760 88 S1010 138 1150 96 S1410 28 1600 80'/%3E%3Cpath d='M0 240 C140 204 250 296 390 250 S675 154 840 214 S1130 318 1330 250 S1500 185 1600 228'/%3E%3Cpath d='M0 430 C120 372 230 465 365 430 S595 360 745 406 S1030 484 1190 446 S1460 354 1600 416'/%3E%3Cpath d='M0 640 C110 590 250 686 396 648 S640 566 810 624 S1090 730 1285 682 S1480 612 1600 646'/%3E%3Cpath d='M110 0 C88 138 154 232 96 342 S26 560 92 690 S168 840 124 900'/%3E%3Cpath d='M430 0 C396 112 470 214 422 326 S342 556 410 672 S488 826 454 900'/%3E%3Cpath d='M790 0 C750 96 828 188 778 304 S704 538 780 646 S870 814 838 900'/%3E%3Cpath d='M1180 0 C1148 104 1228 214 1172 330 S1088 564 1162 688 S1242 828 1206 900'/%3E%3Cpath d='M1452 0 C1420 126 1490 238 1448 360 S1388 576 1440 700 S1506 836 1476 900'/%3E%3E%3C/g%3E%3Cg stroke='%2385c9d7' stroke-opacity='.12' stroke-width='1'%3E%3Cpath d='M0 140 H1600M0 280 H1600M0 420 H1600M0 560 H1600M0 700 H1600M0 840 H1600'/%3E%3Cpath d='M180 0 V900M360 0 V900M540 0 V900M720 0 V900M900 0 V900M1080 0 V900M1260 0 V900M1440 0 V900'/%3E%3C/g%3E%3C/svg%3E");
  background-size:cover;
  background-position:center;
  mix-blend-mode:screen;
}
.hero::after{
  z-index:0;
  opacity:.48;
  background-image:
    radial-gradient(circle at 73% 21%, rgba(89,229,213,.16), transparent 0 6px, transparent 7px),
    radial-gradient(circle at 80% 18%, rgba(89,229,213,.22), transparent 0 6px, transparent 7px),
    radial-gradient(circle at 58% 34%, rgba(89,229,213,.15), transparent 0 6px, transparent 7px),
    radial-gradient(circle at 84% 54%, rgba(89,229,213,.16), transparent 0 6px, transparent 7px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' viewBox='0 0 1600 900'%3E%3Cg fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M510 512 C650 442 742 548 850 462 S1100 250 1358 150' stroke='%2318d2c3' stroke-opacity='.38' stroke-width='2.5'/%3E%3Cpath d='M932 154 C930 145 937 136 948 136 C958 136 966 145 966 154 C966 167 948 182 948 182 C948 182 932 167 932 154Z' fill='%2318d2c3' fill-opacity='.30'/%3E%3Cpath d='M792 448 C790 439 797 430 808 430 C818 430 826 439 826 448 C826 461 808 476 808 476 C808 476 792 461 792 448Z' fill='%2318d2c3' fill-opacity='.30'/%3E%3Cpath d='M1268 112 C1266 103 1273 94 1284 94 C1294 94 1302 103 1302 112 C1302 125 1284 140 1284 140 C1284 140 1268 125 1268 112Z' fill='%2318d2c3' fill-opacity='.32'/%3E%3Cpath d='M1194 520 C1192 511 1199 502 1210 502 C1220 502 1228 511 1228 520 C1228 533 1210 548 1210 548 C1210 548 1194 533 1194 520Z' fill='%2318d2c3' fill-opacity='.28'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:auto,auto,auto,auto,cover;
  background-position:73% 21%,80% 18%,58% 34%,84% 54%,center;
}
.hero > .container,
.hero > .logo-strip{
  position:relative;
  z-index:1;
}

@media (max-width: 780px){
  .hero::before{opacity:.16;background-position:58% center}
  .hero::after{opacity:.34;background-position:72% 18%,81% 16%,54% 38%,88% 58%,60% center;background-size:auto,auto,auto,auto,180% auto}
}

@media (max-width: 520px){
  .hero::before{opacity:.12}
  .hero::after{opacity:.28;background-size:auto,auto,auto,auto,210% auto}
}


/* =========================================================
   Responsive desktop/laptop + route backgrounds v5.2
   ========================================================= */
:where(#producto,#funcionalidades,#sectores,#planes,#demo,#contacto){scroll-margin-top:84px}

.section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1500' height='760' viewBox='0 0 1500 760'%3E%3Cg fill='none' stroke='%230b7d78' stroke-width='1.15' stroke-linecap='round'%3E%3Cpath d='M-40 130 C130 65 250 185 430 122 S760 50 910 120 S1220 195 1540 82'/%3E%3Cpath d='M-30 350 C160 265 285 420 470 346 S760 250 955 330 S1270 420 1545 300'/%3E%3Cpath d='M-20 620 C145 535 330 680 510 610 S820 515 1010 598 S1260 680 1535 560'/%3E%3Cpath d='M145 0 C105 145 205 245 150 370 S70 590 145 760'/%3E%3Cpath d='M520 0 C470 125 565 235 510 360 S430 575 505 760'/%3E%3Cpath d='M930 0 C875 130 980 245 925 372 S845 590 920 760'/%3E%3Cpath d='M1300 0 C1255 140 1340 245 1290 375 S1210 600 1280 760'/%3E%3C/g%3E%3Cg fill='%2313a99c' fill-opacity='.32'%3E%3Ccircle cx='430' cy='122' r='4'/%3E%3Ccircle cx='955' cy='330' r='4'/%3E%3Ccircle cx='510' cy='610' r='4'/%3E%3Ccircle cx='1290' cy='375' r='4'/%3E%3C/g%3E%3C/svg%3E");
  background-size:cover;
  background-position:center;
}
.section.section-dark::before,
.platform-showcase::before,
.metrics-section::before,
.demo-section::before{
  opacity:.11;
  filter:brightness(1.4);
}
.section > .container{
  position:relative;
  z-index:1;
}

/* Consistent section rhythm and typography */
.section-head{
  width:min(100%,760px);
}
.section-head.centered{
  width:min(100%,820px);
}
.section-head h2,
.showcase-copy h2,
.platform-copy h2,
.mobile-copy h2,
.demo-copy h2{
  font-size:clamp(34px,3.4vw,48px);
  line-height:1.1;
  letter-spacing:-1.1px;
}
.section-head p,
.showcase-copy>p,
.platform-copy>p,
.mobile-copy>p,
.demo-copy>p{
  font-size:clamp(14px,1.15vw,16px);
  line-height:1.7;
}

/* Laptop layout: 13-15 inch screens */
@media (min-width:781px) and (max-width:1440px){
  html{scroll-padding-top:76px}
  .container{width:min(1200px,calc(100% - 80px))}
  .site-header,.site-header.scrolled{height:70px}
  .nav-wrap{gap:18px}
  .brand{min-width:175px}
  .brand-mark{width:38px;height:38px}
  .brand strong{font-size:17px}
  .brand small{font-size:11px}
  .main-nav{gap:20px}
  .main-nav a{font-size:12.5px}
  .nav-actions{gap:8px}
  .nav-actions .btn{padding:11px 17px;font-size:12px}

  .section{padding:76px 0}
  .section-head{margin-bottom:34px}
  .section-head h2,
  .showcase-copy h2,
  .platform-copy h2,
  .mobile-copy h2,
  .demo-copy h2{font-size:clamp(34px,3.15vw,44px)}

  .hero{padding-top:118px}
  .hero-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:38px;min-height:610px}
  .hero-copy{padding:12px 0 60px}
  .hero h1{font-size:clamp(48px,4.5vw,62px);line-height:1.02;letter-spacing:-2px}
  .hero-copy>p{font-size:16px;line-height:1.7}
  .hero-proof{gap:10px;margin-top:24px}
  .hero-proof div{padding:15px}
  .hero-proof strong{font-size:13px}
  .hero-proof span{font-size:11px}
  .product-stage{padding:12px 0 55px}
  .hero-visual-caption strong{font-size:24px}
  .hero-visual-caption span{font-size:13px}

  .before-after article{padding:30px}
  .feature-grid{gap:15px}
  .feature-card{padding:25px;min-height:215px}
  .feature-card.featured{min-height:448px}
  .sector-grid article{padding:28px}
  .plans-grid{gap:18px}
  .plan{padding:30px 26px}
  .demo-grid{gap:44px}
}

/* Tablet landscape and compact laptop */
@media (min-width:781px) and (max-width:1100px){
  .container{width:min(100% - 48px,1040px)}
  .brand{min-width:155px}
  .main-nav{gap:13px}
  .main-nav a{font-size:11.5px}
  .nav-actions .btn{padding:10px 13px}
  .hero-grid{grid-template-columns:1fr;gap:24px}
  .hero-copy{padding-bottom:0}
  .hero-proof{grid-template-columns:repeat(3,1fr)}
  .product-stage{max-width:850px;margin-inline:auto;width:100%}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .feature-card.featured{grid-row:auto;min-height:260px}
  .sector-grid{grid-template-columns:repeat(2,1fr)}
  .plans-grid{grid-template-columns:1fr;max-width:760px;margin-inline:auto}
  .plan.popular{margin:0;min-height:0}
}

/* Mobile consistency */
@media (max-width:780px){
  :where(#producto,#funcionalidades,#sectores,#planes,#demo,#contacto){scroll-margin-top:72px}
  .section{padding:60px 0}
  .section::before{opacity:.04;background-size:auto 100%;background-position:48% center}
  .section.section-dark::before,.platform-showcase::before,.metrics-section::before,.demo-section::before{opacity:.08}
  .section-head{margin-bottom:28px}
  .section-head h2,
  .showcase-copy h2,
  .platform-copy h2,
  .mobile-copy h2,
  .demo-copy h2{font-size:clamp(30px,8.7vw,39px);line-height:1.12;letter-spacing:-.7px}
  .section-head p,
  .showcase-copy>p,
  .platform-copy>p,
  .mobile-copy>p,
  .demo-copy>p{font-size:14px;line-height:1.68}
}


/* =========================================================
   Navegación y anclajes robustos v6
   ========================================================= */
:root{
  --header-height-desktop:78px;
  --header-height-compact:68px;
}

[id]{
  scroll-margin-top:calc(var(--header-height-desktop) + 18px);
}

.main-nav a{
  position:relative;
  white-space:nowrap;
}

.main-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  height:2px;
  border-radius:999px;
  background:var(--cyan);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .2s ease;
}

.main-nav a:hover::after,
.main-nav a.active::after{
  transform:scaleX(1);
}

.main-nav a.active{
  color:#fff;
}

/* Ajuste real para laptops: evita tamaños desproporcionados y conserva alineación. */
@media (min-width:781px) and (max-width:1440px){
  .container{width:min(1200px,calc(100% - 64px))}
  .nav-wrap{gap:18px}
  .brand{min-width:220px}
  .main-nav{gap:clamp(17px,1.7vw,26px)}
  .main-nav a{font-size:clamp(12px,.92vw,13.5px)}
  .nav-actions{gap:9px}
  .nav-actions .btn{padding:11px 17px;font-size:12.5px}

  .hero h1{font-size:clamp(48px,4.5vw,66px)}
  .section-head h2{font-size:clamp(36px,3.5vw,48px)}
  .mobile-copy h2,.demo-copy h2{font-size:clamp(36px,3.5vw,48px)}
}

@media (min-width:781px) and (max-width:1100px){
  .brand{min-width:180px}
  .main-nav{gap:14px}
  .nav-actions .btn-ghost{display:none}
  .main-nav a{font-size:12px}
}

@media (max-width:780px){
  [id]{scroll-margin-top:calc(var(--header-height-compact) + 12px)}
  .main-nav a::after{display:none}
  .main-nav a.active{background:rgba(255,255,255,.07);color:#65e8d7}
}


/* =========================================================
   Ajuste de navegación y ritmo vertical v6.1
   ========================================================= */
/* El desplazamiento JavaScript ya compensa exactamente la altura del header.
   Las secciones no necesitan una franja adicional debajo del menú. */
#producto,
#funcionalidades,
#sectores,
#planes,
#contacto{
  scroll-margin-top:0;
}

/* Inicio más compacto al llegar desde el menú. */
#producto,
#funcionalidades,
#sectores,
#planes,
#contacto{
  padding-top:64px;
}

/* Planes: título más contenido para que las tarjetas aparezcan de inmediato. */
#planes .section-head{
  width:min(100%,760px);
  margin-bottom:28px;
}
#planes .section-head h2{
  max-width:720px;
  margin:10px auto 12px;
  font-size:clamp(34px,3.05vw,44px);
  line-height:1.08;
  letter-spacing:-1px;
}
#planes .section-head p{
  max-width:720px;
  margin:0 auto;
}
#planes .plans-grid{
  margin-top:0;
}

/* Contacto: elimina la banda visual entre el header y el bloque oscuro. */
#contacto{
  margin-top:0;
  border-top:0;
}

@media (min-width:781px) and (max-width:1440px){
  #producto,
  #funcionalidades,
  #sectores,
  #planes,
  #contacto{
    padding-top:46px;
    padding-bottom:68px;
  }

  #producto .section-head,
  #funcionalidades .section-head,
  #sectores .section-head,
  #planes .section-head{
    margin-bottom:26px;
  }

  #planes .section-head h2{
    font-size:clamp(32px,2.9vw,40px);
    max-width:660px;
  }

  #planes .plans-grid{
    padding-top:4px;
  }
}

@media (min-width:781px) and (max-width:1100px){
  #producto,
  #funcionalidades,
  #sectores,
  #planes,
  #contacto{
    padding-top:38px;
  }
  #planes .section-head h2{
    font-size:34px;
  }
}

@media (max-width:780px){
  #producto,
  #funcionalidades,
  #sectores,
  #planes,
  #contacto{
    padding-top:42px;
  }
  #planes .section-head{
    margin-bottom:22px;
  }
  #planes .section-head h2{
    font-size:clamp(29px,8.2vw,36px);
    line-height:1.1;
  }
}

/* =========================================================
   Portada principal profesional v6.2
   Equilibra tipografía, imagen y espacios visuales
   ========================================================= */
.hero-grid{
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:42px;
  min-height:590px;
  align-items:center;
}
.hero-copy{
  padding:18px 0 54px;
  max-width:610px;
}
.hero .eyebrow{
  font-size:11px;
  letter-spacing:1.55px;
}
.hero h1{
  max-width:600px;
  margin:17px 0 20px;
  font-size:clamp(43px,4.05vw,58px);
  line-height:1.055;
  letter-spacing:-1.65px;
  text-wrap:balance;
}
.hero-copy>p{
  max-width:585px;
  margin-bottom:25px;
  font-size:15.5px;
  line-height:1.7;
  color:#c3d0d8;
}
.hero-actions{
  gap:12px;
}
.hero-actions .btn-lg{
  min-height:51px;
  padding:14px 21px;
  border-radius:13px;
  font-size:13.5px;
}
.hero-proof{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:24px;
  max-width:610px;
}
.hero-proof div{
  padding:14px 14px 13px;
  border-radius:15px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
}
.hero-proof strong{
  margin-bottom:5px;
  font-size:12.5px;
}
.hero-proof span{
  font-size:10.5px;
  line-height:1.52;
}
.product-stage{
  padding:14px 0 52px;
}
.hero-visual-card{
  max-width:720px;
  border-radius:24px;
  box-shadow:0 26px 70px rgba(0,0,0,.31);
}
.hero-visual-caption{
  left:22px;
  right:22px;
  bottom:20px;
  gap:6px;
  max-width:460px;
}
.hero-visual-caption strong{
  font-size:24px;
  letter-spacing:-.55px;
}
.hero-visual-caption span{
  font-size:12.5px;
}
.hero-float.float-a{
  left:-4px;
  top:16px;
  padding:14px 16px;
  max-width:220px;
}
.hero-float.float-b{
  right:-6px;
  bottom:12px;
  padding:14px 16px;
  max-width:220px;
}
.hero-float.float-b b{font-size:16px}
.hero-float.float-b span{font-size:10px}
.logo-strip{
  height:66px;
}

@media (min-width:1101px) and (max-width:1440px){
  .hero{padding-top:122px}
  .hero-grid{gap:34px;min-height:555px}
  .hero-copy{padding:10px 0 42px}
  .hero h1{font-size:clamp(42px,3.9vw,54px);max-width:560px}
  .hero-copy>p{font-size:15px;max-width:550px}
  .hero-proof{max-width:570px}
  .hero-visual-card{max-width:650px}
  .hero-visual-caption strong{font-size:21px}
}

@media (min-width:781px) and (max-width:1100px){
  .hero{padding-top:104px}
  .hero-grid{grid-template-columns:1fr;gap:22px;min-height:0}
  .hero-copy{max-width:760px;padding:0}
  .hero h1{max-width:720px;font-size:clamp(42px,5.6vw,54px)}
  .hero-copy>p{max-width:700px}
  .hero-proof{max-width:760px}
  .product-stage{width:min(100%,760px);margin:auto;padding-bottom:28px}
  .hero-visual-card{max-width:760px}
}

@media (max-width:780px){
  .hero{padding-top:92px}
  .hero-grid{gap:24px}
  .hero-copy{max-width:none;padding:0}
  .hero h1{
    max-width:none;
    font-size:clamp(35px,9.7vw,43px);
    line-height:1.07;
    letter-spacing:-1px;
    margin:14px 0 17px;
  }
  .hero-copy>p{
    font-size:14.5px;
    line-height:1.67;
    margin-bottom:21px;
  }
  .hero-actions .btn-lg{
    min-height:49px;
    font-size:13px;
  }
  .hero-proof{
    grid-template-columns:1fr;
    gap:8px;
    margin-top:18px;
  }
  .hero-proof div{
    padding:13px 14px;
  }
  .hero-proof strong{font-size:12.5px}
  .hero-proof span{font-size:10.5px}
  .product-stage{padding:4px 0 16px}
  .hero-visual-card{border-radius:20px}
  .hero-visual-caption strong{font-size:20px}
  .hero-visual-caption span{font-size:12px}
  .logo-strip{height:58px}
}

@media (max-width:420px){
  .hero h1{font-size:33px}
  .hero .eyebrow{font-size:9px;letter-spacing:1.15px}
}

/* =========================================================
   Mobile-first hardening v6.3
   Regla final: evita heredar columnas y anchos de escritorio
   ========================================================= */
@media (max-width:780px){
  html,body{width:100%;max-width:100%;overflow-x:hidden!important}
  .container{width:calc(100% - 32px)!important;max-width:none!important;margin-inline:auto!important}

  .hero{padding:88px 0 30px!important;overflow:hidden!important}
  .hero-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    gap:24px!important;
    align-items:start!important;
  }
  .hero-copy{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    padding:0!important;
  }
  .hero .eyebrow{
    display:flex!important;
    width:100%!important;
    max-width:100%!important;
    font-size:10px!important;
    line-height:1.45!important;
    letter-spacing:1.25px!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .hero .eyebrow i{flex:0 0 24px!important}
  .hero h1{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:16px 0 18px!important;
    font-size:clamp(34px,9.4vw,42px)!important;
    line-height:1.06!important;
    letter-spacing:-1px!important;
    text-wrap:pretty!important;
    overflow-wrap:normal!important;
    word-break:keep-all!important;
    hyphens:none!important;
  }
  .hero h1 em{display:inline!important;white-space:normal!important}
  .hero-copy>p{
    width:100%!important;
    max-width:none!important;
    margin:0 0 22px!important;
    font-size:15px!important;
    line-height:1.65!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .hero-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    gap:10px!important;
  }
  .hero-actions .btn{
    width:100%!important;
    min-height:50px!important;
    padding:14px 16px!important;
    font-size:13px!important;
    white-space:normal!important;
  }
  .hero-proof{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:none!important;
    gap:9px!important;
    margin-top:18px!important;
  }
  .hero-proof div{width:100%!important;padding:14px!important}
  .hero-proof strong{font-size:13px!important}
  .hero-proof span{font-size:11.5px!important;line-height:1.5!important}

  .product-stage{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:auto!important;
    margin:0!important;
    padding:0 0 10px!important;
    transform:none!important;
    overflow:visible!important;
  }
  .hero-visual-card{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    border-radius:18px!important;
  }
  .hero-visual-card img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:4/3!important;
    object-fit:cover!important;
  }
  .hero-visual-caption{left:16px!important;right:16px!important;bottom:14px!important}
  .hero-visual-caption strong{font-size:19px!important;line-height:1.1!important}
  .hero-visual-caption span{font-size:12px!important;line-height:1.45!important}
  .hero-float{display:none!important}
  .stage-glow{display:none!important}
  .logo-strip{height:54px!important;padding:0!important;overflow-x:auto!important;justify-content:flex-start!important}
}

@media (max-width:420px){
  .container{width:calc(100% - 28px)!important}
  .hero h1{font-size:clamp(32px,9.8vw,38px)!important}
  .hero-copy>p{font-size:14.5px!important}
  .hero-visual-caption strong{font-size:18px!important}
}

@media (max-width:360px){
  .hero h1{font-size:31px!important}
  .hero .eyebrow{font-size:9px!important;letter-spacing:1px!important}
}


/* =========================================================
   Navegación e inicio v6.4
   ========================================================= */
.hero{padding-top:104px}

@media (min-width:1101px) and (max-width:1440px){
  .hero{padding-top:94px}
  .hero-grid{min-height:535px}
}

@media (min-width:1441px){
  .hero{padding-top:108px}
}

@media (min-width:781px) and (max-width:1100px){
  .hero{padding-top:88px}
}

@media (max-width:780px){
  .hero{padding-top:82px!important}
}

/* Envío seguro del formulario */
.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.btn-submit:disabled{cursor:not-allowed;opacity:.72;transform:none;box-shadow:none}
.submit-spinner{width:16px;height:16px;border:2px solid rgba(6,36,50,.28);border-top-color:#062432;border-radius:50%;animation:submit-spin .75s linear infinite}
@keyframes submit-spin{to{transform:rotate(360deg)}}
.form-status{line-height:1.45}


.whatsapp-float svg{width:28px;height:28px;display:block;fill:currentColor}


/* Ajuste de altura para tarjetas de funcionalidades ampliadas */
@media (min-width: 981px){
  .feature-card{min-height:248px}
}
@media (min-width: 781px) and (max-width: 980px){
  .feature-card{min-height:236px}
}


/* Iconos profesionales en sectores */
.sector-grid article:hover .sector-icon{background:linear-gradient(145deg,#d9faf4,#c3eee6);transform:translateY(-2px);transition:.22s}
@media(max-width:780px){.sector-grid .sector-icon{width:52px;height:52px;border-radius:14px}.sector-grid h3{margin-top:22px}}


/* Corrección robusta para iconos de sectores en móvil */
.sector-grid .sector-icon{overflow:hidden;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.sector-grid .sector-icon > svg{display:block !important;width:28px !important;height:28px !important;max-width:none !important;max-height:none !important;flex:0 0 28px;overflow:visible}
.sector-grid .sector-icon > svg *{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
@media (max-width:780px){.sector-grid .sector-icon > svg{width:26px !important;height:26px !important;flex-basis:26px}}


/* Ajuste profesional para tarjeta de sectores */
.sector-grid article{display:flex;flex-direction:column;gap:14px;border-radius:20px;overflow:hidden}
.sector-grid .sector-head{display:flex;align-items:center;gap:14px}
.sector-grid h3{margin:0 !important;font-size:20px;line-height:1.28}
.sector-grid p{margin:0;line-height:1.72}
.sector-grid .sector-icon{width:54px;height:54px;min-width:54px;border-radius:14px;background:linear-gradient(145deg,#ebfbf8,#dbf5f0);box-shadow:inset 0 0 0 1px rgba(11,155,142,.10),0 6px 18px rgba(8,40,55,.05)}
.sector-grid .sector-icon > svg{width:24px !important;height:24px !important;flex-basis:24px;color:#0b7f77}

@media (max-width:780px){
  .sectors-section .section-head.centered{margin-bottom:26px}
  .sectors-section .section-head h2{font-size:clamp(34px,8.8vw,48px);line-height:1.1;letter-spacing:-1.2px}
  .sector-grid{gap:14px !important;background:transparent !important;border:0 !important}
  .sector-grid article{min-height:auto !important;padding:22px 20px !important;border:1px solid #d9e5e8;border-radius:18px;background:#fff;box-shadow:0 10px 24px rgba(9,35,50,.04)}
  .sector-grid .sector-head{gap:12px;align-items:center}
  .sector-grid .sector-icon{width:42px;height:42px;min-width:42px;border-radius:12px}
  .sector-grid .sector-icon > svg{width:20px !important;height:20px !important;flex-basis:20px}
  .sector-grid h3{font-size:16px !important;line-height:1.3}
  .sector-grid p{font-size:14px !important;line-height:1.68;color:#60707d}
}

@media (max-width:450px){
  .sectors-section{padding-top:64px}
  .sector-grid article{padding:20px 18px !important}
  .sector-grid .sector-head{gap:11px}
  .sector-grid h3{font-size:15px !important}
  .sector-grid p{font-size:13.5px !important}
}


/* Organización profesional para tarjetas de funcionalidades */
.feature-card{display:flex;flex-direction:column;gap:16px;border-radius:20px;overflow:hidden}
.feature-card .feature-head{display:flex;align-items:center;gap:14px;min-height:56px}
.feature-card .feature-head .icon{margin:0;flex:0 0 auto;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#eef8f6,#dff4ef);color:#0b9086;box-shadow:inset 0 0 0 1px rgba(11,155,142,.08)}
.feature-card .feature-head h3{margin:0;line-height:1.28}
.feature-card > p{margin:0}
.feature-card.featured{gap:18px}
.feature-card.featured .icon{margin-bottom:10px}
.feature-card.featured h3{margin:10px 0 10px}

@media (min-width: 781px){
  .feature-card:not(.featured) h3{font-size:19px}
  .feature-card:not(.featured) p{font-size:14px;line-height:1.72}
}

@media (max-width:780px){
  .feature-grid{gap:14px}
  .feature-card{padding:22px 20px !important;min-height:auto !important;border-radius:18px;gap:14px;box-shadow:0 10px 24px rgba(9,35,50,.04)}
  .feature-card .feature-head{gap:12px;min-height:auto}
  .feature-card .feature-head .icon{width:42px;height:42px;border-radius:12px;font-size:19px}
  .feature-card .feature-head h3{font-size:16px !important;line-height:1.32}
  .feature-card > p{font-size:14px !important;line-height:1.68;color:#60707d}
  .feature-card.featured{padding:24px 20px !important}
  .feature-card.featured .icon{width:42px;height:42px;margin-bottom:4px}
  .feature-card.featured span{font-size:11px;letter-spacing:1.2px}
  .feature-card.featured h3{font-size:16px !important;line-height:1.32;margin:4px 0 8px}
  .feature-card.featured p{font-size:14px !important;line-height:1.68}
  .feature-card.featured .mini-ui{margin-top:6px}
}

@media (max-width:450px){
  .feature-card{padding:20px 18px !important}
  .feature-card .feature-head{gap:11px}
  .feature-card .feature-head .icon{width:40px;height:40px;font-size:18px}
  .feature-card .feature-head h3{font-size:15px !important}
  .feature-card > p{font-size:13.5px !important}
}

/* Bloque final de Funcionalidades con el fondo claro del formulario principal */
.platform-showcase.section-dark{
  background:var(--bg);
  color:var(--text);
}
.platform-showcase.section-dark::before{
  opacity:.055;
  filter:none;
}
.platform-showcase .eyebrow{
  color:#0e7b77;
}
.platform-showcase .platform-copy>p{
  color:var(--muted);
}
.platform-showcase .platform-points article{
  border-color:#dce5ea;
  background:#fff;
  box-shadow:0 10px 26px rgba(9,35,50,.05);
}
.platform-showcase .platform-points b{
  color:var(--text);
}
.platform-showcase .platform-points span{
  color:var(--muted);
}


/* =========================================================
   Ajuste integral de composición responsive v6.6
   Portada a pantalla completa, secciones compactas y formulario visible
   ========================================================= */

/* Portada: ocupa la altura útil de la pantalla sin dejar una franja vacía */
.hero{
  min-height:100svh;
  display:flex;
  flex-direction:column;
  padding-top:78px;
}
.hero > .hero-grid{
  flex:1 1 auto;
  width:min(1180px,calc(100% - 40px));
  max-width:none;
  min-height:0;
  padding-block:22px 16px;
}
.hero .logo-strip{
  flex:0 0 62px;
  width:min(1180px,calc(100% - 40px));
}

/* Las secciones principales empiezan cerca del encabezado fijo */
#producto,
#funcionalidades,
#sectores,
#planes,
#contacto{
  scroll-margin-top:68px;
}
#producto,
#funcionalidades,
#sectores,
#planes{
  padding-top:58px;
}

/* Cabeceras más sobrias y mejor aprovechamiento horizontal */
#producto .section-head,
#funcionalidades .section-head,
#sectores .section-head,
#planes .section-head{
  margin-bottom:30px;
}
#producto .section-head,
#sectores .section-head,
#planes .section-head{
  max-width:900px;
}
#funcionalidades .section-head{
  max-width:920px;
}
#producto .section-head h2,
#funcionalidades .section-head h2,
#sectores .section-head h2,
#planes .section-head h2{
  font-size:clamp(32px,3.1vw,44px);
  line-height:1.1;
  letter-spacing:-1.1px;
  margin:10px 0 12px;
}
#funcionalidades .section-head h2{
  max-width:900px;
}
#producto .section-head p,
#funcionalidades .section-head p,
#planes .section-head p{
  font-size:15px;
  margin-top:0;
}

/* Producto: títulos internos proporcionados */
#producto .before-after h3{
  font-size:20px;
  line-height:1.3;
  margin:15px 0 12px;
}
#producto .before-after article{
  padding:30px 32px;
}
#producto .before-after li{
  font-size:13px;
  line-height:1.55;
  padding-block:8px;
}

/* Funcionalidades: utilizar mejor el ancho en laptops */
#funcionalidades .feature-grid{
  align-items:stretch;
}
#funcionalidades .feature-card{
  min-height:220px;
  padding:24px;
}
#funcionalidades .feature-card.featured{
  min-height:456px;
}

/* Sectores: acercar contenido al menú y mantener tarjetas compactas */
#sectores .sector-grid article{
  min-height:250px;
  padding:28px 24px;
}

/* Planes: título compacto y tarjetas visibles antes */
#planes .plans-grid{
  margin-top:6px;
}
#planes .plan{
  min-height:470px;
  padding:28px 30px;
}
#planes .plan.popular{
  min-height:510px;
}
#planes .plan h3{
  font-size:21px;
  line-height:1.35;
}
#planes .plan p{
  min-height:52px;
}
#planes .plan li{
  padding-block:8px;
}

/* Contacto: el formulario completo cabe mejor en laptop */
#contacto{
  padding:54px 0 48px;
  min-height:calc(100svh - 68px);
  display:flex;
  align-items:center;
}
#contacto .demo-grid{
  grid-template-columns:minmax(0,.82fr) minmax(560px,1.18fr);
  gap:42px;
  align-items:center;
}
#contacto .demo-copy h2{
  font-size:clamp(34px,3.6vw,47px);
  line-height:1.08;
  margin:12px 0 14px;
}
#contacto .demo-copy > p{
  font-size:15px;
  margin:0 0 18px;
}
#contacto .demo-copy ul{
  margin:20px 0;
}
#contacto .demo-copy li{
  margin:8px 0;
}
#contacto .contact-direct{
  padding-top:18px;
}
#contacto .demo-form{
  padding:26px 28px;
  border-radius:17px;
}
#contacto .form-title{
  margin-bottom:16px;
}
#contacto .form-title b{
  font-size:20px;
}
#contacto .form-grid{
  gap:10px 14px;
}
#contacto .demo-form label{
  gap:5px;
  margin-bottom:9px;
  font-size:10px;
}
#contacto .demo-form input,
#contacto .demo-form select,
#contacto .demo-form textarea{
  padding:10px 12px;
}
#contacto .demo-form textarea{
  min-height:76px;
  max-height:96px;
  resize:vertical;
}
#contacto .consent{
  margin:6px 0 10px;
}
#contacto .btn-submit{
  padding:12px;
}
#contacto .form-status{
  margin:8px 0 0;
  min-height:16px;
  font-size:11px;
  overflow-wrap:anywhere;
}
#contacto .form-status.ok{
  padding:9px 11px;
  border-radius:9px;
  background:#e9f9f5;
  border:1px solid #bcebe1;
  color:#08796e;
  text-align:left;
}

/* Laptop compacta */
@media (min-width:781px) and (max-width:1440px){
  .hero > .hero-grid{
    width:min(1180px,calc(100% - 40px));
    grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
    gap:30px;
    padding-block:12px 10px;
  }
  .hero h1{
    font-size:clamp(42px,4vw,57px);
  }
  .hero-copy > p{
    font-size:15px;
  }
  .hero-proof{
    margin-top:18px;
  }
  .hero-proof div{
    padding:13px;
  }
  #producto,
  #funcionalidades,
  #sectores,
  #planes{
    padding-top:46px;
  }
  #producto .section-head,
  #funcionalidades .section-head,
  #sectores .section-head,
  #planes .section-head{
    margin-bottom:24px;
  }
}

/* Tablet */
@media (min-width:781px) and (max-width:1100px){
  .hero{
    min-height:auto;
  }
  .hero > .hero-grid{
    width:min(100% - 42px,960px);
    grid-template-columns:1fr;
    padding-bottom:24px;
  }
  #contacto{
    min-height:auto;
    align-items:stretch;
  }
  #contacto .demo-grid{
    grid-template-columns:1fr;
    max-width:820px;
  }
}

/* Móvil: conservar diseño profesional y sin desbordes */
@media (max-width:780px){
  .hero{
    min-height:auto!important;
    display:block!important;
    padding-top:82px!important;
  }
  .hero > .hero-grid{
    width:calc(100% - 28px)!important;
    padding-block:10px 18px!important;
  }
  .hero .logo-strip{
    width:calc(100% - 28px)!important;
    min-height:54px;
  }
  #producto,
  #funcionalidades,
  #sectores,
  #planes{
    padding-top:38px!important;
  }
  #producto .section-head,
  #funcionalidades .section-head,
  #sectores .section-head,
  #planes .section-head{
    margin-bottom:22px;
  }
  #producto .section-head h2,
  #funcionalidades .section-head h2,
  #sectores .section-head h2,
  #planes .section-head h2{
    font-size:clamp(28px,8.2vw,36px)!important;
    line-height:1.12!important;
  }
  #producto .before-after article{
    padding:22px 20px;
  }
  #producto .before-after h3{
    font-size:18px;
  }
  #funcionalidades .feature-card,
  #funcionalidades .feature-card.featured{
    min-height:auto!important;
  }
  #sectores .sector-grid article{
    min-height:auto!important;
  }
  #planes .plan,
  #planes .plan.popular{
    min-height:auto;
    padding:24px 22px;
  }
  #contacto{
    min-height:auto;
    padding:38px 0 34px;
    display:block;
  }
  #contacto .demo-grid{
    grid-template-columns:1fr;
    gap:26px;
  }
  #contacto .demo-copy h2{
    font-size:clamp(31px,8.5vw,39px);
  }
  #contacto .demo-form{
    padding:22px 18px;
  }
  #contacto .form-grid{
    grid-template-columns:1fr;
    gap:0;
  }
  #contacto .demo-form input,
  #contacto .demo-form select,
  #contacto .demo-form textarea{
    font-size:16px; /* evita zoom automático en iOS */
  }
}

/* =========================================================
   Portada clara v6.8 — mismo fondo del formulario de funcionalidades
   ========================================================= */
.hero.section-dark{
  color:var(--text);
  background:var(--bg);
}
.hero.section-dark::before{
  opacity:.16;
  mix-blend-mode:normal;
  filter:none;
}
.hero.section-dark::after{
  opacity:.14;
  mix-blend-mode:normal;
}
.hero .eyebrow{
  color:#087d77;
}
.hero .eyebrow i{
  background:#0cae9f;
}
.hero h1{
  color:#102638;
}
.hero h1 em{
  color:#0b9f91;
}
.hero-copy>p{
  color:#526977;
}
.hero .btn-secondary{
  color:#17384b;
  border-color:#c7d7dd;
  background:#fff;
}
.hero .btn-secondary:hover{
  background:#f8fcfb;
  border-color:#9fc6c0;
}
.hero-proof div{
  border-color:#d7e4e8;
  background:#fff;
  box-shadow:0 10px 24px rgba(9,35,50,.04);
}
.hero-proof strong{
  color:#173447;
}
.hero-proof span{
  color:#627984;
}
.hero .logo-strip{
  color:#5e777f;
  border-top-color:#d8e4e8;
}
.hero .logo-strip i{
  background:#82a5aa;
}
.hero .stage-glow{
  background:radial-gradient(circle,rgba(26,193,174,.11),transparent 66%);
}

@media(max-width:780px){
  .hero.section-dark{
    background:var(--bg);
  }
}

/* =========================================================
   Ajuste final v6.9 — header uniforme + contacto con fondo claro
   ========================================================= */

/* Barra de navegación uniforme en todos los formularios */
.site-header,
.site-header.scrolled{
  height:72px !important;
  background:#0b253a !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
}
.site-header .nav-wrap{
  height:72px !important;
}
body{
  padding-top:0;
}

/* Mantener la portada alineada con la altura real del header */
.hero{
  padding-top:128px !important;
}

/* Fondo del contacto igual al estilo claro de Funcionalidades */
#contacto.demo-section,
#contacto{
  background:var(--bg) !important;
  color:var(--text) !important;
}
#contacto::before{
  opacity:.055 !important;
  filter:none !important;
}
#contacto .demo-copy h2,
#contacto .form-title b,
#contacto .demo-form,
#contacto .demo-form label{
  color:var(--text) !important;
}
#contacto .demo-copy > p,
#contacto .demo-copy li,
#contacto .contact-direct span{
  color:#607080 !important;
}
#contacto .demo-copy li::before{
  color:#0a9d8e !important;
}
#contacto .contact-direct{
  border-top:1px solid #dce5ea !important;
}
#contacto .contact-direct a{
  color:#0b9b8e !important;
}
#contacto .demo-form{
  box-shadow:0 24px 60px rgba(8,31,45,.12) !important;
}

@media (max-width:780px){
  .site-header,
  .site-header.scrolled{
    height:68px !important;
  }
  .site-header .nav-wrap{
    height:68px !important;
  }
  .hero{
    padding-top:96px !important;
  }
}

/* =========================================================
   Cierre compacto de Sectores con la franja de indicadores
   ========================================================= */

/* En laptop y escritorio, Sectores completa exactamente el espacio
   anterior a los indicadores para que la franja cierre la pantalla. */
@media (min-width:1101px){
  #sectores{
    min-height:calc(100svh - 72px - 88px);
    display:flex;
    align-items:center;
    padding-top:42px;
    padding-bottom:42px;
  }

  #sectores > .container{
    width:min(1180px,calc(100% - 40px));
  }

  .metrics-section{
    min-height:88px;
    padding:14px 0;
    display:flex;
    align-items:center;
  }

  .metrics-grid b{
    font-size:29px;
    line-height:1.1;
  }

  .metrics-grid span{
    display:block;
    margin-top:4px;
    line-height:1.25;
  }
}

/* En tablet la franja conserva cuatro columnas, pero con menor altura. */
@media (min-width:781px) and (max-width:1100px){
  .metrics-section{
    padding:30px 0;
  }

  .metrics-grid b{
    font-size:30px;
  }
}

/* En móvil los indicadores se apilan sin alturas fijas ni desbordamientos. */
@media (max-width:780px){
  .metrics-section{
    min-height:0;
    padding:18px 0;
  }

  .metrics-grid div{
    padding:14px 10px;
  }

  .metrics-grid b{
    font-size:28px;
    line-height:1.15;
  }

  .metrics-grid span{
    display:block;
    margin-top:4px;
    line-height:1.35;
    overflow-wrap:anywhere;
  }
}

/* =========================================================
   Ajuste final v7.0 — secciones más próximas al menú
   Solo laptop y escritorio; tablet y móvil conservan su diseño.
   ========================================================= */
@media (min-width:1101px){
  #producto,
  #funcionalidades,
  #sectores,
  #planes{
    padding-top:clamp(28px,2.4vw,38px) !important;
  }

  /* Evita que Sectores se centre verticalmente y genere espacio superior. */
  #sectores{
    align-items:flex-start;
  }

  /* El bloque de contacto inicia con la misma separación visual. */
  #contacto{
    padding-top:clamp(28px,2.4vw,38px) !important;
    align-items:flex-start;
  }
}

/* =========================================================
   Corrección definitiva portada v6.9
   Reduce al 50% el espacio visible entre el menú y el bloque
   principal en monitores de escritorio, sin afectar tablet/móvil.
   ========================================================= */
@media (min-width:1101px){
  #inicio.hero{
    padding-top:78px !important;
  }

  #inicio .hero-grid{
    align-items:start !important;
    min-height:555px;
    padding-top:46px !important;
  }

  #inicio .hero-copy{
    padding-top:0 !important;
  }

  #inicio .product-stage{
    padding-top:0 !important;
  }
}

/* =========================================================
   Ajuste portada v7.2 — retorno de 25%
   Solo laptop y escritorio. No altera tablet ni móvil.
   ========================================================= */
@media (min-width:1101px){
  #inicio .hero-grid{
    transform:translateY(-34px) !important;
    margin-bottom:-34px !important;
  }
}

/* =========================================================
   Ajuste portada v7.3 — bajar 30% adicional
   Desplaza el bloque completo 30 px hacia abajo respecto a v7.2.
   Solo laptop y escritorio; tablet y móvil no se modifican.
   ========================================================= */
@media (min-width:1101px){
  #inicio .hero-grid{
    transform:translateY(-4px) !important;
    margin-bottom:-4px !important;
  }
}


/* =========================================================
   Ajuste portada v7.4 — subir 15% adicional
   Desplaza el bloque completo 15 px hacia arriba respecto a v7.3.
   Solo laptop y escritorio; tablet y móvil no se modifican.
   ========================================================= */
@media (min-width:1101px){
  #inicio .hero-grid{
    transform:translateY(-19px) !important;
    margin-bottom:-19px !important;
  }
}
