:root{--bg:#0A0A0A;--panel:#12171C;--line:#26313A;--text:#F2F6FA;--muted:#A3B1BE;--ac:#38A8E8}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--bg);color:var(--text);font:400 17px/1.65 Montserrat,sans-serif}
a{color:inherit}
:focus-visible{outline:2px solid var(--ac);outline-offset:3px}
h1,h2,h3,.marca{font-family:Montserrat,sans-serif;font-weight:500;line-height:1.2;margin:0}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
header{position:sticky;top:0;z-index:5;background:rgba(10,10,10,.94);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:12px;padding-bottom:12px;flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:18px;letter-spacing:.22em}
.marca img{width:46px;height:46px}
.marca small{display:block;font-size:11px;letter-spacing:.55em;color:var(--ac);margin-top:4px}
nav{display:flex;gap:26px;flex-wrap:wrap}
nav a{text-decoration:none;color:var(--muted);font-size:15px;padding:6px 0;border-bottom:2px solid transparent}
nav a:hover{color:var(--text);border-color:var(--ac)}
section{padding:96px 0;border-bottom:1px solid var(--line)}
#inicio{padding:80px 0 96px;overflow:hidden}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
h1{font-size:clamp(34px,5vw,56px);max-width:15em}
.hero p{color:var(--muted);max-width:34em;margin:24px 0 36px}
.btns{display:flex;gap:16px;flex-wrap:wrap}
.btn{display:inline-block;padding:14px 26px;border:1.5px solid var(--ac);border-radius:4px;text-decoration:none;font-weight:600;font-size:15px}
.btn.pri{background:var(--ac);color:#0A0A0A}
.btn:hover{background:var(--text);border-color:var(--text);color:#0A0A0A}
.mark{width:100%;max-width:440px;justify-self:end;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.mark path{stroke-dasharray:1;stroke-dashoffset:1;animation:trazo 2.4s .2s cubic-bezier(.6,0,.2,1) forwards}
.mark path+path{animation-delay:1.1s}
@keyframes trazo{to{stroke-dashoffset:0}}
h2{font-size:clamp(28px,3.4vw,40px);margin-bottom:48px}
.area{display:grid;grid-template-columns:1fr 1.4fr;gap:32px;padding:32px 0;border-top:1px solid var(--line)}
.area:last-child{border-bottom:1px solid var(--line)}
.area h3{font-size:26px;color:var(--ac)}
.area ul{margin:0;padding:0;list-style:none;columns:2;column-gap:32px}
.area li{padding:6px 0;break-inside:avoid;color:var(--muted)}
.nos{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.nos p{color:var(--muted);margin:0 0 20px}
.equipo{list-style:none;margin:0;padding:0}
.equipo li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.equipo span{color:var(--muted);font-size:15px}
.cont{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px}
.datos p{margin:0 0 22px;color:var(--muted)}
.datos strong{display:block;color:var(--text);font-family:Montserrat,sans-serif;font-weight:600;font-size:17px;margin-bottom:2px}
.datos a:hover{color:var(--ac)}
form{display:grid;gap:18px}
label{display:grid;gap:6px;font-size:15px;color:var(--muted)}
input,textarea{font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:12px 14px}
input:focus,textarea:focus{border-color:var(--ac);outline:none}
textarea{min-height:140px;resize:vertical}
.hp{position:absolute;left:-9999px}
form button{justify-self:start;cursor:pointer;font:600 15px Montserrat,sans-serif;background:var(--ac);color:#0A0A0A;border:0;border-radius:4px;padding:14px 28px}
form button:hover{background:var(--text)}
.aviso{display:none;padding:14px 16px;border-left:3px solid var(--ac);background:var(--panel)}
.aviso.on{display:block}
footer{padding:36px 0;color:var(--muted);font-size:14px}
@media (max-width:820px){
.hero,.nos,.cont,.area{grid-template-columns:1fr}
.mark{justify-self:start;max-width:260px}
.area ul{columns:1}
section{padding:64px 0}
}
@media (prefers-reduced-motion:reduce){.mark path{animation:none;stroke-dashoffset:0}html{scroll-behavior:auto}}
