/* ============================================================
   BonyElectric — Home v2 · estilo godaylight (adaptado)
   Híbrido: hero oscuro → cuerpo cálido y claro.
   Scroll-driven al máximo. Acompaña a base.css.
   ============================================================ */

:root{
  --ink:#101216;
  --ink-72:rgba(16,18,22,.72);
  --ink-54:rgba(16,18,22,.54);
  --ink-line:rgba(16,18,22,.12);
  --ink-line-soft:rgba(16,18,22,.08);
  --cream:#EFE9DB;        /* panel cálido */
  --cream-deep:#E7DFCD;
  --sun:#FFC72C;
  --sun-soft:#FFE39A;
  --r-xl:28px;
  --r-2xl:40px;
}

/* ---- el cuerpo es cálido/claro; el hero pinta su propio oscuro ---- */
body.home2{background:var(--bone);color:var(--ink);}

/* tipografía display grande estilo godaylight */
.home2 h1,.home2 h2,.home2 h3{letter-spacing:-.035em;line-height:.98;}
.display{font-weight:800;text-wrap:balance;}
/* titular escalonado: cada línea con sangría creciente */
.step-h{display:block;}
.step-h .l{display:block;}
.step-h .l2{padding-left:0;}
.step-h .l3{padding-left:0;}

/* ---- reveal "blur-up" (más de moda) ---- */
.home2 .reveal{opacity:1;transform:none;filter:none;}
.home2.js .reveal{opacity:0;transform:translateY(26px);filter:blur(8px);
  transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1),filter .8s ease;}
.home2.js .reveal.in{opacity:1;transform:none;filter:none;}
@media (prefers-reduced-motion:reduce){
  .home2.js .reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none;}
}

/* reveals direccionales + cortina (cierran con .in de shared.js) */
.home2.js .reveal.from-left{transform:translateX(-42px);}
.home2.js .reveal.from-right{transform:translateX(42px);}
.home2.js .reveal.from-left.in,.home2.js .reveal.from-right.in{transform:none;}
.home2.js .reveal.reveal-clip{opacity:1;transform:none;filter:none;clip-path:inset(0 0 100% 0);transition:clip-path .95s cubic-bezier(.2,.7,.2,1);}
.home2.js .reveal.reveal-clip.in{clip-path:inset(0 0 0 0);}
@media (prefers-reduced-motion:reduce){
  .home2.js .reveal.from-left,.home2.js .reveal.from-right{transform:none!important;}
  .home2.js .reveal.reveal-clip{clip-path:none!important;transition:none;}
}

