/* ============================================================
   Pisova · ui-modern.css
   Refresco visual de la barra superior y de los botones.
   Se carga al final de <body> para ganar a los <style> en linea.
   REVERTIR: borra la linea <link ... ui-modern.css> de la pagina.
   ============================================================ */

:root{
  --pv-ink:#0f1222;
  --pv-ink-soft:#5a6475;
  --pv-line:rgba(16,24,40,.09);
  --pv-r:12px;
  --pv-ease:cubic-bezier(.22,1,.36,1);
  --pv-t:.18s var(--pv-ease);
  --pv-ring:0 0 0 3px rgba(233,69,96,.28);
  --pv-e1:0 1px 2px rgba(16,24,40,.06);
  --pv-e2:0 1px 2px rgba(16,24,40,.06),0 10px 24px -12px rgba(16,24,40,.40);
  --pv-accent-grad:linear-gradient(180deg,#f0576f 0%,#e0374f 100%);
  --pv-accent-e:inset 0 1px 0 rgba(255,255,255,.20),0 1px 2px rgba(16,24,40,.10),0 8px 20px -8px rgba(233,69,96,.55);
  --pv-accent-e-hover:inset 0 1px 0 rgba(255,255,255,.20),0 1px 2px rgba(16,24,40,.10),0 14px 28px -10px rgba(233,69,96,.65);
}

/* ---------- 1. BARRA SUPERIOR ---------- */

.navbar{
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid transparent;
  box-shadow:none;
  transition:background var(--pv-t),box-shadow var(--pv-t),border-color var(--pv-t);
}
.navbar.scrolled{
  background:rgba(255,255,255,.86);
  border-bottom-color:var(--pv-line);
  box-shadow:0 8px 24px -18px rgba(16,24,40,.55);
}
.navbar-inner{height:72px;padding:0 20px;gap:14px}

/* Logo: tinta solida en vez de texto con degradado */
.logo-mark{height:40px}
.logo-mark svg{height:36px;filter:none}
.logo-text .logo-name{
  font-size:1.26rem;letter-spacing:-.035em;
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  -webkit-text-fill-color:var(--pv-ink);color:var(--pv-ink);
}
.logo-text .logo-tagline{font-size:.62rem;letter-spacing:.12em;color:#98a2b3;-webkit-text-fill-color:#98a2b3}

/* Enlaces: mismo peso visual + pastilla al pasar el raton */
.nav-links{gap:2px;align-items:center}
.navbar .nav-links>a,
.navbar .nav-dropdown-trigger{
  font-size:.9rem;font-weight:500;line-height:1;
  color:var(--pv-ink-soft);
  padding:9px 12px;border-radius:10px;
  transition:color var(--pv-t),background-color var(--pv-t);
}
.navbar .nav-links>a::after,
.navbar .nav-dropdown-trigger::after{display:none!important}
.navbar .nav-links>a:hover,
.navbar .nav-dropdown-trigger:hover{color:var(--pv-ink);background:rgba(16,24,40,.055)}

/* "Valorar vivienda": CTA secundario suave */
.navbar .nav-links>a.nav-valoracion{
  color:var(--accent)!important;font-weight:600;
  background:rgba(233,69,96,.08);
}
.navbar .nav-links>a.nav-valoracion:hover{background:rgba(233,69,96,.14);color:var(--accent-hover)!important}

/* CTA principal */
.navbar .nav-cta{
  margin-left:8px;
  padding:10px 18px!important;
  font-size:.9rem!important;font-weight:600!important;letter-spacing:0;
  border-radius:var(--pv-r);
  color:#fff!important;
  background:var(--pv-accent-grad);
  box-shadow:var(--pv-accent-e);
  transition:transform var(--pv-t),box-shadow var(--pv-t),filter var(--pv-t);
}
.navbar .nav-cta:hover{
  background:var(--pv-accent-grad);filter:brightness(1.05);
  transform:translateY(-1px);box-shadow:var(--pv-accent-e-hover);
}
.navbar .nav-cta:active{transform:translateY(0) scale(.985)}

/* Buscador integrado */
.nav-search{
  background:#fff;border:1px solid var(--pv-line);border-radius:var(--pv-r);
  box-shadow:var(--pv-e1);padding:4px 5px 4px 14px;
  transition:border-color var(--pv-t),box-shadow var(--pv-t);
}
.nav-search:focus-within{border-color:rgba(233,69,96,.45);box-shadow:var(--pv-ring)}
.nav-search-clear{border-radius:8px}
.nav-search-clear:hover{background:rgba(16,24,40,.06)}

/* Boton hamburguesa */
.mobile-toggle{
  width:40px;height:40px;gap:4px;padding:0;
  align-items:center;justify-content:center;
  border:1px solid var(--pv-line);border-radius:10px;
  background:rgba(255,255,255,.75);
}
.mobile-toggle span{width:18px;height:2px}

/* Desplegable */
.nav-dropdown-menu{
  border-radius:18px;border:1px solid var(--pv-line);padding:22px;margin-top:14px;
  box-shadow:0 24px 52px -20px rgba(16,24,40,.32),0 2px 6px rgba(16,24,40,.04);
}
.nav-dropdown:hover .nav-dropdown-menu{margin-top:10px}
.nav-dropdown-menu::before{display:none}
.dropdown-tab h4{
  color:var(--pv-ink);font-size:.72rem;letter-spacing:.08em;
  border-bottom:none;padding-bottom:2px;margin-bottom:6px;
}
.dropdown-tab a{border-radius:8px;padding:6px 10px;margin:0 -10px;font-size:.85rem}
.dropdown-tab a:hover{background:rgba(16,24,40,.05);color:var(--pv-ink);padding-left:10px}
.dropdown-more{margin-top:10px!important;padding:8px 10px!important;border-top:1px solid var(--border-light);border-radius:8px}
.dropdown-cta{
  border-radius:10px;padding:11px 14px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 6px 16px -8px rgba(16,24,40,.45);
  transition:transform var(--pv-t),box-shadow var(--pv-t),filter var(--pv-t);
}
.dropdown-cta:hover{filter:brightness(1.05);transform:translateY(-1px);padding-left:14px!important}

/* ---------- 2. BOTONES ---------- */

/* Primarios */
.btn-search,
.btn-submit,
.valora-btn,
.dh-cta-btn,
.property-page .detail-actions .btn-contact{
  border-radius:var(--pv-r);
  background:var(--pv-accent-grad);
  color:#fff;font-weight:600;letter-spacing:0;
  border:none;
  box-shadow:var(--pv-accent-e);
  transition:transform var(--pv-t),box-shadow var(--pv-t),filter var(--pv-t);
}
.btn-search:hover,
.btn-submit:hover,
.valora-btn:hover,
.dh-cta-btn:hover,
.property-page .detail-actions .btn-contact:hover{
  background:var(--pv-accent-grad);filter:brightness(1.05);
  transform:translateY(-1px);box-shadow:var(--pv-accent-e-hover);
}
.btn-search:active,
.btn-submit:active,
.valora-btn:active,
.dh-cta-btn:active,
.property-page .detail-actions .btn-contact:active{transform:translateY(0) scale(.99)}

/* Secundarios sobre fondo claro */
.btn-light,
.btn-publish-hero{
  border-radius:var(--pv-r);
  background:#fff;color:var(--accent);
  border:1px solid rgba(16,24,40,.08);
  font-weight:600;
  box-shadow:var(--pv-e2);
  animation:none;
  transition:transform var(--pv-t),box-shadow var(--pv-t),background-color var(--pv-t),color var(--pv-t);
}
.btn-light:hover,
.btn-publish-hero:hover{
  background:#fff;color:var(--accent-hover);
  transform:translateY(-1px);
  box-shadow:0 1px 2px rgba(16,24,40,.08),0 16px 32px -14px rgba(16,24,40,.55);
}
.btn-light:active,.btn-publish-hero:active{transform:translateY(0) scale(.99)}
.btn-publish-hero{font-size:1.02rem;padding:15px 30px}

/* Contorno sobre fondo oscuro */
.btn-support-hero,
.btn-valoracion-hero{
  border-radius:var(--pv-r);
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.30);
  color:#fff;font-weight:600;
  box-shadow:none;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:transform var(--pv-t),background-color var(--pv-t),border-color var(--pv-t);
}
.btn-support-hero:hover,
.btn-valoracion-hero:hover{
  background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.55);
  color:#fff;transform:translateY(-1px);box-shadow:none;
}
.btn-support-hero:active,.btn-valoracion-hero:active{transform:translateY(0) scale(.99)}

