﻿:root{--night:#0b1721;--night-2:#122733;--ink:#162b35;--muted:#60717a;--ice:#e7f1f1;--cyan:#83e1de;--orange:#ff8a35;--paper:#f7f9f7;--line:#cbd7d6}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 'Segoe UI',system-ui,sans-serif}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:'Trebuchet MS','Segoe UI',system-ui,sans-serif;letter-spacing:-.055em;line-height:1.08}a{color:inherit;text-underline-offset:.2em}button,input{font:inherit}button{cursor:pointer}img{max-width:100%;height:auto}::selection{background:var(--cyan);color:var(--night)}:focus-visible{outline:3px solid var(--orange);outline-offset:4px}.shell{width:min(100% - 80px,1320px);margin-inline:auto}.skip-link{position:absolute;top:-100px;left:16px;z-index:100;background:white;color:var(--night);padding:9px 16px}.skip-link:focus{top:12px}.preview-alert{position:relative;z-index:12;background:#142c37;color:#d6e7e7;text-align:center;padding:6px 12px;font-size:11px;letter-spacing:.12em;font-weight:700}.header{position:sticky;top:0;z-index:10;background:rgba(11,23,33,.88);backdrop-filter:blur(20px);border-bottom:1px solid rgba(220,248,246,.14);color:white}.header-inner{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:25px}.brand{display:inline-flex;align-items:center;flex:none}.brand img{width:206px;height:auto}.desktop-nav,.header-actions{display:flex;align-items:center;gap:30px}.desktop-nav a,.header-phone{color:#e9f2f2;text-decoration:none;font-size:.88rem;font-weight:600;white-space:nowrap}.desktop-nav a:hover,.header-phone:hover{color:var(--cyan)}.header-actions{gap:22px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:38px;min-height:55px;padding:14px 23px;border:1px solid var(--orange);border-radius:4px;background:var(--orange);color:#17232b;text-decoration:none;font-weight:800;line-height:1.2;transition:background .25s,color .25s,transform .25s,box-shadow .25s}.button:hover:not(:disabled){background:#ffaf70;border-color:#ffaf70;transform:translateY(-3px);box-shadow:0 12px 32px rgba(255,138,53,.22)}.button--small{min-height:42px;padding:10px 15px;gap:15px;font-size:.82rem}.button--ghost{background:transparent;color:white;border-color:#a4e9e4}.button--ghost:hover{color:var(--night)}.button:disabled{cursor:default;opacity:.75}.button span{font-size:1.3rem;font-weight:400;line-height:0}

.hero{position:relative;isolation:isolate;overflow:hidden;background:var(--night);color:white}.hero::before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(174,232,229,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(174,232,229,.055) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(90deg,#000,transparent 75%)}.hero-light{pointer-events:none;position:absolute;z-index:-1;border-radius:50%;filter:blur(110px);opacity:.35}.hero-light--one{width:600px;height:600px;right:5%;top:-15%;background:#37757f;animation:float 13s ease-in-out infinite alternate}.hero-light--two{width:360px;height:360px;bottom:-190px;left:15%;background:#a74a22;opacity:.18;animation:float 10s ease-in-out infinite alternate-reverse}.hero-grid{min-height:650px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:min(6vw,90px);padding-block:78px 72px}.hero-copy{position:relative;z-index:2}.overline{display:flex;align-items:center;gap:12px;color:var(--cyan);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;margin-bottom:32px}.live-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 5px rgba(131,225,222,.12),0 0 23px var(--cyan);animation:pulse 2.7s ease-in-out infinite}.hero h1{font-size:clamp(3.3rem,5.8vw,6.6rem);font-weight:600;line-height:1.01;margin:0 0 32px}.hero h1 span{color:var(--cyan)}.hero-lead{color:#d2e1e3;max-width:570px;font-size:clamp(1.02rem,1.35vw,1.18rem);line-height:1.75;margin-bottom:32px}.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.text-link{color:white;text-decoration:none;font-weight:700;font-size:.91rem}.text-link:hover{color:var(--cyan)}.text-link span{margin-left:7px}.hero-art{position:relative;min-width:0;perspective:1200px}.photo-frame{position:relative;z-index:1;clip-path:polygon(5% 0,100% 0,100% 94%,95% 100%,0 100%,0 6%);aspect-ratio: .98;overflow:hidden;border:1px solid rgba(180,236,236,.27);box-shadow:0 40px 100px rgba(0,0,0,.35)}.photo-frame::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(7,20,29,.6))}.photo-frame img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.82) contrast(1.07);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}.hero-art:hover .photo-frame img{transform:scale(1.045)}.photo-glow{position:absolute;z-index:-1;inset:7%;background:#3bced3;filter:blur(75px);opacity:.25}.orbit{position:absolute;z-index:2;border:1px solid rgba(131,225,222,.65);pointer-events:none}.orbit--one{width:60%;height:55%;right:-8%;top:-9%;border-left:0;border-bottom:0;animation:orbit 10s ease-in-out infinite alternate}.orbit--two{width:47%;height:30%;left:-5%;bottom:-6%;border-right:0;border-top:0;animation:orbit 8s ease-in-out infinite alternate-reverse}.photo-tag{position:absolute;z-index:3;bottom:48px;left:-22px;padding:13px 17px;background:rgba(11,23,33,.9);border:1px solid rgba(131,225,222,.55);backdrop-filter:blur(12px);font-size:.72rem;letter-spacing:.11em;font-weight:700;white-space:nowrap;box-shadow:0 15px 40px rgba(0,0,0,.25)}.signal{display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 16px var(--cyan)}.photo-caption{position:absolute;z-index:3;bottom:16px;right:15px;font-size:.65rem;color:#f0f7f7;text-align:right;text-shadow:0 1px 3px black}.hero-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(173,231,228,.16);padding-block:17px;color:#a5c3c7;font-size:.69rem;letter-spacing:.15em;font-weight:700}.hero-bottom a{text-decoration:none;color:var(--cyan)}.hero-bottom a span{font-size:1.15rem;margin-left:8px}

.section{padding-block:clamp(88px,10vw,148px);scroll-margin-top:85px}.section-top{display:flex;align-items:center;gap:18px;font-size:.69rem;font-weight:800;letter-spacing:.15em;color:#53717a;white-space:nowrap;margin-bottom:58px}.section-top .rule{height:1px;background:var(--line);flex:1}.manifesto{background:#f7f9f7}.manifesto-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:8%;align-items:end;margin-bottom:70px}.manifesto h2,.flow h2,.contact h2{font-size:clamp(2.6rem,5vw,5.6rem);max-width:850px;font-weight:600;margin:0}.manifesto h2 em{font-style:normal;color:#318a91}.section-lead{font-size:1.13rem;line-height:1.8;color:#475f68;max-width:395px;margin-bottom:4px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.feature{position:relative;border-top:2px solid #294752;padding:30px 16px 36px 0;transition:transform .3s}.feature:hover{transform:translateY(-7px)}.feature-icon{width:66px;height:66px;display:grid;place-items:center;border:1px solid #ccdedd;background:#eaf3f2;margin-bottom:26px;clip-path:polygon(0 0,100% 0,100% 78%,78% 100%,0 100%)}.feature-icon img{width:43px;height:43px}.feature h3{font-size:1.6rem;font-weight:600;margin-bottom:14px}.feature p{max-width:335px;color:#4d6068;line-height:1.75}.feature-line{position:absolute;bottom:0;left:0;width:25%;height:2px;background:#339197;transition:width .4s}.feature:hover .feature-line{width:100%}

.flow{background:#e7f1f1}.flow-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:55px}.flow-heading p{max-width:360px;color:#4d646b;line-height:1.8;margin-bottom:0}.flow-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:8%;align-items:stretch}.flow-tabs{border-top:1px solid #b3c9cc}.flow-tab{appearance:none;border:0;border-bottom:1px solid #b3c9cc;background:transparent;width:100%;text-align:left;display:flex;align-items:center;gap:22px;padding:27px 12px;color:#52646b;transition:background .25s,color .25s,padding .25s}.flow-tab:hover{background:rgba(255,255,255,.5)}.flow-tab.is-active{color:#163139;padding-left:21px;background:#fff;border-left:3px solid #ff8a35}.flow-tab span{font-size:.77rem;font-weight:800;letter-spacing:.08em}.flow-tab strong{font-family:'Trebuchet MS',sans-serif;font-size:clamp(1.1rem,2vw,1.55rem);letter-spacing:-.04em;font-weight:600}.flow-tab svg{width:21px;margin-left:auto;fill:none;stroke:currentColor;stroke-width:1.7;opacity:.4}.flow-tab.is-active svg{opacity:1;color:#bf5e17}.flow-panel{min-height:440px;background:var(--night-2);color:white;padding:clamp(26px,4vw,46px);display:flex;flex-direction:column;overflow:hidden;position:relative}.flow-panel-top{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:.72rem;letter-spacing:.11em;color:#c0d6d7;font-weight:700}.flow-status{color:var(--cyan)}.flow-status i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--cyan);vertical-align:middle;margin-right:6px}.flow-panel-art{position:relative;height:135px;margin:34px 0 12px;overflow:hidden;background:repeating-linear-gradient(0deg,transparent 0 22px,rgba(131,225,222,.07) 23px),repeating-linear-gradient(90deg,transparent 0 22px,rgba(131,225,222,.07) 23px)}.flow-panel h3{font-size:clamp(1.7rem,2.5vw,2.4rem);margin:0 0 13px;font-weight:600}.flow-panel p{max-width:480px;color:#d0e0e2;margin-bottom:26px}.flow-panel a{margin-top:auto;color:var(--cyan);font-weight:700;text-decoration:none}.flow-panel a span{margin-left:10px}

.statement{background:#12313b;color:white;position:relative;overflow:hidden}.statement::before{content:'';position:absolute;width:650px;height:650px;border:1px solid rgba(123,215,215,.2);border-radius:50%;right:-170px;top:-220px;box-shadow:0 0 0 100px rgba(123,215,215,.035),0 0 0 200px rgba(123,215,215,.025)}.statement-inner{position:relative}.statement .section-index{color:#b0d2d5;font-size:.73rem;letter-spacing:.13em}.statement h2{font-size:clamp(2.7rem,5.4vw,6rem);margin:28px 0;max-width:1100px;font-weight:600}.statement h2 span{color:var(--cyan)}.statement p{max-width:580px;color:#d2e3e4;font-size:1.07rem;line-height:1.8;margin-bottom:34px}

.contact{background:#f5f7f5}.contact-grid{display:grid;grid-template-columns:1fr .85fr;gap:10%;align-items:start}.contact-copy h2{margin-bottom:30px}.contact-copy h2 span{color:#287f88}.contact-copy>p{max-width:480px;color:#4e6069;font-size:1.1rem;line-height:1.75}.contact-alternatives{margin-top:42px;max-width:410px}.contact-alternatives a{display:flex;justify-content:space-between;gap:12px;padding:16px 0;border-top:1px solid #c3d0d1;font-weight:700;text-decoration:none}.contact-alternatives a:hover{color:#a84f0a}.contact-form{background:white;border:1px solid #cedbdc;padding:clamp(26px,4vw,48px);box-shadow:18px 18px 0 #dbe9e8}.form-title{font:600 2rem/1.15 'Trebuchet MS',sans-serif;letter-spacing:-.045em;margin-bottom:7px}.form-intro{color:#63747b;font-size:.85rem;margin-bottom:27px}.contact-form form{display:grid;gap:9px}.contact-form label:not(.form-check){font-size:.83rem;font-weight:700;margin-top:9px}.contact-form input:not([type=checkbox]){width:100%;border:1px solid #bccdcf;background:#f8fbfa;border-radius:3px;padding:12px 14px;color:var(--ink)}.contact-form input:disabled{opacity:1}.form-check{display:flex;align-items:start;gap:9px;font-size:.81rem;margin:15px 0 8px}.form-check a{color:#a84f0a}.contact-form button{width:100%}

.footer{background:#0b1721;color:#e5f2f2;padding:65px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px}.footer-grid .brand img{max-width:205px}.footer p{font-size:.9rem;color:#b7d1d1;max-width:320px;margin:20px 0 0}.footer .footer-label{color:var(--cyan);font-size:.7rem;letter-spacing:.14em;font-weight:800;margin:0 0 15px}.footer-grid a:not(.brand){display:block;text-decoration:none;font-size:.88rem;margin:7px 0}.footer-grid a:hover{color:var(--cyan)}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.14);padding-top:20px;margin-top:60px;color:#91a9aa;font-size:.75rem}

.js [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.js [data-reveal].is-visible{opacity:1;transform:none}.feature:nth-child(2){transition-delay:.09s}.feature:nth-child(3){transition-delay:.18s}@keyframes float{from{transform:translate3d(0,0,0)}to{transform:translate3d(-60px,45px,0)}}@keyframes pulse{50%{box-shadow:0 0 0 9px rgba(131,225,222,.09),0 0 30px var(--cyan)}}@keyframes orbit{to{transform:translate(12px,-12px)}}
@media(max-width:1100px){.desktop-nav{gap:14px}.header-phone{display:none}.hero-grid{gap:35px}.hero h1{font-size:clamp(3.1rem,6vw,5.4rem)}}
@media(max-width:800px){.shell{width:min(100% - 40px,600px)}.desktop-nav{display:none}.header-inner{min-height:68px}.brand img{width:160px}.hero-grid,.manifesto-grid,.flow-layout,.contact-grid{grid-template-columns:1fr}.hero-grid{padding-top:65px;padding-bottom:65px;gap:55px}.hero h1{font-size:clamp(3rem,9vw,5rem)}.hero-quick{margin-top:30px}.hero-art{max-width:550px;width:100%;margin:auto}.photo-frame{aspect-ratio:1.15}.flow-heading{display:block}.flow-heading p{margin-top:20px}.flow-layout{gap:26px}.flow-panel{min-height:400px}.manifesto-grid{gap:22px}.manifesto-grid .section-lead{max-width:600px}.feature-grid{grid-template-columns:1fr;gap:0}.feature{display:grid;grid-template-columns:72px 1fr;column-gap:15px;padding:20px 0}.feature-icon{grid-row:span 2;margin:0}.feature h3{margin:3px 0}.feature p{margin:0}.feature-line{display:none}.contact-grid{gap:45px}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}
@media(max-width:520px){.preview-alert{font-size:9px;letter-spacing:.03em}.shell{width:calc(100% - 36px)}.header .button--small{gap:4px;font-size:.72rem;padding:9px 10px;min-height:40px}.brand img{width:142px}.hero-grid{padding-top:52px;gap:38px}.hero h1{font-size:clamp(2.9rem,12vw,4.2rem)}.hero-lead{font-size:1rem}.hero-actions{align-items:flex-start;flex-direction:column;gap:16px}.hero-quick{font-size:.69rem}.photo-tag{left:6px;bottom:28px;font-size:.57rem;padding:9px}.photo-caption{font-size:.57rem;bottom:8px}.hero-bottom{font-size:.58rem}.section{padding-block:80px}.section-top{font-size:.55rem;gap:10px;margin-bottom:38px}.manifesto h2,.flow h2,.contact h2{font-size:clamp(2.6rem,10vw,4rem)}.flow-tab{padding:19px 10px}.flow-panel{padding:25px;min-height:420px}.flow-panel-top{font-size:.57rem}.statement h2{font-size:clamp(2.65rem,11vw,4rem)}.contact-form{box-shadow:8px 8px 0 #dbe9e8}.footer-grid{gap:30px}.footer-bottom{display:block}.footer-bottom span{display:block;margin:7px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.js [data-reveal]{opacity:1;transform:none}}

/* Revisión: la acción principal está en la primera pantalla y el movimiento no compite con ella. */
.hero-light,.orbit,.live-dot{animation:none}
.js [data-reveal]{opacity:1;transform:none;transition:none}
.js .hero-copy[data-reveal],.js .hero-art[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .65s ease,transform .65s ease}
.js .hero-copy.is-visible,.js .hero-art.is-visible{opacity:1;transform:none}
.quick-contact{max-width:580px;padding:21px 0 0;border-top:1px solid rgba(131,225,222,.4)}
.quick-contact h2{font-size:1.35rem;letter-spacing:-.035em;margin-bottom:4px}
.quick-contact>p{font-size:.88rem;color:#cadcdd;margin-bottom:15px}
.quick-form .quick-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.quick-form label{font-size:.75rem;font-weight:700;color:#e5f2f2}
.quick-fields label{display:block}
.quick-fields input{display:block;width:100%;min-height:41px;margin-top:5px;border:1px solid #607e82;border-radius:3px;background:#f5f9f8;color:var(--ink);padding:9px 12px;font-size:.89rem;opacity:1}
.quick-fields .quick-town{grid-column:1/-1}
.quick-consent{display:flex;align-items:flex-start;gap:8px;margin:12px 0 13px;line-height:1.5}
.quick-consent input{margin:3px 0 0;opacity:1}
.quick-consent a{color:var(--cyan)}
.quick-form .button{min-height:46px;width:100%}
.quick-contact small{display:block;margin-top:9px;font-size:.71rem;color:#a7bfc2}
.hero-actions{margin-top:18px;gap:22px}.hero-actions .text-link{font-size:.82rem}
.hero-grid{align-items:center}.hero h1{margin-bottom:20px}.hero-lead{margin-bottom:24px}
.feature:hover{transform:none}.feature:hover .feature-line{width:25%}
@media(max-width:520px){.quick-form .quick-fields{grid-template-columns:1fr}.quick-fields .quick-town{grid-column:auto}.hero-grid{gap:30px}}
@media(prefers-reduced-motion:reduce){.js .hero-copy[data-reveal],.js .hero-art[data-reveal]{opacity:1;transform:none;transition:none}}

/* Panel de altura constante: el diagrama no se comprime al cambiar de etapa. */
.flow-panel{height:490px;min-height:0}
.flow-panel-art{flex:0 0 135px}
.flow-diagram{display:block;width:100%;height:100%;overflow:visible}
/* Diagrama de etapas: escena fija + capa propia de cada etapa. */
.d-ground{stroke:rgba(131,225,222,.35);stroke-width:1.5}
.d-line{fill:none;stroke:var(--cyan);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.d-window{fill:transparent;stroke:rgba(131,225,222,.55);stroke-width:1.5;transition:fill .5s ease}
.d-sun{fill:rgba(255,138,53,.12);stroke:var(--orange);stroke-width:2.5;transition:fill .5s ease}
.d-step{opacity:0;transition:opacity .4s ease}
.flow-panel-art[data-step="0"] .d-step--0,.flow-panel-art[data-step="1"] .d-step--1,.flow-panel-art[data-step="2"] .d-step--2{opacity:1}
.d-step text{font:600 12px 'Segoe UI',system-ui,sans-serif;fill:#cfe3e4}
.d-bubble{fill:#173944;stroke:var(--cyan);stroke-width:1.5;stroke-linejoin:round}
.d-bubble--reply{fill:rgba(255,138,53,.14);stroke:var(--orange)}
.d-step .d-say{font-size:14px;fill:#fff;text-anchor:middle;dominant-baseline:central}
.d-step .d-say--reply{fill:#ffd2ad}
.d-step .d-label{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;fill:#9fc4c7}
.d-arc{fill:none;stroke:rgba(255,173,112,.6);stroke-width:1.5;stroke-dasharray:4 6}
.d-measure{fill:none;stroke:#ffad70;stroke-width:1.5;stroke-linecap:round}
.d-bars rect{fill:var(--cyan);opacity:.75;transform-box:fill-box;transform-origin:bottom}
.d-panels rect{fill:#285969;stroke:#ffad70;stroke-width:1.5}
.d-flow{fill:none;stroke:#ffad70;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:18 160}
.d-inverter{fill:#173944;stroke:var(--cyan);stroke-width:1.5}
.d-power{fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round;stroke-dasharray:5 5}
.d-badge rect{fill:rgba(131,225,222,.12);stroke:var(--cyan);stroke-width:1.5}
.d-badge path{fill:none;stroke:var(--cyan);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.d-step .d-badge text{font-size:12.5px;fill:#fff;text-anchor:middle;dominant-baseline:central}
/* En la etapa 3 la casa se «enciende». */
.flow-panel-art[data-step="2"] .d-window{fill:rgba(255,173,112,.35)}
.flow-panel-art[data-step="2"] .d-sun{fill:rgba(255,138,53,.35)}
/* Animaciones solo en la etapa visible. */
.flow-panel-art[data-step="0"] .d-bubble--reply,.flow-panel-art[data-step="0"] .d-say--reply{animation:d-appear .5s .6s ease both}
.flow-panel-art[data-step="1"] .d-bars rect{animation:d-grow .7s ease both}
.flow-panel-art[data-step="1"] .d-bars rect:nth-child(even){animation-delay:.1s}
.flow-panel-art[data-step="1"] .d-measure{stroke-dasharray:160;animation:d-draw 1s ease both}
.flow-panel-art[data-step="2"] .d-flow{animation:d-flow 2.4s linear infinite}
.flow-panel-art[data-step="2"] .d-flow--late{animation-delay:1.2s}
.flow-panel-art[data-step="2"] .d-power{animation:d-power 1s linear infinite}
@keyframes d-appear{from{opacity:0}}
@keyframes d-grow{from{transform:scaleY(0)}}
@keyframes d-draw{from{stroke-dashoffset:160}}
@keyframes d-flow{from{stroke-dashoffset:178}to{stroke-dashoffset:0}}
@keyframes d-power{to{stroke-dashoffset:-10}}
.d-badge circle{fill:rgba(131,225,222,.12);stroke:var(--cyan);stroke-width:2}
.d-badge--mini path{stroke-width:3.5}
.d-dots circle{fill:#fff}.d-dots circle:nth-child(n+4){fill:#ffd2ad}
.d-dots,.d-badge--mini{display:none}
/* En móvil el texto del diagrama quedaría ilegible: se sustituye por iconos. */
@media(max-width:520px){
  .d-step text,.d-measure,.d-badge:not(.d-badge--mini){display:none}
  .d-dots,.d-badge--mini{display:inline}
}
.flow-panel h3{min-height:2.2em}
.flow-panel p{min-height:4.5em}
.statement::before{display:none}
@media(max-width:900px){.flow-panel{height:490px}}
@media(max-width:520px){.flow-panel{height:auto;min-height:510px}.flow-panel h3,.flow-panel p{min-height:0}.flow-panel-art{flex:0 0 130px}}

/* Título y etapas a la izquierda; el diagrama ocupa toda la columna derecha. */
.flow-layout{align-items:stretch}
.flow-left{min-width:0;display:flex;flex-direction:column;justify-content:space-between}
.flow-left .flow-heading{display:block;margin:0 0 34px}
.flow-panel{height:auto;min-height:540px}
.flow-panel-art{flex:1 1 auto;min-height:200px;margin:28px 0 16px}
@media(max-width:800px){.flow-left{gap:30px}.flow-left .flow-heading{margin:0}.flow-panel{min-height:470px}}
@media(max-width:520px){.flow-panel{min-height:500px}.flow-panel-art{flex:0 0 150px}}

/* Franja de garantías al pie del hero: sustituye a una etiqueta que repetía la numeración 01. */
.hero-points{display:flex;flex-wrap:wrap;gap:8px 28px;margin:0;padding:0;list-style:none;color:#c4dadc;letter-spacing:.12em;text-transform:uppercase}
.hero-points li{display:flex;align-items:center;gap:10px}
.hero-points li::before{content:'';width:6px;height:6px;flex:none;background:var(--orange);transform:rotate(45deg)}
.hero-bottom{gap:20px}.hero-bottom a{white-space:nowrap}
@media(max-width:800px){.hero-bottom{flex-direction:column;align-items:flex-start;gap:14px}.hero-points{flex-direction:column}}

/* Barra de progreso del avance automático: indica que la etapa cambiará sola. */
.flow-progress{height:2px;margin-top:14px;background:rgba(131,225,222,.15);overflow:hidden}
.flow-progress span{display:block;height:100%;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .1s linear}
.flow-progress.is-stopped{visibility:hidden}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 01 · Comparativa: lo habitual en el sector frente a nuestra forma de trabajar. */
.compare{border-top:2px solid #294752}
.compare-head,.compare-row{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr) minmax(0,1.15fr);gap:0 clamp(18px,3vw,44px);align-items:center}
.compare-head{padding:16px 0;font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#6c7f86}
.compare-head span:last-child{color:#287f88}
.compare-row{padding:26px 0;border-top:1px solid var(--line)}
.compare-row h3{display:flex;align-items:center;gap:16px;margin:0;font-size:1.45rem;font-weight:600}
.compare-row h3 img{width:46px;height:46px;padding:7px;flex:none;background:#eaf3f2;border:1px solid #ccdedd;clip-path:polygon(0 0,100% 0,100% 78%,78% 100%,0 100%)}
.compare-row p{margin:0;line-height:1.6}
.compare-usual{display:flex;gap:12px;color:#6c7f86}
.compare-usual::before{content:'×';flex:none;color:#a0afb3;font-size:1.25rem;line-height:1.2}
.compare-ours{position:relative;display:flex;gap:12px;padding:16px 18px;background:#fff;border-left:3px solid var(--orange);color:var(--ink);font-weight:600;box-shadow:0 10px 30px rgba(22,43,53,.06)}
.compare-ours::before{content:'';flex:none;width:18px;height:18px;margin-top:2px;border-radius:50%;background:#287f88 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='m5 9.3 2.6 2.6L13 6.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
@media(max-width:800px){.compare-head{display:none}.compare-row{grid-template-columns:1fr;gap:12px;padding:24px 0}.compare-row h3{font-size:1.3rem}}

/* 03 · Compromiso: línea de lo que pasa después del montaje. */
.statement-inner{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,80px);align-items:end;margin-bottom:clamp(48px,6vw,80px)}
.statement h2{font-size:clamp(2.6rem,4.6vw,5.1rem);margin-bottom:0}
.statement .statement-lead{margin:0;max-width:470px}
.after-line{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,34px);margin:0 0 54px;padding:0;list-style:none}
.after-line::before{content:'';position:absolute;top:9px;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--cyan) 0 30%,rgba(131,225,222,.25) 30%)}
.after-step{position:relative;padding-top:42px}
.after-dot{position:absolute;top:0;left:0;width:20px;height:20px;border-radius:50%;background:#12313b;border:2px solid var(--cyan)}
.after-step--done .after-dot{background:var(--cyan)}
.after-step--goal .after-dot{background:var(--orange);border-color:var(--orange);box-shadow:0 0 18px rgba(255,138,53,.6)}
.after-flag{position:absolute;top:-40px;left:0;padding:5px 9px;border:1px dashed #ffad70;color:#ffcfa6;font-size:.66rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.after-step small{display:block;color:#9fc4c7;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
.after-step strong{display:block;font:600 clamp(1.2rem,1.7vw,1.5rem)/1.2 'Trebuchet MS',sans-serif;letter-spacing:-.03em;margin-bottom:10px}
.statement .after-step p{margin:0;font-size:.95rem;line-height:1.65;color:#c4dadc}
@media(max-width:900px){.statement-inner{grid-template-columns:1fr;align-items:start}.after-line{grid-template-columns:1fr 1fr;row-gap:56px}.after-line::before{display:none}}
@media(max-width:520px){.after-line{grid-template-columns:1fr;row-gap:30px;padding-left:36px}.after-line::before{display:block;top:0;bottom:0;left:9px;right:auto;width:2px;height:auto;background:linear-gradient(var(--cyan) 0 20%,rgba(131,225,222,.25) 20%)}.after-step{padding-top:0}.after-dot{left:-36px}.after-flag{position:static;display:inline-block;margin-bottom:10px}}

/* Dudas frecuentes */
.faq{background:var(--paper)}
.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8%;align-items:start}
.faq h2{font-size:clamp(2.4rem,4.4vw,4.6rem);font-weight:600;margin-bottom:24px}
.faq h2 span{color:#287f88}
.faq-intro p{max-width:400px;color:#4e6069;font-size:1.08rem;line-height:1.75;margin-bottom:26px}
.faq-whatsapp{font-weight:700;text-decoration:none;color:#a84f0a}.faq-whatsapp span{margin-left:8px}.faq-whatsapp:hover{color:var(--ink)}
.faq-list{border-top:2px solid #294752}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 4px;cursor:pointer;list-style:none;font:600 clamp(1.1rem,1.6vw,1.35rem)/1.3 'Trebuchet MS',sans-serif;letter-spacing:-.03em}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:'+';flex:none;width:34px;height:34px;display:grid;place-items:center;border:1px solid #b3c9cc;border-radius:50%;font:400 1.3rem/1 'Segoe UI',sans-serif;color:#287f88;transition:transform .25s,background .25s,color .25s}
.faq-list details[open] summary::after{transform:rotate(45deg);background:var(--night-2);border-color:var(--night-2);color:var(--cyan)}
.faq-list summary:hover{color:#287f88}
.faq-list details p{max-width:620px;margin:-6px 54px 24px 4px;color:#4d6068;line-height:1.75}
.footer .footer-area{margin-top:14px;font-size:.82rem;color:#91a9aa}

/* Contacto con fondo propio para que no se funda con las dudas. */
.contact{background:var(--ice);position:relative;overflow:hidden}
.contact::before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(40,127,136,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(40,127,136,.07) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(90deg,transparent 30%,#000)}
.contact-grid{position:relative}
.contact-form{box-shadow:18px 18px 0 #c9dedd}
.contact-alternatives a{border-color:#b3c9cc}

/* Hero: la foto ocupa toda la altura de la columna en escritorio. */
@media(min-width:801px){
  .hero-grid{align-items:stretch}
  .hero-art{display:flex}
  .photo-frame{flex:1;aspect-ratio:auto;min-height:100%}
}
@media(max-width:800px){.faq-grid{grid-template-columns:1fr;gap:34px}}

/* Contacto rápido fijo en móvil: llamar y WhatsApp siempre a un toque. */
.mobile-bar{display:none}
@media(max-width:800px){
  .mobile-bar{position:fixed;z-index:20;left:0;right:0;bottom:0;display:grid;grid-template-columns:1.6fr 1fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(11,23,33,.94);backdrop-filter:blur(16px);border-top:1px solid rgba(220,248,246,.16)}
  .mobile-bar a{display:grid;place-items:center;min-height:46px;border:1px solid rgba(131,225,222,.45);border-radius:4px;color:#e9f2f2;text-decoration:none;font-weight:700;font-size:.88rem}
  .mobile-bar .mobile-bar-main{background:var(--orange);border-color:var(--orange);color:#17232b}
  body{padding-bottom:70px}
}



/* ===== Integración con WordPress ===== */
/* WordPress separa los bloques de primer nivel con un margen: la portada va pegada. */
body .wp-site-blocks > * + *{margin-block-start:0}
body .wp-site-blocks > header{position:sticky;top:0;z-index:30}
.admin-bar .wp-site-blocks > header{top:32px}
@media(max-width:782px){.admin-bar .wp-site-blocks > header{top:46px}}
.header{position:relative}
.header-inner > *,.footer-grid > *{margin:0}

/* Logotipo (bloque «Logo del sitio»). */
.wp-block-site-logo.brand{display:inline-flex;align-items:center;flex:none;line-height:0}
.wp-block-site-logo.brand img{width:206px;height:auto}
.footer .wp-block-site-logo.brand img{width:205px}
@media(max-width:800px){.header .wp-block-site-logo.brand img{width:160px}}
@media(max-width:520px){.header .wp-block-site-logo.brand img{width:142px}}
.footer-brand p{font-size:.9rem;color:#b7d1d1;max-width:320px;margin:20px 0 0}

/* Foto del hero e iconos de la comparativa como fondos CSS (rutas relativas al tema). */
.photo-frame{background:#1b3a46 url(hogar-solar-editorial.jpg) center/cover no-repeat}
.compare-icon{width:46px;height:46px;flex:none;border:1px solid #ccdedd;background:#eaf3f2 var(--icon) center/32px no-repeat;clip-path:polygon(0 0,100% 0,100% 78%,78% 100%,0 100%)}
.compare-icon--solar{--icon:url(iconos/solar.svg)}
.compare-icon--conversation{--icon:url(iconos/conversacion.svg)}
.compare-icon--roof{--icon:url(iconos/plano.svg)}
.compare-icon--documents{--icon:url(iconos/documentos.svg)}

/* Formulario real (shortcode [objetivo_solar_formulario]). */
.os-honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.os-form label{display:block;font-size:.8rem;font-weight:700}
.os-field input{display:block;width:100%;margin-top:5px;border:1px solid #bccdcf;border-radius:3px;background:#f8fbfa;color:var(--ink);padding:11px 13px;font-size:.92rem}
.os-field input:focus{border-color:var(--orange);outline-offset:1px}
.os-form .os-consent{display:flex;align-items:flex-start;gap:9px;margin:14px 0 13px;font-size:.8rem;font-weight:500;line-height:1.5}
.os-consent input{margin:3px 0 0;accent-color:var(--orange)}
.os-form .os-submit{width:100%}
.os-form-footnote{margin:10px 0 0;font-size:.7rem;line-height:1.5}
.os-form-notice{padding:13px 15px;border-radius:4px;font-size:.9rem;margin-bottom:18px}
.os-form-notice--success{background:#e2f3ec;color:#17572c;border-left:3px solid #2e8b57}
.os-form-notice--error{background:#fff0e8;color:#873b16;border-left:3px solid var(--orange)}
/* Variante compacta en el hero, sobre fondo oscuro. */
.quick-contact .os-form{display:grid;grid-template-columns:1fr 1fr;column-gap:10px}
.quick-contact .os-field{margin-bottom:8px}
.quick-contact .os-field--town,.quick-contact .os-consent,.quick-contact .os-submit,.quick-contact .os-form-footnote{grid-column:1/-1}
.quick-contact .os-form label{color:#e5f2f2}
.quick-contact .os-field input{border-color:#607e82;background:#f5f9f8}
.quick-contact .os-consent a{color:var(--cyan)}
.quick-contact .os-submit{min-height:46px}
.quick-contact .os-form-footnote{color:#a7bfc2}
/* Variante principal en #contacto. */
.contact-form .os-form{display:block}
.contact-form .os-field{margin-bottom:14px}
.contact-form .os-form label:not(.os-consent){font-size:.83rem;margin:0}
.contact-form .os-field input{padding:12px 14px;font-size:1rem}
.contact-form .os-consent a{color:#a84f0a}
.contact-form .os-form-footnote{color:#63747b}
@media(max-width:520px){.quick-contact .os-form{display:block}}