/* botones píldora */
.btn{border-radius:999px;}
.btn-dark{background:var(--ink);color:var(--bone);}
.btn-dark:hover{background:#23262d;transform:translateY(-2px);}
.btn-lg{padding:1.05em 1.7em;font-size:1.05rem;}

/* =================== HEADER =================== */
.hd{position:fixed;inset:0 0 auto 0;z-index:60;transition:background-color .35s,box-shadow .35s,color .35s;}
.hd__bar{display:flex;align-items:center;justify-content:space-between;height:78px;}
.hd .brand{display:flex;align-items:center;gap:.7rem;font-weight:800;font-size:1.12rem;letter-spacing:-.02em;color:var(--bone);transition:color .35s;}
.hd .brand__badge{width:42px;height:42px;border-radius:11px;background:#fff;display:flex;align-items:center;justify-content:center;padding:3px;flex:none;box-shadow:0 2px 10px rgba(0,0,0,.2);}
.hd .brand__badge img{width:100%;height:100%;object-fit:contain;display:block;}
.hd .brand b{color:var(--sun);}
.hd .nav{display:none;align-items:center;gap:.4rem;}
@media(min-width:900px){.hd .nav{display:flex;}}
.hd .nav a:not(.btn){padding:.5rem .95rem;border-radius:999px;font-size:.95rem;font-weight:500;color:rgba(244,242,236,.8);transition:color .25s,background-color .25s;}
.hd .nav a:not(.btn):hover{color:var(--bone);background:rgba(244,242,236,.1);}
/* estado claro al hacer scroll */
.hd.is-light{background:rgba(244,242,236,.86);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--ink-line-soft);}
.hd.is-light .brand{color:var(--ink);}
.hd.is-light .brand b{color:#C8920A;}
.hd.is-light .nav a:not(.btn){color:var(--ink-72);}
.hd.is-light .nav a:not(.btn):hover{color:var(--ink);background:rgba(16,18,22,.06);}
.hd.is-light .nav-toggle{color:var(--ink);}
.nav-toggle{color:var(--bone);}
.mnav{display:none;position:fixed;inset:78px 0 0;z-index:55;background:var(--ink);padding:2rem var(--pad);}
.mnav.is-open{display:block;}
@media(min-width:900px){.mnav,.mnav.is-open{display:none;}}
.mnav a{display:block;font-size:1.6rem;font-weight:700;color:var(--bone);padding:1rem 0;border-bottom:1px solid rgba(244,242,236,.1);}
.mnav .btn{width:100%;margin-top:1.5rem;}

/* =================== HERO (oscuro, video) =================== */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--carbon-900);color:var(--bone);}
.hero__bg{position:absolute;inset:0;}
.hero__bg img,.hero__bg video{width:100%;height:100%;object-fit:cover;object-position:50% 50%;}
.hero__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(14,15,18,.66) 0%,rgba(14,15,18,.12) 30%,rgba(14,15,18,.32) 60%,rgba(14,15,18,.96) 100%);}
.hero__inner{position:relative;z-index:2;width:100%;padding-bottom:clamp(3rem,7vw,6rem);padding-top:110px;}
.hero .eyebrow{color:rgba(244,242,236,.72);}
.hero h1{font-size:clamp(2.7rem,7vw,6.2rem);margin-top:1.2rem;}
.hero h1 .step-h .l2,.hero h1 .step-h .l3{padding-left:0;}
.hero__sub{margin-top:1.6rem;font-size:clamp(1.05rem,1.6vw,1.3rem);max-width:42ch;color:rgba(244,242,236,.86);}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.4rem;align-items:center;}
.hero__scroll{position:absolute;left:var(--pad);bottom:1.6rem;z-index:2;display:flex;align-items:center;gap:.6rem;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,242,236,.6);}
.hero__scroll .line{display:block;width:30px;height:1px;background:rgba(244,242,236,.4);overflow:hidden;position:relative;}
.hero__scroll .line::after{content:"";position:absolute;inset:0;background:var(--sun);transform:translateX(-100%);animation:scrollcue 2.2s ease-in-out infinite;}
@keyframes scrollcue{0%{transform:translateX(-100%);}50%{transform:translateX(0);}100%{transform:translateX(100%);}}
.hero__tag{position:absolute;right:var(--pad);bottom:1.6rem;z-index:2;display:none;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--bone);background:rgba(14,15,18,.5);backdrop-filter:blur(6px);border:1px solid rgba(244,242,236,.16);border-radius:999px;padding:.5em .9em;}
@media(min-width:760px){.hero__tag{display:inline-block;}}
.hero__tag b{color:var(--sun);font-weight:500;}
@media (prefers-reduced-motion:reduce){.hero__scroll .line::after{animation:none;}}

/* =================== MARQUEE (puente oscuro→claro) =================== */
.marquee{background:var(--carbon-900);color:var(--bone);overflow:hidden;padding:1.5rem 0;
  background:linear-gradient(180deg,var(--carbon-900) 0%,var(--carbon-900) 60%,var(--bone) 60%,var(--bone) 100%);}
.marquee__inner{display:flex;width:max-content;animation:marq 32s linear infinite;}
.marquee:hover .marquee__inner{animation-play-state:paused;}
.marquee__group{display:flex;align-items:center;gap:2.5rem;padding-right:2.5rem;}
.marquee__group span{font-weight:700;font-size:clamp(1.1rem,2vw,1.6rem);letter-spacing:-.02em;color:var(--bone);white-space:nowrap;}
.marquee__group .dot{width:7px;height:7px;border-radius:50%;background:var(--sun);flex:none;}
.marquee__group .mono{font-family:var(--ff-mono);font-weight:500;color:rgba(244,242,236,.7);}
@keyframes marq{to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.marquee__inner{animation:none;}}