/* Secundario neutro */
.property-page .detail-actions .btn-share{
  border-radius:var(--pv-r);
  border:1px solid rgba(16,24,40,.10);
  box-shadow:var(--pv-e1);
  font-weight:600;
  transition:transform var(--pv-t),box-shadow var(--pv-t),border-color var(--pv-t),color var(--pv-t);
}
.property-page .detail-actions .btn-share:hover{
  border-color:rgba(16,24,40,.22);color:var(--pv-ink);
  transform:translateY(-1px);box-shadow:var(--pv-e2);
}
.property-page .detail-url-bar .copy-btn{
  border-radius:10px;background:var(--pv-ink);
  box-shadow:var(--pv-e1);transition:transform var(--pv-t),filter var(--pv-t);
}
.property-page .detail-url-bar .copy-btn:hover{background:var(--pv-ink);filter:brightness(1.6);transform:translateY(-1px)}

/* Chips y filtros (mantienen forma de pastilla) */
.cat-pill{
  border-radius:999px;border:1px solid var(--pv-line);background:#fff;
  box-shadow:var(--pv-e1);font-weight:550;
  transition:transform var(--pv-t),box-shadow var(--pv-t),background-color var(--pv-t),border-color var(--pv-t),color var(--pv-t);
}
.cat-pill:hover,.cat-pill.active{
  background:var(--accent);border-color:var(--accent);color:#fff;
  transform:translateY(-1px);box-shadow:0 8px 18px -10px rgba(233,69,96,.75);
}
.view-toggle-btn{border-radius:999px;transition:background-color var(--pv-t),color var(--pv-t),box-shadow var(--pv-t)}
.view-toggle-btn.active{background:#fff;color:var(--pv-ink);box-shadow:var(--pv-e1)}
.pv-tab{border-radius:8px 8px 0 0;transition:color var(--pv-t),border-color var(--pv-t)}

/* ---------- 3. FOCO Y ACCESIBILIDAD ---------- */

.navbar a:focus-visible,
.navbar button:focus-visible,
.navbar input:focus-visible,
[class*="btn-"]:focus-visible,
.cat-pill:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

@media (prefers-reduced-motion:reduce){
  .navbar *,[class*="btn-"],.cat-pill,.dropdown-cta{transition-duration:.01ms!important;animation:none!important}
  .navbar .nav-cta:hover,[class*="btn-"]:hover,.cat-pill:hover{transform:none!important}
}

/* ---------- 3B. TIPOGRAFIA (mas cuerpo y peso) ----------
   Usa Outfit (geometrica, ya cargada) en menu y botones,
   con pesos mas altos. No descarga ninguna fuente nueva.   */

.navbar .nav-links>a,
.navbar .nav-dropdown-trigger{
  font-family:'Outfit','Inter',system-ui,sans-serif;
  font-weight:600;font-size:.94rem;letter-spacing:-.005em;
}
.navbar .nav-links>a.nav-valoracion{font-weight:700}
.navbar .nav-cta{
  font-family:'Outfit','Inter',system-ui,sans-serif;
  font-weight:700!important;font-size:.94rem!important;
}
.nav-search-input{font-family:'Outfit','Inter',system-ui,sans-serif;font-weight:500;font-size:.94rem}
.nav-search-input::placeholder{font-weight:500}
.logo-text .logo-name{font-weight:800}
.logo-text .logo-tagline{font-weight:600}

/* Botones: Outfit 700 */
.btn-search,
.btn-submit,
.valora-btn,
.dh-cta-btn,
.btn-light,
.btn-support-hero,
.btn-valoracion-hero,
.property-page .detail-actions .btn-contact,
.property-page .detail-actions .btn-share,
.property-page .detail-url-bar .copy-btn{
  font-family:'Outfit','Inter',system-ui,sans-serif;
  font-weight:700;letter-spacing:-.005em;
}
.btn-publish-hero{
  font-family:'Outfit','Inter',system-ui,sans-serif;
  font-weight:800;letter-spacing:-.01em;
}
.dropdown-cta{font-family:'Outfit','Inter',system-ui,sans-serif;font-weight:700!important}
.cat-pill,.view-toggle-btn,.pv-tab{
  font-family:'Outfit','Inter',system-ui,sans-serif;font-weight:600;
}

/* Titulares y menu desplegable */
h1,h2,h3,h4{font-weight:800;letter-spacing:-.025em}
.dropdown-tab h4{font-family:'Outfit','Inter',system-ui,sans-serif;font-weight:700}
.dropdown-tab a{font-weight:600}
.dropdown-more{font-weight:700!important}

/* ---------- 4. MOVIL ---------- */

@media (max-width:900px){
  .navbar-inner{height:64px;padding:0 16px;gap:10px}
  .logo-mark{height:34px}
  .logo-mark svg{height:30px}
  .logo-text .logo-name{font-size:1.08rem}
  .nav-links{
    width:min(86vw,320px);padding:84px 16px 24px;gap:4px;
    background:#fff;border-left:1px solid var(--pv-line);
    box-shadow:-28px 0 64px -28px rgba(16,24,40,.5);
  }
  .nav-dropdown{width:100%}
  .navbar .nav-links>a,
  .navbar .nav-dropdown-trigger{
    display:block;width:100%;
    padding:12px 14px;border-radius:12px;font-size:.98rem;
  }
  .navbar .nav-cta{
    display:flex;justify-content:center;width:100%;
    margin:12px 0 0;padding:14px 18px!important;font-size:1rem!important;
  }
  .btn-search{border-radius:var(--pv-r)}
}