/* ============================================================
   MECF CONSULTORA — v4 · modo oscuro
   El fondo NO es negro ni azul marino: es el gris del logo
   (#4E5D6C) llevado a sus valores oscuros. Oscuro cálido.
   Motivo: el ARCO. Titulares sans geométrica, cuerpo serif.
   ============================================================ */
:root{
  --bg:#171E27;
  --bg-2:#1D2530;
  --surface:#232D3A;
  --surface-2:#2A3543;
  --hair:#33404F;
  --hair-2:#293441;

  --text:#EEF2F6;
  --slate-60:#9AA9BA;
  --slate-40:#71818F;

  --orange:#F09C00;
  --orange-l:#FFB629;
  --orange-10:rgba(240,156,0,.11);
  --orange-20:rgba(240,156,0,.28);

  --measure:1180px;
  --gut:clamp(1.25rem,4vw,2.5rem);
  --disp:'Plus Jakarta Sans',system-ui,sans-serif;
  --body:'Source Serif 4',Georgia,serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --r:20px;
  --r-lg:32px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth;scroll-padding-top:92px;-webkit-text-size-adjust:100%}

body{
  font-family:var(--body);
  background:var(--bg);
  color:var(--slate-60);
  line-height:1.68;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
body.nav-open{overflow:hidden}

img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--orange);color:#1A222C}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:4px}

.skip{position:absolute;top:-100px;left:1rem;z-index:300;background:var(--surface);
  border:1px solid var(--hair);border-radius:10px;padding:.7rem 1rem;
  font-family:var(--disp);font-size:.85rem;font-weight:600;color:var(--text);
  transition:top .18s ease}
.skip:focus{top:1rem}

.wrap{width:100%;max-width:var(--measure);margin-inline:auto;padding-inline:var(--gut)}

/* ---------- tipografía ---------- */
h1,h2,h3,h4{font-family:var(--disp);color:var(--text);font-weight:800;
  line-height:1.12;letter-spacing:-.028em}
h1{font-size:clamp(2.15rem,5vw,3.85rem);line-height:1.07;letter-spacing:-.035em}
h2{font-size:clamp(1.7rem,3.3vw,2.6rem);letter-spacing:-.03em}
h3{font-size:1.16rem;font-weight:700;letter-spacing:-.018em;line-height:1.3}

p{font-size:1.06rem;line-height:1.72;color:var(--slate-60)}
p strong{color:var(--text);font-weight:600}
.lead{font-size:clamp(1.1rem,1.4vw,1.24rem);line-height:1.68;color:#B8C5D2}
.hl{color:var(--orange)}

/* eyebrow: cita del logo — naranja · slate · naranja */
.eyebrow{display:flex;align-items:center;gap:.7rem;font-family:var(--disp);
  font-size:.76rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--slate-40);margin-bottom:1.3rem}
.eyebrow .dots{display:inline-flex;gap:4px;align-items:center;flex-shrink:0}
.eyebrow .dots i{width:6px;height:6px;border-radius:50%;background:var(--orange)}
.eyebrow .dots i:nth-child(2){background:var(--slate-60);width:7px;height:7px}

/* ---------- secciones ---------- */
section{padding:clamp(4rem,7.5vw,7rem) 0;position:relative}
.sec-head{max-width:720px;margin-bottom:clamp(2.4rem,4.5vw,3.6rem)}
.sec-head p{margin-top:1rem}
.tinted{background:var(--bg-2)}
.arched{border-radius:var(--r-lg) var(--r-lg) 0 0}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:150;background:rgba(23,30,39,.86);
  border-bottom:1px solid transparent;transition:border-color .3s ease}
@supports (backdrop-filter:blur(6px)){.hdr{backdrop-filter:blur(14px) saturate(150%)}}
.hdr.stuck{border-bottom-color:var(--hair)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;height:76px}

.brand{display:flex;align-items:center;gap:.6rem;flex-shrink:0}
.brand-mark{width:40px;height:40px;border-radius:11px;background:#fff;padding:3px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:transform .5s var(--ease)}
.brand:hover .brand-mark{transform:scale(1.07)}
.brand-t{font-family:var(--disp);font-weight:800;font-size:1.06rem;
  letter-spacing:-.02em;color:var(--text);line-height:1.1}
.brand-t small{display:block;font-weight:600;font-size:.62rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--slate-40);margin-top:2px}

