/* =====================================================================
   SOL&DEAS · Estilos por página (v4.0)
   Inicio · Tacto Madera · Corredizo · Bioclimática
   ===================================================================== */
.ratio-1610{aspect-ratio:16/10}

/* ================= INICIO ================= */
.hero--home h1{max-width:15.5ch;font-size:clamp(42px,5.7vw,94px)}
.hero--panels h1,.hero--louvers h1{max-width:13ch}

/* mosaico editorial (tres momentos) */
.mosaic__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px);align-items:start}
.mosaic__copy{grid-column:1/7;grid-row:1}
.mosaic__copy h2{font-size:clamp(34px,4.3vw,68px);max-width:15ch}
.mosaic__copy .lead{margin-top:26px;max-width:46ch}
.mosaic__a{grid-column:8/13;grid-row:1/3;will-change:transform}
.mosaic__b{grid-column:1/6;grid-row:2;margin-top:clamp(56px,7vw,112px);will-change:transform}
.mosaic__c{grid-column:6/8;grid-row:2;margin-top:clamp(150px,17vw,280px);will-change:transform}
.mosaic .slot{width:100%}
@media (max-width:900px){
  .mosaic__grid{grid-template-columns:1fr 1fr;row-gap:16px}
  .mosaic__copy{grid-column:1/-1;margin-bottom:24px}
  .mosaic__a{grid-column:1/-1;grid-row:auto}
  .mosaic__b{grid-column:1/2;grid-row:auto;margin-top:0}
  .mosaic__c{grid-column:2/3;grid-row:auto;margin-top:22%}
}

/* tres sistemas */
.sys{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(28px,5vw,96px);align-items:start}
.sys__list{border-top:1px solid var(--line)}
.sys__item{border-bottom:1px solid var(--line)}
.sys__btn{display:grid;grid-template-columns:44px 1fr 28px;gap:14px;align-items:center;width:100%;padding:26px 2px;border:0;background:none;cursor:pointer;text-align:left;color:var(--ink-3);transition:color .25s ease}
.sys__n{font:600 14px/1 var(--sans);letter-spacing:.06em;font-variant-numeric:tabular-nums}
.sys__name{font:700 clamp(22px,2.1vw,32px)/1.12 var(--display);letter-spacing:-.022em}
.sys__plus{width:22px;height:22px;transition:transform .45s var(--ease-out)}
.sys__item.is-open .sys__btn{color:var(--ink)}
.sys__item.is-open .sys__plus{transform:rotate(45deg)}
@media (hover:hover) and (pointer:fine){.sys__btn:hover{color:var(--ink)}}
.sys__panel{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .55s var(--ease-out),visibility 0s .55s}
.sys__panel>div{overflow:hidden;display:grid;gap:20px;padding-left:58px}
.sys__panel>div>:last-child{margin-bottom:30px}
.sys__item.is-open .sys__panel{grid-template-rows:1fr;visibility:visible;transition-delay:0s}
.sys__panel p{color:var(--ink-2);max-width:46ch}
.sys__dl{display:grid;gap:10px}
.sys__dl div{display:grid;grid-template-columns:110px 1fr;gap:12px;font-size:15.5px}
.sys__dl dt{color:var(--ink-3)}
.sys__dl dd{font-weight:600}
.sys__img{width:100%}
.sys__art{position:sticky;top:calc(var(--hdr) + 32px);aspect-ratio:1.12/1;background:var(--mist);border-radius:var(--r);overflow:hidden}
.sys__stage{position:absolute;inset:8px 8px 56px;transition:opacity .2s ease}
.sys__stage.is-swap{opacity:0}
.sys__cap{position:absolute;left:clamp(20px,3vw,40px);right:clamp(20px,3vw,40px);bottom:22px;font:500 15px/1.4 var(--sans);color:var(--ink-2)}
@media (max-width:900px){
  .sys{grid-template-columns:1fr}
  .sys__art{position:relative;top:0;order:-1;aspect-ratio:1.2/1}
  .sys__panel>div{padding-left:0}
}
.morelinks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,64px);margin-top:clamp(72px,8vw,120px);padding-top:40px;border-top:1px solid var(--line)}
.morelinks h3{font:600 13px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:18px}
.morelinks ul{display:grid;gap:4px}
.morelinks a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;text-decoration:none;font:600 18px/1.3 var(--display);letter-spacing:-.01em;color:var(--ink)}
.morelinks a .ic{width:18px;height:18px;opacity:.5;transition:transform .3s var(--ease-out),opacity .2s ease}
@media (hover:hover) and (pointer:fine){.morelinks a:hover .ic{opacity:1;transform:translate(2px,-2px)}}
@media (max-width:760px){.morelinks{grid-template-columns:1fr;gap:32px}}

