/* ==========================================================================
Espacius Bienes Raíces — Hoja de estilos principal
========================================================================== */
:root{
--blue:#1A56A8;--blue-dark:#133F80;--gray:#555B6E;--gray-dark:#2D2D2D;
--gray-light:#F5F7FA;--accent:#E8F0FE;--border:#E2E8F0;
--green:#22C55E;--orange:#F59E0B;--red:#EF4444;
--shadow:0 4px 24px rgba(26,86,168,.10);
--shadow-sm:0 2px 8px rgba(26,86,168,.08);
--font:'Segoe UI',system-ui,-apple-system,sans-serif;
--nav-h:60px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--nav-h)}
body{font-family:var(--font);color:var(--gray-dark);background:#fff;overflow-x:hidden;-webkit-text-size-adjust:100%;padding-top:var(--nav-h)}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:var(--font);cursor:pointer}
/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:#fff;border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm);transition:background .4s ease,backdrop-filter .4s ease,box-shadow .4s ease,border-color .4s ease}
.nav-inner{max-width:1200px;margin:0 auto;padding:0 16px;display:flex;align-items:center;justify-content:space-between;height:60px}
.nav-logo{display:flex;align-items:center}
.nav-logo svg{height:42px;width:auto}
.nav-links{display:flex;gap:2px;align-items:center}
.nav-links a{color:var(--gray);font-size:13px;font-weight:500;padding:6px 10px;border-radius:8px;transition:.2s;white-space:nowrap}
.nav-links a:hover{color:var(--blue);background:var(--accent)}
.nav-account{background:var(--blue)!important;color:#fff!important;padding:8px 14px!important;font-weight:700!important;border-radius:8px!important}
.nav-account:hover{background:var(--blue-dark)!important;color:#fff!important}
/* ============================================================
MENÚ MÓVIL — Checkbox hack (funciona sin JS)
============================================================
Estructura HTML:
El checkbox se oculta visualmente. Cuando :checked, los siguientes
hermanos cambian: muestra overlay y mobile-menu. Funciona en TODOS
los navegadores móviles, incluso si el JavaScript falla. */
.esp-menu-checkbox{
position:absolute;
width:1px;height:1px;
margin:-1px;padding:0;
overflow:hidden;clip:rect(0 0 0 0);
white-space:nowrap;border:0;
opacity:0;pointer-events:none;
}
/* Hamburger button (label) — diseño limpio, tap target ≥44px */
.hamburger{
display:none; /* oculto en desktop por default */
flex-direction:column;
justify-content:center;
align-items:center;
gap:5px;
width:44px;height:44px; /* tap target táctil mínimo */
cursor:pointer;
background:transparent;
border:0;
border-radius:8px;
-webkit-tap-highlight-color:transparent;
touch-action:manipulation; /* elimina delay de 300ms en mobile */
user-select:none;
-webkit-user-select:none;
position:relative;
z-index:101; /* siempre por encima */
}
.hamburger span{
display:block;
width:22px;height:2.5px;
background:var(--gray-dark);
border-radius:2px;
transition:transform .25s ease,opacity .15s ease;
pointer-events:none; /* clicks pasan al label */
}
.hamburger:active{background:rgba(0,0,0,.05)}
.hamburger:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* Animación a "X" cuando el menú está abierto */
.esp-menu-checkbox:checked ~ nav .hamburger span:nth-child(1){
transform:translateY(7.5px) rotate(45deg);
}
.esp-menu-checkbox:checked ~ nav .hamburger span:nth-child(2){
opacity:0;
}
.esp-menu-checkbox:checked ~ nav .hamburger span:nth-child(3){
transform:translateY(-7.5px) rotate(-45deg);
}
/* Overlay oscuro — click cierra el menú */
.esp-menu-overlay{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.45);
z-index:98;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
animation:espOverlayFade .25s ease-out;
}
@keyframes espOverlayFade{from{opacity:0}to{opacity:1}}
/* Panel del menú móvil */
.mobile-menu{
display:none;
position:fixed;
top:60px;
left:0;right:0;
bottom:0;
background:#fff;
padding:14px;
z-index:99;
flex-direction:column;
gap:4px;
overflow-y:auto;
-webkit-overflow-scrolling:touch;
animation:espMenuSlide .3s cubic-bezier(.4,0,.2,1);
/* iOS safe-area */
padding-bottom:calc(14px + env(safe-area-inset-bottom));
}
@keyframes espMenuSlide{from{transform:translateY(-12px);opacity:0}to{transform:translateY(0);opacity:1}}
.mobile-menu a{
color:var(--gray-dark);
font-size:16px;
padding:14px;
min-height:48px;
border-radius:10px;
display:flex;
align-items:center;
font-weight:500;
border-bottom:1px solid var(--border);
text-decoration:none;
-webkit-tap-highlight-color:rgba(26,86,168,.15);
touch-action:manipulation;
cursor:pointer;
transition:background .15s ease;
}
.mobile-menu a:active{background:var(--accent)}
/* Mostrar overlay y menú cuando el checkbox está marcado */
.esp-menu-checkbox:checked ~ .esp-menu-overlay{display:block}
.esp-menu-checkbox:checked ~ .mobile-menu{display:flex}
/* Bloqueo de scroll del body cuando el menú está abierto (CSS-only) */
.esp-menu-checkbox:checked ~ * .mobile-menu,
html:has(.esp-menu-checkbox:checked){overflow:hidden}
/* Mostrar hamburger en móvil, ocultar nav-links */
@media(max-width:900px){
.nav-links{display:none}
.hamburger{display:flex}
}
/* ============================================================
HERO CINEMATOGRÁFICO PREMIUM — Video bg + Glassmorphism + Motion
============================================================ */
.hero{
position:relative;
min-height:100vh;
min-height:100svh;
margin-top:calc(var(--nav-h) * -1); /* extend behind fixed nav */
display:flex;
align-items:flex-end;
justify-content:flex-start;
overflow:hidden;
isolation:isolate;
background:linear-gradient(135deg,#06122B 0%,#0D2F5E 35%,#1A56A8 75%,#2E72C9 100%);
}
/* Video layer */
.hero-video-wrap{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-video{
position:absolute;inset:0;width:100%;height:100%;
object-fit:cover;object-position:center;
transform:scale(1.04);
opacity:0;
animation:hero-video-fade 2.4s ease-out .3s forwards;
will-change:transform,opacity;
background:#0D2F5E;
}
@keyframes hero-video-fade{to{opacity:1}}
/* Overlay system */
.hero-overlay{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero-overlay-gradient{
background:
linear-gradient(180deg,
rgba(6,18,43,.28) 0%,
rgba(6,18,43,.08) 25%,
rgba(6,18,43,.55) 75%,
rgba(6,18,43,.92) 100%),
linear-gradient(120deg,
rgba(13,47,94,.50) 0%,
rgba(26,86,168,.18) 50%,
rgba(46,114,201,.08) 100%);
}
.hero-overlay-vignette{
background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.45) 100%);
}
.hero-overlay-noise{
background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.7'/%3E%3C/svg%3E");
opacity:.06;
mix-blend-mode:overlay;
}
.hero-overlay-depth{
background:
radial-gradient(circle at 20% 30%,rgba(59,130,246,.22),transparent 45%),
radial-gradient(circle at 80% 70%,rgba(139,92,246,.14),transparent 45%);
}
/* Ambient floating orbs */
.hero-orb{
position:absolute;border-radius:50%;filter:blur(80px);
z-index:1;pointer-events:none;opacity:.45;will-change:transform;
}
.hero-orb-1{
width:480px;height:480px;
background:radial-gradient(circle,#3B82F6 0%,transparent 70%);
top:-120px;left:-120px;
animation:hero-orb-float-1 18s ease-in-out infinite;
}
.hero-orb-2{
width:560px;height:560px;
background:radial-gradient(circle,#8B5CF6 0%,transparent 70%);
bottom:-180px;right:-180px;
animation:hero-orb-float-2 22s ease-in-out infinite;
}
@keyframes hero-orb-float-1{
0%,100%{transform:translate(0,0) scale(1)}
50%{transform:translate(40px,30px) scale(1.1)}
}
@keyframes hero-orb-float-2{
0%,100%{transform:translate(0,0) scale(1)}
50%{transform:translate(-50px,-40px) scale(1.15)}
}
/* Content - bottom left */
.hero-inner{
position:relative;z-index:2;
max-width:1200px;width:100%;margin:0 auto;
padding:calc(var(--nav-h) + 80px) 24px 96px;
display:flex;flex-direction:column;align-items:flex-start;
}
/* Badge - glassmorphic */
.hero-badge{
display:inline-flex;align-items:center;gap:6px;
background:rgba(255,255,255,.08);
border:1px solid rgba(255,255,255,.20);
-webkit-backdrop-filter:blur(12px) saturate(140%);
backdrop-filter:blur(12px) saturate(140%);
color:#fff;font-size:12px;font-weight:500;
padding:8px 16px;border-radius:24px;
letter-spacing:.5px;margin-bottom:28px;
opacity:0;transform:translateY(20px);
animation:hero-reveal 1s cubic-bezier(.22,1,.36,1) .6s forwards;
box-shadow:0 4px 16px rgba(0,0,0,.12),0 1px 0 rgba(255,255,255,.08) inset;
}
/* Cinematic headline */
.hero h1{
color:#fff;
font-size:clamp(38px,7.5vw,86px);
font-weight:700;line-height:1.02;letter-spacing:-.03em;
max-width:900px;margin-bottom:22px;
font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Inter','Segoe UI',system-ui,sans-serif;
text-shadow:0 4px 30px rgba(0,0,0,.25);
opacity:0;transform:translateY(30px);
animation:hero-reveal 1.2s cubic-bezier(.22,1,.36,1) .8s forwards;
}
.hero-h1-accent{
background:linear-gradient(135deg,#fff 0%,#dbeafe 45%,#93c5fd 100%);
-webkit-background-clip:text;background-clip:text;
-webkit-text-fill-color:transparent;color:transparent;
display:inline-block;
}
/* Subhead */
.hero p{
color:rgba(255,255,255,.85);
font-size:clamp(15px,1.55vw,19px);
font-weight:400;line-height:1.6;letter-spacing:.01em;
max-width:620px;margin-bottom:42px;
text-shadow:0 2px 12px rgba(0,0,0,.18);
opacity:0;transform:translateY(20px);
animation:hero-reveal 1s cubic-bezier(.22,1,.36,1) 1.05s forwards;
}
/* Search box - glassmorphic premium */
.search-box{
background:rgba(255,255,255,.10);
border:1px solid rgba(255,255,255,.22);
-webkit-backdrop-filter:blur(20px) saturate(160%);
backdrop-filter:blur(20px) saturate(160%);
border-radius:16px;padding:8px;
display:flex;gap:6px;max-width:980px;width:100%;
box-shadow:0 24px 60px rgba(0,0,0,.30),0 1px 0 rgba(255,255,255,.10) inset;
flex-wrap:wrap;
opacity:0;transform:translateY(20px);
animation:hero-reveal 1s cubic-bezier(.22,1,.36,1) 1.3s forwards;
}
.search-box select,.search-box input{
background:transparent;border:none;outline:none;
font-size:14px;color:#fff;font-weight:500;font-family:var(--font);
padding:13px 14px;flex:1;min-width:130px;
border-radius:10px;cursor:pointer;
transition:background .25s ease;
-webkit-appearance:none;-moz-appearance:none;appearance:none;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat;background-position:right 12px center;
padding-right:34px;
}
.search-box select option{color:#1f2937;background:#fff;font-weight:500}
.search-box select::placeholder,.search-box input::placeholder{color:rgba(255,255,255,.65)}
.search-box select:hover,.search-box input:hover{background:rgba(255,255,255,.08)}
.search-box select:focus,.search-box input:focus{background:rgba(255,255,255,.12)}
/* Search button - premium gradient + shimmer */
.search-btn{
position:relative;overflow:hidden;
background:linear-gradient(135deg,#3B82F6 0%,#1A56A8 100%);
color:#fff;border:none;
padding:13px 30px;border-radius:10px;
font-size:14px;font-weight:600;letter-spacing:.02em;
white-space:nowrap;cursor:pointer;
transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease;
box-shadow:0 8px 24px rgba(59,130,246,.42);
}
.search-btn::after{
content:'';position:absolute;top:0;left:-100%;
width:100%;height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
transition:left .6s ease;
}
.search-btn:hover{
transform:translateY(-2px);
box-shadow:0 14px 36px rgba(59,130,246,.55);
background:linear-gradient(135deg,#60A5FA 0%,#2563EB 100%);
}
.search-btn:hover::after{left:100%}
.search-btn:active{transform:translateY(0)}
/* Búsqueda por código (hero) */
.code-search{
margin:14px 0 0;width:100%;max-width:980px;align-self:flex-start;
display:flex;flex-direction:column;align-items:center;gap:8px;
opacity:0;transform:translateY(20px);
animation:hero-reveal 1s cubic-bezier(.22,1,.36,1) 1.5s forwards;
}
.code-search-label{color:rgba(255,255,255,.85);font-size:13px;font-weight:500}
.code-search-field{
display:flex;align-items:center;gap:8px;
width:100%;box-sizing:border-box;overflow:hidden;
background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);
-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);
border-radius:16px;padding:8px;box-shadow:0 16px 40px rgba(0,0,0,.28);
}
.code-prefix{
flex:0 0 auto;
display:flex;align-items:center;height:48px;padding:0 12px 0 14px;
color:#fff;font-weight:700;font-size:15px;letter-spacing:.04em;line-height:1;
border-right:1px solid rgba(255,255,255,.18);box-sizing:border-box;
}
.code-search-field input{
flex:1 1 auto;min-width:0;width:auto;
height:48px;min-height:48px;max-height:48px;box-sizing:border-box;
-webkit-appearance:none;appearance:none;vertical-align:middle;
background:transparent;border:none;outline:none;
color:#fff;font-size:15px;font-weight:600;font-family:var(--font);
padding:0 8px;letter-spacing:.06em;line-height:48px;margin:0;
}
.code-search-field input::placeholder{color:rgba(255,255,255,.5);font-weight:500;letter-spacing:normal}
.code-search-btn{
flex:0 0 auto;
display:inline-flex;align-items:center;justify-content:center;align-self:center;
height:48px;min-height:48px;max-height:48px;box-sizing:border-box;padding:0 20px;margin:0;
-webkit-appearance:none;appearance:none;vertical-align:middle;
background:linear-gradient(135deg,#3B82F6 0%,#1A56A8 100%);
color:#fff;border:none;border-radius:10px;line-height:1;
font-size:14px;font-weight:600;font-family:var(--font);white-space:nowrap;cursor:pointer;
transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease;
box-shadow:0 6px 18px rgba(59,130,246,.35);
}
.code-search-btn:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(59,130,246,.55)}
.code-search-btn:active{transform:translateY(0)}
.code-search-msg{color:#FFD9A8;font-size:13px;min-height:18px;font-weight:500}
@media (min-width:1000px){
.code-search{align-items:flex-end}
.code-search-label{align-self:flex-end;margin-right:2px}
.code-search-field{width:386px}
}
@media (max-width:520px){
.code-search-btn{padding:0 14px;font-size:13px}
}
/* Scroll cue */
.hero-scroll{
position:absolute;bottom:22px;left:50%;
transform:translateX(-50%);z-index:3;
display:flex;flex-direction:column;align-items:center;gap:10px;
color:rgba(255,255,255,.65);
font-size:10px;text-transform:uppercase;letter-spacing:2.5px;font-weight:500;
pointer-events:none;
opacity:0;animation:hero-reveal 1s ease 1.8s forwards;
}
.hero-scroll-line{
width:1px;height:36px;
background:linear-gradient(180deg,transparent,#fff);
transform-origin:top;
animation:hero-scroll-line 2.4s ease-in-out infinite;
}
@keyframes hero-scroll-line{
0%,100%{transform:scaleY(.35)}
50%{transform:scaleY(1)}
}
/* Reveal keyframe */
@keyframes hero-reveal{to{opacity:1;transform:translateY(0)}}
/* Subtle parallax via CSS variables (set by JS) */
.hero-overlay-depth{
transform:translate3d(calc(var(--hero-px,0) * 14px),calc(var(--hero-py,0) * 14px),0);
transition:transform .3s cubic-bezier(.22,1,.36,1);
}
/* ============================================================
NAV — Glassmorphic over hero / Solid after scroll
============================================================ */
body:not(.nav-scrolled) nav{
background:rgba(13,47,94,.18);
-webkit-backdrop-filter:blur(20px) saturate(160%);
backdrop-filter:blur(20px) saturate(160%);
border-bottom:1px solid rgba(255,255,255,.10);
box-shadow:0 1px 0 rgba(255,255,255,.05) inset;
}
body:not(.nav-scrolled) .nav-links a{color:rgba(255,255,255,.88)}
body:not(.nav-scrolled) .nav-links a:hover{color:#fff;background:rgba(255,255,255,.12)}
body:not(.nav-scrolled) .hamburger span{background:#fff !important}
body:not(.nav-scrolled) .nav-logo-dark{display:none}
body:not(.nav-scrolled) .nav-logo-light{display:block}
body.nav-scrolled nav{
background:rgba(255,255,255,.94);
-webkit-backdrop-filter:blur(20px) saturate(180%);
backdrop-filter:blur(20px) saturate(180%);
border-bottom:1px solid rgba(0,0,0,.06);
box-shadow:0 4px 24px rgba(0,0,0,.06);
}
.nav-logo-dark{display:block}
.nav-logo-light{display:none}
/* Smooth premium hover on nav links */
.nav-links a{transition:color .25s ease,background .25s ease,transform .25s ease}
.nav-links a:not(.nav-account):not(.nav-valuador):hover{transform:translateY(-1px)}
/* Reduced motion */
@media (prefers-reduced-motion: reduce){
.hero-badge,.hero h1,.hero p,.search-box,.hero-scroll,.hero-video{
animation:none !important;opacity:1 !important;transform:none !important;
}
.hero-orb-1,.hero-orb-2,.hero-scroll-line{animation:none !important}
.hero-overlay-depth{transition:none !important;transform:none !important}
}
/* ============================================================
HERO — Tablet & Mobile responsive
============================================================ */
@media (max-width:1024px){
.hero h1{font-size:clamp(36px,8vw,68px)}
.hero-inner{padding:calc(var(--nav-h) + 64px) 22px 80px}
}
/* Tablet medio: los 4 selects pasan a 2 columnas; botón ocupa fila completa */
@media (max-width:980px) and (min-width:721px){
.search-box{max-width:560px}
.search-box select{flex:1 1 calc(50% - 6px);min-width:0}
.search-btn{flex:1 1 100%;width:100%}
.search-btn-destacadas{flex:1 1 100%;width:100%}
.code-search{max-width:560px}
}
@media (max-width:720px){
.hero{min-height:88svh;min-height:88vh}
.hero-inner{padding:calc(var(--nav-h) + 48px) 18px 56px}
.hero h1{font-size:clamp(34px,9vw,52px);line-height:1.05;margin-bottom:18px}
.hero p{font-size:15px;margin-bottom:28px}
.hero-badge{font-size:11px;padding:6px 14px;margin-bottom:20px}
.search-box{flex-direction:column;padding:6px;gap:4px}
.search-box select{border-right:none;width:100%;min-width:0}
.search-btn{width:100%;padding:14px}
.hero-scroll{display:none}
.hero-orb-1,.hero-orb-2{filter:blur(60px);opacity:.30}
.hero-orb-1{width:280px;height:280px;top:-80px;left:-80px}
.hero-orb-2{width:320px;height:320px;bottom:-120px;right:-120px}
}
@media (max-width:480px){
.hero-inner{padding:calc(var(--nav-h) + 32px) 16px 44px}
.hero h1{font-size:clamp(32px,10vw,46px)}
}
/* SECTIONS */
section{padding:56px 16px}
.section-inner{max-width:1200px;margin:0 auto}
.section-tag{display:inline-block;background:var(--accent);color:var(--blue);font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}
.section-title{font-size:clamp(22px,4vw,32px);font-weight:700;color:var(--gray-dark);letter-spacing:-.3px;margin-bottom:6px}
.section-sub{color:var(--gray);font-size:14px;line-height:1.6;max-width:520px}
.section-head{margin-bottom:32px}
/* TABS */
.tabs{display:flex;gap:6px;margin-bottom:24px;flex-wrap:wrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.tabs::-webkit-scrollbar{display:none}
.tab-btn{background:var(--gray-light);border:1px solid var(--border);color:var(--gray);padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;white-space:nowrap;flex-shrink:0;transition:.2s}
.tab-btn.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.tab-panel{display:none}.tab-panel.active{display:block}
/* PROPERTY CARDS */
.props-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.prop-card{background:#fff;border-radius:12px;border:1px solid var(--border);overflow:hidden;transition:.25s;box-shadow:var(--shadow-sm)}
.prop-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.carousel{position:relative;height:200px;overflow:hidden;background:linear-gradient(135deg,#1A56A8,#2E72C9)}
.carousel-track{display:flex;height:100%;transition:transform .35s ease}
.carousel-slide{min-width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.carousel-slide svg{opacity:.15;width:70px;height:70px}
.carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.45);color:#fff;border:none;width:32px;height:32px;border-radius:50%;font-size:14px;display:flex;align-items:center;justify-content:center;z-index:5}
.carousel-btn.prev{left:8px}.carousel-btn.next{right:8px}
.carousel-dots{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:5px;z-index:5}
.carousel-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.5);border:none;padding:0;cursor:pointer}
.carousel-dot.active{background:#fff;transform:scale(1.3)}
.prop-badge{position:absolute;top:10px;left:10px;background:rgba(26,86,168,.9);color:#fff;font-size:10px;font-weight:700;padding:4px 10px;border-radius:6px;text-transform:uppercase;letter-spacing:.5px;z-index:5}
.prop-badge.rent{background:rgba(16,120,60,.9)}
.prop-badge.pending{background:rgba(245,158,11,.95)}
.prop-badge.draft{background:rgba(239,68,68,.95)}
.prop-body{padding:14px}
.prop-price{font-size:19px;font-weight:700;color:var(--blue);margin-bottom:3px}
.prop-title{font-size:13px;font-weight:600;color:var(--gray-dark);margin-bottom:5px}
.prop-loc{font-size:12px;color:var(--gray)}
.prop-features{display:flex;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid var(--border);flex-wrap:wrap}
.prop-feat{font-size:11px;color:var(--gray)}
.prop-cta{display:flex;align-items:center;justify-content:center;gap:6px;background:var(--accent);color:var(--blue);font-size:13px;font-weight:600;padding:11px;border-top:1px solid var(--border);transition:.2s}
.prop-cta:hover{background:var(--blue);color:#fff}
/* Empty state for grids */
.props-empty{grid-column:1/-1;text-align:center;padding:50px 20px;background:var(--gray-light);border-radius:12px;border:1px dashed var(--border)}
.props-empty-icon{font-size:42px;margin-bottom:8px;opacity:.5}
.props-empty-title{font-size:14px;font-weight:600;color:var(--gray-dark);margin-bottom:4px}
.props-empty-sub{font-size:12px;color:var(--gray)}
/* CIUDAD MADERAS */
.cm-section{background:linear-gradient(135deg,#0A1F3D,#1A56A8);color:#fff}
.cm-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.cm-features{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}
.cm-feat{background:rgba(255,255,255,.1);border-radius:10px;padding:14px;border:1px solid rgba(255,255,255,.15)}
.cm-feat-icon{font-size:20px;margin-bottom:6px}
.cm-feat-title{font-size:13px;font-weight:700;margin-bottom:3px}
.cm-feat-text{font-size:11px;color:rgba(255,255,255,.65);line-height:1.5}
.cm-stats{background:rgba(255,255,255,.08);border-radius:14px;padding:28px;border:1px solid rgba(255,255,255,.15)}
.cm-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cm-stat{text-align:center;padding:16px;background:rgba(255,255,255,.08);border-radius:10px}
.cm-stat-num{font-size:28px;font-weight:700}
.cm-stat-lbl{font-size:10px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.5px;margin-top:3px}
/* AGENDAR */
.agenda-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.agenda-step{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px}
.step-num{width:36px;height:36px;background:var(--accent);color:var(--blue);font-size:15px;font-weight:700;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.agenda-card{background:var(--gray-light);border-radius:14px;padding:28px;border:1px solid var(--border)}
/* FORMS */
.form-group{margin-bottom:12px}
.form-group label{display:block;font-size:11px;font-weight:600;color:var(--gray);margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-size:14px;outline:none;font-family:var(--font);color:var(--gray-dark);background:#fff;-webkit-appearance:none}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,86,168,.1)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn-primary{background:var(--blue);color:#fff;border:none;width:100%;padding:13px;border-radius:8px;font-size:14px;font-weight:700}
.btn-primary:hover{background:var(--blue-dark)}
.btn-primary:disabled{opacity:.6;cursor:not-allowed}
/* NEWS */
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.news-card{border-radius:12px;border:1px solid var(--border);overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);transition:.25s}
.news-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.news-img{height:150px;background:linear-gradient(135deg,#1A56A8,#2E72C9);overflow:hidden}
.news-img img{width:100%;height:100%;object-fit:cover}
.news-body{padding:16px}
.news-cat{display:inline-block;background:var(--accent);color:var(--blue);font-size:10px;font-weight:700;padding:3px 8px;border-radius:5px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
.news-title{font-size:14px;font-weight:700;line-height:1.4;margin-bottom:6px;color:var(--gray-dark)}
.news-excerpt{font-size:12px;color:var(--gray);line-height:1.5;margin-bottom:8px}
.news-meta{font-size:11px;color:var(--gray);margin-bottom:6px}
.news-link{font-size:12px;color:var(--blue);font-weight:600}
.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--blue);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 12px}
.spin-sm{width:22px;height:22px;border:2px solid var(--border);border-top-color:var(--blue);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto}
@keyframes spin{to{transform:rotate(360deg)}}
/* CHAT */
.chat-box{background:#fff;border-radius:14px;box-shadow:var(--shadow);overflow:hidden;border:1px solid var(--border);max-width:900px;margin:0 auto}
.chat-header{background:linear-gradient(135deg,var(--blue-dark),var(--blue));padding:14px 18px;display:flex;align-items:center;gap:10px}
.chat-msgs{height:320px;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.chat-msg{max-width:85%;padding:11px 14px;border-radius:12px;font-size:13px;line-height:1.5;word-wrap:break-word}
.chat-msg.bot{background:var(--accent);color:var(--gray-dark);align-self:flex-start;border-bottom-left-radius:4px}
.chat-msg.user{background:var(--blue);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.typing-dots{display:flex;gap:4px}
.typing-dots span{width:6px;height:6px;background:var(--blue);border-radius:50%;animation:bounce .8s infinite}
.typing-dots span:nth-child(2){animation-delay:.15s}
.typing-dots span:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-6px)}}
.chat-sugs{display:flex;gap:6px;padding:0 12px 10px;flex-wrap:wrap}
.chat-sug{background:var(--gray-light);border:1px solid var(--border);color:var(--gray-dark);font-size:11px;padding:6px 10px;border-radius:14px;font-family:var(--font)}
.chat-input-row{display:flex;gap:6px;padding:10px;border-top:1px solid var(--border)}
.chat-input{flex:1;border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:14px;outline:none;font-family:var(--font);min-width:0}
.chat-send{background:var(--blue);color:#fff;border:none;padding:10px 16px;border-radius:8px;font-size:14px}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
/* WHATSAPP */
/* CRITICAL: wa-wrap es position:fixed y se extiende verticalmente para contener al popup,
aunque el popup esté invisible (opacity:0 sigue ocupando espacio). Sin pointer-events:none
absorbería TODOS los toques en su zona (~300x400px en esquina inferior derecha),
bloqueando botones, links del menú móvil y otros elementos debajo. */
.wa-wrap{position:fixed;bottom:20px;right:16px;z-index:200;display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none}
.wa-popup{background:#fff;border-radius:14px;box-shadow:0 8px 40px rgba(0,0,0,.18);width:300px;max-width:calc(100vw - 32px);overflow:hidden;transition:transform .25s,opacity .2s;opacity:0;transform:scale(.85) translateY(8px);pointer-events:none}
.wa-popup.open{opacity:1;transform:scale(1) translateY(0);pointer-events:auto}
.wa-popup-header{background:linear-gradient(135deg,#075E54,#128C7E);padding:14px 16px;display:flex;align-items:center;gap:10px}
.wa-close{margin-left:auto;background:none;border:none;color:rgba(255,255,255,.7);font-size:18px;padding:4px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.wa-body{padding:14px}
.wa-greeting{background:#DCF8C6;border-radius:10px 10px 10px 2px;padding:10px 12px;font-size:13px;color:#1a1a1a;line-height:1.5;margin-bottom:12px}
.wa-opts{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.wa-opt{background:#F0FDF4;border:1px solid #86EFAC;color:#166534;font-size:12px;font-weight:600;padding:8px 10px;border-radius:8px;text-align:left;font-family:var(--font);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.wa-divider{display:flex;align-items:center;gap:8px;margin:8px 0;color:var(--gray);font-size:11px}
.wa-divider::before,.wa-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.wa-input-row{display:flex;gap:5px}
.wa-input{flex:1;border:1px solid var(--border);border-radius:8px;padding:9px 10px;font-size:13px;outline:none;font-family:var(--font);min-width:0}
.wa-send-btn{background:var(--green);color:#fff;border:none;padding:9px 14px;border-radius:8px;font-size:16px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
/* El FAB siempre es clickeable, aunque su contenedor sea pointer-events:none */
.wa-fab{width:56px;height:56px;background:var(--green);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(34,197,94,.45);border:none;position:relative;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;pointer-events:auto}
.wa-fab svg{width:28px;height:28px;fill:#fff;pointer-events:none}
/* FOOTER */
footer{background:#0A1F3D;color:rgba(255,255,255,.8);padding:48px 16px 90px}
.footer-inner{max-width:1200px;margin:0 auto}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;margin-bottom:32px}
.footer-col h5{color:#fff;font-size:12px;font-weight:700;margin-bottom:14px;text-transform:uppercase;letter-spacing:.5px}
.footer-col a{display:block;color:rgba(255,255,255,.55);font-size:13px;margin-bottom:7px;transition:.2s}
.footer-col a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-bottom p{font-size:11px;color:rgba(255,255,255,.35)}
.social-link{width:34px;height:34px;background:rgba(255,255,255,.1);border-radius:8px;display:flex;align-items:center;justify-content:center}
.social-link:hover{background:var(--blue)}
.social-link svg{width:16px;height:16px;fill:#fff}
/* MODAL PROMOVER */
.prom-modal{display:none;position:fixed;inset:0;z-index:500;background:#fff;overflow-y:auto}
.prom-modal.open{display:block}
.prom-modal-bar{background:#fff;border-bottom:1px solid var(--border);padding:14px 20px;position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-sm)}
.prom-modal-content{max-width:1100px;margin:0 auto;padding:28px 16px 60px}
.prom-card{background:#fff;border-radius:14px;padding:28px;box-shadow:var(--shadow);border:1px solid var(--border)}
.prom-step{display:none}.prom-step.active{display:block}
.prom-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:700px;margin:0 auto}
.choice-card{border:2px solid var(--border);border-radius:12px;padding:24px 16px;cursor:pointer;text-align:center;transition:.2s;background:#fff}
.choice-card:hover{border-color:var(--blue);transform:translateY(-3px)}
.choice-icon{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;margin:0 auto 12px;color:#fff}
.choice-icon.b{background:linear-gradient(135deg,#1A56A8,#2E72C9)}
.choice-icon.o{background:linear-gradient(135deg,#F59E0B,#D97706)}
.btn-back{background:var(--gray-light);border:1px solid var(--border);width:32px;height:32px;border-radius:8px;font-size:16px;display:flex;align-items:center;justify-content:center}
.terms-box{background:var(--gray-light);border-radius:10px;padding:16px;border:1px solid var(--border);max-height:260px;overflow-y:auto;font-size:12px;line-height:1.7;margin-bottom:12px}
.terms-box p{margin-bottom:8px}
.terms-box h4{font-size:13px;font-weight:700;color:var(--blue);margin-bottom:8px}
.aviso-morelos{background:#FEF3C7;border:1px solid #F59E0B;border-radius:10px;padding:12px 14px;margin-bottom:14px;display:flex;gap:8px;font-size:12px;color:#92400E;line-height:1.5}
.aviso-morelos strong{display:block;font-size:13px;margin-bottom:2px}
.dropzone{border:2px dashed var(--border);border-radius:10px;padding:18px;text-align:center;cursor:pointer;background:#fff;margin-bottom:10px;transition:.2s}
.dropzone:hover{border-color:var(--blue);background:var(--accent)}
.success-icon{width:64px;height:64px;background:var(--green);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px;margin:0 auto 14px}
.next-steps{background:var(--accent);padding:14px;border-radius:10px;text-align:left;font-size:12px;color:var(--gray-dark);line-height:1.8;margin-bottom:16px}
.next-steps strong{color:var(--blue);display:block;margin-bottom:6px}
/* MODAL TÉRMINOS */
.terms-modal{display:none;position:fixed;inset:0;background:rgba(10,31,61,.6);z-index:600;align-items:center;justify-content:center;padding:20px}
.terms-modal.open{display:flex}
.terms-modal-inner{background:#fff;border-radius:14px;max-width:680px;width:100%;max-height:85vh;display:flex;flex-direction:column;overflow:hidden}
.terms-modal-header{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--accent)}
.terms-modal-body{padding:20px;overflow-y:auto;font-size:13px;line-height:1.7}
.terms-modal-body p{margin-bottom:8px}
/* MODAL MI CUENTA / PANEL ADMIN */
.acc-modal{display:none;position:fixed;inset:0;background:rgba(10,31,61,.7);z-index:550;padding:20px;overflow-y:auto;align-items:flex-start;justify-content:center}
.acc-modal.open{display:flex}
.acc-inner{background:#fff;border-radius:14px;max-width:900px;width:100%;margin:20px 0;box-shadow:0 20px 60px rgba(0,0,0,.3);overflow:hidden}
.acc-header{padding:16px 20px;background:linear-gradient(135deg,var(--blue-dark),var(--blue));color:#fff;display:flex;align-items:center;justify-content:space-between}
.acc-header h3{font-size:16px;font-weight:700;color:#fff}
.acc-close{background:rgba(255,255,255,.2);border:none;color:#fff;width:32px;height:32px;border-radius:8px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.acc-close:hover{background:rgba(255,255,255,.35)}
.acc-body{padding:24px}
.acc-status-banner{padding:14px 16px;border-radius:10px;margin-bottom:16px;font-size:13px;line-height:1.6}
.acc-status-banner.pending{background:#FEF3C7;border:1px solid #F59E0B;color:#92400E}
.acc-status-banner.verified{background:#DCFCE7;border:1px solid #22C55E;color:#166534}
.acc-tabs{display:flex;gap:4px;margin-bottom:18px;border-bottom:1px solid var(--border);overflow-x:auto;-webkit-overflow-scrolling:touch}
.acc-tabs::-webkit-scrollbar{display:none}
.acc-tab{background:none;border:none;padding:10px 14px;font-size:12px;font-weight:600;color:var(--gray);cursor:pointer;white-space:nowrap;border-bottom:3px solid transparent;flex-shrink:0;display:flex;align-items:center;gap:6px}
.acc-tab.active{color:var(--blue);border-bottom-color:var(--blue)}
.acc-tab .badge{background:#EF4444;color:#fff;font-size:10px;padding:1px 6px;border-radius:10px;font-weight:700}
.acc-panel{display:none}
.acc-panel.active{display:block}
.acc-empty{text-align:center;padding:36px 16px;background:var(--gray-light);border-radius:10px;color:var(--gray);font-size:13px}
.acc-empty-icon{font-size:32px;margin-bottom:8px;opacity:.4}
/* Property cards in admin */
.adm-card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:10px;display:flex;gap:12px;align-items:flex-start}
.adm-card-cb{display:flex;align-items:flex-start;padding-top:6px;cursor:pointer;flex-shrink:0}
.adm-card-cb input{width:18px;height:18px;cursor:pointer;accent-color:var(--blue)}
.adm-card.adm-selected{background:#EFF6FF;border-color:var(--blue)}
.adm-bulk-bar{position:sticky;top:0;background:var(--blue);color:#fff;padding:10px 14px;border-radius:8px;margin-bottom:12px;display:none;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;z-index:5;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.adm-bulk-bar.show{display:flex}
.adm-bulk-bar-info{font-size:13px;font-weight:600}
.adm-bulk-bar-actions{display:flex;gap:6px}
.adm-bulk-bar button{background:rgba(255,255,255,.2);color:#fff;border:1px solid rgba(255,255,255,.4);padding:6px 12px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer}
.adm-bulk-bar button:hover{background:rgba(255,255,255,.3)}
.adm-bulk-bar button.btn-bulk-delete{background:#DC2626;border-color:#DC2626}
.adm-bulk-bar button.btn-bulk-delete:hover{background:#B91C1C}
.adm-card-thumb{width:80px;height:80px;border-radius:8px;background:var(--gray-light);overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--gray);font-size:11px;text-align:center}
.adm-card-thumb img{width:100%;height:100%;object-fit:cover}
.adm-card-body{flex:1;min-width:0}
.adm-card-title{font-size:14px;font-weight:700;color:var(--gray-dark);margin-bottom:3px}
.adm-card-meta{font-size:11px;color:var(--gray);line-height:1.5;margin-bottom:6px}
.adm-card-status{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;margin-right:4px}
.adm-card-status.publish{background:#DCFCE7;color:#166534}
.adm-card-status.pending{background:#FEF3C7;color:#92400E}
.adm-card-status.draft{background:#FEE2E2;color:#991B1B}
.adm-card-actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.adm-card-actions button{font-size:11px;padding:5px 10px;border-radius:5px;border:none;cursor:pointer;font-weight:600;font-family:var(--font)}
.btn-approve{background:var(--green);color:#fff}
.btn-reject{background:#EF4444;color:#fff}
.btn-edit{background:var(--blue);color:#fff}
.btn-delete{background:#fff;color:#EF4444;border:1px solid #EF4444 !important}
.btn-photos{background:var(--gray-light);color:var(--gray);border:1px solid var(--border) !important}
/* User cards */
.user-card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:10px}
.user-card-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.user-card-name{font-size:14px;font-weight:700;color:var(--gray-dark)}
.user-card-info{font-size:12px;color:var(--gray);line-height:1.6}
.role-pill{font-size:10px;font-weight:700;padding:3px 8px;border-radius:5px;text-transform:uppercase;letter-spacing:.5px;display:inline-block;margin-right:4px}
.role-pill.pending{background:#FEF3C7;color:#92400E}
.role-pill.asesor{background:#FEF3C7;color:#92400E}
.role-pill.propietario{background:#DBEAFE;color:#1E40AF}
.role-pill.admin{background:#FEE2E2;color:#991B1B}
/* RESPONSIVE */
@media(max-width:900px){
.nav-links{display:none}
.hamburger{display:flex}
.cm-grid,.agenda-grid{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr 1fr}
.prom-paso3-grid{grid-template-columns:1fr!important}
}
@media(max-width:600px){
.props-grid,.news-grid{grid-template-columns:1fr}
.form-row{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr}
.cm-features{grid-template-columns:1fr}
.search-box{flex-direction:column}
.search-box select{border-right:none;border-bottom:1px solid var(--border)}
.search-btn{width:100%}
section{padding:40px 14px}
.prom-choice-grid{grid-template-columns:1fr}
.acc-body{padding:16px}
.adm-card{flex-direction:column}
.adm-card-thumb{width:100%;height:140px}
}
/* ============================================================
TRÁMITES
============================================================ */
.tramites-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-bottom:36px}
.tramite-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px;transition:.25s;box-shadow:var(--shadow-sm)}
.tramite-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--blue)}
.tramite-icon{font-size:34px;margin-bottom:10px}
.tramite-card h3{font-size:15px;font-weight:700;color:var(--gray-dark);margin-bottom:8px;line-height:1.3}
.tramite-card p{font-size:13px;color:var(--gray);line-height:1.6}
.tramites-cta{background:linear-gradient(135deg,var(--blue-dark),var(--blue));color:#fff;padding:36px 28px;border-radius:18px;text-align:center;box-shadow:var(--shadow)}
.tramites-cta h3{font-size:20px;font-weight:700;margin-bottom:10px;max-width:680px;margin-left:auto;margin-right:auto;line-height:1.4}
.tramites-cta p{font-size:14px;color:rgba(255,255,255,.85);max-width:600px;margin:0 auto 22px;line-height:1.6}
.tramites-wa-btn{background:var(--green);color:#fff;border:none;padding:16px 36px;border-radius:50px;font-size:15px;font-weight:700;display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-family:var(--font);box-shadow:0 6px 20px rgba(34,197,94,.4);transition:.25s}
.tramites-wa-btn:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(34,197,94,.55);background:#16A34A}
.tramites-disclaimer{font-size:11px;color:rgba(255,255,255,.65);margin-top:14px}
/* ============================================================
FORM SECTION TITLE (modal de registro unificado)
============================================================ */
.form-section-title{font-size:13px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.5px;margin:18px 0 10px;padding-bottom:6px;border-bottom:2px solid var(--accent)}
.form-section-title:first-child{margin-top:0}
/* ============================================================
FIXES MÓVIL — los menús no funcionaban porque algunos
modales o el botón hamburguesa tenían problemas de stacking.
============================================================ */
/* En móvil aseguramos que los enlaces tengan área de toque suficiente */
@media(max-width:900px){
.nav-inner{padding:0 12px}
.nav-logo svg{height:34px}
}
/* Modal de cuenta y promover en móvil: scroll dentro, no en body */
@media(max-width:600px){
.acc-modal{padding:0;align-items:stretch}
.acc-modal.open{display:block}
.acc-inner{margin:0;border-radius:0;min-height:100vh;max-width:100%;display:flex;flex-direction:column}
.acc-header{position:sticky;top:0;z-index:10}
.acc-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
.prom-modal{padding-bottom:60px}
.prom-modal-bar{padding:12px 14px}
.prom-modal-content{padding:18px 12px 60px}
.prom-card{padding:18px}
.acc-tabs{padding-bottom:2px}
.acc-tab{padding:10px 12px;font-size:11px}
/* Botones tactiles más grandes */
.btn-primary,.search-btn,.tramites-wa-btn{min-height:48px}
.btn-back{width:38px;height:38px}
.wa-fab{width:60px;height:60px}
/* WhatsApp popup ocupa más ancho en móvil */
.wa-popup{width:calc(100vw - 32px)}
.wa-wrap{bottom:14px;right:14px}
/* Hero responsive: handled by dedicated cinematic hero block above */
/* Tabs scroll horizontal limpio */
.tabs{margin-bottom:18px}
.tab-btn{font-size:12px;padding:7px 14px}
}
/* Asegurar que el menú móvil cierre el body scroll */
body.menu-open{overflow:hidden}
/* Touch-friendly cards de propiedades */
@media(hover:none){
.prop-card:hover{transform:none}
.news-card:hover{transform:none}
.tramite-card:hover{transform:none}
}
/* Validador de contraseñas matching */
.pass-match-ok{color:#0a7d33}
.pass-match-bad{color:#c92a2a}
/* Botón destacado del valuador en el nav */
.nav-valuador{background:linear-gradient(135deg,#3B82F6,#8B5CF6)!important;color:#fff!important;padding:6px 14px!important;border-radius:20px!important;font-weight:700!important;font-size:12px!important;box-shadow:0 4px 12px rgba(59,130,246,.3)}
.nav-valuador:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(59,130,246,.5);background:linear-gradient(135deg,#2563EB,#7C3AED)!important;color:#fff!important}
/* ============================================================
LOGO en imagen (header y footer)
============================================================ */
.nav-logo-img{height:46px;width:auto;display:block}
.footer-logo-img{height:80px;width:auto;display:block;margin-bottom:10px}
@media(max-width:600px){
.nav-logo-img{height:38px}
.footer-logo-img{height:64px}
}
/* ============================================================
PASSWORD TOGGLE & FORM HINT
============================================================ */
.password-wrap{position:relative;display:flex;align-items:center}
.password-wrap input{padding-right:48px!important;flex:1}
.password-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:none;font-size:20px;cursor:pointer;padding:8px 10px;border-radius:6px;line-height:1;color:var(--gray);z-index:5;-webkit-tap-highlight-color:rgba(26,86,168,.18);user-select:none;-webkit-user-select:none;touch-action:manipulation}
.password-toggle:hover,.password-toggle:active{background:var(--gray-light);color:var(--blue)}
.form-hint{font-size:11px;color:var(--gray);margin-top:4px;line-height:1.5;font-style:italic}
/* ============================================================
PROP MORE LINK — indicador que la tarjeta es clickeable
============================================================ */
.prop-more-link{font-size:11px;color:var(--blue);font-weight:600;margin-top:8px;padding-top:8px;border-top:1px dashed var(--border);text-align:right;opacity:.85;transition:.2s}
.prop-card:hover .prop-more-link{opacity:1}
/* ============================================================
LIGHTBOX DE PROPIEDAD — modal grande con toda la info
============================================================ */
.prop-lightbox{display:none;position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:700;padding:24px;overflow-y:auto;-webkit-overflow-scrolling:touch}
.prop-lightbox.open{display:flex;align-items:flex-start;justify-content:center}
.prop-lightbox-inner{background:#fff;border-radius:18px;max-width:1100px;width:100%;margin:auto 0;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 30px 80px rgba(0,0,0,.5);position:relative}
.prop-lightbox-close{position:absolute;top:14px;right:14px;background:rgba(0,0,0,.6);color:#fff;border:none;width:42px;height:42px;border-radius:50%;font-size:24px;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center;line-height:1;transition:.2s}
.prop-lightbox-close:hover{background:rgba(0,0,0,.85);transform:rotate(90deg)}
.prop-lightbox-gallery{position:relative;background:#000;height:60vh;max-height:600px;min-height:340px;overflow:hidden}
.prop-lightbox-track{display:flex;height:100%;transition:transform .35s ease}
.prop-lightbox-slide{min-width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#000}
.prop-lightbox-slide img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.prop-lightbox-slide-empty{min-width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#999;gap:14px}
.prop-lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.55);color:#fff;border:none;width:48px;height:48px;border-radius:50%;font-size:24px;cursor:pointer;z-index:5;display:flex;align-items:center;justify-content:center;transition:.2s}
.prop-lightbox-nav:hover{background:rgba(0,0,0,.85);transform:translateY(-50%) scale(1.1)}
.prop-lightbox-nav.prev{left:14px}
.prop-lightbox-nav.next{right:14px}
.prop-lightbox-counter{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.7);color:#fff;font-size:13px;font-weight:600;padding:6px 14px;border-radius:20px;z-index:5}
.prop-lightbox-info{padding:32px;overflow-y:auto}
.plb-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:18px;padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--border)}
.plb-tipo-badge{display:inline-block;background:var(--accent);color:var(--blue);font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px}
.plb-titulo{font-size:clamp(20px,2.5vw,26px);font-weight:700;color:var(--gray-dark);line-height:1.3;margin:0 0 6px;letter-spacing:-.3px}
.plb-loc{color:var(--gray);font-size:14px;margin:0}
.plb-precio{font-size:clamp(22px,3vw,32px);font-weight:700;color:var(--blue);white-space:nowrap}
.plb-feats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin-bottom:24px;padding:18px;background:var(--gray-light);border-radius:12px}
.plb-feat{text-align:center}
.plb-feat-icon{font-size:26px;margin-bottom:4px}
.plb-feat-label{font-size:10px;color:var(--gray);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}
.plb-feat-value{font-size:14px;font-weight:700;color:var(--gray-dark)}
.plb-section{margin-bottom:22px}
.plb-section h3{font-size:15px;font-weight:700;margin-bottom:8px;color:var(--gray-dark)}
.plb-section p{font-size:14px;line-height:1.7;color:var(--gray-dark)}
.plb-section-renta{background:#FEF3C7;border-left:4px solid #F59E0B;padding:14px 16px;border-radius:8px}
.plb-section-renta h3{color:#92400E}
.plb-section-renta p{color:#78350F;white-space:pre-line}
.plb-cta{display:flex;gap:12px;flex-wrap:wrap;padding-top:20px;border-top:1px solid var(--border)}
.plb-btn-wa,.plb-btn-call{flex:1;min-width:200px;text-align:center;padding:16px 24px;border-radius:12px;font-size:14px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s}
.plb-btn-wa{background:var(--green);color:#fff;box-shadow:0 6px 18px rgba(34,197,94,.35)}
.plb-btn-wa:hover{background:#16A34A;transform:translateY(-2px)}
.plb-btn-call{background:var(--blue);color:#fff;box-shadow:0 6px 18px rgba(26,86,168,.3)}
.plb-btn-call:hover{background:var(--blue-dark);transform:translateY(-2px)}
/* V16.12.12: Botones compartir en el lightbox */
.plb-share{margin-top:18px;padding-top:18px;border-top:1px dashed var(--border)}
.plb-share-label{font-size:12px;color:var(--gray);margin-bottom:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.plb-share-btns{display:flex;gap:8px;flex-wrap:wrap}
.plb-share-btn{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:#fff;border:0;cursor:pointer;font-size:16px;transition:transform .15s ease,box-shadow .15s ease;font-weight:700;font-family:var(--font)}
.plb-share-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.15)}
.plb-share-btn svg{width:18px;height:18px;fill:#fff}
.plb-share-wa{background:#25D366}
.plb-share-fb{background:#1877F2}
.plb-share-mail{background:var(--gray)}
.plb-share-copy{background:var(--blue)}
.plb-share-copied{background:var(--green) !important}
@media(max-width:600px){
.prop-lightbox{padding:0}
.prop-lightbox-inner{border-radius:0;min-height:100vh;margin:0}
.prop-lightbox-gallery{height:50vh;min-height:260px}
.prop-lightbox-info{padding:20px}
.plb-header{flex-direction:column}
.plb-precio{align-self:flex-start}
.plb-cta{flex-direction:column}
.plb-btn-wa,.plb-btn-call{min-width:0;width:100%}
}
/* ============================================================
NOTICIAS — solo texto, sin imágenes
============================================================ */
.news-grid-text{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.news-card-text{display:block;background:#fff;border:1px solid var(--border);border-left:4px solid var(--blue);border-radius:10px;padding:18px;text-decoration:none;color:inherit;transition:.25s;box-shadow:var(--shadow-sm)}
.news-card-text:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-left-color:var(--blue-dark)}
.news-card-text .news-cat{display:inline-block;background:var(--accent);color:var(--blue);font-size:10px;font-weight:700;padding:3px 8px;border-radius:5px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
.news-card-text .news-title{font-size:15px;font-weight:700;line-height:1.4;margin-bottom:8px;color:var(--gray-dark)}
.news-card-text .news-excerpt{font-size:13px;color:var(--gray);line-height:1.55;margin-bottom:10px}
.news-card-text .news-meta{font-size:11px;color:var(--gray);margin-bottom:8px}
.news-card-text .news-link{font-size:12px;color:var(--blue);font-weight:600;display:inline-block}
.news-card-text:hover .news-link{text-decoration:underline}
@media(max-width:600px){
.news-grid-text{grid-template-columns:1fr}
.news-card-text{padding:16px}
}
/* ============================================================
FIXES MÓVIL — touch targets, font-size para iOS, etc.
============================================================ */
/* iOS Safari: evitar zoom al hacer focus en inputs (necesita >= 16px) */
@media(max-width:760px){
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="date"],
select,
textarea{
font-size:16px !important;
}
/* Touch targets ≥ 44px (Apple HIG) */
.nav-account,
.hamburger,
.acc-close,
.wa-fab,
.wa-close,
.wa-send-btn,
.chat-send,
.password-toggle,
.btn-back,
.prop-lightbox-close,
.prop-lightbox-nav,
.carousel-btn{
min-height:44px;
min-width:44px;
}
/* Mobile menu: links más fáciles de tocar */
.mobile-menu a{
padding:16px 14px;
min-height:48px;
display:flex;
align-items:center;
font-size:16px;
}
.mobile-menu{
padding:14px;
}
/* Botones del modal de cuenta y acciones admin más cómodos */
.acc-tab{
padding:12px 14px;
min-height:44px;
}
.adm-card-actions button{
padding:8px 12px;
min-height:36px;
font-size:12px;
}
/* Prevent iOS rubber-band scroll bug en modales */
.acc-modal.open,
.prom-modal.open,
.prop-lightbox.open{
-webkit-overflow-scrolling:touch;
}
/* Texto del CTA promo: legible en móvil */
.tramites-wa-btn{
width:100%;
justify-content:center;
padding:14px 20px;
font-size:14px;
}
}
/* Tap highlight elegante (en lugar del azul feo de iOS) */
a, button, .prop-card, .news-card-text{
-webkit-tap-highlight-color: rgba(26,86,168,.18);
}
/* Asegurar que cuando un modal está abierto, el body no haga scroll */
body.modal-open{
overflow:hidden;
-webkit-overflow-scrolling:touch;
}
/* ============================================================
VALUADOR INTELIGENTE — Diseño premium dark mode
============================================================ */
.val-section{position:relative;padding:80px 16px;background:linear-gradient(135deg,#050817 0%,#0A1F3D 35%,#102B5C 100%);overflow:hidden;color:#fff;isolation:isolate}
.val-bg{position:absolute;inset:0;background:radial-gradient(circle at 20% 30%,rgba(99,102,241,.18) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(34,197,94,.12) 0%,transparent 45%);pointer-events:none;z-index:0}
.val-orb{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:0}
.val-orb-1{width:420px;height:420px;background:rgba(99,102,241,.35);top:-150px;left:-100px;animation:valFloat1 18s ease-in-out infinite}
.val-orb-2{width:500px;height:500px;background:rgba(245,158,11,.18);bottom:-200px;right:-150px;animation:valFloat2 22s ease-in-out infinite}
.val-orb-3{width:280px;height:280px;background:rgba(139,92,246,.25);top:50%;right:30%;animation:valFloat1 25s ease-in-out infinite reverse}
@keyframes valFloat1{0%,100%{transform:translate(0,0)}50%{transform:translate(60px,-40px)}}
@keyframes valFloat2{0%,100%{transform:translate(0,0)}50%{transform:translate(-50px,30px)}}
.val-container{position:relative;max-width:1100px;margin:0 auto;z-index:1}
/* HERO */
.val-hero{text-align:center;padding:40px 0}
.val-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);padding:7px 16px;border-radius:30px;font-size:12px;font-weight:600;color:rgba(255,255,255,.85);margin-bottom:24px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);text-transform:uppercase;letter-spacing:1px}
.val-badge-pulse{width:8px;height:8px;background:#22C55E;border-radius:50%;animation:valPulse 2s infinite}
@keyframes valPulse{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}50%{box-shadow:0 0 0 10px rgba(34,197,94,0)}}
.val-title{font-size:clamp(28px,5vw,52px);font-weight:700;line-height:1.1;letter-spacing:-1px;margin-bottom:18px;background:linear-gradient(135deg,#fff 0%,#94A3B8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.val-title-accent{display:block;background:linear-gradient(135deg,#60A5FA 0%,#A78BFA 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.val-subtitle{font-size:clamp(14px,1.8vw,17px);line-height:1.65;color:rgba(255,255,255,.65);max-width:680px;margin:0 auto 32px}
.val-features{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-bottom:36px}
.val-feature{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);padding:8px 16px;border-radius:24px;font-size:13px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.val-feature-icon{font-size:18px}
.val-cta-start{display:inline-flex;align-items:center;gap:12px;background:linear-gradient(135deg,#3B82F6 0%,#8B5CF6 100%);color:#fff;border:none;padding:18px 40px;border-radius:50px;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;box-shadow:0 12px 40px rgba(59,130,246,.45),inset 0 1px 0 rgba(255,255,255,.2);transition:.3s;letter-spacing:.5px;-webkit-tap-highlight-color:transparent}
.val-cta-start:hover{transform:translateY(-3px);box-shadow:0 20px 50px rgba(59,130,246,.6),inset 0 1px 0 rgba(255,255,255,.3)}
.val-cta-arrow{font-size:18px;transition:transform .3s}
.val-cta-start:hover .val-cta-arrow{transform:translateX(4px)}
.val-cta-note{margin-top:16px;font-size:12px;color:rgba(255,255,255,.5)}
.val-cobertura-aviso{margin-top:14px;font-size:13px;font-weight:600;color:#FCE38A;background:rgba(232,197,71,.1);border:1px solid rgba(232,197,71,.3);border-radius:10px;padding:10px 16px;display:inline-block;line-height:1.5}
/* WIZARD */
.val-wizard{background:rgba(255,255,255,.04);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:32px;box-shadow:0 30px 80px rgba(0,0,0,.4);animation:valFadeIn .5s ease-out}
@keyframes valFadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.val-progress{margin-bottom:32px}
.val-progress-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.val-step-label{font-size:12px;font-weight:600;color:rgba(255,255,255,.65);text-transform:uppercase;letter-spacing:1.5px}
.val-close{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.7);width:34px;height:34px;border-radius:50%;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;-webkit-tap-highlight-color:transparent}
.val-close:hover{background:rgba(255,255,255,.18);transform:rotate(90deg)}
.val-progress-bar{height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden}
.val-progress-fill{height:100%;background:linear-gradient(90deg,#3B82F6,#8B5CF6,#EC4899);border-radius:3px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:0 0 12px rgba(139,92,246,.5)}
.val-step{display:none;animation:valStepIn .4s ease-out}
.val-step.active{display:block}
@keyframes valStepIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
.val-step-header{text-align:center;margin-bottom:28px}
.val-step-header h3{font-size:clamp(20px,3vw,28px);font-weight:700;margin:0 0 8px;letter-spacing:-.5px;color:#fff}
.val-step-header p{font-size:14px;color:rgba(255,255,255,.6);margin:0}
/* TIPO DE PROPIEDAD — cards grandes */
.val-tipo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.val-tipo-card{background:rgba(255,255,255,.04);border:2px solid rgba(255,255,255,.08);border-radius:16px;padding:22px 12px;cursor:pointer;text-align:center;transition:.25s;font-family:inherit;color:#fff;-webkit-tap-highlight-color:transparent}
.val-tipo-card:hover{background:rgba(255,255,255,.08);transform:translateY(-3px);border-color:rgba(96,165,250,.5)}
.val-tipo-card.selected{background:linear-gradient(135deg,rgba(59,130,246,.3),rgba(139,92,246,.3));border-color:#60A5FA;box-shadow:0 8px 28px rgba(59,130,246,.35)}
.val-tipo-icon{font-size:36px;margin-bottom:8px;display:block}
.val-tipo-name{font-size:13px;font-weight:600;color:#fff}
/* INPUTS */
.val-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.val-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px}
.val-input-group{margin-bottom:18px}
.val-input-large{grid-column:1 / -1}
.val-input-group label{display:block;font-size:12px;font-weight:600;color:rgba(255,255,255,.7);margin-bottom:8px;text-transform:uppercase;letter-spacing:.8px}
.val-optional{font-weight:400;text-transform:none;letter-spacing:0;color:rgba(255,255,255,.4);font-size:11px}
.val-input-helper{font-weight:400;text-transform:none;letter-spacing:0;color:rgba(255,255,255,.4);font-size:11px;margin-left:6px}
.val-input{width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:14px 16px;color:#fff;font-size:15px;font-family:inherit;outline:none;transition:.2s;-webkit-appearance:none}
.val-input:focus{border-color:#60A5FA;background:rgba(255,255,255,.08);box-shadow:0 0 0 4px rgba(96,165,250,.15)}
.val-input::placeholder{color:rgba(255,255,255,.35)}
select.val-input{cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,rgba(255,255,255,.6) 50%),linear-gradient(135deg,rgba(255,255,255,.6) 50%,transparent 50%);background-position:calc(100% - 18px) calc(50% - 3px),calc(100% - 13px) calc(50% - 3px);background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
select.val-input option{background:#0A1F3D;color:#fff}
/* SLIDER */
.val-slider-wrap{display:flex;align-items:center;gap:16px}
.val-slider{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:rgba(255,255,255,.1);border-radius:3px;outline:none}
.val-slider::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;background:linear-gradient(135deg,#3B82F6,#8B5CF6);border-radius:50%;cursor:pointer;border:3px solid #fff;box-shadow:0 4px 12px rgba(59,130,246,.5)}
.val-slider::-moz-range-thumb{width:24px;height:24px;background:linear-gradient(135deg,#3B82F6,#8B5CF6);border-radius:50%;cursor:pointer;border:3px solid #fff;box-shadow:0 4px 12px rgba(59,130,246,.5)}
.val-slider-value{font-size:18px;font-weight:700;color:#fff;min-width:90px;text-align:right}
.val-slider-value strong{font-size:24px;background:linear-gradient(135deg,#60A5FA,#A78BFA);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
/* COUNTER */
.val-counter{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:6px;height:54px}
.val-counter button{width:38px;height:38px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#fff;border-radius:8px;font-size:20px;font-weight:700;cursor:pointer;font-family:inherit;transition:.2s;-webkit-tap-highlight-color:transparent}
.val-counter button:hover{background:rgba(96,165,250,.3);border-color:#60A5FA}
.val-counter button:active{transform:scale(.92)}
.val-counter span{font-size:22px;font-weight:700;color:#fff;min-width:40px;text-align:center}
/* INFO CARD */
.val-info-card{display:flex;align-items:center;gap:14px;background:linear-gradient(135deg,rgba(96,165,250,.12),rgba(139,92,246,.12));border:1px solid rgba(96,165,250,.3);border-radius:14px;padding:16px;margin-top:8px;animation:valFadeIn .3s ease-out}
.val-info-icon{font-size:28px}
.val-info-title{font-size:14px;font-weight:700;color:#fff;margin-bottom:3px}
.val-info-desc{font-size:13px;color:rgba(255,255,255,.7)}
/* ESTADO */
.val-estado-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.val-estado-card{background:rgba(255,255,255,.04);border:2px solid rgba(255,255,255,.08);border-radius:16px;padding:24px 18px;cursor:pointer;text-align:left;transition:.25s;font-family:inherit;color:#fff;-webkit-tap-highlight-color:transparent}
.val-estado-card:hover{background:rgba(255,255,255,.08);border-color:rgba(96,165,250,.5);transform:translateY(-2px)}
.val-estado-card.selected{background:linear-gradient(135deg,rgba(59,130,246,.3),rgba(139,92,246,.3));border-color:#60A5FA;box-shadow:0 8px 28px rgba(59,130,246,.35)}
.val-estado-emoji{font-size:32px;margin-bottom:8px}
.val-estado-name{font-size:16px;font-weight:700;margin-bottom:4px}
.val-estado-desc{font-size:13px;color:rgba(255,255,255,.6);line-height:1.4}
/* ESTILO + AMENIDADES */
.val-substep-label{font-size:13px;font-weight:700;color:rgba(255,255,255,.85);text-transform:uppercase;letter-spacing:1px;margin:18px 0 12px}
.val-estilo-grid,.val-amenidades-grid{display:flex;flex-wrap:wrap;gap:8px}
.val-amenidades-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.val-chip{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#fff;padding:10px 18px;border-radius:24px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;transition:.2s;-webkit-tap-highlight-color:transparent}
.val-chip:hover{background:rgba(255,255,255,.12);border-color:rgba(96,165,250,.5)}
.val-chip.selected{background:linear-gradient(135deg,#3B82F6,#8B5CF6);border-color:transparent;box-shadow:0 4px 12px rgba(59,130,246,.4)}
.val-amenidad{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:#fff;padding:12px 14px;border-radius:12px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:8px;transition:.2s;-webkit-tap-highlight-color:transparent}
.val-amenidad span{font-size:18px}
.val-amenidad:hover{background:rgba(255,255,255,.08);border-color:rgba(96,165,250,.4)}
.val-amenidad.selected{background:linear-gradient(135deg,rgba(34,197,94,.25),rgba(59,130,246,.25));border-color:#22C55E;box-shadow:0 4px 16px rgba(34,197,94,.25)}
/* LEAD FORM */
.val-lead-form{max-width:520px;margin:0 auto}
.val-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-top:16px;font-size:11px;color:rgba(255,255,255,.55)}
.val-trust-item{display:flex;align-items:center;gap:5px}
/* NAV */
.val-nav{display:flex;justify-content:space-between;gap:12px;margin-top:32px;padding-top:24px;border-top:1px solid rgba(255,255,255,.08)}
.val-nav-btn{padding:14px 28px;border-radius:50px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:.25s;border:none;-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center;gap:8px}
.val-nav-back{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.85)}
.val-nav-back:hover{background:rgba(255,255,255,.12)}
.val-nav-back:disabled{opacity:.4;cursor:not-allowed}
.val-nav-next{background:linear-gradient(135deg,#3B82F6,#8B5CF6);color:#fff;box-shadow:0 6px 20px rgba(59,130,246,.4)}
.val-nav-next:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 28px rgba(59,130,246,.55)}
.val-nav-next:disabled{opacity:.45;cursor:not-allowed;transform:none}
/* LOADING */
.val-loading{text-align:center;padding:80px 20px;animation:valFadeIn .4s ease-out}
.val-loading-orbits{position:relative;width:120px;height:120px;margin:0 auto 28px}
.val-loading-ring{position:absolute;inset:0;border:2px solid transparent;border-top-color:#60A5FA;border-radius:50%;animation:valSpin 1.5s linear infinite}
.val-loading-ring:nth-child(2){inset:14px;border-top-color:#A78BFA;animation-duration:2s;animation-direction:reverse}
.val-loading-ring:nth-child(3){inset:28px;border-top-color:#EC4899;animation-duration:1.2s}
@keyframes valSpin{to{transform:rotate(360deg)}}
.val-loading h3{font-size:20px;font-weight:700;color:#fff;margin-bottom:8px}
.val-loading p{font-size:14px;color:rgba(255,255,255,.6)}
/* RESULTADO */
.val-result{animation:valFadeIn .6s ease-out}
.val-result-header{text-align:center;margin-bottom:32px}
.val-result-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.4);color:#86EFAC;font-size:12px;font-weight:700;padding:6px 14px;border-radius:24px;margin-bottom:14px;text-transform:uppercase;letter-spacing:1px}
.val-result-header h2{font-size:clamp(26px,4.5vw,38px);font-weight:700;margin-bottom:10px;letter-spacing:-.5px}
.val-result-header p{color:rgba(255,255,255,.7);font-size:15px;max-width:600px;margin:0 auto;line-height:1.6}
.val-result-main{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;margin-bottom:32px}
.val-price-card{background:linear-gradient(135deg,rgba(59,130,246,.15),rgba(139,92,246,.15));border:1px solid rgba(96,165,250,.3);border-radius:24px;padding:36px 28px;text-align:center;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 20px 60px rgba(59,130,246,.25)}
.val-price-label{font-size:12px;font-weight:700;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:2px;margin-bottom:14px}
.val-price-amount{font-size:clamp(36px,7vw,56px);font-weight:800;line-height:1;margin-bottom:14px;background:linear-gradient(135deg,#fff,#A5B4FC);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-1.5px}
.val-price-range{font-size:14px;color:rgba(255,255,255,.7);margin-bottom:24px}
.val-price-range-label{display:block;font-size:11px;color:rgba(255,255,255,.5);margin-bottom:6px;text-transform:uppercase;letter-spacing:1px}
.val-price-range strong{color:#fff;font-weight:600;font-size:16px}
.val-confidence{padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}
.val-confidence-label{font-size:13px;color:rgba(255,255,255,.7);margin-bottom:8px}
.val-confidence-label strong{color:#86EFAC}
.val-confidence-bar{height:8px;background:rgba(255,255,255,.08);border-radius:4px;overflow:hidden}
.val-confidence-fill{height:100%;background:linear-gradient(90deg,#22C55E,#10B981);border-radius:4px;transition:width 1s cubic-bezier(.4,0,.2,1);box-shadow:0 0 12px rgba(34,197,94,.5)}
/* V16.9 — Desglose Terreno + Construcción (método costo de reposición) */
.val-desglose{margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.1)}
.val-desglose-title{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--accent-warm);margin-bottom:.85rem;font-weight:600}
.val-desglose-grid{display:flex;flex-direction:column;gap:.5rem}
.val-desglose-row{display:flex;justify-content:space-between;align-items:center;padding:.45rem .65rem;background:rgba(255,255,255,.03);border-radius:8px;font-size:.92rem}
.val-desglose-label{color:rgba(255,255,255,.85)}
.val-desglose-value{font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
.val-desglose-total{margin-top:.35rem;background:rgba(212,165,116,.15);border:1px solid rgba(212,165,116,.3);font-size:1rem}
.val-desglose-total .val-desglose-value{color:var(--accent-warm);font-weight:700}
.val-desglose-hint{margin-top:.65rem;font-size:.78rem;color:rgba(255,255,255,.55);text-align:center;font-style:italic}
.val-scores-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.val-score-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.val-score-card-highlight{background:linear-gradient(135deg,rgba(245,158,11,.15),rgba(236,72,153,.15));border-color:rgba(245,158,11,.4)}
.val-score-icon{font-size:24px;margin-bottom:8px}
.val-score-label{font-size:11px;color:rgba(255,255,255,.65);text-transform:uppercase;letter-spacing:.8px;margin-bottom:8px}
.val-score-value{font-size:28px;font-weight:800;color:#fff;line-height:1;margin-bottom:8px}
.val-score-bar{height:5px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden}
.val-score-bar-fill{height:100%;background:linear-gradient(90deg,#60A5FA,#A78BFA);border-radius:3px;transition:width 1.2s cubic-bezier(.4,0,.2,1)}
.val-score-card-highlight .val-score-bar-fill{background:linear-gradient(90deg,#F59E0B,#EC4899)}
.val-insights-section,.val-recom-section,.val-comparables-section{margin-bottom:28px}
.val-insights-section h3,.val-recom-section h3,.val-comparables-section h3,.val-result-cta h3{font-size:18px;font-weight:700;margin-bottom:14px;color:#fff}
.val-insights-list,.val-recom-list{display:flex;flex-direction:column;gap:10px}
.val-insight-item,.val-recom-item{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:16px 18px;color:rgba(255,255,255,.85);font-size:14px;line-height:1.6;display:flex;align-items:flex-start;gap:12px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.val-insight-item::before,.val-recom-item::before{content:'';flex-shrink:0;width:6px;height:6px;border-radius:50%;margin-top:8px;background:#60A5FA;box-shadow:0 0 8px #60A5FA}
.val-recom-item::before{background:#22C55E;box-shadow:0 0 8px #22C55E}
.val-comparables-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.val-comparable{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:16px;text-decoration:none;color:#fff;transition:.25s;display:block}
.val-comparable:hover{background:rgba(255,255,255,.08);transform:translateY(-2px);border-color:rgba(96,165,250,.4)}
.val-comparable-precio{font-size:18px;font-weight:700;color:#86EFAC;margin-bottom:4px}
.val-comparable-titulo{font-size:13px;color:rgba(255,255,255,.85);margin-bottom:4px}
.val-comparable-meta{font-size:11px;color:rgba(255,255,255,.5)}
.val-result-cta{background:linear-gradient(135deg,rgba(34,197,94,.12),rgba(59,130,246,.12));border:1px solid rgba(34,197,94,.3);border-radius:20px;padding:32px 24px;text-align:center;margin-top:32px}
.val-result-cta h3{font-size:22px;margin-bottom:8px}
.val-result-cta p{color:rgba(255,255,255,.75);font-size:14px;margin-bottom:20px;line-height:1.6}
.val-result-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-bottom:14px}
.val-btn-wa,.val-btn-pdf{padding:14px 28px;border-radius:50px;font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;border:none;transition:.25s;-webkit-tap-highlight-color:transparent;display:inline-flex;align-items:center;gap:8px}
.val-btn-wa{background:#22C55E;color:#fff;box-shadow:0 8px 24px rgba(34,197,94,.4)}
.val-btn-wa:hover{background:#16A34A;transform:translateY(-2px);box-shadow:0 12px 32px rgba(34,197,94,.55)}
.val-btn-pdf{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.18)}
.val-btn-pdf:hover{background:rgba(255,255,255,.16)}
.val-btn-restart{background:none;border:none;color:rgba(255,255,255,.6);font-size:13px;cursor:pointer;font-family:inherit;text-decoration:underline;-webkit-tap-highlight-color:transparent}
.val-btn-restart:hover{color:#fff}
/* RESPONSIVE */
@media(max-width:760px){
.val-section{padding:50px 14px}
.val-wizard{padding:20px}
.val-form-row{grid-template-columns:1fr}
.val-grid-3{grid-template-columns:1fr 1fr}
.val-result-main{grid-template-columns:1fr}
.val-scores-grid{grid-template-columns:1fr 1fr}
.val-tipo-grid{grid-template-columns:repeat(2,1fr)}
.val-estado-grid{grid-template-columns:1fr}
.val-features{gap:8px}
.val-feature{font-size:11px;padding:6px 12px}
.val-result-actions{flex-direction:column}
.val-btn-wa,.val-btn-pdf{width:100%;justify-content:center}
.val-nav-btn{padding:12px 18px;font-size:13px}
}
/* PRINT (PDF via navegador) */
@media print{
body *:not(#valuador):not(#valuador *){display:none!important}
.val-section{background:#fff!important;color:#000!important;padding:0!important}
.val-bg,.val-orb,.val-result-cta,.val-btn-restart{display:none!important}
.val-result-header h2,.val-price-amount,.val-score-value,.val-step-header h3{color:#000!important;background:none!important;-webkit-text-fill-color:#000!important}
.val-price-card,.val-score-card,.val-insight-item,.val-recom-item,.val-comparable{background:#f8fafc!important;border:1px solid #e2e8f0!important;color:#000!important}
.val-result-header p,.val-price-range,.val-confidence-label,.val-score-label,.val-insight-item,.val-recom-item{color:#475569!important}
}
/* ============================================================
TOUCH OPTIMIZATIONS GLOBAL — Aplicado a TODOS los elementos
interactivos del sitio para garantizar respuesta táctil correcta.
============================================================ */
/* touch-action:manipulation elimina el delay de 300ms en mobile
y previene gestos no deseados (pinch, double-tap zoom) sobre
elementos interactivos */
button,
a,
input[type="submit"],
input[type="button"],
input[type="reset"],
[role="button"],
.tab-btn,
.search-btn,
.btn-primary,
.prop-card,
.prop-cta,
.carousel-btn,
.carousel-dot,
.val-tipo-card,
.val-estado-card,
.val-chip,
.val-amenidad,
.val-cta-start,
.val-nav-btn,
.val-btn-wa,
.val-btn-pdf,
.val-btn-restart,
.val-close,
.choice-card,
.dropzone,
.chat-sug,
.chat-send,
.acc-tab,
.btn-back,
.prom-modal-bar a,
.social-link,
.nav-account,
.nav-valuador,
.acc-edit-btn,
.acc-action-btn,
.acc-delete-btn,
.acc-verify-btn,
.acc-rechazar-btn,
[onclick] {
touch-action: manipulation;
-webkit-tap-highlight-color: rgba(26, 86, 168, 0.1);
}
/* Inputs y selects: asegurar tamaño mínimo táctil y sin zoom iOS */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="date"],
select,
textarea {
font-size: 16px; /* iOS no hace zoom si es ≥16px */
touch-action: manipulation;
-webkit-tap-highlight-color: rgba(26, 86, 168, 0.05);
}
/* Asegurar tamaño táctil mínimo en botones primarios */
@media (max-width: 900px) {
button,
.btn-primary,
.val-nav-btn,
.val-cta-start,
.val-btn-wa,
.val-btn-pdf,
.tab-btn,
.search-btn {
min-height: 44px;
}
/* Tap targets en cards y chips */
.val-tipo-card,
.val-estado-card,
.choice-card {
min-height: 80px;
}
.val-chip,
.val-amenidad {
min-height: 40px;
}
/* Inputs y selects con altura cómoda */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
select {
min-height: 44px;
padding: 12px 14px;
}
/* El search-box del Hero, asegurar que los selects son tappeables */
.search-box select,
.search-box input {
min-height: 44px;
padding: 12px;
}
.search-btn {
width: 100%;
min-height: 48px;
}
}
/* Prevenir que elementos invisibles capturen toques */
[hidden],
[style*="display:none"],
[style*="display: none"] {
pointer-events: none !important;
}
/* ============================================================
v1.2.0 — Adiciones: acabados, checklist amenidades, disclaimer,
inputs manuales m², ciudades CM, promo 4 cards, print PDF
============================================================ */
/* --- Input numérico manual junto al slider de m² --- */
.val-num-input{
appearance:textfield;
-moz-appearance:textfield;
border:1px solid var(--border);
background:#fff;
border-radius:8px;
padding:6px 10px;
font-size:15px;
font-weight:700;
color:var(--blue-dark);
width:90px;
text-align:center;
font-family:var(--font);
transition:border-color .2s ease, box-shadow .2s ease;
}
.val-num-input::-webkit-outer-spin-button,
.val-num-input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.val-num-input:focus{
outline:none;
border-color:var(--blue);
box-shadow:0 0 0 3px rgba(26,86,168,.12);
}
.val-slider-value{
display:flex;align-items:center;gap:8px;
font-size:14px;color:var(--gray);font-weight:500;
margin-top:6px;
}
/* --- Sub-paso "Nivel de acabados" en paso 4 --- */
.val-substep-divider{
margin:32px 0 16px;
display:flex;align-items:center;gap:12px;
font-size:13px;font-weight:700;color:rgba(255,255,255,.92);
text-transform:uppercase;letter-spacing:1.5px;
}
.val-substep-divider::before,
.val-substep-divider::after{
content:'';flex:1;height:1px;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);
}
.val-substep-help{
font-size:13px;color:rgba(255,255,255,.65);margin-bottom:14px;line-height:1.5;
}
.val-acabados-grid{
display:grid;grid-template-columns:repeat(3,1fr);gap:12px;
}
/* Mismo lenguaje visual que .val-estado-card: fondo translúcido, texto blanco */
.val-acabados-card{
position:relative;
background:rgba(255,255,255,.04);
border:2px solid rgba(255,255,255,.08);
border-radius:16px;
padding:24px 18px;
text-align:left;
cursor:pointer;
color:#fff;
font-family:inherit;
transition:all .25s cubic-bezier(.22,1,.36,1);
-webkit-tap-highlight-color:transparent;
}
.val-acabados-card:hover{
background:rgba(255,255,255,.08);
border-color:rgba(96,165,250,.5);
transform:translateY(-2px);
}
.val-acabados-card.selected{
background:linear-gradient(135deg,rgba(59,130,246,.30),rgba(139,92,246,.30));
border-color:#60A5FA;
box-shadow:0 8px 28px rgba(59,130,246,.35);
}
.val-acabados-card.selected::after{
content:'✓';
position:absolute;top:14px;right:14px;
width:26px;height:26px;
background:#60A5FA;color:#fff;
border-radius:50%;
display:flex;align-items:center;justify-content:center;
font-size:14px;font-weight:700;
box-shadow:0 4px 10px rgba(59,130,246,.5);
}
.val-acabados-emoji{ font-size:32px;margin-bottom:8px; }
.val-acabados-name{ font-size:16px;font-weight:700;color:#fff;margin-bottom:6px; }
.val-acabados-desc{ font-size:13px;color:rgba(255,255,255,.65);line-height:1.5; }
@media (max-width:720px){
.val-acabados-grid{ grid-template-columns:1fr; }
}
/* --- Amenidades como checklist real con palomita blanca visible ---
Usa el mismo lenguaje visual que .val-amenidad original: fondo translúcido,
texto blanco. Sólo agregamos un checkbox visible a la izquierda. */
.val-amenidades-checklist{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
gap:10px;
}
.val-amenidades-checklist .val-amenidad,
.val-amenidades-checklist .val-servicio{
display:flex;align-items:center;gap:10px;
text-align:left;
padding:12px 14px;
background:rgba(255,255,255,.04);
border:1px solid rgba(255,255,255,.10);
color:#fff;
border-radius:12px;
cursor:pointer;
transition:all .2s ease;
font-family:inherit;
font-size:13px;
font-weight:600;
position:relative;
-webkit-tap-highlight-color:transparent;
}
.val-amenidades-checklist .val-amenidad:hover,
.val-amenidades-checklist .val-servicio:hover{
background:rgba(255,255,255,.08);
border-color:rgba(96,165,250,.5);
}
.val-amenidades-checklist .val-amenidad.selected,
.val-amenidades-checklist .val-servicio.selected{
background:linear-gradient(135deg,rgba(59,130,246,.30),rgba(139,92,246,.30));
border-color:#60A5FA;
box-shadow:0 4px 16px rgba(59,130,246,.30);
}
/* Cuadrito del checkbox (a la izquierda) */
.val-amen-check{
flex-shrink:0;
width:20px;height:20px;
border:2px solid rgba(255,255,255,.5);
border-radius:5px;
background:rgba(0,0,0,.20);
display:inline-flex;align-items:center;justify-content:center;
transition:all .2s ease;
box-sizing:border-box;
}
.val-amenidades-checklist .val-amenidad.selected .val-amen-check,
.val-amenidades-checklist .val-servicio.selected .val-amen-check{
background:#fff;
border-color:#fff;
box-shadow:0 0 0 2px rgba(59,130,246,.35);
}
/* Palomita blanca interna que aparece al seleccionar */
.val-amen-check::after{
content:'';
display:block;
width:5px;height:10px;
border:solid #1A56A8;
border-width:0 2.5px 2.5px 0;
transform:rotate(45deg) scale(0);
transition:transform .18s cubic-bezier(.22,1,.36,1);
margin-bottom:2px;
}
.val-amenidades-checklist .val-amenidad.selected .val-amen-check::after,
.val-amenidades-checklist .val-servicio.selected .val-amen-check::after{
transform:rotate(45deg) scale(1);
}
.val-amen-emoji{ font-size:18px;flex-shrink:0;line-height:1; }
.val-amenidades-checklist .val-amen-label{
font-size:13px;font-weight:600;color:#fff;flex:1;min-width:0;line-height:1.3;
}
/* --- Nota informativa central del Paso 6 --- */
.val-paso6-nota{
max-width:620px;
margin:32px auto 0;
padding:16px 22px;
background:rgba(245,158,11,.08);
border:1px solid rgba(245,158,11,.25);
border-left:3px solid #F59E0B;
border-radius:12px;
display:flex;align-items:flex-start;gap:14px;
text-align:left;
}
.val-paso6-nota-icon{
font-size:22px;
flex-shrink:0;
line-height:1.2;
margin-top:1px;
}
.val-paso6-nota p{
font-size:13px;
color:rgba(255,255,255,.80);
line-height:1.55;
margin:0;
}
.val-paso6-nota strong{
color:#FCD34D;
font-weight:700;
}
@media (max-width:560px){
.val-paso6-nota{ padding:14px 16px; gap:10px; }
.val-paso6-nota p{ font-size:12px; }
}
/* --- Disclaimer del reporte (en pantalla y en PDF) --- */
.val-disclaimer{
margin:32px 0 16px;
display:flex;gap:18px;
padding:24px 26px;
background:linear-gradient(135deg,#FFF7ED 0%,#FFFBF5 100%);
border:1px solid #FED7AA;
border-left:4px solid #F59E0B;
border-radius:16px;
position:relative;
overflow:hidden;
}
.val-disclaimer::before{
content:'';
position:absolute;top:-40px;right:-40px;
width:160px;height:160px;
background:radial-gradient(circle,rgba(245,158,11,.08) 0%,transparent 70%);
border-radius:50%;
pointer-events:none;
}
.val-disclaimer-icon{
flex-shrink:0;
font-size:32px;
width:52px;height:52px;
background:#fff;
border:1px solid #FED7AA;
border-radius:14px;
display:flex;align-items:center;justify-content:center;
box-shadow:0 4px 12px rgba(245,158,11,.15);
}
.val-disclaimer-body{ flex:1;min-width:0; }
.val-disclaimer-title{
font-size:15px;font-weight:800;
color:#92400E;
text-transform:uppercase;letter-spacing:1px;
margin-bottom:10px;
}
.val-disclaimer-body p{
font-size:13px;color:#78350F;line-height:1.65;
margin-bottom:10px;
}
.val-disclaimer-body p:last-child{ margin-bottom:0; }
.val-disclaimer-body strong{ color:#7C2D12; font-weight:700; }
@media (max-width:720px){
.val-disclaimer{ padding:18px;gap:14px; }
.val-disclaimer-icon{ width:42px;height:42px;font-size:24px;border-radius:11px; }
.val-disclaimer-title{ font-size:13px; }
.val-disclaimer-body p{ font-size:12px; }
}
/* --- Ciudades de Ciudad Maderas (lista visible) --- */
.cm-cities{
margin-top:22px;
padding-top:18px;
border-top:1px solid rgba(255,255,255,.12);
}
.cm-cities-title{
color:rgba(255,255,255,.65);
font-size:11px;
text-transform:uppercase;
letter-spacing:1.5px;
font-weight:600;
margin-bottom:12px;
}
.cm-cities-list{
display:flex;flex-wrap:wrap;gap:6px;
}
.cm-city-chip{
display:inline-block;
background:rgba(255,255,255,.08);
border:1px solid rgba(255,255,255,.18);
color:#fff;
font-size:12px;
font-weight:500;
padding:6px 12px;
border-radius:20px;
-webkit-backdrop-filter:blur(8px);
backdrop-filter:blur(8px);
transition:background .2s ease,transform .2s ease;
}
.cm-city-chip:hover{
background:rgba(255,255,255,.16);
transform:translateY(-1px);
}
/* --- Promo: 4 cards en grid --- */
.promo-grid-4{
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
@media (min-width:1024px){
.promo-grid-4{ grid-template-columns:repeat(4,1fr); }
}
/* --- ESTILOS PARA IMPRESIÓN / PDF --- */
@media print{
/* Oculta lo que no debe imprimirse */
nav, .wa-wrap, .footer-wrap, footer, .chat-box, #asistente,
.val-hero, .val-wizard, .val-loading, .val-progress, .val-nav,
.val-result-cta, .val-result-actions, .val-btn-wa, .val-btn-pdf, .val-btn-restart,
.hero, #promo-banner, #residencial, #comercial, #terrenos, #ciudad-maderas,
#agendar, #tramites, #noticias, .modal, .modal-overlay,
.hero-orb, .hero-overlay, .hero-video-wrap, .hero-scroll,
.val-bg, .val-orb{
display:none !important;
}
body{
padding-top:0 !important;
background:#fff !important;
color:#000 !important;
font-family:Georgia, 'Times New Roman', serif !important;
}
/* Hero de impresión */
.val-result{
display:block !important;
visibility:visible !important;
padding:20px !important;
background:#fff !important;
color:#000 !important;
max-width:none !important;
box-shadow:none !important;
}
.val-result-header h2{
font-size:24pt !important;
color:#1A56A8 !important;
text-align:center;
margin-bottom:8pt !important;
}
.val-result-header p{
font-size:11pt !important;
color:#555 !important;
text-align:center;
margin-bottom:20pt;
}
.val-result-badge{
display:inline-block;
background:#E8F0FE !important;
color:#1A56A8 !important;
padding:4pt 10pt;
border-radius:12pt;
font-size:9pt;
margin-bottom:10pt;
}
.val-price-card{
background:linear-gradient(135deg,#F8FAFC 0%,#fff 100%) !important;
border:1pt solid #ddd !important;
padding:20pt !important;
margin-bottom:14pt;
box-shadow:none !important;
page-break-inside:avoid;
}
.val-price-amount{
font-size:32pt !important;
color:#1A56A8 !important;
font-weight:700;
}
.val-scores-grid{ page-break-inside:avoid; }
.val-insights-section, .val-recom-section, .val-comparables-section{
page-break-inside:avoid;
margin-top:14pt;
}
.val-insights-section h3, .val-recom-section h3, .val-comparables-section h3{
font-size:14pt !important;
color:#1A56A8 !important;
border-bottom:1pt solid #E2E8F0;
padding-bottom:6pt;
margin-bottom:10pt;
}
/* Disclaimer destaca en el PDF */
.val-disclaimer{
page-break-inside:avoid;
page-break-before:auto;
margin-top:20pt !important;
background:#FFF7ED !important;
border:1.5pt solid #F59E0B !important;
border-left:4pt solid #F59E0B !important;
padding:14pt !important;
-webkit-print-color-adjust:exact !important;
print-color-adjust:exact !important;
}
.val-disclaimer-title{ font-size:11pt !important; color:#92400E !important; }
.val-disclaimer-body p{ font-size:9.5pt !important; color:#7C2D12 !important; line-height:1.55 !important; }
.val-disclaimer-icon{ font-size:18pt !important; width:36pt !important; height:36pt !important; }
/* Pie de página en cada hoja */
@page{
margin:14mm 12mm;
}
}
/* =============================================================
V16.1 — Contador genérico para formularios de promover propiedad
============================================================= */
.prop-counter{
display:flex;align-items:center;gap:0;
background:#fff;
border:1px solid var(--border);
border-radius:10px;
overflow:hidden;
width:100%;
height:42px;
}
.prop-counter-btn{
flex:0 0 42px;
height:100%;
background:var(--gray-light);
border:none;
font-size:20px;
font-weight:600;
color:var(--blue);
cursor:pointer;
user-select:none;
transition:background .15s ease;
display:flex;align-items:center;justify-content:center;
font-family:inherit;
}
.prop-counter-btn:hover{ background:var(--accent); }
.prop-counter-btn:active{ background:var(--blue);color:#fff; }
.prop-counter-display{
flex:1;
text-align:center;
font-size:15px;
font-weight:700;
color:var(--gray-dark);
font-family:inherit;
-webkit-user-select:none;user-select:none;
}
.form-hint-inline{
font-size:11px;font-weight:400;color:var(--gray);margin-left:4px;
}
/* ============================================================
* V16.13.32 — Página Blog (noticias + tips)
* ============================================================ */
.blog-wrap{min-height:60vh}
.blog-hero{background:linear-gradient(135deg,var(--blue),var(--blue-dark));padding:56px 20px 48px;text-align:center}
.blog-hero-inner{max-width:760px;margin:0 auto}
.blog-eyebrow{display:inline-block;color:rgba(255,255,255,.7);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:10px}
.blog-title{color:#fff;font-size:clamp(32px,5vw,46px);font-weight:800;margin:0 0 10px}
.blog-sub{color:rgba(255,255,255,.8);font-size:15.5px;line-height:1.6;margin:0}
.blog-tabs{display:flex;justify-content:center;gap:8px;max-width:1100px;margin:0 auto;padding:24px 20px 0;flex-wrap:wrap}
.blog-tab{background:#fff;border:1.5px solid var(--border);color:var(--gray-dark);font-size:14.5px;font-weight:700;padding:11px 22px;border-radius:30px;cursor:pointer;transition:.2s}
.blog-tab:hover{border-color:var(--blue)}
.blog-tab.activo{background:var(--blue);border-color:var(--blue);color:#fff}
.blog-panel-inner{max-width:1100px;margin:0 auto;padding:28px 20px 72px}
.blog-panel-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.blog-h2{font-size:clamp(22px,3vw,30px);font-weight:800;color:var(--gray-dark);margin:0 0 4px}
.blog-panel-sub{color:var(--gray);font-size:14px;margin:0}
.blog-news-refresh{background:var(--blue);color:#fff;border:none;padding:8px 18px;border-radius:8px;font-size:12.5px;font-weight:600;cursor:pointer}
.blog-news-refresh:hover{background:var(--blue-dark)}
.blog-loading{text-align:center;padding:48px 0;color:var(--gray);font-size:13px}
/* Filtro de categorías */
.blog-cats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.blog-cat{background:var(--gray-light);border:1.5px solid var(--border);color:var(--gray-dark);font-size:13px;font-weight:600;padding:7px 15px;border-radius:22px;cursor:pointer;transition:.2s}
.blog-cat:hover{border-color:var(--blue)}
.blog-cat.activo{background:var(--blue);border-color:var(--blue);color:#fff}
/* Muro de tarjetas (tips) */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.blog-card{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.blog-card:hover{box-shadow:0 14px 34px rgba(10,20,40,.1);transform:translateY(-2px)}
.blog-card-img{width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--gray-light)}
.blog-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.blog-card-body{padding:18px 18px 16px;display:flex;flex-direction:column;gap:10px}
.blog-card-cat{align-self:flex-start;background:var(--accent);color:var(--blue);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:4px 10px;border-radius:12px}
.blog-card-title{font-size:18px;font-weight:800;color:var(--gray-dark);margin:0;line-height:1.3}
.blog-card-text{color:var(--gray-dark);font-size:14.5px;line-height:1.65}
.blog-card-text p{margin:0 0 10px}
.blog-card-text img{max-width:100%;height:auto;border-radius:8px;margin:8px 0}
.blog-card-share{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:6px;padding-top:14px;border-top:1px solid var(--border)}
.blog-share-label{font-size:12px;color:var(--gray);font-weight:600}
.blog-share-btn{background:var(--gray-light);border:1px solid var(--border);color:var(--gray-dark);font-size:12px;font-weight:600;padding:6px 12px;border-radius:8px;cursor:pointer;text-decoration:none;transition:.2s}
.blog-share-btn:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.blog-empty{text-align:center;padding:48px 20px;color:var(--gray);font-size:15px}
@media(max-width:600px){
.blog-hero{padding:44px 16px 36px}
.blog-panel-inner{padding:24px 16px 56px}
.blog-grid{grid-template-columns:1fr}
}
/* --- Blog: compositor de tips (solo admin) V16.13.33 --- */
.blog-compositor{background:#fff;border:1.5px solid var(--blue);border-radius:16px;padding:18px;margin-bottom:26px;box-shadow:0 8px 24px rgba(26,86,168,.08)}
.blog-comp-titulo{font-size:15px;font-weight:800;color:var(--blue);margin:0 0 12px}
.blog-comp-input,.blog-comp-textarea,.blog-comp-select{width:100%;border:1.5px solid var(--border);border-radius:9px;padding:10px 13px;font-size:14px;font-family:inherit;outline:none;margin-bottom:10px;box-sizing:border-box}
.blog-comp-input:focus,.blog-comp-textarea:focus,.blog-comp-select:focus{border-color:var(--blue)}
.blog-comp-textarea{resize:vertical;line-height:1.55}
.blog-comp-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.blog-comp-row .blog-comp-input,.blog-comp-row .blog-comp-select{flex:1;min-width:180px}
.blog-comp-file{display:inline-block;background:var(--gray-light);border:1.5px dashed var(--border);color:var(--gray-dark);font-size:13px;font-weight:600;padding:9px 16px;border-radius:9px;cursor:pointer;transition:.2s}
.blog-comp-file:hover{border-color:var(--blue);color:var(--blue)}
.blog-comp-file-info{font-size:12.5px;color:var(--gray)}
.blog-comp-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.blog-comp-publicar{background:var(--blue);color:#fff;border:none;font-size:14px;font-weight:700;padding:11px 24px;border-radius:9px;cursor:pointer;transition:background .2s}
.blog-comp-publicar:hover{background:var(--blue-dark)}
.blog-comp-publicar:disabled{opacity:.6;cursor:default}
.blog-comp-msg{font-size:13px;font-weight:600}
.blog-comp-msg.ok{color:#15803D}
.blog-comp-msg.error{color:#DC2626}
/* Botón eliminar en tarjeta */
.blog-card{position:relative}
.blog-card-del{position:absolute;top:10px;right:10px;z-index:2;width:30px;height:30px;border-radius:50%;border:none;background:rgba(220,38,38,.92);color:#fff;font-size:14px;font-weight:700;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;transition:transform .15s}
.blog-card-del:hover{transform:scale(1.12)}
/* --- Blog V16.13.34: carrusel, compartir, editar --- */
/* Compartir estilo propiedades */
.blog-card-share{margin-top:auto;padding-top:14px;border-top:1px dashed var(--border)}
.blog-card-share .blog-share-label{font-size:12px;color:var(--gray);margin:0 0 10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
/* Portada clicable */
.blog-card-img{cursor:pointer;position:relative}
.blog-card-imgcount{position:absolute;bottom:8px;right:8px;background:rgba(10,20,40,.78);color:#fff;font-size:11.5px;font-weight:700;padding:4px 9px;border-radius:20px}
/* Botones admin en tarjeta */
.blog-card-admin{position:absolute;top:10px;right:10px;z-index:2;display:flex;gap:6px}
.blog-card-edit,.blog-card-del{width:30px;height:30px;border-radius:50%;border:none;color:#fff;font-size:14px;font-weight:700;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;transition:transform .15s}
.blog-card-edit{background:rgba(26,86,168,.92)}
.blog-card-del{background:rgba(220,38,38,.92)}
.blog-card-edit:hover,.blog-card-del:hover{transform:scale(1.12)}
/* Compositor: footer con cancelar */
.blog-comp-acciones{display:flex;gap:8px}
.blog-comp-cancelar{background:var(--gray-light);border:1.5px solid var(--border);color:var(--gray-dark);font-size:14px;font-weight:700;padding:11px 18px;border-radius:9px;cursor:pointer}
.blog-comp-cancelar:hover{border-color:var(--gray)}
/* Lightbox / carrusel */
.blog-lightbox{position:fixed;inset:0;z-index:9999;background:rgba(8,12,22,.93);display:none;align-items:center;justify-content:center}
.blog-lightbox:not([hidden]){display:flex}
.blog-lb-stage{max-width:92vw;max-height:86vh;display:flex;align-items:center;justify-content:center}
.blog-lb-stage img{max-width:92vw;max-height:86vh;border-radius:10px;box-shadow:0 18px 50px rgba(0,0,0,.5);object-fit:contain}
.blog-lb-close{position:absolute;top:18px;right:20px;width:44px;height:44px;border-radius:50%;border:none;background:rgba(255,255,255,.14);color:#fff;font-size:20px;cursor:pointer;transition:background .2s}
.blog-lb-close:hover{background:rgba(255,255,255,.28)}
.blog-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:none;background:rgba(255,255,255,.14);color:#fff;font-size:30px;cursor:pointer;line-height:1;transition:background .2s}
.blog-lb-nav:hover{background:rgba(255,255,255,.3)}
.blog-lb-prev{left:16px}
.blog-lb-next{right:16px}
.blog-lb-counter{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:#fff;font-size:14px;font-weight:600;background:rgba(255,255,255,.14);padding:6px 16px;border-radius:20px}
@media(max-width:600px){
.blog-lb-nav{width:42px;height:42px;font-size:24px}
.blog-lb-prev{left:8px}
.blog-lb-next{right:8px}
}
/* ============================================================
* V16.13.35 — Sección Propiedades Destacadas (premium)
* ============================================================ */
.esp-destacadas{background:linear-gradient(165deg,#0A1428 0%,#102347 55%,#0A1428 100%);padding:72px 20px;position:relative;overflow:hidden}
.esp-destacadas::before{content:"";position:absolute;top:-40%;right:-10%;width:480px;height:480px;background:radial-gradient(circle,rgba(232,197,71,.14),transparent 70%);pointer-events:none}
.esp-destacadas-inner{max-width:1180px;margin:0 auto;position:relative;z-index:1}
.esp-destacadas-head{text-align:center;margin-bottom:44px}
.esp-destacadas-tag{display:inline-block;color:#E8C547;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:2px;margin-bottom:12px}
.esp-destacadas-title{color:#fff;font-size:clamp(28px,4vw,42px);font-weight:800;margin:0 0 12px;line-height:1.15}
.esp-destacadas-sub{color:rgba(255,255,255,.7);font-size:15.5px;line-height:1.6;max-width:620px;margin:0 auto}
.esp-destacadas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:26px}
.esp-dest-card{background:#fff;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 50px rgba(0,0,0,.32);border:1px solid rgba(232,197,71,.25);transition:transform .25s,box-shadow .25s}
.esp-dest-card:hover{transform:translateY(-4px);box-shadow:0 28px 60px rgba(0,0,0,.42)}
.esp-dest-media{position:relative;aspect-ratio:16/10;background:#0A1428;overflow:hidden}
.esp-dest-video,.esp-dest-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.esp-dest-imglink{display:block;width:100%;height:100%}
.esp-dest-imglink img{width:100%;height:100%;object-fit:cover;display:block}
.esp-dest-badge{position:absolute;top:12px;left:12px;z-index:2;background:linear-gradient(135deg,#E8C547,#D4AF37);color:#1A1206;font-size:11.5px;font-weight:800;padding:5px 12px;border-radius:20px;text-transform:uppercase;letter-spacing:.5px;box-shadow:0 4px 12px rgba(0,0,0,.3)}
.esp-dest-body{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.esp-dest-op{font-size:12px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.5px}
.esp-dest-precio{font-size:24px;font-weight:800;color:var(--gray-dark);line-height:1.1}
.esp-dest-ubi{font-size:13.5px;color:var(--gray)}
.esp-dest-specs{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px;padding-top:12px;border-top:1px solid var(--border)}
.esp-dest-specs span{font-size:13px;color:var(--gray-dark);font-weight:600}
.esp-dest-btn{margin-top:auto;display:inline-block;text-align:center;background:linear-gradient(135deg,#1A56A8,#0A1428);color:#fff;font-size:14px;font-weight:700;padding:12px 18px;border-radius:10px;text-decoration:none;transition:opacity .2s}
.esp-dest-btn:hover{opacity:.9}
@media(max-width:600px){
.esp-destacadas{padding:56px 16px}
.esp-destacadas-grid{grid-template-columns:1fr}
}
/* V16.13.35 — Video en single-propiedad y compositor destacada */
.sp-video-wrap{position:relative;width:100%;aspect-ratio:16/9;margin-bottom:24px;border-radius:12px;overflow:hidden;background:#0A1428}
.sp-video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.prom-destacada-box{background:linear-gradient(135deg,#FEF9E7,#fff);border:1.5px solid #E8C547;border-radius:12px;padding:14px;margin:14px 0}
.prom-destacada-check{display:flex;align-items:flex-start;gap:9px;font-size:13px;cursor:pointer;line-height:1.5}
.prom-destacada-check input{margin-top:2px;width:17px;height:17px;flex-shrink:0}
/* ============================================================
* V16.13.36 — Botón premium destacadas (hero) + compositor + carrusel táctil
* ============================================================ */
/* Botón premium en el hero */
.search-btn-destacadas{
display:inline-flex;align-items:center;justify-content:center;
background:linear-gradient(135deg,#E8C547 0%,#D4AF37 50%,#B8941F 100%);
color:#1A1206;border:none;
padding:13px 26px;border-radius:10px;
font-size:14px;font-weight:800;letter-spacing:.02em;
white-space:nowrap;cursor:pointer;text-decoration:none;
box-shadow:0 8px 24px rgba(212,175,55,.45);
transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease;
}
.search-btn-destacadas:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(212,175,55,.6)}
@media(max-width:760px){
.search-btn-destacadas{flex:1 1 100%;width:100%}
}
/* Vista previa de fotos del compositor (numeración) */
.blog-comp-preview{margin:4px 0 12px}
.blog-comp-preview-hint{font-size:12px;color:var(--gray);margin:0 0 8px}
.blog-comp-thumbs{display:flex;flex-wrap:wrap;gap:10px}
.blog-comp-thumb{position:relative;width:100px;border-radius:10px;overflow:hidden;border:1.5px solid var(--border);background:var(--gray-light)}
.blog-comp-thumb img{width:100px;height:100px;object-fit:cover;display:block}
.blog-comp-rm{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;border:none;background:rgba(220,38,38,.92);color:#fff;font-size:11px;font-weight:700;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center}
.blog-comp-numbox{display:flex;align-items:center;gap:5px;padding:5px 6px;background:rgba(10,20,40,.06)}
.blog-comp-numlbl{font-size:11px;font-weight:700;color:var(--gray)}
.blog-comp-num{width:100%;border:1.5px solid var(--blue);border-radius:6px;padding:4px;font-size:14px;font-weight:700;text-align:center;color:var(--blue);outline:none}
.blog-comp-num:focus{background:#EFF4FB}
/* Carrusel táctil: cursor de arrastre */
.blog-lb-stage{cursor:grab;user-select:none}
.blog-lb-stage:active{cursor:grabbing}
.blog-lb-stage img{pointer-events:none}
/* Flechas del carrusel — solo en computadora */
.blog-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:none;background:rgba(255,255,255,.16);color:#fff;font-size:30px;line-height:1;cursor:pointer;z-index:3;transition:background .2s;display:none}
.blog-lb-nav:hover{background:rgba(255,255,255,.32)}
.blog-lb-prev{left:20px}
.blog-lb-next{right:20px}
@media(min-width:781px){
.blog-lb-nav{display:flex;align-items:center;justify-content:center}
}
/* ============================================================
* V16.13.39 — Panel admin: buscador, código de propiedad, enlace dueño
* ============================================================ */
.adm-buscador{position:relative;margin-bottom:14px}
.adm-buscador-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px;pointer-events:none}
.adm-buscador input{width:100%;box-sizing:border-box;padding:10px 12px 10px 36px;border:1.5px solid var(--border);border-radius:9px;font-size:13.5px;font-family:inherit;outline:none}
.adm-buscador input:focus{border-color:var(--blue)}
.adm-card-codigo{display:inline-block;background:var(--accent);color:var(--blue);font-size:11px;font-weight:700;padding:2px 8px;border-radius:10px;margin-left:6px;letter-spacing:.4px}
.adm-owner-link{color:var(--blue);text-decoration:underline;text-underline-offset:2px;cursor:pointer;font-weight:600}
.adm-owner-link:hover{color:var(--blue-dark)}
.adm-user-filtro{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--accent);border:1px solid var(--blue);border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:13px;color:var(--blue)}
.adm-user-filtro button{background:var(--blue);color:#fff;border:none;padding:6px 12px;border-radius:7px;font-size:12px;font-weight:600;cursor:pointer}
.adm-user-filtro button:hover{background:var(--blue-dark)}
/* V16.13.40 — Código de propiedad en el modal */
.plb-codigo{font-size:12px;color:var(--gray);margin-top:6px}
.plb-codigo strong{color:var(--blue);letter-spacing:.5px}
/* ============================================================
* V16.13.41 — Panel admin de cobertura Ciudad Maderas
* ============================================================ */
.cm-admin{background:#0E1A2B;padding:48px 20px}
.cm-admin-inner{max-width:920px;margin:0 auto;background:#fff;border-radius:16px;padding:26px}
.cm-admin-title{font-size:19px;font-weight:800;color:var(--gray-dark);margin:0 0 6px}
.cm-admin-sub{font-size:13px;color:var(--gray);margin:0 0 20px}
.cm-adm-estado{border:1.5px solid var(--border);border-radius:12px;padding:14px;margin-bottom:14px;background:var(--gray-light)}
.cm-adm-estado-head{display:flex;gap:8px;margin-bottom:10px}
.cm-adm-estado-nom{flex:1;border:1.5px solid var(--blue);border-radius:8px;padding:9px 12px;font-size:14.5px;font-weight:700;color:var(--gray-dark);outline:none}
.cm-adm-del-estado{background:#FEE2E2;border:1px solid #FCA5A5;color:#DC2626;font-size:12px;font-weight:700;padding:0 14px;border-radius:8px;cursor:pointer;white-space:nowrap}
.cm-adm-des{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#fff;border:1px solid var(--border);border-radius:9px;padding:9px;margin-bottom:7px}
.cm-adm-des-nom{flex:1;min-width:160px;border:1.5px solid var(--border);border-radius:7px;padding:8px 10px;font-size:13.5px;outline:none}
.cm-adm-des-nom:focus{border-color:var(--blue)}
.cm-adm-des-pdf{font-size:11.5px;font-weight:600;color:var(--gray)}
.cm-adm-des-subir{background:var(--accent);border:1.5px solid var(--blue);color:var(--blue);font-size:11.5px;font-weight:700;padding:7px 12px;border-radius:7px;cursor:pointer;white-space:nowrap}
.cm-adm-des-subir:hover{background:var(--blue);color:#fff}
.cm-adm-des-quitar{background:none;border:none;color:#DC2626;font-size:11.5px;font-weight:600;cursor:pointer;text-decoration:underline}
.cm-adm-del-des{width:28px;height:28px;border-radius:50%;border:none;background:rgba(220,38,38,.9);color:#fff;font-size:13px;font-weight:700;cursor:pointer;line-height:1}
.cm-adm-add-des{background:none;border:1.5px dashed var(--blue);color:var(--blue);font-size:12.5px;font-weight:700;padding:8px 14px;border-radius:8px;cursor:pointer;margin-top:4px}
.cm-admin-add-estado{background:var(--blue);color:#fff;border:none;font-size:13.5px;font-weight:700;padding:11px 20px;border-radius:9px;cursor:pointer;margin-top:8px}
.cm-admin-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:20px;padding-top:18px;border-top:1px solid var(--border)}
.cm-admin-guardar{background:linear-gradient(135deg,#16A34A,#15803D);color:#fff;border:none;font-size:14.5px;font-weight:800;padding:12px 26px;border-radius:9px;cursor:pointer}
.cm-admin-guardar:disabled{opacity:.6;cursor:default}
.cm-admin-msg{font-size:13px;font-weight:600}
.cm-admin-msg.ok{color:#15803D}
.cm-admin-msg.error{color:#DC2626}
@media(max-width:600px){.cm-admin-inner{padding:18px}}
/* ============================================================
* V16.13.44 — Recorrido del mes (Ciudad Maderas) + panel admin
* ============================================================ */
.cm-recorrido{background:linear-gradient(160deg,#102347,#0A1428);padding:64px 20px}
.cm-recorrido-inner{max-width:720px;margin:0 auto;text-align:center;background:#fff;border-radius:18px;padding:32px 28px;box-shadow:0 20px 50px rgba(0,0,0,.3);border:1px solid rgba(232,197,71,.3)}
.cm-recorrido-titulo{font-size:clamp(22px,3.4vw,30px);font-weight:800;color:#0A1428;margin:0 0 12px;line-height:1.2}
.cm-recorrido-desc{font-size:15px;line-height:1.7;color:#374151;margin-bottom:20px}
.cm-recorrido-desc p{margin:0 0 10px}
.cm-recorrido-img{border-radius:12px;overflow:hidden;margin-bottom:20px}
.cm-recorrido-img img{width:100%;height:auto;display:block}
.cm-recorrido-btn{display:inline-flex;align-items:center;gap:8px;background:#25D366;color:#fff;font-size:15px;font-weight:800;padding:14px 30px;border-radius:12px;text-decoration:none;box-shadow:0 8px 22px rgba(37,211,102,.4);transition:transform .2s}
.cm-recorrido-btn:hover{transform:translateY(-2px)}
/* Panel admin del recorrido */
.cm-rec-admin{background:#0E1A2B;padding:44px 20px}
.cm-rec-admin-inner{max-width:720px;margin:0 auto;background:#fff;border-radius:16px;padding:24px}
.cm-rec-admin-title{font-size:18px;font-weight:800;color:var(--gray-dark);margin:0 0 6px}
.cm-rec-admin-sub{font-size:13px;color:var(--gray);margin:0 0 16px}
.cm-rec-input,.cm-rec-textarea{width:100%;box-sizing:border-box;border:1.5px solid var(--border);border-radius:9px;padding:10px 13px;font-size:14px;font-family:inherit;outline:none;margin-bottom:10px}
.cm-rec-input:focus,.cm-rec-textarea:focus{border-color:var(--blue)}
.cm-rec-textarea{resize:vertical;line-height:1.55}
.cm-rec-img-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.cm-rec-file{display:inline-block;background:var(--gray-light);border:1.5px dashed var(--border);color:var(--gray-dark);font-size:13px;font-weight:600;padding:9px 16px;border-radius:9px;cursor:pointer}
.cm-rec-file:hover{border-color:var(--blue);color:var(--blue)}
.cm-rec-img-info{font-size:12.5px;color:var(--gray);font-weight:600}
.cm-rec-admin-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px}
.cm-rec-acciones{display:flex;gap:8px}
.cm-rec-guardar{background:linear-gradient(135deg,#16A34A,#15803D);color:#fff;border:none;font-size:14px;font-weight:800;padding:11px 24px;border-radius:9px;cursor:pointer}
.cm-rec-guardar:disabled{opacity:.6;cursor:default}
.cm-rec-eliminar{background:#FEE2E2;border:1px solid #FCA5A5;color:#DC2626;font-size:13px;font-weight:700;padding:11px 16px;border-radius:9px;cursor:pointer}
.cm-rec-msg{font-size:13px;font-weight:600}
.cm-rec-msg.ok{color:#15803D}
.cm-rec-msg.error{color:#DC2626}
@media(max-width:600px){.cm-recorrido-inner,.cm-rec-admin-inner{padding:20px 16px}}
/* V16.13.49 — Botón ocultar/mostrar propiedad + etiqueta */
.btn-hide{background:#FEF3C7;border:1px solid #FCD34D;color:#92400E;font-size:11px;font-weight:700;padding:5px 10px;border-radius:7px;cursor:pointer}
.btn-hide:hover{background:#FDE68A}
.btn-show{background:#DCFCE7;border:1px solid #86EFAC;color:#15803D;font-size:11px;font-weight:700;padding:5px 10px;border-radius:7px;cursor:pointer}
.btn-show:hover{background:#BBF7D0}
.adm-card-oculta{display:inline-block;background:#92400E;color:#fff;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:9px;margin-left:6px}
/* V16.13.50 — Botones de ocultar/mostrar masivo en la barra de selección */
.btn-bulk-hide{background:#FEF3C7;border:1px solid #FCD34D;color:#92400E;font-size:12px;font-weight:700;padding:7px 13px;border-radius:7px;cursor:pointer}
.btn-bulk-hide:hover{background:#FDE68A}
.btn-bulk-show{background:#DCFCE7;border:1px solid #86EFAC;color:#15803D;font-size:12px;font-weight:700;padding:7px 13px;border-radius:7px;cursor:pointer}
.btn-bulk-show:hover{background:#BBF7D0}
/* V16.13.54 — Contador de propiedades activas en el panel admin */
.adm-props-contador{background:#F0FDF4;border:1px solid #BBF7D0;color:#15803D;font-size:13px;font-weight:600;padding:9px 13px;border-radius:8px;margin-bottom:12px}
.adm-props-contador strong{font-size:15px;font-weight:800}
.adm-props-contador-sec{color:#6B7280;font-weight:500;font-size:12px}
/* V16.13.56 — Vista de detalle (datos completos) */
.btn-detalle{background:#EEF2FF;border:1px solid #C7D2FE;color:#3730A3;font-size:11px;font-weight:700;padding:5px 10px;border-radius:7px;cursor:pointer}
.btn-detalle:hover{background:#E0E7FF}
.det-sec{font-size:11.5px;font-weight:800;color:#8FA3BF;text-transform:uppercase;letter-spacing:.5px;margin:16px 0 8px;padding-bottom:5px;border-bottom:1px solid #E2E8F0}
.det-sec:first-child{margin-top:0}
.det-sec-admin{color:#92400E;border-bottom-color:#FCD34D}
.det-row{display:flex;justify-content:space-between;gap:14px;padding:6px 0;font-size:13px;border-bottom:1px solid #F1F5F9}
.det-row:last-child{border-bottom:none}
.det-label{color:#6B7280;font-weight:600;flex-shrink:0}
.det-val{color:#0A1428;font-weight:600;text-align:right;word-break:break-word}
.det-row-block{flex-direction:column;gap:4px}
.det-row-block .det-val{text-align:left;font-weight:500;line-height:1.5}
/* V16.13.59 — Noticias: tarjetas con color e ícono por categoría */
.news-card-text.news-inmobiliaria{border-left-color:#1A56A8}
.news-card-text.news-inmobiliaria:hover{border-left-color:#0A1428}
.news-card-text.news-inversion{border-left-color:#15803D}
.news-card-text.news-inversion:hover{border-left-color:#0F5C2C}
.news-cat-inmobiliaria{background:#E8F0FB !important;color:#1A56A8 !important}
.news-cat-inversion{background:#DCFCE7 !important;color:#15803D !important}
.news-aviso{margin:4px 0 20px;display:flex;align-items:center;gap:12px;background:#FEF3C7;border:1px solid #FCD34D;border-left:5px solid #F59E0B;color:#92400E;font-size:13.5px;font-weight:500;text-align:left;line-height:1.55;padding:15px 18px;border-radius:11px}
.news-aviso-ic{font-size:22px;flex-shrink:0;line-height:1}
.news-empty{background:#F1F5F9;border:1px dashed #CBD5E1;color:#64748B;border-radius:10px;padding:30px 20px;text-align:center;font-size:13px;line-height:1.6}
/* V16.13.61 — Marcar como no disponible */
.btn-no-disp{background:#FEE2E2;border:1px solid #FCA5A5;color:#991B1B;font-size:11px;font-weight:700;padding:5px 10px;border-radius:7px;cursor:pointer}
.btn-no-disp:hover{background:#FECACA}
.tag-no-disp{display:inline-flex;align-items:center;background:#FEE2E2;border:1px solid #FCA5A5;color:#991B1B;font-size:11px;font-weight:700;padding:5px 10px;border-radius:7px}
.adm-card-no-disp{display:inline-block;background:#991B1B;color:#fff;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:9px;margin-left:6px}
/* V16.13.65 — Campo ¿Acepta créditos inmobiliarios? */
.esp-cred-radios{display:flex;gap:18px;margin-top:4px}
.esp-cred-radios label{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:500;cursor:pointer}
.esp-cred-list{margin-top:6px;padding:12px 14px;background:#F1F5F9;border:1px solid #D8E2EF;border-radius:9px}
.esp-cred-list label{display:flex;align-items:center;gap:8px;font-size:13.5px;margin-bottom:7px;cursor:pointer}
.esp-cred-list label:last-of-type{margin-bottom:0}
.esp-cred-list input[type="text"]{width:100%;padding:9px 11px;border:1.5px solid #D8E2EF;border-radius:8px;font-size:13.5px}
.esp-cred-rp{margin-top:6px;background:#ECFDF5;border:1px solid #A7F3D0;border-left:4px solid #15803D;color:#15803D;font-size:13.5px;font-weight:600;padding:11px 14px;border-radius:9px}
/* V16.13.66 — Reset de checkboxes y radios del bloque de créditos
(el CSS de .form-group input los estiraba como cajas de texto) */
.esp-cred-radios input[type="radio"],
.esp-cred-list input[type="checkbox"]{
width:18px;height:18px;min-width:18px;flex-shrink:0;
padding:0;margin:0;border:1px solid #94A3B8;border-radius:4px;
-webkit-appearance:auto;appearance:auto;accent-color:#1A56A8;
cursor:pointer;box-shadow:none;background:#fff
}
.esp-cred-radios input[type="radio"]{border-radius:50%}
.esp-cred-radios input[type="radio"]:focus,
.esp-cred-list input[type="checkbox"]:focus{box-shadow:none}
.esp-cred-list label,.esp-cred-radios label{justify-content:flex-start;text-align:left}
/* V16.13.67 — Resaltado de la propiedad a revisar (desde el correo) */
.adm-card-resaltada{animation:espResalta 1s ease-in-out 0s 3;border:2px solid #1A56A8 !important;box-shadow:0 0 0 4px rgba(26,86,168,.18) !important}
@keyframes espResalta{0%,100%{box-shadow:0 0 0 4px rgba(26,86,168,.18)}50%{box-shadow:0 0 0 8px rgba(26,86,168,.30)}}
/* V16.13.100 — Video dentro del lightbox de propiedad (cualquier propiedad, no solo destacadas) */
.plb-video{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#0A1428;margin-top:6px}
.plb-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* V16.14.1 — Indicador de video en la tarjeta del grid (play rojo estilo YouTube) */
.carousel-video-badge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;z-index:4}
.carousel-video-badge:hover .cvb-play{background:#cc0000;transform:scale(1.06)}
.cvb-play{transition:transform .15s,background .15s}
.cvb-play{width:58px;height:58px;border-radius:50%;background:#FF0000;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 14px rgba(0,0,0,.45);border:3px solid rgba(255,255,255,.9)}
.cvb-play svg{margin-left:2px}
.cvb-text{background:rgba(0,0,0,.75);color:#fff;font-size:11px;font-weight:800;padding:3px 11px;border-radius:20px;letter-spacing:.6px}
/* Modal de confirmación de envío de propiedad */
.esp-modal-overlay{
position:fixed;inset:0;z-index:9999;
background:rgba(11,22,33,.62);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
display:flex;align-items:center;justify-content:center;padding:20px;
animation:esp-fade .2s ease;
}
@keyframes esp-fade{from{opacity:0}to{opacity:1}}
.esp-modal{
background:#fff;border-radius:18px;max-width:460px;width:100%;
padding:28px 26px 22px;box-shadow:0 30px 80px rgba(0,0,0,.4);
animation:esp-pop .25s cubic-bezier(.22,1,.36,1);
}
@keyframes esp-pop{from{transform:translateY(16px) scale(.97);opacity:0}to{transform:none;opacity:1}}
.esp-modal-title{margin:0 0 10px;font-size:21px;font-weight:700;color:#0B1621;line-height:1.25}
.esp-modal-text{margin:0 0 22px;font-size:15px;line-height:1.55;color:#445}
.esp-modal-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.esp-modal-btn{
border:none;border-radius:11px;padding:12px 20px;font-size:14px;font-weight:600;
cursor:pointer;font-family:inherit;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.esp-modal-secondary{background:#EEF1F4;color:#374151}
.esp-modal-secondary:hover{background:#E2E7EC}
.esp-modal-primary{background:linear-gradient(135deg,#3B82F6 0%,#1A56A8 100%);color:#fff;box-shadow:0 8px 22px rgba(59,130,246,.4)}
.esp-modal-primary:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(59,130,246,.55)}
@media (max-width:420px){
.esp-modal-actions{flex-direction:column-reverse}
.esp-modal-btn{width:100%}
}