:root{
  --bg:#ffffff; --fg:#0e0e10; --muted:#61616b; --line:#ececf2; --link:#0f62fe;
  --radius:16px; --maxw:1100px;
  --bg-img-hero: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'><defs><linearGradient id='g' x1='0' x2='1' y1='0' y2='1'><stop offset='0%' stop-color='%23ffffff'/><stop offset='100%' stop-color='%23f3f4f7'/></linearGradient></defs><rect width='1600' height='900' fill='url(%23g)'/><g opacity='0.9'><circle cx='1300' cy='200' r='260' fill='none' stroke='%23dfe1e8' stroke-width='2'/><circle cx='1340' cy='240' r='200' fill='none' stroke='%23e7e9f0' stroke-width='2'/><circle cx='400' cy='680' r='180' fill='none' stroke='%23e7e9f0' stroke-width='2'/></g></svg>");
  --bg-img-band-1: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 600'><defs><linearGradient id='g2' x1='0' x2='0' y1='0' y2='1'><stop offset='0%' stop-color='%23f7f8fb'/><stop offset='100%' stop-color='%23ffffff'/></linearGradient></defs><rect width='1600' height='600' fill='url(%23g2)'/><g stroke='%23e7e9f0' stroke-width='1'><path d='M0,420 C250,360 450,520 700,480 C950,440 1200,500 1600,420' fill='none'/><path d='M0,500 C250,440 450,560 700,520 C950,480 1200,560 1600,500' fill='none'/></g></svg>");
  --bg-img-band-2: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 600'><defs><linearGradient id='g3' x1='0' x2='1' y1='0' y2='0'><stop offset='0%' stop-color='%23ffffff'/><stop offset='100%' stop-color='%23f7f8fb'/></linearGradient></defs><rect width='1600' height='600' fill='url(%23g3)'/><g opacity='0.7'><rect x='200' y='140' width='160' height='160' fill='none' stroke='%23e1e3ea'/><rect x='420' y='200' width='120' height='120' fill='none' stroke='%23e1e3ea'/><rect x='580' y='120' width='240' height='240' fill='none' stroke='%23e1e3ea'/><rect x='860' y='160' width='200' height='200' fill='none' stroke='%23e1e3ea'/></g></svg>");
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial,sans-serif}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
:focus{outline:2px solid var(--link);outline-offset:2px}

/* Layout base */
.container{max-width:var(--maxw);margin:0 auto;padding:0 16px}
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line)}
.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-mark{width:28px;height:28px;border:2px solid var(--fg);border-radius:8px;display:grid;place-items:center;font-size:16px}
.logo-sub{color:#8a8a93;font-weight:600}
.logo{ text-decoration:none; color:inherit }
.logo:hover{ text-decoration:none }
.logo-svg{height:clamp(22px,3.2vw,28px);width:auto;display:block}
.menu{position:absolute;top:100%;left:0;right:0;background:rgba(255,255,255,.98);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--line);padding:12px 16px;flex-direction:column;gap:12px;max-height:0;overflow:hidden;opacity:0;transform:translateY(-8px);visibility:hidden;pointer-events:none;transition:max-height .35s cubic-bezier(.2,.8,.2,1),opacity .25s ease,transform .25s ease,visibility .25s}
.menu.is-open{max-height:60vh;opacity:1;transform:translateY(0);visibility:visible;pointer-events:auto;display:flex}
.nav{position:relative}
.nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:#fff;transition:box-shadow .2s ease}
.nav-toggle .burger{width:18px;height:2px;background:var(--fg);position:relative;display:block;transition:background .2s ease}
.nav-toggle .burger::before,.nav-toggle .burger::after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--fg);transition:transform .25s ease}
.nav-toggle .burger::before{top:-6px}
.nav-toggle .burger::after{top:6px}
.nav-toggle.is-active .burger{background:transparent}
.nav-toggle.is-active .burger::before{transform:translateY(6px) rotate(45deg)}
.nav-toggle.is-active .burger::after{transform:translateY(-6px) rotate(-45deg)}

