:root{
  --blue:#079fd2;--blue2:#0b72b5;--blue3:#19b9e7;--deep:#063a67;--navy:#052742;--navy2:#031d31;
  --green:#16c900;--green2:#24d10f;--cyan:#58c8ec;--sky:#dff7ff;--ink:#122535;--muted:#607585;
  --paper:#f5fbfe;--line:#dbeaf1;--white:#fff;--shadow:0 28px 80px rgba(8,67,100,.15);
  --shadow-soft:0 14px 45px rgba(8,67,100,.09);--radius:28px;--radius-sm:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;font-family:"Ubuntu Condensed",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.55;overflow-x:hidden}
img{max-width:100%;display:block}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}
svg{width:1em;height:1em;display:block;flex:0 0 auto}.container{width:min(1220px,calc(100% - 44px));margin:auto}
h1,h2,h3,p{margin-top:0}.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:1000;pointer-events:none}.scroll-progress span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--green),var(--cyan),var(--blue));box-shadow:0 0 16px rgba(25,185,231,.65)}

.site-header{position:fixed;inset:0 0 auto;z-index:100;background:rgba(255,255,255,.74);backdrop-filter:blur(20px) saturate(140%);border-bottom:1px solid rgba(8,105,153,.08);transition:.3s ease}
.site-header.scrolled{background:rgba(255,255,255,.92);box-shadow:0 14px 42px rgba(5,42,67,.1)}
.nav-wrap{height:90px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;position:relative}.brand:after{content:"";position:absolute;inset:auto 10% -9px;height:2px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0;transition:.3s}.brand:hover:after{opacity:1}.brand img{width:224px;max-height:62px;object-fit:contain}
.main-nav{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:800;color:#27475a}
.main-nav>a{display:inline-flex;align-items:center;gap:7px;padding:11px 10px;border-radius:12px;transition:.25s;white-space:nowrap}
.main-nav>a svg{font-size:16px;color:var(--blue2);transition:.25s}.main-nav>a:not(.nav-cta):hover,.main-nav>a.active{background:#edf9fd;color:var(--deep)}.main-nav>a:not(.nav-cta):hover svg,.main-nav>a.active svg{color:var(--blue);transform:translateY(-1px)}
.nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;font-weight:850;transition:.3s cubic-bezier(.2,.75,.2,1);border:0;cursor:pointer;position:relative;overflow:hidden;isolation:isolate}
.nav-cta{background:linear-gradient(135deg,#19d308,#0eaf00);color:#fff!important;padding:12px 17px!important;box-shadow:0 10px 26px rgba(22,201,0,.25);margin-left:6px}.nav-cta svg{color:#fff!important}.nav-cta:hover,.btn:hover{transform:translateY(-3px)}.nav-cta:hover{box-shadow:0 16px 34px rgba(22,201,0,.3)}
.btn{padding:15px 24px;min-height:54px;font-size:14px}.btn svg{font-size:18px}.btn-arrow{transition:.3s}.btn:hover .btn-arrow{transform:translateX(4px)}
.btn-primary{background:linear-gradient(135deg,var(--blue3),var(--blue2));color:white;box-shadow:0 13px 30px rgba(0,125,190,.25)}.btn-primary:hover{box-shadow:0 18px 38px rgba(0,125,190,.32)}
.btn-glass{border:1px solid rgba(255,255,255,.5);color:#fff;background:rgba(255,255,255,.11);backdrop-filter:blur(14px)}.btn-glass:hover{background:rgba(255,255,255,.18)}
.btn-white{background:#fff;color:var(--deep);box-shadow:0 15px 34px rgba(0,0,0,.09)}.btn-soft{background:#edfaff;color:var(--blue2);border:1px solid #cdebf6;box-shadow:0 10px 28px rgba(8,107,155,.08)}.btn-soft:hover{background:#e2f7ff}
.btn-shine:before{content:"";position:absolute;top:-80%;left:-30%;width:36%;height:260%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);transform:rotate(20deg) translateX(-240%);transition:.75s;z-index:-1}.btn-shine:hover:before{transform:rotate(20deg) translateX(500%)}
.menu-toggle{display:none;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;color:var(--deep);border-radius:12px;padding:10px 12px;font-weight:800}.menu-toggle svg{font-size:20px}

.hero{min-height:860px;position:relative;display:flex;align-items:center;padding:154px 0 92px;overflow:hidden;background:#073e68;isolation:isolate}
.hero-bg{position:absolute;inset:-8%;background:linear-gradient(90deg,rgba(2,35,58,.9) 0%,rgba(3,52,83,.68) 45%,rgba(3,52,83,.18) 76%),url('../img/hero-water.jpg') center/cover no-repeat;transform:scale(1.08);z-index:-5;will-change:transform}
.hero-mesh{position:absolute;inset:0;z-index:-4;background:radial-gradient(circle at 16% 22%,rgba(49,189,232,.28),transparent 25%),radial-gradient(circle at 82% 18%,rgba(22,201,0,.13),transparent 22%),radial-gradient(circle at 68% 85%,rgba(66,199,240,.2),transparent 27%)}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:110px;background:linear-gradient(175deg,transparent 49%,#fff 50%);z-index:0;pointer-events:none}
.hero-dots{position:absolute;inset:0;opacity:.19;z-index:-3;background-image:radial-gradient(circle,#fff 1.2px,transparent 1.5px);background-size:28px 28px;mask-image:linear-gradient(90deg,#000,transparent 70%)}
.water-orb{position:absolute;border-radius:50%;z-index:-2;filter:blur(.2px);background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.78),rgba(98,219,247,.22) 32%,rgba(6,120,175,.12) 64%,transparent 68%);border:1px solid rgba(255,255,255,.2);box-shadow:inset -18px -20px 45px rgba(6,92,138,.16),0 20px 70px rgba(4,65,100,.16);animation:orbFloat 8s ease-in-out infinite}.orb-a{width:85px;height:85px;left:5%;top:20%}.orb-b{width:46px;height:46px;left:47%;bottom:18%;animation-delay:-3s}.orb-c{width:120px;height:120px;right:3%;top:24%;animation-delay:-5s}@keyframes orbFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(10px,-22px,0)}}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.08fr .92fr;gap:82px;align-items:center}.hero-copy{color:#fff}.eyebrow,.section-kicker{font-size:11px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;display:flex;align-items:center;gap:10px}.eyebrow{color:#c7f1fb}.eyebrow-icon,.section-kicker>span{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(88,200,236,.16);border:1px solid rgba(130,227,248,.22)}.eyebrow-icon svg,.section-kicker>span svg{font-size:16px}
h1{font-size:clamp(51px,6.2vw,82px);line-height:.96;letter-spacing:-.052em;margin:24px 0 28px;font-weight:280;max-width:780px;text-wrap:balance}h1 strong{font-weight:900;color:#67d7f5;text-shadow:0 0 38px rgba(80,202,240,.17)}.hero-copy>p{font-size:18px;max-width:680px;color:#e8f8fd;line-height:1.72}.hero-actions{display:flex;gap:13px;margin:34px 0 31px}.hero-facts{display:flex;gap:11px;flex-wrap:wrap}.fact{display:flex!important;align-items:center;gap:10px;padding:10px 14px 10px 10px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px)}.fact-icon{width:39px;height:39px;border-radius:12px;background:rgba(88,200,236,.17);display:grid;place-items:center;color:#8ee6f8}.fact-icon svg{font-size:18px}.fact p{display:flex;flex-direction:column;margin:0}.fact b{font-size:18px;line-height:1.1}.fact small{font-size:10px;color:#bfe6f2}
.hero-visual{justify-self:end;width:min(455px,100%);position:relative;transform-style:preserve-3d;transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease-out}.hero-visual:after{content:"";position:absolute;inset:15% -8% -5%;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(117,226,252,.22),transparent 36%);pointer-events:none}.hero-card{position:relative;padding:29px;border-radius:35px;background:linear-gradient(150deg,rgba(10,161,212,.58),rgba(3,52,87,.74));border:1px solid rgba(255,255,255,.22);box-shadow:0 36px 105px rgba(1,31,54,.35);backdrop-filter:blur(22px) saturate(120%);color:#fff;overflow:hidden;transform:translateZ(12px)}.hero-card:before{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-110px;top:-120px;background:rgba(255,255,255,.09);filter:blur(1px)}.hero-card-top{display:flex;align-items:center;justify-content:space-between;gap:14px;position:relative;z-index:2}.live-pill{display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:rgba(2,37,61,.27);border:1px solid rgba(255,255,255,.14);font-size:10px;font-weight:800}.live-pill svg{color:#8cf37e;font-size:14px}.mini-orb{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#b9f3ff}.hero-logo{width:252px;margin:16px auto -3px}.drop-card{height:313px;display:flex;align-items:center;justify-content:center;position:relative}.drop-card img{height:286px;position:relative;z-index:2;filter:drop-shadow(0 26px 30px rgba(0,0,0,.26));animation:bottleFloat 5s ease-in-out infinite}.drop-glow{position:absolute;width:245px;height:245px;border-radius:50%;background:radial-gradient(circle,rgba(116,226,250,.36),rgba(20,164,211,.1) 53%,transparent 69%);animation:glowPulse 3s ease-in-out infinite}@keyframes bottleFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-12px) rotate(1deg)}}@keyframes glowPulse{50%{transform:scale(1.08);opacity:.72}}
.hero-card-text{display:flex;flex-direction:column;text-align:center;position:relative;z-index:2}.hero-card-text strong{font-size:20px}.hero-card-text span{font-size:12px;color:#cbeaf5}.hero-card-chips{display:flex;justify-content:center;gap:8px;margin-top:15px}.hero-card-chips span{display:flex;align-items:center;gap:5px;font-size:9px;font-weight:800;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.1);color:#dff8ff}.hero-ring{position:absolute;border-radius:50%;border:1px solid rgba(123,229,251,.2);pointer-events:none;animation:ringSpin 18s linear infinite}.ring-1{inset:-28px}.ring-2{inset:-59px;border-style:dashed;animation-direction:reverse;animation-duration:24s}.ring-3{inset:-95px;opacity:.4;animation-duration:30s}@keyframes ringSpin{to{transform:rotate(360deg)}}
.floating-chip{position:absolute;z-index:5;display:flex;align-items:center;gap:9px;padding:10px 12px;background:rgba(255,255,255,.92);color:var(--deep);border:1px solid rgba(255,255,255,.7);box-shadow:0 16px 38px rgba(2,35,57,.2);backdrop-filter:blur(12px);border-radius:16px;animation:chipFloat 5.5s ease-in-out infinite}.floating-chip svg{font-size:18px;color:var(--blue)}.floating-chip span{display:flex;flex-direction:column;font-size:10px;line-height:1.15}.floating-chip b{font-size:12px}.chip-left{left:-54px;top:23%}.chip-right{right:-55px;bottom:18%;animation-delay:-2.3s}.chip-right svg{color:var(--green)}@keyframes chipFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.scroll-cue{position:absolute;left:50%;bottom:39px;transform:translateX(-50%);z-index:3;width:42px;height:42px;border:1px solid rgba(255,255,255,.3);border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.08);backdrop-filter:blur(8px);animation:cueBounce 2s ease-in-out infinite}.scroll-cue svg{font-size:19px}@keyframes cueBounce{50%{transform:translate(-50%,8px)}}

.trust-strip{position:relative;z-index:4;margin-top:-1px;background:#fff}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:24px;box-shadow:0 18px 50px rgba(6,66,97,.08);overflow:hidden;transform:translateY(-25px);background:#fff}.trust-item{padding:25px 22px;display:flex!important;align-items:center;gap:13px;border-right:1px solid var(--line);transition:.3s}.trust-item:last-child{border-right:0}.trust-item:hover{background:#f7fcfe;transform:translateY(-2px)}.ico{width:46px;height:46px;border-radius:15px;background:linear-gradient(145deg,#eafaff,#d6f4ff);color:var(--blue2);display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(8,150,207,.08)}.ico svg{font-size:21px}.trust-item p{margin:0;display:flex;flex-direction:column}.trust-item b{font-size:14px}.trust-item small{color:var(--muted);font-size:11px}

.section{padding:108px 0;position:relative}.split{display:grid;grid-template-columns:1fr 1fr;gap:88px;align-items:center}.section-watermark{position:absolute;right:-2%;top:25px;font-size:clamp(80px,14vw,210px);font-weight:950;letter-spacing:-.08em;color:#f4fbfe;line-height:1;pointer-events:none;user-select:none}.image-stack{position:relative;min-height:575px}.image-frame{position:absolute;overflow:hidden}.frame-main{left:0;top:0;width:86%;height:485px;border-radius:31px;box-shadow:var(--shadow)}.frame-small{right:0;bottom:0;width:44%;height:225px;border:8px solid #fff;border-radius:25px;box-shadow:var(--shadow);z-index:3}.img-main,.img-small{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.75,.2,1)}.image-frame:hover img{transform:scale(1.055)}.image-sheen{position:absolute;inset:0;background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.25) 50%,transparent 62%);transform:translateX(-120%);transition:.9s}.image-frame:hover .image-sheen{transform:translateX(120%)}.floating-badge{position:absolute;right:1%;top:22px;background:linear-gradient(145deg,#24d513,#11b900);color:#fff;width:138px;height:138px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 22px 45px rgba(22,201,0,.24);z-index:4;border:6px solid rgba(255,255,255,.92);animation:badgePulse 4s ease-in-out infinite}.floating-badge svg{font-size:18px;margin-bottom:2px}.floating-badge span,.floating-badge small{font-size:8px;font-weight:900;letter-spacing:.13em}.floating-badge strong{font-size:32px;line-height:1}@keyframes badgePulse{50%{transform:rotate(2deg) scale(1.025)}}.mini-stat{position:absolute;left:4%;bottom:20px;z-index:5;background:rgba(255,255,255,.93);border:1px solid #e1edf2;border-radius:18px;box-shadow:0 16px 42px rgba(7,70,102,.14);padding:11px 14px;display:flex;align-items:center;gap:10px;backdrop-filter:blur(10px)}.mini-stat>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#e9f9ff;color:var(--blue)}.mini-stat p{margin:0;display:flex;flex-direction:column;line-height:1.15}.mini-stat b{font-size:15px}.mini-stat small{font-size:9px;color:var(--muted)}
.section-kicker{color:var(--blue2);margin-bottom:17px}.section-kicker>span{background:#eafaff;border-color:#d1f0fa;color:var(--blue2)}.section-copy h2,.section-head h2,.coverage-copy h2,.contact-info h2{font-size:clamp(38px,4.65vw,62px);line-height:1.03;letter-spacing:-.04em;margin-bottom:25px;text-wrap:balance}.section-copy h2 em,.section-head h2 em,.coverage-copy h2 em,.contact-info h2 em{font-style:normal;color:var(--blue)}.section-copy>p,.section-head>p,.coverage-copy>p,.contact-info>p{color:var(--muted);font-size:16px;line-height:1.76}.feature-list{margin:31px 0 26px;display:grid;gap:9px}.feature-list>div{display:grid;grid-template-columns:49px 1fr 28px;gap:13px;align-items:center;padding:13px 14px;border:1px solid transparent;border-radius:17px;transition:.3s}.feature-list>div:hover{border-color:var(--line);background:#f8fcfe;transform:translateX(5px)}.feature-icon{width:43px;height:43px;border-radius:13px;background:#eafaff;color:var(--blue);display:grid;place-items:center}.feature-icon svg{font-size:20px}.feature-list p{margin:0;display:flex;flex-direction:column}.feature-list small{color:var(--muted)}.feature-arrow{color:#a8c4cf;font-size:17px;transition:.3s}.feature-list>div:hover .feature-arrow{color:var(--blue);transform:translate(2px,-2px)}

.catalog{background:linear-gradient(180deg,#f5fbfe,#eef9fd);overflow:hidden}.catalog-glow{position:absolute;border-radius:50%;filter:blur(15px);pointer-events:none}.glow-one{width:420px;height:420px;right:-180px;top:50px;background:rgba(49,190,230,.1)}.glow-two{width:300px;height:300px;left:-120px;bottom:70px;background:rgba(22,201,0,.05)}.centered{text-align:center;max-width:800px;margin:0 auto 38px}.centered .section-kicker{justify-content:center}.catalog-filters{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-bottom:34px}.filter{border:1px solid #cbe1eb;background:rgba(255,255,255,.88);border-radius:999px;padding:10px 15px;font-weight:800;color:#496271;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:.27s;box-shadow:0 5px 15px rgba(7,73,104,.04)}.filter svg{font-size:16px}.filter.active,.filter:hover{background:var(--deep);color:#fff;border-color:var(--deep);transform:translateY(-2px);box-shadow:0 10px 23px rgba(6,58,103,.17)}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;perspective:1200px}.product-card{background:#fff;border:1px solid #e0edf2;border-radius:25px;overflow:hidden;box-shadow:0 15px 44px rgba(24,80,108,.07);transition:transform .22s ease-out,box-shadow .3s,border-color .3s;transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d;position:relative}.product-card:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(94,211,240,.12),transparent 30%);pointer-events:none;opacity:0;transition:.3s}.product-card:hover{box-shadow:0 28px 62px rgba(24,80,108,.15);border-color:#c9e8f3}.product-card:hover:after{opacity:1}.product-card.hidden{display:none}.product-image{height:230px;overflow:hidden;background:#eef8fc;position:relative}.product-image img{width:100%;height:100%;object-fit:cover;transition:.55s}.product-card:hover .product-image img{transform:scale(1.055)}.product-image.soft img{object-fit:contain;padding:30px;background:#fff}.product-image.gradient{background:linear-gradient(145deg,#eafcff,#87daf2)}.product-image .contain{object-fit:contain;padding:20px}.product-badge{position:absolute;left:13px;top:13px;z-index:3;background:rgba(255,255,255,.91);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.8);border-radius:999px;padding:6px 9px;display:flex;align-items:center;gap:5px;font-size:9px;font-weight:850;color:var(--deep);box-shadow:0 8px 20px rgba(6,47,71,.08)}.product-badge svg{font-size:13px;color:var(--blue)}.product-body{padding:23px;position:relative;z-index:2}.tag{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--blue2);font-weight:900;display:flex;align-items:center;gap:5px}.tag svg{font-size:13px}.product-body h3{font-size:20px;line-height:1.16;margin:10px 0 12px}.product-body p{font-size:13px;color:var(--muted);min-height:62px}.mini-btn{font-size:12px;font-weight:900;color:var(--blue2);display:flex;align-items:center;gap:7px;padding-top:9px;border-top:1px solid #edf3f6}.mini-btn svg:first-child{font-size:15px}.mini-btn svg:last-child{font-size:14px;margin-left:auto;transition:.3s}.mini-btn:hover svg:last-child{transform:translate(2px,-2px)}.catalog-note{margin-top:29px;border-radius:22px;background:rgba(255,255,255,.89);padding:20px 23px;display:grid;grid-template-columns:52px 1fr auto;gap:16px;align-items:center;border:1px solid var(--line);box-shadow:var(--shadow-soft);backdrop-filter:blur(10px)}.note-icon{width:48px;height:48px;border-radius:14px;background:#e9faff;color:var(--blue);display:grid;place-items:center}.note-icon svg{font-size:22px}.catalog-note>div{display:flex;flex-direction:column}.catalog-note>div span{font-size:12px;color:var(--muted)}

.process{position:relative;overflow:hidden;background:linear-gradient(145deg,#052d4e,#064c7c);color:#fff}.process-bg{position:absolute;inset:-8%;opacity:.08;background:url('../img/pattern-bottles.png') center/cover;transform:scale(1.08);will-change:transform}.process:before{content:"";position:absolute;width:620px;height:620px;border-radius:50%;right:-260px;top:-220px;background:radial-gradient(circle,rgba(45,194,235,.2),transparent 64%)}.process .container{position:relative}.process .section-head{max-width:780px}.process .section-head p{color:#c7e6f1}.section-kicker.light{color:#83e4fb}.section-kicker.light>span{background:rgba(107,222,248,.1);border-color:rgba(107,222,248,.18);color:#8de7f8}.process-line{height:1px;background:rgba(255,255,255,.12);margin:38px 0 30px;position:relative;overflow:hidden}.process-line span{display:block;width:20%;height:100%;background:linear-gradient(90deg,transparent,#62d8f3,transparent);animation:lineRun 4s linear infinite}@keyframes lineRun{from{transform:translateX(-100%)}to{transform:translateX(600%)}}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.step{padding:25px 21px;border-radius:21px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11);min-height:205px;transition:.35s;backdrop-filter:blur(8px);position:relative;overflow:hidden}.step:after{content:"";position:absolute;inset:auto -30% -70% auto;width:150px;height:150px;border-radius:50%;background:rgba(45,191,230,.1);transition:.4s}.step:hover{transform:translateY(-7px);background:rgba(255,255,255,.09);border-color:rgba(112,218,247,.28)}.step:hover:after{transform:scale(1.5)}.step-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#14b3e0,#0b79ba);color:#fff;font-weight:900;margin-bottom:17px;box-shadow:0 12px 30px rgba(0,132,191,.22)}.step-icon svg{font-size:22px}.step small{display:block;font-size:8px;letter-spacing:.15em;color:#73d6ef;font-weight:900;margin-bottom:5px}.step b{display:block;font-size:17px;margin-bottom:7px}.step p{font-size:12px;color:#bcdce9}.process-wave{position:absolute;left:0;right:0;height:130px;opacity:.04;background:radial-gradient(100% 100% at 50% 100%,transparent 49%,#fff 50%,transparent 52%);background-size:280px 130px}.wave-top{top:-65px}.wave-bottom{bottom:-65px;transform:rotate(180deg)}

.reverse{grid-template-columns:.86fr 1.14fr}.quality-visual{position:relative;transform-style:preserve-3d;transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease-out}.quality-visual>img{height:545px;width:100%;object-fit:cover;border-radius:31px;box-shadow:var(--shadow)}.visual-gradient{position:absolute;inset:0;border-radius:31px;background:linear-gradient(180deg,transparent 56%,rgba(3,38,62,.58));pointer-events:none}.seal{position:absolute;right:-17px;bottom:-18px;width:170px;background:#fff;border-radius:50%;padding:11px;box-shadow:var(--shadow);z-index:3;animation:sealFloat 5s ease-in-out infinite}.seal img{border-radius:50%}@keyframes sealFloat{50%{transform:translateY(-8px) rotate(2deg)}}.quality-caption{position:absolute;left:22px;bottom:22px;display:flex;align-items:center;gap:10px;color:#fff;z-index:2}.quality-caption>svg{font-size:27px;color:#8ce7fa}.quality-caption span{display:flex;flex-direction:column}.quality-caption b{font-size:15px}.quality-caption small{font-size:10px;color:#d8eff6}.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0}.stats>div{background:#effaff;padding:16px;border-radius:17px;display:flex;align-items:center;gap:11px;border:1px solid #e0f1f7;transition:.3s}.stats>div:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(8,105,153,.08)}.stat-icon{width:41px;height:41px;border-radius:13px;background:#fff;color:var(--blue);display:grid;place-items:center;box-shadow:0 7px 18px rgba(9,101,145,.08)}.stats p{display:flex;flex-direction:column;margin:0}.stats strong{display:block;color:var(--deep);font-size:13px}.stats p span{font-size:10px;color:var(--muted)}

.coverage{background:linear-gradient(180deg,#fff,#effaff);overflow:hidden}.coverage-lines{position:absolute;inset:0;opacity:.13;background-image:linear-gradient(rgba(8,135,183,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(8,135,183,.18) 1px,transparent 1px);background-size:55px 55px;mask-image:linear-gradient(90deg,transparent,#000 42%,#000)}.coverage-grid{display:grid;grid-template-columns:1fr .9fr;gap:82px;align-items:center;position:relative}.city-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:28px 0}.city-grid span{background:rgba(255,255,255,.9);border:1px solid var(--line);border-radius:13px;padding:10px 11px;font-size:12px;font-weight:800;display:flex;align-items:center;gap:7px;transition:.28s}.city-grid span svg{font-size:14px;color:var(--green)}.city-grid span:hover{transform:translateY(-2px);border-color:#bde5f2;box-shadow:0 9px 21px rgba(10,107,150,.07)}.map-card{min-height:490px;border-radius:50%;position:relative;background:radial-gradient(circle at 40% 35%,#a8ecfa,#20adda 58%,#0874a9);box-shadow:0 34px 84px rgba(4,111,160,.28);display:grid;place-items:center;overflow:hidden;transform-style:preserve-3d;transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease-out}.map-card:before,.map-card:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.28);border-radius:50%}.map-card:before{inset:42px}.map-card:after{inset:94px}.radar-sweep{position:absolute;width:50%;height:50%;left:50%;top:0;transform-origin:left bottom;background:conic-gradient(from 0deg,rgba(255,255,255,.2),transparent 32%);animation:radar 6s linear infinite;opacity:.44}@keyframes radar{to{transform:rotate(360deg)}}.map-orbit{position:absolute;border-radius:50%;border:1px dashed rgba(255,255,255,.28);animation:ringSpin 20s linear infinite}.orbit-1{inset:70px}.orbit-2{inset:125px;animation-direction:reverse;animation-duration:14s}.map-center{width:188px;height:188px;border-radius:50%;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:2;box-shadow:0 20px 50px rgba(0,71,110,.25);transform:translateZ(18px)}.map-center img{width:76px}.map-center b{font-size:13px}.map-center span{font-size:9px;color:var(--muted);display:flex;align-items:center;gap:4px;margin-top:4px}.map-center span svg{color:var(--green)}.map-pin{position:absolute;z-index:3;color:#fff;width:33px;height:33px;border-radius:50%;background:var(--green);display:grid;place-items:center;box-shadow:0 9px 24px rgba(8,77,111,.23);animation:pinPulse 2.7s ease-in-out infinite}.map-pin svg{font-size:16px}.pin1{top:14%;left:37%}.pin2{top:38%;right:13%;animation-delay:-.8s}.pin3{bottom:20%;left:18%;animation-delay:-1.5s}.pin4{bottom:12%;right:32%;animation-delay:-2.2s}@keyframes pinPulse{50%{transform:translateY(-5px);box-shadow:0 14px 28px rgba(8,77,111,.27),0 0 0 8px rgba(23,204,7,.09)}}.map-status{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);z-index:4;background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.8);border-radius:999px;padding:7px 11px;font-size:9px;font-weight:800;color:var(--deep);display:flex;align-items:center;gap:7px;white-space:nowrap;box-shadow:0 10px 26px rgba(3,64,94,.11)}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(22,201,0,.12);animation:statusBlink 1.7s ease-in-out infinite}@keyframes statusBlink{50%{opacity:.45}}

.cta-band{padding:60px 0;background:linear-gradient(135deg,#079ed1,#0871ad);color:#fff;position:relative;overflow:hidden}.cta-band:before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent,rgba(255,255,255,.08),transparent 60%);transform:translateX(-100%);animation:ctaShine 7s ease-in-out infinite}@keyframes ctaShine{50%,100%{transform:translateX(100%)}}.cta-wrap{display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;z-index:2}.cta-wrap small{letter-spacing:.13em;font-weight:800;color:#c9f1fb;display:flex;align-items:center;gap:7px}.cta-wrap small svg{font-size:16px}.cta-wrap h2{font-size:34px;margin:6px 0 0;letter-spacing:-.025em}.cta-bubbles span{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);animation:bubbleUp 9s linear infinite}.cta-bubbles span:nth-child(1){width:55px;height:55px;left:8%;bottom:-70px}.cta-bubbles span:nth-child(2){width:28px;height:28px;left:25%;bottom:-35px;animation-delay:-3s}.cta-bubbles span:nth-child(3){width:78px;height:78px;right:16%;bottom:-90px;animation-delay:-5s}.cta-bubbles span:nth-child(4){width:36px;height:36px;right:5%;bottom:-45px;animation-delay:-1.5s}@keyframes bubbleUp{to{transform:translateY(-220px);opacity:0}}

.contact{background:#fff}.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:start}.contact-cards{display:grid;gap:10px;margin-top:30px}.contact-cards>a,.contact-cards>div{display:flex;align-items:center;gap:13px;padding:13px;border:1px solid var(--line);border-radius:17px;background:#fff;transition:.3s}.contact-cards>a:hover{transform:translateX(4px);border-color:#c7e8f2;box-shadow:0 10px 25px rgba(10,105,150,.07)}.contact-icon{width:44px;height:44px;border-radius:14px;background:#eaf9ff;color:var(--blue2);display:grid;place-items:center;font-weight:900}.contact-icon.green{background:#ecfce9;color:#19b706}.contact-icon svg{font-size:20px}.contact-cards div div,.contact-cards a div{display:flex;flex-direction:column}.contact-cards small{color:var(--muted)}.contact-arrow{margin-left:auto;color:#adc5cf;font-size:16px;transition:.3s}.contact-cards>a:hover .contact-arrow{color:var(--blue);transform:translate(2px,-2px)}.form-card{padding:31px;background:#fff;border:1px solid var(--line);border-radius:27px;box-shadow:var(--shadow);position:relative;overflow:hidden}.form-card:before{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-130px;top:-120px;background:rgba(58,194,232,.08)}.form-top{display:flex;align-items:center;gap:12px;padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--line);position:relative}.form-icon{width:45px;height:45px;border-radius:14px;background:linear-gradient(145deg,var(--blue3),var(--blue2));color:#fff;display:grid;place-items:center;box-shadow:0 10px 23px rgba(8,131,185,.2)}.form-top>div{display:flex;flex-direction:column}.form-top b{font-size:16px}.form-top small{color:var(--muted);font-size:10px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}label{display:grid;gap:7px;font-size:11px;font-weight:850;margin-bottom:13px}label>span{display:flex;align-items:center;gap:6px;color:#385667}label>span svg{font-size:14px;color:var(--blue2)}input,textarea,select{width:100%;border:1px solid #cddfe7;border-radius:13px;background:#fafdfe;padding:13px 14px;outline:none;color:var(--ink);transition:.25s}input:hover,textarea:hover,select:hover{border-color:#b8dbe8}input:focus,textarea:focus,select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(7,159,210,.1);background:#fff}.full{width:100%}.privacy{display:flex;align-items:center;justify-content:center;gap:5px;color:var(--muted);text-align:center;margin-top:10px;font-size:9px}.privacy svg{font-size:12px}.hp{position:absolute;left:-10000px}.form-alert{padding:12px 14px;border-radius:12px;margin-bottom:15px;font-size:12px;display:flex;align-items:center;gap:8px}.form-alert svg{font-size:18px}.success{background:#e7fae4;color:#24701b}.error{background:#fff0ee;color:#9b3426}

.site-footer{background:linear-gradient(150deg,#052a47,#031d31);color:#d9ecf5;padding:60px 0 22px;position:relative;overflow:hidden}.footer-glow{position:absolute;width:520px;height:520px;border-radius:50%;left:-220px;bottom:-360px;background:radial-gradient(circle,rgba(36,183,226,.15),transparent 66%)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:62px;position:relative}.footer-brand img{width:250px}.footer-brand p{max-width:380px;color:#a9cad8;font-size:13px}.footer-whatsapp{display:inline-flex;align-items:center;gap:7px;padding:9px 11px;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:11px;font-weight:800;color:#dff7ff!important}.footer-whatsapp svg:first-child{color:#63e759}.footer-whatsapp svg:last-child{margin-left:2px}.footer-grid>div:not(.footer-brand){display:flex;flex-direction:column;gap:8px}.footer-grid b{color:#fff;margin-bottom:8px;display:flex;align-items:center;gap:6px}.footer-grid b svg{color:#72dff6}.footer-grid a,.footer-grid span{font-size:12px;color:#b9d6e2;display:flex;align-items:center;gap:5px;transition:.25s}.footer-grid a svg,.footer-grid span svg{font-size:13px;color:#76b7d0}.footer-grid a:hover{color:#fff;transform:translateX(3px)}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:41px;padding-top:20px;display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#7fa9ba;position:relative}.footer-bottom span:last-child{display:flex;align-items:center;gap:5px}.footer-bottom svg{color:#64d7ef}
.whatsapp-float{position:fixed;left:22px;bottom:22px;z-index:80;background:linear-gradient(145deg,#27d765,#18b84f);color:#fff;border-radius:999px;padding:11px 15px;display:flex;gap:8px;align-items:center;box-shadow:0 15px 35px rgba(34,197,94,.29);font-size:12px;font-weight:800;transition:.3s}.whatsapp-float:hover{transform:translateY(-4px);box-shadow:0 20px 42px rgba(34,197,94,.35)}.whatsapp-float svg{font-size:20px}.wa-pulse{position:absolute;width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.38);left:18px;top:16px;animation:waPulse 2s ease-out infinite}@keyframes waPulse{to{transform:scale(4);opacity:0}}
.to-top{position:fixed;right:22px;bottom:22px;z-index:80;width:47px;height:47px;border:0;border-radius:50%;background:linear-gradient(145deg,#0a80ba,#075f93);color:#fff;box-shadow:0 12px 30px rgba(8,91,139,.25);opacity:0;pointer-events:none;transition:.28s;display:grid;place-items:center}.to-top.show{opacity:1;pointer-events:auto}.to-top:hover{transform:translateY(-4px)}.to-top svg{font-size:20px}

.reveal{opacity:0;transform:translateY(28px);transition:opacity .75s cubic-bezier(.2,.75,.2,1),transform .75s cubic-bezier(.2,.75,.2,1)}.reveal-left{transform:translateX(-34px)}.reveal-right{transform:translateX(34px)}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.09s}.delay-2{transition-delay:.18s}.delay-3{transition-delay:.27s}

@media(max-width:1120px){.main-nav{gap:1px}.main-nav>a{padding:10px 8px;font-size:11px}.main-nav>a svg{font-size:14px}.brand img{width:190px}.hero-grid{gap:56px}.product-grid{grid-template-columns:repeat(2,1fr)}.process-grid{grid-template-columns:repeat(2,1fr)}}
.developer-credit{display:flex!important;align-items:center;gap:10px;color:#a9cad8!important;text-decoration:none;padding:7px 10px 7px 12px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.045);border-radius:12px;transition:.28s ease}.developer-credit:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18);transform:translateY(-2px)!important;color:#fff!important}.developer-credit .developer-label{display:flex;align-items:center;gap:6px;font-size:9px!important;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#8fb7c7}.developer-credit .developer-label svg{width:14px;height:14px;color:#64d7ef}.developer-credit img{width:150px;height:auto;display:block}.developer-credit .developer-link-icon{width:15px;height:15px;color:#f6d500;transition:.25s}.developer-credit:hover .developer-link-icon{transform:translate(2px,-2px)}
@media(max-width:900px){.container{width:min(100% - 30px,1220px)}.nav-wrap{height:76px}.brand img{width:178px}.menu-toggle{display:flex}.main-nav{position:absolute;top:76px;left:15px;right:15px;display:none;flex-direction:column;align-items:stretch;background:rgba(255,255,255,.98);padding:13px;border-radius:18px;box-shadow:0 24px 55px rgba(0,41,67,.16);border:1px solid #e3eef3}.main-nav.open{display:flex;animation:menuIn .24s ease-out}.main-nav>a{font-size:13px;padding:11px 12px}.main-nav>a svg{font-size:17px}.nav-cta{margin:5px 0 0!important;justify-content:center}@keyframes menuIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}.hero{min-height:auto;padding:125px 0 112px}.hero-grid,.split,.reverse,.coverage-grid,.contact-grid{grid-template-columns:1fr;gap:52px}.hero-visual{justify-self:center}.trust-grid{grid-template-columns:1fr 1fr;transform:translateY(-18px)}.trust-item:nth-child(2){border-right:0}.trust-item:nth-child(-n+2){border-bottom:1px solid var(--line)}.image-stack{min-height:510px}.section{padding:82px 0}.process-grid{grid-template-columns:1fr 1fr}.quality-visual{order:-1}.catalog-note{grid-template-columns:52px 1fr}.catalog-note .btn{grid-column:1/-1;width:max-content}.cta-wrap{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.floating-chip{display:none}}
@media(max-width:600px){.container{width:min(100% - 24px,1220px)}.site-header{background:rgba(255,255,255,.92)}.brand img{width:160px}.menu-toggle span{display:none}.menu-toggle{width:43px;height:43px;justify-content:center;padding:0}.hero-bg{background:linear-gradient(180deg,rgba(3,46,73,.89),rgba(3,46,73,.73)),url('../img/hero-water.jpg') center/cover no-repeat}.hero-grid{gap:38px}.hero-copy{text-align:center}.eyebrow{justify-content:center;font-size:9px}.hero-copy>p{font-size:15px}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions .btn{width:100%}.hero-facts{justify-content:center;gap:7px}.fact{padding:8px 10px}.fact-icon{width:35px;height:35px}.fact b{font-size:15px}.fact small{font-size:8px}.hero-visual{width:92%}.hero-card{padding:20px}.hero-logo{width:215px}.drop-card{height:250px}.drop-card img{height:230px}.hero-ring{display:none}.trust-grid{grid-template-columns:1fr}.trust-item{border-right:0;border-bottom:1px solid var(--line)!important}.trust-item:last-child{border-bottom:0!important}.product-grid,.process-grid,.field-row,.city-grid,.stats{grid-template-columns:1fr}.product-body p{min-height:0}.section-copy h2,.section-head h2,.coverage-copy h2,.contact-info h2{font-size:37px}.frame-main{width:93%;height:390px}.frame-small{height:165px;width:45%}.image-stack{min-height:455px}.floating-badge{width:105px;height:105px}.floating-badge strong{font-size:24px}.mini-stat{bottom:8px;left:1%;padding:9px}.catalog-filters{justify-content:flex-start;overflow:auto;flex-wrap:nowrap;padding-bottom:5px;scrollbar-width:none}.catalog-filters::-webkit-scrollbar{display:none}.filter{white-space:nowrap}.catalog-note{grid-template-columns:1fr}.note-icon{display:none}.catalog-note .btn{grid-column:auto;width:100%}.map-card{min-height:350px;width:350px;max-width:100%;justify-self:center}.map-center{width:145px;height:145px}.map-center img{width:58px}.map-card:before{inset:32px}.map-card:after{inset:68px}.orbit-1{inset:52px}.orbit-2{inset:89px}.map-status{bottom:25px}.cta-wrap h2{font-size:28px}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.footer-bottom{flex-direction:column}.whatsapp-float b{display:none}.whatsapp-float{width:50px;height:50px;padding:0;justify-content:center}.wa-pulse{left:20px;top:19px}.to-top{bottom:22px}.section-watermark{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none!important}.hero-bg,.process-bg{transform:scale(1.08)!important}.hero-visual,.product-card,.quality-visual,.map-card{transform:none!important}}

@media(max-width:600px){.developer-credit{width:100%;justify-content:space-between;padding:9px 10px}.developer-credit img{width:142px}.developer-credit .developer-label{font-size:8px!important}.footer-bottom{align-items:stretch}}

/* =========================================================
   RESPONSIVE UX V2.2 — menú off-canvas + ajustes mobile/tablet
   ========================================================= */
.mobile-nav-head,.menu-close,.nav-backdrop{display:none}
body.menu-open{overflow:hidden}
.main-nav,.main-nav *{min-width:0}
.hero-copy,.section-copy,.coverage-copy,.contact-info,.form-card,.product-card,.process-card,.footer-grid>div{min-width:0}

@media (max-width:1180px){
  html{scroll-padding-top:88px}
  .container{width:min(100% - 34px,1220px)}
  .nav-wrap{height:80px;gap:18px}
  .brand{z-index:102}
  .brand img{width:190px;max-height:54px}
  .menu-toggle{display:inline-flex;min-width:104px;min-height:44px;justify-content:center;z-index:102;box-shadow:0 7px 20px rgba(6,58,103,.08);transition:.25s ease}
  .menu-toggle:hover{border-color:#b9deea;background:#f4fbfe}
  .menu-toggle:active{transform:scale(.97)}

  .mobile-nav-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:2px 2px 19px;margin-bottom:5px;border-bottom:1px solid var(--line)}
  .mobile-nav-head>div{display:flex;flex-direction:column;gap:3px}
  .mobile-nav-head small{font-size:9px;letter-spacing:.15em;font-weight:900;color:var(--blue2)}
  .mobile-nav-head strong{display:flex;align-items:center;gap:8px;font-size:18px;color:var(--deep)}
  .mobile-nav-head strong svg{width:19px;height:19px;color:var(--blue)}
  .menu-close{display:grid;width:44px;height:44px;place-items:center;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--deep);cursor:pointer;transition:.22s}
  .menu-close:hover{background:#effaff;color:var(--blue2);transform:rotate(4deg)}
  .menu-close svg{width:21px;height:21px}

  .main-nav{
    position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;
    width:min(410px,90vw)!important;height:100dvh;display:flex!important;flex-direction:column;align-items:stretch;
    gap:7px!important;padding:24px 20px calc(24px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.985)!important;border:0!important;border-left:1px solid rgba(8,105,153,.12)!important;
    border-radius:0!important;box-shadow:-25px 0 70px rgba(3,44,70,.18)!important;
    overflow-y:auto;overscroll-behavior:contain;z-index:106;
    opacity:0;visibility:hidden;pointer-events:none;transform:translate3d(104%,0,0);
    transition:transform .36s cubic-bezier(.2,.75,.2,1),opacity .25s ease,visibility .36s;
  }
  .main-nav.open{opacity:1;visibility:visible;pointer-events:auto;transform:translate3d(0,0,0)!important;animation:none!important}
  .main-nav>a{width:100%;min-height:50px;padding:11px 13px!important;border-radius:14px!important;font-size:14px!important;justify-content:flex-start;border:1px solid transparent}
  .main-nav>a svg{width:19px;height:19px;font-size:19px!important;color:var(--blue2)}
  .main-nav>a:not(.nav-cta):hover,.main-nav>a.active{background:#edf9fd;border-color:#d9eef5}
  .main-nav>a:not(.nav-cta):before{content:"";width:3px;height:22px;border-radius:4px;background:transparent;transition:.25s}
  .main-nav>a.active:before{background:var(--green)}
  .main-nav .nav-cta{margin:9px 0 0!important;min-height:54px;justify-content:center!important;font-size:13px!important;box-shadow:0 12px 30px rgba(22,201,0,.22)}

  .nav-backdrop{display:block;position:fixed;inset:0;z-index:99;border:0;background:rgba(2,28,46,.46);backdrop-filter:blur(4px);opacity:0;visibility:hidden;pointer-events:none;transition:.3s ease}
  .nav-backdrop.show{opacity:1;visibility:visible;pointer-events:auto}

  .hero{padding-top:130px}
  .hero-grid{gap:52px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:900px){
  .hero{padding:118px 0 105px}
  .hero-grid,.split,.reverse,.coverage-grid,.contact-grid{grid-template-columns:minmax(0,1fr);gap:48px}
  .hero-visual{justify-self:center;width:min(440px,90%)}
  .section{padding:76px 0}
  .quality-visual{order:-1}
  .footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:38px}
  .footer-brand{grid-column:1/-1}
  .cta-wrap{align-items:flex-start;flex-direction:column}
}

@media (max-width:720px){
  .container{width:min(100% - 28px,1220px)}
  .process-grid{grid-template-columns:minmax(0,1fr)}
  .process-card{min-height:auto}
  .city-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-note{grid-template-columns:48px minmax(0,1fr)}
  .catalog-note .btn{grid-column:1/-1;width:100%}
  .form-card{padding:25px}
  .field-row{grid-template-columns:minmax(0,1fr)}
}

@media (max-width:600px){
  html{scroll-padding-top:76px}
  .container{width:min(100% - 22px,1220px)}
  .nav-wrap{height:70px}
  .brand img{width:156px;max-height:48px}
  .menu-toggle{width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border-radius:13px}
  .menu-toggle span{display:none}
  .main-nav{width:min(365px,92vw)!important;padding:20px 16px calc(20px + env(safe-area-inset-bottom))}
  .main-nav>a{min-height:51px;font-size:14px!important}

  .hero{padding:104px 0 92px}
  .hero-copy{text-align:center}
  h1{font-size:clamp(42px,13.8vw,58px);line-height:.98;margin:20px 0 23px}
  .eyebrow{justify-content:center;font-size:9px;line-height:1.35}
  .hero-copy>p{font-size:15px;line-height:1.65}
  .hero-actions{flex-direction:column;align-items:stretch;margin:27px 0 26px}
  .hero-actions .btn{width:100%;min-height:52px}
  .hero-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .fact{min-width:0;padding:8px;justify-content:center;gap:7px}
  .fact-icon{width:34px;height:34px;flex:0 0 34px}
  .fact p{min-width:0;text-align:left}
  .fact b{font-size:14px;white-space:nowrap}
  .fact small{font-size:8px;line-height:1.2}
  .hero-visual{width:min(360px,96%)}
  .hero-card{padding:18px;border-radius:28px}
  .hero-logo{width:min(215px,76%)}
  .drop-card{height:235px}.drop-card img{height:215px}.drop-glow{width:205px;height:205px}
  .hero-card-chips{flex-wrap:wrap}
  .live-pill{font-size:9px}

  .trust-grid{grid-template-columns:minmax(0,1fr)}
  .trust-item{min-height:78px}
  .section-copy h2,.section-head h2,.coverage-copy h2,.contact-info h2{font-size:clamp(34px,10vw,43px);overflow-wrap:anywhere}
  .section-copy>p,.section-head>p,.coverage-copy>p,.contact-info>p{font-size:15px}
  .product-grid{grid-template-columns:minmax(0,1fr)}
  .product-image{height:245px}
  .product-body p{min-height:0}
  .catalog-filters{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding:2px 1px 8px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .filter{white-space:nowrap;scroll-snap-align:start;min-height:42px}
  .map-card{width:min(350px,100%);min-height:auto;aspect-ratio:1/1;justify-self:center}
  .cta-wrap .btn{width:100%}
  .footer-grid{grid-template-columns:minmax(0,1fr);gap:30px}
  .footer-brand{grid-column:auto}
  .footer-bottom{flex-direction:column;align-items:stretch}
  .developer-credit{width:100%;justify-content:space-between}
  .developer-credit img{width:min(145px,44vw)}
  .whatsapp-float{left:14px;bottom:14px;width:50px;height:50px;padding:0;justify-content:center}
  .whatsapp-float b{display:none}
  .to-top{right:14px;bottom:14px}
}

@media (max-width:480px){
  .site-header{background:rgba(255,255,255,.94)}
  .main-nav{width:100%!important;max-width:none!important}
  .brand img{width:145px}
  .section{padding:66px 0}
  .hero{padding-top:98px}
  .hero-facts{grid-template-columns:minmax(0,1fr);max-width:315px;margin-inline:auto}
  .fact{justify-content:flex-start;padding:9px 12px}
  .fact p{text-align:left}

  .image-stack{min-height:430px}
  .frame-main{width:100%;height:350px;border-radius:25px}
  .frame-small{display:none}
  .floating-badge{width:98px;height:98px;right:8px;top:265px;border-width:5px}
  .floating-badge strong{font-size:23px}
  .mini-stat{left:8px;bottom:4px;right:8px;width:auto}

  .feature-list>div{grid-template-columns:44px minmax(0,1fr);padding:11px}
  .feature-arrow{display:none}
  .city-grid{grid-template-columns:minmax(0,1fr)}
  .catalog-note{grid-template-columns:minmax(0,1fr);padding:18px}
  .note-icon{display:none}
  .form-card{padding:20px;border-radius:22px}
  .form-top{align-items:flex-start}
  .contact-cards>a,.contact-cards>div{padding:11px}
  .contact-cards b{font-size:13px;overflow-wrap:anywhere}
  .cta-band{padding:48px 0}
  .cta-wrap h2{font-size:26px;line-height:1.1}
  .site-footer{padding-top:50px}
}

@media (max-width:360px){
  .container{width:min(100% - 18px,1220px)}
  .brand img{width:132px}
  h1{font-size:40px}
  .hero-card{padding:15px}
  .drop-card{height:215px}.drop-card img{height:196px}
  .section-copy h2,.section-head h2,.coverage-copy h2,.contact-info h2{font-size:32px}
  .developer-credit{gap:6px;padding:8px}
  .developer-credit .developer-label{font-size:7px!important}
}

@media (max-height:560px) and (orientation:landscape) and (max-width:980px){
  .main-nav{padding-top:14px;gap:4px}
  .mobile-nav-head{padding-bottom:10px;margin-bottom:2px}
  .main-nav>a{min-height:42px;padding-block:8px!important}
  .main-nav .nav-cta{min-height:46px}
}

@media (hover:none){
  .nav-cta:hover,.btn:hover,.product-card:hover,.trust-item:hover,.feature-list>div:hover,.city-grid span:hover,.contact-cards>a:hover{transform:none}
}

/* =========================================================
   ABOUT FIX V2.3 — jerarquía correcta + sello estable
   ========================================================= */
.about{
  overflow:hidden;
  isolation:isolate;
  background:linear-gradient(180deg,#ffffff 0%,#fbfeff 100%);
}
.about .container{
  position:relative;
  z-index:3;
}
.about .split{
  grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  gap:72px;
}
.section-watermark{
  z-index:0;
  right:-1.5%;
  top:20px;
  color:rgba(7,159,210,.075);
  font-size:clamp(92px,13vw,196px);
  letter-spacing:-.075em;
  line-height:.9;
  opacity:1;
  white-space:nowrap;
}
.about .image-stack,
.about .section-copy{
  position:relative;
  z-index:2;
}
.about .section-copy{
  background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.93) 72%,rgba(255,255,255,.82) 100%);
  border-radius:28px;
  padding:28px 28px 30px;
  box-shadow:0 18px 55px rgba(8,67,100,.045);
}
.about .section-copy h2{
  position:relative;
  z-index:2;
  margin-bottom:24px;
}
.about .section-copy>p,
.about .feature-list,
.about .btn{
  position:relative;
  z-index:2;
}
.about .image-stack{
  width:100%;
  min-height:570px;
}
.about .frame-main{
  left:0;
  top:0;
  width:92%;
  height:500px;
  border-radius:32px;
}
.about .frame-small{
  right:0;
  bottom:0;
  width:42%;
  height:210px;
}
.about .floating-badge{
  right:18px;
  top:26px;
  width:122px;
  height:122px;
  border:5px solid #fff;
  box-shadow:0 18px 42px rgba(22,201,0,.22),0 0 0 1px rgba(15,173,0,.08);
  z-index:8;
  animation:badgeFloatV23 4.8s ease-in-out infinite;
}
.about .floating-badge:before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(255,255,255,.48);
  border-radius:50%;
  pointer-events:none;
}
.about .floating-badge svg{width:17px;height:17px;margin-bottom:3px}
.about .floating-badge span{font-size:7px;letter-spacing:.16em}
.about .floating-badge strong{font-size:29px;line-height:1.02}
.about .floating-badge small{font-size:7px;letter-spacing:.08em;max-width:88px;line-height:1.2}
@keyframes badgeFloatV23{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%{transform:translateY(-6px) rotate(1deg)}
}
.about .mini-stat{
  left:18px;
  bottom:18px;
  z-index:7;
}

@media (max-width:1080px){
  .about .split{grid-template-columns:minmax(0,1fr);gap:42px}
  .about .image-stack{width:min(700px,100%);min-height:540px;margin-inline:auto}
  .about .section-copy{width:min(760px,100%);margin-inline:auto;padding:24px}
  .section-watermark{font-size:clamp(84px,17vw,160px);top:32px;right:-3%}
}

@media (max-width:600px){
  .about{overflow:hidden}
  .about .section-copy{padding:20px 16px 22px;border-radius:22px;box-shadow:none;background:rgba(255,255,255,.94)}
  .about .image-stack{min-height:425px}
  .about .frame-main{width:100%;height:390px;border-radius:26px}
  .about .frame-small{display:none}
  .about .floating-badge{width:96px;height:96px;right:12px;top:18px;border-width:4px}
  .about .floating-badge strong{font-size:23px}
  .about .floating-badge span,.about .floating-badge small{font-size:6px}
  .about .mini-stat{left:12px;right:12px;bottom:10px;width:auto}
  .section-watermark{display:block;font-size:76px;top:18px;right:-16%;color:rgba(7,159,210,.05)}
}

@media (max-width:420px){
  .about .image-stack{min-height:390px}
  .about .frame-main{height:350px}
  .about .floating-badge{width:88px;height:88px;right:10px;top:14px}
  .about .floating-badge strong{font-size:21px}
  .section-watermark{font-size:64px;right:-20%}
}


/* =========================================================
   MOBILE EXPERIENCE V2.4 — hero premium + menú estilo Sócrates
   ========================================================= */
.brand-logo-white{display:none}
.mobile-nav-bottom{display:none}
.hamburger-lines{width:22px;height:16px;display:flex;flex-direction:column;justify-content:space-between;flex:0 0 22px}
.hamburger-lines>span{display:block;width:100%;height:2px;border-radius:999px;background:currentColor;transform-origin:center;transition:transform .28s cubic-bezier(.2,.75,.2,1),opacity .18s ease,width .2s ease}
.menu-toggle.open .hamburger-lines>span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.open .hamburger-lines>span:nth-child(2){opacity:0;width:0}
.menu-toggle.open .hamburger-lines>span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:1180px){
  .menu-toggle{gap:9px}
}

@media (max-width:720px){
  /* Header flotante/transparente sobre el hero, como la navegación móvil de Sócrates */
  .site-header{background:linear-gradient(180deg,rgba(2,29,49,.88),rgba(2,29,49,.42));border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px) saturate(130%)}
  .site-header.scrolled{background:rgba(255,255,255,.96);border-bottom-color:rgba(8,105,153,.10);box-shadow:0 12px 34px rgba(3,44,70,.13)}
  .brand{height:52px}
  .brand-logo{grid-area:1/1;transition:opacity .22s ease,transform .22s ease}
  .brand-logo-color{opacity:0;pointer-events:none}
  .brand-logo-white{display:block;opacity:1;pointer-events:auto;width:168px;max-height:52px;object-fit:contain}
  .site-header.scrolled .brand-logo-color{opacity:1;pointer-events:auto}
  .site-header.scrolled .brand-logo-white{opacity:0;pointer-events:none}
  .menu-toggle{border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.10);color:#fff;box-shadow:none;backdrop-filter:blur(12px)}
  .site-header.scrolled .menu-toggle{border-color:#d3e7ef;background:#fff;color:var(--deep);box-shadow:0 7px 20px rgba(6,58,103,.08)}

  /* Fullscreen menu: dark, clean, with large icon rows */
  .main-nav{
    width:100%!important;max-width:none!important;left:0!important;right:0!important;
    padding:22px 18px calc(24px + env(safe-area-inset-bottom))!important;
    background:
      radial-gradient(circle at 88% 12%,rgba(25,185,231,.18),transparent 24%),
      radial-gradient(circle at 10% 92%,rgba(22,201,0,.10),transparent 27%),
      linear-gradient(155deg,#073a60 0%,#042b49 48%,#031d31 100%)!important;
    border:0!important;box-shadow:none!important;color:#fff;
    transform:translate3d(0,-4%,0) scale(.985);opacity:0;
    transition:transform .34s cubic-bezier(.2,.75,.2,1),opacity .25s ease,visibility .34s;
  }
  .main-nav.open{transform:translate3d(0,0,0) scale(1)!important}
  .main-nav:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background-image:radial-gradient(circle,rgba(255,255,255,.75) 1px,transparent 1.3px);background-size:27px 27px;mask-image:linear-gradient(180deg,#000,transparent 78%)}
  .mobile-nav-head{position:relative;z-index:1;padding:0 0 20px;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.12)}
  .mobile-menu-brand{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
  .mobile-menu-brand img{width:174px;height:auto;max-height:64px;object-fit:contain}
  .mobile-menu-brand small{font-size:8px;letter-spacing:.20em;color:#8edff4;font-weight:900}
  .menu-close{width:46px;height:46px;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.08);border-radius:14px;position:relative;color:#fff}
  .menu-close span:before,.menu-close span:after{content:"";position:absolute;left:13px;top:22px;width:20px;height:2px;border-radius:999px;background:#fff}
  .menu-close span:before{transform:rotate(45deg)}.menu-close span:after{transform:rotate(-45deg)}

  .main-nav>a{position:relative;z-index:1;color:#eefaff!important;min-height:56px!important;padding:10px 12px!important;border:1px solid rgba(255,255,255,.075)!important;background:rgba(255,255,255,.045);border-radius:15px!important;font-size:15px!important;font-weight:800;letter-spacing:-.01em}
  .main-nav>a svg{width:20px;height:20px!important;color:#74ddf6!important;filter:drop-shadow(0 0 12px rgba(61,200,238,.12))}
  .main-nav>a:not(.nav-cta):after{content:"→";margin-left:auto;font-size:18px;font-weight:500;color:rgba(255,255,255,.34);transition:.2s ease}
  .main-nav>a:not(.nav-cta):before{width:4px!important;height:24px!important;background:rgba(255,255,255,.11)!important}
  .main-nav>a:not(.nav-cta):hover,.main-nav>a.active{background:rgba(54,189,229,.13)!important;border-color:rgba(112,220,246,.19)!important;color:#fff!important}
  .main-nav>a.active:before{background:var(--green)!important;box-shadow:0 0 14px rgba(22,201,0,.45)}
  .main-nav>a.active:after{color:#8de8fb;transform:translateX(3px)}
  .main-nav .nav-cta{margin-top:8px!important;min-height:58px!important;background:linear-gradient(135deg,#22d815,#12ad08)!important;border:0!important;color:#fff!important;box-shadow:0 13px 34px rgba(13,175,0,.25)!important}
  .main-nav .nav-cta svg{color:#fff!important}
  .mobile-nav-bottom{position:relative;z-index:1;margin-top:auto;padding:20px 4px 0;border-top:1px solid rgba(255,255,255,.10);display:flex;flex-direction:column;gap:4px;color:#d8f3fb}
  .mobile-nav-bottom>span{font-size:12px!important;font-weight:850;color:#fff!important;display:flex;align-items:center;gap:7px}.mobile-nav-bottom>span svg{color:#70daf4}
  .mobile-nav-bottom small{font-size:9px;color:#87aebe;letter-spacing:.04em}
  .nav-backdrop{background:rgba(1,20,34,.66);backdrop-filter:blur(7px)}

  /* Nuevo hero móvil: agua real, profundidad azul y mejor encuadre */
  .hero{min-height:100svh;padding:112px 0 80px;background:#042d4a;align-items:flex-start}
  .hero-bg{
    inset:0!important;
    background:
      linear-gradient(180deg,rgba(2,28,47,.73) 0%,rgba(3,48,76,.72) 38%,rgba(3,48,76,.88) 72%,#043353 100%),
      url('../img/water-pour.jpg') 53% center/cover no-repeat!important;
    transform:none!important;filter:saturate(.92) contrast(1.03);
  }
  .hero-mesh{background:radial-gradient(circle at 86% 19%,rgba(87,213,246,.31),transparent 24%),radial-gradient(circle at 8% 67%,rgba(22,201,0,.13),transparent 28%),linear-gradient(180deg,transparent 62%,rgba(1,25,42,.24))}
  .hero:before{content:"REACTÍVATE";position:absolute;left:-5px;right:0;top:82px;z-index:-2;font-size:clamp(60px,20vw,92px);line-height:.8;font-weight:950;letter-spacing:-.075em;color:rgba(255,255,255,.052);white-space:nowrap;pointer-events:none}
  .hero:after{height:72px;background:linear-gradient(177deg,transparent 48%,#fff 49%)}
  .hero-dots{opacity:.12;background-size:24px 24px;mask-image:linear-gradient(180deg,#000,transparent 70%)}
  .water-orb.orb-a{width:54px;height:54px;left:-10px;top:27%}.water-orb.orb-b{width:34px;height:34px;left:auto;right:9%;bottom:26%}.water-orb.orb-c{display:none}
  .hero-grid{gap:34px}
  .hero-copy{text-align:left;padding-top:6px}
  .eyebrow{justify-content:flex-start;color:#c9f5ff;font-size:9px;max-width:310px}
  h1{font-size:clamp(43px,13.5vw,60px);line-height:.94;margin:22px 0 21px;max-width:540px;text-wrap:balance}
  .hero-copy>p{font-size:15px;line-height:1.65;max-width:520px;color:#e4f6fb}
  .hero-actions{gap:10px;margin:27px 0 25px}
  .hero-actions .btn{border-radius:15px;min-height:53px}
  .hero-facts{grid-template-columns:minmax(0,1fr)!important;max-width:100%!important;margin:0!important;gap:8px}
  .fact{justify-content:flex-start!important;background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.12);border-radius:14px;padding:9px 11px!important}
  .fact p{text-align:left!important}.fact b{color:#fff}.fact small{color:#c4e7f0}
  .hero-visual{width:min(330px,94%);margin:6px auto 0}
  .hero-card{background:linear-gradient(155deg,rgba(7,145,195,.57),rgba(2,45,75,.72));border-color:rgba(255,255,255,.18);box-shadow:0 28px 70px rgba(1,25,44,.30)}
  .scroll-cue{display:none}
}

@media (max-width:480px){
  .brand-logo-white{width:148px}.brand-logo-color{width:145px}
  .hero{padding-top:102px;padding-bottom:74px}
  .hero:before{top:78px;font-size:22vw}
  .hero-bg{background-position:58% center!important}
  .hero-visual{width:min(310px,96%)}
  .hero-card{padding:16px;border-radius:24px}
  .hero-logo{width:min(192px,72%)}
  .drop-card{height:205px}.drop-card img{height:188px}.drop-glow{width:182px;height:182px}
  .mobile-menu-brand img{width:158px}
  .main-nav{padding-inline:14px!important}
}

@media (max-width:720px){
  .brand{display:grid;align-items:center;justify-items:start}
  .brand .brand-logo-color,.brand .brand-logo-white{grid-area:1/1}
}

/* =========================================================
   PROCESS + FLOATING CONTROLS V2.5
   - transición limpia sin franja superior
   - tarjetas de proceso premium
   - back-to-top contenido dentro del viewport móvil
   ========================================================= */
.process{
  background:
    radial-gradient(circle at 86% 8%,rgba(50,202,238,.13),transparent 28%),
    radial-gradient(circle at 5% 92%,rgba(22,201,0,.055),transparent 25%),
    linear-gradient(145deg,#073d63 0%,#0a507b 48%,#0a527b 100%);
  border-top:0;
}
.process-wave{display:none!important}
.process:before{
  width:560px;height:560px;right:-230px;top:-180px;
  background:radial-gradient(circle,rgba(66,205,239,.12),transparent 66%);
}
.process .section-head{padding-top:0}
.process-line{
  margin:36px 0 28px;
  background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(109,221,247,.20),rgba(255,255,255,.04));
}
.process-grid{
  counter-reset:reactivate-step;
  gap:18px;
}
.process .step{
  counter-increment:reactivate-step;
  min-height:218px;
  padding:25px 23px 23px;
  border:1px solid transparent;
  border-radius:24px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.052)) padding-box,
    linear-gradient(145deg,rgba(111,224,249,.34),rgba(255,255,255,.10) 48%,rgba(38,211,28,.17)) border-box;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 17px 38px rgba(1,31,51,.14);
  backdrop-filter:blur(14px) saturate(125%);
  isolation:isolate;
  overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.75,.2,1),box-shadow .35s ease,background .35s ease,border-color .35s ease;
}
.process .step:before{
  content:"0" counter(reactivate-step);
  position:absolute;
  right:16px;
  top:3px;
  z-index:-1;
  font-size:74px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.08em;
  color:rgba(207,244,252,.065);
  text-shadow:0 0 38px rgba(106,222,248,.05);
  pointer-events:none;
  transition:transform .35s ease,color .35s ease;
}
.process .step:after{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  width:auto;height:3px;
  border-radius:24px 24px 0 0;
  background:linear-gradient(90deg,var(--cyan),var(--blue3) 55%,rgba(22,201,0,.75));
  opacity:.72;
  transform:none;
  transition:opacity .3s ease,filter .3s ease;
}
.process .step:nth-child(even):after{
  background:linear-gradient(90deg,var(--blue3),#73ddf5 58%,rgba(22,201,0,.55));
}
.process .step:hover{
  transform:translateY(-8px);
  background:
    linear-gradient(145deg,rgba(255,255,255,.145),rgba(255,255,255,.075)) padding-box,
    linear-gradient(145deg,rgba(112,229,251,.58),rgba(255,255,255,.16) 48%,rgba(56,220,45,.28)) border-box;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 25px 58px rgba(1,27,47,.23),
    0 0 0 1px rgba(91,214,243,.045);
}
.process .step:hover:before{transform:translateY(-3px) scale(1.04);color:rgba(207,244,252,.10)}
.process .step:hover:after{opacity:1;filter:drop-shadow(0 0 8px rgba(75,213,244,.46))}
.process .step-icon{
  position:relative;
  width:53px;height:53px;
  margin-bottom:20px;
  border-radius:17px;
  background:linear-gradient(145deg,#1bc1e9,#0785c3);
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 14px 30px rgba(0,111,169,.25),inset 0 1px 0 rgba(255,255,255,.22);
  overflow:visible;
}
.process .step-icon:before{
  content:"";
  position:absolute;inset:-6px;
  border:1px solid rgba(104,224,249,.12);
  border-radius:21px;
  pointer-events:none;
}
.process .step-icon svg{width:23px;height:23px;stroke-width:1.8}
.process .step small{
  display:inline-flex;
  align-items:center;
  min-height:21px;
  padding:4px 8px;
  margin-bottom:9px;
  border-radius:999px;
  background:rgba(92,218,246,.09);
  border:1px solid rgba(103,222,247,.12);
  color:#82e2f7;
  font-size:8px;
  line-height:1;
  letter-spacing:.14em;
}
.process .step b{
  max-width:86%;
  margin-bottom:9px;
  font-size:18px;
  line-height:1.18;
  letter-spacing:-.025em;
  color:#fff;
}
.process .step p{
  max-width:92%;
  margin:0;
  font-size:12.5px;
  line-height:1.55;
  color:#c9e4ee;
}

/* El control debe permanecer siempre completamente dentro del viewport. */
.to-top{
  right:max(18px,env(safe-area-inset-right));
  bottom:max(18px,env(safe-area-inset-bottom));
  width:47px;height:47px;
  max-width:calc(100vw - 24px);
  max-height:calc(100vh - 24px);
  margin:0;
  transform:none;
}
.to-top.show{transform:none}

@media(max-width:720px){
  .process{background:linear-gradient(160deg,#073d63 0%,#09527d 100%)}
  .process .section-head{max-width:100%}
  .process-line{margin:29px 0 24px}
  .process-grid{gap:13px}
  .process .step{min-height:0;padding:21px 19px 20px;border-radius:21px}
  .process .step:before{right:13px;top:7px;font-size:62px}
  .process .step-icon{width:49px;height:49px;border-radius:15px;margin-bottom:17px}
  .process .step b{font-size:17px;max-width:88%}
  .process .step p{font-size:12px;max-width:96%}
  .to-top{
    position:fixed!important;
    right:max(12px,env(safe-area-inset-right))!important;
    bottom:max(12px,env(safe-area-inset-bottom))!important;
    width:46px!important;height:46px!important;
    min-width:46px!important;min-height:46px!important;
    max-width:46px!important;max-height:46px!important;
    border-radius:50%!important;
    margin:0!important;
    transform:none!important;
    overflow:hidden;
    box-sizing:border-box;
  }
  .to-top.show{transform:none!important}
}

@media(max-width:420px){
  .process .step{padding:19px 17px 18px}
  .process .step:before{font-size:56px;right:12px;top:7px}
  .to-top{right:max(10px,env(safe-area-inset-right))!important;bottom:max(10px,env(safe-area-inset-bottom))!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;max-width:44px!important;max-height:44px!important}
}

/* =========================================================
   MOBILE HEADER SAFETY V2.6
   Mantiene hamburguesa y menú siempre dentro del viewport.
   ========================================================= */
@media (max-width:720px){
  .site-header{
    width:100%;
    max-width:100vw;
    overflow:visible;
  }

  .site-header .nav-wrap{
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    padding-left:max(14px, env(safe-area-inset-left))!important;
    padding-right:max(14px, env(safe-area-inset-right))!important;
    gap:10px!important;
    overflow:visible;
  }

  .site-header .brand{
    min-width:0;
    max-width:calc(100% - 56px);
    flex:1 1 auto;
  }

  .site-header .brand img{
    max-width:min(168px,100%)!important;
  }

  .menu-toggle{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    margin:0 0 0 auto!important;
    flex:0 0 44px!important;
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
    padding:0!important;
    box-sizing:border-box!important;
    transform:none!important;
    overflow:hidden!important;
    z-index:110!important;
  }

  /* Oculta sólo la palabra “Menú”, no las líneas del icono. */
  .menu-toggle .menu-toggle-label{display:none!important}
  .menu-toggle .hamburger-lines{
    display:flex!important;
    width:21px!important;
    height:16px!important;
    flex:0 0 21px!important;
    margin:auto!important;
  }
  .menu-toggle .hamburger-lines>span{
    display:block!important;
    width:100%!important;
    height:2px!important;
  }

  /* El panel abierto ocupa exactamente el viewport, sin excederlo. */
  .main-nav{
    position:fixed!important;
    inset:0!important;
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:0!important;
    width:auto!important;
    min-width:0!important;
    max-width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    padding-top:max(18px, env(safe-area-inset-top))!important;
    padding-left:max(14px, env(safe-area-inset-left))!important;
    padding-right:max(14px, env(safe-area-inset-right))!important;
    padding-bottom:max(20px, env(safe-area-inset-bottom))!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
  }

  .mobile-nav-head{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .mobile-menu-brand{min-width:0;max-width:calc(100% - 58px)}
  .mobile-menu-brand img{max-width:100%!important}
  .menu-close{
    flex:0 0 44px;
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    height:44px!important;
    margin-left:auto;
  }
}

@media (max-width:360px){
  .site-header .nav-wrap{
    padding-left:max(10px, env(safe-area-inset-left))!important;
    padding-right:max(10px, env(safe-area-inset-right))!important;
  }
  .site-header .brand img{max-width:132px!important}
  .menu-toggle{
    flex-basis:42px!important;
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    max-height:42px!important;
  }
}


/* =========================================================
   TYPOGRAPHY + PROCESS POLISH V2.7
   Ubuntu Condensed en interfaz y textos.
   Raleway ExtraBold para titulares.
   ========================================================= */
:root{
  --font-body:"Ubuntu Condensed",Arial,sans-serif;
  --font-title:"Raleway",Arial,sans-serif;
}

html,body,button,input,textarea,select{
  font-family:var(--font-body);
}
body{
  font-size:18px;
  font-weight:400;
  letter-spacing:.005em;
}

h1,h2,h3,h4,h5,h6,
.hero-copy h1,
.section-copy h2,.section-head h2,.coverage-copy h2,.contact-info h2,
.cta-wrap h2,.product-body h3,.process .step b{
  font-family:var(--font-title);
  font-weight:800;
}

.main-nav,.btn,.nav-cta,.section-kicker,.eyebrow,
.filter,.fact,.feature-list,.city-grid,.contact-cards,
.footer,.form-card label,.process .step small{
  font-family:var(--font-body);
}

.main-nav,.btn,.nav-cta,.section-kicker,.eyebrow,.filter{
  font-weight:700;
}

/* Elimina definitivamente la franja visual producida por el fondo con parallax. */
.process{
  background:linear-gradient(145deg,#0a527b 0%,#0a527b 100%)!important;
  padding-top:96px;
}
.process-bg{display:none!important}
.process:before{
  background:radial-gradient(circle,rgba(66,205,239,.105),transparent 68%)!important;
}

/* Cabecera del proceso: jerarquía más limpia y alineación precisa. */
.process .section-head{
  max-width:900px;
  margin:0;
  text-align:left;
}
.process .section-kicker{
  margin-bottom:22px;
  font-size:13px;
  line-height:1;
  letter-spacing:.105em;
}
.process .section-head h2{
  max-width:850px;
  margin:0 0 24px;
  font-size:clamp(48px,4.25vw,66px);
  line-height:1.04;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.process .section-head>p{
  max-width:820px;
  margin:0;
  color:#d0e9f2;
  font-size:20px;
  line-height:1.55;
  font-weight:400;
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
}
.process-line{
  margin:38px 0 30px!important;
}

/* ETAPA 01…08: más visible y legible. */
.process .step small{
  min-height:28px;
  padding:6px 11px;
  margin-bottom:12px;
  font-size:13px;
  line-height:1;
  font-weight:700;
  letter-spacing:.085em;
  color:#9cecff;
  background:rgba(88,214,244,.12);
  border-color:rgba(119,229,252,.22);
}
.process .step b{
  max-width:90%;
  margin-bottom:10px;
  font-size:18px;
  line-height:1.22;
  letter-spacing:-.025em;
}
.process .step p{
  max-width:94%;
  font-size:15px;
  line-height:1.46;
  color:#d6ebf3;
}

@media(max-width:900px){
  .process{padding-top:78px}
  .process .section-head h2{font-size:clamp(42px,7.4vw,56px)}
  .process .section-head>p{font-size:18px}
}

@media(max-width:600px){
  body{font-size:17px}
  .process{padding-top:66px!important;background:#0a527b!important}
  .process .section-head{max-width:100%}
  .process .section-kicker{font-size:12px;margin-bottom:18px}
  .process .section-head h2{
    font-size:clamp(36px,10.4vw,45px)!important;
    line-height:1.05;
    margin-bottom:18px;
    overflow-wrap:normal;
  }
  .process .section-head>p{
    font-size:17px!important;
    line-height:1.5;
    text-align:left;
  }
  .process-line{margin:27px 0 23px!important}
  .process .step small{font-size:12px;min-height:27px;padding:6px 10px}
  .process .step b{font-size:18px!important;max-width:88%}
  .process .step p{font-size:14.5px!important;line-height:1.45}
}

/* =========================================================
   CAMPAIGN / REAL MATERIAL INTEGRATION V2.8
   Material comercial + delivery + reels + horarios
   ========================================================= */

/* Hero: oferta comercial integrada sin romper la jerarquía */
.hero-offer{
  width:max-content;max-width:100%;display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 14px;
  margin:22px 0 2px;padding:12px 16px;border-radius:18px;
  background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.07));
  border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(12px);box-shadow:0 14px 34px rgba(1,31,54,.14)
}
.hero-offer>span{display:flex;align-items:center;gap:7px;grid-row:1;color:#d8f8ff;font-size:11px;font-weight:700;letter-spacing:.1em}
.hero-offer>span svg{width:16px;height:16px;color:#7ce7ff}.hero-offer>strong{grid-row:1/3;grid-column:2;font-family:var(--font-title);font-size:30px;line-height:1;color:#dfff35;letter-spacing:-.04em}
.hero-offer>small{grid-column:1;font-size:11px;color:#c9e8f1}

/* Catálogo construido desde el material entregado */
.product-grid-v28{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.product-image.campaign{height:310px;background:#eaf8fc;overflow:hidden}
.product-image.campaign img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .55s cubic-bezier(.2,.75,.2,1)}
.product-card:hover .product-image.campaign img{transform:scale(1.045)}
.product-image.campaign:after{content:"";position:absolute;inset:auto 0 0;height:34%;background:linear-gradient(transparent,rgba(5,39,66,.18));pointer-events:none}
.price-badge{background:#eaff31!important;color:#075b83!important;border-color:rgba(255,255,255,.8)!important;font-size:13px!important}
.featured-product{box-shadow:0 28px 65px rgba(7,159,210,.14)}

/* Delivery */
.delivery-section{position:relative;overflow:hidden;background:linear-gradient(145deg,#f7fcff 0%,#edf9fd 56%,#fff 100%)}
.delivery-glow{position:absolute;width:540px;height:540px;border-radius:50%;right:-220px;top:-190px;background:radial-gradient(circle,rgba(25,185,231,.16),transparent 66%);pointer-events:none}
.delivery-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:76px;align-items:center;position:relative;z-index:2}
.delivery-photo-wrap{position:relative;width:min(500px,100%);margin:auto;border-radius:38px;overflow:hidden;box-shadow:0 32px 80px rgba(8,67,100,.2);background:#fff;isolation:isolate}
.delivery-photo-wrap:after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.55);border-radius:inherit;pointer-events:none}
.delivery-photo-wrap>img{width:100%;aspect-ratio:1080/1350;object-fit:cover;transition:transform .8s ease}.delivery-photo-wrap:hover>img{transform:scale(1.025)}
.delivery-float-card{position:absolute;left:22px;right:22px;bottom:22px;padding:16px 18px;border-radius:20px;background:rgba(5,39,66,.88);color:#fff;backdrop-filter:blur(16px);box-shadow:0 16px 35px rgba(0,0,0,.18);display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center}
.delivery-float-card span{grid-row:1/3;width:46px;height:46px;border-radius:15px;background:linear-gradient(135deg,var(--blue3),var(--blue2));display:grid;place-items:center;font-size:0}.delivery-float-card span svg{width:22px;height:22px}
.delivery-float-card b{font-family:var(--font-title);font-weight:800;font-size:18px;line-height:1.1}.delivery-float-card small{color:#cceaf4;font-size:12px}
.delivery-copy h2{font-family:var(--font-title);font-weight:800;font-size:clamp(44px,4.3vw,64px);line-height:1.02;letter-spacing:-.045em;margin:22px 0 24px;max-width:760px}
.delivery-copy h2 em{font-style:normal;color:var(--blue)}.delivery-copy>p{font-size:19px;line-height:1.65;color:var(--muted);max-width:760px}
.delivery-highlights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:28px 0 16px}
.delivery-highlight{display:grid;grid-template-columns:48px 1fr;gap:13px;padding:17px;border:1px solid #d8edf5;border-radius:20px;background:rgba(255,255,255,.88);box-shadow:0 13px 35px rgba(8,67,100,.07)}
.delivery-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#e0f8ff,#efffff);color:var(--blue2);border:1px solid #c9edf8}.delivery-icon svg{width:22px;height:22px}
.delivery-highlight small{display:block;font-weight:700;letter-spacing:.08em;color:var(--blue2);font-size:10px}.delivery-highlight strong{display:block;font-family:var(--font-title);font-size:23px;line-height:1.08;margin:3px 0;color:var(--deep)}.delivery-highlight p{margin:0;color:var(--muted);font-size:13px}
.zone-contacts{display:grid;gap:9px;margin:16px 0 24px}.zone-contacts>a{display:grid;grid-template-columns:42px minmax(0,1fr) 20px;align-items:center;gap:11px;padding:12px 14px;border:1px solid #dbeef5;border-radius:17px;background:#fff;transition:.25s;box-shadow:0 10px 28px rgba(8,67,100,.045)}.zone-contacts>a:hover{transform:translateX(4px);border-color:#b5dfec;box-shadow:0 14px 32px rgba(8,67,100,.08)}
.zone-contacts>a>span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#eaf9fe;color:var(--blue2)}.zone-contacts small{display:block;color:var(--muted);font-size:11px}.zone-contacts b{display:block;font-family:var(--font-title);font-size:17px;color:var(--deep)}.zone-contacts>a>svg{color:var(--blue)}

/* Reels: audiovisual real, en carga diferida */
.media-section{background:#fff;overflow:hidden}.media-section .section-head{max-width:850px;margin-inline:auto}.reels-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:42px}
.reel-card{min-width:0;background:#fff;border:1px solid #dcebf2;border-radius:26px;overflow:hidden;box-shadow:0 20px 50px rgba(8,67,100,.09);transition:.35s cubic-bezier(.2,.75,.2,1)}.reel-card:hover{transform:translateY(-7px);box-shadow:0 28px 62px rgba(8,67,100,.15);border-color:#b9e0ec}
.reel-media{position:relative;aspect-ratio:9/14;overflow:hidden;background:#0a527b}.reel-media video{width:100%;height:100%;display:block;object-fit:cover}.reel-media:after{content:"";position:absolute;inset:58% 0 0;background:linear-gradient(transparent,rgba(4,39,65,.5));pointer-events:none}
.video-play{position:absolute;left:50%;top:50%;z-index:3;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:rgba(255,255,255,.92);color:var(--blue2);display:grid;place-items:center;cursor:pointer;box-shadow:0 15px 34px rgba(0,0,0,.22);transition:.25s}.video-play:hover{transform:translate(-50%,-50%) scale(1.08);background:#fff}.video-play svg{width:24px;height:24px;margin-left:3px}.reel-media.playing .video-play{opacity:0;pointer-events:none}.reel-media.playing:hover .video-play{opacity:.86;pointer-events:auto}.reel-media.playing .video-play svg{margin:0}
.reel-copy{padding:19px 18px 22px}.reel-copy>span{display:flex;align-items:center;gap:6px;color:var(--blue2);font-size:10px;font-weight:700;letter-spacing:.1em}.reel-copy>span svg{width:15px;height:15px}.reel-copy h3{font-family:var(--font-title);font-size:20px;line-height:1.1;margin:8px 0 8px;color:var(--deep)}.reel-copy p{margin:0;color:var(--muted);font-size:14px;line-height:1.45}

/* Horarios: material original + versión HTML accesible y responsive */
.schedule-section{background:linear-gradient(180deg,#f2fbfe 0%,#fff 100%);position:relative;overflow:hidden}.schedule-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:68px;align-items:center}.schedule-visual{position:relative;border-radius:34px;overflow:hidden;box-shadow:0 28px 70px rgba(8,67,100,.15);max-width:500px;margin:auto}.schedule-visual img{width:100%;aspect-ratio:1080/1350;object-fit:cover}.schedule-visual:after{content:"Material gráfico Reactívate";position:absolute;left:16px;bottom:16px;padding:7px 10px;border-radius:999px;background:rgba(5,39,66,.72);color:#fff;font-size:9px;letter-spacing:.08em;backdrop-filter:blur(9px)}
.schedule-copy h2{font-family:var(--font-title);font-weight:800;font-size:clamp(42px,4vw,60px);line-height:1.03;letter-spacing:-.045em;margin:22px 0 20px}.schedule-copy h2 em{font-style:normal;color:var(--blue)}.schedule-copy>p{font-size:18px;color:var(--muted)}
.schedule-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:26px}.schedule-cards article{padding:20px;border-radius:24px;background:#fff;border:1px solid #d8ebf3;box-shadow:0 16px 42px rgba(8,67,100,.08)}
.schedule-title{display:flex;align-items:center;gap:10px;margin-bottom:14px}.schedule-title>span{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue3),var(--blue2));color:#fff}.schedule-title h3{font-family:var(--font-title);font-size:20px;line-height:1.05;margin:0;color:var(--deep)}
.schedule-cards dl{margin:0}.schedule-cards dl>div{padding:11px 0;border-top:1px solid #e5f0f4}.schedule-cards dt{font-size:12px;font-weight:700;color:var(--blue2);letter-spacing:.055em;text-transform:uppercase}.schedule-cards dd{margin:3px 0 0;font-size:17px;line-height:1.28;color:var(--ink)}.schedule-cards article>a{margin-top:10px;display:flex;align-items:center;gap:7px;color:#0d9b18;font-weight:700;font-size:14px}.schedule-cards article>a svg{width:17px;height:17px}

/* Proceso: sin ninguna franja superior residual */
.process-wave,.process .process-wave,.wave-top,.process .wave-top{display:none!important}.process{border-top:0!important;box-shadow:none!important}

/* Contacto con dos zonas */
.contact-cards>a{min-height:72px}

@media(max-width:1100px){
  .product-grid-v28{grid-template-columns:repeat(2,minmax(0,1fr))}.reels-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.delivery-grid,.schedule-grid{grid-template-columns:1fr;gap:44px}.delivery-photo-wrap,.schedule-visual{width:min(560px,100%)}.delivery-copy,.schedule-copy{width:min(820px,100%);margin-inline:auto}.delivery-highlights{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:720px){
  .hero-offer{margin-inline:auto;text-align:left}.product-grid-v28{grid-template-columns:1fr}.product-image.campaign{height:360px}.reels-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding:4px 2px 16px;margin-inline:-2px;scrollbar-width:none}.reels-grid::-webkit-scrollbar{display:none}.reel-card{flex:0 0 min(78vw,310px);scroll-snap-align:center}.delivery-highlights,.schedule-cards{grid-template-columns:1fr}.delivery-copy h2,.schedule-copy h2{font-size:clamp(36px,10vw,45px)}.delivery-copy>p,.schedule-copy>p{font-size:17px}.delivery-photo-wrap{border-radius:28px}.delivery-float-card{left:12px;right:12px;bottom:12px}.schedule-visual{border-radius:26px}.zone-contacts b{font-size:16px}
}
@media(max-width:600px){
  .hero-offer{grid-template-columns:1fr auto;width:100%;padding:11px 12px}.hero-offer>strong{font-size:25px}.hero-offer>small{font-size:10px}.product-image.campaign{height:315px}.delivery-section,.media-section,.schedule-section{padding-top:66px;padding-bottom:66px}.delivery-float-card{grid-template-columns:40px 1fr;padding:12px}.delivery-float-card span{width:40px;height:40px}.delivery-float-card b{font-size:16px}.delivery-float-card small{font-size:11px}.delivery-highlight{padding:14px}.schedule-cards article{padding:17px}.schedule-title h3{font-size:18px}.reel-copy h3{font-size:19px}
}
@media(max-width:380px){
  .hero-offer{grid-template-columns:1fr}.hero-offer>strong{grid-row:auto;grid-column:auto}.hero-offer>small{grid-column:auto}.delivery-float-card{position:relative;left:auto;right:auto;bottom:auto;margin:-68px 10px 12px}.zone-contacts>a{grid-template-columns:38px minmax(0,1fr) 16px;padding:10px}.zone-contacts>a>span{width:38px;height:38px}.schedule-title{align-items:flex-start}
}

/* =========================================================
   UI / CONTACT / LIGHTBOX / HERO / PROCESS V2.9
   Correcciones desktop + mobile solicitadas
   ========================================================= */

/* Botones convertidos a <button>: mantener el mismo lenguaje visual */
button.nav-cta,button.btn,button.footer-whatsapp,button.whatsapp-float{
  font-family:inherit;appearance:none;-webkit-appearance:none;outline:0;
}
button.footer-whatsapp{cursor:pointer}

/* 1) Navegación desktop: nombres e iconos realmente legibles */
@media (min-width:1181px){
  .nav-wrap{height:94px;gap:24px}
  .brand img{width:214px;max-height:60px}
  .main-nav{gap:5px;font-size:15.5px;font-weight:700;letter-spacing:.005em}
  .main-nav>a,.main-nav>button.nav-cta{min-height:48px}
  .main-nav>a{gap:9px;padding:12px 12px;border-radius:14px}
  .main-nav>a svg{width:20px;height:20px;font-size:20px}
  .main-nav .nav-cta{gap:9px;padding:13px 18px!important;font-size:15px!important;margin-left:8px}
  .main-nav .nav-cta svg{width:19px;height:19px}
  .main-nav .nav-cta svg:last-child{width:15px;height:15px;opacity:.8}
}

/* Mobile menu: filas grandes, iconos cómodos y mejor jerarquía */
@media (max-width:1180px){
  .main-nav>a{font-size:17px!important;font-weight:700!important;gap:13px!important}
  .main-nav>a svg{width:23px!important;height:23px!important}
  .main-nav .nav-cta{font-size:17px!important;gap:11px!important}
  .main-nav .nav-cta svg{width:21px!important;height:21px!important}
}
@media (max-width:720px){
  .main-nav>a{min-height:60px!important;padding:12px 14px!important;font-size:18px!important}
  .main-nav>a svg{width:24px!important;height:24px!important}
  .main-nav .nav-cta{min-height:62px!important;font-size:17px!important}
}

/* 2) Hero visual: los mensajes laterales dejan de quedar detrás de la tarjeta */
@media (min-width:901px){
  .hero-visual{width:min(560px,100%);display:grid;place-items:center;overflow:visible}
  .hero-card{width:min(455px,calc(100% - 86px));z-index:4}
  .floating-chip{z-index:9!important;min-width:142px}
  .chip-left{left:0!important;top:25%!important}
  .chip-right{right:0!important;bottom:19%!important}
}
@media (max-width:900px){
  .hero-visual{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:min(460px,96%)!important;overflow:visible}
  .hero-card{grid-column:1/-1;width:100%;z-index:4}
  .floating-chip{display:flex!important;position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;z-index:6!important;animation:none!important;justify-content:center;min-width:0;width:100%;margin:0;padding:10px 9px;border-radius:14px}
  .floating-chip span{font-size:10px}.floating-chip b{font-size:13px}
}
@media (max-width:430px){
  .hero-visual{grid-template-columns:1fr;width:min(350px,98%)!important}
  .hero-card{grid-column:auto}
  .floating-chip{justify-content:flex-start}
}

/* 3) Hero copy: lectura en orden CTA > promo > datos */
.hero-actions{margin:28px 0 18px}
.hero-offer{margin:0 0 17px}
.hero-facts{margin-top:0}
@media (min-width:901px){
  .hero-copy>p{margin-bottom:0}
  .hero-offer{min-width:380px}
  .hero-facts{max-width:660px}
}
@media (max-width:720px){
  .hero-copy{text-align:left!important}
  .eyebrow{justify-content:flex-start!important}
  .hero-actions{margin:24px 0 14px!important}
  .hero-offer{margin:0 0 14px!important}
}

/* 4) Catálogo: imágenes clickeables y señal visual de ampliación */
.product-image,.delivery-photo-wrap>img,.schedule-visual img{cursor:zoom-in}
.product-image{isolation:isolate}
.product-image:before{
  content:"AMPLIAR";position:absolute;right:12px;bottom:12px;z-index:5;
  padding:7px 10px;border-radius:999px;background:rgba(4,39,65,.78);color:#fff;
  font-size:10px;font-weight:700;letter-spacing:.08em;backdrop-filter:blur(8px);
  opacity:0;transform:translateY(5px);transition:.25s ease;pointer-events:none;
}
.product-card:hover .product-image:before{opacity:1;transform:none}
@media (hover:none){.product-image:before{opacity:.88;transform:none;font-size:9px}}

.image-lightbox{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:.25s ease}
.image-lightbox.open{opacity:1;visibility:visible;pointer-events:auto}
.image-lightbox-backdrop{position:absolute;inset:0;border:0;background:rgba(1,20,34,.84);backdrop-filter:blur(10px);cursor:zoom-out}
.image-lightbox-panel{position:relative;z-index:2;width:min(1000px,94vw);max-height:90dvh;display:flex;flex-direction:column;align-items:center;gap:10px}
.image-lightbox-img{display:block;max-width:100%;max-height:82dvh;width:auto;height:auto;object-fit:contain;border-radius:24px;box-shadow:0 28px 90px rgba(0,0,0,.42);background:#fff}
.image-lightbox-close{position:absolute;right:-14px;top:-14px;z-index:3;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.24);background:#fff;color:var(--deep);display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 34px rgba(0,0,0,.22)}
.image-lightbox-close svg{width:22px;height:22px}
.image-lightbox-caption{display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.12);color:#eafaff;font-size:13px;backdrop-filter:blur(8px)}
.image-lightbox-caption svg{width:16px;height:16px;color:#72dff6}
@media(max-width:600px){
  .image-lightbox{padding:12px}
  .image-lightbox-panel{width:100%;max-height:94dvh}
  .image-lightbox-img{max-height:82dvh;border-radius:17px}
  .image-lightbox-close{right:6px;top:6px;width:44px;height:44px}
  .image-lightbox-caption{font-size:12px;max-width:94%;text-align:center}
}

/* 5) Proceso: el encabezado usa el ancho disponible y elimina el vacío derecho */
.process{padding:82px 0 94px!important}
.process-intro{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr);gap:70px;align-items:end}
.process-title-block{min-width:0}
.process-title-block .section-kicker{margin-bottom:19px;font-size:13px}
.process-title-block h2{font-family:var(--font-title);font-weight:800;font-size:clamp(48px,4.3vw,66px);line-height:1.03;letter-spacing:-.045em;margin:0;max-width:820px;text-wrap:balance}
.process-title-block h2 em{font-style:normal;color:var(--blue)}
.process-summary{align-self:end;padding:22px 23px;border:1px solid rgba(126,224,248,.18);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.095),rgba(255,255,255,.045));box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 18px 44px rgba(1,31,51,.12);backdrop-filter:blur(12px)}
.process-summary>p{margin:0 0 18px;color:#d0e9f2;font-size:18px;line-height:1.55;text-align:left}
.process-summary-pills{display:flex;gap:8px;flex-wrap:wrap}
.process-summary-pills span{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border-radius:999px;background:rgba(92,218,246,.10);border:1px solid rgba(103,222,247,.15);color:#dff8ff;font-size:12px}
.process-summary-pills svg{width:16px;height:16px;color:#80e5f8}.process-summary-pills b{font-weight:700}
.process-line{margin:28px 0 28px!important}
@media(max-width:900px){
  .process{padding:72px 0 82px!important}
  .process-intro{grid-template-columns:1fr;gap:24px}
  .process-title-block h2{font-size:clamp(42px,7.2vw,56px)}
  .process-summary{max-width:none;padding:19px}
  .process-summary>p{font-size:17px;margin-bottom:15px}
  .process-line{margin:24px 0!important}
}
@media(max-width:600px){
  .process{padding:62px 0 70px!important}
  .process-intro{gap:18px}
  .process-title-block .section-kicker{margin-bottom:15px;font-size:12px}
  .process-title-block h2{font-size:clamp(36px,10vw,45px);line-height:1.04}
  .process-summary{padding:16px;border-radius:19px}
  .process-summary>p{font-size:16px;line-height:1.5}
  .process-summary-pills{gap:6px}
  .process-summary-pills span{font-size:11px;padding:7px 9px}
  .process-line{margin:20px 0!important}
}

/* Direcciones y sucursales */
.zone-contacts em,.contact-cards em{display:block;font-style:normal;color:#718795;font-size:12px;line-height:1.3;margin-top:3px}
.zone-contacts>a{grid-template-columns:46px minmax(0,1fr) 20px}
.zone-contacts>a>span{width:46px;height:46px}
.contact-cards>a{align-items:center}
.contact-cards>a>div{min-width:0}
.contact-cards b{font-family:var(--font-title);font-size:17px;color:var(--deep)}
.branch-address{margin:3px 0 0!important;color:var(--muted);font-size:12px!important;line-height:1.25}
.schedule-title>div{min-width:0}

/* Selector de sucursal: popover desktop + bottom sheet mobile */
body.modal-open{overflow:hidden}
.contact-selector-backdrop{position:fixed;inset:0;z-index:1080;background:rgba(1,20,34,.58);backdrop-filter:blur(6px);opacity:0;visibility:hidden;pointer-events:none;transition:.25s ease}
.contact-selector-backdrop.open{opacity:1;visibility:visible;pointer-events:auto}
.contact-selector{position:fixed;left:22px;bottom:88px;z-index:1090;width:min(470px,calc(100vw - 44px));padding:22px;border:1px solid rgba(190,230,242,.85);border-radius:28px;background:rgba(250,254,255,.985);box-shadow:0 28px 90px rgba(1,30,49,.28);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(18px) scale(.975);transition:.28s cubic-bezier(.2,.75,.2,1);color:var(--ink)}
.contact-selector.open{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.contact-selector-handle{display:none}
.contact-selector-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding-bottom:16px;margin-bottom:14px;border-bottom:1px solid #dcebf1}
.contact-selector-kicker{display:flex;align-items:center;gap:7px;color:var(--blue2);font-size:11px;font-weight:700;letter-spacing:.1em}
.contact-selector-kicker svg{width:16px;height:16px}
.contact-selector-head h2{font-family:var(--font-title);font-size:24px;line-height:1.08;margin:6px 0 0;letter-spacing:-.03em;color:var(--deep)}
.contact-selector-close{flex:0 0 42px;width:42px;height:42px;border-radius:14px;border:1px solid #d5e8ef;background:#fff;color:var(--deep);display:grid;place-items:center;cursor:pointer}
.contact-selector-close svg{width:20px;height:20px}
.branch-options{display:grid;gap:11px}
.branch-option{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;padding:15px;border:1px solid #dbeaf1;border-radius:20px;background:#fff;box-shadow:0 10px 30px rgba(8,67,100,.055)}
.branch-option.branch-primary{border-color:#bee8f4;background:linear-gradient(145deg,#fff,#f4fcff)}
.branch-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:#e8f9ff;color:var(--blue2)}
.branch-icon svg{width:22px;height:22px}.branch-main{min-width:0}
.branch-main small{display:block;color:var(--blue2);font-size:10px;font-weight:700;letter-spacing:.08em}
.branch-main h3{font-family:var(--font-title);font-size:20px;line-height:1.05;margin:4px 0;color:var(--deep)}
.branch-main p{margin:0;color:var(--muted);font-size:13px;line-height:1.35}
.branch-main b{display:block;margin-top:5px;font-size:18px;color:var(--ink)}
.branch-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr .72fr;gap:8px}
.branch-actions a{min-height:43px;border-radius:13px;display:flex;align-items:center;justify-content:center;gap:7px;font-weight:700;font-size:14px}
.branch-actions svg{width:18px;height:18px}.branch-wa{background:linear-gradient(135deg,#25d366,#16b84e);color:#fff;box-shadow:0 9px 22px rgba(32,190,87,.18)}.branch-call{background:#edf8fc;color:var(--blue2);border:1px solid #d4eaf2}
.contact-selector-note{display:flex;align-items:flex-start;gap:7px;margin:13px 3px 0;color:#758a97;font-size:12px;line-height:1.4}.contact-selector-note svg{width:15px;height:15px;margin-top:2px;color:var(--blue2);flex:0 0 auto}

/* Botón de contacto móvil tipo launcher */
.whatsapp-float{border:0;cursor:pointer;background:linear-gradient(145deg,#078fc7,#075f9d);box-shadow:0 15px 35px rgba(4,94,145,.28)}
.whatsapp-float:hover{box-shadow:0 20px 42px rgba(4,94,145,.34)}
.whatsapp-float .wa-pulse{background:rgba(112,224,247,.34)}

@media(max-width:720px){
  .contact-selector{left:0!important;right:0!important;bottom:0!important;width:100%!important;max-width:none!important;padding:11px 14px calc(18px + env(safe-area-inset-bottom));border-radius:28px 28px 0 0;transform:translateY(104%);border-left:0;border-right:0;border-bottom:0;max-height:min(86dvh,720px);overflow-y:auto}
  .contact-selector.open{transform:translateY(0)}
  .contact-selector-handle{display:block;width:44px;height:5px;border-radius:999px;background:#c7dbe4;margin:2px auto 12px}
  .contact-selector-head{padding-bottom:13px;margin-bottom:10px}
  .contact-selector-head h2{font-size:22px}
  .branch-option{grid-template-columns:44px minmax(0,1fr);padding:13px;border-radius:18px}
  .branch-icon{width:44px;height:44px;border-radius:14px}
  .branch-main h3{font-size:19px}.branch-main b{font-size:17px}.branch-main p{font-size:12px}
  .branch-actions a{min-height:46px;font-size:14px}
  .contact-selector-note{font-size:11px}
  .whatsapp-float{left:max(12px,env(safe-area-inset-left))!important;bottom:max(12px,env(safe-area-inset-bottom))!important;width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;max-width:54px!important;max-height:54px!important;padding:0!important;display:grid!important;place-items:center!important;border-radius:50%!important}
  .whatsapp-float b{display:none!important}.whatsapp-float svg{width:23px!important;height:23px!important}.wa-pulse{left:21px!important;top:21px!important}
  .to-top{right:max(12px,env(safe-area-inset-right))!important;bottom:max(12px,env(safe-area-inset-bottom))!important}
  .zone-contacts em,.contact-cards em{font-size:11px}
}

@media(max-width:380px){
  .branch-actions{grid-template-columns:1fr 1fr}
  .contact-selector{padding-inline:10px}
}
.footer-whatsapp span{color:inherit!important;font-size:inherit!important;display:inline!important}
@media(max-width:1180px){.main-nav .nav-cta{width:100%!important;flex:0 0 auto!important}}

/* =========================================================
   HERO FLOATING MESSAGES V2.10
   Asegura que Premium / Despacho queden DELANTE de la tarjeta
   y totalmente legibles en escritorio. En tablet/móvil siguen
   como bloques independientes bajo la tarjeta.
   ========================================================= */
@media (min-width:901px){
  .hero-visual{
    isolation:isolate!important;
    overflow:visible!important;
    transform-style:preserve-3d!important;
  }

  .hero-card{
    position:relative!important;
    z-index:4!important;
    transform:translateZ(12px)!important;
  }

  .floating-chip{
    z-index:30!important;
    opacity:1!important;
    visibility:visible!important;
    min-width:158px!important;
    padding:12px 15px!important;
    border-radius:17px!important;
    background:rgba(255,255,255,.97)!important;
    border:1px solid rgba(171,226,244,.9)!important;
    box-shadow:0 18px 45px rgba(1,35,58,.28),0 0 0 1px rgba(255,255,255,.55) inset!important;
    backdrop-filter:blur(16px) saturate(135%)!important;
    -webkit-backdrop-filter:blur(16px) saturate(135%)!important;
    transform:translate3d(0,0,90px)!important;
    animation:chipFloatFront 5.5s ease-in-out infinite!important;
    pointer-events:auto!important;
  }

  .floating-chip svg{
    width:21px!important;
    height:21px!important;
    flex:0 0 21px!important;
  }

  .floating-chip span{
    font-size:11px!important;
    line-height:1.08!important;
  }

  .floating-chip b{
    font-size:15px!important;
    line-height:1.05!important;
    color:#073e68!important;
  }

  .chip-left{
    left:-72px!important;
    top:27%!important;
  }

  .chip-right{
    right:-72px!important;
    bottom:21%!important;
    animation-delay:-2.3s!important;
  }

  @keyframes chipFloatFront{
    0%,100%{transform:translate3d(0,0,90px)}
    50%{transform:translate3d(0,-10px,90px)}
  }
}

/* En resoluciones desktop más estrechas, reducir el desplazamiento lateral
   sin volver a esconder los mensajes detrás de la tarjeta. */
@media (min-width:901px) and (max-width:1120px){
  .floating-chip{min-width:146px!important;padding:11px 13px!important}
  .chip-left{left:-44px!important}
  .chip-right{right:-44px!important}
}

/* Tablet / móvil: anular profundidad 3D y mostrarlos como tarjetas normales. */
@media (max-width:900px){
  .floating-chip{
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
  }
}


/* =========================================================
   MOBILE STABILITY V2.12 — Galaxy / Android fixes
   - Header realmente fijo durante todo el scroll.
   - El hamburguesa desaparece al abrir: se usa sólo el X interno.
   - Menú fullscreen por encima de TODO el contenido.
   - Dock inferior mantiene WhatsApp + Back to top dentro del viewport.
   - Footer deja zona libre para no cubrir el crédito del desarrollador.
   ========================================================= */
.floating-actions{display:contents}

@media (max-width:720px){
  :root{--mobile-edge:14px;--mobile-float-size:52px;--mobile-dock-bottom:14px}

  html,body{max-width:100%;overflow-x:clip}

  /* Header: evita que Chrome/Samsung lo pierda al contraer la barra del navegador. */
  .site-header{
    position:fixed!important;
    top:0!important;left:0!important;right:0!important;
    width:100%!important;max-width:100vw!important;
    z-index:2000!important;
    margin:0!important;
    transform:translate3d(0,0,0)!important;
    -webkit-transform:translate3d(0,0,0)!important;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    will-change:transform;
    overflow:visible!important;
  }
  .site-header.scrolled{
    position:fixed!important;
    transform:translate3d(0,0,0)!important;
    opacity:1!important;
    visibility:visible!important;
  }
  .site-header .nav-wrap{
    min-height:72px!important;
    height:72px!important;
    padding-top:0!important;
    padding-bottom:0!important;
  }

  /* Cuando el menú abre, el botón hamburguesa exterior no compite con el X. */
  .menu-toggle{
    z-index:2010!important;
    transition:opacity .18s ease,visibility .18s ease,transform .18s ease,background .2s ease!important;
  }
  .menu-toggle.open{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:scale(.82)!important;
  }

  /* Fullscreen auténtico: queda por encima del header y de toda la página. */
  .main-nav{
    position:fixed!important;
    inset:0!important;
    top:0!important;right:0!important;bottom:0!important;left:0!important;
    z-index:2050!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding-top:calc(16px + env(safe-area-inset-top))!important;
    padding-right:max(16px,env(safe-area-inset-right))!important;
    padding-bottom:calc(22px + env(safe-area-inset-bottom))!important;
    padding-left:max(16px,env(safe-area-inset-left))!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain!important;
    transform:translate3d(0,-18px,0) scale(.985)!important;
  }
  .main-nav.open{
    transform:translate3d(0,0,0) scale(1)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .mobile-nav-head{flex:0 0 auto!important}
  .menu-close{
    position:relative!important;
    z-index:2070!important;
    flex:0 0 46px!important;
    width:46px!important;height:46px!important;
  }
  .mobile-nav-bottom{padding-bottom:max(2px,env(safe-area-inset-bottom))}
  .nav-backdrop{z-index:1980!important}

  /* Dock inferior: los dos botones viven dentro del mismo ancho visible. */
  .floating-actions{
    position:fixed!important;
    left:0!important;right:0!important;
    bottom:var(--mobile-dock-bottom)!important;
    z-index:1900!important;
    width:100%!important;
    max-width:100vw!important;
    height:var(--mobile-float-size)!important;
    padding-left:max(var(--mobile-edge),env(safe-area-inset-left))!important;
    padding-right:max(var(--mobile-edge),env(safe-area-inset-right))!important;
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    box-sizing:border-box!important;
    pointer-events:none!important;
  }
  .floating-actions .whatsapp-float,
  .floating-actions .to-top{
    position:relative!important;
    inset:auto!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    flex:0 0 var(--mobile-float-size)!important;
    width:var(--mobile-float-size)!important;
    height:var(--mobile-float-size)!important;
    min-width:var(--mobile-float-size)!important;
    min-height:var(--mobile-float-size)!important;
    max-width:var(--mobile-float-size)!important;
    max-height:var(--mobile-float-size)!important;
    margin:0!important;
    transform:none!important;
    box-sizing:border-box!important;
    pointer-events:auto!important;
  }
  .floating-actions .to-top.show{transform:none!important}
  .floating-actions .whatsapp-float:hover,
  .floating-actions .to-top:hover{transform:none!important}

  /* Al abrir modal/selector, no dejamos botones flotantes por encima. */
  body.modal-open .floating-actions{opacity:0!important;visibility:hidden!important;pointer-events:none!important}

  /* Reserva visual al final del footer para que los botones no tapen Sócrates. */
  .site-footer{
    padding-bottom:calc(112px + env(safe-area-inset-bottom))!important;
  }
  .footer-bottom{
    gap:14px!important;
    padding-bottom:0!important;
  }
  .developer-credit{margin-bottom:0!important}
}

@media (max-width:380px){
  :root{--mobile-edge:10px;--mobile-float-size:48px;--mobile-dock-bottom:10px}
  .site-header .nav-wrap{min-height:68px!important;height:68px!important}
  .main-nav{
    padding-left:max(12px,env(safe-area-inset-left))!important;
    padding-right:max(12px,env(safe-area-inset-right))!important;
  }
  .site-footer{padding-bottom:calc(104px + env(safe-area-inset-bottom))!important}
}

/* =========================================================
   SISTEMAS DE FILTRACIÓN V2.13
   Sección nueva: agua de puntera, pozo y APR.
   ========================================================= */
.filtration-systems{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,#ffffff 0%,#f4fbfe 52%,#edf8fc 100%);
  isolation:isolate;
}
.filtration-systems:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-3;
  opacity:.42;
  background-image:radial-gradient(circle,rgba(9,130,184,.12) 1px,transparent 1.4px);
  background-size:30px 30px;
  mask-image:linear-gradient(90deg,#000 0%,transparent 48%,#000 100%);
}
.filtration-orb{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none;z-index:-2}
.filtration-orb-a{width:480px;height:480px;right:-180px;top:110px;background:radial-gradient(circle,rgba(41,190,229,.17),rgba(41,190,229,0) 68%)}
.filtration-orb-b{width:360px;height:360px;left:-170px;bottom:130px;background:radial-gradient(circle,rgba(22,201,0,.08),rgba(22,201,0,0) 70%)}
.filtration-layout{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(420px,.96fr);gap:66px;align-items:center}
.filtration-copy{min-width:0}
.filtration-copy .section-kicker{color:var(--blue2);margin-bottom:20px}
.filtration-copy h2{font-family:var(--font-title,"Raleway",sans-serif);font-weight:800;font-size:clamp(46px,4.4vw,68px);line-height:1.03;letter-spacing:-.045em;margin:0 0 25px;max-width:780px;text-wrap:balance}
.filtration-copy h2 em{font-style:normal;color:var(--blue)}
.filtration-copy>p{font-size:17px;line-height:1.7;color:#4e6778;max-width:760px;margin-bottom:15px}
.filtration-copy .filtration-lead{font-size:20px;line-height:1.62;color:#243f52;margin-bottom:16px}
.filtration-sources{display:flex;flex-wrap:wrap;gap:9px;margin:27px 0 24px}
.filtration-sources span{display:inline-flex;align-items:center;gap:8px;padding:10px 13px;border-radius:999px;background:#fff;border:1px solid #d4e8f1;box-shadow:0 8px 22px rgba(4,79,114,.06);color:#315468}
.filtration-sources svg{width:17px;height:17px;color:var(--blue2)}
.filtration-sources b{font-size:13px;font-weight:700}
.filtration-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:0 0 28px}
.filtration-results article{display:grid;grid-template-columns:44px 1fr;gap:11px;align-items:center;padding:13px 14px;border-radius:17px;background:rgba(255,255,255,.84);border:1px solid #d9eaf1;box-shadow:0 12px 28px rgba(5,70,103,.055);transition:.26s ease}
.filtration-results article:hover{transform:translateY(-3px);border-color:#b9deec;box-shadow:0 17px 35px rgba(5,70,103,.09)}
.filtration-results article>span{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--blue3),var(--blue2));box-shadow:0 10px 22px rgba(5,127,183,.16)}
.filtration-results article>span svg{width:20px;height:20px}
.filtration-results article div{display:flex;flex-direction:column;min-width:0}
.filtration-results small{font-size:9px;letter-spacing:.12em;font-weight:900;color:#6d8a9a;line-height:1.25}
.filtration-results b{font-size:15px;line-height:1.2;color:var(--deep)}
.filtration-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}

.filtration-media{position:relative;min-height:720px;display:flex;align-items:center;justify-content:flex-end;padding:18px 4px 58px 80px}
.filtration-poster{position:relative;width:min(430px,100%);border-radius:30px;overflow:hidden;background:#fff;border:1px solid rgba(13,120,170,.14);box-shadow:0 34px 80px rgba(4,58,89,.18);transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .22s ease-out,box-shadow .3s ease;isolation:isolate}
.filtration-poster:hover{box-shadow:0 42px 92px rgba(4,58,89,.23)}
.filtration-poster:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(125deg,rgba(255,255,255,.22),transparent 22%,transparent 68%,rgba(43,192,230,.10))}
.filtration-poster img{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover;cursor:zoom-in}
.filtration-poster-badge{position:absolute;z-index:4;left:17px;top:17px;display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:14px;background:rgba(3,48,75,.88);color:#fff;border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(12px);box-shadow:0 12px 30px rgba(0,26,44,.18)}
.filtration-poster-badge>svg{width:21px;height:21px;color:#7df36f}
.filtration-poster-badge span{display:flex;flex-direction:column;line-height:1.05}.filtration-poster-badge b{font-size:12px}.filtration-poster-badge small{font-size:9px;color:#bfe8f5;margin-top:3px}
.filtration-zoom-hint{position:absolute;z-index:4;right:16px;bottom:16px;display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(255,255,255,.6);background:rgba(255,255,255,.90);color:var(--deep);border-radius:999px;padding:8px 11px;font-size:11px;font-weight:800;pointer-events:none;box-shadow:0 9px 24px rgba(0,41,67,.12)}
.filtration-zoom-hint svg{width:15px;height:15px;color:var(--blue2)}
.filtration-video-card{position:absolute;left:0;bottom:0;width:270px;border-radius:24px;background:#fff;border:1px solid #d9eaf2;box-shadow:0 24px 62px rgba(3,53,83,.20);overflow:hidden;z-index:7}
.filtration-video-card .reel-media{aspect-ratio:9/12;min-height:0;border-radius:0;background:#052d4e}
.filtration-video-card .reel-media video{width:100%;height:100%;object-fit:cover}
.filtration-video-copy{padding:15px 16px 17px}
.filtration-video-copy>span{display:flex;align-items:center;gap:6px;color:var(--blue2);font-size:9px;font-weight:900;letter-spacing:.12em}
.filtration-video-copy>span svg{width:14px;height:14px}
.filtration-video-copy h3{font-family:var(--font-title,"Raleway",sans-serif);font-size:17px;line-height:1.1;margin:8px 0 6px;color:var(--deep)}
.filtration-video-copy p{font-size:12px;line-height:1.45;color:var(--muted);margin:0}

.filtration-stages{margin-top:78px;padding-top:48px;border-top:1px solid #d5e8f0;scroll-margin-top:110px}
.filtration-stages-head{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr);gap:54px;align-items:end;margin-bottom:28px}
.filtration-stages-head>div>span{display:block;color:var(--blue2);font-size:11px;font-weight:900;letter-spacing:.16em;margin-bottom:8px}
.filtration-stages-head h3{font-family:var(--font-title,"Raleway",sans-serif);font-size:clamp(31px,3vw,45px);line-height:1.07;letter-spacing:-.035em;margin:0;color:var(--deep);max-width:760px}
.filtration-stages-head>p{font-size:16px;line-height:1.6;color:#5a7485;margin:0}
.filtration-stage-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}
.filtration-stage{position:relative;min-height:252px;padding:22px 19px 20px;border-radius:22px;background:linear-gradient(155deg,#fff,#f4fbfe);border:1px solid #d8eaf2;box-shadow:0 13px 34px rgba(5,73,105,.055);overflow:hidden;transition:.28s ease}
.filtration-stage:after{content:"";position:absolute;right:-35px;bottom:-55px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,rgba(40,187,226,.12),transparent 70%)}
.filtration-stage:hover{transform:translateY(-6px);border-color:#b9deed;box-shadow:0 20px 42px rgba(5,73,105,.1)}
.filtration-stage>svg{width:32px;height:32px;color:var(--blue2);margin:34px 0 18px}
.filtration-stage-num{position:absolute;top:17px;right:17px;color:#b7dfe9;font-family:var(--font-title,"Raleway",sans-serif);font-size:30px;font-weight:800;line-height:1}
.filtration-stage h4{font-family:var(--font-title,"Raleway",sans-serif);font-size:17px;line-height:1.15;margin:0 0 9px;color:#15374b}
.filtration-stage p{font-size:13px;line-height:1.5;color:#647d8c;margin:0}
.filtration-evaluation{margin-top:28px;display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:18px;align-items:center;padding:22px 24px;border-radius:25px;background:linear-gradient(135deg,#063f69,#0b6b98);color:#fff;box-shadow:0 22px 50px rgba(2,54,88,.18);position:relative;overflow:hidden}
.filtration-evaluation:after{content:"";position:absolute;right:-70px;top:-100px;width:260px;height:260px;border-radius:50%;background:rgba(92,217,246,.10);pointer-events:none}
.filtration-evaluation-icon{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.15);color:#8de9fb}
.filtration-evaluation-icon svg{width:27px;height:27px}
.filtration-evaluation>div:nth-child(2){min-width:0;position:relative;z-index:2}
.filtration-evaluation small{font-size:10px;font-weight:900;letter-spacing:.14em;color:#85e5f8}
.filtration-evaluation h3{font-family:var(--font-title,"Raleway",sans-serif);font-size:24px;line-height:1.13;margin:5px 0 7px;color:#fff}
.filtration-evaluation p{font-size:13px;line-height:1.5;color:#cae7f1;margin:0;max-width:720px}
.filtration-evaluation-actions{position:relative;z-index:2;display:flex;flex-direction:column;align-items:stretch;gap:8px;min-width:230px}
.filtration-evaluation-actions .btn{min-height:48px;padding:12px 17px;font-size:13px}
.filtration-evaluation-actions>span{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;color:#d5eef6}.filtration-evaluation-actions>span svg{width:15px;height:15px}

@media (max-width:1120px){
  .filtration-layout{grid-template-columns:minmax(0,1fr) minmax(370px,.86fr);gap:38px}
  .filtration-media{min-height:670px;padding-left:54px}
  .filtration-video-card{width:235px}
  .filtration-stage-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .filtration-stage:nth-child(4),.filtration-stage:nth-child(5){min-height:220px}
}

@media (max-width:900px){
  .filtration-layout{grid-template-columns:1fr;gap:42px}
  .filtration-copy h2{font-size:clamp(42px,7.2vw,58px)}
  .filtration-media{min-height:0;padding:0;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(230px,.75fr);gap:16px;align-items:end;justify-content:stretch}
  .filtration-poster{width:100%}
  .filtration-video-card{position:relative;left:auto;bottom:auto;width:100%;align-self:end}
  .filtration-video-card .reel-media{aspect-ratio:9/14}
  .filtration-stages{margin-top:58px;padding-top:38px}
  .filtration-stages-head{grid-template-columns:1fr;gap:12px}
  .filtration-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filtration-evaluation{grid-template-columns:58px 1fr}.filtration-evaluation-actions{grid-column:1/-1;flex-direction:row;align-items:center;min-width:0}.filtration-evaluation-actions .btn{width:auto}.filtration-evaluation-actions>span{justify-content:flex-start}
}

@media (max-width:720px){
  .filtration-systems{padding-top:66px!important;padding-bottom:70px!important}
  .filtration-systems:before{opacity:.26;background-size:25px 25px}
  .filtration-copy .section-kicker{margin-bottom:15px}
  .filtration-copy h2{font-size:clamp(37px,10.5vw,47px);line-height:1.04;margin-bottom:19px}
  .filtration-copy .filtration-lead{font-size:18px;line-height:1.55}
  .filtration-copy>p{font-size:16px;line-height:1.6}
  .filtration-sources{margin:21px 0 20px;gap:7px}
  .filtration-sources span{padding:8px 10px}.filtration-sources b{font-size:12px}
  .filtration-results{grid-template-columns:1fr;gap:9px;margin-bottom:22px}
  .filtration-results article{grid-template-columns:41px 1fr;padding:11px 12px}.filtration-results article>span{width:41px;height:41px}
  .filtration-results small{font-size:9px}.filtration-results b{font-size:15px}
  .filtration-actions{display:grid;grid-template-columns:1fr;gap:9px}.filtration-actions .btn{width:100%}
  .filtration-media{grid-template-columns:1fr;gap:14px}
  .filtration-poster{max-width:430px;margin-inline:auto;border-radius:24px}
  .filtration-poster-badge{left:12px;top:12px;padding:8px 10px}.filtration-poster-badge small{display:none}
  .filtration-zoom-hint{right:12px;bottom:12px}
  .filtration-video-card{max-width:430px;margin-inline:auto;border-radius:22px}
  .filtration-video-card .reel-media{aspect-ratio:9/12}
  .filtration-video-copy{padding:14px 15px 16px}.filtration-video-copy h3{font-size:18px}
  .filtration-stages{margin-top:46px;padding-top:31px;scroll-margin-top:85px}
  .filtration-stages-head{margin-bottom:18px}.filtration-stages-head h3{font-size:31px}.filtration-stages-head>p{font-size:15px}
  .filtration-stage-grid{grid-template-columns:1fr;gap:10px}
  .filtration-stage{min-height:0!important;padding:18px 17px 18px;display:grid;grid-template-columns:45px 1fr;column-gap:13px;align-items:start}
  .filtration-stage>svg{grid-column:1;grid-row:1/3;width:30px;height:30px;margin:28px auto 0}
  .filtration-stage-num{top:13px;left:15px;right:auto;font-size:20px;color:#a7d8e6}
  .filtration-stage h4{grid-column:2;margin:0 0 6px;font-size:17px}.filtration-stage p{grid-column:2;font-size:13px}
  .filtration-evaluation{grid-template-columns:48px 1fr;padding:17px;border-radius:21px;gap:12px;margin-top:18px}
  .filtration-evaluation-icon{width:48px;height:48px;border-radius:14px}.filtration-evaluation-icon svg{width:23px;height:23px}
  .filtration-evaluation h3{font-size:20px}.filtration-evaluation p{font-size:13px}
  .filtration-evaluation-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr;gap:8px}.filtration-evaluation-actions .btn{width:100%}.filtration-evaluation-actions>span{justify-content:center}
}

@media (max-width:380px){
  .filtration-copy h2{font-size:35px}
  .filtration-poster-badge b{font-size:11px}
  .filtration-zoom-hint{font-size:10px;padding:7px 9px}
  .filtration-stages-head h3{font-size:28px}
}

/* =========================================================
   COLOR BOOST V2.14
   Ajuste suave: más vivos sin perder estética premium.
   ========================================================= */
:root{
  --blue:#00aeea;
  --blue2:#047fc4;
  --blue3:#24c4ef;
  --deep:#064b78;
  --navy:#052c4c;
  --navy2:#031f36;
  --green:#20d80a;
  --green2:#35e31b;
  --cyan:#67d9f4;
  --sky:#dff9ff;
  --paper:#f2fbff;
  --line:#cfe8f3;
}

/* Superficies claras con un poco más de energía */
.catalog{
  background:linear-gradient(180deg,#f7fdff 0%,#e8f8ff 100%);
}
.coverage{
  background:linear-gradient(180deg,#fff 0%,#e9f9ff 100%);
}
.section-kicker>span,
.feature-icon,
.note-icon{
  background:linear-gradient(145deg,#e5faff,#c9f2ff);
}

/* Hero: azul más limpio y destellos más visibles */
.hero{
  background:#06466f;
}
.hero-bg{
  background:
    linear-gradient(90deg,rgba(2,37,62,.88) 0%,rgba(3,72,110,.66) 45%,rgba(2,78,115,.16) 76%),
    url('../img/hero-water.jpg') center/cover no-repeat;
}
.hero-mesh{
  background:
    radial-gradient(circle at 16% 22%,rgba(52,211,248,.34),transparent 25%),
    radial-gradient(circle at 82% 18%,rgba(41,226,16,.19),transparent 22%),
    radial-gradient(circle at 68% 85%,rgba(58,207,246,.27),transparent 27%);
}
.hero-card{
  background:linear-gradient(150deg,rgba(4,183,231,.70),rgba(3,68,110,.82));
  border-color:rgba(136,238,255,.30);
}
.hero-offer>strong{color:#e7ff28}

/* Botones y CTA: mayor saturación */
.btn-primary{
  background:linear-gradient(135deg,#25c9f1 0%,#047dc3 100%);
  box-shadow:0 13px 30px rgba(0,145,210,.29);
}
.btn-primary:hover{box-shadow:0 18px 42px rgba(0,145,210,.38)}
.nav-cta{
  background:linear-gradient(135deg,#32e515 0%,#16bd04 100%);
  box-shadow:0 11px 28px rgba(28,214,8,.30);
}
.cta-band{
  background:linear-gradient(135deg,#08afe7 0%,#056fb2 100%);
}

/* Proceso: oscuro pero menos apagado */
.process{
  background:linear-gradient(150deg,#063c65 0%,#075f90 100%)!important;
}
.process:before{
  background:radial-gradient(circle,rgba(62,216,247,.30),transparent 64%);
}
.process .step-icon{
  background:linear-gradient(145deg,#25c8ef,#087dc1);
  box-shadow:0 12px 30px rgba(0,154,220,.28);
}

/* Sistemas de filtración: más vivo, sin verse chillón */
.filtration-systems{
  background:linear-gradient(180deg,#ffffff 0%,#eefbff 49%,#e5f7fd 100%);
}
.filtration-systems:before{
  opacity:.55;
  background-image:radial-gradient(circle,rgba(0,145,205,.16) 1px,transparent 1.5px);
}
.filtration-orb-a{
  background:radial-gradient(circle,rgba(31,200,239,.26),rgba(31,200,239,0) 68%);
}
.filtration-orb-b{
  background:radial-gradient(circle,rgba(39,220,17,.15),rgba(39,220,17,0) 70%);
}
.filtration-sources span{
  border-color:#c5e9f5;
  box-shadow:0 9px 24px rgba(0,116,169,.08);
}
.filtration-results article{
  background:rgba(255,255,255,.94);
  border-color:#cbeaf4;
  box-shadow:0 13px 30px rgba(3,98,143,.075);
}
.filtration-results article>span{
  background:linear-gradient(145deg,#2bcef3,#087fc4);
  box-shadow:0 10px 24px rgba(0,143,205,.23);
}
.filtration-stage{
  background:linear-gradient(155deg,#fff 0%,#edfaff 100%);
  border-color:#cceaf4;
}
.filtration-stage:after{
  background:radial-gradient(circle,rgba(24,199,237,.18),transparent 70%);
}
.filtration-stage-num{color:#8ed8ea}
.filtration-evaluation{
  background:linear-gradient(135deg,#064d7d 0%,#0787b8 100%);
  box-shadow:0 24px 56px rgba(2,87,132,.22);
}
.filtration-evaluation-icon{
  color:#a7f2ff;
  background:rgba(255,255,255,.14);
}
.filtration-evaluation small{color:#99efff}

/* Mapa y pequeños acentos */
.map-card{
  background:radial-gradient(circle at 40% 35%,#b8f4ff 0%,#2cc4eb 55%,#0877b2 100%);
}
.map-pin{
  background:linear-gradient(145deg,#34e61a,#17bd05);
}
.city-grid span svg{color:#20d80a}

@media(max-width:767px){
  .process{background:linear-gradient(155deg,#06466f 0%,#0876a7 100%)!important}
  .filtration-systems{background:linear-gradient(180deg,#fff 0%,#ecfaff 100%)}
}

/* =========================================================
   FORM UX + TYPOGRAPHY V2.15
   Formulario más legible y respuesta AJAX sin saltos de página.
   ========================================================= */
.form-card{
  padding:36px;
}
.form-top{
  gap:15px;
  padding-bottom:22px;
  margin-bottom:22px;
}
.form-icon{
  width:52px;
  height:52px;
  border-radius:16px;
  flex:0 0 52px;
}
.form-icon svg{width:23px;height:23px}
.form-top b{
  font-family:var(--font-title);
  font-size:20px;
  line-height:1.15;
  font-weight:800;
  color:var(--deep);
}
.form-top small{
  margin-top:4px;
  font-size:14px;
  line-height:1.35;
  color:#607887;
}
.form-card label{
  gap:9px;
  margin-bottom:17px;
  font-size:15px;
  line-height:1.2;
  font-weight:700;
  color:#294b5e;
}
.form-card label>span{
  gap:8px;
  min-height:22px;
  font-size:15px;
}
.form-card label>span svg{
  width:18px;
  height:18px;
  flex:0 0 18px;
}
.form-card input,
.form-card textarea,
.form-card select{
  min-height:52px;
  padding:15px 16px;
  border-radius:15px;
  font-size:16px;
  line-height:1.35;
  font-weight:400;
}
.form-card textarea{
  min-height:138px;
  resize:vertical;
}
.form-card input::placeholder,
.form-card textarea::placeholder{
  color:#718491;
  opacity:1;
}
.form-card select{
  cursor:pointer;
}
.form-card .btn.full{
  min-height:56px;
  margin-top:3px;
  font-size:16px;
}
.form-card .privacy{
  margin-top:13px;
  font-size:12px;
  line-height:1.4;
}
.form-card .privacy svg{width:14px;height:14px}
.form-alert{
  min-height:48px;
  padding:13px 16px;
  margin:0 0 20px;
  border-radius:14px;
  font-size:15px;
  line-height:1.35;
  font-weight:600;
}
.form-alert[hidden]{display:none!important}
.form-alert svg{width:20px;height:20px;flex:0 0 20px}
.form-alert.success{background:#e3f8df;color:#236c1c;border:1px solid #c7edc0}
.form-alert.error{background:#fff0ee;color:#913529;border:1px solid #f1cdc7}
.form-alert.sending{background:#e9f7fd;color:#146386;border:1px solid #c8e8f5}
.form-card.is-sending .btn[type="submit"]{
  pointer-events:none;
  opacity:.78;
}
.form-card.is-sending .btn[type="submit"] .btn-arrow{display:none}

@media(max-width:600px){
  .form-card{padding:24px 19px}
  .form-top b{font-size:19px}
  .form-top small{font-size:14px}
  .form-card label,.form-card label>span{font-size:15px}
  .form-card input,.form-card textarea,.form-card select{font-size:16px;padding:15px}
  .form-card .btn.full{font-size:16px}
  .form-card .privacy{font-size:12px;padding-inline:5px}
  .form-alert{font-size:14px}
}