/*
Theme Name:        Mojiganga Living
Theme URI:         https://mojigangaliving.com
Author:            X-Ray Marketing Agency
Author URI:        https://xraymarketingagency.com
Description:       Design-led real estate theme for Mojiganga Living (San Miguel de Allende). Built from the approved static preview — minimalist, editorial, gallery-first listings, with a restrained one-time entrance animation. Pairs with the Mojiganga Living Core plugin.
Requires at least:  6.0
Requires PHP:       7.4
Version:            0.8.36
Requires Plugins:   mojiganga-living-core
License:            GPL v2 or later
License URI:        https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:        mojiganga-living
Tags:               real-estate, editorial, cantera, block-workflow
*/

/* =====================================================================
   Brand tokens — from Manual de Marca v03. Customizer color controls
   (see functions.php) override --ink/--grey/--rosa/--link/--btn-* at
   runtime by writing inline CSS custom properties on :root, so every
   rule below should keep reading from the variables, never a literal
   hex value.
   ===================================================================== */
:root{
  --ink:#25221e; --grey:#726c62; --white:#ffffff; --paper:#f5f1e9;
  --rosa:#d35e8f;
  --line: rgba(37,34,30,0.19);
  --surface-2:#eae4da;
  --ph-a: #d9d5cd; --ph-b:#bdb7ab;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
[id]{scroll-margin-top:100px;} /* keeps in-page anchors (e.g. #ml-property-contact) clear of the sticky header. */
/* When logged in, wp-admin's own toolbar (fixed, 32px / 46px on mobile) sits
   on top of the sticky site header too — without accounting for it, the
   Enquire anchor lands with the target section's top still tucked behind
   both bars, which looked like the button "wasn't reaching" the form. */
.admin-bar [id]{scroll-margin-top:132px;}
@media (max-width:782px){.admin-bar [id]{scroll-margin-top:146px;}}
/* 0.7.68 — the property page has a SECOND sticky bar under the site header
   (.ml08-subnav, the Portrait/Photos/Contact tabs, 56px tall) that the two
   rules above never accounted for — they only clear the site header. Every
   anchor jump on this page (the subnav tabs, "Solicitar información", etc.)
   landed with the target's top ~56px still tucked behind that tab bar. It
   went unnoticed while the hidden sliver was just the small "El retrato"
   kicker, but became obvious the moment a real headline could land there
   (David: "mira como se parte el texto feo" — the retrato title's own
   first line was the part hidden behind the bar). --ml08-header-h is set
   by initPropertySubnavOffset() in main.js and already includes the site
   header's height AND any admin-bar offset, so adding the subnav's own
   56px (plus a little breathing room) here covers both bars in one rule,
   logged in or not. */
.property-page [id]{scroll-margin-top:calc(var(--ml08-header-h,100px) + 56px + 20px);}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--type-body,'DM Sans','Helvetica Neue',Arial,sans-serif); -webkit-font-smoothing:antialiased; font-weight:400; overflow-x:hidden;} /* needed for the full-bleed gallery photos, which break out to 100vw. */
h1,h2,h3{font-family:var(--display,'Newsreader',Georgia,serif); font-weight:400; letter-spacing:-.042em;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
p{line-height:1.65; margin:0; font-weight:400;}
a{color:inherit; text-decoration:none;}
/* 0.8.28 — David: interlinking inside free-text "story" prose (In Town
   articles + a listing's own Portrait/story blocks — see ml_linkify() in
   the core plugin's template-tags.php), plus the Retrato/Portrait main
   description, which already supports a real link via the normal
   WordPress editor. Both need their own color: the global `a{color:
   inherit}` above means an unstyled link sitting inside a paragraph is
   literally invisible as a link — same text color as everything around
   it — so without this, a link David adds wouldn't read as clickable at
   all. Underlined, not just colored, since these sit inside a wall of
   paragraph text rather than standing alone like a button or nav item. */
.ml-inline-link,.ml08-prose.property-description a{color:var(--rosa); text-decoration:underline; text-underline-offset:2px;}
h1,h2,h3{margin:0; text-wrap:balance;}
img{max-width:100%; height:auto;}
.skip-link{position:absolute; left:-9999px; top:0; background:var(--ink); color:#fff; padding:12px 18px; z-index:200;}
.skip-link:focus{left:12px; top:12px;}

/* ---------- placeholder / photo blocks ---------- */
.ph{position:relative; overflow:hidden; background:linear-gradient(135deg, var(--ph-a), var(--ph-b)); display:flex; align-items:flex-end;}
.ph img{width:100%; height:100%; object-fit:cover; display:block;}
.ph-caption{position:absolute; left:14px; bottom:12px; z-index:2; color:#fff; font-size:11px; letter-spacing:.03em; background:rgba(17,17,17,.55); padding:5px 10px; border-radius:3px; max-width:80%;}

/* ---------- hero intro animation (Home only, once per session) ---------- */
/* Concept: "discovered sideways" / "light falling aslant into a doorway"
   from the brand manual — the wordmark reveals with a diagonal sweep,
   like a shaft of light crossing the zaguán. Deliberately the ONLY
   animated moment on the site. */
.hero-content .hw{font-family:var(--display,'Newsreader',Georgia,serif); font-size:calc(var(--ml-heading-scale,1) * clamp(52px,8.4vw,110px)); line-height:.86; color:#fff; display:flex; flex-wrap:wrap; gap:0 18px; letter-spacing:-.035em;}
.hero-content .hw .rv{--end-op:1; display:inline-block; opacity:0; transform:translateY(5px); clip-path:polygon(0 0,0 0,-16% 100%,0 100%);}
.hero-content .hw .rv-ink{font-weight:400;}
.hero-content .hw .rv-grey{--end-op:1; font-weight:400;}
.intro-play .rv{animation:mlReveal .8s cubic-bezier(.16,.8,.32,1) forwards; animation-delay:var(--rdelay,0s);}
@keyframes mlReveal{
  0%{opacity:0; transform:translateY(5px); clip-path:polygon(0 0,0 0,-16% 100%,0 100%);}
  50%{opacity:var(--end-op);}
  100%{opacity:var(--end-op); transform:translateY(0); clip-path:polygon(0 0,116% 0,100% 100%,0 100%);}
}
.reveal-fade{opacity:0; transform:translateY(9px);}
.intro-play .reveal-fade{animation:mlFade .6s ease-out forwards; animation-delay:var(--rd,0s);}
@keyframes mlFade{to{opacity:1; transform:translateY(0);}}
.accent-line{display:inline-block; width:32px; height:2px; background:var(--rosa); margin-left:12px; vertical-align:middle; transform:scaleX(0); transform-origin:left;}
.intro-play .accent-line{animation:mlLine .4s cubic-bezier(.4,0,.2,1) forwards; animation-delay:1.2s;}
@keyframes mlLine{to{transform:scaleX(1);}}
.intro-static .rv{animation:none!important; opacity:var(--end-op)!important; clip-path:none!important; transform:none!important;}
.intro-static .reveal-fade{animation:none!important; opacity:1!important; transform:none!important;}
.intro-static .accent-line{animation:none!important; transform:scaleX(1)!important;}
@media (prefers-reduced-motion: reduce){
  .intro-play .rv, .intro-play .reveal-fade, .intro-play .accent-line{animation:none!important; opacity:var(--end-op,1)!important; transform:none!important; clip-path:none!important;}
}

/* ---------- header ---------- */
header.site{position:sticky; top:0; z-index:40; background:var(--paper); border-bottom:1px solid var(--line);}
.admin-bar header.site{top:32px;}
@media (max-width:782px){.admin-bar header.site{top:46px;}}
.nav{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:20px 0;}
.nav-left,.nav-right{display:flex; align-items:center; gap:24px; font-size:12.5px; font-weight:600; letter-spacing:.03em; text-transform:uppercase;}
.nav-left a, .nav-right a{padding-bottom:3px; border-bottom:1px solid transparent;}
.nav-left a:hover, .nav-right a:hover, .nav-left a:focus-visible, .nav-right a:focus-visible{color:var(--rosa); border-color:var(--rosa);}
.nav-right{justify-content:flex-end;}
.nav-right .lang{color:var(--grey); background:none; border:none; font:inherit; text-transform:inherit; letter-spacing:inherit; cursor:pointer; padding:0 0 3px;}
/* In Town as a hover/focus submenu (0.7.5) — same look as the other nav-right links, but with a small revealed panel instead of its own href. */
.ml075-nav-dropdown{position:relative;}
.ml075-nav-dropdown-label{display:inline-block;padding-bottom:3px;border-bottom:1px solid transparent;cursor:pointer;}
.ml075-nav-dropdown:hover .ml075-nav-dropdown-label,.ml075-nav-dropdown:focus-within .ml075-nav-dropdown-label{color:var(--rosa);border-color:var(--rosa);}
/* 0.7.58 — the 15px gap below, meant to keep the panel from touching the
   label, was a dead zone: nothing rendered there is part of .ml075-nav-
   dropdown's hover box, so moving the cursor straight down from the label
   into the panel crossed outside it and closed the menu before you could
   reach an option. This invisible strip bridges exactly that gap so the
   hover never breaks, without changing how the panel looks. */
.ml075-nav-dropdown::after{content:"";position:absolute;top:100%;left:0;right:0;height:15px;}
/* 0.8.29 — David/Jorge: remove the drop shadow behind the IN TOWN
   dropdown panel (Voices/Around/Before You) — same request for English
   and Spanish, since this rule isn't language-specific. The white
   background + border stay, so the panel is still clearly a panel; only
   the soft shadow around its edges is gone. */
.ml075-nav-dropdown-menu{position:absolute;top:calc(100% + 15px);right:0;z-index:70;display:flex;flex-direction:column;min-width:168px;padding:14px 20px;background:var(--ml07-paper);border:1px solid var(--ml07-line);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .16s ease,transform .16s ease;}
.ml075-nav-dropdown:hover .ml075-nav-dropdown-menu,.ml075-nav-dropdown:focus-within .ml075-nav-dropdown-menu{opacity:1;visibility:visible;transform:translateY(0);}
.ml075-nav-dropdown-menu a{font-size:12px;padding:8px 0;border-bottom:1px solid var(--ml07-line);white-space:nowrap;}
.ml075-nav-dropdown-menu a:last-child{border-bottom:0;}
.ml075-nav-dropdown-menu a:hover,.ml075-nav-dropdown-menu a:focus-visible{color:var(--rosa);}
.wordmark{font-family:var(--type-body,'DM Sans',sans-serif); font-size:19px; line-height:1; letter-spacing:-.035em; display:flex; gap:6px; justify-self:center; color:var(--ink); font-weight:700;}
.wordmark b,.wordmark span{font-weight:700; color:var(--ink);}
@media(max-width:760px){ .nav-left{display:none;} .nav-right a{display:none;} .nav{grid-template-columns:1fr auto;} .wordmark{justify-self:flex-start;} }

/* ---------- hero ---------- */
.hero{position:relative; height:88vh; min-height:560px; max-height:820px;}
.hero .ph{position:absolute; inset:0;}
.hero-scrim{position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.55) 0%, rgba(0,0,0,.06) 42%, rgba(0,0,0,0) 60%);}
.hero-eyebrow{position:absolute; top:32px; left:0; right:0; z-index:2; text-align:center;}
.hero-eyebrow span{color:#fff; font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; font-weight:600;}
.hero-content{position:absolute; left:0; right:0; bottom:0; z-index:2; padding:0 28px 40px;}
.hero-row{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; margin-top:22px;}
.hero-row p{color:rgba(255,255,255,.86); font-size:15px; max-width:360px;}
.btn{display:inline-flex; align-items:center; gap:8px; background:var(--rosa); color:#fff; font-size:13px; font-weight:700; letter-spacing:.01em; padding:14px 26px; border-radius:2px; white-space:nowrap; border:none; cursor:pointer;}
.btn.ink{background:var(--ink);}
.btn.outline{background:transparent; border:1px solid rgba(255,255,255,.6); color:#fff;}

/* ---------- positioning quote ---------- */
.quote-block{padding:74px 0 58px; text-align:center;}
.quote-block p{font-weight:300; font-style:italic; font-size:clamp(20px,2.6vw,28px); max-width:680px; margin:0 auto; line-height:1.5; color:var(--ink);}

/* ---------- section shell ---------- */
section{padding:10px 0;}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:6px; padding:56px 0 30px;}
.section-head .eyebrow{font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--rosa); display:block; margin-bottom:10px;}
.section-head h2{font-size:clamp(34px,4.4vw,54px); font-weight:400; line-height:1;}
.see-all{font-size:12.5px; font-weight:600; border-bottom:1px solid var(--ink); padding-bottom:2px;}
.see-all:hover{color:var(--rosa); border-color:var(--rosa);}

/* ---------- editorial listing rows (no cards) ---------- */
.listing{padding:54px 0; border-top:1px solid var(--line);}
.listing:last-of-type{border-bottom:1px solid var(--line);}
.listing .ph{aspect-ratio:16/9; border-radius:0;}
.listing.duo .imgs{display:grid; grid-template-columns:1.4fr 1fr; gap:2px; aspect-ratio:16/9;}
.listing.duo .imgs .ph{aspect-ratio:auto; height:100%;}
.listing-info{display:flex; justify-content:space-between; align-items:baseline; gap:20px; flex-wrap:wrap; margin-top:24px;}
.listing-info h3{font-size:clamp(27px,3vw,36px); font-weight:400;}
.listing-info .loc{font-size:13px; color:var(--grey); margin-top:6px; text-transform:uppercase; letter-spacing:.05em;}
.listing-info .right{text-align:right;}
.listing-info .price{font-weight:700; font-size:16px;}
.listing-info .specs{font-size:12.5px; color:var(--grey); margin-top:4px;}
.listing-info .go{margin-top:10px; font-size:12.5px; font-weight:600; color:var(--rosa); display:inline-block; border-bottom:1px solid var(--rosa);}
@media(max-width:640px){ .listing.duo .imgs{grid-template-columns:1fr;} .listing-info{flex-direction:column; align-items:flex-start;} .listing-info .right{text-align:left;} }

/* ---------- Jael / seller section ---------- */
.jael{background:var(--surface-2); padding:76px 0; margin:6px 0;}
.jael .grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px; align-items:center;}
.jael .ph{aspect-ratio:4/5;}
.jael .eyebrow{font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--rosa); display:block; margin-bottom:16px;}
.jael h2{font-size:clamp(32px,4.2vw,50px); font-weight:400; line-height:1.08;}
.jael .problems{margin-top:28px; display:flex; flex-direction:column; gap:18px;}
.jael .problems div{padding-top:16px; border-top:1px solid var(--line);}
.jael .problems p.q{font-weight:600; font-size:15.5px;}
.jael .problems p.a{color:var(--grey); font-size:14px; margin-top:6px;}
.jael .cta-row{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap; align-items:center;}
.jael .cta-row a.wa{font-size:13px; font-weight:600; color:var(--ink); border-bottom:1px solid var(--ink);}
@media(max-width:760px){ .jael .grid{grid-template-columns:1fr;} }

/* ---------- colonias (kept for when there's enough inventory to justify it — see front-page.php) ---------- */
.colonias{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:52px 0; text-align:center;}
.colonias .eyebrow{display:block; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--grey); margin-bottom:22px;}
.colonias-list{font-size:clamp(20px,3.6vw,32px); line-height:1.9; font-weight:700;}
.colonias-list a{margin:0 14px; white-space:nowrap; opacity:.85;}
.colonias-list a:hover{opacity:1; color:var(--rosa);}

/* ---------- artist teaser (home) ---------- */
.artist-teaser{padding:70px 0; text-align:center;}
.artist-teaser .eyebrow{font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--rosa); display:block; margin-bottom:14px;}
.artist-teaser h2{font-size:clamp(32px,4vw,46px); font-weight:400; max-width:720px; margin:0 auto;}
.artist-teaser p.sub{color:var(--grey); font-size:15px; margin-top:16px; max-width:520px; margin-left:auto; margin-right:auto;}

/* ---------- footer ---------- */
footer{padding:56px 0 40px; border-top:1px solid var(--line);}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:30px;}
.foot-grid .wordmark{justify-self:flex-start; margin-bottom:14px;}
.foot-grid p{font-size:13px; color:var(--grey); max-width:260px;}
.foot-col h4{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--grey); margin-bottom:14px; font-weight:700;}
.foot-col a{display:block; font-size:13.5px; margin-bottom:10px;}
.foot-col a:hover{color:var(--rosa);}
/* In Town's Voices/Around/Before You links in the footer, grouped under a plain (non-link) label instead of their own "In Town" link (0.7.5). */
.ml075-footer-group-label{display:block; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--grey); margin:14px 0 8px;}
.ml075-footer-subitem{padding-left:12px; font-size:13px;}
.foot-bottom{margin-top:44px; padding-top:20px; border-top:1px solid var(--line); display:flex; justify-content:space-between; font-size:12px; color:var(--grey); flex-wrap:wrap; gap:10px;}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr 1fr;}}

/* ---------- breadcrumbs ---------- */
.ml-breadcrumbs{padding:14px 0 0;}
.ml-breadcrumbs ol{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px; font-size:12px; color:var(--grey);}
.ml-breadcrumbs li:not(:last-child)::after{content:"/"; margin-left:6px; color:var(--line);}
.ml-breadcrumbs a:hover{color:var(--rosa);}