.nav{display:flex;align-items:center;gap:1.9rem}
.nav a{font-family:var(--disp);font-size:.9rem;font-weight:600;color:var(--slate-60);
  position:relative;padding-block:.35rem;transition:color .2s ease}
.nav a:hover{color:var(--text)}
.nav a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--orange);border-radius:2px;transition:width .28s var(--ease)}
.nav a:hover::after{width:100%}
.nav a.btn::after{display:none}

.burger{display:none;background:var(--surface);border:1px solid var(--hair);
  border-radius:12px;width:44px;height:44px;cursor:pointer;position:relative}
.burger i{position:absolute;left:12px;width:19px;height:2px;border-radius:2px;
  background:var(--text);transition:transform .25s var(--ease),opacity .2s ease}
.burger i:nth-child(1){top:15px}
.burger i:nth-child(2){top:21px}
.burger i:nth-child(3){top:27px}
body.nav-open .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.nav-open .burger i:nth-child(2){opacity:0}
body.nav-open .burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  font-family:var(--disp);font-size:.94rem;font-weight:700;letter-spacing:-.005em;
  padding:.95rem 1.7rem;border-radius:999px;border:1.5px solid transparent;
  cursor:pointer;transition:transform .25s var(--ease),background .22s ease,
  border-color .22s ease,color .22s ease,box-shadow .25s ease}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-p{background:var(--orange);color:#1A222C;border-color:var(--orange);
  box-shadow:0 6px 20px rgba(240,156,0,.22)}
.btn-p:hover{background:var(--orange-l);border-color:var(--orange-l);
  box-shadow:0 10px 28px rgba(240,156,0,.3)}
.btn-s{background:var(--surface);color:var(--text);border-color:var(--hair)}
.btn-s:hover{border-color:var(--slate-40);background:var(--surface-2)}
.btn-g{background:transparent;color:var(--text);border-color:var(--hair)}
.btn-g:hover{background:var(--surface);border-color:var(--orange-20)}

/* ---------- hero ---------- */
/* ---------- HERO a pantalla completa ----------
   El arco pasa de marco de fotito a gesto arquitectónico:
   la sección entera termina en curva. */
.hero{position:relative;min-height:min(92vh,860px);display:flex;align-items:flex-end;
  padding:clamp(7rem,16vh,11rem) 0 clamp(3.5rem,7vw,5.5rem);
  overflow:hidden;margin-top:-76px;
  border-radius:0 0 clamp(40px,7vw,110px) clamp(40px,7vw,110px)}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 42%;
  transform:scale(1.06);animation:slowzoom 26s ease-in-out infinite alternate}
@keyframes slowzoom{to{transform:scale(1.14)}}
.hero-veil{position:absolute;inset:0;z-index:1;background:
  linear-gradient(100deg,rgba(23,30,39,.96) 0%,rgba(23,30,39,.9) 34%,rgba(23,30,39,.6) 62%,rgba(23,30,39,.42) 100%),
  linear-gradient(180deg,rgba(23,30,39,.85) 0%,transparent 26%,rgba(23,30,39,.55) 100%)}
.hero-glow{position:absolute;top:-12%;right:-6%;width:720px;height:720px;z-index:1;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 45% 45%,rgba(240,156,0,.2),transparent 64%)}
.hero .wrap{position:relative;z-index:2;width:100%}
.hero-copy{max-width:980px}
.hero h1{font-size:clamp(2.5rem,7vw,5.4rem);line-height:1.02;letter-spacing:-.04em;
  text-shadow:0 2px 30px rgba(23,30,39,.5)}
.hero h1 .soft{display:block;color:#93A2B3;font-weight:700}
.hero .lead{margin-top:1.7rem;max-width:600px;color:#C7D2DD}
.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2.4rem}
.hero-scroll{position:absolute;left:50%;bottom:1.6rem;z-index:2;transform:translateX(-50%);
  width:24px;height:38px;border:1.5px solid rgba(255,255,255,.28);border-radius:999px}
.hero-scroll::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;
  margin-left:-1.5px;border-radius:2px;background:var(--orange);
  animation:scrolldot 1.9s var(--ease) infinite}
@keyframes scrolldot{0%{opacity:0;transform:translateY(0)}
  30%{opacity:1}70%{opacity:1;transform:translateY(14px)}100%{opacity:0;transform:translateY(16px)}}

