:root{
  --bg:#f6f8fc; --white:#fff; --text:#243246; --muted:#63748a; --line:rgba(61,114,171,.14);
  --primary:#3e87cf; --primary-2:#8bb8ee; --deep:#1f5b97; --shadow:0 18px 60px rgba(40,84,130,.15);
  --radius:26px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{
  margin:0; font-family:"Montserrat",sans-serif; color:var(--text);
  background:radial-gradient(circle at top right, rgba(139,184,238,.18), transparent 30%), linear-gradient(180deg,#fbfcff 0%, #f5f8fd 60%, #eef4fb 100%);
}
img{max-width:100%;display:block} a{text-decoration:none;color:inherit} button{font:inherit}
.container{width:min(1180px, calc(100% - 32px)); margin:0 auto}
.section{padding:88px 0} .alt{background:linear-gradient(180deg, rgba(139,184,238,.08), rgba(62,135,207,.03))}
.section-head{max-width:760px; margin:0 auto 34px; text-align:center}
.section-kicker{display:inline-block; margin-bottom:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--deep); font-size:.78rem; font-weight:700}
.section-head h2,.contact-info h2,.intro-card h2,.video-grid h2{margin:0 0 12px; font-family:"Cormorant Garamond", serif; font-size:clamp(2rem, 4vw, 3.3rem); line-height:1; font-weight:700}
.section-head p,.contact-info p,.video-grid p,.intro-card p{color:var(--muted); line-height:1.8}
.topbar{background:linear-gradient(90deg, var(--deep), #4b90d5); color:#eff7ff; font-size:.8rem}
.topbar-inner{padding:10px 0; display:flex; gap:18px; justify-content:space-between; flex-wrap:wrap}
.header{position:sticky; top:0; z-index:50; backdrop-filter:blur(16px); background:rgba(255,255,255,.72); border-bottom:1px solid rgba(80,122,169,.12)}
.nav{display:flex; align-items:center; justify-content:space-between; gap:24px; padding:14px 0}
.brand{display:flex; align-items:center; gap:14px; min-width:0}
.brand img{width:66px; height:66px; object-fit:cover; border-radius:18px; box-shadow:var(--shadow); background:#fff}
.brand-text{display:flex; flex-direction:column; min-width:0}
.brand-text strong{font-size:1rem} .brand-text span{font-size:.82rem; color:var(--muted)}
.menu{display:flex; gap:26px; align-items:center}
.menu a{color:#31455f; font-weight:600; position:relative}
.menu a::after{content:""; position:absolute; left:0; bottom:-7px; width:0; height:2px; background:var(--primary); transition:.25s}
.menu a:hover::after{width:100%}
.menu-toggle{display:none; border:0; background:#eef4fb; color:var(--deep); width:46px; height:46px; border-radius:14px; cursor:pointer}
.hero{position:relative; min-height:88svh; display:grid; place-items:center; overflow:hidden}
.hero-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center}
.hero-overlay{position:absolute; inset:0; background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(16,65,112,.36)), linear-gradient(90deg, rgba(13,63,115,.28), rgba(20,81,142,.16))}
.hero-content{position:relative; z-index:2; text-align:center; color:#fff; padding:100px 0 70px; max-width:950px}
.eyebrow{display:inline-block; padding:10px 16px; border-radius:999px; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.24); backdrop-filter:blur(8px); margin-bottom:18px; font-weight:600}
.hero h1{margin:0 0 18px; font-family:"Cormorant Garamond", serif; font-size:clamp(2.8rem, 7vw, 5.8rem); line-height:.95; text-shadow:0 8px 30px rgba(4,30,56,.2)}
.hero-text{margin:0 auto 22px; max-width:780px; font-size:clamp(1rem, 2vw, 1.35rem); line-height:1.8; text-shadow:0 2px 12px rgba(0,0,0,.22)}
.hero-badges{display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin:26px 0 30px}
.hero-badges span{padding:12px 18px; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.2); border-radius:999px; backdrop-filter:blur(10px); font-weight:600}
.hero-actions{display:flex; justify-content:center; gap:14px; flex-wrap:wrap}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-width:180px; padding:15px 24px; border-radius:999px; font-weight:700; transition:transform .2s ease, box-shadow .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary{color:#fff; background:linear-gradient(135deg, var(--deep), var(--primary)); box-shadow:0 18px 40px rgba(31,91,151,.28)}
.btn-whatsapp{color:#fff; background:linear-gradient(135deg, #0fbf66, #2ad672); box-shadow:0 18px 40px rgba(13,145,70,.2)}
.btn-full{width:100%; border:none; cursor:pointer}
.intro{margin-top:-40px; position:relative; z-index:3}
.intro-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:24px}
.intro-card{background:rgba(255,255,255,.86); border:1px solid rgba(129,166,210,.18); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow)}
.glass{background:linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,.58)); backdrop-filter:blur(12px)}
.check-list{list-style:none; margin:0; padding:0; display:grid; gap:16px}
.check-list li{position:relative; padding-left:34px; color:#41536a}
.check-list li::before{content:"✓"; position:absolute; left:0; top:-2px; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; background:#e8f2fd; color:var(--deep); font-weight:700}
.cards{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:24px}
.service-card{background:#fff; border:1px solid rgba(129,166,210,.18); border-radius:24px; overflow:hidden; box-shadow:var(--shadow); transition:transform .25s ease}
.service-card:hover{transform:translateY(-6px)}
.service-card img{width:100%; aspect-ratio:1/1; object-fit:cover}
.service-body{padding:22px}
.service-body h3{margin:0 0 10px; font-size:1.08rem} .service-body p{margin:0; color:var(--muted); line-height:1.7}
.promo-strip{display:flex; flex-wrap:wrap; justify-content:center; gap:14px}
.promo-chip{padding:14px 18px; border-radius:999px; background:#fff; border:1px solid var(--line); color:var(--deep); box-shadow:var(--shadow); font-weight:600}
.gallery{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:18px}
.gallery-item{border:0; padding:0; background:#fff; border-radius:22px; overflow:hidden; cursor:pointer; box-shadow:var(--shadow); transition:transform .25s ease}
.gallery-item:hover{transform:translateY(-6px)}
.gallery-item img{width:100%; aspect-ratio:1/1; object-fit:cover}
.video-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:30px; align-items:center}
.video-card{background:#fff; border:1px solid rgba(129,166,210,.18); border-radius:28px; padding:18px; box-shadow:var(--shadow)}
.video-wrap{position:relative; width:100%; padding-top:56.25%; overflow:hidden; border-radius:20px}
.video-wrap iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.social-links{display:flex; gap:12px; flex-wrap:wrap; margin-top:20px}
.social-links a{padding:12px 16px; border-radius:999px; background:#fff; border:1px solid var(--line); color:var(--deep); font-weight:600}
.contact-grid{display:grid; grid-template-columns:1fr .95fr; gap:28px; align-items:start}
.info-list{display:grid; gap:14px; margin:26px 0 24px}
.info-list a,.info-list span{background:#fff; border:1px solid rgba(129,166,210,.18); border-radius:18px; padding:16px 18px; box-shadow:var(--shadow); color:#3b4e66}
.map-card{background:#fff; border:1px solid rgba(129,166,210,.18); border-radius:24px; padding:12px; box-shadow:var(--shadow)}
.map-card iframe{width:100%; height:320px; border:0; border-radius:18px}
.form-card{background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.82)); border:1px solid rgba(129,166,210,.18); border-radius:28px; padding:28px; box-shadow:var(--shadow)}
.form-card form{display:grid; gap:16px}
.form-card label{display:grid; gap:8px; font-weight:600; color:#344860}
.form-card input,.form-card textarea{width:100%; border:1px solid rgba(128,166,209,.28); background:#fff; color:var(--text); border-radius:16px; padding:16px 18px; outline:none}
.form-card input:focus,.form-card textarea:focus{border-color:var(--primary); box-shadow:0 0 0 4px rgba(62,135,207,.12)}
.footer{background:linear-gradient(90deg, #17395f, #265f98); color:#eaf4ff; padding:26px 0}
.footer-inner{display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; align-items:center}
.footer p{margin:0; color:#dce9f8} .footer a{color:#fff; text-decoration:underline}
.whatsapp-float{position:fixed; right:20px; bottom:20px; z-index:60; padding:15px 18px; border-radius:999px; background:linear-gradient(135deg, #14c96b, #2ade75); color:#fff; font-weight:800; box-shadow:0 16px 34px rgba(18,152,79,.3)}
.lightbox{position:fixed; inset:0; background:rgba(8,18,31,.82); display:none; place-items:center; padding:24px; z-index:100}
.lightbox.open{display:grid}
.lightbox img{max-width:min(100%, 980px); max-height:84vh; border-radius:24px; box-shadow:0 30px 80px rgba(0,0,0,.4)}
.lightbox-close{position:absolute; top:18px; right:18px; width:48px; height:48px; border:0; border-radius:50%; background:#fff; color:#123; font-size:2rem; cursor:pointer}
@media (max-width:980px){
  .intro-grid,.video-grid,.contact-grid,.cards,.gallery{grid-template-columns:1fr 1fr}
  .hero{min-height:78svh}
  .brand-text span{display:none}
}
@media (max-width:760px){
  .menu-toggle{display:grid; place-items:center}
  .menu{position:absolute; left:16px; right:16px; top:82px; display:none; flex-direction:column; gap:14px; background:rgba(255,255,255,.96); border:1px solid rgba(129,166,210,.18); padding:18px; border-radius:22px; box-shadow:var(--shadow)}
  .menu.open{display:flex}
  .hero-content{padding:90px 0 60px}
  .hero h1{font-size:clamp(2.3rem, 12vw, 4rem)}
  .intro-grid,.video-grid,.contact-grid,.cards,.gallery{grid-template-columns:1fr}
  .topbar-inner{justify-content:center; text-align:center}
  .brand img{width:56px; height:56px}
  .section{padding:74px 0}
}