/* ============================================================================
   SOL&DEAS — "PLANO ABIERTO"  ·  Sistema de diseño (rediseño 2026, v2)
   Editorial arquitectónico / plano técnico. Yeso + Cian + chispa Cítrica,
   banda Noche en hero y footer. Fraunces + Inter + IBM Plex Mono.
   ========================================================================== */

:root{
  /* PALETA */
  --c-yeso:#F2F1EC; --c-cal:#FFFFFF; --c-mortero:#E6E5DE;
  --c-tinta:#1B1F22; --c-grafito:#6B7178; --c-cota:#C9C7BE;
  --c-cian:#1C5BD8; --c-cian-700:#1648A8; --c-citrico:#D8F24E;
  --c-noche:#0B1626; --c-noche-2:#122033;
  --c-onDark-hi:#F4F7FB; --c-onDark-lo:#8FA0B0; --c-hairDark:rgba(244,247,251,.10);

  /* LOGO (trazo blanco) como máscara recolorable */
  --logo-url:url("../assets/img/logo-sol-deas-white.png");

  /* TIPOGRAFÍA */
  --f-display:'Fraunces',Georgia,serif;
  --f-body:'Inter',system-ui,-apple-system,sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,monospace;

  --t-hero:clamp(2.6rem,1.4rem+5.6vw,6.6rem);
  --t-h2:clamp(2rem,1.3rem+3vw,3.9rem);
  --t-h3:clamp(1.3rem,1.05rem+1.1vw,1.95rem);
  --t-lead:clamp(1.05rem,.98rem+.4vw,1.32rem);
  --t-eyebrow:.75rem;

  /* SPACING */
  --s-2:.5rem;--s-3:.75rem;--s-4:1rem;--s-6:1.5rem;--s-8:2rem;--s-12:3rem;
  --s-16:4rem;--s-24:6rem;--s-32:8rem;
  --gutter:24px;
  --margin-x:clamp(1.25rem,7vw,9vw);
  --maxw:1320px;

  --r-surface:2px;
  --hair:1px solid var(--c-cota);
  --hair-dark:1px solid var(--c-hairDark);
  --shadow-float:0 24px 60px -40px rgba(27,31,34,.30);
  --glow-citrico:0 0 28px rgba(216,242,78,.22);

  --e-reveal:cubic-bezier(.2,.8,.2,1);
  --e-expo:cubic-bezier(.16,1,.3,1);
  --e-out:cubic-bezier(.22,1,.36,1);
  --d-fast:.25s;--d-mid:.5s;--d-slow:.8s;

  --sun-x:0%;
}

/* RESET */
*,*::before,*::after{box-sizing:border-box}*{margin:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--f-body);font-size:1rem;line-height:1.62;
  color:var(--c-tinta);background:var(--c-yeso);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:clip;
}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
ul{list-style:none;padding:0}
:focus-visible{outline:2px solid var(--c-cian);outline-offset:3px;border-radius:2px}
::selection{background:var(--c-citrico);color:var(--c-tinta)}

/* TIPOGRAFÍA */
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;line-height:1.05;letter-spacing:-.02em;text-wrap:balance}
.display{font-size:var(--t-hero);font-weight:300;line-height:1}
.h2{font-size:var(--t-h2)}.h3{font-size:var(--t-h3);font-weight:500}
.serif-i{font-family:var(--f-display);font-style:italic;font-weight:400}
.lead{font-size:var(--t-lead);color:var(--c-grafito);line-height:1.5}
.eyebrow{
  font-family:var(--f-mono);font-size:var(--t-eyebrow);font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--c-grafito);
  display:inline-flex;align-items:center;gap:.7em;
}
.eyebrow .n{color:var(--c-cian)}
.tnum{font-variant-numeric:tabular-nums}