/* franja de confianza, ya fuera del hero */
.after-hero{padding-top:clamp(2.5rem,5vw,3.6rem);padding-bottom:clamp(3.5rem,7vw,5.5rem)}

/* el retrato: cuadrado, esquinas redondeadas como el resto de las piezas */
.arch{position:relative}
.arch-img{border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--hair);background:var(--surface)}
.arch-img img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:center 22%;
  transition:transform 1.2s var(--ease)}
.arch:hover .arch-img img{transform:scale(1.035)}
.arch::after{content:"";position:absolute;inset:auto -16px -16px auto;width:140px;height:140px;
  border-radius:50%;background:var(--orange);opacity:.15;z-index:-1}

/* bloque texto + retrato */
.split{display:grid;grid-template-columns:1.25fr .75fr;
  gap:clamp(2.5rem,6vw,5rem);align-items:center}

/* franja de confianza */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;
  margin-top:clamp(2.5rem,5vw,3.8rem)}
.trust > div{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);
  padding:1.5rem 1.4rem;transition:transform .3s var(--ease),border-color .3s ease,
  background .3s ease}
.trust > div:hover{transform:translateY(-3px);border-color:var(--orange-20);
  background:var(--surface-2)}
.trust b{display:block;font-family:var(--disp);font-size:1rem;font-weight:700;
  color:var(--text);margin-bottom:.4rem}
.trust span{display:block;font-size:.96rem;color:var(--slate-60);line-height:1.6}

/* ---------- métricas ---------- */
.stats{background:var(--surface);border-block:1px solid var(--hair)}
.stats .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,4vw,3rem);
  padding-block:clamp(2.4rem,4vw,3.2rem)}
.stat-n{display:block;font-family:var(--disp);font-weight:800;
  font-size:clamp(2.1rem,4.2vw,3rem);letter-spacing:-.04em;color:var(--text);line-height:1}
.stat-n em{color:var(--orange);font-style:normal}
.stat-l{display:block;margin-top:.5rem;font-family:var(--disp);font-size:.88rem;
  font-weight:600;color:var(--slate-40)}

/* ---------- problema ---------- */
.prose-col{max-width:760px}
.prose-col p + p{margin-top:1.15rem}
.pull{margin-top:2rem;padding:1.5rem 1.7rem;background:var(--surface);
  border:1px solid var(--hair);border-left:4px solid var(--orange);
  border-radius:var(--r);font-size:1.1rem;color:var(--text)}

/* ---------- comparativa ---------- */
.comp{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  overflow:hidden}
.comp-row{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:stretch}
.comp-row + .comp-row{border-top:1px solid var(--hair-2)}
.comp-row > *{padding:1.15rem 1.4rem;display:flex;align-items:center;font-size:1rem}
.comp-row > * + *{border-left:1px solid var(--hair-2)}
.comp-head{background:var(--surface-2)}
.comp-head > *{font-family:var(--disp);font-size:.8rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--slate-40);padding-block:1rem}
.comp-head .mine{color:var(--orange)}
.comp-key{font-family:var(--disp);font-weight:700;color:var(--text);font-size:.96rem}
.comp-bad{color:var(--slate-40)}
.comp-good{color:var(--text);font-weight:600;background:var(--orange-10)}

