/* ==========================================================================
   ALÜM — owner-approved site review · 28 Oct 2026
   Loaded after site.css on the public marketing pages.
   Unchanged by design: the background film, its poster, the home hero and its
   wordmark, and the translucent 85–92% section grounds over the film.
   ========================================================================== */

/* ---------- 03 · two registers: light opens, heavy states, Jost reads ---------- */
body{font-family:var(--jost);font-weight:300}
.lede,.body,.card p,.amenity .copy p,.stack-list p,.plan-row .body p,.places .what,.spec .v,.prose p,.prose li,.foot-tag{font-family:var(--jost);font-weight:300}
.lede,.body{font-size:18px;line-height:1.6}
.line{font-family:var(--jost);font-weight:400;font-size:clamp(20px,1.6vw,22px);letter-spacing:0;line-height:1.4}
.heavy,.h-section,.h-section.caps,.hero-copy h1,.hero-page .hero-title,.card h3,.amenity .copy h3,.plan-row summary .t{text-transform:none;letter-spacing:-.012em;line-height:1}
.h-section{text-wrap:balance}
/* light-register opener: the section's existing label, lowercase, never read twice */
.h-section[data-opener]{container-type:inline-size}
.h-section[data-opener]::before{content:attr(data-opener);content:attr(data-opener) / "";display:block;font-family:var(--jost);font-weight:200;font-size:clamp(36px,11cqw,112px);letter-spacing:.16em;line-height:1;text-transform:lowercase;white-space:nowrap;overflow:hidden;margin:0 0 .32em -.04em}
/* section labels: Archivo running head, gold numeral, a thin ink rule */
.sec-head{border-bottom:1px solid var(--ink)}
.bg-ink .sec-head,.bg-oxblood .sec-head,.inquire .sec-head{border-bottom-color:rgba(236,229,210,.45)}
.sec-head .idx{font-family:var(--archivo);font-weight:600;font-size:11px;letter-spacing:.18em;text-transform:uppercase;gap:.9em}
.sec-head .idx b,.bg-ink .sec-head .idx b{font-weight:600;color:var(--gold)}