/* LAYOUT */
.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--margin-x)}
.section{position:relative;padding-block:clamp(4rem,9vw,8rem)}
.section--mortero{background:var(--c-mortero)}
.section-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--s-8);margin-bottom:var(--s-16)}
.section-head .t{max-width:32ch}
.measure{max-width:62ch}
.stack>*+*{margin-top:var(--s-6)}
.rule{height:1px;background:var(--c-cota);transform:scaleX(0);transform-origin:left;transition:transform .9s var(--e-reveal)}
.rule.is-in{transform:scaleX(1)}

/* BOTONES (ortogonales) */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  padding:.95em 1.6em;font-family:var(--f-mono);font-weight:500;font-size:.8rem;
  letter-spacing:.08em;text-transform:uppercase;border-radius:999px;
  background:var(--c-cian);color:#fff;position:relative;overflow:hidden;
  transition:background var(--d-fast) var(--e-out),transform var(--d-fast) var(--e-out),color var(--d-fast);
  will-change:transform;
}
.btn:hover{background:var(--c-cian-700)}
.btn .ico{width:1.05em;height:1.05em;transition:transform var(--d-mid) var(--e-out)}
.btn:hover .ico{transform:translateX(3px)}
.btn--citrico{background:var(--c-citrico);color:var(--c-tinta)}
.btn--citrico:hover{background:#c8e63a}
.btn--outline{background:transparent;color:var(--c-tinta);box-shadow:inset 0 0 0 1.5px var(--c-cota)}
.btn--outline:hover{box-shadow:inset 0 0 0 1.5px var(--c-cian);color:var(--c-cian);background:transparent}
.btn--on-dark{background:transparent;color:var(--c-onDark-hi);box-shadow:inset 0 0 0 1.5px var(--c-hairDark)}
.btn--on-dark:hover{box-shadow:inset 0 0 0 1.5px var(--c-citrico);color:var(--c-citrico);background:transparent}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s-4)}
.link-u{position:relative;font-family:var(--f-mono);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-cian)}
.link-u::after{content:"";position:absolute;left:0;bottom:-3px;width:100%;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform var(--d-mid) var(--e-out)}
.link-u:hover::after{transform:scaleX(1);transform-origin:left}

/* NAV */
.site-header{position:fixed;inset:0 0 auto 0;z-index:60;transition:background var(--d-mid) var(--e-out),box-shadow var(--d-mid)}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:var(--s-6);padding-block:clamp(.8rem,1.6vw,1.25rem)}
.site-header.is-stuck{background:color-mix(in srgb,var(--c-yeso) 88%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--c-cota)}
.brand{display:inline-flex;flex-direction:column;gap:5px}
.brand .logo{height:18px;width:160px;background-color:var(--c-tinta);-webkit-mask:var(--logo-url) left/contain no-repeat;mask:var(--logo-url) left/contain no-repeat;transition:background-color var(--d-mid)}
.brand .tick{height:2px;width:34px;background:var(--c-cian)}
.nav{display:flex;align-items:center;gap:clamp(1rem,2vw,2rem)}
.nav a{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--c-grafito);transition:color var(--d-fast)}
.nav a:hover{color:var(--c-tinta)}
.header-actions{display:flex;align-items:center;gap:var(--s-4)}
/* nav invertido sobre hero oscuro */
.is-hero-dark .site-header:not(.is-stuck) .brand .logo{background-color:var(--c-onDark-hi)}
.is-hero-dark .site-header:not(.is-stuck) .nav a{color:var(--c-onDark-lo)}
.is-hero-dark .site-header:not(.is-stuck) .nav a:hover{color:var(--c-onDark-hi)}
.nav-toggle{display:none;width:42px;height:42px;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px var(--c-cota)}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;width:18px;height:2px;background:currentColor}
.nav-toggle span{position:relative}.nav-toggle span::before{top:-6px}.nav-toggle span::after{top:6px}

