:root{
  --bg:#071425;
  --bg-elev:#0b1f3a;
  --primary:#1e88e5;
  --primary-600:#1e3a8a;
  --accent:#38bdf8;
  --success:#10b981;
  --text:#e6f1ff;
  --muted:#98a7c2;
  --glass: rgba(255,255,255,.06);
  --shadow: 0 10px 25px rgba(0,0,0,.25);
  --radius: 16px;
  --icon-blue: #7dd3fc;
  --icon-blue-strong: #38bdf8;
}
*{box-sizing:border-box}
html,body{height:100%;}
body{
  margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--text);
  background:radial-gradient(1200px 800px at 80% -10%, #0b274a 0%, var(--bg) 50%), linear-gradient(180deg, #04101f, var(--bg));
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none}

/* ====== NAVBAR ====== */
.nav-wrap{
  position:fixed; inset:0 auto auto 0; width:100%; z-index:40;
  backdrop-filter:saturate(140%) blur(8px);
  background:linear-gradient(180deg, rgba(7,20,37,.95), rgba(7,20,37,.6));
  border-bottom: none;
  box-shadow: var(--shadow);
}
.container{max-width:1200px; margin:0 auto; padding:0 20px}
.nav{display:flex; align-items:center; justify-content:space-between; height:72px}

.brand{display:flex; align-items:center; gap:12px; font-weight:700; letter-spacing:.3px}
.logo{
  width:36px; height:36px; border-radius:10px; position:relative;
  background: radial-gradient(120% 120% at 30% 20%, var(--accent) 0%, #2dd4bf 35%, #0ea5e9 60%, #0b274a 100%);
  box-shadow:0 0 0 2px rgba(255,255,255,.08), 0 8px 20px rgba(56,189,248,.35), inset 0 0 20px rgba(255,255,255,.25);
  overflow:hidden;
}
.logo::after{
  content:""; position:absolute; inset:-40%; transform:rotate(25deg);
  background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.7) 50%, rgba(255,255,255,0) 100%);
  animation: sweep 3.5s linear infinite;
  opacity:.6;
}
@keyframes sweep{0%{transform:translateX(-60%) rotate(25deg)} 100%{transform:translateX(60%) rotate(25deg)}}

.nav-links{display:flex; gap:8px; align-items:center}
.nav-links > a{border-top: none}

.nav-link{
  position:relative; padding:10px 14px; border-radius:12px; font-weight:500; color:var(--text);
  transition:transform .18s ease, background .18s ease;
}
.nav-link:hover{background:var(--glass); transform:translateY(-1px)}
.nav-link::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background: conic-gradient(from 180deg at 50% 50%, rgba(56,189,248,0) 0%, rgba(56,189,248,.55) 12%, rgba(16,185,129,.6) 18%, rgba(56,189,248,0) 25%);
  filter: blur(10px); opacity:0; transition:opacity .25s ease;
  mask: radial-gradient(120% 120% at 50% 50%, black 35%, transparent 60%);
}
.nav-link:hover::before{opacity:1}

.btn-cta{
  position:relative; padding:10px 16px; border-radius:14px; font-weight:700; letter-spacing:.2px; background:linear-gradient(180deg, var(--primary), var(--primary-600));
  box-shadow:0 6px 20px rgba(30,136,229,.35), inset 0 0 0 1px rgba(255,255,255,.14);
}
.btn-cta:hover{filter:saturate(110%)}
.btn-cta::after{
  content:""; position:absolute; inset:-2px; border-radius:inherit; pointer-events:none;
  background: radial-gradient(120% 120% at 0% 0%, rgba(255,255,255,.6), rgba(255,255,255,0) 60%);
  mix-blend-mode:overlay; opacity:.35; animation:glow 2.4s ease-in-out infinite alternate;
}
@keyframes glow{from{opacity:.15} to{opacity:.45}}

.burger{display:none; background:none; border:0; color:var(--text); font-size:28px}

