
:root{
  --bg:#08090A; --bg2:#0E1113; --bg3:#141A1D; --line:#232B2F;
  --ink:#F2F4F5; --ink2:#A8B2B6; --ink3:#6E7A7F;
  --teal:#2C6E8F; --green:#3CB84B; --fluo:#4DFF7A; --amber:#F0A828; --orange:#F0781E;
  --mx:clamp(20px,5vw,84px);
  --h1:clamp(2.5rem,6.4vw,5.4rem); --h2:clamp(1.9rem,3.9vw,3.15rem);
  --h3:clamp(1.15rem,1.7vw,1.45rem); --body:clamp(1rem,1.12vw,1.115rem);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:Archivo,system-ui,sans-serif;
  font-size:var(--body);line-height:1.62;font-synthesis:none;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit}
::selection{background:var(--fluo);color:#08090A}

.kick{font-family:'Archivo Narrow',Archivo,sans-serif;font-weight:700;font-size:.735rem;
  letter-spacing:.19em;text-transform:uppercase;color:var(--fluo)}
.kick.dim{color:var(--ink3)}
h1,h2,h3{font-weight:800;line-height:1.04;letter-spacing:-.025em}
h1{font-size:var(--h1)}
h2{font-size:var(--h2)}
h3{font-size:var(--h3);line-height:1.2;letter-spacing:-.015em}
.lead{font-size:clamp(1.1rem,1.55vw,1.36rem);line-height:1.55;color:var(--ink2);font-weight:400}
p+p{margin-top:1em}
.wrap{max-width:1320px;margin:0 auto;padding:0 var(--mx)}

/* header */
header{position:fixed;inset:0 0 auto;z-index:60;background:rgba(8,9,10,.62);backdrop-filter:blur(16px);
  background:rgba(8,9,10,.62);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
header.on{border-bottom-color:var(--line);background:rgba(8,9,10,.9)}
.hbar{display:flex;align-items:center;justify-content:space-between;gap:24px;
  height:70px;max-width:1320px;margin:0 auto;padding:0 var(--mx)}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0}
.brand img{height:38px;width:auto}
.brand b{font-family:Oswald,'Archivo Narrow',sans-serif;font-weight:500;letter-spacing:.11em;font-size:1.12rem;line-height:1}
nav{display:flex;gap:26px;align-items:center}
nav a{font-family:'Archivo Narrow',sans-serif;font-weight:600;font-size:.845rem;letter-spacing:.055em;
  text-transform:uppercase;color:var(--ink2);text-decoration:none;transition:color .2s}
nav a:hover{color:var(--fluo)}
@media(max-width:900px){nav{display:none}}
.hbar .btn.p{white-space:nowrap}
.hbar .btn.p .sm{display:none}
@media(max-width:900px){.hbar{height:62px}.hbar .btn.p{padding:10px 18px !important;font-size:.8rem !important}
  .hbar .btn.p .lg{display:none}.hbar .btn.p .sm{display:inline}.brand img{height:31px;width:auto}}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.hero::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,9,10,.72) 0%,rgba(8,9,10,.3) 34%,rgba(8,9,10,.86) 72%,#08090A 100%)}
.hero .wrap{position:relative;z-index:2;padding-bottom:clamp(56px,8vh,104px);padding-top:130px}
.hero h1{max-width:20ch;margin:.4em 0 .55em}
.hero .lead{max-width:56ch}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:2.1em}
.btn{display:inline-flex;align-items:center;gap:9px;padding:14px 25px;border-radius:999px;
  font-weight:700;font-size:.9rem;letter-spacing:.02em;text-decoration:none;
  border:1px solid var(--line);color:var(--ink);transition:.22s;background:rgba(20,26,29,.6)}
.btn:hover{border-color:var(--fluo);color:var(--fluo)}
.btn.p{background:var(--fluo);color:#08090A;border-color:var(--fluo)}
.btn.p:hover{background:#7BFF9D;border-color:#7BFF9D;color:#08090A}

/* definicion */
.defn{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg2)}
.defn .wrap{padding:clamp(46px,7vw,86px) var(--mx);display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,64px)}
.defn .bar{width:3px;background:linear-gradient(180deg,var(--fluo),rgba(77,255,122,0))}
.defn q{font-size:clamp(1.35rem,2.7vw,2.1rem);font-weight:700;line-height:1.28;letter-spacing:-.02em;display:block}
.defn small{display:block;margin-top:1.2em;color:var(--ink3);font-size:.86rem;letter-spacing:.04em}
@media(max-width:640px){.defn .wrap{grid-template-columns:1fr}.defn .bar{width:100%;height:3px;
  background:linear-gradient(90deg,var(--fluo),rgba(77,255,122,0))}}

