/* Página de anuncio de una propiedad. Se apoya en styles.css */
.ad{background:var(--white)}
.ad__head{padding:clamp(6.2rem,12vh,7.5rem) var(--pad) clamp(1.4rem,3vh,2.2rem)}
.ad__back{display:inline-flex;gap:.5rem;align-items:center;min-height:44px;font-size:.92rem;font-weight:500;color:#46606B}
.ad__back i{font-style:normal;transition:transform .6s var(--ease)}
.ad__back:hover i{transform:translateX(-5px)}
.ad__title{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem 3rem;margin-top:.6rem}
.ad h1{margin-top:.7rem;max-width:18ch;font:500 clamp(2.4rem,5.2vw,5.4rem)/1 var(--sans);letter-spacing:-.045em;text-wrap:balance}
.ad h1 em{color:var(--teal)}
.ad__place{margin-top:.9rem;font-size:1.05em;color:#46606B}
.ad__price{font-size:clamp(1.9rem,3.6vw,3.6rem);font-weight:600;line-height:1;letter-spacing:-.04em;color:var(--teal);white-space:nowrap}

/* Fotos destacadas */
.bento{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:clamp(.4rem,.7vw,.7rem);height:clamp(26rem,74vh,50rem);padding:0 var(--pad)}
.bento__i{position:relative;display:block;overflow:hidden;background:var(--mist-300);border-radius:clamp(8px,.9vw,14px)}
.bento__i img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.bento__i:hover img{transform:scale(1.04)}
.bento__i--main{grid-row:1/3;border-radius:clamp(12px,1.4vw,22px)}
.bento__all{position:absolute;right:.7rem;bottom:.7rem;padding:.55rem 1rem;background:var(--white);border-radius:99px;font-size:.88rem;font-weight:600;color:var(--ink);box-shadow:0 8px 24px -12px rgba(11,31,51,.5)}

/* Anuncio con pocas fotos: foto ancha + foto vertical */
.bento--two{grid-template-columns:minmax(0,2.1fr) minmax(0,1fr);grid-template-rows:1fr}
.bento--two .bento__i--main{grid-row:auto}
.bento__cap{position:absolute;left:.7rem;bottom:.7rem;padding:.4rem .85rem;background:var(--white);border-radius:99px;font-size:.82rem;font-weight:600;color:var(--ink)}
.facts--3{grid-template-columns:repeat(3,1fr)}

/* Cuerpo */
.ad__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,24rem);gap:clamp(2rem,6vw,6.5rem);padding:clamp(2rem,5vh,3.5rem) var(--pad) clamp(4rem,10vh,7rem);align-items:start}
.ad__side{position:sticky;top:6rem}
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts li{padding:clamp(1rem,2.6vh,1.6rem) 0}
.facts li+li{padding-left:clamp(.8rem,2vw,1.8rem);border-left:1px solid var(--line)}
.facts b{display:block;font-size:clamp(2.2rem,4.4vw,4.4rem);font-weight:500;line-height:1;letter-spacing:-.05em}
.facts span{display:block;margin-top:.4rem;font-size:.92rem;color:#46606B}
.ad__sec{margin-top:clamp(2.6rem,7vh,4.5rem)}
.ad__sec h2,.ad__callout h2{font:500 clamp(1.7rem,3vw,2.9rem)/1.06 var(--sans);letter-spacing:-.035em}
.ad__sec p{margin-top:1rem;max-width:42rem}
.ad__sec .ad__lead{font-size:1.25em;line-height:1.4;letter-spacing:-.012em}
.floors{display:grid;grid-template-columns:1fr 1fr;gap:clamp(.6rem,1vw,1rem);margin-top:1.4rem}
.floor{padding:clamp(1.2rem,2.2vw,2rem);background:var(--mist);border-radius:clamp(12px,1.2vw,18px)}
.floor h3{font-size:1.2em;font-weight:600;letter-spacing:-.02em}
.floor ul{display:grid;gap:.45rem;margin-top:.9rem}
.ad__callout{display:grid;gap:.9rem;margin-top:clamp(2.6rem,7vh,4.5rem);padding:clamp(1.6rem,4vw,3.4rem);background:var(--teal);color:var(--white);border-radius:clamp(14px,1.6vw,24px)}
.ad__callout .eyebrow{color:var(--aqua)}
.ad__callout h2 em{color:var(--gold)}
.ad__callout p:not(.eyebrow){max-width:38rem}
.ad__callout small{font-size:.86rem;color:var(--mist-300)}
.ticks{display:grid;grid-template-columns:1fr 1fr;gap:.2rem 2rem;margin-top:1.2rem}
.ticks li{position:relative;padding:.6rem 0 .6rem 1.7rem;border-bottom:1px solid var(--line)}
.ticks li::before{content:"";position:absolute;left:.1rem;top:1.02rem;width:.75rem;height:.42rem;border-left:2px solid var(--teal);border-bottom:2px solid var(--teal);transform:rotate(-45deg)}
.specs{margin-top:1rem}
.specs div{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 0}
.specs dt{color:#46606B}
.specs dd{font-weight:600}
.photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.4rem,.7vw,.7rem);margin-top:1.4rem}
.photos a{display:block;overflow:hidden;aspect-ratio:3/4;background:var(--mist-300);border-radius:clamp(8px,.8vw,12px)}
.photos img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.photos a:hover img{transform:scale(1.05)}
.ad__map{display:inline-flex;gap:.5rem;align-items:center;min-height:44px;margin-top:.7rem;font-weight:600;color:var(--teal);text-decoration:underline;text-underline-offset:4px}
.ad__map i{font-style:normal}
.ad__legal{margin-top:clamp(2rem,5vh,3rem);font-size:.82rem;color:#46606B}

/* Tarjeta de contacto */
.deal{display:grid;gap:.7rem;padding:clamp(1.3rem,2vw,1.9rem);background:var(--navy);color:var(--white);border-radius:clamp(14px,1.5vw,22px)}
.deal__tag{font-size:.82rem;color:var(--aqua)}
.deal__price{font-size:clamp(2.2rem,3.4vw,3.2rem);font-weight:600;line-height:1;letter-spacing:-.04em}
.deal__sub{font-size:.92rem;color:var(--mist-300);margin-bottom:.5rem}
.deal__cta{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:.8rem 1.4rem;background:var(--gold);color:var(--ink);border-radius:99px;font-weight:600;transition:background .35s}
.deal__cta:hover{background:var(--white)}
.deal__cta i{font-style:normal;transition:transform .6s var(--ease)}
.deal__cta:hover i{transform:translateX(5px)}
.deal__alt{display:flex;align-items:center;justify-content:center;min-height:48px;padding:.4rem 1rem;border:1px solid rgba(255,255,255,.28);border-radius:99px;font-size:.92rem;font-weight:500;text-align:center;transition:background .3s,color .3s}
.deal__alt:hover{background:var(--white);color:var(--ink)}
.deal__status{min-height:1.3em;font-size:.84rem;text-align:center;color:var(--mist-300)}

/* Barra fija en móvil */
.bar{display:none}

/* Pie */
.ad__foot{padding-top:clamp(4rem,10vh,7rem)}
.ad__next{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:2rem}
.ad__next .eyebrow{margin-bottom:1rem}
.ad__next .display em{color:var(--gold)}

/* Páginas legales */
.legal{max-width:50rem;margin:0 auto;padding:clamp(7rem,14vh,9rem) var(--pad) clamp(4rem,10vh,7rem)}
.legal h1{margin-top:.8rem}
.legal__date{margin-top:.8rem;font-size:.92rem;color:#46606B}
.legal__toc{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.6rem}
.legal__toc a{display:inline-flex;align-items:center;min-height:44px;padding:.3rem 1rem;border:1px solid var(--line);border-radius:99px;font-size:.9rem;font-weight:500}
.legal__toc a:hover{border-color:var(--teal)}
.legal section{scroll-margin-top:6rem;margin-top:clamp(2rem,5vh,3rem)}
.legal h2{margin-top:2.2rem;font-size:clamp(1.3rem,2vw,1.7rem);font-weight:500;line-height:1.2;letter-spacing:-.025em}
.legal p,.legal ul{margin-top:.8rem}
.legal ul{display:grid;gap:.4rem;padding-left:1.1rem;list-style:disc}
.legal ul.legal__data{padding-left:0;list-style:none}
.legal a:not(.brand){color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.legal__toc a{text-decoration:none!important;color:var(--ink)!important}
.legal b{font-weight:600}
.todo{padding:.05rem .4rem;background:#F7E7CC;border-radius:4px;font-weight:500}

/* Visor de fotos */
.lb{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(6,17,30,.97);color:var(--white);overflow:hidden}
.lb::backdrop{background:rgba(6,17,30,.97)}
.lb[open]{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center}
.lb__fig{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;margin:0;height:100%;min-width:0;padding:4.2rem .5rem 1rem}
.lb__fig img{display:block;flex:1 1 0;min-height:0;width:100%;object-fit:contain;animation:lbIn .5s var(--ease)}
@keyframes lbIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
.lb figcaption{display:flex;justify-content:space-between;gap:2rem;width:min(100%,46rem);font-size:.92rem;color:var(--mist-300)}
.lb__nav{display:grid;place-items:center;width:clamp(44px,5vw,64px);height:clamp(44px,5vw,64px);margin:0 clamp(.3rem,1.4vw,1.4rem);border:1px solid rgba(255,255,255,.28);border-radius:50%;font-size:1.2rem;text-align:center;transition:background .3s,color .3s}
.lb__nav:hover{background:var(--white);color:var(--ink)}
.lb__x{position:absolute;right:1rem;top:.9rem;z-index:2;display:flex;align-items:center;gap:.6rem;min-height:44px;padding:.3rem 1rem;border:1px solid rgba(255,255,255,.28);border-radius:99px;font-size:.92rem;font-weight:500}
.lb__x:hover{background:var(--white);color:var(--ink)}
.lb__x i{font-style:normal;font-size:1.2rem;line-height:1}

@media (max-width:899px){
  .ad__head{padding-top:5.4rem}
  .ad__title{flex-direction:column;align-items:flex-start}
  /* Fotos: tira que se desliza con el dedo */
  .bento{display:flex;height:auto;gap:.5rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-padding:0 var(--pad)}
  .bento::-webkit-scrollbar{display:none}
  .bento__i,.bento__i--main{flex:0 0 84%;aspect-ratio:4/5;scroll-snap-align:start;border-radius:14px}
  .bento--two .bento__i--main{aspect-ratio:auto;align-self:stretch}
  .ad__grid{grid-template-columns:1fr;padding-bottom:3rem}
  .ad__side{position:static;order:2}
  .facts,.facts--3{grid-template-columns:1fr 1fr}
  .facts--3 li:nth-child(3){grid-column:1/-1}
  .facts li:nth-child(3){padding-left:0;border-left:0}
  .facts li:nth-child(n+3){border-top:1px solid var(--line)}
  .floors,.ticks{grid-template-columns:1fr}
  .photos{grid-template-columns:1fr 1fr}
  .lb[open]{grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr) auto}
  .lb__fig{grid-column:1/-1;grid-row:1;padding:4.2rem .4rem .4rem}
  .lb__nav{grid-row:2;justify-self:center;margin:.5rem 0 1rem}
  .bar{position:fixed;left:0;right:0;bottom:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem var(--pad) calc(.65rem + env(safe-area-inset-bottom));background:var(--white);box-shadow:0 -8px 28px -18px rgba(11,31,51,.6);transition:transform .5s var(--ease)}
  .bar.is-off{transform:translateY(110%)}
  .bar b{display:block;font-size:1.2rem;font-weight:600;letter-spacing:-.03em;line-height:1.1}
  .bar span{font-size:.8rem;color:#46606B}
  .bar a{display:flex;align-items:center;min-height:48px;padding:.4rem 1.3rem;background:var(--teal);color:var(--white);border-radius:99px;font-weight:600;white-space:nowrap}
}