/* =================== SECCIONES CLARAS =================== */
.section{padding:clamp(4rem,9vw,8rem) 0;position:relative;}
.kicker{display:inline-flex;align-items:center;gap:.6rem;font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#9A7B12;}
.kicker .dot{width:8px;height:8px;border-radius:50%;background:var(--sun);}
.section__head{max-width:24ch;}
.section__head h2{font-size:clamp(2.2rem,5vw,4rem);margin-top:1rem;}
.section__intro{margin-top:1.3rem;max-width:52ch;color:var(--ink-72);font-size:1.1rem;}
.linkb{display:inline-flex;align-items:center;gap:.5em;font-weight:700;color:var(--ink);border-bottom:2px solid var(--sun);padding-bottom:3px;transition:gap .2s;}
.linkb:hover{gap:.85em;}
.linkb svg{width:1em;height:1em;}

/* =================== STICKY STORYTELLING =================== */
.story{background:var(--bone);}
.story__grid{display:grid;gap:2rem;}
@media(min-width:960px){.story__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5rem;align-items:start;}}
.story__col{display:flex;flex-direction:column;}
.story__step{padding:clamp(1.5rem,4vh,3rem) 0;min-height:46vh;display:flex;flex-direction:column;justify-content:center;}
@media(min-width:960px){.story__step{min-height:72vh;}}
.story__num{font-family:var(--ff-mono);font-size:.8rem;color:#9A7B12;letter-spacing:.1em;}
.story__step h3{font-size:clamp(1.9rem,3.6vw,3rem);margin-top:1rem;}
.story__step p{margin-top:1.2rem;max-width:40ch;color:var(--ink-72);font-size:1.1rem;}
.story__step .linkb{margin-top:1.8rem;}
.story__step .inlineimg{margin-top:1.8rem;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;}
.story__step .inlineimg img{width:100%;height:100%;object-fit:cover;}
@media(min-width:960px){.story__step .inlineimg{display:none;}}
.story__media{display:none;}
@media(min-width:960px){
  .story__media{display:block;position:sticky;top:0;height:100vh;}
  .story__sticky{position:relative;width:100%;height:100%;}
  .story__sticky figure{position:absolute;inset:0;margin:0;padding:clamp(2rem,4vh,4rem) 0;display:flex;align-items:center;}
  .story__sticky .frame{position:relative;width:100%;height:100%;border-radius:var(--r-2xl);overflow:hidden;
    opacity:0;transform:scale(1.03);transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1);}
  .story__sticky figure.is-active .frame{opacity:1;transform:scale(1);}
  .story__sticky .frame img{width:100%;height:100%;object-fit:cover;}
  .story__cap{position:absolute;left:18px;bottom:18px;z-index:2;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--bone);background:rgba(14,15,18,.55);backdrop-filter:blur(6px);border-radius:999px;padding:.45em .9em;}
}
@media (prefers-reduced-motion:reduce){.story__sticky .frame{transition:none;}}

/* =================== BENTO =================== */
.bento{display:grid;gap:14px;grid-template-columns:repeat(2,1fr);}
@media(min-width:760px){.bento{grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;}}
.bento a{position:relative;overflow:hidden;border-radius:var(--r-xl);display:block;min-height:200px;isolation:isolate;background:var(--cream);}
.bento img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1);}
.bento a:hover img{transform:scale(1.06);}
@media (prefers-reduced-motion:reduce){.bento a:hover img{transform:none;}}
.bento .sc{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,15,18,0) 40%,rgba(14,15,18,.82) 100%);}
.bento .cap{position:absolute;left:0;bottom:0;padding:1.2rem;z-index:2;}
.bento .cap .c{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,242,236,.8);}
.bento .cap h4{color:var(--bone);font-size:1.05rem;margin-top:.35rem;letter-spacing:-.02em;}
.bento .cap .d{display:inline-block;margin-top:.5rem;font-family:var(--ff-mono);font-size:.72rem;color:var(--sun);}
@media(min-width:760px){
  .bento .b-tall{grid-row:span 2;}
  .bento .b-wide{grid-column:span 2;}
}

/* =================== CÓMO TRABAJAMOS (pasos) =================== */
.steps{background:var(--cream);border-radius:var(--r-2xl);padding:clamp(2rem,5vw,4rem);}
.steps__grid{display:grid;gap:2.5rem;margin-top:2.5rem;}
@media(min-width:820px){.steps__grid{grid-template-columns:repeat(3,1fr);}}
.stepc{position:relative;}
.stepc__n{font-size:clamp(3rem,6vw,5rem);font-weight:800;letter-spacing:-.04em;color:var(--ink);line-height:1;}
.stepc__n b{color:var(--sun);-webkit-text-stroke:1.5px var(--ink);}
.stepc h3{font-size:1.4rem;margin-top:1rem;}
.stepc p{margin-top:.9rem;color:var(--ink-72);}
.stepc__bar{height:3px;background:var(--ink-line);border-radius:3px;margin-top:1.6rem;overflow:hidden;}
.stepc__bar i{display:block;height:100%;width:0;background:var(--sun);transition:width 1s ease;}
.stepc.in .stepc__bar i{width:100%;}