/* ---------- pilares ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.pillar{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .35s var(--ease),border-color .3s ease,background .3s ease}
.pillar:hover{transform:translateY(-5px);border-color:var(--orange-20);background:var(--surface-2)}
.pillar-img{overflow:hidden;background:var(--bg-2)}
.pillar-img img{width:100%;aspect-ratio:16/9;object-fit:cover;
  transition:transform .8s var(--ease)}
.pillar:hover .pillar-img img{transform:scale(1.05)}
.pillar-body{padding:1.5rem 1.6rem 1.8rem;display:flex;flex-direction:column;flex:1}
.pillar-ix{display:flex;align-items:center;gap:.6rem;font-family:var(--disp);
  font-size:.74rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--slate-40);margin-bottom:.8rem}
.pillar-ix b{display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;background:var(--orange-10);
  color:var(--orange);font-size:.76rem;font-weight:800;letter-spacing:0;flex-shrink:0}
.pillar h3{margin-bottom:.55rem}
.pillar p{font-size:.99rem;line-height:1.65}
.pillar.feature{border-color:var(--orange-20);
  background:linear-gradient(180deg,rgba(240,156,0,.09),transparent 60%),var(--surface)}
.pillar.feature .pillar-ix b{background:var(--orange);color:#1A222C}

/* ---------- casos ---------- */
.cases{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
.case{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .35s var(--ease),border-color .3s ease}
.case:hover{transform:translateY(-4px);border-color:var(--orange-20)}
/* proporción exacta de las imágenes: 5/4 → no se recorta nada */
.case-img{position:relative;background:var(--bg-2);overflow:hidden}
.case-img img{width:100%;aspect-ratio:5/4;object-fit:cover;object-position:center top;
  transition:transform .9s var(--ease)}
.case:hover .case-img img{transform:scale(1.03)}
.case-chip{position:absolute;top:1rem;left:1rem;font-family:var(--disp);font-size:.72rem;
  font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  background:rgba(23,30,39,.86);color:var(--orange);
  border:1px solid var(--orange-20);border-radius:999px;padding:.4rem .85rem;
  backdrop-filter:blur(6px)}
.case-body{padding:1.7rem 1.7rem 1.9rem;display:flex;flex-direction:column;flex:1}
.case-body h3{font-size:1.3rem;margin-bottom:.7rem}
.case-body p{font-size:1rem}
.case-tags{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.2rem 0 1.5rem}
.case-tags span{font-family:var(--disp);font-size:.76rem;font-weight:600;
  background:var(--surface-2);color:var(--slate-60);padding:.38rem .8rem;border-radius:999px}
.case .btn{align-self:flex-start;margin-top:auto}

/* ---------- calculadora ---------- */
.calc{background:linear-gradient(135deg,var(--surface-2),var(--surface));
  border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:clamp(2.2rem,5vw,3.6rem);display:grid;grid-template-columns:1fr auto;
  gap:2rem;align-items:center;position:relative;overflow:hidden}
.calc::before{content:"";position:absolute;top:-40%;right:-6%;width:440px;height:440px;
  border-radius:50%;background:rgba(240,156,0,.11);pointer-events:none}
.calc-in{position:relative}
.calc h2{margin-bottom:.8rem}
.calc p{max-width:520px}
.calc .btn{position:relative}

/* ---------- FAQ ---------- */
.faq{max-width:860px;background:var(--surface);border:1px solid var(--hair);
  border-radius:var(--r-lg);overflow:hidden}
.faq-i + .faq-i{border-top:1px solid var(--hair-2)}
.faq-q{width:100%;background:none;border:0;cursor:pointer;display:flex;align-items:center;
  gap:1rem;padding:1.35rem 1.6rem;text-align:left;font-family:var(--disp);
  font-size:1.03rem;font-weight:700;color:var(--text);letter-spacing:-.015em;
  transition:background .2s ease}
.faq-q:hover{background:var(--surface-2)}
.faq-q .sign{margin-left:auto;flex-shrink:0;width:26px;height:26px;border-radius:50%;
  background:var(--orange-10);color:var(--orange);display:flex;align-items:center;
  justify-content:center;font-size:1.05rem;font-weight:700;line-height:1;
  transition:transform .3s var(--ease),background .25s ease,color .25s ease}
.faq-i.open .faq-q .sign{transform:rotate(135deg);background:var(--orange);color:#1A222C}
.faq-a{max-height:0;overflow:hidden;transition:max-height .34s var(--ease)}
.faq-a p{padding:0 1.6rem 1.5rem;font-size:1rem}

/* ---------- contacto ---------- */
.contact{display:grid;grid-template-columns:.92fr 1.08fr;
  gap:clamp(2.2rem,5vw,4rem);align-items:start}
.contact-side .lead{margin-top:1.2rem}
.routes{margin-top:2rem;display:flex;flex-direction:column;gap:.7rem}
.route{display:flex;gap:.9rem;align-items:flex-start;background:var(--surface);
  border:1px solid var(--hair);border-radius:var(--r);padding:1.05rem 1.2rem;
  transition:border-color .25s ease,transform .25s var(--ease)}
.route:hover{border-color:var(--orange-20);transform:translateX(3px)}
.route i{width:24px;height:24px;border-radius:50%;background:var(--orange-10);
  color:var(--orange);font-family:var(--disp);font-size:.72rem;font-weight:800;
  font-style:normal;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;margin-top:2px}
.route b{display:block;font-family:var(--disp);font-size:.96rem;font-weight:700;
  color:var(--text);margin-bottom:.15rem}
.route span{display:block;font-size:.95rem;line-height:1.55}

.form-card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:clamp(1.6rem,3.5vw,2.4rem)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.05rem}
.field{display:flex;flex-direction:column;gap:.45rem}
.field.full{grid-column:1/-1}
.field label{font-family:var(--disp);font-size:.82rem;font-weight:700;color:var(--text)}
.field input,.field select,.field textarea{background:var(--bg);
  border:1.5px solid var(--hair);border-radius:12px;padding:.8rem .95rem;
  font-family:var(--disp);font-size:.95rem;font-weight:500;color:var(--text);width:100%;
  transition:border-color .22s ease,background .22s ease}
.field textarea{min-height:104px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:var(--slate-40);font-weight:500}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--orange);background:var(--bg-2);outline:none}
.field select{appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--slate-60) 50%),
    linear-gradient(135deg,var(--slate-60) 50%,transparent 50%);
  background-position:calc(100% - 19px) 53%,calc(100% - 14px) 53%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.form-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}