/* seccion generica */
section.blk{padding:clamp(72px,10vw,132px) 0}
section[id],div[id]{scroll-margin-top:74px}
.shead{max-width:62ch;margin-bottom:clamp(34px,5vw,62px)}
.shead h2{margin:.42em 0 .5em}

/* pilares */
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:4px;overflow:hidden}
.grid4>div{background:var(--bg2);padding:clamp(24px,2.6vw,34px)}
.grid4 .num{font-family:'Archivo Narrow',sans-serif;font-size:.76rem;letter-spacing:.16em;color:var(--fluo);font-weight:700}
.grid4 h3{margin:.85em 0 .5em}
.grid4 p{color:var(--ink2);font-size:.955rem;line-height:1.6}
@media(max-width:1020px){.grid4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.grid4{grid-template-columns:1fr}}

/* video */
.vid{background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.vid .wrap{padding:clamp(64px,8vw,104px) var(--mx);display:grid;
  grid-template-columns:1fr minmax(280px,352px);gap:clamp(36px,6vw,84px);align-items:center}
.vid video{width:100%;border-radius:14px;border:1px solid var(--line);background:#000}
@media(max-width:860px){.vid .wrap{grid-template-columns:1fr}}

/* funciones */
.fn{border-top:1px solid var(--line);scroll-margin-top:70px}
.fn .in{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch}
.fn .ph{position:relative;min-height:clamp(360px,52vw,620px);overflow:hidden}
.fn .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transform:scale(1.03);transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.fn:hover .ph img{transform:scale(1.075)}
.fn .ph.light::after{background:linear-gradient(90deg,rgba(8,9,10,.10),rgba(8,9,10,0) 50%,rgba(8,9,10,.12))}
.fn .ph::after{content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(8,9,10,.34),rgba(8,9,10,0) 55%,rgba(8,9,10,.5))}
.fn .ph .ic{position:absolute;inset:auto auto auto clamp(18px,2.4vw,30px);
  top:clamp(18px,2.4vw,30px);width:clamp(58px,5.4vw,78px);height:auto;
  object-fit:contain;transform:none;transition:none;z-index:2}
.fn:hover .ph .ic{transform:none}
.fn .tx{padding:clamp(38px,5.4vw,82px) clamp(26px,4.6vw,72px);display:flex;flex-direction:column;
  justify-content:center;background:var(--bg)}
.fn:nth-child(even) .in{direction:rtl}
.fn:nth-child(even) .in>*{direction:ltr}
.fn .idx{font-family:'Archivo Narrow',sans-serif;font-weight:700;font-size:.78rem;letter-spacing:.2em;color:var(--ink3)}
.fn h2{font-size:clamp(1.75rem,3.2vw,2.6rem);margin:.5em 0 .62em}
.fn .rs{font-size:clamp(1.03rem,1.35vw,1.19rem);color:var(--ink);line-height:1.55;font-weight:500}
.fn .dt{color:var(--ink2);margin-top:1.15em;font-size:.985rem}
.fn dl{margin-top:2.05em;border-top:1px solid var(--line);padding-top:1.35em;display:grid;gap:1.05em}
.fn dt{font-family:'Archivo Narrow',sans-serif;font-weight:700;font-size:.715rem;letter-spacing:.17em;
  text-transform:uppercase;color:var(--fluo);margin-bottom:.34em}
.fn dd{color:var(--ink2);font-size:.94rem;line-height:1.5}
.fn dl .ev dt{color:var(--amber)}
@media(max-width:900px){.fn .in,.fn:nth-child(even) .in{grid-template-columns:1fr;direction:ltr}
  .fn .ph{min-height:300px}}

/* costos */
.cost{background:var(--bg2);border-top:1px solid var(--line)}
.cgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:4px;overflow:hidden;margin-top:clamp(30px,4vw,52px)}
.cgrid>div{background:var(--bg);padding:clamp(24px,2.6vw,34px)}
.cgrid b{display:block;font-size:clamp(1.9rem,3.1vw,2.65rem);font-weight:800;letter-spacing:-.03em;
  line-height:1;color:var(--amber)}