/* ============================================================ HERO SLIDER */
.hero{position:relative;min-height:100svh;background:var(--c-noche);color:var(--c-onDark-hi);overflow:hidden;display:flex;align-items:stretch}
.hero__grid{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:1.05fr 1fr;align-items:center}
.hero__text{padding:8rem var(--margin-x) 6rem;max-width:none}
.hero__media{position:relative;overflow:hidden;border-left:var(--hair-dark);align-self:stretch;min-height:100svh}
.hero__slide-media{position:absolute;inset:0;opacity:0;clip-path:inset(0 0 100% 0);will-change:clip-path,opacity}
.hero__slide-media img{width:100%;height:100%;object-fit:cover}
.hero__slide-media.is-active{opacity:1;clip-path:inset(0 0 0% 0)}
.hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,22,38,.15),rgba(11,22,38,.55));pointer-events:none}
.hero__plan{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5}
.hero .eyebrow{color:var(--c-onDark-lo)}
.hero .eyebrow .n{color:var(--c-citrico)}
.hero h1{font-size:var(--t-hero);font-weight:300;line-height:1.0;margin:1.2rem 0 0;min-height:2.2em}
.hero h1 .hl{color:var(--c-citrico);font-style:italic}
.hero__sub{margin-top:1.6rem;max-width:42ch;color:var(--c-onDark-lo);font-size:var(--t-lead)}
.hero__cta{margin-top:2.2rem}
.hero__slides-text{display:grid}
.hero__st{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .45s var(--e-out)}
.hero__st.is-active{opacity:1;visibility:visible}
/* line-clip texto del slider */
.lineclip{display:block;overflow:hidden}
.lineclip>span{display:block;transform:translateY(110%);transition:transform .7s var(--e-expo)}
.is-active .lineclip>span{transform:translateY(0)}
/* indicadores cota */
.hero__dots{position:absolute;left:var(--margin-x);bottom:2rem;z-index:3;display:flex;gap:14px}
.hero__dot{width:auto;min-width:96px;height:auto;display:flex;flex-direction:column;gap:6px;text-align:left}
.hero__dot .bar{height:2px;background:var(--c-hairDark);position:relative;overflow:hidden}
.hero__dot .bar i{position:absolute;inset:0;width:0;background:var(--c-citrico)}
.hero__dot .lbl{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.08em;color:var(--c-onDark-lo);white-space:nowrap}
.hero__dot.is-active .lbl{color:var(--c-onDark-hi)}
.hero__scroll{position:absolute;right:var(--margin-x);bottom:2rem;z-index:3;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--c-onDark-lo);writing-mode:vertical-rl}

/* MANIFIESTO */
.manifesto{background:var(--c-yeso)}
.manifesto .t{font-family:var(--f-display);font-weight:300;font-size:var(--t-h2);line-height:1.18;max-width:20ch}
.manifesto p{margin-top:var(--s-6);max-width:54ch;color:var(--c-grafito)}
.manifesto .serif-i{color:var(--c-cian)}

/* ===================================================== PÉRGOLA (line-art) */
.pergola{background:var(--c-yeso);color:var(--c-tinta);position:relative}
.pergola__pin{height:100svh;min-height:640px;position:relative;display:grid;place-items:center;overflow:hidden}
.pergola__head{position:absolute;top:clamp(5rem,10vh,7rem);left:var(--margin-x);right:var(--margin-x);z-index:5;display:flex;justify-content:space-between;gap:1rem;pointer-events:none}
.pergola__head h2{font-size:var(--t-h3);font-weight:400}
.pergola__stagewrap{position:relative;z-index:2;width:min(92vw,1080px);aspect-ratio:16/10}
.pergola__svg{width:100%;height:100%;overflow:visible}
.pergola .col,.pergola .colface{transform-box:fill-box;transform-origin:bottom center;will-change:transform,opacity}
.pergola .beam,.pergola .joist,.pergola .lama{transform-box:fill-box;will-change:transform,opacity}
.pergola .furn{will-change:transform,opacity}
.pergola .led{will-change:opacity}
.pergola__shadows{will-change:transform,opacity;transform-box:fill-box;transform-origin:50% 0%}
.pergola__sun{position:absolute;width:min(26vw,260px);aspect-ratio:1;border-radius:50%;z-index:1;pointer-events:none;
  background:radial-gradient(circle,rgba(216,242,78,.85) 0%,rgba(216,242,78,.35) 36%,rgba(216,242,78,0) 70%);
  filter:blur(2px);will-change:left,top,opacity;left:10%;top:14%;transform:translate(-50%,-50%)}