/* ================= PROPERTY / LISTING PAGE ================= */
/* Keep the property layout clipped without creating a scrolling ancestor: overflow:hidden prevents the facts column from sticking. */
.property-page{overflow:visible; overflow:clip;}
.property-hero{position:relative; min-height:640px; height:min(78vh,860px); padding:0; background:var(--ink);}
.property-hero-media{position:absolute; inset:0; display:block;}
.property-hero-media img{width:100%; height:100%; object-fit:cover;}
.property-hero-scrim{position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.26) 0%,rgba(0,0,0,.04) 38%,rgba(0,0,0,.66) 100%);}
.property-hero-top{position:absolute; left:0; right:0; top:0; z-index:2; padding-top:30px; display:flex; justify-content:space-between; gap:20px; color:#fff; font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase;}
.property-back{border-bottom:1px solid rgba(255,255,255,.45); padding-bottom:3px;}
.property-back:hover{color:#fff; border-color:#fff;}
.property-brokerage-name{opacity:.9; text-align:right;}
.property-hero-content{position:absolute; left:0; right:0; bottom:0; z-index:2; padding-bottom:42px; color:#fff;}
.property-badges{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px;}
.property-badges span{border:1px solid rgba(255,255,255,.48); background:rgba(17,17,17,.16); backdrop-filter:blur(8px); padding:6px 10px 5px; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;}
.property-hero h1{max-width:920px; color:#fff; font-size:clamp(42px,6.6vw,86px); line-height:.96; font-weight:400; letter-spacing:-.035em;}
.property-hero-meta{margin-top:24px; padding-top:18px; border-top:1px solid rgba(255,255,255,.35); display:flex; align-items:flex-end; justify-content:space-between; gap:20px;}
.property-hero-meta p{font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.86);}
.property-hero-meta strong{font-size:clamp(20px,2.4vw,28px); font-weight:700; white-space:nowrap;}
.property-breadcrumbs{padding-top:4px;}

.property-overview{display:grid; grid-template-columns:minmax(0,1.5fr) minmax(300px,.72fr); gap:clamp(54px,7vw,110px); align-items:start; padding-top:88px; padding-bottom:90px;}
.property-kicker{display:block; color:var(--rosa); font-size:11px; line-height:1; letter-spacing:.16em; text-transform:uppercase; font-weight:700; margin-bottom:18px;}
.property-description{max-width:760px;}
.property-description > *:first-child{margin-top:0;}
.property-description p{font-size:clamp(17px,1.45vw,20px); line-height:1.78; color:#262626; margin:0 0 24px;}
.property-description h2,.property-description h3{margin:42px 0 16px; font-size:clamp(24px,3vw,34px); line-height:1.15;}
.property-description ul,.property-description ol{font-size:17px; line-height:1.75; padding-left:22px;}
.property-description a{border-bottom:1px solid var(--rosa);}
.property-features{margin-top:56px; padding-top:34px; border-top:1px solid var(--line);}
.property-features h2{font-size:26px; font-weight:400; margin-bottom:20px;}
.property-feature-list{display:flex; flex-wrap:wrap; gap:9px;}
.property-feature-list span{border:1px solid var(--line); padding:9px 12px 7px; font-size:12px; font-weight:600; background:#fff;}

/* Keep price, specs, brokerage and the contact CTA together while the description scrolls. */
.property-facts{position:sticky; top:100px; align-self:start; border-top:2px solid var(--ink); padding-top:24px;}
.admin-bar .property-facts{top:132px;}
.property-price{font-size:clamp(26px,2.8vw,34px); font-weight:900; margin-bottom:24px; letter-spacing:-.02em;}
/* Facts read as one quiet label/value list (Fantastic Frank's "Facts" panel
   has no boxes or bold numbers) rather than a bordered stat grid — this and
   .property-fact-list right below it now share the same plain row style. */
.property-stat-grid{display:grid; grid-template-columns:1fr;}
.property-stat-grid>div{min-height:0; border-bottom:1px solid var(--line); padding:11px 0; display:flex; flex-direction:row-reverse; align-items:baseline; justify-content:space-between; gap:18px;}
.property-stat-grid strong{font-size:13px; font-weight:600; line-height:1.1;}
.property-stat-grid span{font-size:11px; color:var(--grey); text-transform:uppercase; letter-spacing:.07em;}
.property-fact-list{margin:24px 0 0;}
.property-fact-list div{display:grid; grid-template-columns:1fr 1fr; gap:18px; border-bottom:1px solid var(--line); padding:12px 0;}
.property-fact-list dt{font-size:11px; color:var(--grey); letter-spacing:.07em; text-transform:uppercase;}
.property-fact-list dd{margin:0; font-size:13px; font-weight:600; text-align:right;}
.property-brokerage-card{margin-top:25px; padding:20px 0 0; border-top:1px solid var(--line);}
.property-brokerage-card>span{display:block; font-size:10px; color:var(--grey); letter-spacing:.1em; text-transform:uppercase; margin-bottom:10px;}
.property-brokerage-card img{display:block; max-width:150px; max-height:48px; width:auto; height:auto; object-fit:contain; object-position:left center;}
.property-brokerage-card strong{font-size:17px;}
.property-primary-cta{width:100%; justify-content:center; margin-top:28px;}

.property-section-head{padding-top:0; padding-bottom:30px;}
.property-section-head h2{font-size:clamp(34px,4vw,48px); font-weight:400; letter-spacing:-.025em;}
.property-gallery{padding:88px 28px 28px; background:#f3f1ed;}
.property-gallery>.wrap{padding-left:0; padding-right:0; max-width:1320px;}
.property-gallery-grid{max-width:1320px; margin:0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px;}
.property-gallery-item{position:relative; margin:0; overflow:hidden; background:var(--ph-a); aspect-ratio:4/3;}
.property-gallery-item.is-wide{grid-column:1/-1; aspect-ratio:16/8.5;}
.property-gallery-item img{width:100%; height:100%; display:block; object-fit:cover; transition:transform .5s cubic-bezier(.2,.7,.2,1);}
.property-gallery-item:hover img{transform:scale(1.015);}
.property-gallery-item figcaption{position:absolute; left:12px; bottom:10px; max-width:calc(100% - 24px); background:rgba(17,17,17,.68); color:#fff; padding:5px 8px 4px; font-size:10px; line-height:1.3;}

.property-media-section{padding:92px 28px 0; text-align:left;}
.property-media-section>.wrap{max-width:1180px; padding-left:0; padding-right:0;}
.property-media-frame,.property-tour-frame{max-width:1320px; margin:0 auto; background:var(--ink); overflow:hidden;}
.property-media-frame .wp-block-embed,.property-media-frame .wp-has-aspect-ratio,.property-media-frame>div{margin:0;}
.property-media-frame iframe{display:block; width:100%; min-height:min(72vw,740px); border:0;}
.property-tour-frame{position:relative; aspect-ratio:16/9;}
.property-tour-frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}

.artisan-break{background:var(--ink); color:#fff; padding:0; margin:96px 0 0;}
.artisan-break .grid{max-width:1320px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr;}
.artisan-break .ph{aspect-ratio:4/4.6;}
.artisan-break .text{padding:clamp(48px,7vw,96px); display:flex; flex-direction:column; justify-content:center;}
.artisan-break .eyebrow{font-size:11px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--rosa); margin-bottom:16px; display:block;}
.artisan-break h3{font-size:clamp(26px,2.6vw,36px); font-weight:400; color:#fff;}
.artisan-break .role{font-size:12px; color:rgba(255,255,255,.58); margin-top:8px; text-transform:uppercase; letter-spacing:.07em;}
.artisan-break p.q{font-weight:300; font-style:italic; font-size:18px; margin-top:28px; color:rgba(255,255,255,.9); line-height:1.65;}
.artisan-break a.link{margin-top:28px; align-self:flex-start; font-size:12px; font-weight:600; color:var(--rosa); border-bottom:1px solid var(--rosa);}

.planos{max-width:1180px; margin:0 auto; padding:96px 28px; text-align:left;}
.planos .eyebrow{color:var(--rosa); font-size:11px; letter-spacing:.16em; text-transform:uppercase; font-weight:700;}
.planos h2{margin-top:14px; font-size:clamp(34px,4vw,48px); font-weight:400;}
.planos .floorplan-grid{margin-top:34px; display:grid; grid-template-columns:1fr 1fr; gap:22px;}
.planos .floorplan-grid.is-single{grid-template-columns:1fr;}
.planos .plan-item .ph{aspect-ratio:16/10; background:#f5f3ef;}
.planos .plan-item img{object-fit:contain; padding:18px;}
.planos .plan-item figcaption{font-size:11px; color:var(--grey); text-align:center; padding-top:10px;}
.planos .pdf-link{display:inline-block; margin-top:22px; font-size:12px; font-weight:600; color:var(--rosa); border-bottom:1px solid var(--rosa);}

.property-contact{background:var(--surface-2); padding:96px 0; margin-top:10px;}
.property-contact-grid{display:grid; grid-template-columns:minmax(0,.88fr) minmax(360px,1.12fr); gap:clamp(54px,8vw,110px); align-items:start;}
.property-agent-card{padding-top:4px;}
.property-agent-head{display:flex; align-items:center; gap:20px;}
.property-agent-photo{width:104px; height:104px; border-radius:50%; object-fit:cover; flex:none;}
.property-agent-head h2{font-size:clamp(32px,3.5vw,44px); font-weight:400; line-height:1;}
.property-agent-title{font-size:12px; color:var(--grey); margin-top:8px; text-transform:uppercase; letter-spacing:.08em;}
.property-agent-brokerage{margin-top:28px; padding-top:20px; border-top:1px solid var(--line);}
.property-agent-brokerage span{display:block; font-size:10px; color:var(--grey); text-transform:uppercase; letter-spacing:.1em; margin-bottom:9px;}
.property-agent-brokerage img{display:block; width:auto; max-width:170px; max-height:52px; object-fit:contain; object-position:left;}
.property-agent-brokerage strong{font-size:17px;}
.property-agent-copy{font-size:16px; line-height:1.7; color:#313131; margin-top:28px; max-width:500px;}
.property-contact-actions{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:26px;}
.property-text-link{font-size:13px; font-weight:600; border-bottom:1px solid var(--ink);}
.property-disclaimer{font-size:11px; color:var(--grey); line-height:1.5; margin-top:30px;}
.property-form-card{background:#fff; padding:clamp(28px,4vw,48px); border:1px solid rgba(17,17,17,.08);}
.property-form-card h3{font-size:clamp(30px,3vw,38px); font-weight:400;}
.property-form-card>p{font-size:14px; color:var(--grey); margin-top:10px; max-width:480px;}
.property-form-listing-tag{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);font-size:12px;color:var(--grey);}
.property-form-listing-tag strong{color:var(--ink);font-weight:600;}
.property-form-card .contact-form-embed{margin-top:26px;}
.property-form-card .ml-contact-form{max-width:none;}

.ml-contact-notice{padding:14px 18px; margin-bottom:18px; font-size:14px; border:1px solid var(--line);}
.ml-contact-notice.is-success{border-color:var(--rosa); color:var(--ink);}
.ml-contact-notice.is-error{border-color:#b32d2e; color:#b32d2e;}
.ml-contact-re{font-size:13px; font-weight:600; color:var(--rosa); margin-bottom:6px;}

.property-related{padding:88px 0 44px;}
.property-related .property-section-head{padding-bottom:4px;}
.related .items{display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:28px;}
.related .ph{aspect-ratio:16/10;}
.related h4{font-size:22px; font-weight:400; margin-top:14px;}
.related .loc{font-size:12px; color:var(--grey); margin-top:5px;}

@media(max-width:900px){
  .property-hero{min-height:600px; height:72vh;}
  .property-overview{grid-template-columns:1fr; gap:52px; padding-top:64px; padding-bottom:70px;}
  .property-facts{position:relative; top:auto; max-width:none;}
  .admin-bar .property-facts{top:auto;}
  .property-contact-grid{grid-template-columns:1fr;}
}
@media(max-width:700px){
  .property-hero{min-height:560px; height:70vh;}
  .property-hero-top{padding-top:22px;}
  .property-brokerage-name{display:none;}
  .property-hero-content{padding-bottom:28px;}
  .property-hero h1{font-size:clamp(38px,13vw,62px);}
  .property-hero-meta{align-items:flex-start; flex-direction:column; gap:10px;}
  .property-hero-meta strong{font-size:22px;}
  .property-overview{padding-top:52px; padding-bottom:58px;}
  .property-gallery{padding:64px 16px 16px;}
  .property-gallery-grid{grid-template-columns:1fr; gap:8px;}
  .property-gallery-item,.property-gallery-item.is-wide{grid-column:auto; aspect-ratio:4/3;}
  .property-gallery-item:nth-child(3n+1){aspect-ratio:4/5;}
  .property-media-section{padding:68px 16px 0;}
  .artisan-break{margin-top:72px;}
  .artisan-break .grid{grid-template-columns:1fr;}
  .artisan-break .ph{aspect-ratio:4/3;}
  .artisan-break .text{padding:44px 28px 52px;}
  .planos{padding:72px 28px;}
  .planos .floorplan-grid{grid-template-columns:1fr;}
  .property-contact{padding:72px 0;}
  .property-agent-head{align-items:flex-start;}
  .property-agent-photo{width:82px; height:82px;}
  .property-form-card{padding:28px 22px;}
  .related .items{grid-template-columns:1fr;}
}
@media(max-width:460px){
  .wrap{padding-left:20px; padding-right:20px;}
  .property-stat-grid>div{padding:10px 0;}
  .property-fact-list div{grid-template-columns:.8fr 1.2fr;}
}

/* ================= ARTICLE / STORY PAGE ================= */
.article-hero{position:relative; height:66vh; min-height:420px;}
.article-hero .ph{position:absolute; inset:0;}
.article-hero-scrim{position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.64) 0%, rgba(0,0,0,0) 55%);}
.article-hero-content{position:absolute; left:0; right:0; bottom:0; z-index:2; padding:0 28px 34px;}
.article-hero-content .eyebrow{color:var(--rosa); font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; display:block; margin-bottom:14px;}
.article-hero-content h1{color:#fff; font-size:clamp(38px,5.2vw,60px); font-weight:400; line-height:1.02; max-width:900px;}
.article-meta{color:rgba(255,255,255,.75); font-size:12.5px; margin-top:16px;}

.article-body{max-width:660px; margin:0 auto; padding:58px 28px 0;}
.article-body .deck{font-size:clamp(18px,2vw,21px); font-weight:500; line-height:1.6; color:var(--ink);}
.article-body p{font-size:16.5px; line-height:1.85; color:var(--ink); margin-top:26px;}
.article-body .pullquote{font-weight:300; font-style:italic; font-size:clamp(22px,2.6vw,27px); line-height:1.5; text-align:center; padding:46px 10px; color:var(--ink);}
.article-body .pullquote .rule{display:block; width:34px; height:2px; background:var(--rosa); margin:0 auto 22px;}
.article-figure{max-width:880px; margin:46px auto; padding:0 28px;}
.article-figure .ph{aspect-ratio:16/9;}
.article-figure figcaption{font-size:11.5px; color:var(--grey); text-align:center; padding-top:12px;}

.article-cta{max-width:660px; margin:60px auto 0; padding:0 28px;}
.article-cta a{display:flex; gap:20px; align-items:center; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:22px 0;}
.article-cta .ph{width:120px; height:90px; flex:none;}
.article-cta .meta{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--rosa); font-weight:700; margin-bottom:6px;}
.article-cta h4{font-size:18px; font-weight:900;}
.article-cta .sub{font-size:13px; color:var(--grey); margin-top:4px;}
@media(max-width:560px){.article-cta a{flex-direction:column; align-items:flex-start;} .article-cta .ph{width:100%; height:160px;}}

.article-related{max-width:660px; margin:56px auto 0; padding:0 28px 20px;}
.article-related h4{font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--grey); font-weight:700; margin-bottom:8px;}
.article-related a{display:block; font-size:15.5px; font-weight:600; padding:14px 0; border-top:1px solid var(--line);}
.article-related a:last-child{border-bottom:1px solid var(--line);}
.article-related a:hover{color:var(--rosa);}

/* ================= CATALOG (archive) ================= */
.catalog-head{padding:64px 0 20px; text-align:center;}
.catalog-head h1{font-size:clamp(42px,5.4vw,66px); font-weight:400; line-height:1;}
.catalog-head p{color:var(--grey); margin-top:12px; max-width:520px; margin-left:auto; margin-right:auto;}
.catalog-empty{padding:60px 28px; text-align:center; color:var(--grey);}

/* ================= CONTACT FORM ================= */
.ml-contact-form{max-width:520px; margin:0 auto;}
.ml-contact-form p{margin-top:18px;}
.ml-contact-form label{display:block; font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--grey); margin-bottom:6px;}
/* Underline fields, not boxed inputs — quiet and editorial rather than
   a bureaucratic form, and it keeps the Send button the only filled
   shape on the page down here. */
.ml-contact-form input, .ml-contact-form textarea{width:100%; border:0; border-bottom:1px solid var(--line); border-radius:0; padding:10px 2px; font-family:inherit; font-size:15px; background:transparent; color:var(--ink); transition:border-color .15s ease;}
.ml-contact-form input:focus, .ml-contact-form textarea:focus{outline:none; border-color:var(--ink);}
.ml-contact-form textarea{resize:vertical;}
.ml-contact-form button{margin-top:24px; width:100%; justify-content:center;}
.ml-hp-field{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

/* ================= 404 / SEARCH ================= */
.error-404{padding:110px 28px; text-align:center;}
.error-404 h1{font-size:clamp(38px,5vw,54px); font-weight:400;}
.error-404 p{color:var(--grey); margin-top:16px;}
.search-form{display:flex; gap:8px; max-width:420px; margin:26px auto 0;}
.search-form input[type=search]{flex:1; border:1px solid var(--line); padding:12px 14px; font-family:inherit;}

/* ================= Search block (block editor) ================= */
.ml-search-block .ml-search-row{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.ml-search-block select, .ml-search-block input{border:1px solid var(--line); padding:12px 14px; font-family:inherit; font-size:14px; background:#fff;}

/* ================= 0.2 MULTIBRAND POLISH ================= */
.wordmark-slot{justify-self:center; display:flex; align-items:center;}
.wordmark-slot .custom-logo-link{display:flex; align-items:center; line-height:0;}
.wordmark-slot .custom-logo{display:block; width:auto; max-width:190px; max-height:42px; object-fit:contain;}
.listing-media{position:relative;}
.listing.duo .listing-media.imgs{display:grid; grid-template-columns:1.35fr 1fr; gap:4px; aspect-ratio:16/9;}
.listing.duo .listing-media.imgs .ph{height:100%; aspect-ratio:auto;}
.listing-badges{position:absolute; left:14px; top:14px; z-index:2; display:flex; flex-wrap:wrap; gap:6px;}
.listing-badges span{background:rgba(17,17,17,.72); color:#fff; padding:6px 8px 5px; font-size:9px; line-height:1; letter-spacing:.09em; text-transform:uppercase; font-weight:700; backdrop-filter:blur(5px);}
.listing-context{display:flex; flex-wrap:wrap; gap:0; margin-top:7px; font-size:11px; color:var(--grey); text-transform:uppercase; letter-spacing:.07em;}
.listing-context span+span::before{content:"·"; margin:0 8px;}
@media(max-width:760px){
  .wordmark-slot{justify-self:flex-start;}
  .wordmark-slot .custom-logo{max-width:150px; max-height:36px;}
}
@media(max-width:640px){
  .listing.duo .listing-media.imgs{grid-template-columns:1fr; aspect-ratio:auto;}
  .listing.duo .listing-media.imgs .ph{aspect-ratio:16/10;}
  .listing.duo .listing-media.imgs .ph:nth-child(2){display:none;}
}
.catalog-breadcrumbs{padding-top:4px;}
.catalog-head-v2{padding:78px 0 50px; text-align:left;}
.catalog-head-v2 h1{max-width:900px; font-size:clamp(38px,5.6vw,68px); line-height:1; letter-spacing:-.035em;}
.catalog-head-v2 p{max-width:650px; margin:20px 0 0; font-size:16px; line-height:1.65;}
.catalog-filter-shell{padding:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#faf9f7;}
.catalog-filters{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)) auto; gap:12px; align-items:end; padding-top:22px; padding-bottom:22px;}
.catalog-filters label{display:block; min-width:0;}
.catalog-filters label>span{display:block; margin-bottom:7px; color:var(--grey); font-size:9px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;}
.catalog-filters select{width:100%; min-width:0; border:1px solid var(--line); background:#fff; color:var(--ink); padding:11px 30px 10px 11px; font:inherit; font-size:12px;}
.catalog-filter-actions{display:flex; align-items:center; gap:12px;}
.catalog-filter-actions .btn{padding:12px 18px;}
.catalog-filter-actions>a{font-size:11px; font-weight:600; border-bottom:1px solid var(--ink);}
.catalog-results{padding-top:16px;}
.catalog-pagination{padding:36px 0 68px;}
.catalog-pagination .nav-links{display:flex; gap:8px; justify-content:center; align-items:center;}
.catalog-pagination .page-numbers{min-width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); font-size:12px;}
.catalog-pagination .current{background:var(--ink); color:#fff; border-color:var(--ink);}
@media(max-width:1050px){.catalog-filters{grid-template-columns:repeat(3,1fr);}.catalog-filter-actions{grid-column:auto;}}
@media(max-width:700px){.catalog-head-v2{padding:54px 0 36px;}.catalog-filters{grid-template-columns:1fr 1fr;}.catalog-filter-actions{grid-column:1/-1; justify-content:space-between;}.catalog-filter-actions .btn{flex:1; justify-content:center;}}

/* Shared navigation/list markup normalization. */
.nav-left>ul,.nav-right>ul{display:flex; align-items:center; gap:24px; list-style:none; margin:0; padding:0;}
.foot-col ul{list-style:none; margin:0; padding:0;}

/* Neighborhood hero kept separate from the new property-detail hero. */
.tax-ml_neighborhood .listing-hero{position:relative; height:56vh; min-height:360px; padding:0; background:var(--ink);}
.tax-ml_neighborhood .listing-hero>.ph{position:absolute; inset:0; display:block;}
.tax-ml_neighborhood .listing-hero>.ph img{width:100%; height:100%; object-fit:cover;}
.tax-ml_neighborhood .listing-hero-scrim{position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.62),rgba(0,0,0,.05) 58%);}
.tax-ml_neighborhood .listing-hero-top{position:absolute; left:0; right:0; top:0; z-index:2; padding-top:28px; color:#fff; font-size:11px; letter-spacing:.13em; text-transform:uppercase; font-weight:700;}
.tax-ml_neighborhood .listing-hero-bottom{position:absolute; left:0; right:0; bottom:0; z-index:2; padding-bottom:34px;}
.tax-ml_neighborhood .listing-hero-bottom h1{color:#fff; font-size:clamp(40px,6vw,72px); line-height:1; font-weight:400; letter-spacing:-.03em;}
@media(max-width:760px){.nav-right>ul{display:none;}}


/* ================= 0.3 HOME DIRECTION / CLIENT FEEDBACK ================= */
.home-arrivals{padding:42px 0 92px;}
.home-arrivals .section-head{padding-top:28px;}
.home-arrivals-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(24px,3vw,42px);}
.home-arrival-card{min-width:0;}
.home-arrival-card .media{display:block; position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--ph-a);}
.home-arrival-card .media img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .55s cubic-bezier(.2,.7,.2,1);}
.home-arrival-card:hover .media img{transform:scale(1.012);}
.home-arrival-card .badges{position:absolute; left:14px; top:14px; display:flex; flex-wrap:wrap; gap:6px;}
.home-arrival-card .badges span{background:rgba(17,17,17,.75); color:#fff; font-size:9px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:6px 8px 5px;}
.home-arrival-meta{display:flex; justify-content:space-between; gap:24px; align-items:flex-start; padding-top:18px;}
.home-arrival-card h3{font-size:clamp(28px,3vw,38px); line-height:1; font-weight:400;}
.home-arrival-card .context{font-size:11.5px; color:var(--grey); margin-top:8px; text-transform:uppercase; letter-spacing:.07em;}
.home-arrival-card .price{font-size:14px; font-weight:700; text-align:right; white-space:nowrap;}
.home-arrival-card .specs{font-size:11.5px; color:var(--grey); text-align:right; margin-top:6px;}

.intown{padding:88px 0; border-top:1px solid var(--line);}
.intown-head{display:grid; grid-template-columns:.8fr 1.2fr; gap:50px; align-items:end; margin-bottom:34px;}
.intown-head .eyebrow{font-size:11px; color:var(--grey); text-transform:uppercase; letter-spacing:.15em; font-weight:700;}
.intown-head h2{font-size:clamp(38px,5vw,62px); line-height:.98; font-weight:400; max-width:760px;}
.intown-head p{color:var(--grey); font-size:14px; margin-top:14px; max-width:620px;}
.intown-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px;}
.intown-card{border-top:1px solid var(--ink); padding-top:12px; min-width:0;}
.intown-card .thread{display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); margin-bottom:14px; transition:color .15s ease;}
.intown-card .thread::after{content:"↗"; color:var(--ink); font-size:13px; transition:color .15s ease;}
/* 0.8.27 — David: keep this label black at rest, but turn it (text + the
   ↗ arrow together) pink on hover, so the color itself signals "this is
   clickable" instead of being pink all the time. */
.intown-card .thread:hover,.intown-card .thread:hover::after{color:var(--rosa);}
.intown-card .thumb{display:block; aspect-ratio:4/3; overflow:hidden; background:var(--surface-2);}
.intown-card .thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.intown-card h3{font-size:clamp(25px,2.5vw,32px); font-weight:400; line-height:1.08; margin-top:18px;}
.intown-card p{font-size:13px; line-height:1.65; color:var(--grey); margin-top:10px;}
.intown-card.is-empty .thumb{background:linear-gradient(135deg,#ece9e3,#d8d2c7);}
.intown-card.is-empty .thumb::after{content:"Mojiganga Living"; height:100%; display:grid; place-items:center; font-family:var(--display,'Newsreader',Georgia,serif); font-size:26px; color:rgba(17,17,17,.35);}

.jael.is-home-advisor{padding:96px 0; margin:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.jael.is-home-advisor .grid{grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr); gap:clamp(46px,7vw,100px);}
.jael.is-home-advisor .ph{aspect-ratio:4/5; box-shadow:0 22px 48px -38px rgba(17,17,17,.55);}
.jael.is-home-advisor h2{max-width:720px;}
.jael.is-home-advisor .advisor-name{font-size:16px; font-weight:700; margin-top:26px;}
.jael.is-home-advisor .advisor-role{font-size:11.5px; color:var(--grey); margin-top:4px; text-transform:uppercase; letter-spacing:.08em;}
.jael.is-home-advisor .advisor-bio{font-size:13px; color:var(--grey); margin-top:20px; max-width:620px;}
.jael.is-home-advisor .advisor-backing{font-size:11.5px; color:var(--grey); margin-top:18px;}

@media(max-width:820px){
  .home-arrivals-grid,.intown-grid{grid-template-columns:1fr;}
  .intown-head{grid-template-columns:1fr; gap:16px;}
  .home-arrival-meta{gap:18px;}
  .jael.is-home-advisor .grid{grid-template-columns:1fr;}
  .jael.is-home-advisor .ph{max-width:420px;}
}
@media(max-width:520px){
  .home-arrival-meta{display:block;}
  .home-arrival-card .price,.home-arrival-card .specs{text-align:left;}
  .home-arrival-card .price{margin-top:12px;}
}


/* In Town archive: same three editorial threads as Home. */
.intown-archive{padding:16px 0 96px;}
.intown-archive-intro{max-width:760px; font-size:16px; color:var(--grey); margin-top:14px; line-height:1.75;}
.intown-thread{padding:62px 0; border-top:1px solid var(--line);}
.intown-thread-head{display:grid; grid-template-columns:180px 1fr; gap:36px; margin-bottom:30px; align-items:start;}
.intown-thread-head .label{font-size:11px; text-transform:uppercase; letter-spacing:.14em; font-weight:700; color:var(--grey);}
.intown-thread-head h2{font-size:clamp(34px,4.5vw,52px); line-height:1; font-weight:400;}
.intown-thread-head p{font-size:13.5px; color:var(--grey); margin-top:10px; max-width:620px;}
.intown-feed{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px;}
.intown-feed-card .ph{aspect-ratio:4/3;}
.intown-feed-card h3{font-size:clamp(24px,2.5vw,31px); font-weight:400; line-height:1.08; margin-top:16px;}
.intown-feed-card p{font-size:13px; color:var(--grey); margin-top:9px;}
.intown-feed-card .meta{font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); margin-top:10px;}
.intown-empty{font-size:13px; color:var(--grey); padding:22px 0;}
@media(max-width:780px){.intown-thread-head{grid-template-columns:1fr; gap:10px}.intown-feed{grid-template-columns:1fr;}}

/* === 0.4.0: restore the whole 0.2 experience + 0.3 editorial additions === */
.intown-art-note{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);padding:44px 0 0;margin-top:44px;border-top:1px solid var(--line);align-items:start;}
.intown-art-note .eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--rosa);display:block;margin-bottom:12px;}
.intown-art-note h3{font-size:clamp(27px,3.5vw,40px);font-weight:400;line-height:1.15;}
.intown-art-note p{font-size:14.5px;line-height:1.7;color:var(--grey);max-width:480px;margin-bottom:20px;}
.jael.is-home-advisor .problems{margin-top:34px;gap:15px;}
.jael.is-home-advisor .problems>div{padding-top:16px;}
.jael.is-home-advisor .problems .q{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.45;}
.jael.is-home-advisor .problems .a{font-size:12.5px;line-height:1.7;margin-top:7px;color:var(--grey);}
.jael.is-home-advisor .cta-row{margin-top:28px;display:flex;gap:20px;align-items:center;flex-wrap:wrap;}
.home-colonias .see-all{display:inline-block;margin-top:22px;}
.home-arrivals-grid .catalog-empty{grid-column:1/-1;padding:28px 0;color:var(--grey);}
.property-before-you{max-width:1100px;padding-top:76px;padding-bottom:76px;border-top:1px solid var(--line);}
.property-before-you h2{font-size:clamp(35px,4.6vw,58px);max-width:820px;line-height:1.08;margin-top:14px;}
.property-before-you-text{max-width:760px;font-size:16px;line-height:1.85;color:var(--grey);margin-top:25px;white-space:pre-line;}
.property-before-you-text p+p{margin-top:14px;}
/* 0.7.4: optional portrait/photo on Before You, same idea as the artist break. */
/* 0.7.33 — the owner's photo runs bigger: was a 41/59 split (.82fr/1.18fr),
   now closer to even so the photo reads as a real portrait, not a thumbnail. */
.property-before-you.has-photo{max-width:1180px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,5.5vw,86px);align-items:center;}
.property-before-you-photo{margin:0;aspect-ratio:4/4.7;overflow:hidden;background:var(--ml07-soft,var(--surface-2));}
.property-before-you-photo img{display:block;width:100%;height:100%;object-fit:cover;}
.property-before-you.has-photo h2,.property-before-you.has-photo .property-before-you-text{max-width:none;}
/* 0.7.33 — Before You is now a teaser linking out to the full story. */
.property-before-you-link{display:block;width:fit-content;margin-top:22px;font-size:12.5px;font-weight:600;border-bottom:1px solid var(--ink);padding-bottom:2px;}
.property-before-you-link:hover{color:var(--rosa);border-color:var(--rosa);}
.foot-backing{font-size:12px;color:var(--grey);line-height:1.6;margin:28px 0 0;}
/* 0.8.32 — small, discreet mark linking to The Agency's own site (David:
   "quiero que se vea discreto, no grande"). Low opacity at rest, a touch
   more on hover so it still reads as a link without competing with the
   copyright line right below it. */
.foot-agency-mark{display:inline-block;margin-top:14px;line-height:0;}
.foot-agency-mark img{display:block;height:18px;width:auto;opacity:.45;transition:opacity .15s ease;}
.foot-agency-mark:hover img{opacity:.8;}
@media(max-width:820px){.intown-art-note{grid-template-columns:1fr;gap:20px}.jael.is-home-advisor .grid{grid-template-columns:1fr}.property-before-you{padding-top:50px;padding-bottom:50px}.property-before-you.has-photo{grid-template-columns:1fr;gap:26px;}.property-before-you-photo{aspect-ratio:4/3;}}
@media(max-width:760px){.nav-right>a.lang{display:inline-flex;}.wordmark{font-size:clamp(14px,3.8vw,19px);gap:4px;white-space:nowrap}.nav-right{gap:8px}.nav{column-gap:10px}}
@media(min-width:761px) and (max-width:940px){.wordmark{font-size:16px}.nav{column-gap:14px}.nav-left,.nav-right{gap:14px}}

@media(min-width:821px){.intown-grid.is-two{grid-template-columns:repeat(2,minmax(0,1fr));}}

.wordmark-slot .custom-logo-link{display:block;line-height:0;justify-self:center;}.wordmark-slot .custom-logo{display:block;width:auto;height:26px;max-width:min(38vw,230px);object-fit:contain;}


/* =====================================================================
   0.5.0 — CANTERA / EDITORIAL (selected identity direction)
   Keeps the Core/0.4.1 data, links, sticky property facts and prior
   sections intact. Colors in the Customizer still take precedence.
   ===================================================================== */
:root{
  --display:'Newsreader',Georgia,serif;
  --type-body:'DM Sans','Helvetica Neue',Arial,sans-serif;
  --cantera-dust:#eae4da;
}
body{font-family:var(--type-body);}
:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--rosa);outline-offset:3px;}
header.site .nav{min-height:92px;padding-top:16px;padding-bottom:16px;}
header.site .nav-left,header.site .nav-right{letter-spacing:.075em;font-size:11.5px;}
.wordmark{font-family:var(--type-body);font-size:clamp(17px,1.55vw,21px);font-weight:700;letter-spacing:-.046em;gap:.30em;white-space:nowrap;}
.wordmark b,.wordmark span{font-weight:700;}
.wordmark-slot .custom-logo{max-height:42px;}

/* Homepage — actual split composition from Cantera, not a font-only swap. */
.hero.cantera-home{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.07fr);
  min-height:min(78vh,780px);height:auto;max-height:none;
  padding:0;border-bottom:1px solid var(--line);background:var(--paper);
}
.hero.cantera-home .hero-content{
  position:relative;inset:auto;min-width:0;padding:clamp(38px,5.2vw,90px) clamp(26px,5vw,90px) clamp(25px,3.9vw,66px);
  display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;
  min-height:min(78vh,780px);max-width:none;margin:0;
}
.hero.cantera-home .cantera-eyebrow{color:var(--ink);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;line-height:1.55;display:flex;align-items:center;gap:12px;}
.hero.cantera-home .cantera-eyebrow::before{content:'';width:27px;min-width:27px;height:1px;background:var(--rosa);}
.hero.cantera-home .cantera-title{font-family:var(--display);font-size:calc(var(--ml-heading-scale,1) * clamp(64px,7.25vw,122px));font-weight:400;line-height:.92;letter-spacing:-.052em;max-width:760px;margin:48px 0 22px;overflow-wrap:normal;}
.hero.cantera-home .cantera-title em{font-weight:400;color:var(--rosa);}
.hero.cantera-home .cantera-deck{color:var(--grey);max-width:440px;font-size:clamp(14px,1.22vw,16px);line-height:1.75;}
.hero.cantera-home .cantera-action{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:21px;margin-top:54px;}
.hero.cantera-home .cantera-action>a{font-size:12px;font-weight:700;letter-spacing:.025em;padding-bottom:5px;border-bottom:1px solid var(--ink);}
.hero.cantera-home .cantera-action>a:hover{color:var(--rosa);border-color:var(--rosa);}
.hero.cantera-home .cantera-action>span{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--grey);}
.hero.cantera-home .hero-photo{position:relative;inset:auto;display:block;width:100%;height:100%;min-height:510px;background:linear-gradient(140deg,#c7bfb4,#988e82);overflow:hidden;}
.hero.cantera-home .hero-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;filter:saturate(.92);}
.hero.cantera-home .cantera-photo-label{position:absolute;right:18px;bottom:18px;background:var(--paper);color:var(--ink);font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:9px 12px;max-width:calc(100% - 36px);}
.hero.cantera-home .cantera-photo-label.is-placeholder{left:18px;right:auto;background:rgba(245,241,233,.93);}

/* Brand statement is the original text, re-composed as a deliberate editorial spread. */
.quote-block.cantera-statement{padding:0;text-align:left;border-bottom:1px solid var(--line);}
.quote-block.cantera-statement .wrap{display:grid;grid-template-columns:minmax(150px,.75fr) minmax(0,1.8fr);gap:clamp(28px,5vw,78px);max-width:1320px;padding-top:38px;padding-bottom:42px;}
.quote-block.cantera-statement .statement-index{font-family:var(--type-body);font-size:10px;font-style:normal;font-weight:700;letter-spacing:.18em;text-transform:uppercase;line-height:1.6;color:var(--grey);}
.quote-block.cantera-statement p{font-family:var(--display);font-size:calc(var(--ml-heading-scale,1) * clamp(29px,3.25vw,49px));font-style:normal;font-weight:400;line-height:1.15;letter-spacing:-.033em;max-width:960px;text-align:left;margin:0;}

/* Shared editorial rhythm — all sections from 0.4.1 remain in place. */
.section-head h2,.catalog-head h1,.catalog-head-v2 h1,.intown-head h2,.intown-thread-head h2,.intown-card h3,.intown-feed-card h3,.home-arrival-card h3,.jael.is-home-advisor h2,.related h4{font-family:var(--display);letter-spacing:-.044em;}
.section-head h2{font-size:clamp(43px,5.2vw,72px);}
.home-arrivals{padding-top:64px;padding-bottom:108px;}
.home-arrivals .section-head{padding-top:22px;padding-bottom:34px;}
.home-arrival-card{border-top:1px solid var(--ink);padding-top:13px;}
.home-arrival-card .media{aspect-ratio:4/3;}
.home-arrival-card h3{font-size:clamp(32px,3.2vw,46px);}
.home-arrival-meta{gap:16px;padding-top:22px;}
.home-arrival-card .price{white-space:normal;}
.colonias-list{font-family:var(--display);font-weight:400;font-size:calc(var(--ml-heading-scale,1) * clamp(25px,4vw,43px));letter-spacing:-.036em;}
.intown{padding-top:105px;padding-bottom:105px;}
.intown-head{grid-template-columns:.65fr 1.35fr;gap:50px;margin-bottom:43px;}
.intown-head h2{font-size:clamp(40px,5vw,70px);}
.intown-card{padding-top:14px;}
.intown-card h3{font-size:clamp(28px,2.8vw,39px);line-height:1.03;}
.intown-art-note{margin-top:64px;padding-top:34px;}
.intown-art-note h3{font-family:var(--display);font-size:calc(var(--ml-heading-scale,1) * clamp(33px,3.5vw,46px));}
.jael.is-home-advisor{padding-top:104px;padding-bottom:104px;background:var(--cantera-dust);}
.jael.is-home-advisor h2{font-size:clamp(41px,4.6vw,68px);line-height:1.01;}
.jael.is-home-advisor .ph{box-shadow:none;}
.jael.is-home-advisor .ph img{object-position:center 28%;}
.jael.is-home-advisor .advisor-name{font-size:15px;letter-spacing:.035em;}
.jael.is-home-advisor .problems{margin-top:35px;}

/* Carry Cantera into listings & publications while retaining sticky facts. */
.property-related,.article-body,.intown-archive,.catalog-head-v2{background:var(--paper);}
/* The overview (title/price block's own description + facts) no longer sits
   in its own tinted band — it now reads as one continuous page with the
   hero above it, the way Fantastic Frank's title/facts/description read as
   a single strip right under the photo, not a separate boxed module. */
.property-overview{background:transparent;}
/* Long descriptions collapse behind a "Read more" toggle instead of running
   the full length of the page, the way Fantastic Frank's own listing text
   does. 0.7.24: this used to be a pure-CSS hidden-checkbox + label — no
   script needed — but a checkbox positioned at the top of the (often
   very long, scrolled-past) text block grabs focus on click, and browsers
   scroll a newly focused element into view, which yanked the page back up
   to the start of the text every time. Now a real <button> toggles a
   class instead — focus never leaves the button, so the page stays put. */
.property-description.is-collapsible{max-height:420px;overflow:hidden;position:relative;}
.property-description.is-collapsible::after{content:'';position:absolute;left:0;right:0;bottom:0;height:84px;background:linear-gradient(to bottom, rgba(250,249,246,0), var(--ml07-paper));}
.ml08-prose-wrap.is-expanded .property-description.is-collapsible{max-height:none;}
.ml08-prose-wrap.is-expanded .property-description.is-collapsible::after{display:none;}
.ml076-desc-toggle-label{display:inline-block;margin-top:16px;border:0;background:none;padding:0 0 4px;cursor:pointer;font:600 11px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:.08em;text-transform:uppercase;color:inherit;border-bottom:1px solid var(--ink);}
.ml076-desc-toggle-label .show-less{display:none;}
.ml08-prose-wrap.is-expanded .ml076-desc-toggle-label .show-more{display:none;}
.ml08-prose-wrap.is-expanded .ml076-desc-toggle-label .show-less{display:inline;}
.property-hero h1{font-size:clamp(48px,6.9vw,96px);letter-spacing:-.048em;line-height:.94;}
.property-description p{color:var(--ink);}
.property-price,.property-stat-grid strong,.property-hero-meta strong{font-family:var(--type-body);letter-spacing:-.025em;}
.property-facts{position:sticky;top:100px;align-self:start;}
.admin-bar .property-facts{top:132px;}
.property-gallery{background:#e9e3da;}
.property-contact,.catalog-filter-shell{background:var(--cantera-dust);}
.property-form-card{background:var(--white);}
.article-hero-content h1{font-size:clamp(48px,6vw,82px);line-height:.96;letter-spacing:-.044em;}
.catalog-head-v2 h1{font-size:clamp(48px,6vw,80px);}
.intown-thread-head h2{font-size:clamp(41px,4.9vw,70px);}
footer{background:var(--paper);}

@media(max-width:1050px){
  .hero.cantera-home{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .hero.cantera-home .hero-content{padding:45px 36px;}
  .hero.cantera-home .cantera-title{font-size:clamp(55px,7vw,90px);}
  .intown-head{grid-template-columns:1fr;gap:16px;}
}
@media(max-width:900px){
  .property-facts,.admin-bar .property-facts{position:relative;top:auto;}
}
@media(max-width:820px){
  .hero.cantera-home{grid-template-columns:1fr;min-height:0;}
  .hero.cantera-home .hero-content{min-height:490px;padding:45px 30px 28px;}
  .hero.cantera-home .cantera-title{font-size:clamp(65px,10vw,97px);margin:38px 0 20px;max-width:640px;}
  .hero.cantera-home .cantera-action{margin-top:46px;}
  .hero.cantera-home .hero-photo{height:clamp(350px,58vw,550px);min-height:0;}
  .quote-block.cantera-statement .wrap{grid-template-columns:1fr;gap:16px;padding-top:36px;padding-bottom:36px;}
  .intown,.home-arrivals{padding-top:64px;padding-bottom:75px;}
  .jael.is-home-advisor{padding-top:70px;padding-bottom:70px;}
  .property-facts,.admin-bar .property-facts{position:relative;top:auto;}
}
@media(max-width:520px){
  header.site .nav{min-height:70px;}
  .hero.cantera-home .hero-content{min-height:455px;padding:35px 20px 24px;}
  .hero.cantera-home .cantera-eyebrow{font-size:9px;letter-spacing:.13em;}
  .hero.cantera-home .cantera-eyebrow::before{width:18px;min-width:18px;}
  .hero.cantera-home .cantera-title{font-size:clamp(53px,12.4vw,74px);line-height:.94;}
  .hero.cantera-home .cantera-deck{font-size:14px;}
  .hero.cantera-home .cantera-photo-label{font-size:9px;}
  .quote-block.cantera-statement p{font-size:clamp(28px,8vw,37px);}
  .section-head h2{font-size:clamp(39px,10vw,55px);}
  .home-arrival-meta{display:block;}
  .home-arrival-card .price,.home-arrival-card .specs{text-align:left;}
  .jael.is-home-advisor h2{font-size:clamp(39px,10.5vw,57px);}
}
@media(prefers-reduced-motion:reduce){
  .home-arrival-card .media img,.property-gallery-item img{transition:none;transform:none!important;}
}


/* ====================================================================
  0.7.0  /  MOJIGANGA, THE QUIET ISSUE
  Editorial restraint: scale, negative space and image discipline rather
  than oversized typography or decorative visual noise. Keeps existing
  property/gallery templates, content, core API and sticky property facts.
  ==================================================================== */
:root{--ml07-paper:#faf9f6;--ml07-ink:#211f1c;--ml07-ash:#79766f;--ml07-line:rgba(32,30,27,.16);--ml07-rose:#c95178;--ml07-soft:#f0ece6;}
body{background:var(--ml07-paper);color:var(--ink);}
.wrap{max-width:1320px;padding-left:clamp(22px,4.2vw,64px);padding-right:clamp(22px,4.2vw,64px);}
header.site{background:var(--ml07-paper);border-bottom:1px solid var(--ml07-line);}
/* 0.7.81 — was min-height:75px;padding-top:11px;padding-bottom:11px;
   David asked to shrink "todo el menu" a bit, top and bottom. */
header.site .nav{min-height:64px;padding-top:8px;padding-bottom:8px;}
header.site .nav-left,header.site .nav-right{font-size:11px;font-weight:600;letter-spacing:.085em;gap:29px;}
header.site .nav-left a:hover,header.site .nav-right a:hover{color:var(--ink);border-color:var(--ink);}
.wordmark{font-size:clamp(16px,1.65vw,23px);font-weight:700;letter-spacing:-.055em;gap:.28em;}
.wordmark b,.wordmark span{font-weight:700;}
.wordmark-slot .custom-logo{max-height:34px;}
.ml07-mobile-menu{display:none;}
.ml07-hero{padding:0 0 70px;}
.ml07-intro{padding-top:clamp(37px,5vw,65px);padding-bottom:clamp(27px,3.4vw,45px);display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr);column-gap:clamp(30px,6vw,110px);align-items:end;}
.ml07-kicker,.ml07-photo-footer,.ml07-intro-aside .ml07-text-link{font-family:var(--type-body,'DM Sans',Arial,sans-serif);font-size:11px;font-weight:650;letter-spacing:.105em;text-transform:uppercase;}
.ml07-kicker{color:var(--grey);display:block;margin-bottom:22px;}
.ml07-intro h1{font-family:var(--display,'Newsreader',Georgia,serif);font-size:calc(var(--ml-heading-scale,1) * clamp(47px,5.45vw,80px));line-height:.99;letter-spacing:-.051em;font-weight:400;max-width:850px;}
.ml07-intro h1 em{font-weight:400;font-style:italic;letter-spacing:-.045em;}
.ml07-intro-aside{padding-bottom:5px;max-width:310px;justify-self:end;}
.ml07-intro-aside p{font-size:14px;line-height:1.73;color:var(--grey);margin-bottom:28px;}
.ml07-text-link{display:inline-flex;justify-content:space-between;align-items:center;gap:38px;border-bottom:1px solid var(--ink);padding-bottom:10px;transition:gap .2s;}
.ml07-text-link:hover{gap:45px;color:var(--ink);}
.ml07-text-link span{font-size:18px;line-height:1;}
.ml07-feature-frame{position:relative;}
.ml07-feature-image{height:clamp(340px,43vw,595px);width:100%;overflow:hidden;background:#e1d9cc;position:relative;}
.ml07-feature-image img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 56%;}
.ml07-feature-placeholder{height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;gap:12px;padding:35px;color:#544f48;background:linear-gradient(112deg,#eae4dc,#c5c0b9);}
.ml07-feature-placeholder strong{font:400 calc(var(--ml-heading-scale,1) * clamp(23px,3.3vw,44px))/1.13 var(--display,'Newsreader',Georgia,serif);max-width:580px;}
.ml07-feature-placeholder span{font-size:12px;}
.ml07-photo-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;border-bottom:1px solid var(--ml07-line);padding:16px 0;color:var(--grey);font-size:10px;letter-spacing:.07em;}
.ml07-photo-footer>span{display:inline-flex;align-items:center;gap:10px;}
.ml07-photo-footer i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--rosa);}
.ml07-photo-footer a{font-weight:700;color:var(--ink);}
.ml07-photo-footer a span{font-size:14px;margin-left:10px;}
.quote-block.cantera-statement{padding:0 0 45px;border-bottom:1px solid var(--ml07-line);}
.quote-block.cantera-statement .wrap{grid-template-columns:minmax(160px,.45fr) minmax(0,1.55fr);padding-top:24px;padding-bottom:25px;gap:30px;}
.quote-block.cantera-statement .statement-index{letter-spacing:.11em;color:var(--grey);}
/* 0.7.33 — much smaller per David; was clamp(24px,2.85vw,42px). */
.quote-block.cantera-statement p{font-size:clamp(17px,1.7vw,24px);line-height:1.35;max-width:850px;}
.section-head .eyebrow,.jael .eyebrow,.intown-head .eyebrow,.intown-art-note .eyebrow{color:var(--grey);font-size:10px;letter-spacing:.13em;}
.home-arrivals{padding:65px 0 98px;}
.home-arrivals .section-head{padding-top:0;margin-bottom:30px;}
.section-head h2{font-size:clamp(37px,4vw,57px);letter-spacing:-.038em;line-height:1.02;}
.see-all{font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;}
.home-arrivals-grid{gap:32px;}
.home-arrival-card{padding-top:0;border-top:none;}
.home-arrival-card .media{aspect-ratio:1.45;overflow:hidden;}
.home-arrival-card .media img{transition:transform .45s ease;}
.home-arrival-card .media:hover img{transform:scale(1.025);}
.home-arrival-meta{border-top:1px solid var(--ml07-line);margin-top:14px;padding-top:17px;}
.home-arrival-card h3{font-size:clamp(28px,2.65vw,37px);letter-spacing:-.025em;}
.home-arrival-card .price{font-size:14px;}
.intown{padding:94px 0;background:var(--ml07-soft);}
.intown-head{grid-template-columns:minmax(150px,.47fr) minmax(0,1.53fr);gap:42px;margin-bottom:45px;}
.intown-head h2{font-size:clamp(38px,4vw,59px);max-width:700px;letter-spacing:-.04em;}
.intown-head p{font-size:14px;max-width:510px;}
.intown-grid{gap:24px;}
.intown-card{border-top:1px solid var(--ml07-line);padding-top:13px;}
.intown-card h3{font-size:clamp(26px,2.3vw,32px);line-height:1.1;letter-spacing:-.025em;}
.intown-card .thumb{aspect-ratio:1.47;}
.intown-art-note{border-top:1px solid var(--ml07-line);}
.intown-art-note h3{font-size:clamp(26px,3vw,40px);}
.jael.is-home-advisor{background:var(--ml07-paper);padding:100px 0;}
/* 0.7.33 — advisor photo bigger (was a 45/55 split, now favors the photo),
   surrounding copy a touch smaller — see .advisor-bio/.problems below. */
.jael.is-home-advisor .grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(35px,6.5vw,100px);}
.jael.is-home-advisor .ph{aspect-ratio:4/4.6;max-height:780px;}
.jael.is-home-advisor h2{font-size:clamp(37px,3.75vw,55px);line-height:1.08;letter-spacing:-.036em;}
.jael.is-home-advisor .problems{border-top:1px solid var(--ml07-line);margin-top:28px;padding-top:18px;}
.jael.is-home-advisor .problems .q{font-family:var(--display,'Newsreader',Georgia,serif);}
.jael.is-home-advisor .cta-row{flex-wrap:wrap;}
/* 0.7.54 — the three Q&A ("problems") moved out from under the bio to their
   own full-width strip below the whole section, side by side instead of
   stacked. .problems-row is an added modifier so this doesn't disturb the
   vertical .problems layout used elsewhere (e.g. inside .jael, non-home). */
