:root {
  --primary: #0D2F5F;
  --accent: #FFCC00;
  --light: #F5F8FF;
  --dark: #0B1B36;
}
* {box-sizing: border-box;}
html,body {
  margin:0; padding:0; font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; 
  color: var(--dark); background: white;
  scroll-behavior: smooth;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
.container { width: min(1100px, 92%); margin: 0 auto; }

header.navbar {
  position: sticky; top:0; z-index: 1000; background: rgba(255,255,255,.9); backdrop-filter: blur(6px);
  border-bottom: 1px solid #e6e9f2;
}
.header-inner { display:flex; align-items:center; justify-content:space-between; padding: .8rem 0; gap: 1rem; }
.brand { display:flex; align-items:center; gap:.6rem; font-weight: 800; letter-spacing:.3px; color: var(--primary); }
.brand img { width:38px; height:38px; border-radius:.4rem; }
.navlinks a { margin-left: 1rem; font-weight:600; }
.navlinks a.btn { padding:.6rem .9rem; background: var(--primary); color:white; border-radius:.6rem; }
.nav-toggle { display:none; cursor:pointer; font-size:1.6rem; }

@media (max-width: 880px){
  .navlinks { display:none; position:absolute; top:64px; right:0; left:0; background:white; padding:1rem; border-bottom:1px solid #e6e9f2; }
  .navlinks a { display:block; margin:.6rem 0; }
  .nav-toggle { display:block; }
  header.navbar.stuck .navlinks { top:56px; }
}

.hero {
  background: radial-gradient( circle at 20% 20%, rgba(13,47,95,.12), transparent 40%) , url('assets/hero.jpg') center/cover no-repeat;
  color: white; position:relative;
}
.hero::after { content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55)); }
.hero .content { position:relative; z-index: 1; padding: 96px 0 72px; }
.hero h1 { font-size: clamp(1.8rem, 3.2vw + 1rem, 3.2rem); margin:0 0 .6rem; line-height:1.1; }
.hero p.lead { font-size: clamp(1rem, .7vw + .8rem, 1.2rem); max-width: 680px; opacity:.95; }
.hero .cta { display:flex; gap:.8rem; margin-top:1.2rem; flex-wrap: wrap; }
.btn-pill { padding:.8rem 1rem; border-radius: 999px; font-weight:700; border:2px solid transparent; }
.btn-primary { background: var(--accent); color: #111; }
.btn-outline { background: transparent; border-color: white; color: white; }

.section { padding: 64px 0; }
.section .title { font-size: clamp(1.4rem, 2.2vw + .6rem, 2.2rem); margin:0 0 .8rem; color: var(--primary); }
.subtitle { color:#334; opacity:.9; margin-top:-.2rem; }

.cards { display:grid; grid-template-columns: repeat(12, 1fr); gap: 18px; }
.card { grid-column: span 4; border:1px solid #e6e9f2; border-radius: 16px; overflow: hidden; background:white; box-shadow: 0 6px 20px rgba(13,47,95,.06); }
.card img { width:100%; height: 180px; object-fit: cover; }
.card .p { padding: 14px 16px 18px; }
.card h3 { margin: 0 0 .3rem; font-size:1.12rem; }
.card p { margin:0; color:#475569; font-size:.98rem; }
@media (max-width: 980px){
  .card { grid-column: span 6; }
}
@media (max-width: 620px){
  .card { grid-column: span 12; }
  .card img { height: 160px; }
}

.grid-2 { display:grid; grid-template-columns: 1.2fr 1fr; gap: 28px; align-items: center; }
@media (max-width: 900px){ .grid-2 { grid-template-columns: 1fr; } }

.feature-list { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px 18px; margin-top: 10px; }
.feature-list li { list-style: '✓  '; padding-left:.3rem; color:#334; }
.badge { display:inline-block; padding:.28rem .56rem; border-radius:999px; background: #EAF2FF; color: var(--primary); font-weight: 700; font-size: .75rem; letter-spacing:.3px; }

.embed { border:0; width:100%; height:420px; border-radius: 12px; box-shadow: 0 8px 26px rgba(13,47,95,.08); }

.gallery { display:grid; grid-template-columns: repeat(12,1fr); gap:10px; }
.gallery img { border-radius: 12px; width:100%; height: 220px; object-fit: cover; }
.gallery .span-6 { grid-column: span 6; }
.gallery .span-4 { grid-column: span 4; }
.gallery .span-8 { grid-column: span 8; }
@media (max-width: 800px){
  .gallery { grid-template-columns: repeat(6,1fr); }
  .gallery img { height: 160px; }
  .gallery .span-6 { grid-column: span 6; }
  .gallery .span-8 { grid-column: span 6; }
  .gallery .span-4 { grid-column: span 6; }
}

.contact { background: var(--light); border-top:1px solid #e6e9f2; }
form { display:grid; gap:.8rem; }
input, textarea, select { padding: .9rem 1rem; border: 1px solid #d7dce8; border-radius: 12px; font: inherit; }
input:focus, textarea:focus { outline: 2px solid rgba(13,47,95,.20); border-color: var(--primary); }
button.btn-submit { padding: .9rem 1rem; border:none; background: var(--primary); color: white; font-weight: 800; border-radius: 12px; cursor:pointer; }
.small { font-size:.9rem; color:#64748b; }

.whatsapp-float {
  position: fixed; right: 16px; bottom: 16px; z-index: 1001;
  width: 58px; height: 58px; border-radius: 50%; background: #25D366; display:flex; align-items:center; justify-content:center;
  color:white; font-size: 28px; box-shadow: 0 14px 26px rgba(0,0,0,.2);
}

footer { padding: 28px 0; color:#6b7280; font-size:.95rem; border-top:1px solid #e6e9f2; }
footer a { color: var(--primary); font-weight:700; }