.form-note{margin-top:1.1rem;font-size:.9rem;color:var(--slate-40);line-height:1.55}
.form-err{display:none;margin-top:.85rem;padding:.75rem 1rem;border-radius:12px;
  background:var(--orange-10);border:1px solid var(--orange-20);
  font-size:.94rem;color:var(--orange-l)}
.form-err.show{display:block;animation:nudge .38s ease}
@keyframes nudge{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}

/* ---------- footer ---------- */
.ftr{background:var(--bg-2);border-top:1px solid var(--hair);
  padding:clamp(3rem,5vw,4rem) 0 2rem}
.ftr-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.1fr;gap:2.5rem;margin-bottom:2.6rem}
.ftr h5{font-family:var(--disp);font-size:.8rem;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;color:var(--slate-40);margin-bottom:1rem}
.ftr p{font-size:.97rem;max-width:330px;margin-top:1rem}
.ftr ul{list-style:none}
.ftr li{margin-bottom:.6rem}
.ftr li a{font-size:.97rem;color:var(--slate-60);
  transition:color .2s ease,padding-left .28s var(--ease)}
.ftr li a:hover{color:var(--orange);padding-left:.3rem}
.ftr-bottom{border-top:1px solid var(--hair-2);padding-top:1.4rem;display:flex;
  justify-content:space-between;flex-wrap:wrap;gap:1rem;
  font-family:var(--disp);font-size:.86rem;font-weight:500;color:var(--slate-40)}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
.st > *{opacity:0;transform:translateY(18px);
  transition:opacity .65s var(--ease),transform .65s var(--ease)}
.st.in > *{opacity:1;transform:none}
.st.in > *:nth-child(2){transition-delay:.08s}
.st.in > *:nth-child(3){transition-delay:.16s}
.st.in > *:nth-child(4){transition-delay:.24s}
.st.in > *:nth-child(5){transition-delay:.32s}
.st.in > *:nth-child(6){transition-delay:.4s}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .nav{position:fixed;inset:76px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--bg);border-bottom:1px solid var(--hair);
    padding:.5rem var(--gut) 1.4rem;display:none}
  body.nav-open .nav{display:flex}
  .nav a{padding:.95rem 0;border-bottom:1px solid var(--hair-2);font-size:1rem}
  .nav a::after{display:none}
  .nav a.btn{margin-top:1rem;border-bottom:1.5px solid var(--orange)}
  .burger{display:block}
  .split,.contact,.calc{grid-template-columns:1fr}
  .cases{grid-template-columns:1fr}
  .arch{max-width:420px;margin-inline:auto}
  .arch-img img{aspect-ratio:1/1}
  .hero{min-height:auto;padding:clamp(8rem,20vh,11rem) 0 clamp(3rem,8vw,4.5rem)}
  .hero-scroll{display:none}
  .hero-veil{background:
    linear-gradient(180deg,rgba(23,30,39,.9) 0%,rgba(23,30,39,.78) 40%,rgba(23,30,39,.92) 100%)}
  .pillars{grid-template-columns:repeat(2,1fr)}
  .ftr-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:720px){
  .trust{grid-template-columns:1fr}
  .stats .wrap{grid-template-columns:1fr;gap:1.8rem;text-align:center}
  .comp-row{grid-template-columns:1fr}
  .comp-row > * + *{border-left:0;border-top:1px solid var(--hair-2)}
  .comp-head{display:none}
  .comp-key{background:var(--surface-2);font-size:.78rem;letter-spacing:.1em;
    text-transform:uppercase;color:var(--slate-40)}
  .pillars{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .ftr-grid{grid-template-columns:1fr}
  .btn{width:100%}
  .hero-actions,.form-actions{flex-direction:column}
  .case .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rv,.st > *{opacity:1!important;transform:none!important}
}

/* ============================================================
   PÁGINAS INTERNAS
   ============================================================ */

/* hero compacto */
.page-hero{padding:clamp(4.5rem,9vw,7rem) 0 clamp(2.5rem,5vw,4rem);
  position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;top:-45%;right:-8%;width:620px;height:620px;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 45% 45%,rgba(240,156,0,.13),transparent 66%)}