/* =================== GALERÍA HORIZONTAL =================== */
.hscroll{position:relative;background:var(--bone);}
.hscroll__pin{position:relative;}
.hscroll__track{display:flex;gap:18px;will-change:transform;}
.hscroll__track figure{margin:0;position:relative;flex:0 0 auto;width:78vw;max-width:560px;border-radius:var(--r-xl);overflow:hidden;background:var(--cream);}
.hscroll__track figure img{width:100%;height:clamp(300px,52vh,560px);object-fit:cover;display:block;}
.hscroll__track figcaption{position:absolute;left:0;bottom:0;right:0;padding:1.4rem;background:linear-gradient(180deg,rgba(14,15,18,0),rgba(14,15,18,.82));color:var(--bone);}
.hscroll__track .c{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,242,236,.82);}
.hscroll__track h4{font-size:1.2rem;margin-top:.4rem;letter-spacing:-.02em;}
.hscroll__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:2rem;}
/* desktop: pin + traslación por JS */
@media(min-width:860px){
  .hscroll{height:260vh;}
  .hscroll__pin{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;}
  .hscroll__head{padding-inline:var(--pad);}
  .hscroll__track{padding-inline:var(--pad);}
}
/* móvil: scroll horizontal nativo con snap */
@media(max-width:859px){
  .hscroll{padding:clamp(4rem,9vw,6rem) 0;}
  .hscroll__head{padding-inline:var(--pad);}
  .hscroll__track{overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:var(--pad);-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .hscroll__track::-webkit-scrollbar{display:none;}
  .hscroll__track figure{scroll-snap-align:start;}
}

/* =================== STACKING CARDS (servicios) =================== */
.stack{position:relative;}
.stack .wrap{position:relative;}
.stack__head{margin-bottom:2.5rem;position:relative;z-index:1;}
.nb{white-space:nowrap;}

/* ====== figuras 3D (WebGL) reutilizables ====== */
.fx3d{position:absolute;z-index:0;pointer-events:none;}
.fx3d canvas{display:block;width:100%!important;height:100%!important;}
.fx3d--svc{top:-1rem;right:0;width:48%;height:540px;}
.fx3d--story{top:-2.5rem;right:0;width:38%;height:360px;}
.fx3d--shero{top:.5rem;right:0;width:32%;height:340px;}
.fx3d--nproc{top:-1rem;right:0;width:30%;height:300px;}
@media(max-width:1000px){
  .fx3d--svc{top:-.5rem;right:-4%;width:42%;height:280px;}
  .fx3d--story{top:-1rem;right:-3%;width:34%;height:220px;}
  .fx3d--shero{top:.5rem;right:-4%;width:32%;height:220px;}
  .fx3d--nproc{top:-.5rem;right:-4%;width:30%;height:200px;}
}
@media(max-width:767px){
  .fx3d--svc{top:0;right:-10%;width:60%;height:200px;}
  .fx3d--story{top:0;right:-8%;width:50%;height:160px;}
  /* hero/proceso son de una sola columna: figura chica en esquina y translúcida
     para que NUNCA compita con el texto */
  .fx3d--shero{top:auto;bottom:.25rem;right:-9%;width:46%;height:150px;opacity:.5;}
  .fx3d--nproc{top:-.5rem;right:-9%;width:44%;height:140px;opacity:.5;}
}
.stack__list{position:relative;}
.scard{position:sticky;top:calc(90px + var(--i,0) * 16px);margin-bottom:18px;border-radius:var(--r-2xl);
  padding:clamp(1.8rem,4vw,3.2rem);min-height:clamp(300px,38vh,380px);
  display:grid;gap:1.5rem;align-content:center;box-shadow:0 -10px 50px -22px rgba(16,18,22,.55);}
@media(min-width:820px){.scard{grid-template-columns:auto 1fr 1.1fr;align-items:center;gap:2.5rem;}}
.scard__n{font-family:var(--ff-mono);font-size:.85rem;opacity:.7;}
.scard h3{font-size:clamp(1.6rem,3vw,2.4rem);}
.scard__who{font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;opacity:.66;margin-bottom:.7rem;}
.scard p{font-size:1.05rem;line-height:1.55;}
.scard__media{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:16/10;}
.scard__media img{width:100%;height:100%;object-fit:cover;}
/* paleta alterna por tarjeta */
.scard--ink{background:var(--ink);color:var(--bone);}
.scard--ink .scard p{color:rgba(244,242,236,.78);}
.scard--cream{background:var(--cream);color:var(--ink);}
.scard--cream .scard p{color:var(--ink-72);}
.scard--sun{background:var(--sun);color:var(--ink);}
.scard--sun .scard p{color:rgba(16,18,22,.78);}
.scard--brass{background:#2A2410;color:var(--bone);}
.scard--brass .scard p{color:rgba(244,242,236,.78);}

/* =================== SECCIÓN OSCURA (caso/cta) =================== */
.dark{background:var(--carbon-900);color:var(--bone);}
.dark .kicker{color:var(--sun);}
.dark .section__intro{color:rgba(244,242,236,.72);}
.case2__grid{display:grid;gap:clamp(1.6rem,4vw,3rem);align-items:center;}
@media(min-width:960px){.case2__grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);}}
.case2__ba{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.case2__cell{position:relative;border-radius:var(--r-xl);overflow:hidden;border:1px solid rgba(244,242,236,.1);}
.case2__cell img{width:100%;aspect-ratio:3/4;object-fit:cover;}
.case2__tag{position:absolute;left:12px;top:12px;font-family:var(--ff-mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;background:rgba(14,15,18,.8);border-radius:999px;padding:.35em .8em;}
.case2__tag.aft{color:var(--sun);}
.case2 h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin-top:1rem;}
.case2__facts{margin-top:1.8rem;display:grid;gap:1.1rem;}
.case2__facts div{display:grid;grid-template-columns:1fr;gap:.35rem;}
.case2__facts dt{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);}
.case2__facts dd{margin:0;color:var(--bone);}
.case2__facts dd.mono{font-family:var(--ff-mono);}