/* Botones */
.btn{display:inline-block;padding:12px 18px;border:1px solid var(--fg);border-radius:999px;font-weight:700}
.btn:hover{box-shadow:0 10px 30px rgba(0,0,0,.08)}
.btn-solid{background:var(--fg);color:#fff}
.cta-row{margin-top:18px;display:flex;gap:12px;flex-wrap:wrap}

/* Hero */
.hero{position:relative;min-height:72vh;display:grid;align-items:center;background-image:var(--bg-img-hero);background-size:cover;background-position:center;overflow:clip;border-bottom:1px solid var(--line)}
.parallax{will-change:transform}
.hero-overlay{position:absolute;inset:0;background:radial-gradient(80vw 40vh at 20% 80%, rgba(0,0,0,.06), transparent 60%),radial-gradient(70vw 40vh at 100% -10%, rgba(0,0,0,.05), transparent 60%);pointer-events:none}
.hero .content{padding:80px 0 40px}
.kicker{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#6b6b75;margin-bottom:10px}
h1{font-size:clamp(36px,6vw,64px);line-height:1.02;margin:0 0 10px}
.lead{font-size:clamp(16px,2.1vw,20px);color:#555;max-width:900px}
.badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.badge{border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:13px;background:#fff}

/* Secciones */
section{padding:56px 0;border-bottom:1px solid var(--line)}
h2{font-size:clamp(26px,4vw,36px);margin:0 0 18px}
.grid{display:grid;gap:18px}
@media(min-width:900px){ .cols-2{grid-template-columns:repeat(2,1fr)} .cols-3{grid-template-columns:repeat(3,1fr)} }
@media(min-width:900px){
  section{padding:68px 0}
  .menu{position:static;background:transparent;border:0;padding:0;flex-direction:row;gap:18px;max-height:none;opacity:1;transform:none;visibility:visible;pointer-events:auto;display:flex}
  .nav-toggle{display:none}
}
  .nav-toggle{display:none}
}.cols-3{grid-template-columns:repeat(3,1fr)}}

/* Cards y listas */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:0 6px 24px rgba(0,0,0,.06)}
.list{list-style:none;margin:10px 0 0;padding:0}
.list li{padding:8px 0 8px 24px;border-top:1px dashed var(--line);background:linear-gradient(transparent 50%,transparent 50%) left 12px/1px 100% no-repeat}
.list li::before{content:"▹";margin-right:8px;position:relative;left:-12px}
.muted{color:var(--muted)}
.price{font-size:28px;font-weight:800;margin:6px 0 2px}
.destacado{border:2px solid #111}
.nota{margin-top:10px}

/* Thumbs / gradients */
.thumb{border-radius:14px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/10;display:block}
.thumb>div{width:100%;height:100%;background-size:cover;background-position:center;transform:scale(1.02);transition:transform .4s ease}
.thumb:hover>div{transform:scale(1.06)}
.grad{width:100%;height:100%}
.grad-1{background-image:linear-gradient(135deg,#111 0%,#444 100%)}
.grad-2{background-image:linear-gradient(135deg,#111 0%,#2a2a2a 100%)}
.grad-3{background-image:linear-gradient(135deg,#111 0%,#1b1b1b 100%)}
.fig figcaption{padding:14px 16px}
.fig-1{background-image:linear-gradient(135deg,#dfe3ee 0%,#ffffff 60%)}
.fig-2{background-image:linear-gradient(135deg,#e9ecf6 0%,#ffffff 60%)}
.fig-3{background-image:linear-gradient(135deg,#e6f0ff 0%,#ffffff 60%)}

/* Bandas decorativas */
.band{background-attachment:fixed;background-size:cover;background-position:center;min-height:40vh;display:grid;place-items:center;border-bottom:1px solid var(--line);background-image:var(--bg-img)}
.band-inner{backdrop-filter:blur(2px) saturate(115%);background:rgba(255,255,255,.7);border:1px solid var(--line);border-radius:14px;padding:16px 20px}

/* Clientes (tabla fija) */
.logos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:24px;justify-items:center;align-items:center;margin-top:20px}
.logos-grid img{max-width:110px;max-height:50px;object-fit:contain;filter:grayscale(100%);opacity:.85;transition:filter .25s ease,opacity .25s ease}
.logos-grid img:hover{filter:none;opacity:1}

/* Accesibilidad y utilidades */
footer{padding:28px 0}
.tiny{font-size:12px;color:var(--muted)}
.sr-only{position:absolute;left:-9999px}
.reveal{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.hint{font-size:12px;color:#6b6b75}
.ok{color:#0b8a0b;font-weight:700}
.copy{font-size:12px;border:1px dashed var(--line);padding:6px 10px;border-radius:8px;cursor:pointer}
.honeypots{position:absolute;left:-9999px}

/* FAB grupo (WhatsApp + Calendly) */
.fab-group{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:6px;opacity:0;transform:translateY(8px);transition:opacity .26s ease,transform .26s ease}
.fab-group.show{opacity:1;transform:none}
.fab-group::before{content:"";position:absolute;inset:-6px -8px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.08);z-index:-1}
.fab-group.hidden{display:none}
.fab-wa,.fab-cal{display:flex;align-items:center;gap:10px;border-radius:999px;padding:12px 16px;border:1px solid rgba(0,0,0,.08);box-shadow:0 12px 24px rgba(0,0,0,.12);font-weight:800}
.fab-wa{background:#25d366;color:#073b15}
.fab-wa .dot{width:10px;height:10px;border-radius:999px;background:#11a94d}
.fab-wa b{color:#04280e}
.fab-wa:hover{filter:brightness(1.02)}
.fab-cal{background:var(--fg);color:#fff}
.fab-cal .dot{width:10px;height:10px;border-radius:999px;background:#1f2937}
.fab-cal:hover{filter:brightness(1.02)}

/* Utilidades extra */
body.menu-open{overflow:hidden}

/* Media queries finos */
@media (max-width:600px){
  .menu{gap:12px}
  .logo-mark{width:24px;height:24px}
}

/* Prefiere reducir movimiento */
@media (prefers-reduced-motion: reduce){
  .parallax{transform:none !important}
  .menu{transition:none}
  .fab-group{transition:none}
}
}
/* Mobile-first header */
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.nav{display:flex;align-items:center;justify-content:space-between;position:relative;padding:14px 0}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.logo-svg{height:clamp(22px,3.2vw,28px);width:auto;display:block}
.logo-sub{color:#8a8a93;font-weight:600}

/* Menú colapsable */
.menu{
  position:absolute; top:100%; left:0; right:0;
  background:rgba(255,255,255,.98); backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid #ececf2; padding:12px 16px; display:flex; flex-direction:column; gap:12px;
  max-height:0; overflow:hidden; opacity:0; transform:translateY(-8px); visibility:hidden; pointer-events:none;
  transition:max-height .35s cubic-bezier(.2,.8,.2,1),opacity .25s ease,transform .25s ease,visibility .25s;
}
.menu.is-open{max-height:60vh; opacity:1; transform:translateY(0); visibility:visible; pointer-events:auto}

.nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid #ececf2;border-radius:10px;background:#fff;transition:box-shadow .2s ease}
.nav-toggle .burger{width:18px;height:2px;background:#0e0e10;position:relative;display:block;transition:background .2s ease}
.nav-toggle .burger::before,.nav-toggle .burger::after{content:"";position:absolute;left:0;right:0;height:2px;background:#0e0e10;transition:transform .25s ease}
.nav-toggle .burger::before{top:-6px}
.nav-toggle .burger::after{top:6px}
.nav-toggle.is-active .burger{background:transparent}
.nav-toggle.is-active .burger::before{transform:translateY(6px) rotate(45deg)}
.nav-toggle.is-active .burger::after{transform:translateY(-6px) rotate(-45deg)}

@media (min-width:900px){
  .menu{position:static;background:transparent;border:0;padding:0;flex-direction:row;gap:18px;
        max-height:none;opacity:1;transform:none;visibility:visible;pointer-events:auto}
  .nav-toggle{display:none}
  section{padding:68px 0}
}
@media (max-width:720px){
  .logo-svg{height:22px}
}

/* FAB (WhatsApp + Agenda) con banda blanca y animación */
.fab-group{
  position:fixed; right:18px; bottom:18px; z-index:60; display:flex; gap:10px; flex-wrap:wrap; align-items:center; padding:6px;
  opacity:0; transform:translateY(8px); transition:opacity .26s ease, transform .26s ease;
}
.fab-group.show{opacity:1; transform:none}
.fab-group::before{
  content:""; position:absolute; inset:-6px -8px; background:#fff; border:1px solid #ececf2; border-radius:999px; box-shadow:0 8px 20px rgba(0,0,0,.08); z-index:-1;
}
.fab-wa,.fab-cal{display:flex;align-items:center;gap:10px;border-radius:999px;padding:12px 16px;border:1px solid rgba(0,0,0,.08);box-shadow:0 12px 24px rgba(0,0,0,.12);font-weight:800}
.fab-wa{background:#25d366;color:#073b15}
.fab-wa .dot{width:10px;height:10px;border-radius:999px;background:#11a94d}
.fab-wa b{color:#04280e}
.fab-cal{background:#0e0e10;color:#fff}
.fab-cal .dot{width:10px;height:10px;border-radius:999px;background:#1f2937}
@media (max-width:420px){
  .fab-wa,.fab-cal{padding:10px 12px;font-size:13px;gap:8px}
  .fab-wa b{display:none}
}

/* Contenido base útil en móvil */
section{padding:56px 0;border-bottom:1px solid #ececf2}