/* ===== MISSION HILLS: the flagship guide =====
   Eucalyptus green, jacaranda purple (the street trees that bloom every
   spring), heritage serif display (Fraunces at high optical size), Archivo
   for reading. One loud moment: the hero name over the film, with a live
   line under it. Everything else is quiet and editorial. */
.mhx{ --mh-ink:#1D3A32; --mh-jac:#7B5EA7; --mh-jac-2:#CDBFE6; --mh-sage:#EDF1EC; --mh-gold:#B08D2E; --mh-line:rgba(29,58,50,.16); --mh-soft:#4D5F58; color:var(--mh-ink); }
@media (prefers-color-scheme: dark){ .mhx{ --mh-ink:#E4ECE7; --mh-sage:#131C19; --mh-line:rgba(228,236,231,.16); --mh-soft:#AFC0B8; --mh-jac:#B79BE0; } }
.mhx section{ padding:clamp(64px,9vw,112px) 0; }
.mhx h2{ font-family:'Fraunces',Georgia,serif; font-weight:400; font-variation-settings:'opsz' 144; font-size:clamp(36px,5vw,64px); line-height:1.02; letter-spacing:-.02em; color:inherit; max-width:18ch; }
.mhx h3{ color:inherit; }
.mhx .mhx-sub{ font-size:17px; line-height:1.6; color:var(--mh-soft); max-width:60ch; margin-top:16px; }
.mhx .mhx-fine{ margin-top:22px; font-size:12.5px; color:var(--mh-soft); max-width:80ch; }
.mhx .mhx-fine a{ text-decoration:underline; }
.mhx a:focus-visible,.mhx button:focus-visible{ outline:2px solid var(--mh-jac); outline-offset:3px; }

/* hero */
.mhx-hero{ position:relative; min-height:96vh; display:flex; align-items:flex-end; overflow:hidden; background:#10221D; color:#fff; padding:0 !important; }
.mhx-hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center; }
.mhx-hero-bg video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
@media (prefers-reduced-motion:reduce){ .mhx-hero-bg video{ display:none; } }
.mhx-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,26,22,.2) 0%,rgba(12,26,22,0) 30%,rgba(12,26,22,.6) 68%,rgba(10,22,18,.94) 100%); }
.mhx-hero .wrap{ position:relative; z-index:2; width:100%; padding-top:120px; padding-bottom:64px; }
.mhx-est{ font-size:14px; color:#CFE0D8; letter-spacing:.02em; }
.mhx-hero h1{ color:#fff; font-family:'Fraunces',Georgia,serif; font-weight:340; font-variation-settings:'opsz' 144; font-size:clamp(58px,15vw,220px); line-height:.86; letter-spacing:-.035em; margin-top:10px; }
.mhx-lede{ color:#E3ECE8; font-size:clamp(17px,1.6vw,20px); line-height:1.55; max-width:56ch; margin-top:24px; }
.mhx-now{ margin-top:18px; font-family:'Fraunces',Georgia,serif; font-style:italic; font-size:18px; color:var(--mh-jac-2); min-height:1.4em; }
.mhx-acts{ display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; }
.mhx-btn{ display:inline-flex; align-items:center; font-weight:600; font-size:15px; padding:14px 22px; border-radius:999px; border:1.5px solid transparent; }
.mhx-btn.solid{ background:#fff; color:#1D3A32; }
.mhx-btn.ghost{ border-color:rgba(255,255,255,.5); color:#fff; }
.mhx-btn.ghost:hover{ border-color:#fff; }

/* live strip */
.mhx-strip{ background:#10221D; color:#E4ECE7; padding:0 0 34px !important; border-top:1px solid rgba(205,191,230,.25); }
.mhx-tiles{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); border-bottom:1px solid rgba(228,236,231,.14); }
.mhx-tile{ padding:22px 18px 20px 0; }
.mhx-tile + .mhx-tile{ padding-left:18px; border-left:1px solid rgba(228,236,231,.14); }
.mhx-tile .k{ font-size:12.5px; color:#9DB3AA; }
.mhx-tile .v{ font-family:'Fraunces',Georgia,serif; font-size:30px; line-height:1.1; margin-top:8px; color:#fff; font-variant-numeric:tabular-nums; }
.mhx-tile .v.sm{ font-size:19px; line-height:1.25; }
.mhx-tile.feature .v{ color:var(--mh-jac-2); }
.mhx-tile .s{ font-size:13px; color:#B8C9C1; margin-top:6px; line-height:1.4; }
.mhx-tile .s a{ text-decoration:underline; color:#E4ECE7; }
.mhx-strip-note{ font-size:12px; color:#7F978D; margin-top:14px; }
@media (max-width:1100px){ .mhx-tiles{ grid-template-columns:repeat(3,minmax(0,1fr)); } .mhx-tile:nth-child(4){ padding-left:0; border-left:0; } .mhx-tile:nth-child(n+4){ border-top:1px solid rgba(228,236,231,.14); } }
@media (max-width:640px){ .mhx-tiles{ grid-template-columns:repeat(2,minmax(0,1fr)); } .mhx-tile:nth-child(odd){ padding-left:0; border-left:0; } .mhx-tile:nth-child(4){ padding-left:18px; border-left:1px solid rgba(228,236,231,.14); } .mhx-tile:nth-child(n+3){ border-top:1px solid rgba(228,236,231,.14); } }

/* intro */
.mhx-intro-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:28px 64px; align-items:start; }
.mhx-intro p{ font-family:'Fraunces',Georgia,serif; font-size:clamp(18px,1.6vw,21px); line-height:1.65; color:var(--mh-soft); max-width:58ch; }
.mhx-intro p + p{ margin-top:16px; }
.mhx-band{ margin-top:48px; border-radius:6px; overflow:hidden; aspect-ratio:21/8; }
.mhx-band.slim{ aspect-ratio:21/6; margin:28px 0 8px; }
.mhx-band img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:860px){ .mhx-intro-grid{ grid-template-columns:1fr; } .mhx-band{ aspect-ratio:3/2; } }

/* districts + map */
.mhx-districts{ background:var(--mh-sage); }
.mhx-dgrid{ display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.3fr); gap:32px; margin-top:40px; align-items:start; }
.mhx-dlist{ border-top:1.5px solid var(--mh-ink); }
.mhx-d{ display:block; width:100%; text-align:left; background:none; border:0; border-bottom:1px solid var(--mh-line); padding:18px 0; cursor:pointer; color:inherit; font:inherit; }
.mhx-d .w{ display:block; font-size:12.5px; color:var(--mh-jac); font-weight:600; }
.mhx-d b{ display:block; font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:24px; line-height:1.15; margin-top:4px; }
.mhx-d .s{ display:block; font-size:14px; color:var(--mh-soft); margin-top:4px; }
.mhx-d .t{ display:none; font-size:15px; line-height:1.6; margin-top:10px; color:var(--mh-ink); max-width:56ch; }
.mhx-d[aria-selected="true"] .t{ display:block; }
.mhx-d[aria-selected="true"] b{ font-style:italic; }
.mhx-d[aria-selected="true"]{ box-shadow:inset 3px 0 0 var(--mh-jac); padding-left:16px; }
.mhx-arch{ padding:18px 0 0; }
.mhx-arch h3{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:20px; }
.mhx-arch p{ font-size:14.5px; line-height:1.6; color:var(--mh-soft); margin-top:6px; }
.mhx-map{ height:clamp(380px,46vw,600px); border-radius:6px; overflow:hidden; position:sticky; top:84px; z-index:1; border:1px solid var(--mh-line); }
.mhx-legend{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.mhx-legend button{ display:inline-flex; align-items:center; gap:8px; font:600 13.5px 'Archivo',sans-serif; padding:8px 14px; border-radius:999px; border:1.5px solid var(--mh-ink); background:transparent; color:var(--mh-ink); cursor:pointer; }
.mhx-legend button[aria-pressed="false"]{ opacity:.45; }
.mhx-legend .sw{ width:10px; height:10px; border-radius:50%; display:inline-block; }
.mhx-legend .sw.sales{ background:#1D3A32; box-shadow:0 0 0 2px #fff; }
.mhx-legend .sw.dist{ background:rgba(176,141,46,.35); border:1px solid #B08D2E; }
.mhx-legend .sw.perm{ background:#7B5EA7; }
.mh-area-label{ background:transparent; border:0; box-shadow:none; font:600 11px 'Archivo',sans-serif; color:#1D3A32; text-shadow:0 0 3px #fff,0 0 3px #fff; }
@media (max-width:900px){ .mhx-dgrid{ grid-template-columns:1fr; } .mhx-map{ position:relative; top:auto; } .mhx-dgrid > div:last-child{ order:-1; } }

/* timeline */
.mhx-tl{ list-style:none; padding:0; margin:40px 0 0; display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:0; border-top:1.5px solid var(--mh-ink); }
.mhx-tl li{ padding:22px 22px 24px 0; border-bottom:1px solid var(--mh-line); }
.mhx-tl .y{ font-family:'Fraunces',Georgia,serif; font-variation-settings:'opsz' 144; font-weight:340; font-size:46px; line-height:1; color:var(--mh-jac); letter-spacing:-.02em; }
.mhx-tl h3{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:19px; margin-top:10px; }
.mhx-tl p{ font-size:14.5px; line-height:1.55; color:var(--mh-soft); margin-top:6px; }
.mhx-tl li:last-child .y{ font-style:italic; color:var(--mh-ink); }

/* changing */
.mhx-changing{ background:var(--mh-sage); }
.mhx-live{ margin-top:36px; background:#10221D; color:#E4ECE7; border-radius:8px; padding:clamp(22px,3vw,34px); }
.mhx-live-head{ display:flex; align-items:center; gap:10px; font-size:14px; color:#B8C9C1; }
.mhx-dot{ width:9px; height:9px; border-radius:50%; background:var(--mh-jac-2); flex:0 0 auto; }
.mhx-counts{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); margin-top:18px; border-top:1px solid rgba(228,236,231,.16); }
.mhx-counts div{ padding:16px 12px 6px 0; }
.mhx-counts b{ display:block; font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:44px; line-height:1; color:#fff; }
.mhx-counts span{ display:block; font-size:13px; color:#9DB3AA; margin-top:6px; }
.mhx-recent{ margin-top:22px; }
.mhx-recent h3{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:20px; color:#fff; }
.mhx-recent ul{ list-style:none; padding:0; margin:10px 0 0; }
.mhx-recent li{ display:grid; grid-template-columns:64px 120px minmax(0,1fr) auto; gap:12px; padding:10px 0; border-top:1px solid rgba(228,236,231,.12); font-size:14.5px; }
.mhx-recent .d{ color:#9DB3AA; } .mhx-recent .k{ color:var(--mh-jac-2); font-weight:600; } .mhx-recent .v{ color:#B8C9C1; font-variant-numeric:tabular-nums; }
.mhx-src{ margin-top:16px; font-size:12px; color:#7F978D; }
.mhx-reads{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 32px; margin-top:40px; border-top:1.5px solid var(--mh-ink); }
.mhx-read{ padding:20px 0 22px; border-bottom:1px solid var(--mh-line); }
.mhx-read .k{ font-size:12.5px; font-weight:600; color:var(--mh-jac); }
.mhx-read h3{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:21px; line-height:1.2; margin-top:6px; }
.mhx-read .w{ font-size:13px; color:var(--mh-soft); margin-top:4px; }
.mhx-read p{ font-size:14.5px; line-height:1.55; margin-top:10px; color:var(--mh-soft); }
.mhx-read p.r{ color:var(--mh-ink); }
@media (max-width:980px){ .mhx-counts{ grid-template-columns:repeat(3,minmax(0,1fr)); } .mhx-reads{ grid-template-columns:1fr; } .mhx-recent li{ grid-template-columns:56px 96px minmax(0,1fr); } .mhx-recent .v{ display:none; } }

/* calendar */
.mhx-cal-grid{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:40px; margin-top:36px; }
.mhx-events{ border-top:1.5px solid var(--mh-ink); }
.mhx-ev{ display:grid; grid-template-columns:92px minmax(0,1fr); gap:18px; padding:18px 0; border-bottom:1px solid var(--mh-line); color:inherit; }
.mhx-ev .dt b{ display:block; font-family:'Fraunces',Georgia,serif; font-weight:400; font-size:40px; line-height:1; color:var(--mh-jac); }
.mhx-ev .dt span{ font-size:13px; color:var(--mh-soft); }
.mhx-ev h3{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:21px; line-height:1.2; }
.mhx-ev p{ font-size:14.5px; color:var(--mh-soft); margin-top:4px; line-height:1.5; }
.mhx-ev .badge{ display:inline-block; font:600 11.5px 'Archivo',sans-serif; border-radius:3px; padding:2px 7px; margin-left:8px; vertical-align:middle; }
.mhx-ev .badge.soon{ background:var(--mh-jac); color:#fff; }
.mhx-ev .badge.exp{ border:1px solid var(--mh-line); color:var(--mh-soft); }
.mhx-ev:hover h3{ text-decoration:underline; text-underline-offset:3px; }
.mhx-orgs h3{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:22px; border-bottom:1.5px solid var(--mh-ink); padding-bottom:10px; }
.mhx-orgs a{ display:block; padding:14px 0; border-bottom:1px solid var(--mh-line); }
.mhx-orgs a b{ display:block; font-weight:700; }
.mhx-orgs a span{ display:block; font-size:14px; color:var(--mh-soft); margin-top:3px; line-height:1.45; }
.mhx-orgs a:hover b{ text-decoration:underline; }
.mhx-note{ font-size:14px; color:var(--mh-soft); margin-top:16px; }
@media (max-width:900px){ .mhx-cal-grid{ grid-template-columns:1fr; } }

/* eat */
.mhx-eat{ background:var(--mh-sage); }
.mhx-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.mhx-chips button{ font:600 13.5px 'Archivo',sans-serif; padding:8px 14px; border-radius:999px; border:1.5px solid var(--mh-ink); background:transparent; color:var(--mh-ink); cursor:pointer; }
.mhx-chips button[aria-pressed="true"]{ background:var(--mh-ink); color:var(--mh-sage); }
.mhx-menu{ margin-top:20px; columns:2; column-gap:48px; }
.mhx-dish{ break-inside:avoid; padding:16px 0; border-bottom:1px solid var(--mh-line); }
.mhx-dish .t{ display:flex; justify-content:space-between; gap:12px; align-items:baseline; }
.mhx-dish b{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:20px; }
.mhx-dish .t span{ font-size:12.5px; color:var(--mh-jac); font-weight:600; text-align:right; }
.mhx-dish p{ font-size:14.5px; line-height:1.55; color:var(--mh-soft); margin-top:6px; }
.mhx-dish .w{ font-size:12.5px; color:var(--mh-soft); opacity:.85; margin-top:4px; }
@media (max-width:760px){ .mhx-menu{ columns:1; } }

/* parks, schools, buy */
.mhx-two{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px 64px; }
.mhx-two h2{ font-size:clamp(32px,3.6vw,46px); }
.mhx-list{ list-style:none; padding:0; margin:24px 0 0; border-top:1.5px solid var(--mh-ink); }
.mhx-list li{ padding:16px 0; border-bottom:1px solid var(--mh-line); }
.mhx-list b{ display:block; font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:20px; }
.mhx-list span{ display:block; font-size:14.5px; color:var(--mh-soft); line-height:1.55; margin-top:4px; }
.mhx-list span.w{ font-size:12.5px; color:var(--mh-jac); font-weight:600; margin-top:2px; }
@media (max-width:860px){ .mhx-two{ grid-template-columns:1fr; } }
.mhx-buy{ background:#10221D; color:#E4ECE7; }
.mhx-buy h2{ color:#fff; }
.mhx-buy .mhx-sub{ color:#B8C9C1; }
.mhx-buygrid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 36px; margin-top:36px; border-top:1px solid rgba(228,236,231,.25); }
.mhx-buygrid > div{ padding:20px 0 22px; border-bottom:1px solid rgba(228,236,231,.14); }
.mhx-buygrid h3{ font-family:'Fraunces',Georgia,serif; font-weight:460; font-size:21px; color:#fff; }
.mhx-buygrid p{ font-size:14.5px; line-height:1.6; color:#B8C9C1; margin-top:8px; }
@media (max-width:900px){ .mhx-buygrid{ grid-template-columns:1fr; } }
.mhx-sales .mh-sales-tablewrap{ margin-top:28px; }

/* contact block (shared markup) in the page palette */
.mhx + section#inquire{ background:#10221D; }
.mhx + section#inquire .btn-solid{ background:#FFFFFF; color:#1D3A32; }
.mh-area-label{ background:#fff !important; border:1px solid rgba(29,58,50,.2) !important; text-shadow:none !important; padding:4px 8px !important; }