/* Bloque Futura · Hero — self-contained (tokens + fuente propios, no depende del theme) */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600;700&display=swap');

.futura-hero{
  --fh-tinta:#0F172A; --fh-navy:#1A2744; --fh-azul:#2563EB; --fh-line:#E7EAF0; --fh-muted:#5B6472; --fh-muted2:#94A0B2;
  position:relative; width:100%; font-family:'Jost',sans-serif;
  background-image:
    linear-gradient(100deg, #EAF1FB 0%, rgba(234,241,251,.94) 26%, rgba(234,241,251,.60) 45%, rgba(234,241,251,0) 62%),
    var(--fh-img, linear-gradient(135deg,#4a6da3 0%,#22304f 60%,#141f38 100%));
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
.futura-hero .fh-inner{ position:relative; z-index:2; max-width:1300px; margin:0 auto; padding:60px clamp(20px,3vw,38px) 66px; }
.futura-hero .fh-col{ width:60%; }
.futura-hero .fh-eyebrow{ display:flex; align-items:center; gap:9px; font-size:13px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:var(--fh-azul); margin:0 0 18px; }
.futura-hero .fh-eyebrow::before{ content:''; width:8px; height:8px; border-radius:50%; background:var(--fh-azul); flex-shrink:0; }
.futura-hero .fh-title{ font-family:'Jost',sans-serif; font-weight:600; font-size:clamp(36px,5vw,60px); line-height:1.04; letter-spacing:-1.4px; color:var(--fh-tinta); margin:0 0 20px; }
.futura-hero .fh-title .azul{ color:var(--fh-azul); }
.futura-hero .fh-sub{ font-size:clamp(15px,1.5vw,18px); line-height:1.6; color:var(--fh-muted); margin:0 0 28px; max-width:500px; }

.futura-hero .fh-tabs{ display:flex; gap:12px; flex-wrap:wrap; }
.futura-hero .fh-tab{ display:inline-flex; align-items:center; gap:9px; font-family:'Jost',sans-serif; font-size:15px; font-weight:600;
  padding:14px 24px; border-radius:12px; text-decoration:none; border:1.5px solid var(--fh-line); background:#fff; color:var(--fh-navy);
  box-shadow:0 4px 14px rgba(15,23,42,.05); transition:all .15s; cursor:pointer; line-height:1; -webkit-appearance:none; appearance:none; }
.futura-hero .fh-tab svg{ width:18px; height:18px; }
.futura-hero .fh-tab:hover{ border-color:#C9D6F5; color:var(--fh-azul); }
.futura-hero .fh-tab.is-active{ background:var(--fh-azul); border-color:var(--fh-azul); color:#fff; box-shadow:0 8px 22px rgba(37,99,235,.28); }

/* Tarjetas flotantes */
.futura-hero .fh-card{ position:absolute; z-index:3; display:flex; align-items:center; gap:11px; background:rgba(255,255,255,.97);
  backdrop-filter:blur(6px); border-radius:14px; padding:11px 15px; box-shadow:0 14px 38px rgba(15,23,42,.16); }
.futura-hero .fh-card .ic{ width:36px; height:36px; border-radius:10px; background:#EAF1FF; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--fh-azul); }
.futura-hero .fh-card .ic svg{ width:19px; height:19px; }
.futura-hero .fh-card b{ display:block; font-size:14px; color:var(--fh-navy); line-height:1.15; }
.futura-hero .fh-card span{ display:block; font-size:12px; color:var(--fh-muted); }
.futura-hero .fh-c1{ top:14%; right:25%; }
.futura-hero .fh-c2{ top:45%; right:4%; }
.futura-hero .fh-c3{ bottom:16%; right:21%; }
.futura-hero .fh-logo{ position:absolute; z-index:3; top:29%; right:12%; width:58px; height:58px; border-radius:16px; background:var(--fh-azul);
  display:flex; align-items:center; justify-content:center; color:#fff; box-shadow:0 14px 34px rgba(37,99,235,.4); }
.futura-hero .fh-logo svg{ width:30px; height:30px; }

/* ── Buscador dentro del hero ── */
.futura-hero .fh-search-card{ position:relative; z-index:2; max-width:920px; margin:34px 0 0; background:#fff; border:1px solid var(--fh-line);
  border-radius:18px; box-shadow:0 18px 44px rgba(15,23,42,.10); padding:22px 24px 24px; }
.futura-hero .fh-sc-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.futura-hero .fh-sc-head b{ font-family:'Jost',sans-serif; font-size:18px; font-weight:600; color:var(--fh-tinta); }
.futura-hero .fh-sc-head em{ font-style:normal; font-size:11.5px; font-weight:600; color:var(--fh-azul); background:#EAF1FF; padding:4px 11px; border-radius:999px; }
.futura-hero .fh-search{ display:flex; gap:10px; }
/* Buscador de 3 campos: Tipo · Dormitorios · ¿Dónde? + botón */
.futura-hero .fh-search-3{ display:grid; grid-template-columns:1fr 1fr 1.25fr auto; gap:10px; align-items:end; }
.futura-hero .fh-field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.futura-hero .fh-field > span{ font-size:12px; font-weight:600; color:var(--fh-navy); padding-left:2px; }
.futura-hero .fh-field select{ width:100%; min-width:0; appearance:none; -webkit-appearance:none; cursor:pointer;
  border:1.5px solid var(--fh-line); background:#F7F9FC; border-radius:12px; padding:13px 34px 13px 14px;
  font-family:'Jost',sans-serif; font-size:14.5px; color:#334155; outline:none; transition:border .15s, background .15s;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; background-size:16px; }
.futura-hero .fh-field select:focus{ border-color:var(--fh-azul); background-color:#fff; }
.futura-hero .fh-search-3 button{ display:flex; align-items:center; gap:8px; background:var(--fh-azul); color:#fff; border:none; border-radius:12px;
  padding:0 24px; height:47px; font-family:'Jost',sans-serif; font-size:15px; font-weight:600; cursor:pointer; white-space:nowrap; transition:background .15s; }
.futura-hero .fh-search-3 button:hover{ background:#1D4ED8; }
.futura-hero .fh-search-3 button svg{ width:18px; height:18px; }
.futura-hero .fh-ia{ display:flex; align-items:center; gap:8px; margin:14px 0 0; font-size:13px; color:var(--fh-muted); }
.futura-hero .fh-ia svg{ width:16px; height:16px; color:var(--fh-azul); flex-shrink:0; }
.futura-hero .fh-ia a{ color:var(--fh-azul); font-weight:600; text-decoration:none; }

@media (max-width:1024px){
  .futura-hero{ background-image:
    linear-gradient(180deg, rgba(244,248,255,.93) 0%, rgba(234,241,251,.80) 50%, rgba(234,241,251,.90) 100%),
    var(--fh-img, linear-gradient(135deg,#4a6da3,#141f38)); }
  .futura-hero .fh-col{ width:100%; }
  .futura-hero .fh-card, .futura-hero .fh-logo{ display:none; }
}
@media (max-width:820px){
  /* 2 columnas: Tipo + Dormitorios arriba, ¿Dónde? y botón abajo (botón a lo ancho) */
  .futura-hero .fh-search-3{ grid-template-columns:1fr 1fr; }
  .futura-hero .fh-search-3 button{ grid-column:1 / -1; height:48px; justify-content:center; }
}
@media (max-width:640px){
  .futura-hero .fh-inner{ padding:40px 20px 46px; }
  .futura-hero .fh-tab{ flex:1; justify-content:center; }
  .futura-hero .fh-search-3{ grid-template-columns:1fr; }
}