/* por qué: tablero de cifras */
.why{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(220px,auto);gap:clamp(10px,1.1vw,16px)}
.why b{display:block;font:800 clamp(48px,5.4vw,86px)/.95 var(--display);letter-spacing:-.045em}
.why h3{margin-top:14px;font-size:clamp(19px,1.5vw,23px)}
.why p{margin-top:10px;color:var(--ink-2);font-size:15.5px;max-width:34ch}
.why__a{grid-column:span 7;grid-row:span 2;position:relative;border-radius:var(--r);overflow:hidden;min-height:440px;color:#fff}
.why__a .slot{position:absolute;inset:0;border-radius:0}
.why__over{position:absolute;z-index:3;left:clamp(22px,2.6vw,38px);bottom:clamp(22px,2.6vw,38px);display:grid;gap:8px}
.why__over::before{content:"";position:absolute;inset:-60% -40% -40% -30%;z-index:-1;background:radial-gradient(closest-side,rgba(14,14,13,.55),rgba(14,14,13,0))}
.why__over b{font-size:clamp(64px,7.6vw,128px)}
.why__over>span{font:500 17px/1.4 var(--sans);color:rgba(255,255,255,.88)}
.why__c{grid-column:span 5;padding:clamp(22px,2.4vw,36px);border-radius:var(--r);background:#fff;display:flex;flex-direction:column;justify-content:flex-end}
.why__c--ink{background:var(--night)}
.why__c--ink p{color:var(--on-dark)}
.why__d{grid-column:span 6}
.why__sw{display:flex;gap:6px;margin-top:18px}
.why__sw i{display:block;width:26px;height:26px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.why__e{grid-column:span 6;flex-direction:row;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap}
.why__e b{font-size:clamp(34px,3.4vw,54px)}
.why__e div>span{display:block;margin-top:8px;font-size:15px;color:var(--ink-3)}
@media (max-width:900px){
  .why{grid-template-columns:1fr 1fr}
  .why>*{grid-column:span 2!important}
  .why__a{grid-row:span 1;min-height:380px}
}

/* Origen */
.origen{position:relative;color:#fff;background:var(--night);overflow:clip;isolation:isolate;padding-block:var(--sec)}
.origen__bgs{position:absolute;inset:0;z-index:0}
.origen__bg{position:absolute;inset:0;border-radius:0;opacity:0;transition:opacity 0s .8s}
.origen__bg.is-on{opacity:1;z-index:1;transition:opacity .8s ease}
.origen__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(14,14,13,.78) 0%,rgba(14,14,13,.45) 48%,rgba(14,14,13,.2) 100%),linear-gradient(0deg,rgba(14,14,13,.5),rgba(14,14,13,0) 40%)}
.origen__in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(28px,5vw,80px);align-items:center;min-height:min(84svh,820px)}
.origen__copy .lead{margin-top:22px}
.origen__pick{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.origen__sw{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 16px 0 8px;border-radius:var(--r);border:1px solid rgba(255,255,255,.26);background:rgba(255,255,255,.06);color:#fff;font:600 14.5px/1 var(--sans);cursor:pointer;transition:border-color .2s ease,background-color .2s ease,transform 160ms var(--ease-out)}
.origen__sw i{width:30px;height:30px;border-radius:50%;background:var(--c);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.origen__sw[aria-checked="true"]{background:#fff;color:var(--ink);border-color:#fff}
.origen__sw:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.origen__sw:hover{border-color:#fff}}
.origen__now{margin-top:26px;display:grid;gap:4px}
.origen__now span{font:500 clamp(30px,3vw,44px)/1.05 var(--serif);font-style:italic}
.origen__now small{font:600 12.5px/1 var(--sans);letter-spacing:.14em;color:rgba(255,255,255,.7)}
.origen__now em{font-style:normal;color:rgba(255,255,255,.82);margin-top:8px}
.origen__copy .btns{margin-top:32px}
.origen__profs{position:relative;aspect-ratio:1/1;width:min(100%,560px);justify-self:end}
.origen__prof{position:absolute;inset:0;border-radius:var(--r);background:rgba(255,255,255,.06);opacity:0;transform:translate3d(0,14px,0) scale(.98);transition:opacity .6s ease,transform .8s var(--ease-out)}
.origen__prof .ph{background:radial-gradient(70% 60% at 50% 45%,rgba(255,255,255,.16),rgba(255,255,255,0) 70%)}
.origen__prof .ph::after{display:none}
.origen__prof .ph__ic{fill:rgba(255,255,255,.3)}
.origen__prof.is-on{opacity:1;transform:none}
.origen__prof:not(.is-on){transition:opacity .25s ease,transform 0s .25s}
.origen__prof>img{object-fit:contain}
.origen__amb{display:flex;align-items:center;gap:16px;margin:40px 0 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.16)}
.origen__amb .slot{width:68px;flex:none;background:rgba(255,255,255,.08)}
.origen__amb .slot__tag{display:none}
.origen__amb figcaption{font:500 14px/1.45 var(--sans);color:rgba(255,255,255,.7)}
.origen__amb figcaption b{display:block;font:700 17px/1.3 var(--display);color:#fff;letter-spacing:-.01em}
@media (max-width:980px){
  .origen__in{grid-template-columns:1fr;min-height:0}
  .origen__profs{justify-self:start;width:min(100%,420px)}
}

/* proceso */
.steps{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,96px);align-items:start}
.steps__media{position:sticky;top:calc(var(--hdr) + 32px)}
.steps__frame{position:relative;aspect-ratio:4/3.1;border-radius:var(--r);overflow:hidden;background:var(--night)}
.steps__m{position:absolute;inset:0;border-radius:0;opacity:0;transition:opacity 0s .8s}
.steps__m.is-on{opacity:1;z-index:1;transition:opacity .8s ease}
.steps__list{display:grid;gap:0;counter-reset:s}
.steps__it{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:clamp(34px,6vh,64px) 0;border-top:1px solid var(--line);color:var(--ink-3);transition:color .5s ease}
.steps__it p{color:var(--ink-3)!important;transition:color .5s ease}
.steps__it .steps__n{opacity:.7;transition:opacity .5s ease}
.steps__it.is-on{color:var(--ink)}
.steps__it.is-on p{color:var(--ink-2)!important}
.steps__it.is-on .steps__n{opacity:1}
.steps__n{font:800 clamp(28px,2.4vw,38px)/1 var(--display);letter-spacing:-.04em}
.steps__it h3{font-size:clamp(24px,2.2vw,34px)}
.steps__it p{margin-top:12px;color:var(--ink-2);max-width:40ch}
.steps__mm{display:none;margin-top:20px}
@media (max-width:900px){
  .steps{grid-template-columns:1fr}
  .steps__media{display:none}
  .steps__it{color:var(--ink);grid-template-columns:48px 1fr}
  .steps__it p{color:var(--ink-2)!important}
  .steps__it .steps__n{opacity:1}
  .steps__mm{display:block}
}

/* proyectos */
.pcard .slot{aspect-ratio:4/5}
.pcard--cta{background:var(--night);color:#fff;border-radius:var(--r);aspect-ratio:4/5;display:flex;align-items:flex-end;padding:clamp(24px,2.4vw,36px);text-decoration:none}
.pcard__cta{display:grid;gap:22px}
.pcard__cta .h3{font:700 clamp(26px,2.2vw,34px)/1.1 var(--display);letter-spacing:-.022em}

/* antes / después */
.ba{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--stone);touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize}
.ba>.slot,.ba__before .slot{position:absolute;inset:0;border-radius:0}
.ba__before{position:absolute;inset:0;z-index:2;clip-path:inset(0 50% 0 0)}
.ba__before .ph{background:linear-gradient(158deg,#d8d5cd,#bdb9ae)}
.ba__handle{position:absolute;z-index:4;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.08);will-change:transform}
.ba__handle span{position:absolute;top:50%;left:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 6px 24px rgba(0,0,0,.22)}
.ba__handle .ic{width:22px;height:22px}
.ba__lbl{position:absolute;z-index:5;top:16px;padding:7px 11px;border-radius:8px;background:rgba(14,14,13,.62);color:#fff;font:600 12.5px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase}
.ba__lbl--a{left:16px}.ba__lbl--b{right:16px}
.ba .slot__tag{top:auto;bottom:12px}
.ba__range{position:absolute;inset:0;z-index:6;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;pointer-events:none}
.ba:has(.ba__range:focus-visible){outline:2px solid var(--ink);outline-offset:4px}
.ba__foot{margin-top:16px;text-align:center;font-size:15px;color:var(--ink-3)}
@media (max-width:700px){.ba{aspect-ratio:4/3}}

/* Shop + Empresas */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.4vw,20px)}
.duo__card{display:grid;gap:20px;text-decoration:none;color:var(--ink)}
.duo__txt{display:grid;gap:10px;justify-items:start}
.duo__txt>span:not(.h3):not(.more){color:var(--ink-2);max-width:44ch}
.duo__card .h3,.other .h3{font:700 clamp(22px,1.9vw,28px)/1.15 var(--display);letter-spacing:-.018em}
@media (hover:hover) and (pointer:fine){.duo__card:hover .slot .ph,.duo__card:hover .slot>img{transform:scale(1.03)}}
.duo__card .slot .ph,.duo__card .slot>img{transition:transform 1s var(--ease-out)}
@media (max-width:760px){.duo{grid-template-columns:1fr}}

/* ================= PRODUCTOS (compartido) ================= */
/* datos rápidos */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2.4vw,40px)}
.fact{padding-left:20px;border-left:1px solid var(--line-2);display:grid;gap:8px}
.fact b{font:700 clamp(24px,2.3vw,36px)/1.05 var(--display);letter-spacing:-.028em}
.fact span{color:var(--ink-3);font-size:15.5px;line-height:1.45}
@media (max-width:860px){.facts{grid-template-columns:1fr 1fr;row-gap:28px}}

/* comparar con otros sistemas */
.others{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.4vw,20px)}
.other{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(18px,2vw,30px);align-items:center;padding:14px;border-radius:var(--r);background:#fff;text-decoration:none;color:var(--ink);transition:box-shadow .3s ease}
.other__txt{display:grid;gap:10px;justify-items:start;padding-right:10px}
.other__d{color:var(--ink-2);font-size:15.5px}
@media (hover:hover) and (pointer:fine){.other:hover{box-shadow:0 18px 50px rgba(29,29,27,.08)}}
@media (max-width:900px){.others{grid-template-columns:1fr}}
@media (max-width:520px){.other{grid-template-columns:1fr}}

.gcard .slot{aspect-ratio:4/5}
.cfg__note{font-size:14px;color:var(--ink-3);text-align:center}
.ticks{display:grid;gap:12px;margin-top:28px}
.ticks li{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;font-size:16.5px;color:var(--ink-2)}
.ticks .ic{width:21px;height:21px;margin-top:2px}

/* historia: título por encima de los pasos */
.story__title{font-size:clamp(32px,3.6vw,56px);line-height:1.04;letter-spacing:-.03em}
.story__lead{margin:18px 0 clamp(26px,4vh,44px);font-size:clamp(16px,1.15vw,18px)}
.story .story__step h3{font-size:clamp(24px,2.3vw,36px)}
@media (max-width:900px){.story__title{font-size:clamp(26px,7vw,36px)}.story__lead{display:none}}

/* ================= TACTO MADERA ================= */
.hero-split{position:relative;padding-top:calc(var(--hdr) + clamp(20px,4vh,48px));padding-bottom:clamp(32px,6vh,72px);min-height:100svh;display:flex;align-items:center}
.hero-split__grid{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:clamp(28px,5vw,96px);align-items:center}
.hero-split h1{max-width:13ch;font-size:clamp(40px,4.9vw,80px)}
.hero-split .lead{margin-top:26px;max-width:40ch}
.hero-split .btns{margin-top:36px}
.hero-split__media{position:relative;padding-bottom:12%}
.hero-split__main .slot{max-height:calc(100svh - var(--hdr) - 120px);width:100%;margin-left:auto}
.hero-split__detail{position:absolute;left:-12%;bottom:0;width:38%;border:8px solid #fff;border-radius:calc(var(--r) + 8px);box-shadow:0 30px 60px rgba(29,29,27,.14)}
.hero-split__detail .slot{border-radius:var(--r)}
.js .hero-split[data-intro] .hero-split__main{clip-path:inset(0 0 100% 0 round var(--r));transition:clip-path 1.5s var(--ease-io)}
.js .hero-split[data-intro].is-in .hero-split__main{clip-path:inset(0 0 0 0 round var(--r))}
.js .hero-split[data-intro] .hero-split__detail{opacity:0;transform:translate3d(0,40px,0);transition:opacity 1s var(--ease-out) .7s,transform 1.2s var(--ease-out) .7s}
.js .hero-split[data-intro].is-in .hero-split__detail{opacity:1;transform:none}
.hero-split .hero__fade{opacity:1}
@media (prefers-reduced-motion:reduce){.js .hero-split[data-intro] .hero-split__main{clip-path:none;transition:none}.js .hero-split[data-intro] .hero-split__detail,.js .hero-split[data-intro] .hero__fade{opacity:1;transform:none;transition:none}}
.js .hero-split[data-intro] .hero__fade{opacity:0;transform:translate3d(0,16px,0);transition:opacity 1s var(--ease-out),transform 1s var(--ease-out);transition-delay:calc(.45s + var(--i,0) * 90ms)}
.js .hero-split[data-intro].is-in .hero__fade{opacity:1;transform:none}
@media (max-width:900px){
  .hero-split{min-height:0;display:block}
  .hero-split__grid{grid-template-columns:1fr;gap:36px}
  .hero-split__media{padding-bottom:0;margin-right:calc(var(--gutter) * -1)}
  .hero-split__main .slot{max-height:none;aspect-ratio:4/4.6;border-radius:var(--r) 0 0 var(--r)}
  .hero-split__detail{left:-6%;bottom:-8%;width:36%;border-width:6px}
}

/* material vs madera */
.mat{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,96px);align-items:center}
.mat__media .slot{width:100%}
.mat__copy .lead{margin-top:22px}
.vs{margin-top:clamp(32px,4vw,52px);display:grid;gap:8px}
.vs__head,.vs__row{display:grid;grid-template-columns:110px 1fr 1fr;gap:12px;align-items:center}
.vs__head{font:600 12.5px/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:0 0 6px}
.vs__head span:first-child{grid-column:2}
.vs__row{padding:16px 0}
.vs__row+.vs__row{border-top:1px solid var(--line)}
.vs__k{font:600 14px/1.3 var(--sans);color:var(--ink-3)}
.vs__a,.vs__b{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:16px;line-height:1.45}
.vs__a{color:var(--ink-3)}
.vs__a .ic{width:18px;height:18px;margin-top:2px;opacity:.55}
.vs__b{font-weight:600}
.vs__b .ic{width:20px;height:20px;margin-top:1px}
@media (max-width:900px){.mat{grid-template-columns:1fr}.mat__media{max-width:440px}}
@media (max-width:560px){
  .vs__head{display:none}
  .vs__row{grid-template-columns:1fr;gap:8px}
}

/* ================= CORREDIZO ================= */
.hero__panels{position:absolute;inset:0;z-index:1;display:grid;grid-template-columns:repeat(6,1fr);pointer-events:none}
.hero__panels i{display:block;background:linear-gradient(180deg,#3a3936 0%,#2a2927 100%);box-shadow:inset 1px 0 0 rgba(255,255,255,.07),inset -1px 0 0 rgba(0,0,0,.35);transform:none;transition:transform 1.5s var(--ease-io);transition-delay:calc(var(--k) * 70ms + .1s)}
.hero--panels.is-in .hero__panels i{transform:translate3d(calc((6 - var(--k)) * 100% + 6px),0,0)}
.js .hero--panels .hero__panels{display:grid}
.hero__panels{display:none}
@media (prefers-reduced-motion:reduce){.hero__panels{display:none!important}}

.ops{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.4vw,20px)}
.op{position:relative;border-radius:var(--r);overflow:hidden;color:#fff;isolation:isolate}
.op .slot{border-radius:0}
.op::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(14,14,13,0) 45%,rgba(14,14,13,.78) 100%);pointer-events:none}
.op__txt{position:absolute;z-index:3;left:clamp(22px,2.6vw,38px);right:clamp(22px,2.6vw,38px);bottom:clamp(22px,2.6vw,38px);display:grid;gap:10px}
.op__k{display:inline-flex;align-items:center;gap:10px;font:600 13px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.op__k .ic{width:20px;height:20px}
.op h3{font-size:clamp(24px,2.3vw,34px);font-weight:700}
.op p{color:rgba(255,255,255,.82);max-width:42ch}
.op .slot__tag{z-index:4}
@media (max-width:760px){.ops{grid-template-columns:1fr}}

/* canaleta: corte técnico */
.gut{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,96px);align-items:center}
.gut__art{background:#fff;border-radius:var(--r);padding:clamp(18px,3vw,44px)}
.gut__svg{width:100%;height:auto;overflow:visible}
.gut__lam path{fill:#e7e5df;stroke:var(--ink);stroke-width:1.5;stroke-linejoin:round}
.gut__lam line{stroke:var(--ink);stroke-width:1.1;opacity:.5}
.gut__rain line{stroke:#7ea3b8;stroke-width:1.6;stroke-linecap:round;opacity:.7}
.gut__beam{fill:#fff;stroke:var(--ink);stroke-width:1.8;stroke-linejoin:round}
.gut__chan{fill:#e8f0f4;stroke:#3f7590;stroke-width:1.4;stroke-linejoin:round}
.gut__col{fill:#fff;stroke:var(--ink);stroke-width:1.8}
.gut__pipe{stroke:#9ab6c6;stroke-width:12;stroke-linecap:round;opacity:.35}
.gut__ground{stroke:var(--ink-3);stroke-width:1.2;stroke-dasharray:2 5}
.gut__water{fill:none;stroke:#3f7590;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:900;stroke-dashoffset:900}
.gut__art.is-in .gut__water{stroke-dashoffset:0;transition:stroke-dashoffset 2.8s var(--ease-io) .25s}
.gut__lbl line{stroke:var(--ink-3);stroke-width:1.1}
.gut__lbl text{font:700 15px var(--sans);fill:var(--ink)}
.gut__lbl .gut__sub{font:500 13.5px var(--sans);fill:var(--ink-3)}
.gut__photo{margin-top:32px;max-width:360px}
.gut__legend{display:none;margin-top:18px;gap:8px;counter-reset:g}
.gut__legend li{display:grid;grid-template-columns:26px 1fr;gap:10px;font-size:15px;color:var(--ink-2)}
.gut__legend li::before{counter-increment:g;content:counter(g);display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#3f7590;color:#fff;font:700 12px/1 var(--sans)}
@media (max-width:900px){.gut{grid-template-columns:1fr}}
@media (max-width:600px){.gut__lbl{display:none}.gut__legend{display:grid}}
@media (prefers-reduced-motion:reduce){.gut__water{stroke-dashoffset:0}}

/* ================= BIOCLIMÁTICA ================= */
.hero__louvers{position:absolute;inset:0;z-index:1;display:none;grid-template-rows:repeat(9,1fr);pointer-events:none}
.js .hero--louvers .hero__louvers{display:grid}
.hero__louvers i{display:block;background:#121211;transform-origin:50% 50%;transform:scaleY(1.02);transition:transform 1.3s var(--ease-io);transition-delay:calc(var(--k) * 60ms + .15s)}
.hero--louvers.is-in .hero__louvers i{transform:scaleY(0)}
@media (prefers-reduced-motion:reduce){.hero__louvers{display:none!important}}

.ctl{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(28px,5vw,96px);align-items:center}
.ctl__copy .lead{margin-top:22px}
.ctl__modes{display:grid;gap:0;margin-top:clamp(28px,4vw,48px);border-top:1px solid var(--line)}
.ctl__modes li{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start;padding:22px 0;border-bottom:1px solid var(--line)}
.ctl__modes .ic{width:30px;height:30px;margin-top:2px}
.ctl__modes h3{font-size:clamp(19px,1.5vw,22px)}
.ctl__modes p{margin-top:6px;color:var(--ink-2);font-size:16px}
.ctl__sensors{margin-top:28px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:18px 20px;border-radius:var(--r);background:var(--mist)}
.ctl__sensors span{display:flex;gap:6px}
.ctl__sensors .ic{width:26px;height:26px}
.ctl__sensors p{font-size:15.5px;color:var(--ink-2)}
@media (max-width:900px){.ctl{grid-template-columns:1fr}.ctl__media{max-width:440px}}