:root{--navy:#16304f;--ink:#0e1f33;--blue:#2a6aa8;--sky:#6bbbdc;--paper:#f3f6f9;--line:#c9d3de;--white:#fff;
--head:"Barlow Semi Condensed","Arial Narrow",Arial,sans-serif;--body:"Source Sans 3","Segoe UI",Arial,sans-serif}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{font:400 1.0625rem/1.6 var(--body);color:var(--ink);background:var(--white)}
a{color:inherit}
img{max-width:100%;display:block}
:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--head);font-weight:600;line-height:1.1}
h2{font-size:clamp(1.9rem,4vw,2.7rem);color:var(--navy)}
h3{font-size:1.3rem;color:var(--navy)}
.kicker{display:flex;align-items:center;gap:14px;color:var(--blue);font:600 1.15rem var(--head);margin-bottom:12px}
.kicker::before{content:"";width:56px;height:2px;background:var(--blue)}
.muted{color:#4a6179}

/* Cabecera */
header{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.hbar{display:flex;align-items:stretch;justify-content:space-between;gap:20px;min-height:76px;padding-left:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:700 1.4rem var(--head);letter-spacing:.04em}
.brand img{height:46px;width:auto}
nav{display:flex;align-items:center}
nav ul{list-style:none;padding:0;display:flex;gap:26px}
nav a{text-decoration:none;font-weight:600;padding:6px 0;border-bottom:2px solid transparent}
nav a:hover,nav a[aria-current]{border-color:var(--blue);color:var(--blue)}
.wa{display:flex;align-items:center;background:var(--navy);color:var(--white);padding:0 28px;font-weight:600;text-decoration:none}
.wa:hover{background:var(--blue)}
.wafloat{position:fixed;right:20px;bottom:20px;z-index:20;background:#25d366;color:#07290f;font-weight:600;padding:12px 20px;border-radius:999px;text-decoration:none;box-shadow:0 4px 14px rgba(0,0,0,.25)}

/* Botones */
.btn{display:inline-block;background:var(--blue);color:var(--white);font:600 1.1rem var(--head);letter-spacing:.03em;padding:14px 30px;text-decoration:none;border:0;cursor:pointer;border-radius:2px}
.btn:hover{background:var(--navy)}
.hero .btn{background:var(--sky);color:var(--ink)}
.hero .btn:hover{background:var(--white)}
.hero .btn.ghost{background:transparent;color:var(--white);border:2px solid var(--sky);margin-left:12px}
.hero .btn.ghost:hover{background:var(--sky);color:var(--ink)}

/* Portada */
.hero{background-color:var(--navy);color:var(--white);padding:104px 0 150px;
background-image:linear-gradient(rgba(107,187,220,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(107,187,220,.12) 1px,transparent 1px);background-size:48px 48px}
.hero h1{font-size:clamp(2.6rem,7vw,5rem);font-weight:700;max-width:14ch}
.hero .lead{font-size:1.25rem;margin:24px 0 34px;max-width:36ch;color:#dbe8f3}
.page{background-color:var(--navy);color:var(--white);padding:64px 0;background-image:linear-gradient(rgba(107,187,220,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(107,187,220,.12) 1px,transparent 1px);background-size:48px 48px}
.page h1{font-size:clamp(2.2rem,5vw,3.6rem);max-width:20ch}
.page p{margin-top:14px;color:#dbe8f3;max-width:56ch}
.cards{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:20px;margin-top:-84px;position:relative}
.card{padding:32px;background:var(--paper);border-top:4px solid var(--blue);box-shadow:0 6px 18px rgba(14,31,51,.12)}
.card.main{background:var(--blue);color:var(--white);border-color:var(--sky)}
.card h3{margin-bottom:8px}
.card.main h3{color:var(--white)}
.card p+a{display:inline-block;margin-top:12px;font-weight:600;color:var(--blue)}

/* Secciones */
section{padding:88px 0}
section.alt{background:var(--paper)}
.head{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:44px}
.head .btn{margin-top:22px}
.rows{border-top:2px solid var(--navy)}
.row{display:grid;grid-template-columns:minmax(200px,1fr) 2fr;gap:24px;padding:22px 0;border-bottom:1px solid var(--line)}
.row ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px 26px}
.row li{position:relative;padding-left:16px}
.row li::before{content:"";position:absolute;left:0;top:.7em;width:8px;height:2px;background:var(--blue)}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.cols h3{padding-bottom:10px;border-bottom:4px solid var(--blue);margin-bottom:14px}
.cols div:nth-child(2) h3{border-color:var(--sky)}
.cols div:nth-child(3) h3{border-color:var(--navy)}
.cols ul{list-style:none;padding:0}
.cols li{padding:5px 0;border-bottom:1px dotted var(--line)}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.gal.two{grid-template-columns:repeat(2,1fr)}
figure a{display:block;background:var(--white);border:1px solid var(--line);aspect-ratio:4/3;overflow:hidden}
figure img{width:100%;height:100%;object-fit:contain}
figure a:hover{border-color:var(--blue)}
figcaption{padding-top:12px}
figcaption b{display:block;font:600 1.2rem var(--head);color:var(--navy)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.two-col p+p{margin-top:14px}
.tags{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:24px 0 0}
.tags li{border:1px solid var(--navy);padding:6px 14px;font-weight:600;color:var(--navy)}
.sectors{list-style:none;padding:0;border-top:2px solid var(--navy)}
.sectors li{padding:12px 0;border-bottom:1px solid var(--line);font-weight:600}
.sectors span{display:block;font-weight:400;color:#4a6179}
.band{background:var(--navy);color:var(--white);padding:60px 0}
.band .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.band h2{color:var(--white)}

/* Contacto */
.contact{background-color:var(--ink);color:var(--white);padding:72px 0}
.cgrid{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center}
.contact h2{color:var(--white);margin-bottom:16px}
.data{font-style:normal;display:grid;gap:20px;margin-top:28px}
.data b{display:block;color:var(--sky);font:600 1.3rem var(--head)}
.data a{text-decoration:none;border-bottom:1px solid var(--sky)}
form{background:var(--white);color:var(--ink);padding:36px;display:grid;gap:16px}
form h2{color:var(--ink);font-size:2rem;margin:0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:grid;gap:6px;font-weight:600;color:#4a6179}
input,select,textarea{font:inherit;color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:2px;padding:11px 12px;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--blue)}
textarea{min-height:130px;resize:vertical}
.hp{position:absolute;left:-9999px}
#estado{min-height:1.6em;font-weight:600}
#estado.ok{color:#1b7a3f}
#estado.error{color:#b3261e}
button[disabled]{opacity:.6;cursor:wait}

footer{background:var(--ink);color:#aebfd0;padding:48px 0 28px;font-size:.98rem}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
footer h3{color:var(--white);font-size:1.15rem;margin-bottom:10px}
footer ul{list-style:none;padding:0}
footer li{padding:2px 0}
footer a{text-decoration:none}
footer a:hover{color:var(--white)}
.legal{margin-top:32px;padding-top:18px;border-top:1px solid rgba(255,255,255,.15);font-size:.9rem}

@media (max-width:900px){
  .hbar{flex-wrap:wrap;padding:10px 0 0 16px;gap:0}
  nav{order:3;width:100%;padding:8px 16px 10px;overflow-x:auto}
  nav ul{gap:18px;white-space:nowrap}
  .wa{padding:0 16px;font-size:.95rem}
  .brand{font-size:1.15rem}
  .cards,.head,.cols,.gal,.gal.two,.two-col,.cgrid,.fgrid{grid-template-columns:1fr}
  .row{grid-template-columns:1fr;gap:8px}
  .two{grid-template-columns:1fr}
  .hero{padding:72px 0 120px}
  .hero .btn.ghost{margin:12px 0 0}
  section{padding:60px 0}
  .head{gap:12px}
  form{padding:24px}
}

.contact form h2{color:var(--ink)}

/* Marca y WhatsApp */
.brand img.word{height:34px;width:auto}
.wa svg{width:24px;height:24px;margin-right:10px;flex:none}
.wchat{position:fixed;right:20px;bottom:20px;z-index:20;display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.wbtn{width:62px;height:62px;border-radius:50%;background:#25d366;color:#fff;border:0;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.3)}
.wbtn:hover{background:#1fb858}
.wbtn svg{width:36px;height:36px}
.wpop{width:min(320px,calc(100vw - 40px));background:#f7fcf8;border-radius:22px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.wpop[hidden]{display:none}
.whead{background:#25d366;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:14px 16px}
.wtitle{display:flex;align-items:center;gap:8px;font:700 1.3rem Arial,sans-serif}
.wtitle svg{width:30px;height:30px}
.wclose{width:40px;height:40px;border-radius:50%;background:#1a7f45;color:#fff;border:0;font-size:1.6rem;line-height:1;cursor:pointer}
.wclose:hover{background:#156a39}
.wbody{padding:18px 16px 16px;display:grid;gap:18px;justify-items:end}
.wbubble{justify-self:start;background:#fff;border-radius:20px;padding:14px 20px;color:#3b3b3b;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.wopen{display:inline-flex;align-items:center;gap:12px;background:#25d366;color:#fff;font:700 1.1rem Arial,sans-serif;padding:12px 18px 12px 22px;border-radius:999px;text-decoration:none;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.wopen:hover{background:#1fb858}
.wopen svg{width:30px;height:30px}

.brand{gap:16px}
.brand img.mark{height:52px;width:52px}
.fimg{display:block;background:var(--white);border:1px solid var(--line);aspect-ratio:4/3;overflow:hidden}

.hbar{min-height:84px}
.brand img.mark{height:64px;width:64px}
@media (max-width:900px){.hbar{min-height:0}.brand img.mark{height:52px;width:52px}}
.hbar{padding-right:24px}
@media (max-width:900px){.hbar{padding-right:0}}

.hbar{padding-right:0}
.wa[aria-current]{background:var(--blue)}

.menu{display:none;width:56px;height:64px;border:0;background:var(--white);font-size:1.7rem;cursor:pointer;color:var(--navy)}
details.row{display:block;padding:0}
details.row summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:18px 0}
details.row summary::-webkit-details-marker{display:none}
details.row summary::after{content:"+";font:600 1.8rem var(--head);color:var(--blue)}
details.row[open] summary::after{content:"\2013"}
details.row ul{padding:0 0 18px}
@media (max-width:900px){
 .hbar{flex-wrap:wrap;align-items:center;min-height:64px;padding:0 0 0 12px;gap:0}
 .brand{font-size:1.05rem;gap:10px;margin-right:auto}
 .brand img.mark{height:44px;width:44px}
 .wa{height:64px;padding:0 18px;font-size:1rem}
 .menu{display:flex;align-items:center;justify-content:center}
 nav{display:none;order:5;width:100%;padding:0;overflow:visible;background:#fff;border-top:1px solid var(--line)}
 nav.open{display:block}
 nav ul{flex-direction:column;gap:0;white-space:normal}
 nav li a{display:block;padding:15px 16px;border-bottom:1px solid var(--line)}
 .desk{display:none}
 .cards{margin-bottom:56px}
 .gal.two{grid-template-columns:1fr 1fr;gap:14px}
 .gal figcaption{font-size:0;padding-top:8px}
 .gal figcaption b{font-size:1rem}
}

form label{color:#5f6b78;font-weight:400}
form input,form select,form textarea{border:1px solid #e1e6ec;border-radius:3px;padding:12px}
form .btn{width:100%;border-radius:2px}

@media (min-width:901px){
 .cgrid{grid-template-columns:1fr 1.1fr}
 details.row{display:grid;grid-template-columns:minmax(200px,1fr) 2fr;gap:24px;padding:22px 0}
 details.row summary{display:block;padding:0;cursor:default;pointer-events:none}
 details.row summary::after{content:none}
 details.row ul{padding:0}
}
@media (min-width:901px){details.row summary::after,details.row[open] summary::after{content:none}}

.clogo{margin-top:44px;padding-top:28px;border-top:1px solid rgba(255,255,255,.18);max-width:38ch}
.clogo img{width:88px;height:88px;margin-bottom:14px}
.clogo b{display:block;font:700 1.25rem var(--head);letter-spacing:.05em;color:var(--white)}
.clogo p{margin-top:6px;color:#cfe0ee;font-size:.98rem}
@media (max-width:900px){.clogo img{width:72px;height:72px}}

.clogo{text-align:center;margin-left:0;margin-right:auto}
.clogo img{display:block;margin:0 auto 14px}
.fbrand{text-align:center}
.fbrand img{display:block;margin:0 auto 12px;width:72px;height:72px}
.fbrand b{display:block;font:700 1.2rem var(--head);letter-spacing:.05em;color:var(--white)}
.fbrand p{margin-top:6px;max-width:34ch;margin-left:auto;margin-right:auto}

.svc{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:2px}
details.row .svc{margin:0 0 18px}
@media (min-width:901px){details.row{grid-template-columns:minmax(180px,1fr) 2fr 260px;align-items:start}details.row .svc{margin:0}}

@media (min-width:901px){details.row{grid-template-columns:220px minmax(0,1fr)}.rb{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:28px;align-items:start}details.row .svc{margin:0}}
