/* AUREUM Residences: approved navy, teal, sand, champagne and ivory palette. */
:root {
  --navy: #0e2a47;
  --navy-deep: #081e34;
  --teal: #1f7a7a;
  --sand: #e6d5bf;
  --gold: #d9b574;
  --ivory: #f7f3e8;
  --paper: var(--ivory);
  --cream: #efe5d7;
  --ink: var(--navy);
  --olive: var(--navy);
  --muted: #5b6d7d;
  --line: #d8ccba;
  --sans: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --serif: var(--sans);
}
body { background: var(--ivory); color: var(--navy); font-family: var(--sans); font-weight: 400; }
::selection { background: var(--gold); color: var(--navy); }
:focus-visible { outline-color: var(--teal); }
h1, h2, h3, .intro-copy .lead, .intro-note > p, .gallery-quote > p { font-weight: 300; }
h2 { font-size: clamp(42px, 4.8vw, 66px); line-height: 1.12; letter-spacing: -2px; }
h2 em, h3 em, .intro-note em { color: var(--teal); font-style: normal; }
.eyebrow, .section-label { font-weight: 500; }
.section-label > span { color: var(--teal); }
.text-link, .download-link, .floorplan-download { border-color: #b3bfc5; }
.text-link:hover, .download-link:hover, .floorplan-download:hover { color: var(--teal); }
.button { font-weight: 500; letter-spacing: .1px; }
.button-light { background: linear-gradient(115deg, #f0dbb5, var(--gold)); color: var(--navy); border-color: var(--gold); }
.button-light:hover { background: var(--ivory); color: var(--navy); }
.button-olive { background: var(--navy); color: var(--ivory); border-color: var(--navy); }
.button-olive:hover { background: var(--teal); border-color: var(--teal); }

/* A compact horizontal signature uses the same A, buildings and wave as the supplied mark. */
.header { height: 108px; background: linear-gradient(115deg, var(--navy), var(--navy-deep)); color: var(--ivory); border-bottom: 1px solid #d9b57455; }
.header[data-scrolled=true] { box-shadow: 0 7px 28px #081e3429; }
.brand { gap: 15px; flex-shrink: 0; }
.header .brand-mark, .footer-brand .brand-mark { width: 67px; height: 42px; object-fit: contain; flex-shrink: 0; }
.header .brand-type, .footer-brand .brand-type, .aureum-wordmark { color: var(--gold); font-family: var(--sans); font-weight: 300; font-size: 27px; line-height: 1.2; letter-spacing: .29em; white-space: nowrap; }
.brand-type small, .aureum-wordmark small { display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--sand); font: 400 8px/2.6 var(--sans); letter-spacing: .4em; padding-right: .15em; }
.brand-type small::before, .brand-type small::after, .aureum-wordmark small::before, .aureum-wordmark small::after { content: ''; width: 17px; height: 1px; background: var(--gold); opacity: .75; }
.desktop-nav { margin-left: 1%; gap: 24px; }
.desktop-nav a { font-size: 10px; color: var(--ivory); }
.desktop-nav a::after { background: var(--gold); }
.header-contact { border-color: #d9b57488; color: var(--ivory); font-size: 10px; }
.header-contact:hover { background: var(--gold); color: var(--navy); }
.header .language { color: var(--sand); }
.header .menu-toggle span { background: var(--ivory); }
.header :focus-visible { outline-color: var(--gold); }
.mobile-nav:not([hidden]) { background: var(--navy); color: var(--ivory); border-bottom: 1px solid #d9b57466; box-shadow: 0 14px 28px #081e3430; }
.mobile-nav a { font-weight: 300; }
.mobile-nav > span { color: var(--sand); }
.reading-progress { background: var(--gold); height: 2px; }

.hero-shade { background: linear-gradient(90deg, #081e34ad, #0e2a4710 85%), linear-gradient(0deg, #081e34d9, transparent 85%); }
.hero h1 { font-size: clamp(64px, 6.1vw, 98px); line-height: 1.1; letter-spacing: -3px; font-weight: 300; }
.hero h1 em { color: #efd5a5; font-style: normal; font-size: 1em; }
.hero-content > .eyebrow { color: #f0d9ad; font-size: 9px; letter-spacing: 2.6px; }
.hero-content { bottom: 122px; }
.hero-description { color: var(--ivory); font-size: 13px; }
.hero-secondary-action { color: var(--ivory); border-color: #d9b574a6; }
.hero-slides > button.active, .hero-top { color: var(--ivory); }
.hero-slides > button.active::after { background: var(--gold); }
.hero-slides > span { color: var(--sand); }
.explore-circle { border-color: #d9b574b3; }
.project-facts { background: var(--navy); color: var(--ivory); border-top: 1px solid #d9b57444; }
.project-facts strong { color: var(--gold); font-weight: 300; font-size: 42px; letter-spacing: -1px; }
.project-facts > div { border-color: #d9b57444; }
.project-facts > div > span { color: var(--sand); font-size: 8px; }
.intro-copy .lead { font-size: 25px; line-height: 1.5; }
.intro-note > p { font-size: 43px; line-height: 1.24; letter-spacing: -1px; }
.aureum-note-mark { width: 90px; height: 58px; object-fit: contain; margin-bottom: 20px; }
.photo-note, .image-label { color: var(--muted); }
.image-label { background: #f7f3e8e8; }

.residences { background: linear-gradient(130deg, var(--navy), var(--navy-deep)); color: var(--ivory); border-top: 1px solid #d9b57455; }
.residences h2, .residences h3 { color: var(--ivory); }
.residences h2 em { color: var(--gold); }
.residences .section-label, .residences .section-label > span { color: var(--gold); }
.residence-heading > p, .residence-card > p { color: #d3dee3; }
.residence-toolbar, .card-footer { border-color: #d9b57444; }
.filter { color: #d4dfe5; }
.filter.active { color: var(--gold); border-color: var(--gold); }
.card-number { color: var(--ivory); background: #0e2a47df; }
.card-arrow { color: var(--navy); background: var(--gold); }
.card-title h3 { font-size: 25px; line-height: 1.25; font-weight: 300; letter-spacing: -.7px; }
.card-title > span { color: var(--gold); }
.card-footer { color: var(--sand); }
.card-footer button { color: var(--ivory); }
.residence-bottom > p { color: #b9cad5; }
.residence-match-label, .residence-bottom .match-inline-trigger { color: var(--gold); border-color: #d9b57488; }
.residence-match-label::before { content: ''; width: 27px; height: 20px; background: url('assets/aureum-mark.svg') center/contain no-repeat; }

.floorplan-types button { color: var(--muted); border-color: var(--line); }
.floorplan-types button.active { color: var(--ivory); background: var(--navy); border-color: var(--navy); }
.floorplan-board { background: #f0e7db; border-color: var(--line); }
.floorplan-board-top { border-color: #d6c8b4; color: var(--navy); }
.floorplan-board-top > button { color: var(--navy); }
.floorplan-levels button { color: var(--navy); border-color: #c6b79e; }
.floorplan-levels button.active { background: var(--navy); color: var(--ivory); border-color: var(--navy); }
.floorplan-info h3 { font-size: 43px; font-weight: 300; line-height: 1.16; }
.floorplan-subtitle { color: var(--teal); font-size: 22px; }
.floorplan-info > .eyebrow { color: var(--teal); }
.floorplan-info dl > div { border-color: var(--line); }
.floorplan-info .floorplan-note { color: var(--muted); }
.amenities { background: #e6d5bf66; border-block: 1px solid #d9b57433; }
.amenities h2 { font-size: 45px; }
.amenities-grid { border-color: #cdbb9e; }
.amenities-grid svg { color: var(--teal); }
.amenities-grid h3 { font-size: 21px; line-height: 1.3; font-weight: 300; }
.amenities-note { color: var(--muted); font-size: 9px; }
.plan-visual { background: #f0e7db; border-color: var(--line); }
.plan-blocks > button { color: var(--navy); border-color: #b8c4c9; }
.plan-blocks > button.active { background: var(--navy); border-color: var(--navy); color: var(--ivory); }
.plan-marker { background: var(--ivory); border-color: var(--gold); color: var(--navy); }
.plan-marker.active { background: var(--teal); color: var(--ivory); }
.plan-info > .eyebrow, .plan-building-index { color: var(--teal); }
#block-description h3 { font-size: 37px; font-weight: 300; line-height: 1.16; }
.plan-details { color: var(--muted); }
.plan-details span::before { background: var(--teal); }

.location { background: var(--navy); color: var(--ivory); }
.location-copy h2 { font-size: clamp(40px, 4.1vw, 59px); line-height: 1.15; }
.location-copy h2 em { color: var(--gold); }
.location-copy .section-label, .location-copy .section-label > span { color: var(--gold); }
.location-place { color: var(--sand); }
.location-copy > p:not(.eyebrow):not(.location-place) { color: #d2dee6; }
.location-distance { border-color: #d9b57455; }
.location-distance > strong { color: var(--gold); font-weight: 300; }
.location-distance > span, .location-distance > svg { color: var(--sand); }
.location-copy .text-link { color: var(--ivory); border-color: #d9b57488; }
.location-copy .map-note { color: #bacbd6; }
.slow-badge, .around-source, .around-choices > .eyebrow { color: var(--teal); }
.around-source { border-color: #9bb6b5; }
.around-photo::after { background: linear-gradient(0deg, #081e3490, transparent 55%); }
.around-photo-caption { color: var(--ivory); }
.around-buttons, .around-buttons > button { border-color: var(--line); }
.around-buttons > button { color: #6a7b89; }
.around-buttons > button.active { color: var(--teal); }
.around-buttons strong { font-weight: 300; font-size: 30px; line-height: 1.15; }
.around-note { color: var(--muted); }
.gallery-quote { background: var(--navy); color: var(--ivory); }
.gallery-quote > p { font-size: 27px; line-height: 1.35; }
.gallery-quote em, .gallery-quote > small { color: var(--gold); }
.gallery-disclaimer { color: var(--muted); }
.faq h2 { font-size: 47px; }
.faq details { border-color: var(--line); }
.faq details:last-child { border-color: var(--line); }
.faq summary > span { color: var(--teal); }

.contact { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(125deg, var(--navy), var(--navy-deep)); color: var(--ivory); border-top: 1px solid #d9b57488; }
.contact::before { content: ''; position: absolute; right: -65px; bottom: -50px; width: 650px; height: 370px; background: url('assets/aureum-mark.svg') center/contain no-repeat; opacity: .055; z-index: -1; pointer-events: none; }
.contact .section-label, .contact .section-label > span { color: var(--gold); }
.contact-copy h2 { font-size: 65px; font-weight: 300; line-height: 1.12; }
.contact-copy h2 em { color: var(--gold); }
.contact-copy > p:not(.eyebrow) { color: #cbd9e3; }
.contact-address > span:first-child { font-family: var(--sans); font-weight: 300; font-size: 26px; }
.contact-address > span:nth-child(2) { color: var(--sand); }
.contact-address > small { color: #bacbd6; font-size: 7px; }
.contact-signature > span:last-child { font-family: var(--sans); font-weight: 300; letter-spacing: 5px; color: var(--gold); font-size: 24px; }
.contact-signature small { letter-spacing: 3px; color: var(--sand); }
.signature-line { background: var(--gold); }
.form-kicker { color: var(--gold); }
.contact-form label, .contact-form .consent > span { color: var(--ivory); }
.contact-form label > span { color: #c1d1dc; }
.contact-form input:not([type=checkbox]), .contact-form select, .contact-form textarea { color: var(--ivory); border-color: #d9b57477; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #aebfcd; }
.contact-form select option { background: var(--navy); color: var(--ivory); }
.contact-form input[type=checkbox] { accent-color: var(--gold); }
.contact-form .button { background: linear-gradient(115deg, #f0dbb5, var(--gold)); color: var(--navy); border-color: var(--gold); }
.contact-form .button:hover { background: var(--ivory); }
.form-demo { color: #b4c6d3; }
.form-result { background: #163d59; color: var(--ivory); border-color: var(--gold); }
.form-result button { color: var(--gold); border-color: var(--gold); }
.footer { background: var(--navy-deep); color: var(--ivory); padding-top: 52px; border-top: 1px solid #d9b57455; }
.footer-brand .brand-mark { width: 76px; height: 49px; }
.footer-brand .brand-type { font-size: 31px; }
.footer-links { color: var(--ivory); }
.footer-links > button { color: var(--ivory); }
.back-top { color: var(--gold); border-color: #d9b57488; }
.footer-bottom { border-color: #d9b57444; color: var(--sand); font-size: 8px; }
.footer-disclaimer { color: #b1c2d0; font-size: 9px; line-height: 1.9; }

.solea-intro, .solea-intro::backdrop { background: var(--navy-deep); }
.intro-shade { background: linear-gradient(0deg, #081e34e0, transparent 82%), linear-gradient(90deg, #0e2a4760, transparent); }
.intro-brand { display: flex; align-items: center; gap: 19px; font: inherit; letter-spacing: normal; }
.aureum-intro-mark { width: 85px; height: 53px; object-fit: contain; }
.intro-brand .aureum-wordmark { font-size: 33px; letter-spacing: .32em; }
.intro-brand .aureum-wordmark small { font-size: 8px; letter-spacing: .42em; }
.intro-edition { color: var(--sand); }
.cinema-copy h2 { font-size: clamp(48px, 6.4vw, 94px); font-weight: 300; line-height: 1.1; }
.cinema-copy h2 em { color: #efd5a5; font-style: normal; }
.cinema-copy > .eyebrow, .intro-bottom > div > span:first-child { color: var(--gold); }
.intro-bottom button { color: var(--ivory); border-color: var(--gold); }
.solea-intro progress::-webkit-progress-value, .solea-intro progress::-moz-progress-bar { background: var(--gold); }
.solea-film-dialog { background: var(--navy); color: var(--ivory); }
.film-heading > .eyebrow, .film-footer { color: var(--sand); }
.film-heading h2 { font-size: 35px; font-weight: 300; }
.film-heading h2 em { color: var(--gold); }
.film-stage { background: var(--navy-deep); }
.film-unavailable { background: #0e2a47ad; }
.film-footer > button, .film-footer > a { color: var(--ivory); border-color: var(--gold); }
.plan-lightbox.gallery-dialog { background: var(--ivory); color: var(--navy); }
.plan-lightbox .dialog-close { background: #f7f3e8e8; color: var(--navy); }
.about-dialog { background: var(--ivory); color: var(--navy); }
.about-dialog h2 { font-weight: 300; }
.about-dialog::backdrop, .gallery-dialog::backdrop, .residence-dialog::backdrop, .solea-film-dialog::backdrop { background: #081e34b3; backdrop-filter: blur(7px); }
.gallery-dialog { background: var(--navy-deep); color: var(--ivory); }
.lightbox-arrow { background: #0e2a47cc; color: var(--ivory); }

.match-dialog { --match-olive: var(--teal); --match-ivory: var(--ivory); color: var(--navy); background: var(--ivory); box-shadow: 0 25px 100px #081e3459; border: 1px solid #d9b57466; }
.match-dialog::backdrop { background: #081e34b0; }
.match-close { border-color: #c4b799; }
.match-topline { color: var(--navy); }
.match-topline > span:last-child, .match-intro, .match-step-label { color: var(--muted); }
.match-progress-part { background: #ded4c4; }
.match-progress-part.match-current { background: var(--teal); }
.match-title { font-size: 43px; line-height: 1.15; font-weight: 300; }
.match-title em { font-style: normal; color: var(--teal); }
.match-option-card { background: #f0e8dc; border-color: #d6c7b0; }
.match-option-card strong { font-weight: 300; font-size: 25px; line-height: 1.18; }
.match-option:hover .match-option-card { border-color: var(--teal); }
.match-primary:hover { background: var(--navy); }
.match-text-button, .match-loading, .match-plan-caption, .match-result-eyebrow, .match-result-copy > p:not(.match-result-eyebrow), .match-area-note { color: var(--muted); }
.match-text-button { border-color: #b8c5c8; }
.match-plan { background: #efe5d7; }
.match-result-copy h3 { font-weight: 300; font-size: 31px; line-height: 1.15; }
.match-facts > div { border-color: var(--line); }
.match-option input:focus-visible + .match-option-card, .match-dialog button:focus-visible { outline-color: var(--teal); }

@media (max-width: 1200px) {
  .desktop-nav { gap: 18px; }
  .header .brand-mark { width: 58px; height: 37px; }
  .header .brand-type { font-size: 24px; letter-spacing: .25em; }
  .header-actions { gap: 17px; }
  .header-contact { padding-inline: 12px; gap: 18px; }
  .hero h1 { font-size: clamp(64px, 6.8vw, 88px); }
  .card-title h3 { font-size: 27px; }
}
@media (max-width: 1050px) {
  .header { height: 92px; padding-inline: 5%; }
  .desktop-nav { display: none; }
  .menu-toggle { display: block; }
  .mobile-nav:not([hidden]) { display: flex; position: absolute; top: 92px; left: 0; right: 0; z-index: 25; padding: 28px 7%; flex-direction: column; gap: 12px; }
  .mobile-nav a { font-family: var(--sans); font-size: 27px; line-height: 1.5; }
  .mobile-nav > span { font-size: 7px; letter-spacing: 1.5px; margin-top: 15px; }
  .amenities h2 { font-size: 39px; }
  .location-copy h2 { font-size: 42px; }
  .contact-copy h2 { font-size: 53px; }
}
@media (max-width: 600px) {
  .header { height: 85px; padding-inline: 5%; }
  .header .brand { gap: 10px; }
  .header .brand-mark { width: 49px; height: 33px; }
  .header .brand-type { font-size: 23px; letter-spacing: .24em; }
  .header .brand-type small { font-size: 6.5px; letter-spacing: .35em; gap: 7px; }
  .brand-type small::before, .brand-type small::after { width: 12px; }
  .header-actions { gap: 17px; }
  .mobile-nav:not([hidden]) { top: 85px; }
  h2 { font-size: clamp(34px, 9.4vw, 46px); line-height: 1.16; letter-spacing: -1.2px; }
  .hero h1 { font-size: clamp(31px, 9.3vw, 53px); line-height: 1.2; letter-spacing: -1.5px; }
  .hero-content { bottom: 124px; }
  .hero-content > .eyebrow { font-size: 6px; letter-spacing: 2px; }
  .hero-description { font-size: 11px; }
  .hero-content .button { min-width: 223px; font-size: 10px; }
  .project-facts strong { font-size: 34px; }
  .project-facts > div > span { font-size: 6px; }
  .intro-copy .lead { font-size: 23px; }
  .intro-note > p { font-size: 30px; }
  .aureum-note-mark { width: 62px; height: 42px; margin: 0; grid-row: 1 / 3; }
  .intro-note { grid-template-columns: 62px 1fr; padding-top: 32px; }
  .card-title h3 { font-size: 27px; }
  .card-title > span { font-size: 6px; }
  .residence-card > p { font-size: 12px; }
  .floorplan-info h3 { font-size: 35px; }
  .floorplan-subtitle { font-size: 19px; }
  .amenities h2 { font-size: 34px; }
  .amenities-grid h3 { font-size: 19px; }
  .amenities-note { font-size: 9px; }
  #block-description h3 { font-size: 32px; }
  .location-copy h2 { font-size: clamp(35px, 9.9vw, 49px); }
  .around-buttons strong { font-size: 20px; line-height: 1.2; }
  .around-buttons small { letter-spacing: .8px; }
  .around-buttons > button.active { border-bottom-color: var(--teal); }
  .faq h2 { font-size: 37px; }
  .contact-copy h2 { font-size: 46px; }
  .contact-address { font-size: 11px; }
  .contact-address > span:first-child { font-size: 26px; }
  .footer-brand { gap: 10px; }
  .footer-brand .brand-mark { width: 48px; height: 33px; }
  .footer-brand .brand-type { font-size: 25px; letter-spacing: .2em; }
  .footer-brand .brand-type small { font-size: 6px; letter-spacing: .35em; gap: 7px; }
  .footer-bottom { font-size: 6px; letter-spacing: .6px; }
  .footer-disclaimer { font-size: 8px; }
  .intro-brand { gap: 12px; }
  .aureum-intro-mark { width: 60px; height: 39px; }
  .intro-brand .aureum-wordmark { font-size: 25px; letter-spacing: .25em; }
  .intro-brand .aureum-wordmark small { font-size: 6px; letter-spacing: .37em; gap: 7px; }
  .aureum-wordmark small::before, .aureum-wordmark small::after { width: 13px; }
  .cinema-copy h2 { font-size: clamp(37px, 10vw, 54px); line-height: 1.2; letter-spacing: -1.3px; }
  .film-heading h2 { font-size: 28px; }
  .match-title { font-size: 34px; letter-spacing: -1.2px; }
  .match-result-copy h3 { font-size: 29px; }
  .match-option-card strong { font-size: 22px; }
}
@media (max-width: 365px) {
  .header .brand-type { font-size: 21px; letter-spacing: .21em; }
  .header .brand-mark { width: 43px; }
  .header .brand-type small { font-size: 6px; letter-spacing: .3em; }
  .header-actions { gap: 12px; }
  .card-title h3 { font-size: 24px; }
  .card-title > span { font-size: 5px; }
  .around-buttons strong { font-size: 17px; }
  .intro-note { gap: 12px 17px; }
  .intro-note > p { font-size: 27px; }
  .footer-brand .brand-type { font-size: 23px; }
}