.jael-faqs{margin-top:clamp(44px,5.5vw,72px);padding-top:clamp(34px,4.4vw,54px);}
.jael.is-home-advisor .problems.problems-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.4vw,48px);border-top:0;margin-top:0;padding-top:0;}
.jael.is-home-advisor .problems.problems-row>div{border-top:1px solid var(--ml07-line);padding-top:16px;}
@media(max-width:820px){.jael.is-home-advisor .problems.problems-row{grid-template-columns:1fr;gap:22px;}}
.btn{background:var(--ink);color:#fff;border-radius:0;font-size:12px;padding:14px 20px;}
.btn:hover{background:var(--rosa);}
/* Keep the property facts STICKY on desktop, never sticky on mobile. */
.property-facts{position:sticky;top:100px;align-self:start;}
.admin-bar .property-facts{top:132px;}
.property-hero h1{font-size:clamp(44px,5.35vw,76px);}
.property-price{font-size:clamp(24px,2.6vw,34px);}
.property-description{max-width:70ch;}
.property-gallery{background:var(--ml07-soft);}
.property-contact,.catalog-filter-shell{background:var(--ml07-soft);}
.catalog-head-v2 h1,.intown-thread-head h2{font-size:clamp(42px,5vw,68px);}
footer{background:var(--ml07-paper);border-top:1px solid var(--ml07-line);}
@media(max-width:1000px){
  .ml07-intro{grid-template-columns:minmax(0,1.25fr) minmax(230px,.75fr);column-gap:35px;}
  .ml07-intro h1{font-size:clamp(46px,6vw,67px);}
  .intown-head{grid-template-columns:1fr;gap:14px;}
}
@media(max-width:760px){
  /* 0.7.81 — was min-height:66px, same "shrink the menu a bit" request. */
  header.site .nav{min-height:58px;display:flex;justify-content:space-between;gap:12px;}
  .wordmark-slot{order:0;min-width:0;}
  header.site .nav-left,header.site .nav-right{display:none!important;}
  .ml07-mobile-menu{display:block;position:relative;order:1;flex:0 0 auto;}
  .ml07-mobile-menu summary{cursor:pointer;display:flex;align-items:center;gap:11px;list-style:none;font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;padding:10px 0;}
  .ml07-mobile-menu summary::-webkit-details-marker{display:none;}
  .ml07-menu-glyph{height:13px;width:18px;border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);display:inline-block;}
  .ml07-mobile-menu[open] .ml07-menu-glyph{border-bottom:0;height:7px;}
  .ml07-mobile-menu nav{position:absolute;z-index:70;right:0;top:calc(100% + 17px);width:min(280px,calc(100vw - 42px));background:var(--ml07-paper);border:1px solid var(--ml07-line);box-shadow:0 12px 28px rgba(0,0,0,.08);display:flex;flex-direction:column;padding:11px 20px;}
  .ml07-mobile-menu nav a{font-size:13px;display:block;padding:12px 0;border-bottom:1px solid var(--ml07-line);}
  .ml07-mobile-menu nav a:last-child{border:0;}
  /* In Town as a nested, tap-to-open submenu inside the mobile menu (0.7.5). */
  .ml075-mobile-submenu{border-bottom:1px solid var(--ml07-line);}
  .ml075-mobile-submenu summary{cursor:pointer;list-style:none;font-size:13px;padding:12px 0;}
  .ml075-mobile-submenu summary::-webkit-details-marker{display:none;}
  .ml075-mobile-submenu a{font-size:12.5px;padding:10px 0 10px 16px;border-bottom:1px solid var(--ml07-line);color:var(--grey);}
  .ml075-mobile-submenu a:last-child{border:0;}
  .ml075-mobile-submenu[open] summary{color:var(--rosa);}
  .ml07-hero{padding-bottom:45px;}
  .ml07-intro{display:block;padding-top:42px;padding-bottom:25px;}
  .ml07-intro h1{font-size:clamp(43px,8vw,67px);max-width:720px;}
  .ml07-intro-aside{max-width:620px;justify-self:auto;padding:15px 0 0;display:flex;gap:18px;justify-content:space-between;align-items:flex-end;}
  .ml07-intro-aside p{font-size:13px;max-width:350px;margin:0;}
  .ml07-intro-aside a{white-space:nowrap;gap:10px;flex-shrink:0;}
  .ml07-feature-image{height:clamp(320px,63vw,500px);}
  .quote-block.cantera-statement .wrap{grid-template-columns:1fr;gap:12px;}
  .home-arrivals,.intown,.jael.is-home-advisor{padding-top:62px;padding-bottom:65px;}
  .jael.is-home-advisor .grid{grid-template-columns:1fr;gap:35px;}
  .jael.is-home-advisor .ph{max-width:480px;}
  .property-facts,.admin-bar .property-facts{position:static;top:auto;}
}
@media(max-width:520px){
  .wordmark{font-size:17px;}
  .wrap{padding-left:20px;padding-right:20px;}
  .ml07-kicker{font-size:9px;letter-spacing:.085em;margin-bottom:17px;}
  .ml07-intro{padding-top:35px;}
  .ml07-intro h1{font-size:clamp(42px,11vw,57px);}
  .ml07-intro-aside{display:block;}
  .ml07-intro-aside p{margin-bottom:15px;}
  .ml07-feature-image{height:clamp(265px,74vw,380px);}
  .ml07-photo-footer{font-size:9px;line-height:1.6;}
  .ml07-photo-footer>a{font-size:9px;}
  .quote-block.cantera-statement p{font-size:clamp(16px,4.2vw,20px);}
  .intown-head h2{font-size:clamp(36px,9vw,48px);}
  .home-arrival-card h3{font-size:30px;}
  .jael.is-home-advisor h2{font-size:clamp(36px,9vw,48px);}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important;}}

