/* ===========================================================================
     Estilos propios de la PORTADA (index).
     El marco común (tokens, reset, tipografía, cabecera, pie, botones flotantes
     y botones base) vive en extras.css, que se carga en todas las páginas.
     =========================================================================== */

  /* ===== HERO CARRUSEL (kaufen: foto a todo el ancho, deslizando) ===== */
  .hero{position:relative;}
  .carousel{position:relative;height:min(66vh,560px);overflow:hidden;background:#0a1a30;}
  .slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.1s ease;}
  .slide.on{opacity:1;}
  .carousel::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(90deg, rgba(0,20,45,.72) 0%, rgba(0,20,45,.30) 45%, rgba(0,20,45,.08) 100%),
               linear-gradient(0deg, rgba(0,20,45,.55), transparent 40%);}
  .hero-ov{position:absolute;inset:0;z-index:2;display:flex;align-items:center;}
  .hero-ov .wrap{width:100%;}
  .hero-ov .eyebrow{color:var(--gold);}
  .hero-ov .eyebrow::before{background:var(--gold);}
  .hero-ov h1{color:#fff;font-size:clamp(30px,4.6vw,52px);max-width:16ch;letter-spacing:-.025em;text-shadow:0 2px 24px rgba(0,10,25,.4);}
  .hero-ov p{color:#EAF0F8;font-size:clamp(15px,1.8vw,19px);max-width:44ch;margin:18px 0 26px;}
  .carousel .fp{position:absolute;top:20px;right:22px;z-index:4;display:inline-flex;align-items:center;gap:10px;
    background:rgba(0,20,45,.5);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.32);color:#fff;
    padding:8px 14px 8px 8px;border-radius:999px;font-size:13.5px;font-weight:600;transition:opacity .5s;}
  .carousel .fp .fp-op{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:800;color:#0a1a30;background:var(--gold);padding:4px 9px;border-radius:6px;}
  .carousel .fp .fp-p{color:var(--gold);font-weight:800;}
  @media(max-width:640px){ .carousel .fp{top:14px;right:14px;left:14px;justify-content:center;font-size:12px;padding:7px 12px 7px 7px;} }
  .btn-gold{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:#3a2606;font-weight:800;font-size:15px;padding:13px 24px;border-radius:var(--r-sm);transition:.15s;}
  .btn-gold:hover{filter:brightness(1.06);transform:translateY(-1px);}
  .dots{position:absolute;bottom:18px;left:0;right:0;z-index:3;display:flex;gap:9px;justify-content:center;}
  .dots span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.5);cursor:pointer;transition:.2s;}
  .dots span.on{background:var(--gold);width:26px;border-radius:6px;}
  .cnav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;background:rgba(0,20,45,.35);border:1px solid rgba(255,255,255,.3);
    color:#fff;width:44px;height:44px;border-radius:50%;cursor:pointer;font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;transition:.15s;}
  .cnav:hover{background:var(--navy);} .cnav.prev{left:18px;} .cnav.next{right:18px;}
  @media(max-width:760px){ .carousel{height:64vh;} .cnav{display:none;} }
  /* Botón discreto para ir al detalle de la propiedad destacada del hero */
  .ver-prop{position:absolute;right:18px;bottom:16px;z-index:4;display:inline-flex;align-items:center;gap:7px;
    background:rgba(0,20,45,.55);border:1px solid rgba(255,255,255,.32);color:#fff;font-weight:700;font-size:13px;
    padding:9px 16px;border-radius:999px;backdrop-filter:blur(6px);transition:background .15s,color .15s,border-color .15s;}
  .ver-prop:hover{background:var(--gold);color:#20160a;border-color:var(--gold);}
  .ver-prop svg{transition:transform .15s;} .ver-prop:hover svg{transform:translateX(2px);}
  @media(max-width:640px){ .ver-prop{right:12px;bottom:12px;font-size:12px;padding:8px 13px;} }

  /* ===== BUSCADOR (banda debajo del hero) ===== */
  .searchband{background:var(--surface-2);border-bottom:1px solid var(--line);}
  .searchband .wrap{padding:26px 22px;}
  .search-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:16px 18px;margin-top:-46px;position:relative;z-index:5;}
  @media(max-width:760px){ .search-card{margin-top:18px;} }
  .fields{display:grid;grid-template-columns:auto 1fr 1fr 1fr auto;gap:12px;align-items:end;}
  .field{position:relative;}
  .field label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--muted);margin-bottom:6px;}
  .field select{width:100%;height:46px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);border-radius:var(--r-sm);padding:0 14px;font-family:var(--sans);font-size:14.5px;font-weight:500;appearance:none;}
  .field:has(select)::after{content:"";position:absolute;right:14px;bottom:18px;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);pointer-events:none;}
  .ops{display:inline-flex;background:var(--surface-2);border:1px solid var(--line-2);border-radius:999px;padding:4px;height:46px;align-items:center;}
  .ops button{border:0;background:none;cursor:pointer;font-family:var(--sans);font-size:13.5px;font-weight:700;color:var(--muted);padding:0 18px;height:38px;border-radius:999px;transition:.16s;white-space:nowrap;}
  .ops button.on{background:var(--navy);color:#fff;}
  .btn-search{height:46px;padding:0 26px;border:0;border-radius:var(--r-sm);cursor:pointer;background:var(--navy);color:#fff;font-family:var(--sans);font-weight:700;font-size:14.5px;display:inline-flex;align-items:center;gap:8px;transition:.15s;white-space:nowrap;}
  .btn-search:hover{background:var(--navy-2);}
  .search-more{margin:13px 2px 0;font-size:12.5px;color:var(--muted);}
  .search-more a{color:var(--gold-ink);font-weight:700;}
  @media(max-width:900px){ .fields{grid-template-columns:1fr 1fr;} .ops-field,.btn-search{grid-column:1/-1;} .ops{width:100%;justify-content:center;} }
  @media(max-width:520px){ .fields{grid-template-columns:1fr;} }

  /* ===== SECTION ===== */
  section.block{padding:62px 0;}
  .alt{background:var(--surface-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  /* parallax: imagen de propiedad fija mientras el contenido se desplaza */
  .parallax{background-attachment:fixed;background-position:center;background-size:cover;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .parallax .sec-head h2{color:#fff;} .parallax .sec-head p{color:#E4EAF2;}
  @media(max-width:820px){ .parallax{background-attachment:scroll;} }
  .sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:30px;}
  .sec-head h2{font-size:clamp(24px,3.1vw,34px);}
  .sec-head p{margin:9px 0 0;color:var(--muted);max-width:56ch;font-size:14.5px;}
  .link-all{color:var(--gold-ink);font-weight:700;font-size:13.5px;flex-shrink:0;white-space:nowrap;}
  .link-all:hover{color:var(--gold);}

  /* ===== CARD GRID (fotos reales) ===== */
  .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  @media(max-width:900px){ .grid{grid-template-columns:repeat(2,1fr);} }
  @media(max-width:560px){ .grid{grid-template-columns:1fr;} }
  .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;position:relative;}
  .card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s;z-index:3;}
  .card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);} .card:hover::before{transform:scaleX(1);}
  .card .ph{position:relative;aspect-ratio:16/10;overflow:hidden;}
  .card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
  .card:hover .ph img{transform:scale(1.05);}
  .badge-op{position:absolute;left:12px;top:12px;z-index:2;background:var(--navy);color:#fff;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:6px 11px;border-radius:6px;}
  .badge-op.rent{background:var(--gold);color:#3a2606;}
  .card .body{padding:16px 17px 17px;display:flex;flex-direction:column;flex:1;}
  .card h3{font-size:17.5px;line-height:1.22;}
  .card .loc{color:var(--muted);font-size:12.5px;margin:5px 0 0;}
  .card .mini{display:flex;gap:14px;margin:12px 0;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;color:var(--body);flex-wrap:wrap;}
  .card .mini span{display:flex;align-items:center;gap:6px;font-weight:600;}
  .card .foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;gap:10px;}
  .card .price{font-size:19.5px;font-weight:800;color:var(--ink);letter-spacing:-.02em;}
  .card .wa-mini{display:inline-flex;align-items:center;gap:6px;background:rgba(34,180,87,.12);color:var(--wa-ink);font-weight:700;font-size:12.5px;padding:8px 12px;border-radius:999px;transition:.15s;}
  .card .wa-mini:hover{background:var(--wa);color:#fff;} .card .wa-mini svg{width:15px;height:15px;}
  .card .ph>a{display:block;width:100%;height:100%;}
  .card .mas{display:inline-flex;align-items:center;gap:5px;background:var(--navy);color:#fff;font-weight:700;font-size:12.5px;padding:8px 15px;border-radius:999px;transition:background .15s;}
  .card .mas:hover{background:var(--navy-2);}
  .center{text-align:center;margin-top:36px;}

  /* ===== CATEGORÍAS ===== */
  .cats{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
  .cat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px 12px;text-align:center;transition:.18s;cursor:pointer;}
  .cat:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:var(--shadow);}
  .cat svg{width:28px;height:28px;color:var(--navy);margin:0 auto 12px;transition:.18s;}
  .cat:hover svg{color:var(--gold-ink);}
  .cat b{display:block;color:var(--ink);font-size:14px;} .cat span{font-size:11.5px;color:var(--muted);}
  @media(max-width:820px){ .cats{grid-template-columns:repeat(3,1fr);} }
  @media(max-width:460px){ .cats{grid-template-columns:repeat(2,1fr);} }

  /* ===== NOSOTROS (foto real oficina) ===== */
  .about{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center;}
  .about .ph{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);}
  .about .ph img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/11;}
  .about h2{font-size:clamp(23px,3vw,32px);}
  .about p{color:var(--body);font-size:14.5px;margin:16px 0;}
  .about .stats{display:flex;gap:30px;margin-top:22px;flex-wrap:wrap;}
  .about .stats .s b{font-size:30px;color:var(--gold-ink);font-weight:800;display:block;line-height:1;}
  .about .stats .s span{font-size:12.5px;color:var(--muted);}
  @media(max-width:760px){ .about{grid-template-columns:1fr;gap:24px;} }

  /* ===== CAPTACIÓN ===== */
  .capta{text-align:center;max-width:660px;margin:0 auto;}
  .capta h2{color:#fff;font-size:clamp(23px,3vw,32px);}
  .capta p{color:#E4EAF2;margin:14px auto 24px;max-width:52ch;font-size:14.5px;}
  .capta .cta-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;}
  .capta .btn-outline{border-color:rgba(255,255,255,.6);color:#fff;background:transparent;}
  .capta .btn-outline:hover{background:#fff;color:var(--navy);border-color:#fff;}
  /* formulario de contacto */
  .cform-card{max-width:720px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:28px;}
  .frow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
  .ffield.full{grid-column:1/-1;}
  .ffield label{display:block;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--muted);margin-bottom:6px;}
  .ffield input{width:100%;height:46px;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:0 14px;font-family:var(--sans);font-size:14.5px;color:var(--ink);background:var(--surface);transition:border-color .15s,box-shadow .15s;}
  .ffield input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(0,51,102,.12);}
  .ffield input.err,.ffield textarea.err{border-color:#C0392B;box-shadow:0 0 0 3px rgba(192,57,43,.12);}
  .ffield textarea{width:100%;min-height:112px;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:12px 14px;font-family:var(--sans);font-size:14.5px;color:var(--ink);background:var(--surface);resize:vertical;transition:border-color .15s,box-shadow .15s;}
  .ffield textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(0,51,102,.12);}
  /* Placeholder suave: que se note como pista y no como campo ya lleno */
  .ffield input::placeholder,.ffield textarea::placeholder{color:#CFCEC5;opacity:1;}
  /* Select "Motivo del mensaje": mismo alto y marco que los inputs, con chevron propio */
  .ffield.sel{position:relative;}
  .ffield select{width:100%;height:46px;border:1px solid var(--line-2);border-radius:var(--r-sm);padding:0 38px 0 14px;font-family:var(--sans);font-size:14.5px;color:var(--ink);background:var(--surface);appearance:none;-webkit-appearance:none;cursor:pointer;transition:border-color .15s,box-shadow .15s;}
  .ffield select:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(0,51,102,.12);}
  .ffield.sel::after{content:"";position:absolute;right:15px;bottom:18px;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);pointer-events:none;}
  /* Fila del label del RUT con el toggle "Extranjero" alineado a la derecha */
  .ffield-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;min-height:17px;}
  .ffield-top label{margin-bottom:0;}
  .rut-ext{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--muted);cursor:pointer;user-select:none;}
  .rut-ext input{width:14px;height:14px;margin:0;accent-color:var(--navy);cursor:pointer;}
  /* Aviso de validación en vivo, bajo cada campo */
  .ffield .fhint{display:none;margin-top:5px;font-size:12px;font-weight:600;color:#C0392B;line-height:1.3;}
  .ffield .fhint.show{display:block;}
  .btn-submit{width:100%;height:50px;border:0;border-radius:var(--r-sm);background:var(--navy);color:#fff;font-family:var(--sans);font-weight:700;font-size:15px;cursor:pointer;transition:background .15s;}
  .btn-submit:hover{background:var(--navy-2);}
  .fmsg{margin:12px 2px 0;font-size:13.5px;font-weight:600;min-height:18px;text-align:center;}
  .fmsg.ok{color:var(--wa-ink);} .fmsg.bad{color:#C0392B;}
  @media(max-width:600px){ .frow{grid-template-columns:1fr;} }