/* prueba social */
.proof2{display:grid;gap:1px;background:rgba(244,242,236,.1);border-radius:var(--r-xl);overflow:hidden;grid-template-columns:repeat(2,1fr);}
@media(min-width:820px){.proof2{grid-template-columns:repeat(4,1fr);}}
.proof2 .cell{background:var(--carbon-900);padding:clamp(1.6rem,3vw,2.4rem);}
.proof2 .num{font-weight:800;letter-spacing:-.03em;font-size:clamp(2.2rem,4.4vw,3.2rem);line-height:1;}
.proof2 .num.sm{font-size:clamp(1.5rem,3vw,2rem);}
.proof2 .lbl{margin-top:.7rem;color:rgba(244,242,236,.72);font-size:.95rem;}

/* certificación cálida premium */
.cert2{background:#241F12;color:var(--bone);border-radius:var(--r-2xl);overflow:hidden;}
.cert2__grid{display:grid;gap:0;align-items:stretch;}
@media(min-width:920px){.cert2__grid{grid-template-columns:1fr 1fr;}}
.cert2__media{position:relative;min-height:320px;}
.cert2__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.cert2__seal{position:absolute;left:16px;top:16px;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#F4D58A;background:rgba(14,15,18,.7);border:1px solid rgba(230,167,0,.45);border-radius:999px;padding:.45em .9em;}
.cert2__body{padding:clamp(2rem,4vw,3.5rem);}
.cert2__body .kicker{color:#E6A700;}
.cert2 h2{font-size:clamp(1.8rem,3.2vw,2.6rem);margin-top:1rem;}
.cert2 h2 .brass{color:#E6A700;}
.cert2 p{margin-top:1.1rem;color:rgba(244,242,236,.78);max-width:42ch;}
.cert2 .linkb{margin-top:1.6rem;border-color:#E6A700;color:var(--bone);}

/* CTA final */
.final2{position:relative;overflow:hidden;background:var(--carbon-900);color:var(--bone);text-align:center;}
.final2__bg{position:absolute;inset:0;}
.final2__bg img{width:100%;height:100%;object-fit:cover;opacity:.32;}
.final2__bg::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 50% 120%,rgba(255,199,44,.18),transparent 60%),linear-gradient(180deg,rgba(14,15,18,.7),rgba(14,15,18,.92));}
.final2__inner{position:relative;z-index:2;max-width:36rem;margin-inline:auto;}
.final2 h2{font-size:clamp(1.7rem,3vw,2.4rem);}
.final2 p{margin-top:1.2rem;color:rgba(244,242,236,.78);}
.final2 .phone{font-family:var(--ff-mono);color:var(--sun);margin-top:1.4rem;font-size:1.05rem;}

/* footer */
.ft2{background:var(--ink);color:var(--bone);padding:clamp(3rem,6vw,4.5rem) 0 2rem;}
.ft2__grid{display:grid;gap:2.5rem;}
@media(min-width:780px){.ft2__grid{grid-template-columns:2fr 1fr 1fr;}}
.ft2__brand{display:flex;align-items:center;gap:.7rem;font-weight:800;font-size:1.1rem;}
.ft2__brand .brand__badge{width:46px;height:46px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;padding:3px;flex:none;}
.ft2__brand .brand__badge img{width:100%;height:100%;object-fit:contain;display:block;}
.ft2__brand b{color:var(--sun);}
.ft2 p{margin-top:1rem;color:rgba(244,242,236,.56);font-size:.95rem;max-width:36ch;}
.ft2 .k{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);}
.ft2 .list{margin-top:1rem;display:grid;gap:.6rem;color:rgba(244,242,236,.78);font-size:.95rem;}
.ft2 .list a:hover{color:var(--sun);}
.ft2 .list .mono{font-family:var(--ff-mono);}
.ft2__bottom{margin-top:3rem;padding-top:1.6rem;border-top:1px solid rgba(244,242,236,.1);display:flex;flex-wrap:wrap;gap:.6rem;justify-content:space-between;color:rgba(244,242,236,.4);font-size:.82rem;}

/* WhatsApp FAB ya viene de base.css */

/* ============================================================
   v3 — más vida: hero multimedia, efectos de fondo, fotos nuevas
   ============================================================ */

/* ---- barra de progreso de scroll ---- */
.scrollbar{position:fixed;top:0;left:0;right:0;height:3px;z-index:70;background:transparent;pointer-events:none;}
.scrollbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--sun),#E6A700);box-shadow:0 0 12px rgba(255,199,44,.5);}

/* ---- grano sutil global ---- */
.page-grain{position:fixed;inset:0;z-index:4;pointer-events:none;opacity:.04;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* ---- contenido siempre por encima de los efectos ---- */
.section > .wrap{position:relative;z-index:1;}

/* ---- auroras cálidas animadas en el fondo de secciones ---- */
.aura{position:absolute;inset:-12% 0;z-index:0;pointer-events:none;overflow:hidden;}
.aura span{position:absolute;width:48vw;height:48vw;max-width:720px;max-height:720px;border-radius:50%;filter:blur(90px);will-change:transform;}
.aura .a1{background:radial-gradient(circle,rgba(255,199,44,.42),transparent 64%);top:-14%;left:-8%;animation:auraA 19s ease-in-out infinite alternate;}
.aura .a2{background:radial-gradient(circle,rgba(230,167,0,.34),transparent 64%);bottom:-16%;right:-6%;animation:auraB 23s ease-in-out infinite alternate;}
.aura--dark .a1{background:radial-gradient(circle,rgba(255,199,44,.16),transparent 62%);}
.aura--dark .a2{background:radial-gradient(circle,rgba(230,167,0,.14),transparent 62%);}
@keyframes auraA{to{transform:translate(13%,9%) scale(1.18);}}
@keyframes auraB{to{transform:translate(-11%,-7%) scale(1.12);}}
@media (prefers-reduced-motion:reduce){.aura span{animation:none;}}

/* ---- HERO multimedia (video + fotos rotando) ---- */
.hero__bg .hslides{position:absolute;inset:0;}
.hero__bg .hslide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease;}
.hero__bg .hslide.is-active{opacity:1;}
.hero__bg .hslide img,.hero__bg .hslide video{width:100%;height:100%;object-fit:cover;object-position:50% 50%;}
.hero__bg .hslide--photo img{transform:scale(1.02);}
.hero__bg .hslide--photo.is-active img{animation:heroKB 6.5s ease-out forwards;}
@keyframes heroKB{from{transform:scale(1.02);}to{transform:scale(1.12);}}
@media (prefers-reduced-motion:reduce){.hero__bg .hslide{transition:none;}.hero__bg .hslide--photo.is-active img{animation:none;}}
.hero__dots{position:absolute;left:50%;transform:translateX(-50%);bottom:1.5rem;z-index:3;display:flex;gap:.55rem;}
.hero__dot{width:30px;height:5px;border-radius:3px;border:0;background:rgba(244,242,236,.35);padding:0;transition:background-color .25s;}
.hero__dot[aria-selected="true"]{background:var(--sun);}
.hero__dot:hover{background:rgba(244,242,236,.7);}

/* ---- imágenes de equipo en los pasos (confianza) ---- */
.stepc__img{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;margin-bottom:1.3rem;border:1px solid var(--ink-line-soft);}
.stepc__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1);}
.stepc:hover .stepc__img img{transform:scale(1.05);}
@media (prefers-reduced-motion:reduce){.stepc:hover .stepc__img img{transform:none;}}