/* 0.7.1 · Full, uncropped homepage photograph; no overlaid UI, bleed to edges. */
.ml07-hero.is-image-only{padding:0!important;margin:0!important;height:auto!important;min-height:0!important;max-height:none!important;background:transparent;}
.ml07-hero.is-image-only.is-full-width{width:100%;max-width:none;}
.ml07-hero.is-image-only:not(.is-full-width){max-width:1320px;margin:0 auto!important;padding:0 clamp(22px,4.2vw,64px)!important;}
.ml07-hero.is-image-only .ml071-cover-photo{display:block!important;width:100%!important;height:auto!important;max-height:none!important;min-height:0!important;object-fit:contain!important;object-position:center!important;border:0;}
.ml071-empty-cover{padding-top:75px;padding-bottom:75px;text-align:center;color:var(--grey);}
@media(max-width:760px){.ml07-hero.is-image-only:not(.is-full-width){padding:0 20px!important;}.ml07-hero.is-image-only .ml071-cover-photo{width:100%!important;height:auto!important;}}

.ml071-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}

/* 0.7.4 — Editorial property hero: the photograph is the protagonist, full-
   bleed and immersive; the title, location, status and price sit below it
   in quiet type, never over the photo. All listing data, CTA, floor plans
   and forms are unchanged. */
/* 0.7.51 — found the real cause of "la franja horizontal de arriba": the
   old generic ".section shell" rule below (`section{padding:10px 0;}`)
   applies to EVERY <section> that doesn't say otherwise, and .ml074-hero
   is one of the few that was never given its own override in the Section
   Spacing panel (every other section — hero, houses, neighborhoods, In
   Town, Jael, editorial headers, the property sections below, footer —
   already has one). That silently added 10px of the page's cream
   background (var(--paper), #faf9f6) above AND below the photo — the top
   one is the visible band, sitting right under the transparent header,
   between it and a busy photo. It was never the header's dark overlay or
   its fade (0.7.49/earlier this version) — those fixes were real but
   aimed at a different, much subtler seam. padding:0 here removes it.
   Nothing else uses .ml074-hero, so this can't affect any other page. */
/* 0.7.78 — was clamp(18px,2.6vw,34px). David: the photo's own height is
   fine, it's the dead air BETWEEN the photo and the title/"A HOME / A
   STORY" block underneath it that should shrink. This margin plus
   .ml08-intro's own padding-top (below) are the two rules that make up
   that gap — both cut down together. */
.ml074-hero{margin-bottom:clamp(8px,1.2vw,16px);padding:0;}
.ml074-hero-photo{margin:0;width:100%;height:var(--ml074-hero-height,720px);overflow:hidden;background:#e9e5e0;}
.ml074-hero-photo img{display:block;width:100%;height:100%;object-fit:var(--ml074-hero-fit,cover);object-position:var(--ml073-property-position,50% 50%);}
.property-editorial-no-photo{height:var(--ml074-hero-height,720px);background:var(--ml07-soft);}
.ml074-hero-head{max-width:1320px;padding-top:clamp(24px,3.2vw,40px);}
.ml074-hero-title-row{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;}
.ml074-hero-title-main{min-width:0;}
.ml074-hero-title-main .property-kicker{font-size:10px;letter-spacing:.18em;}
.ml074-hero-title-main h1{font:400 calc(var(--ml-heading-scale,1) * clamp(34px,4.3vw,58px))/1.04 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.045em;margin:18px 0 12px;max-width:1150px;color:var(--ink);overflow-wrap:break-word;}
.ml074-hero-location{font:400 15px/1.5 var(--type-body,'DM Sans',sans-serif);color:var(--grey);}
.ml074-hero-brokerage{color:var(--grey);}
.property-editorial-badges{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:4px;}
.property-editorial-badges span{font-size:10px;line-height:1;letter-spacing:.09em;text-transform:uppercase;border:1px solid var(--ml07-line);padding:8px 11px;color:var(--grey);}
/* Now the first thing under the photo — the facts strip fills what used to
   be empty space above "← The collection", instead of sitting further down
   after the title. */
.ml074-hero-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:14px 28px;border-bottom:1px solid var(--ml07-line);padding-bottom:18px;margin-bottom:clamp(24px,3.4vw,42px);font-size:12px;}
/* The facts strip directly under the hero photo — price, beds, baths, m²
   built and m² lot together in one row, all in the first screen, the way
   Fantastic Frank's own hero shows its Facts right under the photo instead
   of only lower on the page. */
.ml074-hero-facts{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px 24px;}
.ml074-hero-fact{font:500 12px/1.3 var(--type-body,'DM Sans',sans-serif);letter-spacing:.01em;color:var(--grey);white-space:nowrap;}
.ml074-hero-fact strong{font-weight:600;color:var(--ink);margin-right:4px;}
.ml074-hero-fact-price{font:600 19px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:-.025em;color:var(--ink);}
.ml074-hero-bottom>a{font-weight:600;text-decoration:underline;text-underline-offset:4px;flex-shrink:0;}
.property-page .property-breadcrumbs{padding-top:12px;}
.property-page .property-overview{padding-top:clamp(22px,3vw,40px);}
.property-page .property-copy .property-kicker{letter-spacing:.13em;}
.property-page .property-description p{font-size:clamp(18px,1.55vw,22px);line-height:1.78;}
.intown-grid.is-four{grid-template-columns:repeat(4,minmax(0,1fr));}
.ml072-editorial-page{padding-bottom:100px;background:var(--ml07-paper);}
.ml072-editorial-topline{display:flex;gap:10px;padding-top:23px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);}
.ml072-editorial-topline a{color:var(--ink);}
.ml072-editorial-header{padding-top:clamp(44px,6vw,100px);padding-bottom:clamp(34px,5vw,70px);}
.ml072-editorial-label,.ml072-landing-copy>span,.ml072-feed-copy>span{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);}
/* 0.7.59 — was clamp(64px,11vw,166px) (up to 166px, very heavy for a
   section label). Smaller by default now; the desktop max is also
   overridable from Personalizar → Páginas editoriales (ml072_editorial_heading_size,
   applied with !important in ml071_css()), so this is just the fallback
   if that control is untouched. */
.ml072-editorial-header h1{font:400 calc(var(--ml-heading-scale,1) * clamp(40px,6vw,84px))/.95 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.05em;margin:16px 0 20px;}
/* 0.7.98 — David asked the Voices/Around/Before You subtitle ("Conversations
   with the people shaping the city.") to read at about the same size as the
   catalog page's "Homes personally selected by Jael…" subtitle. That one is
   .catalog-head-v2 p, a flat 16px (see CATALOG block above) — matching it
   here exactly instead of the old clamp(17px,1.6vw,22px), which grew up to
   22px on wide screens and read noticeably larger/heavier. */
.ml072-editorial-header p{font-size:16px;line-height:1.65;max-width:640px;color:var(--grey);}
.ml072-editorial-tabs{display:flex;flex-wrap:wrap;gap:clamp(17px,3vw,44px);border-top:1px solid var(--ml07-line);border-bottom:1px solid var(--ml07-line);padding-top:20px;padding-bottom:20px;}
.ml072-editorial-tabs a{font-size:12px;color:var(--grey);transition:color .2s;}
.ml072-editorial-tabs a[aria-current=page]{color:var(--ink);font-weight:700;text-decoration:underline;text-underline-offset:8px;}
.ml072-editorial-landing{padding-top:clamp(36px,5vw,72px);}
/* 0.7.60 — the feed used to be one full-width row per article (photo one
   side, text the other), which made the Voices/Around/Before You pages a
   very long scroll for very little seen at once. Now it's a 2-up grid —
   photo on top, title and "Read story" below — same rhythm as the home
   page's arrival cards (.home-arrivals-grid), so a screen shows twice as
   much before you have to scroll. */
.ml072-editorial-feed{padding-top:clamp(36px,5vw,72px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(38px,4.6vw,58px) clamp(24px,3vw,44px);}
.ml072-landing-card{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(30px,6vw,90px);border-bottom:1px solid var(--ml07-line);padding:30px 0 65px;align-items:center;}
.ml072-landing-card:nth-child(even) .ml072-landing-media{order:2;}
.ml072-landing-media,.ml072-feed-picture{display:block;background:var(--ml07-soft);min-height:230px;aspect-ratio:1.45;overflow:hidden;}
.ml072-landing-media img,.ml072-feed-picture img{width:100%;height:100%;object-fit:cover;display:block;}
.ml072-landing-copy h2{font:400 calc(var(--ml-heading-scale,1) * clamp(46px,5vw,77px))/1 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.045em;margin:17px 0;}
.ml072-landing-copy p,.ml072-feed-copy p{font-size:15px;line-height:1.65;color:var(--grey);max-width:490px;}
.ml072-landing-feature{font-family:var(--display,'Newsreader',Georgia,serif);font-size:22px!important;color:var(--ink)!important;margin-top:20px;}
.ml072-editorial-more{display:inline-block;border-bottom:1px solid var(--ink);margin-top:22px;padding-bottom:8px;font-size:11px;letter-spacing:.07em;text-transform:uppercase;}
.ml072-feed-card{display:block;min-width:0;}
.ml072-feed-picture{aspect-ratio:4/3;min-height:0;margin-bottom:18px;}
.ml072-feed-copy h2{font:400 calc(var(--ml-heading-scale,1) * clamp(24px,2.3vw,34px))/1.1 var(--display,'Newsreader',Georgia,serif);margin:12px 0 8px;letter-spacing:-.03em;}
.ml072-feed-copy p{max-width:none;}
.ml072-editorial-empty{font-size:18px;padding:60px 0 90px;color:var(--grey);}
@media(max-width:900px){.intown-grid.is-four{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:760px){
.ml074-hero-photo{height:var(--ml074-hero-mobile-height,480px);}
.property-editorial-no-photo{height:var(--ml074-hero-mobile-height,480px);}
.ml074-hero-title-row{flex-direction:column;align-items:flex-start;gap:16px;}
.ml074-hero-title-main h1{font-size:clamp(30px,8.5vw,44px);margin:14px 0 10px;}
.property-page .property-gallery{padding:50px 20px;}
.intown-grid.is-four{grid-template-columns:1fr;}
.ml072-landing-card{grid-template-columns:1fr;gap:24px;padding-bottom:38px;}
.ml072-landing-card:nth-child(even) .ml072-landing-media{order:0;}
.ml072-editorial-feed{grid-template-columns:1fr;gap:34px;}
.ml072-editorial-header h1{font-size:clamp(32px,11vw,48px);}
.ml072-editorial-tabs{gap:13px 22px;}
}

/* ====================================================================
   0.7.3 · IGNANT-inspired editorial direction, independently authored.
   Tight framed home hero; asymmetric image/text property stories;
   original Mojiganga typography, branding and existing listing data.
   All vertical and side section paddings are supplied by Personalizar.
   ==================================================================== */

/* Home cover: fixed FRAME. The image never dictates the box height. */
.ml07-hero.is-image-only,
.ml07-hero.is-image-only.is-full-width,
.ml07-hero.is-image-only:not(.is-full-width){
  box-sizing:border-box;width:calc(100% - 40px)!important;
  max-width:var(--ml073-hero-width,1080px)!important;
  height:auto!important;min-height:0!important;max-height:none!important;
  margin-inline:auto!important; overflow:hidden;
}
.ml07-hero.is-image-only:not(.is-full-width){padding-inline:0!important;}
.ml07-hero.is-image-only .ml071-cover-photo{
  display:block!important;width:100%!important;height:var(--ml073-hero-height,350px)!important;
  max-width:none!important;max-height:none!important;min-height:0!important;
  object-fit:var(--ml073-hero-fit,cover)!important;
  object-position:var(--ml073-hero-position,50% 50%)!important;
  margin:0!important;background:var(--ml07-soft);border:0;
}
/* Same image-frame control when the original editorial home intro is enabled. */
.ml07-feature-frame{max-width:var(--ml073-hero-width,1080px)!important;}
.ml07-feature-image{height:var(--ml073-hero-height,350px)!important;}
.ml07-feature-image img{height:100%!important;object-fit:var(--ml073-hero-fit,cover)!important;object-position:var(--ml073-hero-position,50% 50%)!important;}

/* Home property collection: magazine spreads rather than two cards. */
.home-arrivals{background:var(--ml07-paper);}
/* 0.7.35 — was max-width:1150px, narrower than the grid below (.wrap's
   1320px), which centered this row and pushed "Just arrived" to the right
   of the property cards' own left edge. Dropped so both share one edge. */
.home-arrivals .section-head{margin-bottom:clamp(25px,4vw,55px);padding-bottom:16px;border-bottom:1px solid var(--ml07-line);align-items:end;}
/* 0.7.35 — matched to .intown-head h2's own size ("Voices, places and
   people worth knowing."), per David: same size on both headings. */
.home-arrivals .section-head h2{font-family:var(--display,'Newsreader',Georgia,serif);font-weight:400;letter-spacing:-.04em;font-size:calc(var(--ml-heading-scale,1) * clamp(38px,4vw,59px));line-height:.98;}
.home-arrivals .section-head .eyebrow{font-size:10px;letter-spacing:.14em;}
.ml073-property-editions{max-width:1150px;display:grid;gap:clamp(72px,10vw,145px);}
.ml073-property-edition{min-width:0;}
.ml073-edition-caption{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--ml07-line);padding:0 0 14px;margin:0 0 22px;color:var(--grey);font:500 10px/1.4 var(--type-body,'DM Sans',sans-serif);letter-spacing:.15em;text-transform:uppercase;}
.ml073-edition-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.75fr);gap:clamp(27px,6vw,95px);align-items:center;}
.ml073-edition-photos{min-width:0;display:grid;grid-template-columns:5fr 2fr;gap:clamp(12px,2vw,29px);align-items:end;}
.ml073-edition-photo-primary{display:block;width:100%;aspect-ratio:4/4.6;overflow:hidden;background:var(--ml07-soft);}
.ml073-edition-photo-secondary{display:block;width:100%;aspect-ratio:3/4;overflow:hidden;background:var(--ml07-soft);margin-bottom:-35px;}
.ml073-edition-photos img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.ml073-edition-photos a:hover img{transform:scale(1.015);}
.ml073-no-photo{display:block;height:100%;background:var(--ml07-soft);}
.ml073-edition-story{align-self:center;max-width:375px;min-width:0;padding:15px 0 28px;}
.ml073-edition-overline{font:500 10px/1.4 var(--type-body,'DM Sans',sans-serif);letter-spacing:.16em;text-transform:uppercase;color:var(--grey);}
.ml073-edition-story h3{font:400 calc(var(--ml-heading-scale,1) * clamp(35px,4.2vw,65px))/1.03 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.055em;margin:24px 0 24px;overflow-wrap:break-word;}
.ml073-edition-story h3 a{color:var(--ink);text-decoration:none;}
.ml073-edition-excerpt{max-width:35ch;font:400 14px/1.8 var(--type-body,'DM Sans',sans-serif);color:var(--grey);margin-bottom:30px;}
.ml073-edition-facts{display:flex;gap:7px 14px;flex-wrap:wrap;max-width:38ch;padding:16px 0;border-top:1px solid var(--ml07-line);border-bottom:1px solid var(--ml07-line);font:500 11px/1.6 var(--type-body,'DM Sans',sans-serif);}
.ml073-edition-facts span+span::before{content:'·';color:var(--grey);margin-right:10px;}
.ml073-edition-link{display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:240px;margin-top:34px;padding-bottom:12px;border-bottom:1px solid var(--ink);font:600 11px/1.3 var(--type-body,'DM Sans',sans-serif);letter-spacing:.08em;text-transform:uppercase;}
.ml073-edition-link span{font-size:16px;font-weight:400;}
.ml073-property-edition.is-reversed .ml073-edition-photos{order:2;}
.ml073-property-edition.is-reversed .ml073-edition-story{order:1;margin:0 auto;}
.ml073-property-edition.is-reversed .ml073-edition-photos{grid-template-columns:2fr 5fr;}
.ml073-property-edition.is-reversed .ml073-edition-photo-primary{order:2;}
.ml073-property-edition.is-reversed .ml073-edition-photo-secondary{order:1;}