/* ====== HERO ====== */
.hero{position:relative; min-height:84vh; display:grid; place-items:center; padding-top:72px;}
.hero video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:brightness(.55) saturate(1.1);}
.hero::after{content:""; position:absolute; inset:0; pointer-events:none;}
.hero-content{position:relative; z-index:1; max-width:1100px; margin-inline:auto; padding:24px; text-align:center}
.eyebrow{display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; font-size:14px; color:#d7fbea; background:rgba(16,185,129,.15); border:1px solid rgba(16,185,129,.35)}
.hero h1{font-size: clamp(36px, 5vw, 64px); line-height:1.05; margin:18px 0 14px}
.hero p{font-size: clamp(16px, 2.2vw, 20px); color:var(--muted); margin:0 auto 26px; max-width:800px}

.cta-row{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}
.btn{
  position:relative; display:inline-flex; align-items:center; gap:8px; padding:12px 18px; border-radius:14px; font-weight:700; cursor:pointer;
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.08);
  transition: transform .18s ease, background .18s ease;
}
.btn:hover{transform:translateY(-1px); background:rgba(255,255,255,.12)}
.btn .pulse{position:absolute; inset:-2px; border-radius:inherit; background: radial-gradient(60% 60% at 50% 50%, rgba(56,189,248,.16), transparent 60%); filter:blur(10px); opacity:0; transition:opacity .25s}
.btn:hover .pulse{opacity:1}
.btn.primary{background:linear-gradient(180deg, var(--primary), var(--primary-600)); border-color:rgba(255,255,255,.18)}
.btn.primary .icon{width:18px; height:18px; background: conic-gradient(from 0deg, #fff, #b3e5fc, #fff); border-radius:50%}

/* ====== SECCIÓN DE VALORES ====== */
.values{padding:56px 20px; background:linear-gradient(180deg, rgba(11,31,58,.6), rgba(11,31,58,0));}
.grid{display:grid; grid-template-columns: repeat(3, 1fr); gap:18px; max-width:1100px; margin:0 auto}
.cardn{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); position:relative; overflow:hidden}
.cardn h3{margin:6px 0 8px}
.cardn p{margin:0; color:var(--muted)}
.cardn::after{
  content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background: radial-gradient(120% 120% at 0% 0%, rgba(56,189,248,.25), rgba(56,189,248,0) 60%);
  mix-blend-mode:overlay; opacity:.25;
}

/* ====== FOOTER ====== */
footer{padding:40px 20px; border-top:1px solid rgba(255,255,255,.06); color:var(--muted)}

/* ====== SERVICES ====== */
.services{
  --card-bg: rgba(255,255,255,.06);
  --card-br: 1px solid rgba(255,255,255,.12);
  --accent: #38bdf8;
  --safe: #10b981;
  padding: 56px 20px;
  background: linear-gradient(180deg, rgba(11,31,58,.35), rgba(11,31,58,0));
}
.services__container{max-width:1100px; margin:0 auto}
.services__header{ text-align:center; margin-bottom:24px }
.services__header h2{ font-size: clamp(28px, 4vw, 42px); margin:0 0 10px }
.services__subtitle{ color:#c7d2fe; opacity:.9; margin:0 auto 16px; max-width:820px }
.services__cta{
  display:inline-block; padding:10px 16px; border-radius:14px; font-weight:700;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg, #1e88e5, #1e3a8a);
  box-shadow:0 8px 20px rgba(56,189,248,.25);
}
.services__grid{
  margin-top:24px;
  display:grid; gap:16px;
  grid-template-columns: repeat(4, minmax(0,1fr));
}

/* VISIBLES por defecto (antes tenían opacity:0/transform) */
.card{
  position:relative; overflow:hidden;
  background:var(--card-bg); border:var(--card-br); border-radius:16px;
  padding:18px; min-height:160px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
  will-change: transform, box-shadow;
  opacity:1; transform:none;
}
.card.reveal{ transition:.45s ease }
.card:hover{ transform: translateY(-4px); box-shadow: 0 14px 30px rgba(0,0,0,.25); background:rgba(255,255,255,.08) }
.card__glow{
  position:absolute; inset:-40% -60%; pointer-events:none; opacity:.0;
  background:
    radial-gradient(40% 40% at 20% 20%, rgba(56,189,248,.35), transparent 60%),
    radial-gradient(40% 40% at 80% 0%, rgba(16,185,129,.28), transparent 60%);
  filter: blur(20px);
  transition: opacity .25s ease;
}
.card:hover .card__glow{ opacity:.7 }
.card__icon{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center; margin-bottom:10px;
  background: radial-gradient(120% 120% at 30% 20%, var(--accent), #2dd4bf 50%, #0ea5e9 80%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 10px 20px rgba(56,189,248,.35);
  animation: float 6s ease-in-out infinite;
}
.card__icon svg{ width:24px; height:24px; fill:white; opacity:.95 }
@keyframes float{ 0%{transform:translateY(0)} 50%{transform:translateY(-4px)} 100%{transform:translateY(0)} }
.card h3{ margin:6px 0 6px; font-size:18px }
.card p{ margin:0; color:#c3cfec }
@media (max-width: 1024px){ .services__grid{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px){ .services__grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px){ .services__grid{ grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce){ .card, .card__icon{ animation: none !important; transition:none !important } }

/* ====== WHY ====== */
.why{
  --card-bg: rgba(255,255,255,.06);
  --card-br: 1px solid rgba(255,255,255,.12);
  --accent: #38bdf8;
  --safe:#10b981;
  padding:56px 20px;
  background:linear-gradient(180deg, rgba(11,31,58,.28), rgba(11,31,58,0));
}
.why__container{max-width:1100px; margin:0 auto}
.why__header{text-align:center; margin-bottom:24px}
.why__header h2{margin:0 0 10px; font-size:clamp(28px,4vw,42px)}
.why__subtitle{color:#cfe3ff; max-width:820px; margin:0 auto}
.why__grid{
  margin-top:24px;
  display:grid; gap:16px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}

/* VISIBLES por defecto */
.why-card{
  position:relative; overflow:hidden;
  background:var(--card-bg); border:var(--card-br); border-radius:16px;
  padding:18px; min-height:160px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
  opacity:1; transform:none;
}
.why-card.reveal{ transition:.45s ease }
.why-card:hover{ transform: translateY(-4px); box-shadow: 0 14px 30px rgba(0,0,0,.25); background:rgba(255,255,255,.08) }
.why-card__glow{
  position:absolute; inset:-40% -60%; pointer-events:none; opacity:.0;
  background:
    radial-gradient(40% 40% at 20% 20%, rgba(56,189,248,.35), transparent 60%),
    radial-gradient(40% 40% at 80% 0%, rgba(16,185,129,.28), transparent 60%);
  filter: blur(18px);
  transition: opacity .25s ease;
}
.why-card:hover .why-card__glow{ opacity:.7 }
.why-card__icon{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center; margin-bottom:10px;
  background: radial-gradient(120% 120% at 30% 20%, var(--accent), #2dd4bf 55%, #0ea5e9 85%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 10px 20px rgba(56,189,248,.35);
  animation: float 6s ease-in-out infinite;
}
.why-card__icon svg{ width:24px; height:24px; fill:white }
.why-card h3{margin:6px 0 6px; font-size:18px}
.why-card p{margin:0; color:#c3cfec}
@media (max-width: 960px){
  .why__grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .why__grid{ grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce){
  .why-card, .why-card__icon{ animation:none !important; transition:none !important }
}

/* ====== GALLERY 3D ====== */
.gallery3d{
  --card-w: 320px;
  --card-h: 220px;
  --gap-x: 180px;
  --rot:  -35deg;
  --z-lift: 180px;
  --dur: .45s;
  padding: 56px 20px;
}
.gallery3d__wrap{max-width:1200px; margin:0 auto}
.gallery3d__header{ text-align:center; margin-bottom:22px }
.gallery3d__header h2{ font-size: clamp(28px, 4vw, 42px); margin:0 0 6px }
.gallery3d__header p{ color:#c8d4ee; margin:0 }

.gallery3d__stage{ position:relative; perspective: 1200px; isolation:isolate; }
.gallery3d__track{
  position:relative;
  height: calc(var(--card-h) + 40px);
  display:grid;
  place-items:center;
  transform-style: preserve-3d;
  pointer-events: none;
}

.gallery3d__nav{
  position:absolute; top:50%;
  transform: translateZ(999px) translateY(-50%);
  width:44px; height:44px; border-radius:12px; border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.08); color:#fff; font-size:24px; line-height:1;
  display:grid; place-items:center; cursor:pointer;
  transition:background .2s ease, transform .2s ease;
  z-index:9999; pointer-events:auto;
}
.gallery3d__nav:hover{ background:rgba(255,255,255,.12); transform: translateZ(999px) translateY(-50%) scale(1.04) }
.gallery3d__nav.prev{ left:-6px }
.gallery3d__nav.next{ right:-6px }

.gallery3d .card{
  position:absolute;
  width:var(--card-w); height:var(--card-h);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius:18px; overflow:hidden;
  box-shadow:0 14px 30px rgba(0,0,0,.25);
  transform-style: preserve-3d;
  transition: transform var(--dur) ease, filter var(--dur) ease, opacity var(--dur) ease, box-shadow var(--dur) ease;
  will-change: transform, filter;
  cursor:pointer; pointer-events:auto;
}
.gallery3d .card:focus-visible{ outline:2px solid #38bdf8; outline-offset:3px }
.gallery3d .card img{ width:100%; height:100%; object-fit:cover; transform: translateZ(0); }
.gallery3d .card figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:10px 14px;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(6,18,35,.75) 60%, rgba(6,18,35,.9) 100%);
  color:#e8f0ff; font-size:14px;
  transform: translateZ(40px);
  opacity:.0; transition: opacity .25s ease;
}
.gallery3d .card h3{ margin:0 0 6px; font-size:16px }
.gallery3d .card ul{ margin:0; padding-left:16px; display:grid; gap:2px }
.gallery3d .card:hover figcaption{ opacity:1 }
.gallery3d .card[data-pos="0"]{
  transform: translateX(0) translateZ(var(--z-lift)) rotateY(0deg) scale(1.02);
  z-index: 50; filter:none;
}
.gallery3d .card:not([data-pos="0"]){ filter: saturate(.85) brightness(.9) }

/* Bottom controls for gallery */
.gallery3d__bottom{
  margin-top: 16px; display:flex; justify-content:center; gap:12px;
}
.g3d-btn{
  width:44px; height:44px; border-radius:12px; border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg, var(--primary), var(--primary-600));
  color:#fff; font-size:22px; line-height:1; display:grid; place-items:center; cursor:pointer;
  box-shadow:0 8px 20px rgba(56,189,248,.25);
  transition: transform .18s ease, filter .18s ease, background .18s ease;
}
.g3d-btn:hover{ transform:translateY(-1px); filter:saturate(110%) }
.g3d-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }

@media (max-width: 1024px){ .gallery3d{ --gap-x: 150px; --card-w: 300px; --card-h: 205px; } }
@media (max-width: 850px){
  .gallery3d{ --gap-x: 130px; --card-w: 280px; --card-h: 190px; }
  .gallery3d__nav.prev{ left:0 } .gallery3d__nav.next{ right:0 }
}
@media (max-width: 640px){
  .gallery3d{ --gap-x: 105px; --card-w: 250px; --card-h: 180px; }
  .gallery3d .card figcaption{ opacity:1 }
}
@media (max-width: 420px){ .gallery3d{ --gap-x: 90px; --card-w: 220px; --card-h: 160px; } }
@media (prefers-reduced-motion: reduce){ .gallery3d .card, .gallery3d__nav{ transition:none !important } }

/* ====== LIGHTBOX (único) ====== */
.lightbox[hidden]{ display:none !important; }
.lightbox{
  position:fixed; inset:0; z-index:10000; display:grid; place-items:center;
}
.lb-backdrop{
  position:absolute; inset:0; background:rgba(6,18,35,.85); backdrop-filter: blur(4px);
}
.lb-figure{
  position:relative; z-index:1; max-width:min(1100px, 94vw); max-height:88vh;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
  border-radius:18px; box-shadow:0 20px 50px rgba(0,0,0,.45); overflow:hidden;
  display:flex; flex-direction:column;
}
.lb-img{ max-width:100%; max-height:78vh; object-fit:contain; background:#000; }
.lb-cap{
  padding:10px 14px; font-size:14px; color:#e8f0ff;
  background:linear-gradient(180deg, rgba(0,0,0,.0), rgba(6,18,35,.75));
}
.lb-btn{
  position:absolute; z-index:2; width:44px; height:44px; border-radius:12px;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg, var(--primary), var(--primary-600));
  color:#fff; font-size:24px; line-height:1; display:grid; place-items:center; cursor:pointer;
  box-shadow:0 8px 20px rgba(56,189,248,.25);
}
.lb-close{ top:14px; right:14px; font-size:22px }
.lb-prev{ left:14px; top:50%; transform:translateY(-50%) }
.lb-next{ right:14px; top:50%; transform:translateY(-50%) }
.lb-btn:hover{ transform:translateY(-1px) }
.lb-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }

/* ====== TESTIMONIOS ====== */
.testimonials{
  padding:56px 20px;
  background: linear-gradient(180deg, rgba(11,31,58,.25), rgba(11,31,58,0));
}
.testimonials__wrap{max-width:1100px; margin:0 auto}
.testimonials__header{text-align:center; margin-bottom:22px}
.testimonials__header h2{margin:0 0 8px; font-size:clamp(28px,4vw,42px)}
.testimonials__subtitle{color:#cfe3ff; opacity:.9; margin:0}

.t-carousel{--t-gap:0px}
.t-viewport{ overflow:hidden; border-radius:var(--radius); }
.t-track{
  display:flex; gap:var(--t-gap);
  will-change:transform;
  transition: transform .45s ease;
  padding:0;
}

/* VISIBLES por defecto */
.t-card{
  flex:0 0 100%;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:18px;
  min-height:220px;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  opacity:1; transform:none;
}
.t-card.reveal{ transition:.45s ease }
.t-card__head{ display:flex; align-items:center; gap:12px; margin-bottom:8px; justify-content:center; text-align:center; }
.t-avatar{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center; font-weight:800;
  background: radial-gradient(120% 120% at 30% 20%, var(--accent), #2dd4bf 50%, #0ea5e9 80%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 10px 20px rgba(56,189,248,.35);
  color:#06233f;
}
.t-name{ margin:0; font-size:16px }
.t-role{ margin:0; color:#c3cfec; font-size:14px }
.t-stars{
  display:inline-flex; gap:4px; margin:6px 0 10px;
  filter: drop-shadow(0 2px 6px rgba(251,191,36,.35));
}
.t-stars svg{ width:18px; height:18px; fill:#fbbf24 }
.t-quote{ margin:0; color:#e6f1ff; max-width:760px; text-align:center; }

.t-nav{ margin-top:14px; display:flex; flex-direction:column; align-items:center; gap:10px; }
.t-arrows{ display:flex; gap:12px; }
.t-btn{
  width:44px; height:44px; border-radius:12px; border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg, var(--primary), var(--primary-600));
  color:#fff; font-size:22px; line-height:1; display:grid; place-items:center; cursor:pointer;
  box-shadow:0 8px 20px rgba(56,189,248,.25);
  transition: transform .18s ease, filter .18s ease, background .18s ease;
}
.t-btn:hover{ transform:translateY(-1px); filter:saturate(110%) }
.t-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }
.t-more{
  display:inline-block; font-weight:700;
  padding:8px 14px; border-radius:12px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);
  box-shadow:var(--shadow); color:var(--text);
  transition:transform .18s ease, background .18s ease;
}
.t-more:hover{ background:rgba(255,255,255,.1); transform:translateY(-1px); }

@media (max-width: 560px){ .t-card{ padding:16px } .t-quote{ max-width:100%; } }
@media (prefers-reduced-motion: reduce){ .t-track, .t-card{ transition:none !important } }
.t-card:hover{ background:rgba(255,255,255,.08); }

/* ====== FOOTER ORDENADO ====== */
.site-footer{
  margin-top: 24px;
  background: linear-gradient(180deg, rgba(7,20,37,.95), rgba(7,20,37,.85));
  border-top:1px solid rgba(255,255,255,.08);
  color: var(--text);
}
.site-footer .container{max-width:1200px; margin:0 auto; padding:0 20px}

.footer-top{ padding:34px 0 16px; }
.footer-grid{
  display:grid; gap:18px;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
}

/* Marca del footer centrada con texto debajo */
.footer-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:10px;
}
.footer-logo{ width:160px; height:auto; object-fit:contain; display:block; filter: drop-shadow(0 6px 16px rgba(0,0,0,.25)); }
.footer-brand-name{ margin:0; font-size:clamp(18px, 2.2vw, 22px); line-height:1.2; }
.footer-brand-desc{ margin:0; color:#cfe3ff; max-width:32ch; font-size:.95rem; }

.footer-title{
  margin:0 0 10px; font-size:14px; letter-spacing:.5px; text-transform:uppercase;
  color:#cfe3ff;
}
.footer-list{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.footer-list a{
  color:var(--text); opacity:.9;
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 0; border-radius:8px;
  transition:opacity .2s ease, transform .18s ease, background .18s ease;
}
.footer-list a:hover{ opacity:1; transform:translateY(-1px); background:rgba(255,255,255,.06); padding-left:8px; }
.footer-list a:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }

/* Contacto */
.f-contact li{display:flex; gap:10px; align-items:flex-start}
.f-contact svg{width:18px; height:18px; margin-top:4px; opacity:.85}

/* Social */
.social-list{ display:flex; gap:10px; flex-wrap:wrap; }
.social-btn{
  width:40px; height:40px; display:grid; place-items:center;
  border-radius:12px; border:1px solid rgba(255,255,255,.14);
  background:rgba(125, 211, 252, .06);
  color:var(--icon-blue);
  transition: transform .18s ease, background .18s ease, filter .18s ease;
  box-shadow: var(--shadow);
}
.social-btn:hover{ transform:translateY(-1px); background:rgba(125, 211, 252, .12); filter:none }
.social-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }
.social-btn svg{ width:20px; height:20px; fill:currentColor }

/* Íconos de contacto en azul */
.site-footer .f-contact svg{ fill: var(--icon-blue); color: var(--icon-blue); opacity:1; }

/* Legal bar */
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.08);
  padding:12px 0 18px; color:var(--muted); font-size:14px;
  display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.footer-legal{
  display:flex; gap:14px; flex-wrap:wrap;
}
.footer-legal a{ color:#cfe3ff; opacity:.9 }
.footer-legal a:hover{ opacity:1; text-decoration:underline }

@media (max-width: 960px){
  .footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px){
  .footer-grid{ grid-template-columns: 1fr; }
  .footer-bottom{ flex-direction:column; align-items:flex-start }
}

/* Utilidad accesible */
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ====== Barra de cookies ====== */
.cookiebar{
  position:fixed; inset:auto 0 0 0;
  background: linear-gradient(180deg, rgba(7,20,37,.98), rgba(7,20,37,.94));
  border-top:1px solid rgba(255,255,255,.1);
  color:var(--text);
  z-index:10000;
  box-shadow: 0 -10px 25px rgba(0,0,0,.25);
}
.cookiebar[hidden]{ display:none; }
.cookiebar__container{ max-width:1200px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.cookiebar__text{ line-height:1.35 }
.cookiebar__text strong{ display:block; margin-bottom:6px }
.cookiebar__text p{ margin:0; color:var(--muted) }
.cookiebar__text a{ color:#cfe3ff; text-decoration:underline }
.cookiebar__actions{ display:flex; gap:10px; flex-wrap:wrap }

.c-btn{
  padding:10px 14px; border-radius:12px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.08);
  color:var(--text); font-weight:700; cursor:pointer;
  transition: transform .18s ease, background .18s ease, filter .18s ease;
}
.c-btn:hover{ transform:translateY(-1px); background:rgba(255,255,255,.12) }
.c-btn.primary{
  background:linear-gradient(180deg, var(--primary), var(--primary-600));
  border-color:rgba(255,255,255,.18);
}
.c-btn.ghost{ background:transparent }

@media (max-width: 680px){
  .cookiebar__container{ flex-direction:column; align-items:flex-start }
  .cookiebar__actions{ width:100%; justify-content:flex-start }
}

/* Modal de preferencias */
.cc-modal{ position:fixed; inset:0; z-index:10001; }
.cc-modal[hidden]{ display:none }
.cc-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  backdrop-filter: blur(2px);
}
.cc-card{
  position:fixed; left:50%; bottom:0; transform:translateX(-50%);
  width:min(720px,94vw);
  background:var(--bg-elev);
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px 20px 0 0;
  box-shadow: var(--shadow);
  animation: cc-in .25s ease forwards;
}
@keyframes cc-in{ from{ transform:translate(-50%, 10px) } to{ transform:translate(-50%, 0) } }
.cc-card header{
  display:flex; align-items:center; justify-content:space-between;
  gap:8px; padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.08)
}
.cc-card h3{ margin:0; font-size:18px }
.cc-close{ background:none; border:0; font-size:24px; color:var(--text); cursor:pointer }
.cc-body{ padding:12px 16px; display:grid; gap:10px }
.cc-row{
  display:flex; align-items:flex-start; gap:10px;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08);
  padding:12px; border-radius:12px;
}
.cc-row p{ margin:.25rem 0 0; color:var(--muted) }
.cc-actions{ padding:12px 16px 16px; display:flex; justify-content:flex-end; gap:10px }

@media (prefers-reduced-motion: reduce){
  .cc-card{ animation:none !important }
  .c-btn, .cookiebar{ transition:none !important }
}

/* ====== FAB WhatsApp ====== */
.whatsapp-fab{
  position: fixed;
  right: 18px;
  bottom: calc(env(safe-area-inset-bottom, 0px) + 18px);
  width: 56px; height: 56px;
  border-radius: 16px;
  display: grid; place-items: center;
  z-index: 9998;
  color:#fff;
  background:
    radial-gradient(120% 120% at 30% 20%, #22c55e, #16a34a 50%, #0f7a39 85%);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 10px 25px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.08);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
.whatsapp-fab:hover{ transform: translateY(-2px) scale(1.03); filter: saturate(110%) }
.whatsapp-fab:focus-visible{ outline:2px solid var(--accent); outline-offset:3px }
.whatsapp-fab::after{
  content:""; position:absolute; inset:-2px; border-radius:inherit; pointer-events:none;
  background: radial-gradient(70% 70% at 30% 20%, rgba(255,255,255,.35), rgba(255,255,255,0) 60%);
  mix-blend-mode: overlay; opacity:.5;
}
.whatsapp-fab svg{ width:26px; height:26px; fill:#fff }
.whatsapp-fab__label{
  position: absolute; right: 64px; bottom: 8px;
  background: rgba(255,255,255,.08);
  color: var(--text);
  border:1px solid rgba(255,255,255,.16);
  padding:6px 10px; border-radius: 12px;
  font-weight:700; font-size: 13px;
  box-shadow: var(--shadow);
  display:none;
}
@media (min-width: 860px){
  .whatsapp-fab:hover .whatsapp-fab__label{ display:block }
}
body.with-cookiebar .whatsapp-fab{
  bottom: calc(env(safe-area-inset-bottom, 0px) + 96px);
}

/* ====== HERO con imagen ====== */
.hero--image{
  position:relative;
  min-height: clamp(320px, 60vh, 620px);
  display:grid; place-items:center;
  padding-top:72px;
  overflow:clip;
}
.hero--image > img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  filter: brightness(.6) saturate(1.05);
  transform: translateZ(0);
}
.hero--image::after{
  content:""; position:absolute; inset:0;
  background: radial-gradient(1200px 800px at 80% -10%, rgba(11,39,74,.6), transparent 45%),
              linear-gradient(180deg, rgba(4,16,31,.8), rgba(7,20,37,.3));
  pointer-events:none;
}
.hero--image .hero-content{ position:relative; z-index:1; text-align:center; padding:24px; }
.hero-title{ font-size: clamp(36px, 6vw, 72px); line-height:1.05; margin:0 0 8px; }
.hero-subtitle{ font-size: clamp(14px, 2.2vw, 18px); color: var(--muted); margin:0; }

/* ====== GALERÍA (grid) ====== */
.gallery{
  padding:56px 20px;
  background: linear-gradient(180deg, rgba(11,31,58,.35), rgba(11,31,58,0));
}
.gallery__container{ max-width:1100px; margin:0 auto; }
.gallery__header{ text-align:center; margin-bottom:20px; }
.gallery__header h2{ font-size: clamp(28px, 4vw, 42px); margin:0 0 8px; }
.gallery__subtitle{ color:#cfe3ff; opacity:.9; margin:0; }

.gallery__grid{
  margin-top:12px;
  display:grid; gap:10px;
  grid-template-columns: repeat(4, minmax(0,1fr));
}
.g-item{
  position:relative; overflow:hidden; border-radius:16px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow);
}
.g-item img{ width:100%; aspect-ratio: 16 / 9; object-fit:cover; display:block; transition: transform .35s ease, filter .35s ease; }
.g-item figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:8px 10px; font-size:13px; color:#e6f1ff;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(6,18,35,.8) 70%);
  opacity:.95;
}
.g-item:hover img{ transform: scale(1.04); filter: saturate(1.05) brightness(.98); }

@media (max-width: 1024px){ .gallery__grid{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px){ .gallery__grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px){ .gallery__grid{ grid-template-columns: 1fr; } }

/* ===== QUIÉNES SOMOS (split) ===== */
.about--split{ padding:56px 20px; background: linear-gradient(180deg, rgba(11,31,58,.25), rgba(11,31,58,0)); }
.about__grid{
  display:grid; gap:24px;
  grid-template-columns: 1.05fr 1fr; align-items:center;
  max-width:1100px; margin:0 auto;
}

/* VISIBLES por defecto */
.about__media img{
  width:100%; height:auto; display:block; border-radius:16px;
  box-shadow:0 12px 32px rgba(0,0,0,.35);
  transform:none; opacity:1;
  transition: transform .6s ease, opacity .6s ease;
}
.about__media.reveal img{ transform:none; opacity:1; }

.about__header{ margin:0 0 8px; }
.about__header h2{ margin:6px 0 0; font-size:clamp(28px,4vw,42px); }
.about__eyebrow{
  display:inline-block; padding:6px 12px; border-radius:999px; font-size:14px;
  color:#d7fbea; background:rgba(16,185,129,.15); border:1px solid rgba(16,185,129,.35);
}
.about__lead{ color:#c3cfec; margin:8px 0 18px; }

.about__cards{
  display:grid; gap:16px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}

/* VISIBLES por defecto */
.about-card{
  position:relative; overflow:hidden; isolation:isolate;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius:16px; padding:18px;
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
  transform:none; opacity:1;
  transition: transform .45s ease, box-shadow .45s ease, opacity .45s ease, background .3s ease;
}
.about-card.reveal{ transform:none; opacity:1; }
.about-card h3{ margin:0 0 8px; font-size:18px; }
.about-card__glow{
  content:""; position:absolute; inset:-50% -70%; pointer-events:none;
  background:
    radial-gradient(40% 40% at 20% 20%, rgba(56,189,248,.35), transparent 60%),
    radial-gradient(40% 40% at 80% 0%, rgba(16,185,129,.28), transparent 60%);
  filter: blur(22px); opacity:.0; transition: opacity .25s ease;
}
.about-card:hover .about-card__glow,
.about-card:focus-within .about-card__glow{ opacity:.7; }
.tilt-card:hover,
.tilt-card:focus-within{
  transform: translateY(-4px) scale(1.01) rotateX(0.5deg) rotateY(-0.6deg);
  box-shadow: 0 18px 36px rgba(0,0,0,.32);
  background: rgba(255,255,255,.08);
}
@keyframes riseIn { from{ transform: translateY(14px); opacity:0 } to{ transform: translateY(0); opacity:1 } }
.about-card.reveal{ animation: riseIn .6s ease both; }
.about-card.reveal:nth-child(2){ animation-delay:.08s }
@media (max-width: 920px){
  .about__grid{ grid-template-columns: 1fr; }
  .about__media{ order:-1 }
  .about__cards{ grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce){
  .about__media img, .about-card{ transition:none !important; animation:none !important; }
}

/* ===== Identidad visual para logo en marca ===== */
.brand { display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.brand-logo { width:90px; height:90px; display:block; object-fit:contain; }
.brand-text { font-weight:700; letter-spacing:.2px; }

/* ======== MENÚ MÓVIL (corregido y consistente con JS) ======== */
/* Estado base (desktop) */
#menu{
  display:flex;
  gap:14px;
}
.burger{ display:none; }

/* Móvil: solo este bloque controla el panel */
@media (max-width: 980px){
  .burger{
    display:inline-flex;
    align-items:center; justify-content:center;
    width:42px; height:42px;
    border:1px solid rgba(255,255,255,.2);
    border-radius:10px;
    background:rgba(255,255,255,.06);
    cursor:pointer;
    z-index:1001;
  }
  #menu{
    display:none;
    position:absolute;
    left:0; right:0;
    top:72px; /* coincide con .nav (72px) */
    background:rgba(5,16,32,.96);
    backdrop-filter: blur(8px);
    border-top:1px solid rgba(255,255,255,.1);
    padding:12px 16px;
    flex-direction:column;
    gap:8px;
    z-index:1000;
  }
  /* CLASE que activa el menú (tu JS usa .is-open) */
  #menu.is-open{ display:flex; }
  body.no-scroll{ overflow:hidden; }
  .nav.is-open{ position:relative; }
}

/* ===== Fix: Valores en móvil (stack 1 por fila) ===== */
@media (max-width: 960px){
  .values .grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .values .grid{ grid-template-columns: 1fr; }
}

/* ===== Fix: Galería 3D — posiciones y capas ===== */
.gallery3d__track{ pointer-events: none; } /* evita interacciones raras fuera de las cards */
.gallery3d .card{ pointer-events:auto; }   /* solo las cards reciben clic */


/* ===== Galería (móvil): ocultar caption y mostrar al hover/tap ===== */
@media (max-width: 768px){
  .gallery .g-item figcaption{
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .2s ease, transform .2s ease;
    pointer-events: none; /* no bloquea el tap a la imagen */
  }
  /* Mostrar cuando hay hover (si el dispositivo lo soporta), foco o clase JS */
  .gallery .g-item:hover figcaption,
  .gallery .g-item:focus-within figcaption,
  .gallery .g-item.show-cap figcaption{
    opacity: 1;
    transform: translateY(0);
  }
}

/* ===== HERO: video completo en móvil ===== */
@media (max-width: 768px){
  /* Deja de usar grid centrado forzado para que el video fluya arriba */
  .hero{
    display: block;
    min-height: auto;         /* Evita alturas forzadas que recortan */
    padding-top: 72px;        /* Respeta la barra fija */
  }

  /* El video ya no es absolute; que use su propia altura */
  .hero video{
    position: static;
    display: block;
    width: 100%;
    height: auto;             /* Toma la altura natural del video */
    aspect-ratio: 16 / 9;     /* Ayuda a reservar espacio y evitar saltos */
    object-fit: contain;      /* Muestra el video completo */
    filter: none;             /* (Opcional) quita el oscurecido en móvil */
    background: #000;         /* “letterbox” agradable cuando haga falta */
  }

  /* Si tu overlay oscurece de más, desactívalo en móvil */
  .hero::after{
    display: none;
  }

  /* Ajusta el bloque de contenido para que quede debajo del video */
  .hero-content{
    position: static;
    z-index: auto;
    max-width: 900px;
    margin: 12px auto 0;
    padding: 16px 20px;
    text-align: center;
  }
}
/* ==== HERO: que el texto nunca quede oculto ==== */

/* Desktop / tablet */
.hero {
  position: relative;         /* asegura contexto para z-index */
  padding-top: 72px;          /* despeje por la navbar fija */
}
.hero video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;                 /* video al fondo */
}
.hero::after {
  z-index: 1;                 /* overlay detrás del texto */
}
.hero-content {
  position: relative;
  z-index: 2;                 /* SIEMPRE arriba del video y overlay */
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 20px;
  text-align: center;
}

/* Extra legibilidad del texto sobre video (opcional, sutil) */
.hero-content::before {
  content: "";
  position: absolute;
  inset: -12px;               /* halo alrededor del bloque */
  border-radius: 16px;
  background: radial-gradient(60% 60% at 50% 50%, rgba(6,18,35,.28), transparent 70%);
  z-index: -1;                /* detrás del texto, delante del video */
  pointer-events: none;
}

/* Móvil: video completo y texto siempre visible debajo */
@media (max-width: 768px){
  .hero {
    display: block;
    min-height: auto;         /* evita alturas forzadas que cortan contenido */
  }
  .hero video {
    position: static;         /* saca el video del apilado absoluto */
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;     /* reserva espacio, evita saltos */
    object-fit: contain;      /* se ve completo sin recortes */
    z-index: 0;
    filter: none;             /* opcional: sin oscurecer en móvil */
    background: #000;
  }
  .hero::after{
    display: none;            /* evita cubrir el texto en móvil */
  }
  .hero-content{
    position: relative;       /* texto fluye debajo del video */
    z-index: 1;
    margin-top: 12px;
    padding: 16px 20px;
    text-align: center;
  }
}
/* === FIX: texto del HERO por encima del video (mobile & desktop) === */
.hero{
  position: relative !important;
  isolation: isolate;                 /* crea stacking-context propio */
  padding-top: 72px;                  /* despeje por navbar fija */
}

.hero video{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;                  /* o 'contain' si no quieres recortes */
  z-index: 0 !important;              /* video al fondo */
  pointer-events: none !important;    /* no bloquear clics/tab del contenido */
}

.hero::after{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;              /* overlay entre video y texto */
  pointer-events: none !important;
  /* si tienes un gradiente/velo, déjalo aquí; si oscurece demasiado, quítalo */
}

.hero .hero-content{
  position: relative !important;
  z-index: 2 !important;              /* SIEMPRE por encima */
}

/* Ajustes específicos para móvil */
@media (max-width: 768px){
  .hero{
    min-height: 72vh;                 /* asegura alto cómodo en móvil */
    display: block !important;
  }
  .hero::after{
    /* opcional: suaviza overlay en móvil para lectura */
    background: linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.35));
  }
  .hero .hero-content{
    padding: 16px 20px;
    text-align: center;
  }
}
/* === HERO: video completo en móviles (sin recortes) === */
@media (max-width: 768px){
  .hero{
    /* Ocupa la altura útil; el video se pinta dentro del área con padding-top */
    min-height: 100svh;              /* usa svh para barras móviles */
    padding-top: 72px;               /* despeje por navbar fija */
    position: relative;
    isolation: isolate;
  }

  .hero video{
    position: absolute;
    inset: 0;                        /* respeta el padding-top del .hero */
    width: 100%;
    height: 100%;
    object-fit: contain;             /* << clave para que se vea completo */
    background: #000;                /* “letterbox” elegante si sobra espacio */
    z-index: 0;
    pointer-events: none;
  }

  .hero .hero-content{
    position: relative;
    z-index: 2;                      /* texto SIEMPRE encima */
    padding: 16px 20px;
    text-align: center;
  }
}

/* Si quieres que en landscape móvil también se mantenga completo: */
@media (max-width: 900px) and (orientation: landscape){
  .hero{ min-height: 100svh; }
  .hero video{ object-fit: contain; }
}

/* === Extraído de index.html === */
/* Asegura layout base para que el contenido NO quede tapado */
    .nav-wrap{position:fixed; inset:0 auto auto 0; width:100%; z-index:40;}
    .nav{display:flex; align-items:center; justify-content:space-between; height:72px}
    .hero, .hero--image{padding-top:72px;} /* empuja el contenido bajo la navbar fija */

    /* Estado base (desktop) del menú */
    #menu.nav-links{display:flex; align-items:center; gap:8px;}

    /* Burger oculto por defecto en desktop */
    .burger{display:none;}

    /* Móvil: menú oculto por defecto; visible SOLO con .open */
    @media (max-width: 980px){
      .burger{
        display:inline-flex; align-items:center; justify-content:center;
        width:42px; height:42px; border:1px solid rgba(255,255,255,.2);
        border-radius:10px; background:rgba(255,255,255,.06); cursor:pointer; z-index:1001;
      }
      #menu.nav-links{
        display:none; position:absolute; left:0; right:0; top:72px;
        background:rgba(5,16,32,.96); backdrop-filter: blur(8px);
        border-top:1px solid rgba(255,255,255,.1); padding:12px 16px;
        flex-direction:column; gap:6px; z-index:1000;
      }
      #menu.nav-links.open{ display:flex; }
      body.no-scroll{ overflow:hidden; }
    }

/* === Extraído de galeria.html === */
.gallery__container{max-width:1100px;margin:0 auto;padding:0 16px;}
    .gallery__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
    @media (max-width:980px){.gallery__grid{grid-template-columns:repeat(2,1fr);}}
    @media (max-width:520px){.gallery__grid{grid-template-columns:1fr;}}
    .g-item{margin:0;border-radius:10px;overflow:hidden;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);aspect-ratio:16/9;display:grid;}
    .g-item img{width:100%;height:100%;object-fit:cover;display:block;}
    .g-item figcaption{display:none;}

/* === Extraído de contacto.html === */
/* Estilos mínimos propios de esta página (lo demás vive en styles.css) */
    .contact-hero{
      position:relative; min-height:320px; display:grid; place-items:center;
      padding-top:72px; overflow:hidden;
      background: radial-gradient(1200px 800px at 80% -10%, #0b274a 0%, var(--bg, #071425) 50%), linear-gradient(180deg, #04101f, var(--bg, #071425));
      text-align:center;
    }
    .contact-hero h1{ font-size: clamp(32px,5vw,56px); margin:0 }
    .note{ color:#98a7c2 }
    .contact-wrap{ max-width:1100px; margin:24px auto 56px; padding:0 20px; }
    .contact-grid{ display:grid; gap:18px; grid-template-columns: 1.1fr 1fr; }
    .contact-card{
      background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
      border-radius:16px; box-shadow: var(--shadow, 0 10px 25px rgba(0,0,0,.25));
      padding:18px;
    }
    .contact-card h2{ margin:0 0 10px; font-size:22px }
    .contact-info{ display:grid; gap:10px; }
    .contact-info a{ color:#cfe3ff; text-decoration:underline }
    .map-embed{ width:100%; height:360px; border:0; border-radius:12px; }
    form .row{ display:grid; gap:12px; grid-template-columns: 1fr 1fr; }
    form .row-1{ display:grid; gap:12px; grid-template-columns: 1fr; }
    .f-group{ display:grid; gap:6px }
    .f-group label{ font-size:14px; color:#cfe3ff }
    .f-group input, .f-group select, .f-group textarea{
      padding:12px 12px; border-radius:12px; border:1px solid rgba(255,255,255,.14);
      background:rgba(255,255,255,.06); color:var(--text,#e6f1ff);
    }
    .f-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
    .f-actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:6px }
    .g-recaptcha{ transform: scale(1); transform-origin: 0 0; }
    @media (max-width: 980px){
      .contact-grid{ grid-template-columns: 1fr; }
    }


    /* ===== GALERÍA DE FLOTA ===== */
.fleet-gallery {
  padding: 80px 20px;
  background: var(--bg-alt, #061020);
  color: #fff;
  text-align: center;
}

.fleet-header h2 {
  font-size: 2rem;
  margin-bottom: 0.5em;
  color: var(--accent, #00aaff);
}

.fleet-header p {
  max-width: 680px;
  margin: 0 auto 2.5em;
  color: rgba(255,255,255,0.8);
}

.fleet-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
}

.fleet-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}

.fleet-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.25);
}

.fleet-card figure {
  margin: 0;
  background: #000;
}

.fleet-card img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.fleet-info {
  padding: 1.2rem 1.4rem 1.6rem;
  text-align: left;
}

.fleet-info h3 {
  font-size: 1.3rem;
  color: var(--accent, #00aaff);
  margin-bottom: .5em;
}

.fleet-info ul {
  list-style: none;
  padding: 0;
  margin: 0 0 1em;
  font-size: .95rem;
  color: rgba(255,255,255,0.9);
}

.fleet-info ul li {
  margin-bottom: .3em;
}

.fleet-info p {
  font-size: .95rem;
  color: rgba(255,255,255,0.85);
  line-height: 1.4;
}

/* Responsive */
@media (max-width: 600px) {
  .fleet-header h2 { font-size: 1.6rem; }
  .fleet-info h3 { font-size: 1.1rem; }
}