/* RP NAV: menu compacto + panel lateral "Menu".
   Solo actua si html tiene la clase .rpn (la agrega un script en el <head>). */

/* 1) Ocultar lo que pasa al panel */
.rpn nav .nav-links > a[href="index.html"],
.rpn nav .nav-links > a[href="#home"],
.rpn nav .nav-links li:has(> a[href="#about"]),
.rpn nav .nav-links .nav-dropdown,
.rpn nav .nav-links .nav-phone-mobile,
.rpn nav .nav-links .solo-movil,
.rpn nav .nav-cta > a:not(.lang-sw),
.rpn nav .nav-actions > a,
.rpn nav .nav-toggle { display: none !important; }

/* 2) Boton Menu */
.rpn-btn { display: inline-flex; align-items: center; gap: 12px; margin-left: 18px; padding: 11px 18px 11px 22px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.04); color: rgba(255,255,255,.9); font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: border-color .2s, background .2s, color .2s; flex-shrink: 0; line-height: 1; }
.rpn-btn:hover, .rpn-btn:focus-visible { border-color: #C9A96E; color: #C9A96E; background: rgba(201,169,110,.08); outline: none; }
.rpn-lines { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.rpn-lines i { display: block; height: 2px; border-radius: 2px; background: currentColor; }
.rpn-lines i:nth-child(1) { width: 20px; } .rpn-lines i:nth-child(2) { width: 15px; } .rpn-lines i:nth-child(3) { width: 10px; }

/* 3) Panel lateral */
.rpn-ov { position: fixed; inset: 0; background: rgba(8,16,34,.55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; z-index: 99990; }
.rpn-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(400px, 92vw); background: #0F1F3D; color: #fff; z-index: 99991; transform: translateX(100%); transition: transform .38s cubic-bezier(.2,.8,.2,1); display: flex; flex-direction: column; box-shadow: -20px 0 50px rgba(0,0,0,.35); font-family: 'Montserrat', sans-serif; }
.rpn-open .rpn-ov { opacity: 1; visibility: visible; }
.rpn-open .rpn-panel { transform: none; }
.rpn-open, .rpn-open body { overflow: hidden; }
.rpn-head { display: flex; align-items: center; justify-content: space-between; padding: 22px 26px; border-bottom: 1px solid rgba(201,169,110,.18); }
.rpn-head span { font-size: 12px; letter-spacing: .24em; text-transform: uppercase; color: #C9A96E; font-weight: 600; }
.rpn-x { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: none; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.rpn-x:hover { border-color: #C9A96E; color: #C9A96E; }
.rpn-body { flex: 1; overflow-y: auto; padding: 8px 26px 20px; }
.rpn-sec { padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.rpn-sec:last-child { border-bottom: 0; }
.rpn-sec h4 { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: #C9A96E; font-weight: 600; margin: 0 0 10px; }
.rpn-sec a { display: block; color: rgba(255,255,255,.88); text-decoration: none; font-size: 15px; padding: 9px 0; transition: color .2s, padding-left .2s; }
.rpn-sec a:hover { color: #C9A96E; padding-left: 6px; }
.rpn-main a { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 24px; font-weight: 500; color: #fff; padding: 6px 0; }
.rpn-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.rpn-foot { padding: 18px 26px 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; border-top: 1px solid rgba(201,169,110,.18); }
.rpn-foot a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; }
.rpn-call { background: #C9A96E; color: #0F1F3D; }
.rpn-sms { border: 1px solid rgba(255,255,255,.4); color: #fff; }
.rpn-sms:hover { border-color: #C9A96E; color: #C9A96E; }

/* 4) Celular y tablet: solo logo + boton Menu */
.rpn-mainlinks { display: none; }
@media (max-width: 900px) {
  .rpn nav .nav-links { display: none !important; }
  .rpn-mainlinks { display: block; }
  .rpn-btn { padding: 9px 14px 9px 18px; font-size: 13px; letter-spacing: .12em; }
}
@media (prefers-reduced-motion: reduce) { .rpn-panel, .rpn-ov { transition: none; } }

/* contenedor de la derecha limpio (sin cajas de fondo de los botones anteriores) */
.rpn nav .nav-cta, .rpn nav .nav-actions { background: none !important; box-shadow: none !important; border: 0 !important; padding: 0 !important; gap: 10px; align-items: center; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
/* con el menu abierto se esconden los botones flotantes (WhatsApp, busqueda) */
.rpn-open a[href^="https://wa.me"], .rpn-open .hsb-sticky, .rpn-open .whatsapp-float { visibility: hidden !important; }

/* enlaces visibles un poco mas grandes (2 puntos) en computadora */
@media (min-width: 901px) {
  .rpn nav .nav-links { gap: 34px !important; }
  .rpn nav .nav-links > a, .rpn nav .nav-links > li > a { font-size: 13px !important; letter-spacing: .08em !important; }
}