/* Individual property: full-bleed photograph, then a quiet typographic heading below it. */
.property-page{background:var(--ml07-paper);}
.property-page .property-breadcrumbs{max-width:1240px;opacity:.65;padding-top:0;padding-bottom:0;font-size:10px;}
/* Reading column and factual details stay fully functional but are visually quiet. */
.property-page .property-overview{max-width:1000px;grid-template-columns:minmax(0,1.4fr) minmax(245px,.7fr);gap:clamp(40px,8vw,120px);align-items:start;}
.property-page .property-copy{max-width:620px;}
.property-page .property-description{max-width:62ch;}
.property-page .property-description p{font:400 calc(var(--ml-body-scale,1) * clamp(15px,1.28vw,18px))/1.9 var(--type-body,'DM Sans',sans-serif);color:var(--ink);}
.property-page .property-description p+p{margin-top:19px;}
/* A larger, lighter opening line — the magazine "dek" EST Living opens each
   feature with — before the body settles into normal reading size. */
.property-page .property-facts{position:static;top:auto;align-self:start;border-top:1px solid var(--ml07-line);padding-top:17px;background:transparent;box-shadow:none;}
.property-page .property-price{font-size:clamp(20px,2vw,27px);}
.property-page .property-stat-grid strong{font-size:13px;}
.property-page .property-primary-cta{width:100%;text-align:center;}
.property-page .property-features{margin-top:55px;}
.property-page .property-before-you{max-width:1000px;border-top:1px solid var(--ml07-line);}
.property-page .property-before-you h2{max-width:600px;font:400 calc(var(--ml-heading-scale,1) * clamp(36px,4.7vw,65px))/1.05 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.055em;}
.property-page .property-before-you-text{max-width:520px;margin-left:auto;font-size:15px;line-height:1.9;}
.property-page .property-before-you-link{margin-left:auto;}
.property-page .property-before-you.has-photo .property-before-you-link{margin-left:0;}
/* Deliberate asymmetric exhibition-style photographs and white space. */
.property-page .property-gallery{background:var(--ml07-paper);}
.property-page .property-gallery .property-section-head{max-width:1040px;border-top:1px solid var(--ml07-line);padding:23px 0 30px;}
.property-page .property-gallery .property-section-head h2{font:400 calc(var(--ml-heading-scale,1) * clamp(25px,3vw,43px))/1.15 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.035em;}
/* One deliberate rhythm, not a random stagger: a full-width lead photo,
   then a side-by-side pair, repeating. Plain grid placement — no manual
   margin-top offsets fighting each other. Photos keep their own natural
   proportions (no forced crop), because the photography is the point;
   the caption sits directly under its own photo, sized to actually be
   read, so the text reads as captions running through the photo essay
   instead of a separate block competing with the images. */
/* Photo essay flow: a full-bleed photo (edge to edge, breaking out of the
   page's normal reading width) alternating with a contained side-by-side
   pair and, occasionally, a short line of description text — instead of a
   uniform photo grid, the spacing and rhythm changes block by block, the
   way a magazine feature mixes big photography with contained text. */
.property-page .property-gallery{padding:clamp(56px,7vw,104px) 0;}
.property-page .property-gallery .property-section-head{padding-left:clamp(18px,4vw,70px);padding-right:clamp(18px,4vw,70px);}
.property-gallery-flow{display:flex;flex-direction:column;gap:clamp(48px,6vw,90px);}
/* 0.7.79 — since 0.7.77 the vertical pair/text/parallax/story blocks
   render straight inside #retrato, right after the description and
   features, instead of inside their own #fotos section (which used to
   supply the space above them via its own section padding). Without
   that, this flow sat flush against "Read more"/the features list —
   David: "no quiero que sea asi de pegado a las imagenes". Only scoped
   to the #retrato placement; the #fotos section (grid5 only, below)
   already gets its own breathing room from .property-section-head. */
#retrato > .property-gallery-flow{margin-top:clamp(40px,5.5vw,72px);}
.property-gallery-block{margin:0;}
.property-gallery-full{width:100vw;margin-left:calc(50% - 50vw);}
.property-gallery-full img{display:block;width:100%;height:auto;max-height:88vh;object-fit:cover;}
/* 0.7.92 — David, looking at the pinned photo's caption moved below the
   image in 0.7.90: "No tienes que poner una linea arriba del texto debajo
   de la imagen" — drop the border-top rule that separated it from the
   photo. Scoped to .property-gallery-full, so it also removes the same
   line from a plain (non-pinned) full-bleed photo's caption for
   consistency — neither the pair, vertical-pair, nor grid5 captions
   elsewhere in the gallery have a line above them either. */
.property-gallery-full figcaption{max-width:640px;margin:14px clamp(18px,4vw,70px) 0;font:400 14px/1.55 var(--type-body,'DM Sans',sans-serif);color:var(--ink);}
/* Edge to edge, same as the single wide photo — no longer boxed into the
   narrow reading column with empty margins on both sides. */
.property-gallery-pair{width:100vw;margin-left:calc(50% - 50vw);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;}
.property-gallery-pair-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.property-gallery-pair figure{margin:0;}
.property-gallery-pair img{display:block;width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;}
.property-gallery-pair figcaption{margin-top:10px;padding:0 clamp(10px,2vw,20px);font:400 12px/1.5 var(--type-body,'DM Sans',sans-serif);color:var(--grey);}
/* 0.7.30 — the two-up rows in the gallery flow are now always portrait
   photos, shown side by side at their own natural height instead of
   forced into a cropped 4/3 box (David: verticals must not be cropped).
   No aspect-ratio on the figure, and object-fit:contain (not cover) on
   the img, so nothing is ever cut off — only letterboxed in the rare
   case the two photos don't share a height, with a matching background
   so that padding reads as intentional rather than a rendering gap. */
/* 0.7.35 — same gap as the staggered pair (per David), not the 2px seam
   the plain pair used to have. */
/* 0.7.63 — this row is no longer full-bleed: David didn't want it flush
   to the browser edge like the wide/pair photos above and below it, but
   lined up with the rest of the page's content (same gutter as
   .property-section-head / .property-gallery-text). */
/* 0.7.65 — wider (1320px → 1600px) and a narrower gutter, plus a taller
   max-height on the photos below (74vh → 86vh): per David, now that
   there's no visible "frame" around these photos, push them further
   toward the sides — and since object-fit:contain sizes each img at its
   own real proportions (no crop either way), more width heading in
   naturally means more height too. */
/* 0.7.77 went from padding:0 clamp(14px,2.6vw,48px) to clamp(18px,4vw,70px)
   to match the "Inside the property" heading's own side margin, since
   #retrato (this block's section, since 0.7.77) had no side padding of
   its own at the time. 0.7.80 fixed THAT instead — #retrato now carries
   its .wrap side padding properly (see .ml08-retrato above) — so this
   block's own padding would double up with the section's. No padding
   here at all now; the section supplies it, same as the title above it. */
.property-gallery-vertical{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,64px);align-items:start;max-width:1600px;margin:0 auto;}
.property-gallery-vertical figure{margin:0 auto;}
/* 0.7.77 — a very tall, narrow photo can hit the max-height cap above
   before it hits the column's width, so object-fit:contain renders it
   narrower than its figure — and a plain figcaption (which just fills the
   figure) then reads as wider than the photo sitting above it (David: "el
   texto no debe de salirse de la imagen"). --ml08-ar is each photo's real
   width/height ratio (set inline per figure by the template, from the
   attachment's own metadata) — min() here picks whichever constraint
   actually binds, column width or the max-height cap, so the figure (and
   its caption) always match the photo's true rendered width. Browsers
   don't resolve this correctly on their own through an auto-width
   ancestor once a max-height is involved, hence the explicit calc()
   rather than something like width:fit-content. Skipped for .is-fill (the
   synthetic "+N fotos" tile below — always cover-cropped to a fixed 4:5,
   never real-photo dimensions, and always meant to fill its cell). */
/* 0.7.88 — desktop only: raised the height cap driving this calc (86vh →
   110vh, then 0.7.89 → 135vh, David: "quedo bien, podrias incrementarlo
   un poco mas") per Jorge's note on Casa Bomboti's Portrait pair:
   "pudiéramos darle más tamaño a las 2 fotos verticales... siento que
   están muy chicas y fuera de los márgenes que traen todas las
   secciones". A taller-but-narrower portrait photo was hitting the old
   cap well before it reached the column's own width, so it rendered
   noticeably smaller than the column (and than every other section's
   content width) with the remainder as dead white space on both sides —
   the fix is still "uncropped, sized by its own real proportions"
   (0.7.30/0.7.63), just with more headroom before the height cap binds,
   so a typical portrait photo now reaches the column's full width
   instead of stopping short of it. Mobile keeps its own 70vh below,
   untouched — this was specifically about desktop.
   0.7.90/0.4.30 — the 135vh is now a CSS custom property, not a fixed
   number: David asked for a simple way to adjust this himself (without
   another code push) in case Jorge doesn't like the current size.
   Mojiganga Settings → Gallery → "Vertical photo pair size" writes
   --ml08-vpair-vh (functions.php); 135vh is just the fallback for when
   that never runs (Core inactive, or no listing context). */
.property-gallery-vertical figure:not(.is-fill){width:min(100%, calc(var(--ml08-vpair-vh, 135vh) * var(--ml08-ar, 1)));}
/* 0.7.63 — width:100% + height:auto + max-height:82vh (below, previously)
   forced a box shaped nothing like the actual portrait photo (a tall photo
   in a wide column hit the max-height cap, but the width stayed at 100%
   of the column) — so object-fit:contain had to letterbox it to avoid
   cropping, and that fallback background showed as a visible "frame"
   around most photos, not just the rare mismatch it was meant for.
   width/height:auto (bounded only by max-width/max-height) sizes the img
   at its own real proportions instead, so it needs no letterboxing at
   all in the normal case — full photo, no crop, no box. */
.property-gallery-vertical img{display:block;width:auto;height:auto;max-width:100%;max-height:var(--ml08-vpair-vh, 135vh);object-fit:contain;background:var(--ml07-soft,#e9e3da);}
/* 0.7.48 — per-photo opt-in ("Fill frame" checkbox in the Gallery meta
   box, David: "que se vean más grandes"): this one photo fills its
   column edge-to-edge at a fixed 4:5 ratio (same ratio the In Town
   article's photo pairs already use) instead of showing the whole,
   uncropped photo letterboxed like the default above — a deliberate,
   per-photo exception to the "verticals must not be cropped" rule from
   0.7.30, not a change to that default. */
.property-gallery-vertical figure.is-fill img{height:100%;aspect-ratio:4/5;max-height:none;object-fit:cover;background:none;}
/* 0.7.69 — the side padding here (a leftover from when this row was
   full-bleed) inset the caption text ~10-20px from the photo's own left
   edge, so the two didn't line up (David: "debe de empezar el texto al
   nivel de la imagen"). No padding now — the caption starts flush with
   the image above it, same left edge. */
.property-gallery-vertical figcaption{margin-top:10px;padding:0;font:400 12px/1.5 var(--type-body,'DM Sans',sans-serif);color:var(--grey);background:none;}
/* 0.7.64 — the 5-photo grid after the parallax photo: 2 horizontal cells
   on top, up to 3 vertical cells below (per David). Each cell keeps a
   fixed aspect-ratio so the grid reads as even cells, and the last cell
   needs a consistent shape for the "+N fotos" overlay to sit on.
   0.8.3 briefly tried object-fit:contain here too, same idea as the
   .ml09-fig fix below — but a fixed-ratio grid can't both stay a clean
   uniform grid AND show every photo at its own real ratio with zero
   crop; "contain" just traded the crop for the same ugly background-
   color bars David flagged on .ml09-fig ("lo mismo en todas las
   otras"). 0.8.4 reverts this one specific spot back to cover (crop to
   fill), since a uniform grid genuinely needs uniform cells — unlike
   .ml09-fig, which isn't a grid and has no such constraint, so it could
   just drop the fixed ratio entirely instead (see below). */
.property-gallery-grid5{max-width:1320px;margin:0 auto;padding:0 clamp(18px,4vw,70px);display:flex;flex-direction:column;gap:clamp(10px,1.6vw,18px);}
.property-gallery-grid5-top,.property-gallery-grid5-bottom{display:grid;gap:clamp(10px,1.6vw,18px);}
.property-gallery-grid5-top{grid-template-columns:repeat(2,minmax(0,1fr));}
.property-gallery-grid5-bottom{grid-template-columns:repeat(3,minmax(0,1fr));}
.property-gallery-grid5 figure{margin:0;position:relative;}
.property-gallery-grid5-top img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;}
.property-gallery-grid5-bottom img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;}
.property-gallery-grid5 figcaption{margin-top:10px;padding:0;font:400 12px/1.5 var(--type-body,'DM Sans',sans-serif);color:var(--grey);}
/* 0.7.31 — the pinned/sticky horizontal photo in Block 2: it holds in
   place while the next block (the last vertical photo) scrolls up and
   slides over it, the way ignant.com's Casa Plajá piece does it. The
   outer figure just reserves extra scroll height; the inner wrapper is
   what actually sticks, pinned right below the site header so nothing
   sits behind it. */
/* 0.7.39 — replaced the sticky "hold" (0.7.36–0.7.38) with real parallax.
   The frame is a normal fixed-height window (no inflated multi-viewport
   height, no position:sticky); the photo inside is oversized top and
   bottom, and initPropertyParallax() in main.js shifts it with a
   translateY as the frame travels through the viewport, so the image
   visibly drifts at a different speed than the page scroll — the actual
   parallax look, not a frozen photo with a long hold. The caption sits
   outside the moving layer so it stays put instead of drifting with it.
   0.7.40 — the 12% oversize/shift was too subtle to read as "movement".
   0.7.41 — the oversize amount is no longer hard-coded here: it's set by
   initPropertyParallax() from Settings → Gallery → Parallax intensity, so
   David can control how strong the effect is without another code push.
   These top:0/height:100% values are just the pre-JS/no-JS fallback (a
   normal, uncropped-looking photo — no visible gap if the script is slow
   to run or Core is inactive). */
/* 0.7.90 — the fixed height + overflow:hidden that defines the pinned/
   parallax "window" moved from the outer <figure> onto .pin-inner itself
   (David: wants the caption below the photo, like every other gallery
   photo, instead of overlaid on top of it in white text). The caption is
   now a normal-flow sibling of .pin-inner, after it, inside the same
   <figure> — so the figure itself can no longer be a fixed-height
   overflow:hidden box (that would just clip the caption below it, same
   problem as before, one level up). .pin-inner keeps establishing the
   positioning context for the absolutely-positioned photo/"+N fotos"
   button exactly as before — position:relative works the same as
   position:absolute did for that purpose, it just also takes up real
   space in the page's normal flow, which is the whole point here. The
   caption itself needs no special rule any more: it picks up the exact
   same plain, below-image treatment as every other .property-gallery-full
   figcaption (the rule right above, in the non-pinned case). */
.property-gallery-full.is-pinned{position:relative;}
.property-gallery-full.is-pinned .property-gallery-pin-inner{position:relative;height:82vh;overflow:hidden;}
.property-gallery-full.is-pinned .property-gallery-pin-inner .ml08-lb-photo{position:absolute;inset:0;height:100%;}
.property-gallery-full.is-pinned .property-gallery-pin-inner img{position:absolute;left:0;top:0;width:100%;height:100%;max-height:none;object-fit:cover;will-change:transform;}
/* 0.7.80 — own side padding removed: #retrato (this block's section since
   0.7.77) now carries that margin itself, see .ml08-retrato above. */
.property-gallery-text{max-width:640px;margin:0 auto;}
/* 0.7.86 — italic, to match .property-gallery-story-quote below (David:
   both quotes in the gallery flow should carry the same "cursiva, de
   ladito" treatment). This "text" block is free-form — whatever David
   types in the Gallery meta box's "Text section" field, including his own
   quote marks when he wants it to read as a quote — only the font style
   changed here, nothing about the content. */
.property-gallery-text p{font:italic 400 calc(var(--ml-heading-scale,1) * clamp(22px,2.6vw,32px))/1.4 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.01em;color:var(--ink);text-align:center;}
/* 0.7.68 — David's own text section after the parallax photo, before the
   5-photo grid (Gallery meta box → "Text section — after the parallax
   photo"), rebuilt to match his reference mockup: an optional word/meaning
   aside (like "Mb'ot'i" / "Otomí: black"), one or more headed sections
   that lay out side by side — same two-column treatment as the main
   description in "El Retrato" above (.ml08-prose.property-description) —
   an optional pull quote, then a closing line under a small label, and a
   "Book a viewing" button that always ends the section. No color accent,
   same as the Retrato title: he asked for the structure, not the mockup's
   red styling. */
/* 0.7.80 — own side padding removed: #retrato now carries that margin
   itself, same reasoning as .property-gallery-vertical/-text above. */
.property-gallery-story{max-width:1180px;margin:0 auto;}
.property-gallery-story-body.has-word{display:grid;grid-template-columns:190px 1fr;gap:clamp(30px,5vw,64px);align-items:start;}
.property-gallery-story-word{font-size:12.5px;line-height:1.6;color:var(--grey);}
.property-gallery-story-word span{display:block;font:italic 400 24px/1.2 var(--display,'Newsreader',Georgia,serif);color:var(--ink);margin-bottom:8px;}
.property-gallery-story-word p{margin:0;}
/* 0.7.73 — each ## section used to be wrapped (see single-ml_listing.php) in
   its own .property-gallery-story-section, with break-inside:avoid-column
   on that WRAPPER rather than only on the heading/paragraphs inside it, so
   a whole section moved to the next column as one atomic block instead of
   the balance algorithm splitting it internally (heading stranded alone at
   the bottom of column 1, its own first paragraph starting fresh at the
   top of column 2).
   0.8.22 — that atomic-section rule had a gap it didn't account for: with
   only ONE section (no ## used at all, or everything written before the
   first ##), there is only one atomic block for the columns to "balance" —
   so it all piles into column 1 and column 2 stays completely empty (David:
   "se seguia recto hasta abajo en una sola columna", had to add a fake ##
   heading himself just to get a second block to split off into). Same root
   cause as the El Retrato fix above, same fix: break-inside:avoid-column
   removed from the section wrapper and from its paragraphs, so a long
   unheaded (or lightly-headed) section can actually split across the two
   columns. What stays, to keep the original 0.7.73 goal (a heading never
   stranded alone at the bottom of a column): break-inside AND
   break-after:avoid-column on the h3 itself — that keeps a heading glued to
   at least the start of the text under it without forcing the WHOLE section
   to stay in one column. */
.property-gallery-story-sections{columns:2;column-gap:clamp(28px,4vw,48px);}
.property-gallery-story-sections h3{font:400 calc(var(--ml-heading-scale,1) * clamp(20px,2vw,26px))/1.2 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.02em;color:var(--ink);margin:0 0 10px;-webkit-column-break-inside:avoid;break-inside:avoid-column;break-after:avoid-column;}
.property-gallery-story-sections p{font-size:15px;line-height:1.75;color:var(--ink);margin:0 0 1.05em;}
/* 0.7.74 — a "> " line written INSIDE a section (David: he wants a single
   standout sentence to read larger/italic right where it sits, not pulled
   out into the centered pull-quote below). Same italic/quote-mark
   treatment as .property-gallery-story-quote, just sized to sit inline in
   a narrower column instead of centered at full pull-quote size. */
.property-gallery-story-sections p.property-gallery-story-inline-quote{font:italic 400 calc(var(--ml-heading-scale,1) * clamp(17px,1.5vw,19px))/1.55 var(--display,'Newsreader',Georgia,serif);color:var(--ink);}
.property-gallery-story-sections p.property-gallery-story-inline-quote::before{content:'\201C';}
.property-gallery-story-sections p.property-gallery-story-inline-quote::after{content:'\201D';}
.property-gallery-story-quote{max-width:760px;margin:clamp(40px,5vw,64px) auto 0;padding:0;text-align:center;}
.property-gallery-story-quote p{font:italic 400 calc(var(--ml-heading-scale,1) * clamp(22px,2.6vw,32px))/1.4 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.01em;color:var(--ink);margin:0;}
/* 0.7.70 — real typographic quote marks around the pull quote, per
   David's reference. Added in CSS (not typed by him) so the marks are
   never lost or mismatched, and never end up inside the plain-text value
   that gets saved/escaped. */
.property-gallery-story-quote p::before{content:'\201C';}
.property-gallery-story-quote p::after{content:'\201D';}
.property-gallery-story-closing{max-width:640px;margin:clamp(40px,5vw,64px) auto 0;text-align:center;}
.property-gallery-story-closing-kicker{display:block;font:500 11px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin-bottom:14px;}
.property-gallery-story-closing p{font:400 calc(var(--ml-heading-scale,1) * clamp(19px,2vw,24px))/1.5 var(--display,'Newsreader',Georgia,serif);color:var(--ink);margin:0 0 26px;}
.property-page .property-related{background:var(--ml07-paper);}
.property-page .property-related .items{gap:28px;}
.property-page .property-contact{background:var(--ml07-soft);}

/* Catalog repeats the photography-led direction; filters/data remain unchanged. */
.catalog-results .listing{border-top:1px solid var(--ml07-line);padding:27px 0 clamp(48px,6vw,90px);margin:0;}
.catalog-results .listing-media{max-width:1050px;margin:0 auto;}
.catalog-results .listing-media>.ph{display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--ml07-soft);}
.catalog-results .listing-media>.ph img{width:100%;height:100%;object-fit:cover;display:block;}
.catalog-results .listing.duo .listing-media.imgs{grid-template-columns:1.65fr 1fr;gap:18px;aspect-ratio:auto;}
.catalog-results .listing.duo .listing-media.imgs .ph{aspect-ratio:1.52;}
.catalog-results .listing.duo .listing-media.imgs .ph:nth-child(2){aspect-ratio:4/5;margin-top:35px;}
.catalog-results .listing .listing-info{max-width:1050px;margin:22px auto 0;}
.catalog-results .listing-info h3{font:400 calc(var(--ml-heading-scale,1) * clamp(34px,4vw,62px))/1.05 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.05em;}
.catalog-results .listing-badges span{background:rgba(18,18,18,.65);}

