/* ¿Qué Hay Pilar? · estilos de la landing */
  html{scroll-behavior:smooth}
  body{background:#111827;color:#e5e7eb}
  .phone{position:relative;border-radius:2.4rem;padding:9px;background:linear-gradient(160deg,#2b3550,#0b1020);box-shadow:0 30px 70px -20px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.08)}
  .phone::before{content:"";position:absolute;top:15px;left:50%;width:62px;height:5px;margin-left:-31px;border-radius:9px;background:#05070f;z-index:2}
  .phone img{display:block;width:100%;aspect-ratio:720/1540;object-fit:cover;object-position:top;border-radius:1.9rem;background:#0d0b16}
  .float{animation:float 6s ease-in-out infinite}
  .float.d{animation-delay:-3s}
  @keyframes float{50%{transform:translateY(-12px)}}
  .snap{scroll-snap-type:x mandatory;scrollbar-width:none}
  .snap::-webkit-scrollbar{display:none}
  .snap>*{scroll-snap-align:center}
  .pin{display:flex;flex-direction:column;align-items:center;z-index:5;filter:drop-shadow(0 12px 18px rgba(0,0,0,.5))}
  .pin-ring{position:absolute;bottom:22px;width:70px;height:70px;border-radius:50%;border:2px solid rgba(255,69,0,.5);animation:ping 2.8s ease-out infinite}
  .chip{margin-top:4px;white-space:nowrap;border-radius:999px;background:#14B8A6;color:#06201d;font-weight:700;font-size:.75rem;padding:.25rem .65rem;border:2px solid #fff}
  @keyframes ping{from{transform:scale(.3);opacity:1}to{transform:scale(1.4);opacity:0}}
  .leaflet-container{font-family:'DM Sans',sans-serif;background:#0d1117}
  .dark-tiles{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.9) saturate(.45)}
  .mk{width:90px;display:flex;flex-direction:column;align-items:center;filter:drop-shadow(0 8px 10px rgba(0,0,0,.55));transition:transform .2s}
  .mk:hover{transform:scale(1.12)}
  .mk img{height:44px;width:auto}
  .leaflet-popup-content-wrapper{background:#1a2234;color:#e5e7eb;border:1px solid #2a344a;border-radius:16px}
  .leaflet-popup-tip{background:#1a2234}
  .leaflet-popup-content{margin:14px 16px;line-height:1.4}
  .leaflet-container a.leaflet-popup-close-button{color:#9ca3af}
  .leaflet-control-zoom a{background:#1a2234!important;color:#e5e7eb!important;border-color:#2a344a!important}
  .leaflet-control-attribution{background:rgba(17,24,39,.8)!important;color:#9ca3af!important}
  .leaflet-control-attribution a{color:#14B8A6!important}
  .me{width:18px;height:18px;border-radius:50%;background:#3b82f6;border:3px solid #fff;box-shadow:0 0 0 8px rgba(59,130,246,.25)}
  .fchip{white-space:nowrap;border-radius:999px;border:1px solid #2a344a;background:rgba(17,24,39,.85);backdrop-filter:blur(6px);padding:.3rem .8rem;font-size:.8rem;font-weight:500;color:#d1d5db;transition:.2s}
  .fchip.on{background:#FF4500;border-color:#FF4500;color:#fff}
  section[id]{scroll-margin-top:70px}
  .scr-body{animation:swap .45s ease}
  @keyframes swap{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .mk.act{transform:scale(1.18)}
  .mk.act .chip{background:#FF4500;color:#fff}
  .sc{position:absolute;inset:0;opacity:0;transition:opacity .5s}
  .sc.on{opacity:1}
  .phone .sc img,.phone .sc video{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:top;border-radius:0}
  .sc video{opacity:0;transition:opacity .4s}
  .sc video.vis{opacity:1}
  .si{display:block;width:100%;text-align:left;border:1px solid #2a344a;border-radius:1rem;padding:.9rem 1.1rem;transition:.25s;position:relative;overflow:hidden}
  .si:hover{border-color:var(--ac)}
  .si.on{background:#1a2234;border-color:var(--ac)}
  .si p{display:none}.si.on p{display:block}
  .si .bar{position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--ac)}
  @keyframes fill{to{width:100%}}
  .tab{padding:.5rem 1.3rem;border-radius:999px;font-weight:700;font-size:.875rem;color:#9ca3af;transition:.2s}
  .tab.on{background:var(--ac);color:var(--tc)}
  .inp{width:100%;border-radius:.85rem;border:1px solid #2a344a;background:#111827;padding:.75rem 1rem;color:#e5e7eb;font-size:.95rem;transition:.2s}
  .inp:focus{border-color:#14B8A6;outline:none;box-shadow:0 0 0 3px rgba(20,184,166,.2)}
  .glow-t{background:radial-gradient(closest-side,rgba(20,184,166,.28),transparent)}
  .glow-v{background:radial-gradient(closest-side,rgba(139,92,246,.30),transparent)}
  .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}
  .reveal.in{opacity:1;transform:none}
  :focus-visible{outline:2px solid #14B8A6;outline-offset:3px;border-radius:8px}
  @media (prefers-reduced-motion:reduce){.float,.pin-ring{animation:none}.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