/* ---- sección de cobertura local ---- */
.coverage__grid{display:grid;gap:clamp(1.6rem,4vw,3.5rem);align-items:center;}
@media(min-width:880px){.coverage__grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);}}
.coverage__media{position:relative;border-radius:var(--r-2xl);overflow:hidden;aspect-ratio:5/4;}
.coverage__media img{width:100%;height:100%;object-fit:cover;}
.coverage__badge{position:absolute;left:16px;top:16px;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--bone);background:rgba(14,15,18,.6);backdrop-filter:blur(6px);border-radius:999px;padding:.45em .9em;}
.coverage h2{font-size:clamp(2rem,4vw,3rem);margin-top:1rem;}
.coverage p{margin-top:1.1rem;color:var(--ink-72);max-width:46ch;font-size:1.08rem;}
.coverage__chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem;}
.coverage__chips span{font-weight:600;font-size:.92rem;border:1.5px solid var(--ink-line);border-radius:999px;padding:.45em 1em;}
.coverage__chips span.more{color:var(--ink-54);border-style:dashed;}
.coverage .linkb{margin-top:1.8rem;}

/* ---- anclas debajo del header fijo + scrollspy ---- */
section[id]{scroll-margin-top:92px;}
.hd .nav a.is-active:not(.btn){color:var(--bone);}
.hd .nav a.is-active:not(.btn)::after{width:100%;}
.hd.is-light .nav a.is-active:not(.btn){color:var(--ink);}

