/* ============================================================
   Rivera — shared stylesheet (index / projects / about)
   ============================================================ */
:root{
  --espresso:#1B130D;     /* near-black warm */
  --coffee:#2A1E14;
  --brown:#7A4E2D;        /* Rivera Brown — primary */
  --clay:#9A6A41;
  --tan:#C9A982;
  --sand:#E6DACA;
  --paper:#F4F0E9;        /* page bg */
  --paper-2:#FBF9F4;
  --ink:#231A12;          /* body text on paper */
  --ink-soft:#6E5E4D;
  --line:rgba(35,26,18,.14);
  --line-d:rgba(244,240,233,.16);
  --ok:#5E8C5A;           /* available / selling — muted leaf green status dot */
  --alert:#B0533B;        /* sold out — warm terracotta status dot */
  --max:1280px;
  --serif:"Instrument Serif",Georgia,serif; /* elegant accent for English; VI flips to Cormorant below */
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);color:var(--ink);
  font-family:"Manrope",system-ui,sans-serif;
  font-size:17px;line-height:1.6;font-weight:400;
  -webkit-font-smoothing:antialiased;letter-spacing:-.01em;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px}
.serif{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
/* Vietnamese: Instrument Serif has no VI glyphs, so the serif accent switches to
   Cormorant Garamond (full VI support). Its x-height is smaller, so it is sized up
   and given weight to match the presence of the English accent. The single --serif
   variable keeps every serif element unified per language. */
:lang(vi){--serif:"Cormorant Garamond",Georgia,serif}
:lang(vi) .serif{font-weight:600;font-size:1.18em}

/* labels */
.eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--brown);display:inline-block}
.eyebrow.muted{color:var(--ink-soft)}
.eyebrow.light{color:var(--tan)}

h1,h2,h3{font-weight:700;letter-spacing:-.035em;line-height:1.02;color:var(--ink)}

/* buttons / links */
.btn{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;border:0;
  font-family:inherit;font-size:.82rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  background:var(--brown);color:#FBF6EE;padding:16px 26px;border-radius:4px;
  transition:background .2s ease,transform .2s ease;
}
.btn:hover{background:var(--coffee);transform:translateY(-1px)}
.btn .arw{transition:transform .2s ease}
.btn:hover .arw{transform:translateX(4px)}
.btn.outline{background:transparent;color:#FBF6EE;border:1px solid rgba(251,246,238,.45)}
.btn.outline:hover{background:rgba(251,246,238,.1)}
.btn.dark{background:var(--espresso)}
.btn.ink{background:var(--brown);color:#FBF6EE}
.lk{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--brown);
  border-bottom:1px solid transparent;padding-bottom:2px;
}
.lk:hover{border-color:var(--brown)}

/* photo placeholder — clearly a slot, but designed.
   To use a real image: add  style="background-image:url('images/your.jpg')"
   to the .photo element and it will show through the ::before gradient. */
.photo{position:relative;overflow:hidden;background:var(--coffee) center/cover no-repeat}
.photo::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(125deg, rgba(255,240,222,.10) 0%, transparent 42%),
    radial-gradient(140% 120% at 78% 8%, #b07e4f 0%, #7A4E2D 38%, #3a2616 78%, #211610 100%);
  transition:transform .9s cubic-bezier(.2,.7,.2,1);
}
.photo.has-img::before{display:none}      /* add class .has-img once a real photo is set */
.photo:hover::before{transform:scale(1.06)}
/* a looping <video class="photo-vid"> fills the .photo box, clipped to its rounded corners */
.photo .photo-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;background:var(--coffee)}
.photo .cap{position:absolute;left:18px;bottom:16px;z-index:2;font-size:.68rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,246,238,.82)}
.photo .slot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:1;color:rgba(251,246,238,.32);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase}