@media(max-width:900px){
  .ml073-edition-layout{grid-template-columns:minmax(0,1.45fr) minmax(210px,.85fr);gap:26px;}
  .ml073-edition-story h3{font-size:clamp(31px,4.5vw,51px);}
}
@media(max-width:760px){
  .ml07-hero.is-image-only,.ml07-hero.is-image-only.is-full-width,.ml07-hero.is-image-only:not(.is-full-width){width:var(--ml073-hero-mobile-width,100%)!important;max-width:calc(100% - 32px)!important;padding-inline:0!important;}
  .ml07-hero.is-image-only .ml071-cover-photo{width:100%!important;height:var(--ml073-hero-mobile-height,240px)!important;object-fit:var(--ml073-hero-fit,cover)!important;object-position:var(--ml073-hero-position,50% 50%)!important;}
  .ml07-feature-image{height:var(--ml073-hero-mobile-height,240px)!important;}
  .ml073-property-editions{gap:68px;}
  .home-arrivals .section-head{align-items:flex-end;gap:20px;}
  .home-arrivals .section-head h2{font-size:clamp(43px,10vw,70px);}
  .ml073-edition-layout{display:flex;flex-direction:column;align-items:stretch;gap:34px;}
  .ml073-edition-photos,.ml073-property-edition.is-reversed .ml073-edition-photos{order:0;grid-template-columns:5fr 2fr;gap:12px;}
  .ml073-property-edition.is-reversed .ml073-edition-photo-primary{order:0;}
  .ml073-property-edition.is-reversed .ml073-edition-photo-secondary{order:0;}
  .ml073-edition-photo-primary{aspect-ratio:4/4.1;}
  .ml073-edition-photo-secondary{margin-bottom:-16px;}
  .ml073-edition-story,.ml073-property-edition.is-reversed .ml073-edition-story{order:1;margin:0;max-width:520px;padding:0;}
  .ml073-edition-story h3{font-size:clamp(38px,9vw,60px);margin:15px 0;}
  .ml073-edition-excerpt{font-size:13px;}
  .property-page .property-overview{grid-template-columns:1fr;gap:45px;}
  .property-page .property-facts{max-width:600px;}
  .property-page .property-before-you-text{margin-left:0;}
  .property-page .property-before-you-link{margin-left:0;}
  .property-gallery-flow{gap:36px;}
  .property-gallery-full img{max-height:64vh;}
  .property-gallery-pair{grid-template-columns:1fr;gap:2px;}
  .property-gallery-vertical{grid-template-columns:1fr;gap:18px;}
  .property-gallery-vertical img{max-height:70vh;}
  .property-gallery-vertical figure:not(.is-fill){width:min(100%, calc(70vh * var(--ml08-ar, 1)));}
  .property-gallery-grid5-top{grid-template-columns:1fr;}
  .property-gallery-grid5-bottom{grid-template-columns:1fr 1fr;}
  .property-gallery-grid5-bottom figure:nth-child(3){grid-column:1/-1;}
  /* 0.8.1 tried making this grid full-bleed on mobile to match the hero
     photo above it, and 0.8.2 "fixed" the cascade bug that stopped that
     from working — but David clarified afterward that's not what he
     wanted at all: he wants the grid to KEEP its side spacing, same as
     it always had ("sigues dejándolo de ancho completo, en lugar de
     dejar esos espacios de lado"). So 0.8.3 reverts this: no override
     here anymore, the grid just falls back to its own base rule above
     (.property-gallery-grid5{...padding:0 clamp(18px,4vw,70px)...}),
     same side padding on mobile as on desktop. This also removes the
     width:100vw breakout that was the real cause of the separate hero
     white-space regression David reported — reverting it fixes that
     side effect too, with no replacement rule needed. */
  /* 0.7.86 — the parallax effect now runs on phones too (David: quiere el
     mismo efecto de escritorio en mobile). Same pinned frame as desktop —
     oversized photo, initPropertyParallax() shifting it on scroll (main.js
     no longer skips this width either) — just a shorter frame height,
     matching the max-height already used for the rest of the mobile
     gallery's photos (64vh) instead of desktop's fuller 82vh, since a
     full-viewport-height frame reads heavier on a phone.
     0.7.90 — height moved from the outer figure onto .pin-inner (see the
     desktop rule's comment above) and "overlay caption" dropped from this
     note: the caption is a plain below-image line now, on mobile too. */
  .property-gallery-full.is-pinned .property-gallery-pin-inner{height:64vh;}
  .property-gallery-text p{font-size:clamp(19px,5.5vw,24px);}
  .property-gallery-story-body.has-word{grid-template-columns:1fr;gap:18px;}
  .property-gallery-story-sections{columns:1;}
  .catalog-results .listing.duo .listing-media.imgs{grid-template-columns:1.5fr 1fr;gap:10px;}
  .catalog-results .listing.duo .listing-media.imgs .ph:nth-child(2){display:block;margin-top:22px;}
}
@media(prefers-reduced-motion:reduce){.ml073-edition-photos img{transition:none!important;transform:none!important;}.property-gallery-full.is-pinned .property-gallery-pin-inner img{transform:none!important;}}

.ml073-edition-photos:not(.has-secondary),.ml073-property-edition.is-reversed .ml073-edition-photos:not(.has-secondary){grid-template-columns:1fr;}
.ml073-edition-photos:not(.has-secondary) .ml073-edition-photo-primary{aspect-ratio:5/4;}

/* Section-level padding wins; no hidden extra space inside the quote row. */
.quote-block.cantera-statement .wrap{padding-top:0!important;padding-bottom:0!important;}

/* ====================================================================
   0.7.21 · FICHA RESTRUCTURE — Jorge's mockup (mojiganga-living-ficha-
   mockup_5.html), arrangement only. Keeps the theme's own identity —
   Newsreader/DM Sans, --ink/--grey/--rosa/--ml07-* tokens — throughout;
   nothing here reads Playfair Display, Space Grotesk or #DA3B34.
   ==================================================================== */

/* ---------- hero: photo becomes a clickable lightbox trigger, plus a
   status pill and a "view all photos" button overlaid on it ---------- */
.ml074-hero{position:relative;}
.ml074-hero-photo{border:0;padding:0;margin:0;background:none;font:inherit;color:inherit;cursor:zoom-in;text-align:left;-webkit-appearance:none;appearance:none;}
.ml074-hero-photo:focus-visible{outline:3px solid var(--rosa);outline-offset:-3px;}
.ml08-hero-overlay{position:absolute;left:0;right:0;top:0;bottom:0;z-index:3;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(18px,3vw,32px);pointer-events:none;}
.ml08-hero-status{align-self:flex-start;pointer-events:auto;display:inline-flex;align-items:center;background:rgba(250,249,246,.94);color:var(--ml07-ink);font:600 10px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:.13em;text-transform:uppercase;padding:8px 14px;border-radius:99px;}
.ml08-hero-status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--rosa);margin-right:8px;}
.ml08-viewall{align-self:flex-end;pointer-events:auto;background:rgba(250,249,246,.94);color:var(--ml07-ink);border:0;border-radius:99px;padding:10px 16px;font:500 12px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:.04em;cursor:pointer;display:inline-flex;align-items:center;gap:8px;}
/* justify-content:space-between on .ml08-hero-overlay only pushes the status
   pill to the top and this button to the bottom when BOTH are present — a
   listing with no status badge leaves this as the overlay's only flex
   child, and space-between then has nothing to space it from, so it sits
   at the top instead — right over the header, unclickable behind its nav
   links. margin-top:auto pins it to the bottom of the overlay regardless
   of whether the status pill exists. */
.ml08-hero-overlay .ml08-viewall{margin-top:auto;}
.ml08-viewall:hover{background:#fff;}
.property-gallery .ml08-viewall{background:transparent;border:1px solid var(--ml07-line);color:var(--ink);border-radius:0;align-self:auto;}

/* ---------- transparent-over-photo header, solid once scrolled past it ---------- */
/* 0.7.82 — added transform:translateZ(0) (+ backface-visibility as older-
   WebKit insurance): a cheap, standard hint that promotes this fixed
   header to its own compositor layer so it tracks scroll on the
   compositor thread instead of needing a main-thread repaint every
   frame — pairs with the scroll-handler throttling in main.js
   (initPropertyHeroHeader/initPropertySubnav) to fix the mobile
   "menu jank while scrolling" David reported. */
body.has-ml08-hero-header header.site{position:fixed;left:0;right:0;width:100%;transition:background-color .12s ease,border-color .12s ease;transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;}
body.has-ml08-hero-header header.site:not(.is-scrolled){background:transparent;border-bottom-color:transparent;}
/* 0.7.49 tried fixing the visible "línea"/"franja" by making the dark
   tint behind the header fade out earlier (65%) instead of exactly at its
   own box's bottom edge — that did remove the hard one-pixel seam, but
   against a busy, detailed photo the tinted rectangle itself still read
   as a visible band, seam or not: any flat-tinted box next to an
   untinted photo has an edge somewhere, no matter how gently it fades.
   0.7.51 removes that box entirely and reads text against the raw photo
   instead, using a text-shadow on the white text/icons for legibility —
   there is no rectangle any more, so there is nothing left that CAN show
   a seam or band at any boundary. */
/* 0.7.49 — .wordmark's visible text is inside <b>/<span> children, which
   .wordmark b,.wordmark span further below sets to a fixed dark color —
   an explicit color on those elements beats one merely inherited from
   this white rule on their .wordmark parent, so the logo never actually
   turned white here even though this rule looks like it should. Naming
   the children directly gives them their own explicit white here, which
   wins on its higher specificity.
   0.7.91 — split out from the shared white rule below: David wants just
   the Mojiganga Living wordmark itself NOT white in this transparent-
   over-hero state ("no quiero que vaya en blanco"), using the same tone
   as Personalizar → "Fondo de secciones suaves" (--ml07-soft) instead —
   it's a var() rather than a hard-coded hex so this stays in sync
   automatically if that color is ever changed again. Everything else in
   the header (BUY/SELL, IN TOWN, the language switcher, the mobile menu
   icon) stays plain white — only the wordmark changes. */
body.has-ml08-hero-header header.site:not(.is-scrolled) .wordmark,
body.has-ml08-hero-header header.site:not(.is-scrolled) .wordmark b,
body.has-ml08-hero-header header.site:not(.is-scrolled) .wordmark span{color:var(--ml07-soft, #f0ece6);text-shadow:0 1px 4px rgba(0,0,0,.6),0 1px 12px rgba(0,0,0,.35);}
body.has-ml08-hero-header header.site:not(.is-scrolled) .nav-left a,
body.has-ml08-hero-header header.site:not(.is-scrolled) .nav-right a,
body.has-ml08-hero-header header.site:not(.is-scrolled) .ml075-nav-dropdown-label,
body.has-ml08-hero-header header.site:not(.is-scrolled) .nav-right .lang,
body.has-ml08-hero-header header.site:not(.is-scrolled) .ml07-mobile-menu summary{color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.6),0 1px 12px rgba(0,0,0,.35);}
body.has-ml08-hero-header header.site:not(.is-scrolled) .ml07-menu-glyph{border-color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6));}
/* 0.7.50 — .nav-right a above matches EVERY link inside .nav-right,
   including the ones inside .ml075-nav-dropdown-menu — but that dropdown
   box always sits on its own solid light background (var(--ml07-paper)),
   never directly over the hero photo, so it should never go white: doing
   so left it almost unreadable (white text on a near-white box). This
   selector is more specific (one more class) so it wins back over it. */
/* 0.8.35 — the rule above fixed the dropdown LINKS' color back to dark
   (they sit on the menu's own solid light background, never on the hero
   photo), but left their text-shadow untouched: the earlier .nav-right a
   rule applies both color AND the white-on-photo text-shadow to every
   link in .nav-right, including these, and only the color half was ever
   overridden here. The shadow stayed visible as a faint smudge behind the
   dark text on the light dropdown box (David, screenshot from a property
   page: "sigue aplicandose el sombreado en el menu"). Reset to none. */
body.has-ml08-hero-header header.site:not(.is-scrolled) .ml075-nav-dropdown-menu a{color:var(--ink);text-shadow:none;}
body.has-ml08-hero-header header.site.is-scrolled{background:var(--ml07-paper);border-bottom:1px solid var(--ml07-line);}

/* ---------- intro row: title · stacked facts · CTA, mockup's "ff-row" idea in the current identity ---------- */
/* 0.7.78 — top padding was clamp(22px,3.4vw,40px), stacking with
   .ml074-hero's own margin-bottom above to make the gap under the hero
   photo read as too much dead space before the title (David: "el
   espacio en blanco que hay entre la foto del hero y los datos de abajo
   ... que se reduzca" — the photo's own height was never the issue, see
   .ml074-hero above). Bottom padding (before Details/Photos etc.) is
   untouched. */
/* 0.7.83 — was "padding:clamp(10px,1.6vw,20px) 0 clamp(30px,4vw,48px)":
   that 3-value shorthand's middle 0 also sets padding-left/right to 0,
   the exact same bug already fixed on .ml08-retrato/.ml08-datos/
   .ml08-ubicacion in 0.7.80 — it silently overrode the side padding
   this section's own .wrap class provides (same specificity, this rule
   comes later), so the title/facts/CTA sat flush against the screen
   edge on mobile (David: "lo unico que falta en mobil es que eso no
   este tan pegado, si no que tenga un marjen de lado"). Longhand
   top/bottom only, same fix pattern as before. */
.ml08-intro{padding-top:clamp(10px,1.6vw,20px);padding-bottom:clamp(30px,4vw,48px);}
.ml08-intro-row{display:grid;grid-template-columns:minmax(0,1fr) 230px auto;gap:clamp(28px,4vw,48px);align-items:start;}
.ml08-intro-title .property-kicker{margin-bottom:16px;}
.ml08-intro-title h1{font:400 calc(var(--ml-heading-scale,1) * clamp(34px,4.6vw,58px))/1.08 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.03em;color:var(--ink);margin:0 0 10px;}
.ml08-intro-title .ml074-hero-location{margin-top:2px;}
.ml08-intro-title .property-editorial-badges{margin-top:14px;margin-bottom:0;}
.ml08-intro-facts{list-style:none;margin:6px 0 0;padding:0;font:400 14px/1.6 var(--type-body,'DM Sans',sans-serif);color:var(--ink);}
.ml08-intro-facts li{padding:2px 0;}
.ml08-intro-facts li strong{font-weight:600;}
.ml08-intro-facts .ml08-intro-price{margin-top:8px;padding-top:10px;border-top:1px solid var(--ml07-line);font:700 14px/1.6 var(--type-body,'DM Sans',sans-serif);color:var(--ink);}
.ml08-intro-cta{display:inline-flex;align-items:center;gap:12px;border:1px solid var(--ink);padding:13px 18px;font:600 12px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);white-space:nowrap;transition:.2s;align-self:start;}
.ml08-intro-cta:hover{background:var(--ink);color:#fff;border-color:var(--ink);}

/* ---------- sub-nav: sticky tabs, "stuck" mini bar with the CTA that never disappears ---------- */
/* top comes from --ml08-header-h, which main.js sets to the fixed site
   header's own bottom edge (initPropertySubnavOffset()) — that already
   accounts for the header's real height AND any WP admin-bar offset, so
   the tabs stick right under the header instead of sticking to top:0 and
   ending up hidden behind it once both are pinned to the same spot. */
/* 0.7.81 — fallback top offset was 75px, matching the header's old
   min-height (now 64px, see header.site .nav above); JS
   (initPropertySubnavOffset()) overwrites this with the header's real
   measured height at runtime regardless, so this fallback only matters
   for the brief instant before that script runs. */
.ml08-subnav{position:sticky;top:var(--ml08-header-h,64px);z-index:35;background:rgba(250,249,246,.97);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--ml07-line);}
/* 0.7.81 — was height:56px. This bar is itself "el menu" once you've
   scrolled past the intro (it shows the property name/price + tabs in
   place of the site header — see main.js's initPropertySubnavOffset()
   comment), so it gets the same trim as the main header above. */
.ml08-subnav-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;height:48px;}
.ml08-tabs{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;}
.ml08-tabs::-webkit-scrollbar{display:none;}
.ml08-tabs a{font:500 12.5px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:.03em;white-space:nowrap;color:var(--grey);padding:20px 0;border-bottom:2px solid transparent;}
.ml08-tabs a.is-on,.ml08-tabs a:hover{color:var(--ink);border-color:var(--ink);}
.ml08-subnav-mini{display:flex;align-items:center;gap:16px;opacity:0;pointer-events:none;transition:opacity .2s;}
.ml08-subnav.is-stuck .ml08-subnav-mini{opacity:1;pointer-events:auto;}
.ml08-mini-name{font:400 16px/1 var(--display,'Newsreader',Georgia,serif);color:var(--ink);white-space:nowrap;}
.ml08-mini-price{font:500 12.5px/1 var(--type-body,'DM Sans',sans-serif);color:var(--grey);white-space:nowrap;}
.ml08-subnav-mini .btn{height:36px;padding:0 16px;font-size:11.5px;display:inline-flex;align-items:center;}

/* ---------- Retrato: lede + two-column prose with drop-cap + a slim credits column ---------- */
/* 0.7.80 — was "padding:clamp(56px,7vw,96px) 0": that shorthand also sets
   padding-left/right to 0, silently overriding the side padding this
   section's own .wrap class is supposed to provide (same-specificity
   class selectors, this rule comes later in the file) — so "The
   Portrait"'s own kicker/title sat flush against the screen edge on
   narrow viewports, same bug as .ml08-datos/.ml08-ubicacion below
   (David: "como que todo es tan a la orilla, sin margen"). Longhand
   top/bottom here leaves .wrap's own left/right padding alone. The
   vertical-pair/text/story blocks below (0.7.77) had their own side
   padding added specifically to make up for this section having none —
   now that it does, see their padding:0 note further down. */
.ml08-retrato{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px);border-top:1px solid var(--ml07-line);}
.ml08-lede{font:400 calc(var(--ml-heading-scale,1) * clamp(21px,2.4vw,30px))/1.4 var(--display,'Newsreader',Georgia,serif);color:var(--ink);max-width:900px;margin:14px 0 0;letter-spacing:-.008em;}
/* 0.7.66 — optional title, above the lede/subtitle line, per David's
   mockup (kicker → big headline → supporting line). Deliberately no
   color/italic accent — he asked for the structure only, not the mockup's
   red styling. Only rendered when he fills in Property → Retrato — Título;
   the plain kicker+lede above still covers every listing that doesn't. */
.ml08-retrato-title{font:400 calc(var(--ml-heading-scale,1) * clamp(34px,4.6vw,64px))/1.08 var(--display,'Newsreader',Georgia,serif);letter-spacing:-.03em;color:var(--ink);max-width:900px;margin:14px 0 0;}
.ml08-retrato-title + .ml08-lede{margin-top:10px;}
.ml08-story{display:grid;grid-template-columns:190px 1fr;gap:clamp(30px,5vw,64px);margin-top:clamp(38px,5vw,56px);align-items:start;}
.ml08-story-credits{font-size:12.5px;color:var(--grey);line-height:1.6;}
.ml08-story-credits p{margin-top:16px;}
.ml08-story-credits p:first-child{margin-top:0;}
.ml08-story-credits b{display:block;color:var(--ink);font-weight:600;margin-bottom:2px;}
.ml08-prose-wrap{min-width:0;}
.ml08-prose.property-description{columns:2;column-gap:clamp(28px,4vw,48px);max-width:none;}
.ml08-prose.property-description p{margin:0 0 1.05em;font-size:clamp(15.5px,1.25vw,17px);}
/* 0.8.22 — break-inside:avoid-column removed from paragraphs (it's still kept
   on headings below, on purpose). With it on every paragraph, one short
   paragraph followed by one long one couldn't balance: the long paragraph
   had to land whole in a single column, leaving the other column mostly
   empty until something else (David was inserting a heading just to force
   a break) pushed content into it. That same imbalance is also why the
   420px collapsed cutoff looked clean on some listings (Bomboti — evenly
   split paragraphs, both columns reach ~420px together, gradient covers
   both the same way) and "cortado feo" on others (Hacienda Amor — one
   column empties out early while the other is still mid-paragraph at the
   cutoff). Letting paragraphs split across the column break is exactly how
   newspaper/magazine columns normally work and lets the browser actually
   balance the two columns regardless of how long any one paragraph is —
   no more manual heading-as-a-column-break trick needed. */
/* 0.7.73 — headings David adds inside the description (h2/h3/h4) now get
   break-inside/break-after:avoid-column so one never gets stranded alone
   at the bottom of a column with its own paragraph pushed to the top of
   the next one (the "my heading isn't reading as a header" bug — it was
   a heading split away from the text under it, not a styling problem). */
.ml08-prose.property-description h2,.ml08-prose.property-description h3,.ml08-prose.property-description h4{-webkit-column-break-inside:avoid;break-inside:avoid-column;break-after:avoid-column;}
.ml08-prose.property-description>*:first-child::first-letter{font-family:var(--display,'Newsreader',Georgia,serif);float:left;font-size:60px;line-height:.82;padding:5px 8px 0 0;color:var(--ink);}
/* Was 900px, then 340px (0.7.73) — showed most of a typical description
   before "Read more" ever appeared, so anyone who didn't want to read it
   still had to scroll past almost all of it to reach Photos/Details/etc.
   0.7.77 briefly went to a single column here instead of fixing the gap
   below — reverted (David: two columns, always — "tiene que ser en dos
   columnas" — a single column "esta muy culero"). 420px (was 340px) is
   the actual fix he asked for instead: "si necesitas ampliar más el
   texto para que no se quede hueco en blanco tan grande... entonces
   hazlo asi" — more room for column-balancing to work with makes the
   short-paragraph/long-paragraph mismatch (see note below) far less
   likely to read as a big gap, without giving up the two columns. */
.ml08-prose.property-description.is-collapsible{max-height:420px;}
.ml08-prose.property-description.is-collapsible::after{background:linear-gradient(to bottom, rgba(250,249,246,0), var(--ml07-paper));}
/* 0.7.73 tried column-fill:auto scoped to just the collapsed state, so
   column 1 would fill before spilling into column 2 instead of
   pre-balancing against the full (uncollapsed) height. That worked for
   an evenly-split description, but every paragraph still had
   break-inside:avoid-column on it back then (so a heading never gets
   stranded away from its own text) — so a short first paragraph followed
   by a long second one could still push that whole second paragraph into
   column 2 rather than letting it start filling column 1's leftover
   space. 0.7.77 swapped this for a single column, which David rejected
   on sight — two columns is the look he wants, and a taller collapsed
   box (above) is the fix for the gap, not fewer columns. The base rule
   above sets columns:2 with the default column-fill (balance)
   unconditionally, collapsed or expanded.
   0.8.22 — that short/long paragraph mismatch this whole note describes
   is what was still causing the empty-column / forced-heading problem
   and the uneven "cortado" look reported for Hacienda Amor. Fixed at the
   source above: paragraphs no longer have break-inside:avoid-column, so
   column-fill:balance can actually split a long paragraph across the
   two columns instead of being forced to dump it whole into one. */