.page-hero .wrap{position:relative;z-index:1}
.page-hero h1{font-size:clamp(2.1rem,5vw,3.6rem);max-width:900px}
.page-hero .lead{margin-top:1.4rem;max-width:660px}
.page-hero .hero-actions{margin-top:2rem}
.crumb{font-family:var(--disp);font-size:.85rem;font-weight:600;color:var(--slate-40);
  margin-bottom:1.4rem;display:flex;gap:.5rem;flex-wrap:wrap}
.crumb a:hover{color:var(--orange)}

/* KPIs de caso */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;
  margin-top:clamp(2.2rem,4vw,3rem)}
.kpi{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);
  padding:1.3rem 1.3rem 1.4rem}
.kpi b{display:block;font-family:var(--disp);font-weight:800;
  font-size:clamp(1.7rem,3vw,2.2rem);color:var(--orange);letter-spacing:-.03em;line-height:1}
.kpi span{display:block;margin-top:.4rem;font-family:var(--disp);font-size:.86rem;
  font-weight:600;color:var(--slate-40)}

/* grilla de tarjetas simples */
.cards{display:grid;gap:1.2rem}
.cards.c2{grid-template-columns:repeat(2,1fr)}
.cards.c3{grid-template-columns:repeat(3,1fr)}
.cards.c4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);
  padding:1.5rem 1.6rem 1.7rem;
  transition:transform .32s var(--ease),border-color .3s ease,background .3s ease}
.card:hover{transform:translateY(-4px);border-color:var(--orange-20);background:var(--surface-2)}
.card h3{margin-bottom:.5rem}
.card p{font-size:.98rem;line-height:1.65}
.card .num{display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:50%;background:var(--orange-10);color:var(--orange);
  font-family:var(--disp);font-size:.85rem;font-weight:800;margin-bottom:.9rem}
.card .tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.card .tags span{font-family:var(--disp);font-size:.74rem;font-weight:600;
  background:var(--surface-2);color:var(--slate-40);padding:.32rem .7rem;border-radius:999px}

/* equipo */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
.member{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:1.8rem 1.7rem 1.9rem;transition:transform .32s var(--ease),border-color .3s ease}
.member:hover{transform:translateY(-4px);border-color:var(--orange-20)}
.member .role{font-family:var(--disp);font-size:.75rem;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;color:var(--orange);margin-bottom:.6rem}
.member h3{font-size:1.5rem;margin-bottom:.6rem}
.member p{font-size:.97rem}

/* cita */
.quote{margin-top:clamp(2rem,4vw,3rem);padding:clamp(1.8rem,4vw,2.6rem);
  background:var(--surface);border:1px solid var(--hair);border-left:4px solid var(--orange);
  border-radius:var(--r-lg)}
.quote p{font-size:clamp(1.15rem,2vw,1.4rem);color:var(--text);line-height:1.55;font-style:italic}
.quote cite{display:block;margin-top:.9rem;font-family:var(--disp);font-size:.82rem;
  font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--slate-40);font-style:normal}

/* prose legal / artículo */
.article{max-width:820px}
.article h2{font-size:clamp(1.4rem,2.6vw,1.85rem);margin:2.6rem 0 .9rem}
.article h2:first-child{margin-top:0}
.article p{margin-bottom:1rem}
.article ul{list-style:none;margin:0 0 1.2rem}
.article li{position:relative;padding-left:1.5rem;margin-bottom:.6rem;font-size:1.02rem}
.article li::before{content:"";position:absolute;left:0;top:.65em;width:6px;height:6px;
  border-radius:50%;background:var(--orange)}
