:root{--verde-whatsapp:#64731E;--beige:#faf3e7;--cafe:#422a1c;color-scheme:only light;--fuente:"Segoe UI",system-ui,sans-serif;font-family:var(--fuente);color:var(--cafe);background:var(--beige)}*{box-sizing:border-box}body,figure,h1,h2,h3{margin:0}header,footer,nav,.brand,.controls,.filters{display:flex;align-items:center}header,footer{justify-content:space-between;padding:20px 4vw;gap:20px}header{border-bottom:1px solid #d9d7cd}.brand{text-decoration:none;gap:12px}.brand b{font:48px/.85 var(--fuente);letter-spacing:-5px}.brand span{font-size:12px;line-height:1.1}nav,.filters{gap:clamp(12px,2.6vw,45px);flex-wrap:wrap}a,button{color:inherit}nav a,.card{text-decoration:none}a:hover,nav a:focus-visible{text-decoration:underline;text-underline-offset:5px}button{cursor:pointer;font:inherit}img{display:block;width:100%;object-fit:cover}.showcase{position:relative;background:var(--beige);color:var(--cafe)}.slide img{height:clamp(420px,78vh,900px)}.slide:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,#15140fd6);pointer-events:none}.caption,.controls{position:absolute;z-index:1;bottom:6%;left:4vw}.controls{left:auto;right:4vw;gap:15px}.controls button{background:transparent;color:var(--cafe);border:1px solid currentColor;border-radius:50%;height:44px;width:44px}.caption h2,h1,.archive h2,.intro h2{font:normal clamp(44px,7vw,112px)/1.08 var(--fuente);letter-spacing:-.03em;margin:12px 0 22px}.caption a,.intro a{text-underline-offset:6px}small,figcaption,.controls span{font-size:14px;font-weight:600;letter-spacing:.055em;text-transform:uppercase}.archive,.intro,.services{padding:clamp(44px,7vw,105px) 5vw}.archive{border-bottom:1px solid #c9c7be}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card img{aspect-ratio:4/5;margin-bottom:14px}.card h3{font:normal 30px var(--fuente);margin-top:7px}.filters{margin:0 0 28px}.filters button{border:0;border-bottom:1px solid transparent;background:none;padding:8px 0}.filters [aria-pressed=true]{border-color:currentColor}.wide{max-height:85vh}.banner{height:42vh}figcaption{margin:10px 5vw}.services{padding-top:20px}.services section{border-top:1px solid #c9c7be;padding:28px 0}.services h2{font:normal 32px var(--fuente)}p,li{line-height:1.65;max-width:65ch}footer{border-top:1px solid #c9c7be;font-size:13px}.sr{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}[hidden]{display:none!important}@media(max-width:680px){header,footer{align-items:flex-start;flex-direction:column}nav{font-size:14px}.grid{grid-template-columns:1fr}.card img{aspect-ratio:4/3}.caption{bottom:88px}.controls{bottom:20px}.slide img{height:67vh}.filters{gap:24px}}
.caption {
  background: var(--beige);
  color: var(--cafe);
  padding: clamp(14px, 2vw, 28px);
  max-width: min(84vw, 760px);
}
.controls {
  background: var(--beige);
  color: var(--cafe);
  padding: 5px 9px;
  border-radius: 32px;
}
@media (min-width: 681px) {
  .caption { max-width: calc(92vw - 225px); }
}
body, header, main, footer, .archive, .intro, .services, .card, .filters {
  background-color: var(--beige);
  color: var(--cafe);
}
h1, h2, h3, p, small, figcaption, nav a, a:visited, .filters button {
  color: var(--cafe);
}
.catalogo { background: var(--beige); color: var(--cafe); padding: clamp(28px,4vw,64px) 5vw; }
.cabecera-servicios { margin-bottom: clamp(24px,3vw,48px); }
.cabecera-servicios h1 { font-size: clamp(36px,5vw,78px); max-width: 19ch; }
.fichas-servicios { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 48px 4vw; }
.fichas-servicios img { aspect-ratio: 2.4; margin-bottom: 14px; }
.fichas-servicios h2 { font: normal clamp(26px,3vw,44px)/1.1 var(--fuente); margin: 12px 0; }
.fichas-servicios article { border-bottom: 1px solid var(--cafe); padding-bottom: 24px; }
.cotizar { display: inline-block; padding: 10px 14px; border: 1px solid currentColor; text-decoration: none; }
@media(max-width:680px) { .fichas-servicios { grid-template-columns: 1fr; } }
.casa-demo {max-width: 920px; margin: 20px auto;}
.fotos-casa img {width:100%;aspect-ratio: 16/9;object-fit:cover;}
.casa-demo figcaption {margin:12px 0;}
.pasos-casa {display:flex;align-items:center;gap:12px;}
.pasos-casa button {width:44px;height:44px;color:var(--cafe);background:var(--beige);border:1px solid currentColor;border-radius:50%;}
.catalogo-casas {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,255px),1fr));gap:24px;margin:24px 0;}
.catalogo-casas .casa-demo {margin:0;width:100%;}
.catalogo-casas img {aspect-ratio:4/3;}
.catalogo-casas figcaption strong {display:block;font:normal 28px var(--fuente);text-transform:none;letter-spacing:0;margin-top:6px;}
.contacto-flotante {position:fixed;z-index:10;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));color:var(--cafe);}
.contacto-flotante .chat-wa {display:flex;align-items:center;gap:9px;padding:11px 18px;min-height:56px;cursor:pointer;list-style:none;border-radius:40px;background:var(--cafe);color:var(--beige);border:2px solid var(--beige);box-shadow:0 3px 14px #422a1c45;font-weight:bold;}
.contacto-flotante .chat-wa::-webkit-details-marker {display:none;}
.contacto-panel {position:absolute;right:0;bottom:calc(100% + 10px);width:min(290px,85vw);padding:20px;background:var(--beige);border:1px solid var(--cafe);box-shadow:0 5px 22px #422a1c33;}
.contacto-panel p {margin:8px 0 14px;}
footer {padding-bottom:96px;}
:where(button,a,summary):focus-visible {outline:3px solid #865127;outline-offset:3px;}
@media (hover:hover) {
  .cotizar:hover,.controls button:hover,.pasos-casa button:hover,.filters button:hover {background:var(--cafe);color:var(--beige);}
  .cotizar:hover,.contacto-flotante .chat-wa:hover {transform:translateY(-2px);box-shadow:0 5px 14px #422a1c44;}
  nav a:hover {text-decoration:underline;text-underline-offset:5px;}
}
@media (prefers-reduced-motion:no-preference) {
  .cotizar,.controls button,.pasos-casa button,.filters button,.contacto-flotante .chat-wa {transition:background-color .16s,color .16s,transform .16s,box-shadow .16s;}
}
@media(max-width:680px){.contacto-flotante .chat-wa span{display:none;}.contacto-flotante .chat-wa{padding:10px;}}
/* Limita la escala de las tarjetas en monitores anchos. */
.fichas-servicios, .catalogo-casas, .cabecera-servicios, .catalogo > h2 {
  max-width: 1480px;
  margin-inline: auto;
}
.contacto-panel { max-height: calc(100dvh - 100px); overflow-y: auto; }
@media (max-width: 680px) {
  header nav { width: 100%; gap: 0 16px; }
  header nav a, .filters button { min-height: 44px; display: inline-flex; align-items: center; }
  .controls { left: 4vw; right: auto; }
  .slide img { height: clamp(350px, 65svh, 600px); }
}
@media (max-height: 480px) and (orientation: landscape) {
  .slide img { height: max(310px,80svh); }
  .caption h2 { font-size: clamp(32px,5vw,56px); }
}
/* Cabecera y portada editorial */
header { flex-direction:column; align-items:center; gap:14px; padding:20px 4vw 0; border-bottom:1px solid var(--cafe); }
header .brand { align-items:center; gap:16px; }
header .brand b { font-size:clamp(48px,5vw,78px); }
header .brand span { font:normal clamp(17px,1.6vw,25px)/1 var(--fuente); }
header nav { justify-content:center; width:100%; padding:8px 0; border-top:1px solid #422a1c55; }
header nav a { font-size:14px; }
.catalogo:has(.portada-texto) { padding-top:clamp(18px,2vw,36px); }
.cabecera-servicios { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr); align-items:center; gap:4vw; margin-bottom:clamp(35px,5vw,75px); }
.cabecera-servicios h1 { font-size:clamp(38px,4.8vw,78px); line-height:1.01; margin-block:18px; }
.portada-foto img { aspect-ratio:1.45; }
.portada-foto figcaption { margin:8px 0 0; font-size:11px; }
.portada-texto a { display:inline-block; margin:6px 14px 6px 0; text-underline-offset:5px; }
.catalogo > h2 { font:normal clamp(30px,3.5vw,56px)/1.1 var(--fuente); border-top:1px solid var(--cafe); padding:18px 0; }
.fichas-servicios { gap:40px 2.5vw; }
.fichas-servicios img { aspect-ratio:2; }
.fichas-servicios small,.catalogo-casas small { letter-spacing:.12em; font-size:12px; }
#casas { border-block:1px solid var(--cafe); }
.catalogo-casas { gap:clamp(16px,2vw,36px); }
.catalogo-casas figcaption { border-top:1px solid var(--cafe); padding-top:12px; }
.catalogo-casas figcaption strong { font-size:clamp(28px,3vw,48px); }
@media(max-width:740px) {
  .cabecera-servicios { grid-template-columns:1fr; gap:16px; }
  .portada-foto img { aspect-ratio:2; }
  header nav { column-gap:14px; }
}
.casa-demo {
  background: #ecdfcd;
  box-shadow: 0 6px 18px #422a1c15;
}
.catalogo-casas figcaption, .catalogo-casas .pasos-casa { padding-inline: 16px; }
.catalogo-casas .pasos-casa { padding-bottom: 14px; }
.archive { background: var(--beige); }
.archive .card, .archive .filters { background: transparent; }
.portada-foto img { box-shadow: 6px 6px 0 #e8d5bb; }
header .brand img { width:clamp(130px,15vw,190px); height:auto; }
header nav button,.detalle,#panel-sa button { background:var(--beige);color:var(--cafe);border:1px solid currentColor;padding:8px 12px;cursor:pointer; }
#panel-sa { position:fixed;inset:0 0 0 auto;margin:0;width:min(410px,92vw);height:100dvh;max-height:none;max-width:none;border:0;padding:0 24px 24px;background:var(--beige);color:var(--cafe);overflow:auto;scroll-padding-top:88px; }
#panel-sa::backdrop { background:#241b1480; }
#panel-sa form { position:sticky;top:0;z-index:2;margin:0 -24px;padding:18px 24px 12px;text-align:right;background:var(--beige); }
#panel-sa summary { padding:15px 0;cursor:pointer;border-bottom:1px solid #422a1c44; }
.pasos-casa .pausa {position:static;width:auto;clip-path:none;border-radius:4px;padding-inline:8px;}
header { flex-direction:row; justify-content:space-between; align-items:center; padding:12px clamp(16px,4vw,64px); }
header nav { width:auto; padding:0; border:0; }
header nav button { min-height:44px; }
.enlaces-panel { display:grid; gap:0; }
.enlaces-panel a { padding:12px 0; border-bottom:1px solid #422a1c44; }
.carrusel-inicio { position:relative; width:100%; }
.carrusel-inicio img { width:100%; height:clamp(210px,54vw,68vh); object-fit:cover; }
.texto-inicio { display:block; }
.contacto-flotante .chat-wa { width:60px; height:60px; padding:0; display:grid; place-items:center; border:0; border-radius:50%; background:var(--verde-whatsapp); color:white; }
.contacto-flotante .chat-wa span { display:none; }
.contacto-flotante .chat-wa svg { width:38px; height:38px; }
@media (prefers-reduced-motion: no-preference) {
  #panel-sa[open] .enlaces-panel a, details[open] > p { animation: aparecer-contenido 520ms ease-out; }
  .entrada-contenido { animation: aparecer-contenido 640ms cubic-bezier(.2,.7,.25,1); }
  .entrada-contenido:focus-within { animation: none; }
}

@keyframes aparecer-contenido {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

#panel-sa details[open] > summary {
  background: #90695f;
  color: white;
  padding-inline: 14px;
}
.datos-inmueble { padding: 0 16px 20px; } #gran-santa-fe .fotos-casa img { object-fit: contain; background: transparent; }
button.fotos-casa {display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in;}
.visor-casa {position:fixed;inset:0 auto 0 0;margin:0;width:min(1060px,96vw);max-width:100%;height:100dvh;max-height:100dvh;overflow:auto;padding:clamp(14px,3vw,42px);border:0;background:var(--beige);color:var(--cafe);}
.visor-casa::backdrop {background:#241b1488;}
.visor-casa form {text-align:right;margin-bottom:16px;}
.visor-casa button {border:1px solid currentColor;background:var(--beige);color:var(--cafe);min-height:44px;padding:6px 12px;}
.visor-columnas {display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:24px;}
.visor-grande {width:100%;height:clamp(240px,56vh,620px);object-fit:contain;}
.visor-controles,.miniaturas {display:flex;align-items:center;gap:8px;margin-top:10px;}
.visor-controles {justify-content:center;}
.miniaturas {flex-wrap:wrap;}
.miniaturas button {width:clamp(46px,12vw,80px);padding:0;border:0;background:transparent;position:relative;}
.miniaturas button[aria-pressed=true]::after {content:'';position:absolute;bottom:-4px;left:25%;right:25%;height:2px;background:white;}
.miniaturas img {width:100%;height:44px;object-fit:cover;}
@media(max-width:700px){.visor-casa {width:100%;}.visor-columnas{grid-template-columns:1fr;}.visor-grande{height:clamp(200px,38svh,420px);}}
.visor-casa {inset:0;width:100%;max-width:none;padding:0;background:transparent;}
.visor-casa::backdrop {background:#211b17ad;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);}
.visor-casa form {position:absolute;z-index:1;right:18px;top:16px;margin:0;}
.visor-columnas {min-height:100%;grid-template-columns:minmax(0,1fr) clamp(280px,25vw,420px);gap:0;}
.visor-columnas aside {background:var(--beige);padding:88px clamp(22px,2.5vw,44px) 32px;}
.visor-galeria {display:flex;flex-direction:column;justify-content:center;align-items:center;min-width:0;padding:clamp(16px,3vw,52px);}
.visor-grande {height:auto;max-height:68dvh;object-fit:contain;}
.visor-galeria .miniaturas {order:1;justify-content:center;}
.visor-controles {order:2;color:white;}
.visor-controles button {color:var(--cafe);}
@media(max-width:700px){.visor-columnas{display:flex;flex-direction:column;}.visor-galeria{padding:76px 12px 16px;}.visor-grande{max-height:48svh;}.visor-columnas aside{flex:1;padding:20px;}.visor-casa form{position:sticky;top:8px;height:0;margin-right:12px;}}
body > header {position:sticky;top:0;z-index:9;background:var(--beige);}
html {scroll-padding-top:calc(36px + clamp(60px,7vw,86px));}
@media (prefers-reduced-motion:no-preference) {
  #panel-sa[open] { animation: abrir-menu-derecho 280ms ease-out; }
}
@keyframes abrir-menu-derecho { from { transform:translateX(100%); } to { transform:translateX(0); } }body > header {height:clamp(72px,6.5vw,98px);justify-content:flex-end;}
header .brand {position:absolute;left:50%;translate:-50% 0;}
header .brand img {width:clamp(108px,11vw,160px);}
header.con-scroll .brand {left:clamp(16px,4vw,64px);translate:0 0;}
@media(prefers-reduced-motion:no-preference){header .brand{transition:left .32s ease,translate .32s ease;}}
.decision {background:#f5efe7;color:#29231e;}
.decision-intro {padding:clamp(26px,3vw,56px) 4.5vw;background:linear-gradient(90deg,#eee9e3 48%,transparent 82%),url("imagenes/portada-palmas.jpg") right center / auto 100% no-repeat;}
.decision-intro p {border-left:5px solid #c6a480;margin:0;padding-left:20px;font-size:clamp(20px,2.4vw,38px);line-height:1.12;}
.decision-intro h1 {font:750 clamp(48px,7.4vw,120px)/1 var(--fuente);letter-spacing:-.055em;margin:18px 0 0;}
.rutas-sa {display:grid;grid-template-columns:1.65fr 1fr;gap:12px;padding:0 1.3vw 1.3vw;}
.rutas-sa article {border-radius:16px;overflow:hidden;padding:clamp(24px,3.4vw,58px);min-height:clamp(350px,37vw,590px);}
.ruta-proyecto {background:#ecddca linear-gradient(180deg,#eddfcf 10%,#eddfcfef 31%,#eddfcf00 70%);background-image:linear-gradient(180deg,#eddfcf 0%,#eddfcf 30%,#eddfcf00 72%),url("imagenes/portada-planos.jpg");background-position:center,bottom center;background-size:cover,100% auto;background-repeat:no-repeat;}
.ruta-propiedad {background:linear-gradient(180deg,#262717eb,#272b19af 45%,transparent),url("imagenes/portada-patio.jpg") center / cover;}
.rutas-sa h2 {font:700 clamp(32px,3.8vw,64px)/1.02 var(--fuente);letter-spacing:-.045em;}
.rutas-sa p {max-width:34ch;font-size:clamp(17px,1.5vw,24px);line-height:1.33;}
.ruta-propiedad h2,.ruta-propiedad p {color:#fffaf0;}
.rutas-sa a {display:inline-flex;gap:20px;align-items:center;padding:12px 20px;border-radius:6px;text-decoration:none;font-weight:650;}
.ruta-proyecto a,.ruta-proyecto a:visited {background:#422a1c;color:white;}
.ruta-propiedad a,.ruta-propiedad a:visited {background:#faf3e7;color:#30251c;}
@media(max-width:700px){.rutas-sa{grid-template-columns:1fr;padding:0 12px 12px;}.rutas-sa article{min-height:245px;}.decision-intro{padding:30px 18px;}.ruta-proyecto{background-size:cover,100% auto;}.decision-intro h1{font-size:clamp(44px,10vw,68px);}}
#panel-sa[open] {display:flex; flex-direction:column; overflow:hidden; padding:0;}
#panel-sa > form {position:static; flex:none; margin:0; padding:16px 24px 12px; background:var(--beige);}
#panel-sa .panel-lista {min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:0 24px 24px;}
@media (min-width: 681px) {
  .fichas-servicios > article:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    justify-self: center;
    width: calc((100% - 2.5vw) / 2);
  }
}

a.cotizar-wa {

  background: var(--verde-whatsapp);
  color: white;
  border: 1px solid var(--verde-whatsapp);
  margin-top: 4px;
}
@media (hover: hover) {
  button:hover, .rutas-sa a:hover, .cotizar:hover, .chat-wa:hover {
    filter: brightness(.90);
  }
  a.cotizar-wa:hover {
    background: white;
    color: var(--verde-whatsapp);
    filter: none;
  }
  header nav button:hover, .detalle:hover, #panel-sa button:hover,
  .filters button:hover, .controls button:hover, .pasos-casa button:hover {
    background: #eadcc8;
    color: var(--cafe);
  }
}

.fichas-servicios .detalle, .casa-demo .mas-casa {
  --cafe-visita: #90695f;
  background: var(--cafe-visita);
  border-color: var(--cafe-visita);
  color: white;
}
@media (hover: hover) {
  .fichas-servicios .detalle:hover, .casa-demo .mas-casa:hover {
    background: white;
    color: var(--cafe-visita);
    filter: none;
  }
}

.dudas { scroll-margin-top: 7rem; }
.dudas > h2 { text-align: center; }
.dudas > details { max-width: 52rem; margin-inline: auto; border-bottom: 1px solid #422a1c33; }
.dudas > details > summary { padding: 14px 0; cursor: pointer; }
.dudas > details > p { margin: 0 0 16px; }

.catalogo-casas .pasos-casa {
  width: fit-content;
  margin: 0 16px 14px;
  padding: 5px;
  border: 1px solid #90695f55;
  border-radius: 30px;
}
.pasos-casa button[data-paso] { background: #90695f; color: white; border-color: #90695f; }
@media (hover:hover) {
  .pasos-casa button[data-paso]:hover { background: white; color: #90695f; filter: none; }
}
.casa-demo .datos-inmueble > p:nth-of-type(2) { display: none; }
.casa-demo .acciones-muestra { padding: 0 16px 20px; }

#servicios, #casas, .archive .card { scroll-margin-top: 8rem; }
footer { font-size: clamp(1rem, 1.25vw, 1.2rem); padding-right: max(6vw, 100px); }
.contacto-flotante { display: grid; justify-items: center; gap: 8px; }
.contacto-flotante .subir { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #90695f; color: white; font-size: 24px; text-decoration: none; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

.panel-lista > .cotizar-wa { margin-top: 18px; }

/* Preserve the horizontal composition of the supplied house photographs. */
.archive .card img { aspect-ratio: auto; width: 100%; height: auto; }
.showcase .slide img { object-position: center; }

.video-servicio { position: relative; margin-bottom: 14px; }
.video-servicio video { display: block; width: 100%; aspect-ratio: 4/3; background: #201b17; object-fit: contain; }
.video-servicio .control-video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 56px; height: 56px; border-radius: 50%; background: #90695f; color: white; border: 2px solid white; font-size: 24px; display: grid; place-items: center; }
.video-servicio .control-video[hidden] { display: none; }
.archive .filters { display: flex; gap: 16px; flex-wrap: wrap; }

@media (hover: hover) and (pointer: fine) {
  .video-servicio.reproduciendo:not(:hover) .control-video:not(:focus-visible) {
    opacity: 0;
    pointer-events: none;
  }
  .video-servicio .control-video { transition: opacity .2s ease; }
}

.firma-columnas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 42%); gap: 5vw; align-items: start; }
.firma-retrato { margin: 24px 0 0; }
.firma-retrato img { display: block; width: 100%; height: auto; }
.firma-texto p { max-width: none; }
.firma-texto h2 { font-size: clamp(32px, 4vw, 64px); }
@media (max-width: 760px) {
  .firma-columnas { display: flex; flex-direction: column; gap: 24px; }
  .firma-retrato { order: -1; width: min(100%, 420px); align-self: center; }
}