.pergola__caption{position:absolute;left:var(--margin-x);bottom:clamp(2rem,6vh,3.5rem);z-index:5}
.pergola__caption .step-no{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.2em;color:var(--c-cian)}
.pergola__caption .cap{position:relative;height:1.6em;margin-top:.4rem;width:min(80vw,420px)}
.pergola__caption .cap span{position:absolute;left:0;font-family:var(--f-display);font-style:italic;font-size:var(--t-h3);opacity:0;transform:translateY(12px)}
.pergola__progress{position:absolute;right:var(--margin-x);bottom:clamp(2rem,6vh,3.5rem);z-index:5;width:min(40vw,260px);height:2px;background:var(--c-cota)}
.pergola__progress i{position:absolute;inset:0;width:0;background:var(--c-cian)}
.pergola__intro{position:absolute;inset:0;z-index:6;display:grid;place-items:center;text-align:center;pointer-events:none}
.pergola__intro h2{font-size:var(--t-h2);font-weight:300}

/* ===================================================== PRODUCTOS (bento) */
.products{background:var(--c-yeso)}
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(190px,auto);gap:var(--gutter)}
.card{position:relative;background:var(--c-cal);border:var(--hair);border-radius:var(--r-surface);padding:var(--s-6);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transition:border-color var(--d-mid),transform var(--d-mid) var(--e-out)}
.card:hover{border-color:var(--c-cian);transform:translateY(-3px)}
.card .eyebrow{margin-bottom:auto}
.card h3{font-size:var(--t-h3);font-weight:500;margin-top:1.2rem}
.card p{color:var(--c-grafito);font-size:.92rem;margin-top:.4rem;max-width:34ch}
.card .cota{position:absolute;top:var(--s-6);right:var(--s-6);font-family:var(--f-mono);font-size:.66rem;color:var(--c-cian);opacity:0;transition:opacity var(--d-mid)}
.card:hover .cota{opacity:1}
.card--media{color:var(--c-onDark-hi);border:none;min-height:clamp(320px,40vw,440px)}
.card--media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.card--media::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,22,38,.05) 40%,rgba(11,22,38,.8))}
.card--media .eyebrow{color:var(--c-citrico)}.card--media p{color:var(--c-onDark-lo)}
.card--xl{grid-column:span 2;grid-row:span 2}
.card--wide{grid-column:span 2}
.card--tall{grid-row:span 2}
.card--1{grid-column:span 1}

