/* ============================================================
   ATERRIZAJE ONLINE — css/site-nav.css
   Menú público único (portada, cotizador, servicio-diseno).
   Markup: partials/public-nav.php (y copia inline en las .html).
   ============================================================ */
:root{
  --sn-h:72px;
  --sn-bg:rgba(12,14,22,.72);
  --sn-line:rgba(255,255,255,.08);
  --sn-text:rgba(255,255,255,.72);
  --sn-violet:#7C3AED;
  --sn-wa:#25D366;
}
.sn{
  position:fixed;top:0;left:0;right:0;z-index:400;height:var(--sn-h);
  display:flex;align-items:center;
  font-family:'DM Sans',system-ui,sans-serif;
  transition:background .35s ease,border-color .35s ease,transform .4s cubic-bezier(.22,1,.36,1);
  border-bottom:1px solid transparent;
}
.sn.is-solid{
  background:var(--sn-bg);
  -webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
  border-bottom-color:var(--sn-line);
}
.sn.is-hidden{transform:translateY(-100%)}
.sn-in{
  width:100%;max-width:1320px;margin:0 auto;padding:0 28px;
  display:flex;align-items:center;gap:28px;
}
.sn-logo{display:block;line-height:0;flex-shrink:0}
.sn-logo img{height:38px;width:auto;display:block}
.sn-links{display:flex;align-items:center;gap:4px;margin-left:auto}
.sn-links a{
  position:relative;padding:9px 14px;border-radius:999px;
  font-size:14.5px;font-weight:500;color:var(--sn-text);text-decoration:none;
  transition:color .2s,background .2s;
}
.sn-links a:hover{color:#fff;background:rgba(255,255,255,.06)}
.sn-links a[aria-current="page"]{color:#fff}
.sn-links a[aria-current="page"]::after{
  content:'';position:absolute;left:50%;bottom:3px;width:4px;height:4px;border-radius:50%;
  background:var(--sn-violet);transform:translateX(-50%);box-shadow:0 0 8px var(--sn-violet);
}
.sn-actions{display:flex;align-items:center;gap:10px}
.sn-quote{
  padding:10px 18px;border-radius:999px;font-size:14px;font-weight:500;color:#fff;text-decoration:none;
  border:1px solid rgba(255,255,255,.18);transition:border-color .2s,background .2s;
}
.sn-quote:hover{border-color:rgba(167,139,250,.7);background:rgba(124,58,237,.14)}
.sn-wa{
  display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;
  background:var(--sn-wa);color:#06260f;font-size:14px;font-weight:700;text-decoration:none;
  box-shadow:0 6px 22px -6px rgba(37,211,102,.55);transition:transform .2s,box-shadow .2s;
}
.sn-wa:hover{transform:translateY(-1px);box-shadow:0 10px 28px -6px rgba(37,211,102,.7)}
.sn-wa svg{width:17px;height:17px;flex-shrink:0}
.sn-burger{
  display:none;width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0;
}
.sn-burger span{display:block;width:18px;height:1.6px;border-radius:2px;background:#fff;transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .2s}
.sn-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
.sn-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.sn-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}
.sn a:focus-visible,.sn button:focus-visible,.sn-sheet a:focus-visible{outline:2px solid #a78bfa;outline-offset:3px}

/* Hoja móvil */
.sn-sheet{
  position:fixed;inset:0;z-index:390;padding:calc(var(--sn-h) + 24px) 24px 32px;
  background:rgba(9,10,16,.97);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
  display:flex;flex-direction:column;gap:6px;overflow-y:auto;
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:opacity .3s ease,transform .35s cubic-bezier(.22,1,.36,1),visibility 0s .35s;
  font-family:'DM Sans',system-ui,sans-serif;
}
.sn-sheet.is-open{opacity:1;visibility:visible;transform:none;transition:opacity .3s ease,transform .35s cubic-bezier(.22,1,.36,1)}
.sn-sheet > a.sn-big{
  display:flex;align-items:baseline;justify-content:space-between;
  padding:16px 4px;border-bottom:1px solid rgba(255,255,255,.07);
  font-size:30px;font-weight:600;letter-spacing:-.03em;color:#fff;text-decoration:none;
}
.sn-sheet > a.sn-big small{font-size:13px;font-weight:400;letter-spacing:0;color:rgba(255,255,255,.4)}
.sn-sheet-cta{display:grid;gap:10px;margin-top:auto;padding-top:28px}
.sn-sheet-cta a{display:flex;align-items:center;justify-content:center;gap:10px;padding:16px;border-radius:16px;font-size:16px;font-weight:600;text-decoration:none}
.sn-sheet-cta .is-wa{background:var(--sn-wa);color:#06260f}
.sn-sheet-cta .is-quote{border:1px solid rgba(255,255,255,.18);color:#fff}
.sn-sheet-cta svg{width:20px;height:20px}
body.sn-lock{overflow:hidden}

@media (max-width:980px){
  :root{--sn-h:64px}
  .sn-in{padding:0 16px;gap:10px}
  .sn-logo img{height:30px}
  .sn-links,.sn-quote{display:none}
  .sn-actions{margin-left:auto}
  .sn-wa{padding:0;width:44px;height:44px;justify-content:center}
  .sn-wa span{display:none}
  .sn-wa svg{width:21px;height:21px}
  .sn-burger{display:flex}
}
@media (min-width:981px){.sn-sheet{display:none}}

/* Botón flotante de WhatsApp */
.wa-fab{
  position:fixed;right:22px;bottom:22px;z-index:380;
  display:flex;align-items:center;gap:10px;height:58px;padding:0 6px 0 6px;border-radius:999px;
  background:var(--sn-wa);color:#06260f;text-decoration:none;font-family:'DM Sans',system-ui,sans-serif;
  box-shadow:0 14px 34px -10px rgba(37,211,102,.7),0 2px 8px rgba(0,0,0,.35);
  transition:transform .25s cubic-bezier(.22,1,.36,1),padding .3s cubic-bezier(.22,1,.36,1),opacity .3s;
}
.wa-fab .wa-fab-ic{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.wa-fab svg{width:28px;height:28px}
.wa-fab .wa-fab-txt{max-width:0;overflow:hidden;white-space:nowrap;font-size:14.5px;font-weight:700;transition:max-width .35s cubic-bezier(.22,1,.36,1)}
.wa-fab:hover{transform:translateY(-2px)}
.wa-fab:hover .wa-fab-txt,.wa-fab.is-peek .wa-fab-txt{max-width:220px}
.wa-fab:hover,.wa-fab.is-peek{padding-right:20px}
.wa-fab.is-away{opacity:0;pointer-events:none;transform:translateY(12px)}
.wa-fab:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media (max-width:640px){.wa-fab{right:14px;bottom:14px;height:56px}}
@media (prefers-reduced-motion:reduce){
  .sn,.sn-sheet,.wa-fab,.wa-fab .wa-fab-txt{transition:none}
}