/* ---------- 04 · colour roles: gold leads, oxblood is a ground ---------- */
.btn-oxblood{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.btn-oxblood:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.menu-open .btn-oxblood:hover,.inquire .btn-oxblood:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.nav-primary a::after,.nav-cta a.link::after{background:var(--gold)}
.arrow-link{border-bottom-color:var(--gold)}
.stack-list .n,.plan-row summary .n{color:var(--gold)}
:focus-visible,.frame[data-gallery]:focus-visible,.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:2px solid var(--ink);outline-offset:4px;box-shadow:0 0 0 2px var(--gold)}
.bg-ink :focus-visible,.inquire :focus-visible,.site-footer :focus-visible,.menu-panel :focus-visible{outline-color:var(--paper)}
/* interest list: an oxblood band; over the film it stays as see-through as the other grounds */
.inquire{background:var(--oxblood);color:var(--paper)}
main>section.inquire{background:rgba(107,44,37,.85)}
.inquire .dim,.inquire .lede.dim{color:rgba(236,229,210,.78)}
.inquire .spec,.inquire .spec li{border-color:rgba(236,229,210,.25)}
.inquire .field input,.inquire .field select,.inquire .field textarea{color:var(--paper);border-bottom-color:rgba(236,229,210,.55)}
.inquire .field input:focus,.inquire .field select:focus,.inquire .field textarea:focus{border-bottom-color:var(--paper)}
.inquire .field input::placeholder,.inquire .field textarea::placeholder{color:rgba(236,229,210,.5)}
.inquire .field select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23ECE5D2' stroke-width='1.5'/></svg>")}
.inquire .field select option{color:var(--ink)}
.inquire .form .note,.inquire .form-status{color:rgba(236,229,210,.78)}
.inquire .form-status.ok{color:var(--paper)}
.inquire .form-status.fail,.inquire .field .err{color:#F0B9A8}
.inquire .field.is-invalid input,.inquire .field.is-invalid select{border-bottom-color:#F0B9A8}
.inquire a{text-decoration-color:var(--gold)}
/* the optional measurement choice is styled inline for paper; restate it for the oxblood band */
.inquire .acquisition-choice{border-top-color:rgba(236,229,210,.25)!important}
.inquire .acquisition-choice label{color:rgba(236,229,210,.78)!important}
.inquire .acquisition-choice input[type=checkbox]{accent-color:var(--gold)!important}

/* ---------- 05 · warm grade on still renderings (never the background film) ---------- */
.frame:not(.mono):not(.duotone)>img,.frame:not(.mono):not(.duotone)>video,.hero-page .hero-media>img{filter:sepia(.24) saturate(.78) contrast(.93) brightness(1.03)}
.frame:not(.mono):not(.duotone)::before{content:"";position:absolute;inset:0;z-index:1;background:var(--gold);mix-blend-mode:multiply;opacity:.14;pointer-events:none}
.frame .tag,.frame .motion-tag{z-index:2}
.full-bleed .frame img,.full-bleed .frame video{filter:sepia(.24) saturate(.62) contrast(.98) brightness(.8)}

/* ---------- 07 · square plates; the sun is the only circle ---------- */
.floorplans .fp-filters button{border-radius:0}
.floorplans .fp-filters button[aria-pressed="true"]{background:var(--ink);color:var(--gold);border-color:var(--ink)}
.lb-close,.lb-nav{border-radius:0}
.media-ctl,body .hero--film .media-ctl{border-radius:50%;border:0;background:var(--gold);color:var(--ink)}
.media-ctl:hover,body .hero--film .media-ctl:hover{background:var(--ink);color:var(--gold)}

/* ---------- 02 · Edition I marks ---------- */
.brand .alum-mark-spaced{width:clamp(120px,10vw,148px);height:auto}
.menu-open .brand .alum-mark-spaced{content:url('/assets/brand/edition-i/alum-spaced-paper.svg')}
.hero-media .signature--tower{left:auto;right:clamp(96px,10vw,160px);bottom:clamp(20px,3vw,40px);color:var(--ink);text-shadow:none}
.signature--tower .sig-rule,.signature--tower .sig-cap{display:none}
.signature .alum-mark-tower{width:clamp(76px,8vw,120px)}
.hero-page .hero-media:has(.signature--tower)>img{object-position:50% 90%}
/* 06 · poster column — Architecture: oxblood ground, mark in paper
   (#architecture prefix: architecture-plate.css loads later in the page) */
#architecture .architecture-plate{background:var(--oxblood);color:var(--paper)}
#architecture .architecture-plate::after{border-color:rgba(236,229,210,.28)}
#architecture .architecture-plate__mark{fill:var(--paper)}
#architecture .architecture-plate__photo{background:var(--oxblood)}
#architecture .architecture-plate__photo img{filter:sepia(.24) saturate(.78) contrast(.93) brightness(1.03)}
#architecture .architecture-plate__photo::after{background:linear-gradient(to bottom,transparent 55%,rgba(107,44,37,.35) 72%,rgba(107,44,37,.9) 90%,var(--oxblood) 100%)}
/* 06 · poster column — Panorama Bar: ink ground, gold mark, photograph right of the l */
#panorama .frame{aspect-ratio:3/4;background:var(--ink) url('/assets/brand/edition-i/alum-tower-gold.svg') 0 0/100% auto no-repeat;outline:1px solid rgba(236,229,210,.12);outline-offset:-1px}
#panorama .frame::after{content:"";position:absolute;top:28%;bottom:0;left:29.85%;width:2.49%;background:var(--gold);pointer-events:none}
#panorama .frame>img{position:absolute;left:35%;top:38%;width:61%;height:50%;object-fit:cover}
#panorama .frame::before{inset:38% 4% 12% 35%}
#panorama .frame .tag{left:35%;bottom:4%;background:transparent;color:var(--gold);padding:0}

/* ---------- 08 · the foot of the sheet ---------- */
.foot-word .alum-mark-golden-hill{width:clamp(180px,18vw,260px);height:auto}
.foot-col h4{color:var(--gold)}
.foot-bottom{border-top-color:rgba(198,163,90,.55)}