.cgrid .u{font-family:'Archivo Narrow',sans-serif;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink3);margin:.85em 0 1em;display:block}
.cgrid p{font-size:.93rem;color:var(--ink2);line-height:1.54}
.cgrid a{color:var(--ink3);font-size:.79rem;text-decoration:none;border-bottom:1px solid var(--line);
  display:inline-block;margin-top:1em;transition:.2s}
.cgrid a:hover{color:var(--fluo);border-color:var(--fluo)}
@media(max-width:1020px){.cgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.cgrid{grid-template-columns:1fr}}

/* ficha tecnica */
.tec{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(28px,4vw,46px)}
.tgrp{background:var(--bg);padding:clamp(22px,2.6vw,34px) clamp(20px,2.4vw,32px)}
.tgrp h3{font-family:'Archivo Narrow',sans-serif;font-size:.78rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--fluo);margin-bottom:1.5em}
.tgrp dl{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line)}
.tgrp dl>div{background:var(--bg);padding:14px 0 14px 0}
.tgrp dl>div{padding:14px 16px 14px 0}
.tgrp dt{font-family:'Archivo Narrow',sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink3);margin-bottom:.5em}
.tgrp dd{font-size:.95rem;color:var(--ink2);line-height:1.5;margin:0}
@media(max-width:720px){.tgrp dl{grid-template-columns:1fr}}

/* estado */
.est{display:grid;gap:1px;background:var(--line);border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);margin-top:clamp(28px,4vw,48px)}
.est>div{background:var(--bg);display:grid;grid-template-columns:minmax(190px,26%) 1fr;
  gap:clamp(16px,3vw,42px);padding:clamp(20px,2.5vw,30px) 0}
.est h3{font-size:1.02rem;letter-spacing:-.01em}
.est p{color:var(--ink2);font-size:.96rem}
@media(max-width:680px){.est>div{grid-template-columns:1fr;gap:8px}}
.note{margin-top:1.6em;color:var(--ink3);font-size:.85rem;max-width:74ch}

/* contacto */
.cont{position:relative;overflow:hidden;border-top:1px solid var(--line)}
.cont>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.cont::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#08090A 0%,rgba(8,9,10,.72) 50%,#08090A 100%)}
.cont .wrap{position:relative;z-index:2;padding:clamp(78px,11vw,148px) var(--mx);text-align:center}
.cont img.lg{width:clamp(230px,26vw,330px);margin:0 auto clamp(26px,3.4vw,40px)}
.cont h2{max-width:22ch;margin:0 auto .7em}
.cont .lead{max-width:52ch;margin:0 auto}
.frentes{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(245,246,247,.14);
  margin:clamp(30px,4vw,48px) 0 0;text-align:left;border:1px solid rgba(245,246,247,.14)}
.frentes>div{background:rgba(8,9,10,.72);padding:clamp(20px,2.2vw,28px)}
.frentes b{display:block;font-family:'Archivo Narrow',sans-serif;font-size:.8rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--fluo);margin-bottom:.9em}
.frentes p{font-size:.92rem;color:var(--ink2);line-height:1.55;margin:0}
@media(max-width:960px){.frentes{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.frentes{grid-template-columns:1fr}}
.mail{display:inline-block;margin-top:2.2em;font-size:clamp(1.1rem,2vw,1.6rem);font-weight:700;
  letter-spacing:-.02em;text-decoration:none;border-bottom:2px solid var(--fluo);padding-bottom:5px;transition:.2s}
.mail:hover{color:var(--fluo)}
.sig{margin-top:2.4em;color:var(--ink3);font-size:.9rem;line-height:1.8}
footer{border-top:1px solid var(--line);padding:30px 0;background:var(--bg)}
footer .wrap{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;
  color:var(--ink3);font-size:.79rem;letter-spacing:.05em}

/* reveal */
html.js .rv{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
html.js .rv.sh{opacity:1;transform:none}
.fn .more{display:inline-block;margin-top:1.8em;font-family:'Archivo Narrow',Archivo,sans-serif;
  font-weight:700;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;
  color:var(--fluo);border-bottom:1px solid rgba(77,255,122,.4);padding-bottom:3px;transition:.2s}
.fn .more:hover{border-bottom-color:var(--fluo)}
@media(prefers-reduced-motion:reduce){html.js .rv{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}.fn .ph img{transition:none}}