/* ---------------- NAV ---------------- */
header.nav{position:fixed;top:0;left:0;right:0;z-index:80;transition:background .3s ease,backdrop-filter .3s ease,border-color .3s;border-bottom:1px solid transparent}
header.nav.solid{background:rgba(244,240,233,.86);backdrop-filter:saturate(1.2) blur(12px);border-color:var(--line)}
/* pages with a light (non-hero) top start solid-on-load */
header.nav.onlight{background:rgba(244,240,233,.92);backdrop-filter:saturate(1.2) blur(12px);border-color:var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:78px}
.logo{font-size:1.55rem;font-weight:800;letter-spacing:-.01em;color:#FBF6EE;transition:color .3s;white-space:nowrap;display:inline-flex;align-items:baseline}
header.nav.solid .logo,header.nav.onlight .logo{color:var(--ink)}
.logo .d{color:var(--tan)}
.logo .ra{height:.72em;width:auto;align-self:baseline;margin-left:.015em}
.menu{display:flex;align-items:center;gap:28px}
.menu a:not(.btn){font-size:.82rem;font-weight:500;letter-spacing:.04em;color:rgba(251,246,238,.86);transition:color .3s}
header.nav.solid .menu a:not(.btn),header.nav.onlight .menu a:not(.btn){color:var(--ink-soft)}
.menu a:not(.btn):hover{color:var(--tan)}
header.nav.solid .menu a:not(.btn):hover,header.nav.onlight .menu a:not(.btn):hover{color:var(--brown)}
.menu a.active{color:#FBF6EE}
header.nav.solid .menu a.active,header.nav.onlight .menu a.active{color:var(--brown)}
.menu .btn{padding:12px 20px}

/* language toggle */
.lang{display:inline-flex;align-items:center;gap:6px;cursor:pointer;background:transparent;border:1px solid rgba(251,246,238,.4);border-radius:999px;padding:6px 12px;font-family:inherit;font-size:.72rem;font-weight:700;letter-spacing:.08em;color:rgba(251,246,238,.86);transition:color .3s,border-color .3s,background .3s}
.lang:hover{background:rgba(251,246,238,.08)}
header.nav.solid .lang,header.nav.onlight .lang{border-color:var(--line);color:var(--ink-soft)}
.lang .sep{opacity:.45;font-weight:400}
.lang span[data-l]{opacity:.45;transition:opacity .2s,color .2s}
.lang span[data-l].on{opacity:1;color:var(--tan)}
header.nav.solid .lang span[data-l].on,header.nav.onlight .lang span[data-l].on{color:var(--brown)}

/* mobile menu */
.burger{display:none;background:transparent;border:0;cursor:pointer;width:30px;height:22px;position:relative}
.burger span{position:absolute;left:0;right:0;height:2px;background:#FBF6EE;transition:transform .3s,opacity .3s,background .3s}
header.nav.solid .burger span,header.nav.onlight .burger span{background:var(--ink)}
.burger span:nth-child(1){top:0}.burger span:nth-child(2){top:10px}.burger span:nth-child(3){top:20px}
body.menu-open .burger span:nth-child(1){transform:translateY(10px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-10px) rotate(-45deg)}
@media(max-width:840px){
  .burger{display:block;z-index:90}
  /* The menu lives inside header.nav, which carries a backdrop-filter when solid/onlight.
     A backdrop-filtered ancestor becomes the containing block for position:fixed children,
     so `inset:0` would size this menu to the 78px-tall header (not the viewport) — leaving
     the lower items leaking out below the bar instead of hiding. Size it to the viewport
     explicitly (vh/dvh) so the closed-state translateY(-100%) clears the whole screen. */
  .menu{position:fixed;top:0;left:0;right:0;height:100vh;height:100dvh;flex-direction:column;justify-content:center;gap:30px;
    background:rgba(244,240,233,.97);backdrop-filter:blur(8px);transform:translateY(-100%);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
  body.menu-open .menu{transform:none}
  .menu a:not(.btn){font-size:1.3rem;color:var(--ink) !important}
  .lang{color:var(--ink-soft) !important;border-color:var(--line) !important}
}

/* ---------------- HERO (landing) ---------------- */
.hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;color:#FBF6EE;overflow:hidden}
.hero .bg{position:absolute;inset:0;z-index:0}
.hero .bg .hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:radial-gradient(130% 100% at 70% 0%, #9c6c41 0%, #6e4527 40%, #2c1c11 82%, #1a110a 100%)}
.hero .bg .bg-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(to top, rgba(20,13,8,.70) 0%, rgba(27,19,13,.18) 46%, rgba(27,19,13,.30) 100%),linear-gradient(105deg, rgba(20,13,8,.34) 0%, transparent 58%)}
.hero .bg .slot{position:absolute;top:96px;right:32px;z-index:2;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(251,246,238,.34)}
.hero-in{position:relative;z-index:2;width:100%;padding-bottom:64px}
.hero h1{font-size:clamp(2.9rem,8vw,7rem);color:#FBF6EE;max-width:16ch}
.hero h1 .serif{color:var(--tan);font-weight:400;letter-spacing:0}
.hero .sub{max-width:42ch;margin:26px 0 34px;font-size:1.12rem;color:rgba(251,246,238,.86);font-weight:300}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap}
.hero .meta{position:absolute;right:32px;bottom:64px;z-index:2;text-align:right;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(251,246,238,.7)}
.hero .meta b{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.5rem;letter-spacing:0;text-transform:none;color:var(--tan);margin-top:6px}
@media(max-width:840px){.hero .meta{display:none}}

/* ---------------- PAGE HEADER (projects/about) ---------------- */
.pagehead{padding:150px 0 64px;border-bottom:1px solid var(--line)}
.pagehead .eyebrow{margin-bottom:16px}
.pagehead h1{font-size:clamp(2.6rem,6vw,5rem);max-width:18ch}
.pagehead h1 .serif{color:var(--brown)}
.pagehead p{color:var(--ink-soft);font-size:1.12rem;max-width:52ch;margin-top:22px;font-weight:300}

/* ---------------- INTRO STATEMENT ---------------- */
.statement{padding:120px 0 104px;border-bottom:1px solid var(--line)}
.statement .big{font-size:clamp(1.8rem,4.2vw,3.2rem);font-weight:300;letter-spacing:-.03em;line-height:1.18;max-width:24ch;color:var(--ink)}
.statement .big .serif{color:var(--brown);font-weight:400}
.statement .row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:48px;flex-wrap:wrap}
.statement .row p{max-width:46ch;color:var(--ink-soft);font-size:1.05rem}

/* ---------------- DEVELOPER MARQUEE ---------------- */
.marquee{border-bottom:1px solid var(--line);background:var(--paper-2);padding:40px 0 44px;overflow:hidden}
.marquee .m-label{text-align:center;margin-bottom:26px}
.marquee-mask{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;width:max-content;align-items:center;gap:64px;animation:scroll 40s linear infinite;will-change:transform}
.marquee-mask:hover .marquee-track{animation-play-state:paused}
.marquee-track .dev{font-family:var(--serif);font-style:normal;font-size:1.5rem;letter-spacing:.01em;white-space:nowrap;color:var(--ink-soft);opacity:.72;transition:opacity .25s,color .25s}
.marquee-track .dev:hover{opacity:1;color:var(--brown)}
/* real logos: <img class="dev-logo" src="logo/trimmed/name.png" alt="Name"> — see the marquee in index.html.
   Sources are pre-trimmed of transparent padding (logo/trimmed/) so this single height + max-width
   box normalises every logo to a consistent visual size via object-fit. Rendered as quiet grayscale;
   colour returns on hover. */
.marquee-track .dev-logo{height:38px;width:auto;max-width:132px;object-fit:contain;filter:grayscale(1);opacity:.55;transition:opacity .25s,filter .25s}
.marquee-track .dev-logo:hover{opacity:.9;filter:grayscale(0)}
/* logos supplied as white/reversed art (e.g. Brady) — invert so they read dark on the cream strip */
.marquee-track .dev-logo--invert{filter:grayscale(1) invert(1)}
.marquee-track .dev-logo--invert:hover{filter:grayscale(1) invert(1)}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none;flex-wrap:wrap;justify-content:center;width:auto;gap:40px}}

/* ---------------- PROJECTS GRID (landing teaser) ---------------- */
.residences{padding:104px 0}
.sec-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:54px;flex-wrap:wrap}
.sec-top h2{font-size:clamp(2rem,4vw,3rem)}
.sec-top p{color:var(--ink-soft);max-width:40ch;margin-top:12px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.grid.feature{grid-template-columns:2fr 1fr}
.listing{display:block}
.listing .photo{aspect-ratio:4/5;border-radius:8px}
.listing.wide .photo{aspect-ratio:16/11}
.listing .info{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:18px}
.listing .info h3{font-size:1.35rem;font-weight:600;letter-spacing:-.03em}
.listing .info .price{font-size:.82rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brown);white-space:nowrap}
.listing .desc{color:var(--ink-soft);font-size:.98rem;margin-top:6px}
.listing .tags{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}
.tag{font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--line);border-radius:999px;padding:6px 12px}
@media(max-width:900px){.grid,.grid.feature{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid,.grid.feature{grid-template-columns:1fr}}

/* ---------------- FILTERABLE GALLERY (projects.html) ---------------- */
.gallery{padding:64px 0 110px}
.filters{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:48px}
.filt{cursor:pointer;font-family:inherit;font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);background:transparent;border:1px solid var(--line);border-radius:999px;padding:11px 20px;transition:background .2s,color .2s,border-color .2s}
.filt:hover{border-color:var(--brown);color:var(--brown)}
.filt.active{background:var(--brown);border-color:var(--brown);color:#FBF6EE}
.filt .count{opacity:.6;margin-left:6px;font-weight:500}
.ic-defs{position:absolute;width:0;height:0;overflow:hidden}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.pcard{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper-2);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,opacity .35s}
.pcard:hover{transform:translateY(-5px);box-shadow:0 22px 48px -26px rgba(35,26,18,.5)}
.pcard.hide{display:none}
.pcard .photo{aspect-ratio:16/11}
/* status (lifecycle) + sale (availability) pills overlaid on the cover */
.pill{position:absolute;top:14px;z-index:3;display:inline-flex;align-items:center;gap:7px;font-size:.72rem;font-weight:600;letter-spacing:.02em;line-height:1;padding:8px 14px;border-radius:999px}
.pill-status{left:14px}
.st-cp{background:var(--brown);color:#FBF6EE}          /* completed */
.st-uc{background:var(--espresso);color:var(--tan)}   /* under construction */
.st-pc{background:var(--sand);color:var(--brown)}      /* pre-construction */
.pill-sale{right:14px;background:var(--paper-2);color:var(--ink);text-transform:uppercase;letter-spacing:.07em;font-size:.66rem;box-shadow:0 8px 20px -8px rgba(27,19,13,.55)}
.pill-sale .dot{width:8px;height:8px;border-radius:50%;background:var(--ok)}
.pill-sale.soon .dot{background:var(--clay)}
.pill-sale.sold .dot{background:var(--alert)}
.pcard-body{display:flex;flex-direction:column;flex:1;padding:24px 24px 26px}
.pcard-body h3{font-size:1.34rem;font-weight:600;letter-spacing:-.03em;line-height:1.12}
.pcard .loc{color:var(--ink-soft);font-size:.9rem;margin-top:7px}
.pcard-desc{color:var(--ink);font-size:.93rem;line-height:1.55;margin-top:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* pricing block: one row per bedroom tier, lowest "from" price per segment */
.pcard-prices{margin-top:auto;padding-top:18px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:13px}
.price-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.price-specs{display:flex;align-items:center;gap:14px;color:var(--ink-soft);font-size:.86rem}
.price-specs .spec{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.price-specs .spec b{font-weight:600;color:var(--ink)}
.price-specs .ic{width:18px;height:18px;color:var(--brown);flex:0 0 auto;display:block}
.price-amt{font-weight:700;font-size:.97rem;color:var(--ink);white-space:nowrap}
.price-amt small{font-weight:500;color:var(--ink-soft);font-size:.72rem;margin-right:5px}
/* .specs-row is shared by every project detail page (.pd-card) — keep its base */
.specs-row{display:flex;gap:20px;margin:18px 0 16px;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.specs-row .sp{display:flex;align-items:baseline;gap:6px}
.specs-row .sp b{font-size:1.1rem;font-weight:600;color:var(--ink)}
.specs-row .sp small{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.no-results{display:none;padding:60px 0;text-align:center;color:var(--ink-soft)}
.no-results.show{display:block}
@media(max-width:900px){.pgrid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.pgrid{grid-template-columns:1fr}}

/* ---------------- STATS (dark) ---------------- */
.stats{background:var(--espresso);color:var(--sand);padding:96px 0}
.stats .grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.stat .n{font-size:clamp(2.6rem,5vw,4rem);font-weight:300;letter-spacing:-.04em;color:#FBF6EE;line-height:1}
.stat .n .serif{color:var(--tan)}
.stat .l{margin-top:12px;font-size:.78rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(230,218,202,.66)}
.stats .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 40px}
.stats .grid3 .n{font-size:clamp(2.4rem,3.6vw,3.1rem)}
.stats .grid3 .l{margin-top:14px;font-size:.95rem;font-weight:400;letter-spacing:0;text-transform:none;line-height:1.55;color:rgba(230,218,202,.74);max-width:30ch}
@media(max-width:820px){.stats .grid4{grid-template-columns:1fr 1fr;gap:44px 30px}.stats .grid3{grid-template-columns:1fr;gap:40px}}

/* ---------------- APPROACH / PROCESS ---------------- */
.approach{padding:120px 0}
.approach-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.approach .photo{aspect-ratio:3/4;border-radius:10px}
.approach h2{font-size:clamp(2rem,4vw,3rem);margin:16px 0 22px;max-width:16ch}
.approach h2 .serif{color:var(--brown)}
.approach .lead{color:var(--ink-soft);font-size:1.1rem;margin-bottom:30px}
.pts{list-style:none;display:flex;flex-direction:column;gap:0}
.pts li{padding:24px 0;border-top:1px solid var(--line);display:flex;gap:22px;align-items:flex-start}
.pts li:last-child{border-bottom:1px solid var(--line)}
.pts .k{font-size:.8rem;font-weight:600;color:var(--brown);letter-spacing:.1em;min-width:34px}
.pts h4{font-size:1.18rem;font-weight:600;letter-spacing:-.02em;margin-bottom:4px}
.pts p{color:var(--ink-soft);font-size:1rem}
@media(max-width:860px){.approach-grid{grid-template-columns:1fr;gap:48px}.approach .photo{aspect-ratio:16/11}}

/* ---------------- ABOUT: founder ---------------- */
.founder{padding:120px 0;border-bottom:1px solid var(--line)}
.founder-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center}
.founder .photo{aspect-ratio:4/5;border-radius:12px}
.founder h2{font-size:clamp(2rem,4vw,3rem);margin:14px 0 22px;max-width:18ch}
.founder h2 .serif{color:var(--brown)}
.founder p{color:var(--ink-soft);font-size:1.08rem;margin-bottom:18px;max-width:54ch}
.founder .sign{font-family:var(--serif);font-style:italic;font-size:1.7rem;color:var(--brown);margin-top:10px}
.founder .role{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-top:4px}
@media(max-width:860px){.founder-grid{grid-template-columns:1fr;gap:44px}.founder .photo{aspect-ratio:16/11}}

/* ---------------- ABOUT: credentials ---------------- */
.creds{padding:110px 0}
.creds .sec-top{margin-bottom:46px}
.creds-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cred{border:1px solid var(--line);border-radius:12px;padding:30px 26px;background:var(--paper-2)}
.cred .ic{font-family:var(--serif);font-style:italic;font-size:2.2rem;color:var(--brown);line-height:1}
.cred h4{font-size:1.12rem;font-weight:600;margin:14px 0 8px;letter-spacing:-.02em}
.cred p{color:var(--ink-soft);font-size:.98rem}
@media(max-width:860px){.creds-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.creds-grid{grid-template-columns:1fr}}

/* ---------------- FEATURED FULL-BLEED ---------------- */
.featured{position:relative;min-height:88vh;display:flex;align-items:center;color:#FBF6EE;overflow:hidden}
.featured .bg{position:absolute;inset:0}
.featured .bg::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg, rgba(18,12,7,.9) 0%, rgba(18,12,7,.5) 48%, rgba(18,12,7,.2) 100%),radial-gradient(120% 130% at 86% 80%, #a9794b 0%, #6c4427 42%, #281a10 88%)}
.featured-in{position:relative;z-index:2}
.featured .eyebrow{color:var(--tan)}
.featured h2{font-size:clamp(2.3rem,5vw,4rem);color:#FBF6EE;max-width:14ch;margin:16px 0 20px}
.featured h2 .serif{color:var(--tan)}
.featured p{max-width:40ch;color:rgba(251,246,238,.84);font-weight:300;font-size:1.1rem;margin-bottom:28px}
.featured .specs{display:flex;gap:38px;flex-wrap:wrap;margin-bottom:34px}
.featured .specs div span{display:block;font-family:var(--serif);font-style:italic;font-size:1.9rem;color:#FBF6EE;line-height:1}
.featured .specs div small{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(251,246,238,.6)}
.featured-actions{display:flex;align-items:center;gap:14px 26px;flex-wrap:wrap}
.lk.light{color:#FBF6EE}
.lk.light:hover{border-color:var(--tan)}

/* ---------------- ENQUIRE ---------------- */
.enquire{padding:120px 0}
.enquire-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.enquire h2{font-size:clamp(2.1rem,4.4vw,3.4rem);max-width:14ch}
.enquire h2 .serif{color:var(--brown)}
.enquire .lead{color:var(--ink-soft);font-size:1.1rem;margin-top:20px;max-width:40ch}
.enquire .detail{margin-top:36px;display:flex;flex-direction:column;gap:6px}
.enquire .detail span{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.enquire .detail a{font-size:1.15rem;font-weight:600;color:var(--ink)}
form.efrm{display:flex;flex-direction:column;gap:0}
.fld{position:relative;border-bottom:1px solid var(--line);padding:18px 0}
.fld input,.fld textarea{width:100%;border:0;background:transparent;outline:none;resize:none;font-family:inherit;font-size:1.05rem;color:var(--ink)}
.fld input::placeholder,.fld textarea::placeholder{color:#9d8c79}
.fld:focus-within{border-color:var(--brown)}
form.efrm .btn{margin-top:30px;align-self:flex-start;padding:17px 30px}
.efrm .thanks{display:none;padding:24px 0}
.efrm .thanks h3{font-size:1.6rem;font-weight:600;color:var(--brown)}
.efrm .thanks p{color:var(--ink-soft);margin-top:6px}
form.efrm.sent .fld,form.efrm.sent .btn{display:none}
form.efrm.sent .thanks{display:block}
@media(max-width:860px){.enquire-grid{grid-template-columns:1fr;gap:44px}}

/* ---------------- FOOTER ---------------- */
footer{background:var(--espresso);color:var(--sand);padding:80px 0 40px}
.foot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;padding-bottom:54px;border-bottom:1px solid var(--line-d)}
.foot-top .logo{color:#FBF6EE;font-size:1.8rem}
.foot-top p{color:rgba(230,218,202,.66);max-width:34ch;margin-top:16px;font-size:.98rem;font-weight:300}
.fcol h5{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tan);margin-bottom:18px}
.fcol a{display:block;color:rgba(230,218,202,.78);font-size:.96rem;padding:6px 0}
.fcol a:hover{color:#FBF6EE}
.foot-bot{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-top:26px;font-size:.82rem;color:rgba(230,218,202,.5)}
@media(max-width:760px){.foot-top{grid-template-columns:1fr 1fr}.foot-top .logo{grid-column:1/-1}}

/* legibility wash over real photos that carry a caption */
.photo.has-img .cap{z-index:3}
.listing .photo.has-img::after,.pcard .photo.has-img::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(to top, rgba(20,13,8,.46) 0%, rgba(20,13,8,.06) 34%, transparent 60%);
}

/* ============================================================
   PROJECT DETAIL PAGE (collins-wharf-aluna.html, 671-chapel-street.html, …)
   ============================================================ */
.pd-hero{position:relative;min-height:84vh;display:flex;align-items:flex-end;color:#FBF6EE;overflow:hidden;background:var(--coffee) center/cover no-repeat}
.pd-hero .hero-vid{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;background:radial-gradient(130% 100% at 70% 0%, #9c6c41 0%, #6e4527 40%, #2c1c11 82%, #1a110a 100%)}
.pd-hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top, rgba(18,12,7,.86) 0%, rgba(18,12,7,.30) 50%, rgba(18,12,7,.40) 100%)}
.pd-hero-in{position:relative;z-index:2;width:100%;padding:120px 0 60px}
@media(max-width:760px){.pd-hero{min-height:560px}.pd-hero-in{padding:104px 0 44px}.pd-back{margin-bottom:30px}}
.pd-back{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(251,246,238,.74);margin-bottom:46px;transition:color .25s}
.pd-back:hover{color:var(--tan)}
.pd-hero .eyebrow{color:var(--tan);display:block;margin-bottom:14px}
.pd-hero h1{font-size:clamp(2.6rem,6vw,5.2rem);color:#FBF6EE;max-width:16ch}
.pd-loc{margin-top:16px;font-size:1.05rem;letter-spacing:.02em;color:rgba(251,246,238,.82);font-weight:300}
.pd-tagstrip{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.pd-tagstrip .st{font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#FBF6EE;border:1px solid rgba(251,246,238,.4);border-radius:999px;padding:7px 14px}
.pd-body{padding:96px 0 40px}
.pd-grid{display:grid;grid-template-columns:1.55fr .95fr;gap:64px;align-items:start}
.pd-lead .eyebrow{margin-bottom:16px}
.pd-lead h2{font-size:clamp(1.9rem,3.6vw,2.7rem);max-width:18ch;margin-bottom:24px}
.pd-lead h2 .serif{color:var(--brown)}
.pd-lead p{color:var(--ink-soft);font-size:1.1rem;margin-bottom:20px;max-width:58ch}
.pd-card{border:1px solid var(--line);border-radius:14px;background:var(--paper-2);padding:30px 30px 32px;position:sticky;top:100px}
.pd-card .pr{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--brown)}
.pd-card .prl{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:6px}
.pd-card .specs-row{margin-top:22px;gap:22px;justify-content:flex-start;flex-wrap:wrap}
.pd-card .specs-row .sp{flex-direction:row;align-items:center;gap:8px;flex:0 0 auto}
.pd-card .specs-row .sp .ic{width:22px;height:22px;color:var(--brown);flex:0 0 auto}
.pd-card .specs-row .sp .ic svg{width:100%;height:100%;display:block}
.pd-card .specs-row .sp b{font-size:1.05rem}
.pd-facts{list-style:none;margin:6px 0 26px}
.pd-facts li{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:.96rem}
.pd-facts li:last-child{border-bottom:0}
.pd-facts .fk{color:var(--ink-soft)}
.pd-facts .fv{font-weight:600;color:var(--ink);text-align:right}
.pd-card .btn{width:100%;justify-content:center;margin-top:6px}
.pd-note{margin-top:14px;font-size:.78rem;line-height:1.5;color:var(--ink-soft);text-align:center}

.pd-features{margin-top:80px;border-top:1px solid var(--line);padding-top:54px}
.pd-features h3{font-size:1.5rem;font-weight:600;letter-spacing:-.02em;margin-bottom:30px}
.pd-features ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
.pd-features li{display:flex;gap:16px;align-items:baseline;padding:18px 0;border-top:1px solid var(--line);color:var(--ink-soft);font-size:1.02rem}
.pd-features li .fi{font-family:var(--serif);font-style:italic;color:var(--brown);font-size:1.1rem;min-width:26px}
@media(max-width:760px){.pd-features ul{grid-template-columns:1fr}}

.pd-gallery{padding:30px 0 110px}
.pd-gallery .ghead{margin-bottom:30px}
.pgall-grid{display:grid;grid-template-columns:2fr 1fr;grid-auto-rows:1fr;gap:18px}
.pgall-grid .ph{position:relative;border-radius:12px;overflow:hidden;background:var(--coffee) center/cover no-repeat;min-height:230px}
.pgall-grid .ph.tall{grid-row:span 2}
.pgall-grid .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(20,13,8,.12),transparent 60%);transition:opacity .4s}
@media(max-width:760px){.pgall-grid{grid-template-columns:1fr 1fr}.pgall-grid .ph.tall{grid-row:span 1}}

/* --- gallery carousel --- */
.pc-head{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.pc-tabs{display:flex;gap:8px;flex-wrap:wrap}
.pc-tab{font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);background:transparent;border:1px solid var(--line);border-radius:999px;padding:8px 15px;cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.pc-tab:hover{border-color:var(--brown);color:var(--brown)}
.pc-tab.on{background:var(--brown);border-color:var(--brown);color:#FBF6EE}
.pcarousel{position:relative;border-radius:14px;overflow:hidden;background:var(--coffee);height:64vh;max-height:680px;min-height:400px;box-shadow:0 24px 60px -34px rgba(20,13,8,.55)}
.pc-track{position:absolute;inset:0}
.pc-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease;background:var(--coffee) center/cover no-repeat}
.pc-slide.on{opacity:1;z-index:1}
.pc-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(18,12,7,.55) 0%,rgba(18,12,7,0) 42%)}
.pc-cap{position:absolute;left:28px;bottom:26px;z-index:2;color:#FBF6EE;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.pc-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:46px;height:46px;border-radius:50%;border:1px solid rgba(251,246,238,.45);background:rgba(18,12,7,.32);color:#FBF6EE;font-size:1.4rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .25s,border-color .25s}
.pc-arrow:hover{background:rgba(18,12,7,.6);border-color:var(--tan)}
.pc-arrow.prev{left:18px}.pc-arrow.next{right:18px}
.pc-dots{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:4;display:flex;gap:8px}
.pc-dots button{width:8px;height:8px;padding:0;border:0;border-radius:999px;background:rgba(251,246,238,.45);cursor:pointer;transition:width .3s,background .3s}
.pc-dots button.on{width:22px;background:var(--tan)}
@media(max-width:760px){.pcarousel{height:52vh;min-height:300px}.pc-arrow{width:40px;height:40px}.pc-cap{left:18px;bottom:18px}}

/* --- location / map --- */
.pd-map-sec{padding:0 0 110px}
.pd-map-sec .ghead{margin-bottom:30px}
.pd-map{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper-2)}
.pd-map-canvas{position:relative;height:400px}
.pd-map-frame{width:100%;height:100%;border:0;display:block;pointer-events:none;filter:sepia(.42) saturate(.82) hue-rotate(-8deg) brightness(1.03) contrast(.96)}
.pd-map-canvas::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:var(--brown);opacity:.12;mix-blend-mode:multiply}
.pd-map-overlay{position:absolute;inset:0;z-index:2;cursor:pointer;transition:background .3s}
.pd-map-overlay:hover{background:rgba(122,78,45,.10)}
.pd-map-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 26px}
.pd-map-addr strong{display:block;font-size:1.02rem;color:var(--ink);letter-spacing:.01em}
.pd-map-sub{display:block;margin-top:3px;font-size:.92rem;color:var(--ink-soft)}
.pd-map-cta{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--brown);transition:gap .25s}
.pd-map-cta:hover{gap:11px}
@media(max-width:600px){.pd-map-canvas{height:300px}.pd-map-bar{flex-direction:column;align-items:flex-start;gap:12px}}

/* Rivera's view / investment angle — a short editorial band under the gallery */
.pd-take{background:var(--paper-2);border-top:1px solid var(--line);padding:90px 0}
.pd-take-in{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:center}
.pd-take h2{font-size:clamp(1.8rem,3.4vw,2.6rem);letter-spacing:-.02em;margin-top:14px;max-width:18ch}
.pd-take h2 .serif{color:var(--brown)}
.pd-take p{margin-top:18px;color:var(--ink-soft);font-size:1.08rem;font-weight:300;line-height:1.7;max-width:50ch}
.pd-take-note{margin-top:18px;font-size:.8rem;color:var(--ink-soft);opacity:.75}
.pd-figs{display:grid;gap:0}
.pd-fig{display:flex;align-items:baseline;gap:20px;border-top:1px solid var(--line);padding:20px 2px}
.pd-fig:last-child{border-bottom:1px solid var(--line)}
.pd-fig .fn{font-size:clamp(1.7rem,3vw,2.1rem);font-weight:300;letter-spacing:-.03em;color:var(--brown);line-height:1;min-width:118px}
.pd-fig .fl{font-size:.95rem;color:var(--ink-soft);font-weight:500}
@media(max-width:900px){.pd-take-in{grid-template-columns:1fr;gap:34px}}

.pd-cta{background:var(--espresso);color:var(--sand);padding:100px 0}
.pd-cta-in{display:grid;grid-template-columns:1.3fr 1fr;gap:50px;align-items:center}
.pd-cta h2{font-size:clamp(2rem,4vw,3rem);color:#FBF6EE;max-width:16ch}
.pd-cta h2 .serif{color:var(--tan)}
.pd-cta p{color:rgba(230,218,202,.74);margin-top:16px;max-width:42ch;font-weight:300;font-size:1.08rem}
.pd-cta .actions{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
@media(max-width:900px){.pd-grid{grid-template-columns:1fr;gap:40px}.pd-card{position:static}.pd-cta-in{grid-template-columns:1fr;gap:32px}}

/* reveal */
.rev{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.rev.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rev{opacity:1;transform:none}}

/* ============================================================
   Melbourne map (map.html) — Leaflet + Rivera styling
   ============================================================ */
.cbd-sec{padding:8px 0 110px}

/* controls row: category filters on the left, the view presets on the right.
   The presets use a segmented switch (joined, no colour swatches) so they read as a
   distinct control, not another filter pill. Wraps below the filters on narrow screens. */
.rv-controls{display:flex;justify-content:space-between;align-items:flex-start;gap:14px 24px;flex-wrap:wrap;margin-bottom:26px}
.rv-filters{margin-bottom:0}
.rv-views{display:inline-flex;align-items:center;gap:10px}
.rv-vlabel{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.rv-seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--paper-2)}
.rv-seg .rv-view{cursor:pointer;font-family:inherit;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);background:transparent;border:0;padding:9px 16px;transition:background .2s,color .2s}
.rv-seg .rv-view + .rv-view{border-left:1px solid var(--line)}
.rv-seg .rv-view:hover{color:var(--brown)}
.rv-seg .rv-view.active{background:var(--brown);color:#FBF6EE}
@media(max-width:600px){.rv-seg .rv-view{padding:9px 12px;font-size:.68rem}}

.rv-map{height:min(76vh,640px);border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper);z-index:0}
@media(max-width:600px){.rv-map{height:68vh}}

/* a warm tint over the OSM tiles so the map sits in the palette (tiles only).
   Pushed for contrast — higher contrast + saturation, lower brightness — so the
   pale Voyager basemap reads with more punch (roads vs buildings) on screen and,
   especially, in in-app/mobile webviews. A single uniform filter can lift overall
   contrast but cannot recolour roads independently of buildings. */
.rv-map .leaflet-tile-pane{filter:sepia(.03) saturate(1.08) contrast(1.14) brightness(1)}

/* Map marker legend — a deliberately distinct, saturated colour set for the MAP ONLY
   (red / blue / amber / green / black). This is an intentional departure from the warm
   brand tokens, chosen for clear category separation on the basemap. Declared as tokens
   here so the pins and the filter swatches always stay in lock-step. */
:root{
  --pin-project:#B23A2E;            /* Dự án — red */
  --pin-university:#2D6385;         /* Đại học — ocean blue */
  --pin-shopping:#BE7B33;           /* Mua sắm — amber */
  --pin-transit:#4E7A41;            /* Giao thông — leaf green */
  --pin-landmark:var(--espresso);   /* Địa danh — black */
}

/* Rivera markers — two languages of marker:
   1) project = a small solid brand dot (the hero), thin cream ring + soft shadow.
   2) every other destination = a colour-coded ICON CHIP: filled with its category
      colour + a cream line glyph, so categories read by both shape AND colour. */
.rv-hero{display:block;width:100%;height:100%;border-radius:999px;background:var(--pin-project);
  border:2px solid var(--paper-2);
  box-shadow:0 0 0 2px rgba(27,19,13,.16),0 2px 5px -1px rgba(27,19,13,.5),0 0 0 1px rgba(27,19,13,.22);
  transform:scale(var(--rv-pin-scale,1));transform-origin:center;
  transition:transform .2s cubic-bezier(.2,.7,.2,1)}
.leaflet-marker-icon:hover .rv-hero{transform:scale(calc(var(--rv-pin-scale,1) * 1.18))}

.rv-mk{display:flex;align-items:center;justify-content:center;width:100%;height:100%;
  border-radius:999px;color:#FBF6EE;border:2px solid var(--paper-2);
  box-shadow:0 2px 6px -1px rgba(27,19,13,.5),0 0 0 1px rgba(27,19,13,.18);
  transform:scale(var(--rv-pin-scale,1));transform-origin:center;
  transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s ease}
.rv-mk svg{width:58%;height:58%;display:block;fill:none;stroke:currentColor;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.rv-mk--university{background:var(--pin-university)}
.rv-mk--shopping{background:var(--pin-shopping)}
.rv-mk--transit{background:var(--pin-transit)}
.rv-mk--landmark{background:var(--pin-landmark)}
.leaflet-marker-icon:hover .rv-mk{transform:scale(calc(var(--rv-pin-scale,1) * 1.16));
  box-shadow:0 5px 12px -3px rgba(27,19,13,.55),0 0 0 1px rgba(27,19,13,.22)}

/* filter-pill key — a mini of the real marker: a filled colour chip (+ glyph for the
   icon categories, a plain dot for projects), so the legend mirrors the map exactly. */
.filt-ic{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:999px;margin-right:8px;vertical-align:middle;position:relative;top:-1px;color:#FBF6EE;box-shadow:0 0 0 1.5px var(--paper-2),0 0 0 2.5px var(--line)}
.filt-ic svg{width:60%;height:60%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.filt[data-cat=project] .filt-ic{background:var(--pin-project)}
.filt[data-cat=university] .filt-ic{background:var(--pin-university)}
.filt[data-cat=shopping] .filt-ic{background:var(--pin-shopping)}
.filt[data-cat=transit] .filt-ic{background:var(--pin-transit)}
.filt[data-cat=landmark] .filt-ic{background:var(--pin-landmark)}
.filt.active .filt-ic{box-shadow:0 0 0 1.5px var(--brown),0 0 0 2.5px rgba(251,246,238,.55)}

/* first-visit nudge — some categories start hidden, so gently pulse the inactive
   pills and BLINK a one-line hint; both retire on the first filter tap, and the hint
   then fades and is removed entirely (app.js sets display:none after the fade). */
@keyframes rvPulse{0%,100%{box-shadow:0 0 0 0 rgba(122,78,45,0)}50%{box-shadow:0 0 0 5px rgba(122,78,45,.18)}}
.rv-filters.rv-nudge .filt:not(.active){animation:rvPulse 1.8s ease-in-out 4}
@keyframes rvBlink{0%,100%{opacity:1}50%{opacity:.32}}
.rv-hint{display:inline-flex;align-items:center;gap:9px;margin:13px 0 24px;font-size:.84rem;font-weight:500;color:var(--brown);transition:opacity .4s ease;animation:rvBlink 1.25s ease-in-out infinite}
.rv-hint.gone{animation:none;opacity:0;pointer-events:none}
.rv-hint .rv-hint-ic{display:inline-flex}
.rv-hint .rv-hint-ic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media(prefers-reduced-motion:reduce){.rv-filters.rv-nudge .filt:not(.active){animation:none}.rv-hint{animation:none}}

/* map controls — top row (search + view presets), then the category toggles below */
.rv-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px 28px;flex-wrap:wrap;margin-bottom:16px}
.rv-toolbar .rv-search{flex:1 1 280px;max-width:440px;margin:0}
.rv-vlabel{white-space:nowrap}
@media(max-width:640px){
  .rv-toolbar{align-items:stretch}
  .rv-toolbar .rv-search{flex-basis:auto;max-width:none}
  .rv-views{justify-content:flex-start}
}

/* project search box + autocomplete. Client-side (the list is tiny) so results are
   instant. Mobile: full width, 16px input so iOS doesn't zoom on focus, 44px-tall rows. */
.rv-search{position:relative;max-width:430px;margin:0 0 18px}
.rv-search-ic{position:absolute;left:15px;top:50%;transform:translateY(-50%);display:inline-flex;color:var(--ink-soft);pointer-events:none}
.rv-search-ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rv-search input{width:100%;font-family:inherit;font-size:16px;color:var(--ink);background:var(--paper-2);border:1px solid var(--line);border-radius:999px;padding:13px 44px;transition:border-color .2s,box-shadow .2s}
.rv-search input::placeholder{color:var(--ink-soft);opacity:.85}
.rv-search input:focus{outline:none;border-color:var(--brown);box-shadow:0 0 0 3px rgba(122,78,45,.12)}
.rv-search-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:none;align-items:center;justify-content:center;width:30px;height:30px;border:0;background:transparent;color:var(--ink-soft);font-size:1.3rem;line-height:1;cursor:pointer;border-radius:999px;transition:color .2s,background .2s}
.rv-search-clear:hover{color:var(--brown);background:rgba(122,78,45,.08)}
.rv-search.has-text .rv-search-clear{display:inline-flex}
.rv-search-list{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:20;list-style:none;margin:0;padding:6px;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 40px -22px rgba(35,26,18,.55);max-height:300px;overflow-y:auto;display:none}
.rv-search.open .rv-search-list{display:block}
.rv-search-list li{display:flex;flex-direction:column;gap:1px;min-height:44px;justify-content:center;padding:8px 12px;border-radius:8px;cursor:pointer}
.rv-search-list li[aria-selected=true],.rv-search-list li:hover{background:rgba(122,78,45,.09)}
.rv-search-list .rv-sr-name{font-size:.95rem;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.rv-search-list .rv-sr-addr{font-size:.78rem;color:var(--ink-soft)}
.rv-search-list .rv-sr-empty{padding:10px 12px;font-size:.86rem;color:var(--ink-soft);cursor:default}
.rv-search-list .rv-sr-empty:hover{background:transparent}
@media(max-width:600px){.rv-search{max-width:none}}

/* tooltip (hover) + popup (click) share one card look */
.rv-card{font-family:"Manrope",sans-serif;color:var(--ink);min-width:178px}
.rv-eyebrow{font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--brown)}
.rv-name{font-size:1.05rem;font-weight:700;letter-spacing:-.02em;margin-top:3px;line-height:1.2}
.rv-addr{font-size:.82rem;color:var(--ink-soft);margin-top:3px}
.rv-desc{font-size:.86rem;color:var(--ink-soft);margin-top:8px;line-height:1.5;font-weight:300}
.rv-status{display:inline-block;margin-top:10px;font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);border:1px solid var(--line);border-radius:999px;padding:4px 12px}
.rv-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:13px;background:var(--brown);color:#FBF6EE;font-size:.74rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:11px 16px;border-radius:4px;transition:background .2s ease}
.rv-btn:hover{background:var(--coffee);color:#FBF6EE}
/* "Nearby" list inside the project popup — transit (green dot) + university (blue dot),
   colours tied to the map marker legend (--pin-*). Walk/tram time right-aligned. */
.rv-nearby{margin-top:13px;padding-top:12px;border-top:1px solid var(--line)}
.rv-nearby-h{font-size:.6rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:8px}
.rv-nearby ul{list-style:none;display:flex;flex-direction:column;gap:7px}
.rv-nearby li{display:flex;align-items:center;gap:8px;font-size:.84rem;line-height:1.3}
.rv-nd{width:8px;height:8px;border-radius:999px;flex:0 0 auto;box-shadow:0 0 0 1px rgba(27,19,13,.18)}
.rv-nd--transit{background:var(--pin-transit)}
.rv-nd--university{background:var(--pin-university)}
.rv-nn{color:var(--ink);font-weight:500}
.rv-nt{color:var(--ink-soft);margin-left:auto;white-space:nowrap;padding-left:10px}

/* re-skin Leaflet's tooltip + popup chrome to the Rivera palette */
.rv-tip.leaflet-tooltip{background:var(--paper-2);border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 30px -18px rgba(27,19,13,.5);padding:12px 14px;max-width:228px;white-space:normal}
.rv-tip.leaflet-tooltip-top::before{border-top-color:var(--paper-2)}
.leaflet-popup.rv-pop .leaflet-popup-content-wrapper{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 40px -22px rgba(35,26,18,.45)}
.leaflet-popup.rv-pop .leaflet-popup-content{margin:16px 18px;line-height:1.5}
.leaflet-popup.rv-pop .leaflet-popup-tip{background:var(--paper-2);border:1px solid var(--line);box-shadow:none}
.leaflet-popup.rv-pop a.leaflet-popup-close-button{color:var(--ink-soft);padding:9px 9px 0 0}
.leaflet-popup.rv-pop a.leaflet-popup-close-button:hover{color:var(--brown);background:transparent}

/* Leaflet controls in the palette */
.rv-map .leaflet-bar a{color:var(--ink);background:rgba(244,240,233,.92);border-color:var(--line)}
.rv-map .leaflet-bar a:hover{background:var(--brown);color:#FBF6EE}
.rv-map .leaflet-control-attribution{background:rgba(251,249,244,.82);color:var(--ink-soft)}
.rv-map .leaflet-control-attribution a{color:var(--brown)}

@media(prefers-reduced-motion:reduce){.rv-mk,.rv-hero{transition:none}}

/* ---------------- GUIDE (buying guide) ---------------- */
.guide-steps{padding:110px 0;border-bottom:1px solid var(--line)}
.guide-paper{padding:110px 0}
.cred .rev{display:block;margin-top:14px;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.guide-faq{padding:54px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center}
.guide-faq p{color:var(--ink-soft);font-size:1.08rem;font-weight:300}
.guide-faq .lk{margin-top:14px}
.guide-cta{background:var(--espresso);color:var(--sand);padding:104px 0;text-align:center}
.guide-cta .eyebrow{color:var(--tan)}
.guide-cta h2{font-size:clamp(2rem,4vw,3rem);color:#FBF6EE;margin:14px auto 18px;max-width:18ch}
.guide-cta h2 .serif{color:var(--tan)}
.guide-cta p{color:rgba(244,240,233,.78);max-width:46ch;margin:0 auto 32px;font-weight:300;font-size:1.08rem}

/* ---------------- INSIGHTS (market notes — a dated feed) ---------------- */
.last-updated{display:inline-block;margin-top:24px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.note-section{padding:64px 0 110px}
.note-feed{display:grid;grid-template-columns:1fr;gap:24px}
@media(min-width:900px){.note-feed{grid-template-columns:1fr 1fr}}
.note{border:1px solid var(--line);border-radius:12px;padding:30px 28px;background:var(--paper-2);transition:opacity .35s}
.note.hide{display:none}
.note-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}
.note-tag{display:inline-flex;align-items:center;gap:8px;font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.note-tag::before{content:"";width:8px;height:8px;border-radius:999px;background:var(--ink-soft);flex:none}
.note[data-cat=numbers] .note-tag::before{background:var(--brown)}
.note[data-cat=policy] .note-tag::before{background:var(--clay)}
.note[data-cat=desk] .note-tag::before{background:var(--tan)}
.note-date{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);opacity:.8;white-space:nowrap}
.note h3{font-size:1.3rem;font-weight:600;letter-spacing:-.02em;line-height:1.28;margin-bottom:10px}
.note h3 .serif{color:var(--brown)}
.note p{color:var(--ink-soft);font-size:1rem}
.note-src{display:block;margin-top:16px;font-size:.72rem;letter-spacing:.06em;color:var(--ink-soft);opacity:.72}
/* feed cards are now links to detail pages */
.note{display:block;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,opacity .35s}
.note:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(35,26,18,.07)}
.note-more{display:inline-block;margin-top:18px;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brown)}
.note:hover .note-more{color:var(--coffee)}

/* ---------------- PAGE HERO BAND (guide / insights / insight detail) ---------------- */
.page-hero{width:100%;aspect-ratio:21/9;background-size:cover;background-position:center;background-color:var(--sand)}
@media(max-width:860px){.page-hero{aspect-ratio:4/3}}
.pagehead.tight{padding-top:56px}

/* ---------------- INSIGHT DETAIL (article page) ---------------- */
.insight-meta{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.insight-meta[data-cat=numbers] .note-tag::before{background:var(--brown)}
.insight-meta[data-cat=policy] .note-tag::before{background:var(--clay)}
.insight-meta[data-cat=desk] .note-tag::before{background:var(--tan)}
.insight-article{padding:54px 0 96px}
.insight-article .wrap{max-width:760px}
.insight-body p{font-size:1.12rem;color:var(--ink);font-weight:300;line-height:1.75;margin-bottom:22px}
.insight-body p:last-of-type{margin-bottom:0}
.insight-source{display:block;margin-top:34px;padding-top:22px;border-top:1px solid var(--line);font-size:.84rem;color:var(--ink-soft)}
.insight-source a{color:var(--brown);text-decoration:underline}
.insight-back{margin-top:34px}

/* ============================================================
   AURA at Melbourne Square — bespoke "The Ascent" page
   Page-scoped (.au / .au-*). Reuses Rivera tokens + .btn .lk .eyebrow
   .serif .st .pd-back .pd-loc .pd-map* .pd-figs .pd-take-note .pd-cta.
   Dark "sky" chapters use the proven .pd-cta recipe (no new named hex).
   ============================================================ */
.au{position:relative;overflow-x:clip}
.au-rev{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.au-rev.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.au-rev{opacity:1;transform:none}}
.au section{position:relative}
.au-band .wrap,.au-club .wrap,.au-ladder-sec .wrap,.au-garden .wrap{position:relative;z-index:1}

/* ---- shared editorial bits ---- */
.au-edition{display:block;font:600 .62rem/1.5 "Manrope",sans-serif;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-soft)}
.au-chapter{display:block;font:600 .64rem/1.4 "Manrope",sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--brown);opacity:.72;margin-bottom:14px}
.au-club .au-chapter{color:var(--tan);opacity:.8}
.au-folio{font:600 .6rem/1 "Manrope",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--brown);flex:0 0 auto}
.au-fcap{font-size:.84rem;line-height:1.4;color:var(--ink-soft)}
.au h2{font-weight:700;letter-spacing:-.03em;line-height:1.1;font-size:clamp(1.7rem,4vw,2.7rem);color:var(--ink)}
.au-club h2,.au-club-head h2{color:#FBF6EE}
.au-club h2 .serif,.au-bleed-h .serif{color:var(--tan)}
.au-club p{color:rgba(230,218,202,.74)}
.au-band-head p,.au-club-head p,.au-intro p,.au-take p{margin-top:16px;line-height:1.65;font-size:1.05rem;max-width:46ch}
.au-band-head,.au-club-head,.au-ladder-sec .au-band-head{max-width:760px;margin-bottom:8px}

/* ---- altitude rail (desktop gutter only) ---- */
.au-rail{display:none}
@media(min-width:1320px){
  .au-rail{display:block;position:fixed;left:max(20px,calc((100vw - var(--max))/2 - 52px));top:50%;transform:translateY(-50%);height:min(54vh,430px);width:46px;z-index:40;pointer-events:none}
  .au-rail-line{position:absolute;left:5px;top:4px;bottom:4px;width:1px;background:var(--line)}
  .au-rail-tick{position:absolute;left:14px;font:600 .58rem/1 "Manrope",sans-serif;letter-spacing:.12em;color:var(--ink-soft);opacity:.45;transform:translateY(-50%);transition:opacity .35s,color .35s}
  .au-rail-tick[data-band="ground"]{top:4px}
  .au-rail-tick[data-band="07"]{top:23.2%}
  .au-rail-tick[data-band="30"]{top:42.4%}
  .au-rail-tick[data-band="49"]{top:61.6%}
  .au-rail-tick[data-band="66"]{top:80.8%}
  .au-rail-tick[data-band="sky"]{top:calc(100% - 4px)}
  .au-rail-dot{position:absolute;left:2px;top:4px;width:7px;height:7px;border-radius:50%;background:var(--brown);box-shadow:0 0 0 4px var(--paper);transition:top .55s cubic-bezier(.2,.7,.2,1)}
  .au-rail[data-active="ground"] .au-rail-tick[data-band="ground"],
  .au-rail[data-active="07"] .au-rail-tick[data-band="07"],
  .au-rail[data-active="30"] .au-rail-tick[data-band="30"],
  .au-rail[data-active="49"] .au-rail-tick[data-band="49"],
  .au-rail[data-active="66"] .au-rail-tick[data-band="66"],
  .au-rail[data-active="sky"] .au-rail-tick[data-band="sky"]{opacity:1;color:var(--brown);font-weight:700}
}

/* ---- 00 hero (full-bleed immersive video; built on the shared .pd-hero) ---- */
.au-hero{min-height:100svh}
.au-hero .au-edition{color:rgba(251,246,238,.66);margin-bottom:22px}
.au-hero .au-h1{margin:8px 0 0;line-height:.94}
.au-hero .au-h1>span:first-child{display:block;font-weight:800;font-size:clamp(3rem,8.5vw,5.8rem);letter-spacing:.08em;color:#FBF6EE}
.au-hero .au-h1-sub{display:block;font-style:italic;font-weight:400;font-size:clamp(1.3rem,3.3vw,2.1rem);color:var(--tan);margin-top:6px;letter-spacing:0}
.au-hero .au-tagline{font-size:clamp(1.15rem,2.4vw,1.55rem);color:rgba(251,246,238,.88);margin-top:16px;font-style:italic}
.au-hero .pd-loc{margin-top:20px}
.au-hero .pd-tagstrip{margin-top:22px}
.au-hero .au-scrollcue{display:inline-flex;align-items:center;gap:9px;margin-top:32px;font:600 .66rem/1 "Manrope",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,246,238,.72)}
.au-hero .au-scrollcue::after{content:"↓";font-size:.9rem}
@media(prefers-reduced-motion:no-preference){.au-hero .au-scrollcue::after{animation:au-bob 1.8s ease-in-out infinite}}
@keyframes au-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
/* shared-element zoom: the hero film morphs to/from the landing-page featured film */
.au-vt-hero{view-transition-name:aura-hero;filter:saturate(1.12) contrast(1.07) brightness(.95)}
::view-transition-group(aura-hero){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
/* landing-page featured film (index.html) sits behind the warm gradient overlay */
.featured .bg .featvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
/* the warm overlay becomes a translucent scrim so the film shows through (text sits left, kept dark for contrast) */
.featured .bg::before{z-index:1;background:linear-gradient(100deg,rgba(18,12,7,.9) 0%,rgba(18,12,7,.55) 46%,rgba(18,12,7,.2) 100%)}
.featured .featured-in{width:100%}  /* keep copy left-aligned over the darkest scrim, not centred over the bright film */

/* ---- gallery strip directly under hero ---- */
.au-strip-sec{background:var(--paper);padding:0 0 clamp(46px,7vw,84px)}
.au-strip-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;padding-top:clamp(30px,4vw,48px);padding-bottom:18px}
.au-strip-note{font-size:.86rem;color:var(--ink-soft);max-width:48ch}
.au-strip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px clamp(20px,5vw,64px)}
.au-strip::-webkit-scrollbar{display:none}
.au-frame{flex:0 0 min(64vw,400px);scroll-snap-align:start;position:relative;margin:0;border-radius:12px;overflow:hidden;background:var(--coffee)}
.au-frame img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}
.au-frame figcaption{position:absolute;inset:auto 0 0 0;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;padding:16px;background:linear-gradient(to top,rgba(27,19,13,.78),rgba(27,19,13,0))}
.au-frame .au-folio{color:var(--tan)}
.au-frame .au-fcap{color:#FBF6EE;font-weight:500}
.au-strip-prog{display:block;height:2px;background:var(--brown);opacity:.45;transform:scaleX(.18);transform-origin:left;transition:transform .1s linear;margin-top:16px}
@media(max-width:680px){.au-frame{flex-basis:80vw}}

/* ---- 01 intro ---- */
.au-intro{background:var(--paper);padding:clamp(64px,9vw,120px) 0}
.au-intro-in{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(36px,5vw,72px);align-items:center}
.au-prose{max-width:48ch}
.au-pull{font-family:var(--serif);font-style:italic;font-size:clamp(1.35rem,2.7vw,1.9rem);color:var(--brown);margin-top:28px;line-height:1.3}
.au-intro-plates{display:grid;gap:18px}

/* ---- plates (image + caption below) ---- */
.au-plate{margin:0}
.au-plate img{display:block;width:100%;border-radius:12px;object-fit:cover;aspect-ratio:4/3;background:var(--sand)}
.au-plate figcaption{display:flex;align-items:baseline;gap:12px;padding-top:10px}
.au-club .au-plate .au-fcap,.au-club .au-feature .au-fcap{color:rgba(230,218,202,.7)}
.au-club .au-plate .au-folio,.au-club .au-feature .au-folio{color:var(--tan)}

/* ---- bands & clubs ---- */
.au-band{background:var(--paper-2);padding:clamp(64px,9vw,120px) 0;overflow:hidden}
.au-club{background:var(--coffee);color:#FBF6EE;padding:clamp(72px,10vw,128px) 0;overflow:hidden}
.au-club[data-band="49"]{background:var(--espresso)}
.au-crown{background:var(--espresso)}
.au-crown::before{content:"";position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(1.6px 1.6px at 18% 24%,rgba(201,169,130,.5),transparent),
  radial-gradient(1.4px 1.4px at 72% 18%,rgba(201,169,130,.42),transparent),
  radial-gradient(1.2px 1.2px at 46% 56%,rgba(201,169,130,.4),transparent),
  radial-gradient(1px 1px at 86% 64%,rgba(201,169,130,.36),transparent),
  radial-gradient(1.3px 1.3px at 32% 78%,rgba(201,169,130,.34),transparent),
  linear-gradient(to bottom,rgba(0,0,0,.34),rgba(0,0,0,.56))}
.au-num-ghost{position:absolute;left:max(8px,calc((100vw - var(--max))/2));top:clamp(8px,2.5vw,34px);font-family:var(--serif);font-style:italic;font-size:clamp(7rem,22vw,17rem);line-height:.8;color:var(--brown);opacity:.09;pointer-events:none;z-index:0}
.au-club .au-num-ghost{color:var(--tan);opacity:.13}
.au-ladder-sec .au-num-ghost{opacity:.07}
.au-feature{margin:clamp(28px,4vw,48px) 0 0}
.au-feature img{display:block;width:100%;border-radius:14px;aspect-ratio:16/9;object-fit:cover;background:var(--coffee)}
.au-feature figcaption{display:flex;align-items:baseline;gap:12px;padding-top:12px}
.au-crown .au-feature img{aspect-ratio:4/5}
.au-amen-list{list-style:none;margin:clamp(28px,4vw,46px) 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(28px,4vw,56px);max-width:780px}
.au-amen-list li{display:flex;gap:14px;align-items:baseline;padding:13px 0;border-top:1px solid var(--line-d)}
.au-amen-list .fi{font-family:var(--serif);font-style:italic;color:var(--tan);font-size:1.05rem;min-width:24px;flex:0 0 auto}
.au-amen-list li span:last-child{color:rgba(230,218,202,.88);font-size:.98rem}
.au-garden{background:var(--coffee);position:relative;margin-top:clamp(50px,7vw,92px);padding:clamp(50px,7vw,92px) 0;border-top:1px solid var(--line-d)}
.au-garden::before{content:"";position:absolute;inset:0;background:rgba(201,169,130,.07);pointer-events:none}
.au-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:clamp(24px,3vw,40px)}
.au-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:clamp(24px,3vw,40px)}
.au-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:clamp(24px,3vw,40px)}
.au-grid-3 .au-plate img,.au-grid-4 .au-plate img{aspect-ratio:4/3}
.au-payoff{text-align:center;font-family:var(--serif);font-style:italic;color:var(--tan);font-size:clamp(1.8rem,5vw,3.4rem);line-height:1.15;margin:clamp(46px,7vw,90px) auto 0;max-width:18ch}

/* ---- 04 collections ladder ---- */
.au-ladder-sec{background:var(--paper-2);padding:clamp(64px,9vw,120px) 0;overflow:hidden}
.au-schemekey{display:flex;align-items:center;gap:9px;margin-top:20px;flex-wrap:wrap;font-size:.82rem;color:var(--ink-soft)}
.au-swatch{width:15px;height:15px;border-radius:50%;display:inline-block;border:1px solid var(--line)}
.au-swatch-light{background:var(--sand)}
.au-swatch-dark{background:var(--coffee)}
.au-swatch-label{margin-right:16px}
.au-ladder{display:flex;flex-direction:column-reverse;margin-top:clamp(32px,5vw,54px);border-top:1px solid var(--line)}
.au-rung{display:grid;grid-template-columns:minmax(210px,.9fr) 1.5fr;gap:clamp(20px,4vw,52px);align-items:center;padding:clamp(28px,4vw,46px) 0;border-bottom:1px solid var(--line);transition:background .3s}
.au-rung:hover{background:rgba(122,78,45,.03)}
.au-rung-badge{display:inline-block;font:700 .7rem/1 "Manrope",sans-serif;letter-spacing:.12em;color:var(--brown);border:1px solid var(--line);border-radius:999px;padding:7px 13px}
.au-rung h3{font-size:clamp(1.5rem,3vw,2.15rem);font-weight:600;margin-top:14px;color:var(--ink);letter-spacing:-.01em}
.au-rung-text p{margin-top:10px;color:var(--ink-soft);font-size:.98rem;max-width:42ch;line-height:1.55}
.au-rung-img{margin:0}
.au-rung-img img{display:block;width:100%;border-radius:10px;aspect-ratio:3/2;object-fit:cover;background:var(--sand)}
.au-rung-img figcaption{padding-top:8px;font-size:.78rem;color:var(--ink-soft)}
.au-rung-imgs{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ---- 07 view ---- */
.au-view{background:var(--paper);padding:0 0 clamp(60px,9vw,110px)}
.au-bleed{position:relative;margin:0;width:100%}
.au-bleed img{display:block;width:100%;height:clamp(340px,68svh,700px);object-fit:cover}
.au-bleed-cap{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:8px;padding:clamp(26px,5vw,64px);color:#FBF6EE;background:linear-gradient(to top,rgba(27,19,13,.72),rgba(27,19,13,0))}
.au-bleed-cap .eyebrow.light{margin-bottom:4px}
.au-bleed-h{font-weight:700;font-size:clamp(1.7rem,4.4vw,2.9rem);line-height:1.08;letter-spacing:-.02em}
.au-bleed-cap .au-fcap{color:rgba(251,246,238,.86)}
.au-wide{margin-top:clamp(28px,4vw,52px)}
.au-wide img{aspect-ratio:21/9}

/* ---- 08 location ---- */
.au-loc{background:var(--paper-2);padding:clamp(64px,9vw,120px) 0}
.au-loc-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:start}
.au-walk{display:flex;align-items:baseline;gap:20px;margin:16px 0 26px}
.au-walk-num{font-family:var(--serif);font-style:italic;font-size:clamp(4rem,9vw,7rem);color:var(--brown);line-height:.78}
.au-walk-cap{color:var(--ink-soft);font-size:1rem;max-width:15ch;line-height:1.4}
.au-minutes{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.au-minutes li{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
.au-min-t{flex:0 0 92px;font-weight:600;color:var(--ink)}
.au-min-d{color:var(--ink-soft);font-size:.96rem;line-height:1.5}
.au-loc-note{margin-top:22px;color:var(--brown);font-size:.96rem}

/* ---- 09 particulars ---- */
.au-particulars{background:var(--paper);padding:clamp(64px,9vw,120px) 0}
.au-particulars-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:start}
.au-ledger-date{display:block;font-size:.8rem;color:var(--ink-soft);letter-spacing:.04em;margin:8px 0 16px}
.au-price-ladder{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.au-price-ladder li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.au-pl-k{font-weight:600;color:var(--ink);font-size:1.02rem}
.au-pl-v{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,3vw,2.2rem);color:var(--brown);white-space:nowrap}
.au-pl-v small{font-family:"Manrope",sans-serif;font-style:normal;font-size:.7rem;letter-spacing:.04em;color:var(--ink-soft);margin-right:7px}
.au-pl-tail{margin-top:14px;color:var(--ink-soft);font-size:.92rem;max-width:42ch}
.au-colophon{list-style:none;margin:clamp(30px,4vw,46px) 0 0;padding:0}
.au-colophon li{display:flex;justify-content:space-between;gap:18px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.au-co-k{color:var(--ink-soft)}
.au-co-v{color:var(--ink);text-align:right;font-weight:500}
.au-take h2{margin:12px 0 0;font-size:clamp(1.6rem,3.4vw,2.4rem)}
.au-take h2 .serif{color:var(--brown)}
.au-take .pd-figs{margin-top:28px}
.au-take .pd-take-note{margin-top:20px}
.au-take-plate{margin-top:28px}
.au-take-plate img{aspect-ratio:3/2}

/* ---- CTA ---- */
.au-cta .au-edition-end{display:block;color:var(--tan);opacity:.65;margin-bottom:22px}
.au-cta h2{color:#FBF6EE}  /* keep the sans "Arrange a" legible on the dark band */

/* ---- responsive ---- */
@media(max-width:980px){
  .au-intro-in,.au-loc-in,.au-particulars-in{grid-template-columns:1fr}
  .au-grid-4{grid-template-columns:1fr 1fr}
  .au-rung{grid-template-columns:1fr;gap:18px}
  .au-amen-list{max-width:none}
}
@media(max-width:680px){
  .au-grid-2,.au-grid-3,.au-grid-4,.au-rung-imgs{grid-template-columns:1fr}
  .au-amen-list{grid-template-columns:1fr}
  .au-walk{flex-direction:column;gap:8px}
  .au-min-t{flex-basis:auto}
  .au-bleed img{height:54svh}
}

/* ============================================================
   Market note — long-form policy article (.ins-*). Page-scoped.
   Reuses Rivera tokens; adds subheads, a callout and a checklist
   for a richer insight body than the default p-only flow.
   ============================================================ */
.ins-h{font-size:1.42rem;font-weight:600;line-height:1.28;margin:44px 0 16px;color:var(--ink)}
.ins-h .serif{font-weight:400}
.insight-body > .ins-h:first-child{margin-top:0}
.ins-note{margin:32px 0;padding:20px 26px;background:var(--paper-2);border-left:3px solid var(--clay);border-radius:4px}
.ins-note p{font-size:1rem;color:var(--ink-soft);margin:0;line-height:1.72}
.ins-check{margin:46px 0 8px;padding:32px 32px 34px;background:var(--paper-2);border:1px solid var(--line);border-radius:8px}
.ins-check-h{display:block;font-family:var(--serif);font-style:italic;font-size:1.85rem;color:var(--brown);margin:0 0 8px;line-height:1.1}
.ins-check-sub{display:block;font-size:.96rem;color:var(--ink-soft);margin-bottom:22px;line-height:1.6}
.ins-group{margin-top:26px}
.ins-group:first-of-type{margin-top:0}
.ins-group h4{font-size:.74rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--brown);margin:0 0 13px}
.ins-group ul{list-style:none;margin:0;padding:0}
.ins-group li{position:relative;padding-left:30px;margin-bottom:12px;font-size:1.01rem;color:var(--ink);font-weight:300;line-height:1.62}
.ins-group li:last-child{margin-bottom:0}
.ins-group li::before{content:"";position:absolute;left:3px;top:.36em;width:9px;height:14px;border:solid var(--clay);border-width:0 2px 2px 0;transform:rotate(40deg)}
@media(max-width:680px){
  .ins-check{padding:24px 22px 26px}
  .ins-check-h{font-size:1.6rem}
  .ins-h{font-size:1.3rem}
}