/* ---- hover con vida (solo con puntero, no en táctil) ---- */
@media (hover:hover){
  .bento a{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;}
  .bento a:hover{transform:translateY(-6px);box-shadow:0 20px 44px -22px rgba(16,18,22,.55);}
  .coverage__media img,.cert2__media img,.case2__cell img{transition:transform .6s cubic-bezier(.2,.7,.2,1);}
  .coverage__media:hover img,.cert2__media:hover img,.case2__cell:hover img{transform:scale(1.05);}
  .hscroll__track figure{transition:transform .4s ease,box-shadow .4s ease;}
  .hscroll__track figure:hover{transform:translateY(-6px);}
  .stepc__img{box-shadow:0 10px 30px -18px rgba(16,18,22,.5);}
}

/* ============================================================
   v4 — más micro-interacciones (laptop + celular), sobrias
   ============================================================ */

/* header que se compacta al hacer scroll */
.hd__bar{transition:height .3s ease;}
.hd .brand__badge{transition:width .3s ease,height .3s ease;}
.hd.is-compact .hd__bar{height:60px;}
.hd.is-compact .brand__badge{width:36px;height:36px;}
.hd.is-compact.is-light{box-shadow:0 8px 26px -18px rgba(0,0,0,.45);}

/* brillo que cruza los botones al hover (puntero) */
@media (hover:hover){
  .btn{position:relative;overflow:hidden;}
  .btn::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
    background:linear-gradient(110deg,transparent 36%,rgba(255,255,255,.28) 50%,transparent 64%);
    transform:translateX(-130%);transition:transform .65s ease;}
  .btn:hover::after{transform:translateX(130%);}
}

/* feedback al tocar (móvil) y al click */
.btn:active{transform:scale(.97);}
.totop:active{transform:scale(.92);}
.bento a:active,.hscroll__track figure:active,.coverage__media:active{transform:scale(.985);}

