/* Limpieza Chicago — Global Styles */
:root{
  --brand: #0078d7;
  --brand-2: #00a6ff;
  --ink: #0f172a;
  --muted: #475569;
  --bg: #f5f9fc;
  --card: #ffffff;
  --radius: 16px;
  --ring: 0 0 0 3px rgba(0,120,215,.25);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1100px,92%);margin-inline:auto}

/* Header */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.75);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid #e5eef6}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.logo{display:flex;align-items:center;gap:10px;font-weight:800}
.logo-dot{width:10px;height:10px;border-radius:999px;background:var(--brand)}
.menu{display:flex;gap:16px;font-weight:600;font-size:14px}
.lang{display:flex;gap:8px;align-items:center}
.lang a{border:1px solid #cfe3f2;padding:7px 12px;border-radius:999px;font-weight:600}
.lang a.active, .lang a[aria-current="true"]{background:var(--brand);color:#fff;border-color:var(--brand)}
.cta{display:inline-flex;align-items:center;gap:8px;background:var(--brand);color:#fff;padding:10px 16px;border-radius:999px;border:0;box-shadow:0 6px 20px -8px var(--brand)}
.cta:hover{transform:translateY(-1px)}
.call{white-space:nowrap}

/* Hero */
.hero{display:grid;place-items:center;text-align:center;padding:72px 0 48px;background:linear-gradient(180deg,#ffffff 0%,#f2f7fa 70%,#f5f9fc 100%)}
.hero h1{font-size:clamp(28px,5vw,44px);line-height:1.1;margin:0 0 12px}
.hero p{margin:0 auto;max-width:720px;color:var(--muted);font-size:18px}
.actions{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.ghost{border:1px solid #cfe3f2;padding:10px 16px;border-radius:999px;background:#fff}

/* Sections */
section{padding:56px 0}
h2{font-size:clamp(22px,3.5vw,32px);margin:0 0 18px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{grid-column:span 4;background:var(--card);border:1px solid #e8eef5;border-radius:var(--radius);padding:20px;box-shadow:0 10px 30px -12px rgba(2,46,91,.12)}
.card h3{margin:0 0 8px;font-size:18px}
.card p{margin:0;color:var(--muted);font-size:15px}
.two{grid-column:span 6}
.quote{background:var(--card);border:1px solid #e8eef5;border-radius:var(--radius);padding:20px;font-size:15px;color:var(--muted)}
.stars{font-size:14px;color:#f59e0b}

/* Contact form */
form{background:var(--card);border:1px solid #e8eef5;border-radius:var(--radius);padding:20px;display:grid;gap:12px}
input, textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #cfe3f2;font:inherit}
input:focus, textarea:focus{outline:var(--ring);border-color:var(--brand)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.btn{background:var(--brand);color:#fff;border:0;border-radius:12px;padding:12px 16px;font-weight:700}
.btn:hover{filter:brightness(1.05)}

/* Footer */
footer{padding:30px 0;text-align:center;color:var(--muted);border-top:1px solid #e5eef6}

/* WhatsApp Float */
.whatsapp-float{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;align-items:center;gap:10px;background:#25D366;color:#fff;font-weight:700;padding:10px 14px;border-radius:999px}
.whatsapp-float:hover{filter:brightness(1.05)}

/* Responsive */
@media (max-width:900px){.card{grid-column:span 6} .two{grid-column:span 12}}
@media (max-width:600px){.card{grid-column:span 12} .menu{display:none} .hero{padding-top:56px}}


/* === Logo entrance animation === */
@keyframes logoPopIn {
  0% { opacity: 0; transform: translateY(8px) scale(0.98); }
  60% { opacity: 1; transform: translateY(0) scale(1.01); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
.logo-animate {
  animation: logoPopIn .7s ease-out both;
}


/* === Patch: Larger header logo === */
.logo img { height: 64px; max-height: 64px; }
@media (max-width: 900px){ .logo img { height: 56px; max-height: 56px; } }
@media (max-width: 600px){ .logo img { height: 44px; max-height: 44px; } }
/* Adjust header spacing so larger logo fits nicely */
.nav { padding: 12px 0; }
@media (max-width: 600px){ .nav { padding: 10px 0; } }


/* === Reviews carousel === */
.review-carousel{position:relative;display:grid;gap:0}
.review-slide{opacity:0;pointer-events:none;transition:opacity .4s ease}
.review-slide.is-active{opacity:1;pointer-events:auto}
.review-dots{display:flex;gap:8px;justify-content:center;margin-top:14px}
.review-dot{width:10px;height:10px;border-radius:999px;background:#cfe3f2;border:1px solid #b8d7ec;cursor:pointer}
.review-dot[aria-selected="true"]{background:#0078d7;border-color:#0078d7}



.logo{display:flex;align-items:center;gap:10px;min-height:64px}
.logo img{display:block;vertical-align:middle}
@media (max-width:900px){ .logo{min-height:56px} }
@media (max-width:600px){ .logo{min-height:44px} }
.facebook-float{position:fixed;right:18px;bottom:78px;z-index:60;display:inline-flex;align-items:center;gap:10px;background:#1877F2;color:#fff;font-weight:700;padding:10px 14px;border-radius:999px;box-shadow:0 8px 24px -12px rgba(24,119,242,.6)}
.facebook-float:hover{filter:brightness(1.05)}
.facebook-float .fb-ico{width:20px;height:20px;border-radius:999px;background:#fff;color:#1877F2;display:grid;place-items:center;font-weight:900;line-height:1}
@media (max-width:600px){ .facebook-float{bottom:126px} } /* sit above WhatsApp on mobile */

/* Footer social icon */
.footer-social{display:inline-flex;align-items:center;gap:8px;margin:6px 8px}
.footer-social svg{display:block}



.nav{position:relative; min-height:72px; display:flex; align-items:center; justify-content:flex-end; padding:12px 0;}
.logo{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:flex; align-items:center; gap:10px;}
.logo img{display:block; height:64px; max-height:64px;}
@media (max-width:900px){
  .nav{min-height:60px; padding:10px 0;}
  .logo img{height:56px; max-height:56px;}
}
@media (max-width:600px){
  .nav{min-height:52px; padding:8px 0;}
  .logo img{height:44px; max-height:44px;}
}
/* Ensure right controls keep spacing */
.nav .lang{display:flex; align-items:center; gap:10px;}
/* Hard hide any leftover floating fb button */
.facebook-float{display:none !important;}


@media (max-width:600px){
  .nav{min-height:52px}
  .logo img{height:42px; max-height:42px}
}


/* === Floating Facebook button (classic) === */
.facebook-float{position:fixed; right:18px; bottom:132px; z-index:60; display:inline-flex; align-items:center; gap:10px; background:#1877F2; color:#fff; font-weight:700; padding:10px 14px; border-radius:999px; box-shadow:0 8px 24px -12px rgba(24,119,242,.6)}
.facebook-float:hover{filter:brightness(1.05)}
.facebook-float svg{display:block}
/* Keep WhatsApp below */
@media (max-width:600px){
  .facebook-float{bottom:132px}
}


@media (max-width:600px){.nav{min-height:52px}.logo img{height:42px;max-height:42px}}


/* === Facebook float (final) === */
.facebook-float{position:fixed;right:18px;bottom:132px;z-index:60;display:inline-flex;align-items:center;gap:10px;background:#1877F2;color:#fff;font-weight:700;padding:10px 14px;border-radius:999px;box-shadow:0 8px 24px -12px rgba(24,119,242,.6)}
.facebook-float:hover{filter:brightness(1.05)}
.facebook-float svg{display:block}
@media (max-width:600px){.facebook-float{bottom:132px}}


/* === Header layout: brand left (icon+text), menu center, controls right === */
header .container.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:12px 0;min-height:66px}
.brand{display:flex;align-items:center;gap:10px;justify-self:start}
.brand img{height:48px;max-height:48px;display:block}
.brand .brand-text{font-weight:800;letter-spacing:.02em;color:#0a5ea5;font-size:18px;line-height:1.1;text-transform:uppercase}
nav.primary{justify-self:center;display:flex;gap:20px;align-items:center}
.nav .lang{justify-self:end;display:flex;align-items:center;gap:10px}
@media (max-width:900px){
  header .container.nav{min-height:58px}
  .brand img{height:44px}
  .brand .brand-text{font-size:16px}
}
@media (max-width:600px){
  header .container.nav{grid-template-columns:auto 1fr auto;gap:10px;min-height:54px}
  .brand img{height:40px}
  .brand .brand-text{font-size:14px}
  nav.primary{gap:12px}
}


/* === FINAL: Stable header (brand left, menu center, controls right) === */
header .container.nav{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  gap:16px;
  padding:12px 0;
  min-height:64px;
}
.brand{display:flex;align-items:center;gap:12px;justify-self:start;white-space:nowrap}
.brand img{height:48px;max-height:48px;display:block}
.brand .brand-text{font-weight:800;letter-spacing:.02em;color:#0a5ea5;font-size:18px;line-height:1;text-transform:uppercase}
nav.primary{justify-self:center;display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.nav .lang{justify-self:end;display:flex;align-items:center;gap:10px}
@media (max-width:900px){
  header .container.nav{min-height:58px}
  .brand img{height:44px}
  .brand .brand-text{font-size:16px}
  nav.primary{gap:16px}
}
@media (max-width:600px){
  header .container.nav{grid-template-columns:auto 1fr auto;gap:10px;min-height:54px}
  .brand img{height:40px}
  .brand .brand-text{font-size:14px}
  nav.primary{gap:12px}
}
/* Facebook float (keep) */
.facebook-float{position:fixed;right:18px;bottom:132px;z-index:60;display:inline-flex;align-items:center;gap:10px;background:#1877F2;color:#fff;font-weight:700;padding:10px 14px;border-radius:999px;box-shadow:0 8px 24px -12px rgba(24,119,242,.6)}
.facebook-float:hover{filter:brightness(1.05)}
.facebook-float svg{display:block}
@media (max-width:600px){.facebook-float{bottom:132px}}