.toc{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);
  padding:1.4rem 1.6rem;margin-bottom:2.5rem}
.toc h5{font-family:var(--disp);font-size:.78rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--slate-40);margin-bottom:.9rem}
.toc ol{list-style:none;counter-reset:t;columns:2;column-gap:2rem}
.toc li{counter-increment:t;margin-bottom:.5rem;font-family:var(--disp);font-size:.94rem;
  font-weight:600;break-inside:avoid}
.toc li a{color:var(--slate-60)}
.toc li a:hover{color:var(--orange)}
.updated{font-family:var(--disp);font-size:.86rem;font-weight:600;color:var(--slate-40);
  margin-bottom:2rem}

/* banda CTA reutilizable */
.cta-band{background:linear-gradient(135deg,var(--surface-2),var(--surface));
  border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:clamp(2.2rem,5vw,3.4rem);text-align:center}
.cta-band h2{margin-bottom:.9rem}
.cta-band p{max-width:620px;margin:0 auto}
.cta-band .hero-actions{justify-content:center;margin-top:1.9rem}

/* ============================================================
   CALCULADORA
   ============================================================ */
.calc-layout{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;align-items:start}
.panel{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:clamp(1.5rem,3vw,2.1rem)}
.panel > h3{font-family:var(--disp);font-size:.8rem;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--slate-40);margin-bottom:1.3rem}
.panel + .panel{margin-top:1.4rem}
.calc-fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.calc-fields .field.full{grid-column:1/-1}
.hint{font-size:.85rem;color:var(--slate-40);margin-top:.2rem;line-height:1.45}
.presets{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.4rem}
.preset{font-family:var(--disp);font-size:.82rem;font-weight:700;background:var(--surface-2);
  border:1.5px solid var(--hair);color:var(--slate-60);border-radius:999px;
  padding:.5rem 1rem;cursor:pointer;transition:all .22s ease}
.preset:hover{border-color:var(--orange-20);color:var(--text)}
.preset.on{background:var(--orange);border-color:var(--orange);color:#1A222C}

.results{position:sticky;top:96px}
.res-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.res{background:var(--bg-2);border:1px solid var(--hair);border-radius:var(--r);padding:1.1rem 1.2rem}
.res span{display:block;font-family:var(--disp);font-size:.76rem;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;color:var(--slate-40);margin-bottom:.45rem}
.res b{display:block;font-family:var(--disp);font-size:clamp(1.3rem,2.4vw,1.75rem);
  font-weight:800;color:var(--text);letter-spacing:-.03em;line-height:1.1}
.res.win{background:var(--orange-10);border-color:var(--orange-20)}
.res.win b{color:var(--orange)}
.res-hero{margin-top:1rem;background:linear-gradient(135deg,rgba(240,156,0,.16),transparent 70%),var(--bg-2);
  border:1px solid var(--orange-20);border-radius:var(--r);padding:1.5rem 1.4rem}
.res-hero span{display:block;font-family:var(--disp);font-size:.78rem;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;color:var(--slate-40);margin-bottom:.5rem}
.res-hero b{display:block;font-family:var(--disp);font-size:clamp(2rem,4.2vw,2.9rem);
  font-weight:800;color:var(--orange);letter-spacing:-.04em;line-height:1}
.res-hero em{display:block;font-style:normal;margin-top:.5rem;font-size:.95rem;color:var(--slate-60)}
.disclaimer{margin-top:1.2rem;font-size:.86rem;color:var(--slate-40);line-height:1.55}

/* ============================================================
   RESPONSIVE PÁGINAS INTERNAS
   ============================================================ */
@media (max-width:980px){
  .kpis{grid-template-columns:repeat(2,1fr)}
  .cards.c3,.cards.c4{grid-template-columns:repeat(2,1fr)}
  .team{grid-template-columns:1fr}
  .calc-layout{grid-template-columns:1fr}
  .results{position:static}
}
@media (max-width:720px){
  .kpis{grid-template-columns:repeat(2,1fr)}
  .cards.c2,.cards.c3,.cards.c4{grid-template-columns:1fr}
  .calc-fields{grid-template-columns:1fr}
  .res-grid{grid-template-columns:1fr}
  .toc ol{columns:1}
  .preset{flex:1;min-width:calc(50% - .25rem)}
}