/* ============================================ POR QUÉ ELEGIR (SVG láminas) */
.why{background:var(--c-mortero)}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gutter)}
.lamina{background:var(--c-cal);border:var(--hair);border-radius:var(--r-surface);padding:var(--s-8);transition:border-color var(--d-mid)}
.lamina:hover{border-color:var(--c-cian)}
.lamina .draw{width:100%;height:120px;margin-bottom:var(--s-6)}
.lamina .draw [data-draw]{stroke:var(--c-cian);stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
.lamina .draw .fill-cit{fill:var(--c-citrico);stroke:none}
.lamina h3{font-size:1.12rem;font-weight:600;font-family:var(--f-body);letter-spacing:-.01em}
.lamina p{color:var(--c-grafito);font-size:.92rem;margin-top:.4rem}

/* CARACTERÍSTICAS (cotas) */
.specs{background:var(--c-yeso)}
.specs-row{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:var(--hair);border-bottom:var(--hair)}
.spec{padding:var(--s-8) var(--s-6);border-left:var(--hair)}
.spec:first-child{border-left:none}
.spec .n{font-family:var(--f-mono);font-size:.72rem;color:var(--c-cian);letter-spacing:.1em}
.spec h3{font-size:1.05rem;font-weight:600;font-family:var(--f-body);margin-top:1.2rem}
.spec p{color:var(--c-grafito);font-size:.86rem;margin-top:.4rem}

/* STATS (cotas de plano) */
.stats{background:var(--c-yeso)}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-8)}
.stat{position:relative;padding-top:var(--s-6)}
.stat .num{font-family:var(--f-display);font-weight:300;font-size:clamp(3rem,2rem+5vw,6rem);line-height:1;font-variant-numeric:tabular-nums}
.stat .num .u{color:var(--c-cian);font-size:.5em;vertical-align:super;margin-left:.1em}
.stat .lbl{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c-grafito);margin-top:1rem;display:block}
.stat .cota-line{height:2px;background:var(--c-cota);margin-top:var(--s-6);position:relative;overflow:hidden}
.stat .cota-line i{position:absolute;inset:0;width:0;background:var(--c-cian)}
.stat .cota-line::after{content:"";position:absolute;right:0;top:-3px;width:2px;height:8px;background:var(--c-citrico)}

/* PROYECTOS (galería) */
.gallery{background:var(--c-mortero)}
.proy-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gutter)}
.proy{position:relative;overflow:hidden;background:var(--c-noche)}
.proy img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--e-out)}
.proy:hover img{transform:scale(1.05)}
.proy figcaption{position:absolute;left:0;right:0;bottom:0;padding:1rem;display:flex;justify-content:space-between;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.08em;color:var(--c-onDark-hi);text-transform:uppercase;background:linear-gradient(transparent,rgba(11,22,38,.7));opacity:0;transform:translateY(8px);transition:.4s var(--e-out)}
.proy:hover figcaption{opacity:1;transform:none}
.proy figcaption .d{color:var(--c-citrico)}
.proy--a{grid-column:span 5;aspect-ratio:4/5}
.proy--b{grid-column:span 7;aspect-ratio:16/10}
.proy--c{grid-column:span 4;aspect-ratio:1}
.proy--d{grid-column:span 4;aspect-ratio:1}
.proy--e{grid-column:span 4;aspect-ratio:1}

/* FAQ (acordeón) */
.faq{background:var(--c-yeso)}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gutter) var(--s-16)}
.qa{border-top:var(--hair)}
.qa summary,.qa .q{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.4rem 0;cursor:pointer;list-style:none;font-family:var(--f-display);font-size:1.12rem;font-weight:500}
.qa summary::-webkit-details-marker{display:none}
.qa .ico{flex:none;width:22px;height:22px;position:relative;color:var(--c-cian);transition:transform var(--d-mid) var(--e-out)}
.qa .ico::before,.qa .ico::after{content:"";position:absolute;background:currentColor;border-radius:2px}
.qa .ico::before{top:10px;left:2px;width:18px;height:2px}
.qa .ico::after{top:2px;left:10px;width:2px;height:18px;transition:transform var(--d-mid) var(--e-out)}
.qa[open] .ico::after,.qa.is-open .ico::after{transform:scaleY(0)}
.qa .a{overflow:hidden;color:var(--c-grafito);max-width:54ch;transition:height .4s var(--e-out)}
.qa .a-inner{padding-bottom:1.4rem}

/* CALENDLY */
.agenda{background:var(--c-yeso)}
.agenda-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--s-16);align-items:start}
.stepper{margin-top:var(--s-8);display:flex;flex-direction:column;gap:.2rem}
.stepper li{font-family:var(--f-mono);font-size:.8rem;color:var(--c-grafito);padding:.55rem 0;border-top:var(--hair);display:flex;gap:1rem}
.stepper li .n{color:var(--c-cian)}
.cal-panel{background:var(--c-cal);border:var(--hair);box-shadow:var(--shadow-float);border-radius:var(--r-surface);overflow:hidden}
.calendly-inline-widget{min-width:320px;height:680px}