/* badge "abrir" que aparece sobre los tiles del bento (puntero) */
.bento a::before{content:"";position:absolute;top:14px;right:14px;z-index:3;width:34px;height:34px;border-radius:50%;
  background:var(--sun) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E0F12' stroke-width='2.4'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E") center/17px no-repeat;
  opacity:0;transform:scale(.5);transition:opacity .3s ease,transform .3s cubic-bezier(.2,.7,.2,1);pointer-events:none;}
@media (hover:hover){.bento a:hover::before{opacity:1;transform:scale(1);}}

/* pulso sutil en los puntos de los eyebrows */
.kicker .dot,.story__num::before{}
.kicker .dot{animation:dotpulse 2.6s ease-in-out infinite;}
@keyframes dotpulse{0%,100%{box-shadow:0 0 0 0 rgba(255,199,44,.5);}50%{box-shadow:0 0 0 6px rgba(255,199,44,0);}}

/* anillo que late en el botón flotante de WhatsApp */
.home2 .wa-fab::after{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid var(--sun);
  opacity:0;pointer-events:none;animation:fabring 3.2s ease-out infinite;}
@keyframes fabring{0%{transform:scale(1);opacity:.55;}70%{opacity:0;}100%{transform:scale(1.65);opacity:0;}}

/* botón "volver arriba" */
.totop{position:fixed;left:max(16px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));z-index:79;
  width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--ink);color:var(--bone);border:1px solid rgba(244,242,236,.18);
  opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .3s,transform .3s,background-color .2s;}
.totop.show{opacity:1;transform:none;pointer-events:auto;}
.totop:hover{background:#23262d;}
.totop svg{width:20px;height:20px;}

@media (prefers-reduced-motion:reduce){
  .kicker .dot,.home2 .wa-fab::after{animation:none;}
  .btn:active,.totop:active,.bento a:active,.hscroll__track figure:active{transform:none;}
}

/* ===== v5: cintilla deslizante + progreso de carrusel ===== */
/* cintilla de luz que recorre el borde inferior del header */
.hd{overflow:hidden;}
.hd::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:32%;border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--sun),transparent);opacity:0;transition:opacity .4s;
  transform:translateX(-120%);animation:hdslide 4.2s linear infinite;pointer-events:none;}
.hd.is-light::after{opacity:.75;}
@keyframes hdslide{from{transform:translateX(-120%);}to{transform:translateX(340%);}}

/* progreso que llena el punto activo del carrusel del hero */
.hero__dot{position:relative;overflow:hidden;}
.hero__dot[aria-selected="true"]{background:rgba(244,242,236,.3);}
.hero__dot::after{content:"";position:absolute;inset:0;background:var(--sun);transform:scaleX(var(--p,0));transform-origin:left;border-radius:inherit;transition:transform .12s linear;}
.hero__dot[aria-selected="true"]::after{transform:scaleX(var(--p,0));}
.hero[data-paused] .hero__dot[aria-selected="true"]::after{/* el reloj JS ya está en pausa */}
@keyframes dotfill{from{transform:scaleX(0);}to{transform:scaleX(1);}}

@media (prefers-reduced-motion:reduce){
  .hd::after{animation:none;display:none;}
  .hero__dot[aria-selected="true"]{background:var(--sun);}
  .hero__dot[aria-selected="true"]::after{transform:scaleX(1);}
}

/* ===== Chat n8n: tema con el color que llevaba el botón de WhatsApp (amarillo + carbón) ===== */
:root{
  --chat--color-primary:#FFC72C;
  --chat--color-primary-shade-50:#E6A700;
  --chat--color-primary-shade-100:#cc9500;
  --chat--color-secondary:#E6A700;
  --chat--color-secondary-shade-50:#cc9500;
  --chat--toggle--background:#FFC72C;
  --chat--toggle--hover--background:#E6A700;
  --chat--toggle--active--background:#E6A700;
  --chat--toggle--color:#0E0F12;
  --chat--header--background:#0E0F12;
  --chat--header--color:#F4F2EC;
  --chat--heading--color:#F4F2EC;
  --chat--subtitle--color:#C9C6BD;
  --chat--message--user--background:#FFC72C;
  --chat--message--user--color:#0E0F12;
  --chat--message--bot--background:#16181D;
  --chat--message--bot--color:#F4F2EC;
}