/* ---------- gallery lightbox trigger buttons (photo essay reuses the same photos) ---------- */
.property-gallery-full .ml08-lb-photo,.property-gallery-pair .ml08-lb-photo,.property-gallery-vertical .ml08-lb-photo,.property-gallery-grid5 .ml08-lb-photo{border:0;padding:0;margin:0;background:none;display:block;width:100%;cursor:zoom-in;}
.property-gallery-full .ml08-lb-photo img,.property-gallery-pair .ml08-lb-photo img{width:100%;}
/* 0.7.66 — .property-gallery-vertical was dropped from the rule above: this
   selector (.property-gallery-vertical .ml08-lb-photo img) is 2 classes deep
   and so beats the plain ".property-gallery-vertical img" rule earlier in
   this file no matter which comes first in the stylesheet — it was forcing
   width:100% back onto these photos, which is exactly the "no crop, no
   forced box" fix from 0.7.63 being silently undone: width pinned to the
   column while height still capped by max-height reintroduces a box shape
   that doesn't match the photo, so object-fit:contain had to letterbox it
   again (the "frame" David saw come back). Sizing for this row now comes
   only from ".property-gallery-vertical img" (width:auto/height:auto). */
.property-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;}

/* ---------- Datos: a plain two-column facts sheet, real fields only ---------- */
/* 0.7.80 — see the same fix/note on .ml08-retrato above: the shorthand
   also zeroed this section's own side padding, so "Details"/"House
   details" sat flush against the edge on mobile (David's screenshot —
   the kicker text was clipped right at the screen edge). */
.ml08-datos{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px);border-top:1px solid var(--ml07-line);}
.ml08-datos-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(28px,5vw,64px);margin:0;}
.ml08-datos-grid div{display:grid;grid-template-columns:180px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--ml07-line);font-size:14px;}
.ml08-datos-grid dt{color:var(--grey);}
.ml08-datos-grid dd{margin:0;color:var(--ink);}

/* ---------- Ubicación: decorative placeholder + a real Maps link from lat/lng ---------- */
/* 0.7.80 — same fix as .ml08-retrato/.ml08-datos above (shorthand was
   zeroing the section's own side padding). */
.ml08-ubicacion{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px);border-top:1px solid var(--ml07-line);}
.ml08-loc{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(28px,5vw,56px);margin-top:clamp(30px,4vw,44px);align-items:start;}
.ml08-map{aspect-ratio:4/3;background:var(--ml07-soft);border:1px solid var(--ml07-line);display:flex;align-items:center;justify-content:center;overflow:hidden;}
/* Once a Google Maps API key is set (see functions.php/main.js), the real
   map renders directly into this box in place of the illustrated pin. */
.ml08-map.is-live-map{display:block;}
.ml08-map svg{width:100%;height:100%;}
.ml08-map-grid path{stroke:var(--ml07-line);stroke-width:1;fill:none;}
.ml08-map .pin-ring{fill:var(--rosa);opacity:.14;}
.ml08-map .pin-dot{fill:var(--rosa);}
.ml08-loc-copy p{font-size:15px;line-height:1.7;color:var(--ink);max-width:420px;margin:0;}
/* 0.7.34 — the optional per-property "nearby places" list. */
.ml08-nearby-list{list-style:none;margin:24px 0 0;padding:0;max-width:420px;border-top:1px solid var(--ml07-line);}
.ml08-nearby-list li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:13px 0;border-bottom:1px solid var(--ml07-line);font-size:14px;color:var(--ink);}
.ml08-nearby-time{color:var(--grey);flex:0 0 auto;font-variant-numeric:tabular-nums;}
.ml08-loc-copy .link-arrow{display:inline-flex;gap:10px;align-items:center;font-size:13.5px;margin-top:20px;border-bottom:1px solid var(--ink);padding-bottom:3px;color:var(--ink);}
.ml08-loc-copy .link-arrow:hover{color:var(--rosa);border-color:var(--rosa);}

/* ---------- Contact: direct links list + brokerage line under the advisor's name ---------- */
.ml08-agent-brokerage{font-size:12px;color:var(--grey);margin-top:4px;}
.ml08-direct{display:flex;flex-direction:column;border-top:1px solid var(--line);margin-top:18px;}
.ml08-direct a{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);font-size:13.5px;font-weight:600;color:var(--ink);}
.ml08-direct a:hover{color:var(--rosa);}