/* CTA + FOOTER (banda noche, cartucho) */
.closing{background:var(--c-noche);color:var(--c-onDark-hi);position:relative;overflow:hidden}
.closing__edge{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--c-citrico),transparent);background-size:40% 100%;background-repeat:no-repeat;background-position:var(--sun-x) 0}
.cta-final{text-align:center;padding-block:clamp(4rem,9vw,7rem)}
.cta-final h2{font-size:var(--t-hero);font-weight:300;line-height:1.02}
.cta-final h2 .hl{color:var(--c-citrico);font-style:italic}
.cta-final p{margin-top:1.2rem;color:var(--c-onDark-lo);font-size:var(--t-lead)}
.cta-final .btn-row{justify-content:center;margin-top:2rem}
.cartucho{border-top:var(--hair-dark);padding-block:var(--s-16) var(--s-8)}
.cartucho-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:var(--s-8)}
.cartucho .logo{height:20px;width:180px;background-color:var(--c-onDark-hi);-webkit-mask:var(--logo-url) left/contain no-repeat;mask:var(--logo-url) left/contain no-repeat;margin-bottom:1rem}
.cartucho p,.cartucho a,.cartucho li{color:var(--c-onDark-lo);font-size:.84rem}
.cartucho a:hover{color:var(--c-citrico)}
.cartucho h4{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c-onDark-hi);margin-bottom:1rem}
.cartucho li+li{margin-top:.55rem}
.cartucho .ficha{display:flex;gap:var(--s-8);font-family:var(--f-mono);font-size:.72rem;color:var(--c-onDark-lo)}
.cartucho .ficha b{color:var(--c-citrico);font-weight:500}
.foot-bottom{margin-top:var(--s-16);padding-top:1.2rem;border-top:var(--hair-dark);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-family:var(--f-mono);font-size:.7rem;color:var(--c-onDark-lo);letter-spacing:.06em}
.socials{display:flex;gap:.6rem;margin-top:1rem}
.socials a{width:36px;height:36px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--c-hairDark);color:var(--c-onDark-hi)}
.socials a:hover{background:var(--c-citrico);color:var(--c-noche)}

/* WHATSAPP FLOTANTE */
.wa-float{position:fixed;right:1.2rem;bottom:1.2rem;z-index:70;width:54px;height:54px;border-radius:50%;background:var(--c-citrico);color:var(--c-noche);display:grid;place-items:center;box-shadow:var(--glow-citrico);transition:transform var(--d-mid) var(--e-out)}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:28px;height:28px}

/* REVEALS */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .8s var(--e-reveal),transform .8s var(--e-reveal)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal-stagger]>*{opacity:0;transform:translateY(20px);transition:opacity .7s var(--e-reveal),transform .7s var(--e-reveal)}
[data-reveal-stagger].is-in>*{opacity:1;transform:none}

/* RESPONSIVE */
@media (max-width:1024px){
  .hero__grid{grid-template-columns:1fr}
  .hero__media{display:none}
  .bento{grid-template-columns:repeat(2,1fr)}
  .card--xl,.card--wide{grid-column:span 2}
  .why-grid{grid-template-columns:1fr 1fr}
  .specs-row{grid-template-columns:1fr 1fr;border:none}
  .spec{border-left:none;border-top:var(--hair)}
  .agenda-grid{grid-template-columns:1fr}
  .cartucho-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:680px){
  .nav,.header-actions .btn{display:none}
  .nav-toggle{display:inline-flex}
  .bento,.why-grid,.faq-grid,.stats-grid{grid-template-columns:1fr}
  .specs-row{grid-template-columns:1fr}
  .proy--a,.proy--b,.proy--c,.proy--d,.proy--e{grid-column:span 12}
  .cartucho-grid{grid-template-columns:1fr}
  .hero__scroll{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  [data-reveal],[data-reveal-stagger]>*{opacity:1;transform:none}
  .lineclip>span{transform:none}
}