/* ---------- Alertas: second capture — if this house isn't it, the lead isn't lost ---------- */
.ml08-alert{background:var(--ml07-ink);color:#fff;padding:clamp(36px,5vw,56px) clamp(22px,4.2vw,64px);display:grid;grid-template-columns:1fr auto;gap:clamp(24px,4vw,40px);align-items:center;margin:clamp(56px,7vw,96px) auto;border-radius:2px;}
.ml08-alert-copy h3{font:400 calc(var(--ml-heading-scale,1) * clamp(21px,2.4vw,28px))/1.25 var(--display,'Newsreader',Georgia,serif);color:#fff;margin:0;}
.ml08-alert-copy h3 em{font-style:italic;}
.ml08-alert-copy p{font-size:13.5px;color:rgba(255,255,255,.7);margin-top:8px;}
.ml08-alert-form{display:flex;gap:10px;flex-wrap:wrap;}
.ml08-alert-form .ml-hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.ml08-alert-form input[type=email]{font:inherit;background:transparent;border:1px solid rgba(255,255,255,.35);border-radius:99px;padding:0 20px;height:48px;color:#fff;width:270px;outline:none;}
.ml08-alert-form input[type=email]::placeholder{color:rgba(255,255,255,.55);}
.ml08-alert-form input[type=email]:focus{border-color:#fff;}
.ml08-alert-form .btn{background:#fff;color:var(--ml07-ink);}
.ml08-alert-form .btn:hover{background:var(--rosa);color:#fff;}
.ml08-alert-sent{grid-column:1/-1;font-size:13.5px;color:#fff;}
.ml08-alert-sent.is-error{color:#f2b8b8;}

/* ---------- mobile fixed dock: price + WhatsApp + CTA, once you've scrolled past the intro ---------- */
.ml08-dock{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--ml07-paper);border-top:1px solid var(--ml07-line);display:none;padding:10px 16px;gap:10px;align-items:center;transform:translateY(100%);transition:transform .3s ease;}
.ml08-dock.is-shown{transform:none;}
.ml08-dock-price{flex:1;min-width:0;}
.ml08-dock-price strong{display:block;font:600 16px/1.1 var(--type-body,'DM Sans',sans-serif);color:var(--ink);}
.ml08-dock-price small{display:block;font-size:11px;color:var(--grey);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ml08-dock-wa{width:44px;height:44px;flex:none;border-radius:50%;border:1px solid var(--ml07-line);display:flex;align-items:center;justify-content:center;font-size:18px;}
.ml08-dock .btn{height:44px;padding:0 18px;display:inline-flex;align-items:center;}

/* ---------- lightbox ---------- */
.ml08-lb{position:fixed;inset:0;background:rgba(250,249,246,.98);z-index:100;display:none;flex-direction:column;}
.ml08-lb.is-open{display:flex;}
.ml08-lb-top{display:flex;justify-content:space-between;align-items:center;padding:16px clamp(18px,4vw,32px);font:500 12.5px/1 var(--type-body,'DM Sans',sans-serif);color:var(--ink);}
.ml08-lb-top button{border:0;background:none;font:inherit;color:var(--ink);cursor:pointer;letter-spacing:.04em;}
.ml08-lb-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:0 clamp(18px,4vw,32px) 28px;position:relative;min-height:0;}
.ml08-lb-stage img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
.ml08-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;background:#fff;border:1px solid var(--ml07-line);font-size:17px;cursor:pointer;}
.ml08-lb-prev{left:clamp(10px,3vw,28px);}
.ml08-lb-next{right:clamp(10px,3vw,28px);}

@media (max-width:1000px){
  .ml08-intro-row{grid-template-columns:1fr auto;gap:24px;}
  .ml08-intro-title{grid-column:1/-1;}
  .ml08-story{grid-template-columns:1fr;gap:24px;}
  .ml08-story-credits{display:flex;gap:24px;flex-wrap:wrap;}
  .ml08-story-credits p{margin-top:0;}
  .ml08-prose.property-description{columns:1;}
  .ml08-datos-grid{grid-template-columns:1fr;}
  .ml08-loc{grid-template-columns:1fr;}
  .ml08-alert{grid-template-columns:1fr;text-align:left;}
}
@media (max-width:760px){
  /* 0.7.80 — this used to force the header solid/opaque on mobile no
     matter what (position:sticky + solid background + ink text even
     pre-scroll), so the transparent-over-photo/white-text effect from
     the base rules above (line ~1404) never showed on a listing page's
     mobile view. David asked for the same effect on mobile ("el mismo
     efecto de poner transparente el menu... con el texto blanco y que
     despues se ponga negro") — initPropertyHeroHeader() in main.js
     already toggles .is-scrolled purely off the hero photo's own
     position, with no desktop-only gating, so removing this override
     is enough: mobile now gets the identical fixed+transparent+white
     pre-scroll / solid+ink post-scroll behavior as desktop. The mobile
     dropdown menu panel (.ml07-mobile-menu nav, line ~864) always has
     its own solid background regardless of header state, so opening
     it while the header is still transparent is unaffected. */
  .ml08-hero-overlay{padding:14px;}
  .ml08-intro-row{grid-template-columns:1fr;gap:20px;}
  /* 0.7.80 — was justify-content:space-between on the outline button,
     which pushed the text and the "›" to opposite ends of a full-width
     bordered bar — an empty-looking box (David: "no deberia de salir
     asi de feo"). Filled solid black (matches the .btn look used
     elsewhere, e.g. the mobile dock CTA) with centered content instead;
     desktop's outline button above is untouched. */
  .ml08-intro-cta{justify-content:center;width:100%;background:var(--ink);color:#fff;border-color:var(--ink);}
  .ml08-subnav-mini{display:none;}
  .ml08-tabs a{padding:16px 0;}
  /* 0.7.80 — longhand (was "padding:44px 0"), so mobile keeps the side
     padding .wrap provides instead of re-zeroing it here too. */
  .ml08-retrato,.ml08-datos,.ml08-ubicacion{padding-top:44px;padding-bottom:44px;}
  .ml08-alert-form{flex-direction:column;}
  .ml08-alert-form input[type=email]{width:100%;}
  .ml08-dock{display:flex;}
  .ml08-lb-nav{width:40px;height:40px;font-size:15px;}
}
@media (prefers-reduced-motion:reduce){
  .ml08-dock,body.has-ml08-hero-header header.site{transition:none!important;}
}

/* ---------- 0.7.24 · three fixes reported on the restructured ficha ---------- */

/* 1) The header's own darkening scrim only ever covered the header's own
   (short) box, so directly beneath it — on top of the photo — nothing was
   darkening it for legibility. If the photo happens to be light there, or
   the header sits slightly lower (e.g. nudged down to clear the WP admin
   bar for a logged-in editor, see the .admin-bar rules above), that reads
   as a stray pale band that "looks like part of the menu". The status/
   view-all overlay already stretches the full height of the hero photo
   (inset:0) — it just carries no background of its own — so giving it a
   tall top-down gradient blends the header straight into the photo no
   matter its exact height, instead of stopping dead at the header's edge. */
.ml08-hero-overlay{background:linear-gradient(to bottom, rgba(20,18,15,.5), rgba(20,18,15,0) 46%);}
/* Defensive: buttons default to inline-block in most browsers, and an
   inline-level box sitting alone inside a block parent leaves a sliver of
   baseline/line-height space around it. The hero photo is a <button> (for
   the lightbox), not a <figure> as before — make sure it always behaves
   like a plain block box regardless. */
.ml074-hero-photo{display:block;}

/* 2) The gallery and video/tour section headings ("Galería", "Recorre la
   casa", the video/tour eyebrows) are a .wrap directly inside
   .property-gallery / .property-media-section — the same selector that
   was zeroed out to let the PHOTOS and the video/tour frame run edge to
   edge. That zeroed the heading's side padding too, so the heading text
   sat flush against the browser edge along with the images, when only the
   media itself should. Photos/frame keep their full-bleed padding at 0;
   only the heading gets it back. */
.property-gallery>.wrap.property-section-head,
.property-media-section>.wrap.property-section-head{padding-left:clamp(22px,4.2vw,64px);padding-right:clamp(22px,4.2vw,64px);}
@media (max-width:760px){
  .property-gallery>.wrap.property-section-head,
  .property-media-section>.wrap.property-section-head{padding-left:20px;padding-right:20px;}
}

/* 3) Read More button reset — see the .ml076-desc-toggle-label rules above
   (now a <button>, was a <label for="checkbox">). */
.ml076-desc-toggle-label:focus-visible{outline:2px solid var(--rosa);outline-offset:2px;}

/* ---------- 0.7.25 · gallery caps at 9 photos, like the mockup ---------- */
/* Past the cap, the last visible tile gets a dimmed "+N fotos" overlay
   instead of the page just running out of photos — clicking it opens the
   same lightbox (left/right arrows and all), starting right where the
   visible grid left off. */
.property-gallery-full,
.property-gallery-pair figure,
.property-gallery-vertical figure{position:relative;}
.ml08-gallery-more{position:absolute;inset:0;z-index:2;border:0;margin:0;padding:0;cursor:pointer;background:rgba(20,18,15,.5);display:flex;align-items:center;justify-content:center;-webkit-appearance:none;appearance:none;}
.ml08-gallery-more span{font:400 calc(var(--ml-heading-scale,1) * clamp(22px,2.6vw,30px))/1.2 var(--display,'Newsreader',Georgia,serif);color:#fff;letter-spacing:-.01em;}
.ml08-gallery-more:hover{background:rgba(20,18,15,.62);}
.ml08-gallery-more:focus-visible{outline:2px solid #fff;outline-offset:-4px;}

/* ---------- 0.7.26 · two more reported bugs ---------- */

/* 1) "View all N photos" landed on top of the header nav, behind its links,
   unclickable. .ml08-hero-overlay is a column flex with
   justify-content:space-between, which only pushes the status pill to the
   top and this button to the bottom when BOTH are in the flow — a listing
   with no status badge leaves the button as the overlay's only child, and
   space-between has nothing to space it from, so it sits at the flex
   start (the top) instead. margin-top:auto pins it to the bottom
   regardless of whether the status pill exists. */
.ml08-hero-overlay .ml08-viewall{margin-top:auto;}

/* 2) The lightbox's own close button/photo count bar sits right at the top
   of the fixed-position lightbox — same spot the WordPress admin bar
   occupies for a logged-in editor. The admin bar's z-index is far higher,
   so it visually buried the close button and the arrows were the only
   thing left reachable — no way back out. Same admin-bar offset already
   used for the transparent header, applied to the lightbox. */
.admin-bar .ml08-lb{top:32px;}
@media (max-width:782px){.admin-bar .ml08-lb{top:46px;}}

/* =====================================================================
   0.7.42 · "In Town" story template — David's mockup. Its own deliberate
   magazine identity (Playfair Display + Space Grotesk, a red accent)
   distinct from the rest of the site's Newsreader/DM Sans + rosa pairing
   — every rule below is scoped under .ml09-story so nothing here leaks
   into the rest of the theme, and nothing from the rest of the theme
   (generic tag resets aside) leaks in. Content comes from Story_Blocks
   (Core 0.4.13+): spreads (photo + sticky text-adjacent column), full-
   bleed photos, photo pairs, chapter-break subtitles, and a fixed
   closing block — see single-ml_story.php.
   ===================================================================== */
.ml09-story{
  /* 0.7.96 — was its own hardcoded rust red (#DA3B34), a separate accent
     from the rest of the site's brand pink. Jorge: the In Town category
     labels, kickers, "See all" link, card tags and the end-of-article dot
     should read as the same pink everywhere, not a different color just
     because it's an article page — so this now follows --rosa (the real
     brand pink, Personalizar → Mojiganga Living Colors), the same way
     everything else on the site already does. */
  --ml09-accent:var(--rosa);
  --ml09-ink-3:#8C8984;
  --ml09-serif:'Playfair Display', Georgia, serif;
  --ml09-sans:'Space Grotesk', system-ui, sans-serif;
  --ml09-gutter:clamp(16px, 4vw, 56px);
  background:#fff;color:var(--ink);font-family:var(--ml09-serif);
  /* overflow-x:hidden here (kept only as a fallback for very old browsers)
     would make .ml09-story itself the "nearest scrolling ancestor" for its
     position:sticky photos (.ml09-fig.ml09-sticky) instead of the real page
     — which is exactly what breaks them once you scroll past the point
     where they're supposed to stick, same root cause as .property-page
     below. overflow-x:clip prevents the same full-bleed-photo horizontal
     bleed without creating that scroll container. */
  overflow-x:hidden;overflow-x:clip;
}
.ml09-story figcaption{font-family:var(--ml09-sans);font-size:12px;line-height:1.55;color:var(--ml09-ink-3);margin-top:14px;display:flex;gap:14px;}
.ml09-story figcaption b{color:var(--ink);font-weight:500;white-space:nowrap;}
.ml09-story figure{margin:0;}

/* ---------- hero (split, photo | centered title) ---------- */
/* 0.7.84 — was height:calc(100vh - 93px);min-height:560px. The photo and
   text columns always match height (both are in the same grid row), so
   "make the left photo a bit taller" means making the whole hero band
   taller — 93px was oversubtracting against the site header's current
   real height (~65px after 0.7.81's header shrink), leaving a sliver of
   unused space below the hero before the title section even on a normal
   screen. Trimmed the offset and raised the floor a bit so the photo
   reads taller (David: "quiero que se vea un poco más larga esa imagen
   del lado izquierdo"). */
.ml09-hero{position:relative;display:grid;grid-template-columns:1fr 1fr;height:calc(100vh - 50px);min-height:620px;}
.ml09-hero-photo{position:relative;overflow:hidden;background:var(--ml07-soft,#e9e3da);}
.ml09-hero-photo img{display:block;width:100%;height:100%;object-fit:cover;}
.ml09-hero-side{position:relative;background:#fff;display:flex;align-items:center;justify-content:center;padding:0 clamp(24px,5vw,90px);}
.ml09-hero-head{text-align:center;max-width:560px;}
.ml09-hero-cat{font-family:var(--ml09-sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:22px;color:var(--ink);}
.ml09-hero-cat b{color:var(--ml09-accent);font-weight:500;}
.ml09-hero-head h1{font-weight:400;font-size:calc(var(--ml-heading-scale,1) * clamp(34px,3.6vw,56px));line-height:1.14;letter-spacing:-.01em;margin:0;}
/* 0.4.28/0.7.85 — optional photographer credit (Meta_Boxes "Photographer
   credit" box, Core — free-form text, David writes the whole line
   himself). Top position: a small, muted line right under the title,
   matching the mockup David/Jorge sent. */
.ml09-hero-credit{font-family:var(--ml09-serif);font-size:calc(var(--ml-body-scale,1) * clamp(14px,1.1vw,16px));line-height:1.5;color:var(--ml09-ink-3);margin:18px 0 0;}
.ml09-hero-credit a,.ml09-closing-credit a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;}
.ml09-hero-credit a:hover,.ml09-closing-credit a:hover{color:var(--ink);}
.ml09-scroll{position:absolute;right:clamp(16px,2vw,28px);bottom:clamp(24px,5vh,48px);writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:.2em;font-size:10px;font-family:var(--ml09-sans);color:var(--grey);}

/* ---------- title / dek / byline ---------- */
/* 0.7.61 — top padding was up to 170px on top of the full-height hero
   photo right above it (which already reaches the bottom of the
   viewport), so on a normal screen it read as a big blank gap between
   the photo and "AROUND — PARKS & PLACES" — the photo looked short
   even though it already filled the hero row. Shortened so the kicker
   sits much closer to the photo. */
.ml09-title{padding:clamp(28px,4vw,56px) var(--ml09-gutter) clamp(60px,8vw,110px);text-align:center;max-width:1100px;margin:0 auto;}
.ml09-kicker{font-family:var(--ml09-sans);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ml09-accent);margin-bottom:28px;}
.ml09-dek{font-style:italic;font-size:calc(var(--ml-heading-scale,1) * clamp(19px,1.9vw,26px));line-height:1.45;color:var(--grey);max-width:760px;margin:0 auto;font-family:var(--ml09-serif);}
.ml09-byline{margin-top:40px;display:flex;justify-content:center;flex-wrap:wrap;gap:10px 28px;font-family:var(--ml09-sans);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ml09-ink-3);}

/* ---------- spreads (photo + text, alternating sides, sticky photo) ---------- */
.ml09-spread{
  display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(16px,2.4vw,40px);
  padding:0 var(--ml09-gutter);margin:0 auto clamp(90px,11vw,160px);max-width:1480px;align-items:start;
}
/* Force both items onto row 1 explicitly. Without this, CSS Grid's
   auto-placement cursor (which only ever moves forward through a row,
   never back to fill an earlier column range) works fine for the
   "right" variant — text is DOM-first at columns 2-6, so the cursor is
   past column 6 when it places the photo at columns 8-12, which is
   still ahead of it. For "left", the photo is DOM-second but wants
   columns 1-5, which are BEHIND where the cursor ended up after
   placing the DOM-first text at columns 7-11 — so the browser bumps it
   to row 2 instead, dropping it below the text entirely. Pinning both
   to grid-row:1 makes the layout immune to DOM order either way. */
.ml09-spread .ml09-text,.ml09-spread .ml09-fig{grid-row:1;}
.ml09-spread[data-side="right"] .ml09-text{grid-column:2 / span 5;}
.ml09-spread[data-side="right"] .ml09-fig{grid-column:8 / span 5;}
.ml09-spread[data-side="left"] .ml09-fig{grid-column:1 / span 5;}
.ml09-spread[data-side="left"] .ml09-text{grid-column:7 / span 5;}
/* 0.8.3 first try — this is the single side photo next to a text/pull-
   quote column in an In Town article (David saw one of these cropping
   into a person mid-frame: "necesito que en estas fotos se vean
   completas, sin recortarlas"). Kept the fixed aspect-ratio:4/5 box and
   just swapped object-fit:cover for contain, so the box stayed the same
   shape and the photo shrank to fit inside it — which looks fine only
   when the photo's own ratio happens to be close to 4/5. David's photo
   here is 1707×2560 (≈2/3, noticeably taller/narrower than 4/5), so the
   box ended up with big flat bars of background color above and below
   the actual photo (David: "no mames, ve como lo dejaste" — then "lo
   mismo en todas las otras", since every photo that isn't already ~4/5
   gets the same bars). 0.8.4 drops the fixed box entirely instead: no
   aspect-ratio here anymore, so the frame's shape just follows whatever
   shape the photo actually is (object-fit:contain is now redundant but
   harmless — it's keeping it in case a future photo is wider than its
   column, which would otherwise overflow). No crop, no bars, exact fit.
   The box's own height no longer being fixed to 4/5 is fine for the
   sticky scroll effect — it was never guaranteed to be 4/5 either, a
   photo's real height here always depended on its real aspect ratio.
   Scoped to .ml09-fig only — .ml09-bleed (full-width dramatic photo)
   and .ml09-card (related-story thumbnail grid) still crop to a fixed
   shape on purpose, for different reasons, so they're untouched. */
.ml09-fig .ml09-frame{overflow:hidden;background:var(--ml07-soft,#e9e5de);}
.ml09-fig .ml09-frame img{display:block;width:100%;height:auto;object-fit:contain;filter:saturate(.85);}
.ml09-fig.ml09-sticky{position:sticky;top:116px;}
.admin-bar .ml09-fig.ml09-sticky{top:148px;}

.ml09-text p{font-size:calc(var(--ml-body-scale,1) * clamp(17px,1.28vw,19.5px));line-height:1.78;color:#262523;margin-bottom:1.25em;hyphens:auto;}
.ml09-text-first > p:first-child::first-letter{
  float:left;font-weight:700;font-size:5.4em;line-height:.8;margin:.06em .1em 0 0;color:var(--ink);
}
.ml09-text-first > p:first-child{font-size:calc(var(--ml-body-scale,1) * clamp(19px,1.5vw,22px));line-height:1.66;}
.ml09-text h3{font-family:var(--ml09-sans);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin:0 0 1.2em;}
.ml09-pull{
  /* 0.7.96 — the line above each pull quote removed per Jorge; the other
     border-top dividers further down the template (above the practical-
     info list, the photographer credit, and "Sigue en In Town") are
     DELIBERATELY left alone — David was explicit that only this one goes.
     0.8.0 — once that border was gone, the 26px padding-top it used to
     justify plus the 2em margin-top above it was just dead air stacked on
     dead air (David: "arriba de los quotes... siento que hay mucho
     espacio"). Cut both down instead of removing them outright, so the
     quote still reads as its own paragraph with a bit of breathing room —
     just not a half-empty one. */
  font-style:italic;font-size:calc(var(--ml-heading-scale,1) * clamp(26px,2.6vw,38px));line-height:1.22;letter-spacing:-.01em;
  padding-top:6px;margin:1em 0 1.6em;color:var(--ink);font-family:var(--ml09-serif);
}

/* ---------- full-bleed photo ---------- */
/* .ml09-story figure{margin:0;} above (the generic figure-margin reset)
   has HIGHER specificity than a bare ".ml09-bleed" (class+element beats
   a single class), so it was silently winning and cancelling this
   margin-bottom out entirely — the gap below a full-bleed photo was
   never actually rendering, at any value. Scoping this selector the same
   way (".ml09-story figure.ml09-bleed") gives it equal-or-greater
   specificity so it isn't overridden by that reset. Only ml09-bleed is
   affected by this since it's the only block type that's an actual
   <figure> element with its own margin-bottom to defend. */
.ml09-story figure.ml09-bleed{margin:0 0 clamp(130px,14vw,220px);}
/* 0.8.4 — same request as .ml09-fig below, extended to every photo type
   in an In Town article (David: "revisa TODO... no quiero que se vea
   culero"). This was a fixed height (clamp(320px,62vw,92vh)) with
   object-fit:cover, cropping top/bottom off anything that wasn't close
   to that exact shape. Dropped the fixed height — the photo now shows
   at its own real proportions, full width, no crop. The one real
   trade-off: a tall/portrait photo dropped into this full-bleed slot
   will now make a tall block (there's no way to show 100% of a photo
   AND force it into a fixed height without either cropping or bars —
   David's said no to both). This slot reads best with a wide/landscape
   shot, same guidance as the property hero photo. */
.ml09-bleed .ml09-frame{overflow:hidden;background:var(--ml07-soft,#d9d3c8);}
.ml09-bleed .ml09-frame img{display:block;width:100%;height:auto;filter:saturate(.85);}
.ml09-bleed figcaption{padding:0 var(--ml09-gutter);max-width:1480px;margin:14px auto 0;}

/* ---------- closing text + practical info ---------- */
.ml09-closing{max-width:700px;margin:0 auto clamp(90px,11vw,150px);padding:0 var(--ml09-gutter);}
/* 0.7.59 — that bottom margin (up to 150px) was sized to also absorb
   .ml09-next's own top margin above it (clamp(100px,12vw,170px)), so the
   two merged into one balanced gap before "More from In Town"'s heading
   and its border-top divider. Since 0.7.58, .ml09-next simply doesn't
   render when the article's topic has no other stories yet — and this
   same generous margin was left dangling on its own with nothing to
   break it up before the footer, reading as a big blank wall. Tighten it
   (and the equivalent related-listing CTA case) specifically when it's
   the article's last element. */
.ml09-story>.ml09-closing:last-child,.ml09-story>.article-cta:last-child{margin-bottom:clamp(48px,6vw,80px);}
.ml09-closing p{font-size:calc(var(--ml-body-scale,1) * clamp(17px,1.28vw,19.5px));line-height:1.78;color:#262523;margin-bottom:1.25em;hyphens:auto;}
.ml09-end{display:inline-block;width:.55em;height:.55em;background:var(--ml09-accent);margin-left:.35em;vertical-align:baseline;}
/* 0.4.28/0.7.85 — optional photographer credit (Meta_Boxes "Photographer
   credit" box, Core — free-form text, David writes the whole line
   himself), bottom position: a closing line after the practical-info list
   (or right after the closing paragraphs when there's no info list). */
.ml09-closing-credit{font-family:var(--ml09-sans);font-size:12px;letter-spacing:.04em;color:var(--ml09-ink-3);margin-top:28px;padding-top:20px;border-top:1px solid var(--ml07-line);}
.ml09-info{
  margin-top:56px;border-top:1px solid var(--ink);padding-top:22px;
  display:grid;grid-template-columns:1fr 1fr;gap:18px 28px;font-family:var(--ml09-sans);font-size:13px;line-height:1.5;
}
.ml09-info dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ml09-ink-3);margin-bottom:4px;}
.ml09-info dd{margin:0;color:var(--ink);}

/* ---------- photo pair ---------- */
.ml09-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,1.2vw,16px);padding:0 var(--ml09-gutter);max-width:1480px;margin:0 auto clamp(90px,11vw,160px);align-items:start;}
/* 0.8.4 — same as .ml09-bleed/.ml09-fig above: dropped the fixed
   aspect-ratio (was 4/5, or 3/2 for the horizontal variant) and the
   object-fit:cover that cropped to fill it, so each photo in the pair
   shows complete, at its own real shape. align-items:start added to
   .ml09-pair above so if the two photos aren't the same shape, they sit
   side by side from the same top edge instead of being stretched to
   match each other's height — two different photos next to each other
   just won't always be the same height once neither is cropped. */
.ml09-pair .ml09-frame{overflow:hidden;background:var(--ml07-soft,#e9e5de);}
.ml09-pair .ml09-frame img{display:block;width:100%;height:auto;filter:saturate(.85);}

/* ---------- subtitle (mid-article chapter break) ---------- */
.ml09-subtitle{text-align:center;max-width:820px;margin:clamp(100px,12vw,170px) auto clamp(50px,6vw,80px);padding:0 var(--ml09-gutter);}
.ml09-subtitle h2{font-weight:400;font-size:calc(var(--ml-heading-scale,1) * clamp(36px,5vw,76px));line-height:1.02;letter-spacing:-.02em;margin:0;font-family:var(--ml09-serif);}
.ml09-subtitle h2 em{font-style:italic;}
.ml09-subtitle p{font-style:italic;font-size:calc(var(--ml-heading-scale,1) * clamp(18px,1.6vw,22px));line-height:1.5;color:var(--grey);margin-top:22px;font-family:var(--ml09-serif);}

/* 0.4.51/0.8.34 — standalone "Quote" block. David had been using the
   Chapter break ("subtitle") type to drop in quotes, but that type's
   heading is sized for a section title (up to 76px) — too big for a
   quote. Deliberately sized closer to the inline pull-quote used inside
   a Spread's text column (.ml09-pull, clamp(26px,2.6vw,38px)) rather
   than the chapter-break heading. */
.ml09-quote{text-align:center;max-width:760px;margin:clamp(70px,9vw,120px) auto;padding:0 var(--ml09-gutter);}
.ml09-quote blockquote{font-style:italic;font-weight:400;font-size:calc(var(--ml-heading-scale,1) * clamp(24px,2.8vw,38px));line-height:1.3;letter-spacing:-.01em;color:var(--ink);margin:0;font-family:var(--ml09-serif);}
.ml09-quote cite{display:block;font-style:normal;font-family:var(--ml09-sans);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ml09-ink-3,var(--grey));margin-top:18px;}

/* ---------- "Sigue en In Town" related cards ---------- */
.ml09-next{max-width:1480px;margin:clamp(100px,12vw,170px) auto 0;padding:0 var(--ml09-gutter) clamp(90px,11vw,140px);}
.ml09-next-head{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--ink);padding-top:18px;margin-bottom:28px;font-family:var(--ml09-sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;}
.ml09-next-head a{color:var(--ml09-accent);}
.ml09-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,32px);}
.ml09-card{display:block;color:inherit;text-decoration:none;}
.ml09-card .ml09-frame{aspect-ratio:4/5;background:var(--surface-2,#ECE8E1);overflow:hidden;}
.ml09-card .ml09-frame img{display:block;width:100%;height:100%;object-fit:cover;}
.ml09-tag{font-family:var(--ml09-sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ml09-accent);margin:16px 0 8px;}
.ml09-card h4{font-weight:400;font-size:calc(var(--ml-heading-scale,1) * clamp(20px,1.7vw,26px));line-height:1.2;margin:0;font-family:var(--ml09-serif);}

@media (max-width:900px){
  .ml09-hero{grid-template-columns:1fr;grid-template-rows:62% 38%;height:calc(100svh - 93px);}
  .ml09-scroll{display:none;}
  .ml09-spread{display:block;}
  .ml09-spread .ml09-fig{margin:0 0 40px;}
  .ml09-spread[data-side="right"]{display:flex;flex-direction:column;}
  .ml09-spread[data-side="right"] .ml09-fig{order:-1;}
  .ml09-spread[data-side="left"]{display:flex;flex-direction:column;}
  .ml09-spread[data-side="left"] .ml09-fig{order:-1;}
  .ml09-fig.ml09-sticky{position:static;}
  .ml09-pair{grid-template-columns:1fr;}
  .ml09-cards{grid-template-columns:1fr;}
  .ml09-info{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:reduce){.ml09-fig.ml09-sticky{position:static;}}

/* ===========================================================
   Sell With Us — theme/page-sell-with-us.php
   All content is editable in the admin (Page_Fields); this is
   purely layout/visuals, built from the site's own tokens
   (--rosa/--ink/--grey/--ml07-line/--ml07-soft, --display/
   --type-body) rather than the client mockup's own styling.
   =========================================================== */
.ml-sell-eyebrow{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--rosa);display:block;margin-bottom:14px;}
/* 0.8.25 — the Portrait section's kicker (.ml-sell-portrait-copy above) is
   now an <a>, not a plain <span> (it links to Before You). text-decoration
   reset keeps it looking exactly the same as every other .ml-sell-eyebrow
   on this page — no underline — and this is harmless on the ones that are
   still plain <span>s, which never show an underline anyway. */
.ml-sell-eyebrow{text-decoration:none;}
.ml-sell-text-link{display:inline-flex;align-items:center;gap:8px;font:600 13px/1 var(--type-body,'DM Sans',sans-serif);letter-spacing:.02em;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;white-space:nowrap;}
.ml-sell-photo-placeholder{width:100%;height:100%;background:var(--ml07-soft);}

.ml-sell-hero{padding:clamp(60px,8vw,110px) 0 clamp(50px,6vw,80px);border-bottom:1px solid var(--ml07-line);}
.ml-sell-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,6vw,90px);align-items:start;}
.ml-sell-hero-title{font-family:var(--display,'Newsreader',Georgia,serif);font-weight:400;font-size:clamp(40px,5.6vw,72px);line-height:1.04;letter-spacing:-.04em;margin:0 0 22px;}
.ml-sell-hero-title em{font-style:italic;color:var(--ink);}
.ml-sell-hero-lead{font-size:16px;line-height:1.7;color:var(--grey);max-width:46ch;margin:0 0 30px;}
.ml-sell-hero-ctas{display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.ml-sell-hero-photo{margin:0;}
.ml-sell-hero-photo .ml-sell-photo-frame{aspect-ratio:4/5;overflow:hidden;background:var(--ml07-soft);}
.ml-sell-hero-photo img{display:block;width:100%;height:100%;object-fit:cover;}
.ml-sell-hero-photo .ml-sell-photo-placeholder{width:100%;height:100%;}
.ml-sell-hero-photo figcaption{font-size:11.5px;color:var(--grey);padding-top:10px;}

.ml-sell-statement{padding:clamp(60px,7vw,96px) 0;border-top:1px solid var(--ml07-line);border-bottom:1px solid var(--ml07-line);}
.ml-sell-statement-inner{max-width:760px;margin:0 auto;text-align:center;}
.ml-sell-statement-inner .ml-sell-eyebrow{color:var(--grey);margin-bottom:20px;}
.ml-sell-statement-text{font-family:var(--display,'Newsreader',Georgia,serif);font-style:italic;font-weight:400;font-size:clamp(26px,3.2vw,40px);line-height:1.35;letter-spacing:-.015em;margin:0;}

.ml-sell-process{padding:clamp(70px,8vw,110px) 0;}
.ml-sell-section-head{max-width:720px;margin-bottom:clamp(36px,5vw,60px);}
.ml-sell-section-head h2{font-family:var(--display,'Newsreader',Georgia,serif);font-weight:400;font-size:clamp(34px,4.4vw,56px);letter-spacing:-.03em;margin:10px 0 16px;}
.ml-sell-section-head p{color:var(--grey);font-size:15px;line-height:1.7;margin:0;}
.ml-sell-section-head-split{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,4vw,60px);align-items:end;max-width:none;}
.ml-sell-section-head-split h2{margin-bottom:0;}
.ml-sell-section-head-aside{max-width:34ch;}
.ml-sell-process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3vw,40px);margin-top:34px;}
.ml-sell-process-step{border-top:1px solid var(--ml07-line);padding-top:16px;}
.ml-sell-step-num{display:block;font:600 12px/1 var(--type-body,'DM Sans',sans-serif);color:var(--rosa);letter-spacing:.06em;margin-bottom:12px;}
.ml-sell-process-step h3{font-family:var(--display,'Newsreader',Georgia,serif);font-weight:400;font-size:21px;margin:0 0 10px;}
.ml-sell-process-step p{font-size:14px;line-height:1.65;color:var(--grey);margin:0;}
.ml-sell-process-aside{margin-top:40px;font-style:italic;color:var(--ink);font-size:15px;}

.ml-sell-portrait{padding:clamp(70px,8vw,110px) 0;background:var(--ml07-soft);border-top:1px solid var(--ml07-line);border-bottom:1px solid var(--ml07-line);}
.ml-sell-portrait-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,5vw,70px);align-items:center;}
.ml-sell-portrait-photo{margin:0;}
.ml-sell-portrait-photo .ml-sell-photo-frame{aspect-ratio:4/4.7;overflow:hidden;background:var(--ml07-paper);}
.ml-sell-portrait-photo img{display:block;width:100%;height:100%;object-fit:cover;}
.ml-sell-portrait-photo .ml-sell-photo-placeholder{width:100%;height:100%;}
.ml-sell-portrait-photo figcaption{font-size:11.5px;color:var(--grey);padding-top:10px;}
.ml-sell-portrait-copy blockquote{font-family:var(--display,'Newsreader',Georgia,serif);font-style:italic;font-weight:400;font-size:clamp(24px,2.8vw,36px);line-height:1.3;letter-spacing:-.02em;margin:0 0 20px;}
.ml-sell-portrait-line{font-size:14px;color:var(--grey);margin:0 0 16px;}

.ml-sell-why{padding:clamp(70px,8vw,110px) 0;}
.ml-sell-why-grid{display:grid;grid-template-columns:.65fr 1.35fr;gap:clamp(24px,5vw,70px);align-items:start;}
.ml-sell-why-head h2{font-family:var(--display,'Newsreader',Georgia,serif);font-weight:400;font-size:clamp(32px,3.6vw,46px);letter-spacing:-.03em;margin:10px 0 0;}
/* 0.8.31 — subtitle under "One house, one voice." (David/Jorge's new
   editable "Sell With Us" subtitle field), styled like the other small
   intro paragraphs on this page (e.g. the hero lead). */
.ml-sell-why-intro{font-size:15px;line-height:1.7;color:var(--grey);max-width:34ch;margin:16px 0 0;}
.ml-sell-why-list{border-top:1px solid var(--ml07-line);}
.ml-sell-why-item{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;border-bottom:1px solid var(--ml07-line);padding:22px 0;}
.ml-sell-why-item h3{font-family:var(--type-body,'DM Sans',sans-serif);font-weight:700;font-size:16px;letter-spacing:-.01em;margin:0;}
.ml-sell-why-item p{font-size:14px;line-height:1.65;color:var(--grey);margin:0;}

.ml-sell-faq{padding:clamp(70px,8vw,110px) 0;background:var(--ml07-soft);}
.ml-sell-faq>.wrap>.ml-sell-eyebrow{margin-bottom:22px;}
.ml-sell-faq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,40px);}
.ml-sell-faq-item h3{font-family:var(--type-body,'DM Sans',sans-serif);font-weight:700;font-size:16px;letter-spacing:-.01em;margin:0 0 10px;}
.ml-sell-faq-item p{font-size:13.5px;line-height:1.65;color:var(--grey);margin:0;}

.ml-sell-contact{padding:clamp(70px,8vw,110px) 0;}
.ml-sell-contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,6vw,90px);align-items:start;}
.ml-sell-contact-copy h2{font-family:var(--display,'Newsreader',Georgia,serif);font-weight:400;font-size:clamp(32px,4vw,50px);letter-spacing:-.03em;margin:10px 0 16px;}
.ml-sell-contact-copy p{color:var(--grey);font-size:15px;line-height:1.7;margin:0 0 30px;}
.ml-sell-advisor{display:flex;gap:16px;align-items:flex-start;padding-top:26px;border-top:1px solid var(--ml07-line);}
.ml-sell-advisor img{width:64px;height:64px;border-radius:2px;object-fit:cover;flex:none;background:var(--ml07-soft);}
.ml-sell-advisor strong{display:block;font-family:var(--display,'Newsreader',Georgia,serif);font-size:17px;font-weight:400;}
.ml-sell-advisor span{display:block;font-size:12.5px;color:var(--grey);margin-top:2px;}
.ml-sell-advisor-note{font-size:13.5px;color:var(--ink);font-style:italic;margin:10px 0 0;}
.ml-sell-advisor-links{display:flex;gap:20px;margin-top:20px;flex-wrap:wrap;}
.ml-sell-contact-form-wrap .ml-contact-form{max-width:none;margin:0;}
.ml-sell-form-row{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;}
.ml-sell-form-row p{margin-top:18px;}
.ml-sell-form-submit{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:28px;}
.ml-sell-form-submit .btn{width:auto;margin:0;justify-content:center;}
.ml-sell-form-note{font-size:12px;color:var(--grey);margin:0;}
.ml-sell-form-optional-label{display:block;font-size:11px;color:var(--grey);text-transform:none;letter-spacing:0;font-weight:400;margin-top:2px;}

.ml-sell-stage{border:0;padding:0;margin:18px 0 0;}
.ml-sell-stage legend{font-size:13px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--grey);margin-bottom:10px;padding:0;}
.ml-sell-stage-pills{display:flex;gap:10px;flex-wrap:wrap;}
/* Two classes here beats the base ".ml-contact-form button{width:100%}" rule's
   class+element specificity — without this the pills render full-width. */
.ml-sell-stage-pills .ml-sell-stage-btn{width:auto;margin:0;border:1px solid var(--line);background:transparent;color:var(--ink);font:500 12.5px/1 var(--type-body,'DM Sans',sans-serif);padding:10px 16px;border-radius:99px;cursor:pointer;transition:.15s ease;}
.ml-sell-stage-pills .ml-sell-stage-btn[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink);}

/* Bring this form's own look closer to the approved mockup — sentence-case
   labels and a boxed (not underlined) textarea, overriding the generic
   .ml-contact-form conventions used by the plain Contact-page form. */
.ml-sell-form label{text-transform:none;font-weight:500;font-size:13px;letter-spacing:0;color:var(--grey);}
.ml-sell-form textarea{border:1px solid var(--line) !important;padding:14px !important;min-height:140px;background:var(--paper);}
.ml-sell-form input{padding:8px 2px !important;}

.ml-sell-thanks{text-align:center;max-width:480px;margin:0 auto;padding:40px 0;}
.ml-sell-thanks h3{font-family:var(--display,'Newsreader',Georgia,serif);font-weight:400;font-size:28px;margin:0 0 12px;}
.ml-sell-thanks p{color:var(--grey);margin:0 0 20px;}
.ml-sell-back{font:600 13px/1 var(--type-body,'DM Sans',sans-serif);color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;}
.ml-sell-form-note{font-size:12px;color:var(--grey);margin-top:14px;text-align:center;}

@media (max-width:900px){
  .ml-sell-hero-grid{grid-template-columns:1fr;gap:36px;}
  .ml-sell-hero-photo{order:-1;}
  .ml-sell-hero-photo .ml-sell-photo-frame{aspect-ratio:16/10;}
  .ml-sell-process-grid{grid-template-columns:repeat(2,1fr);}
  .ml-sell-section-head-split{grid-template-columns:1fr;align-items:start;gap:16px;}
  .ml-sell-portrait-grid{grid-template-columns:1fr;gap:28px;}
  .ml-sell-portrait-photo .ml-sell-photo-frame{aspect-ratio:16/10;}
  .ml-sell-why-grid{grid-template-columns:1fr;gap:18px;}
  .ml-sell-why-item{grid-template-columns:1fr;gap:6px;}
  .ml-sell-faq-grid{grid-template-columns:1fr;}
  .ml-sell-contact-grid{grid-template-columns:1fr;gap:40px;}
  .ml-sell-form-row{grid-template-columns:1fr !important;}
}
@media (max-width:560px){
  .ml-sell-process-grid{grid-template-columns:1fr;}
}