/* Arena-specific styles. Loaded only by /arena; approved page styles are untouched. */
html { scroll-behavior:smooth; scroll-padding-top:100px; }
.ar-body { margin:0; background:var(--color-warm-ivory); color:var(--color-dark-ink); font-family:var(--font-body); -webkit-font-smoothing:antialiased; }
.ar-page { --ar-gutter:clamp(22px,5.5vw,82px); --ar-line:rgba(22,53,46,.2); --ar-space:clamp(64px,6vw,88px); overflow:clip; }
.ar-page *, .ar-page *::before, .ar-page *::after { box-sizing:border-box; }
.ar-page h1,.ar-page h2,.ar-page h3,.ar-page p,.ar-page figure,.ar-page dl { margin:0; }
.ar-page h1,.ar-page h2,.ar-page h3 { font-family:var(--font-headline); font-weight:400; }
.ar-page h2 { font-size:clamp(44px,4.6vw,66px); line-height:1; letter-spacing:-.025em; }
.ar-page h3 { font-size:clamp(32px,3vw,43px); line-height:1.08; letter-spacing:-.015em; }
.ar-page p { font-size:14px; line-height:1.8; }
.ar-page a { color:inherit; text-decoration:none; }
.ar-page button,.ar-page input,.ar-page select { font:inherit; }
.ar-page button { cursor:pointer; }
.ar-page button,.ar-page a,.ar-page input,.ar-page select,.ar-page summary { -webkit-tap-highlight-color:transparent; }
.ar-page a:focus-visible,.ar-page button:focus-visible,.ar-page input:focus-visible,.ar-page select:focus-visible,.ar-page summary:focus-visible { outline:2px solid var(--color-brass); outline-offset:5px; }
.ar-page img { display:block; width:100%; height:auto; }
.ar-page svg { width:21px; height:21px; flex-shrink:0; }
.ar-page [hidden] { display:none!important; }
.ar-container { width:min(100% - var(--ar-gutter)*2,1280px); margin-inline:auto; }
.ar-section { padding-block:var(--ar-space); }
.ar-page .ar-eyebrow { font-size:10px; font-weight:600; letter-spacing:.17em; line-height:1.6; text-transform:uppercase; margin-bottom:22px; }
.ar-page .ar-lead { font-size:clamp(17px,1.45vw,20px); line-height:1.7; }
.ar-button { display:inline-flex; gap:20px; align-items:center; justify-content:space-between; padding:17px 22px; min-height:54px; border:1px solid transparent; border-radius:var(--button-radius); font-size:12px; font-weight:600; transition:background .2s,transform .2s; }
.ar-button-brass { background:var(--color-brass); color:var(--color-deep-forest)!important; }
.ar-button-brass:hover { background:#cab183; transform:translateY(-2px); }
.ar-button-forest { background:var(--color-primary-forest); color:var(--color-warm-white)!important; }
.ar-button-forest:hover { background:var(--color-deep-forest); transform:translateY(-2px); }
.ar-button-outline { border-color:var(--ar-line); background:transparent; }
.ar-button-outline:hover { background:var(--color-soft-stone); }
.ar-text-link { display:inline-flex; gap:14px; align-items:center; font-size:12px; font-weight:600; line-height:1.5; border-bottom:1px solid currentColor; padding-bottom:7px; width:fit-content; }
.ar-text-link svg { width:18px; }
.ar-text-link:hover svg { transform:translateX(3px); }
.ar-source-link { display:inline-flex; align-items:center; gap:10px; font-size:11px; font-weight:500; text-decoration:underline!important; text-underline-offset:4px; line-height:1.6; }
.ar-source-link svg { width:15px; height:15px; }
.ar-visually-hidden,.ar-configs input,.ar-enquiry-modes input { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.ar-skip-link { position:fixed; top:8px; left:12px; z-index:100; transform:translateY(-150%); padding:15px 20px; background:var(--color-warm-white); color:var(--color-primary-forest)!important; }
.ar-skip-link:focus { transform:none; }
.ar-header { background:var(--color-deep-forest); color:var(--color-warm-white); position:sticky; top:0; z-index:30; border-bottom:1px solid rgba(244,240,231,.16); }
.ar-header-inner { display:flex; align-items:center; gap:36px; height:88px; }
.ar-wordmark { display:flex; flex-direction:column; align-items:center; flex-shrink:0; }
.ar-wordmark span { font-family:var(--font-headline); font-size:26px; letter-spacing:.025em; line-height:1.1; }
.ar-wordmark small { margin-top:7px; font-size:8px; font-weight:500; letter-spacing:.3em; }
.ar-header-project { font-size:9px; letter-spacing:.16em; padding-left:30px; border-left:1px solid rgba(244,240,231,.3); color:var(--color-brass); }
.ar-navigation { margin-left:auto; display:flex; align-items:center; gap:29px; }
.ar-navigation a { font-size:11px; font-weight:500; }
.ar-navigation a:hover { color:var(--color-brass); }
.ar-navigation .ar-nav-cta { display:flex; align-items:center; gap:20px; border:1px solid rgba(181,154,104,.6); padding:13px 17px; border-radius:var(--button-radius); }
.ar-menu { display:none; }
.ar-hero { position:relative; background:var(--color-deep-forest); color:var(--color-warm-white); }
.ar-hero-inner { min-height:635px; position:relative; display:flex; align-items:center; padding-block:50px 64px; }
.ar-hero-copy { position:relative; z-index:2; width:45%; }
.ar-hero .ar-hero-eyebrow { color:var(--color-brass); font-size:10px; margin-bottom:14px; }
.ar-hero h1 { font-size:clamp(90px,9.8vw,146px); line-height:.91; letter-spacing:-.04em; white-space:nowrap; margin-left:-4px; margin-bottom:27px; }
.ar-page .ar-hero-line { font-family:var(--font-headline); font-size:clamp(40px,4vw,57px); line-height:1.06; letter-spacing:-.02em; margin-bottom:20px; }
.ar-page .ar-hero-description { max-width:340px; font-size:12px; color:rgba(250,248,242,.76); line-height:1.9; }
.ar-status { display:flex; align-items:center; width:fit-content; gap:8px; margin-top:18px; color:#dac79f; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.ar-status>span { width:5px; height:5px; background:var(--color-brass); border-radius:50%; }
.ar-hero-actions { display:flex; flex-direction:column; align-items:flex-start; gap:18px; margin-top:26px; }
.ar-hero-image { position:absolute; inset:0 0 72px auto; width:63%; overflow:hidden; }
.ar-hero-image img { width:100%; height:100%; object-fit:cover; object-position:center 35%; }
.ar-hero-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--color-deep-forest),rgba(13,39,34,.85) 8%,rgba(13,39,34,.12) 35%,transparent 65%),linear-gradient(0deg,rgba(13,39,34,.65),transparent 30%); pointer-events:none; }
.ar-media-label { position:absolute; z-index:1; right:var(--ar-gutter); bottom:18px; font-size:8px; letter-spacing:.04em; color:rgba(250,248,242,.88); }
.ar-hero-bottom { border-top:1px solid rgba(244,240,231,.16); position:relative; z-index:2; }
.ar-facts { display:grid; grid-template-columns:1fr 1fr 1.2fr auto; align-items:center; min-height:86px; gap:25px; }
.ar-facts div { display:flex; align-items:center; gap:20px; }
.ar-facts div>span { font-size:8px; text-transform:uppercase; letter-spacing:.12em; color:var(--color-muted-sage); }
.ar-facts strong { font-size:11px; font-weight:500; }
.ar-facts>a { font-size:10px; display:flex; align-items:center; gap:22px; color:var(--color-brass); }
.ar-facts>a span { font-size:22px; }
.ar-idea { background:var(--color-warm-ivory); }
.ar-idea-grid { display:grid; grid-template-columns:1fr 1fr; column-gap:11%; align-items:center; }
.ar-idea-copy { padding-top:24px; }
.ar-idea-copy .ar-text-link { margin-top:22px; }
.ar-rhythm { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:42px; position:relative; padding-top:20px; border-top:1px solid var(--ar-line); }
.ar-rhythm>span { font-family:var(--font-headline); font-size:26px; }
.ar-rhythm>span::before { content:""; width:5px; height:5px; display:inline-block; vertical-align:middle; margin-right:13px; background:var(--color-brass); border-radius:50%; }
.ar-rhythm>i { position:absolute; top:-3px; left:0; height:5px; width:34%; background:var(--color-brass); }
.ar-residences { background:var(--color-soft-stone); }
.ar-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:50px; margin-bottom:38px; }
.ar-section-heading>p { max-width:330px; color:var(--color-muted-text); }
.ar-explorer { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.24fr); align-items:stretch; border:1px solid rgba(22,53,46,.13); background:var(--color-warm-white); }
.ar-residence-controls { padding:34px; background:var(--color-warm-ivory); min-width:0; }
.ar-configs { border:0; padding:0; margin:0 0 26px; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.ar-configs legend { font-size:10px; font-weight:600; margin-bottom:13px; }
.ar-configs label { cursor:pointer; position:relative; }
.ar-configs label>span { display:flex; align-items:baseline; justify-content:center; gap:7px; padding:12px; border:1px solid var(--ar-line); font-size:10px; transition:background .2s,color .2s; }
.ar-configs label b { font-size:23px; font-weight:400; }
.ar-configs input:checked+span { background:var(--color-primary-forest); color:var(--color-warm-white); border-color:var(--color-primary-forest); }
.ar-configs input:focus-visible+span,.ar-enquiry-modes input:focus-visible+span { outline:2px solid var(--color-brass); outline-offset:4px; }
.ar-select-row { display:grid; grid-template-columns:.85fr 1.15fr; gap:18px; margin-bottom:30px; }
.ar-select-row label { display:block; font-size:9px; text-transform:uppercase; letter-spacing:.09em; }
.ar-select-row select { display:block; min-width:0; width:100%; margin-top:7px; border:0; border-bottom:1px solid var(--ar-line); border-radius:0; padding:9px 22px 9px 0; background:transparent; font-size:12px; color:var(--color-primary-forest); cursor:pointer; text-transform:none; letter-spacing:0; }
.ar-page .ar-selected-tower { font-size:9px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:#6e765d; margin-bottom:10px; }
.ar-residence-controls h3 { font-size:clamp(34px,3.4vw,49px); line-height:1.04; margin-bottom:24px; overflow-wrap:anywhere; }
.ar-area-head { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--ar-line); padding-bottom:11px; }
.ar-area-head>span { font-size:8px; color:var(--color-muted-text); }
.ar-unit-switch { display:flex; gap:2px; border:1px solid var(--ar-line); flex-shrink:0; }
.ar-unit-switch button { font-size:9px; border:0; padding:6px 9px; background:transparent; color:inherit; min-height:28px; }
.ar-unit-switch button[aria-pressed="true"] { background:var(--color-primary-forest); color:var(--color-warm-white); }
.ar-areas { display:grid; grid-template-columns:1.5fr 1fr; gap:12px; padding-block:18px 22px; }
.ar-areas dt { font-size:9px; color:var(--color-muted-text); margin-bottom:7px; }
.ar-areas dd { font-size:clamp(16px,1.65vw,24px); font-weight:500; letter-spacing:-.03em; margin:0; }
.ar-areas>div:last-child dd { font-size:14px; font-weight:400; padding-top:4px; }
.ar-residence-meta { display:grid; gap:9px; font-size:10px; margin-bottom:25px!important; }
.ar-residence-meta>div { display:flex; flex-wrap:wrap; justify-content:space-between; gap:5px 10px; }
.ar-residence-meta dt { color:var(--color-muted-text); }
.ar-residence-meta dd { margin:0; font-weight:600; }
.ar-residence-controls>.ar-button { width:100%; font-size:11px; margin-bottom:15px; }
.ar-page .ar-drawing-note { font-size:9px; line-height:1.8; color:var(--color-muted-text); }
.ar-page .ar-other-note { font-size:8px; line-height:1.8; color:var(--color-muted-text); margin-block:8px 16px; }
.ar-unit-drawing { display:flex; flex-direction:column; min-width:0; background:#fff; padding:20px 22px 16px; }
.ar-drawing-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:9px; font-weight:500; padding-bottom:14px; border-bottom:1px solid var(--ar-line); }
.ar-drawing-heading>a { display:flex; align-items:center; gap:7px; font-size:9px; text-decoration:underline; text-underline-offset:3px; }
.ar-drawing-heading svg { width:14px; height:14px; }
.ar-drawing-link { position:relative; display:flex; align-items:center; flex:1; min-height:470px; }
.ar-drawing-link img { width:100%; max-height:590px; object-fit:contain; }
.ar-enlarge { position:absolute; bottom:14px; right:14px; display:flex; align-items:center; justify-content:center; gap:14px; background:var(--color-primary-forest); color:var(--color-warm-white); border:1px solid rgba(250,248,242,.2); padding:12px 16px; border-radius:var(--button-radius); font-size:10px; box-shadow:0 3px 18px rgba(13,39,34,.13); }
.ar-enlarge svg { width:16px; height:16px; }
.ar-page figcaption { font-size:9px; line-height:1.6; color:var(--color-muted-text); margin-top:12px; }
.ar-unit-drawing figcaption { margin-top:12px; padding-top:12px; border-top:1px solid var(--ar-line); }
.ar-noscript { padding:18px; margin-top:20px!important; border:1px solid var(--ar-line); }
.ar-noscript a { text-decoration:underline; }
.ar-plans { background:var(--color-primary-forest); color:var(--color-warm-ivory); }
.ar-plans .ar-eyebrow { color:var(--color-brass); }
.ar-plan-context { width:330px; max-width:100%; padding-left:22px; border-left:1px solid rgba(181,154,104,.7); }
.ar-plan-context>span { display:block; font-size:8px; text-transform:uppercase; letter-spacing:.12em; color:var(--color-brass); }
.ar-plan-context>strong { display:block; font-size:13px; font-weight:500; line-height:1.7; margin-block:8px 12px; }
.ar-plan-context .ar-text-link { font-size:10px; }
.ar-masterplan>a { display:block; position:relative; background:#3e6d76; border:1px solid rgba(250,248,242,.15); }
.ar-masterplan img { aspect-ratio:2; object-fit:contain; }
.ar-plans figcaption { color:rgba(244,240,231,.65); display:flex; justify-content:space-between; gap:15px; }
.ar-plans figcaption>a { display:inline-flex; align-items:center; gap:6px; }
.ar-plans figcaption svg { width:14px; height:14px; }
.ar-tower-plan { display:grid; grid-template-columns:1fr 1fr; gap:13%; align-items:center; margin-top:52px; }
.ar-tower-plan h3 { font-size:clamp(35px,3.5vw,50px); margin-bottom:22px; }
.ar-tower-plan p { color:rgba(244,240,231,.74); }
.ar-tower-plan .ar-floor-note { font-size:10px; color:var(--color-brass); margin-block:18px 12px; }
.ar-tower-plan figure>a { display:block; position:relative; background:#fff; }
.ar-tower-plan figure img { max-height:440px; object-fit:contain; }
.ar-experience { background:var(--color-warm-ivory); }
.ar-experience-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:11%; }
.ar-experience-intro>p:not(.ar-eyebrow) { max-width:300px; margin-top:22px; color:var(--color-muted-text); }
.ar-proposed-label { display:block; font-size:9px; font-weight:500; margin-top:18px; color:#686d59; }
.ar-court-lines { position:relative; width:min(100%,290px); height:185px; margin-top:34px; border:1px solid rgba(181,154,104,.5); transform:skewY(-7deg); }
.ar-court-lines::before,.ar-court-lines::after { position:absolute; content:""; border:1px solid rgba(181,154,104,.5); inset:16px 0; }
.ar-court-lines::after { inset:16px 50%; border-right:0; }
.ar-court-lines i { position:absolute; left:20%; right:20%; top:16px; height:calc(50% - 16px); border:1px solid rgba(181,154,104,.5); }
.ar-court-lines i+i { top:50%; }
.ar-court-lines>span { position:absolute; left:10%; top:50%; height:1px; width:83%; background:var(--color-brass); }
.ar-experience-stories article { display:grid; grid-template-columns:28px 1fr; gap:21px; border-top:1px solid var(--ar-line); padding-block:23px 26px; }
.ar-experience-number { font-size:10px; color:#7e745a; padding-top:3px; }
.ar-experience-stories .ar-eyebrow { font-size:8px; margin-bottom:8px; }
.ar-experience-stories h3 { font-size:36px; margin-bottom:12px; }
.ar-experience-stories article p:not(.ar-eyebrow) { font-size:12px; color:var(--color-muted-text); }
.ar-experience-stories .ar-text-link { font-size:10px; margin-top:14px; }
.ar-experience-stories>.ar-source-link { margin-left:49px; }
.ar-location { background:var(--color-soft-stone); }
.ar-location-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:8%; align-items:center; }
.ar-location figure>a { position:relative; display:block; }
.ar-location figure img { width:100%; object-fit:contain; background:var(--color-warm-white); border:1px solid var(--ar-line); }
.ar-location-copy .ar-eyebrow { font-size:8px; margin-bottom:14px; }
.ar-location-copy h3 { font-size:clamp(39px,4.4vw,62px); margin-bottom:17px; }
.ar-location-copy>p { font-size:12px; max-width:300px; margin-bottom:22px; }
.ar-location-copy .ar-button { font-size:10px; padding:14px 17px; min-height:48px; }
.ar-map-note { margin-block:27px 21px; padding-top:20px; border-top:1px solid var(--ar-line); }
.ar-map-note strong { font-size:11px; font-weight:600; }
.ar-map-note p { font-size:10px; color:var(--color-muted-text); margin-top:8px; }
.ar-trust { background:var(--color-warm-white); }
.ar-trust-grid { display:grid; grid-template-columns:1fr 1fr; gap:11%; }
.ar-trust-grid>div:first-child>p:not(.ar-eyebrow) { max-width:340px; margin-block:22px; color:var(--color-muted-text); }
.ar-trust-details>div { border-top:1px solid var(--ar-line); padding-block:18px 22px; }
.ar-trust-details span { display:block; text-transform:uppercase; font-size:8px; font-weight:600; letter-spacing:.12em; color:var(--color-muted-text); margin-bottom:9px; }
.ar-trust-details strong { font-size:19px; font-weight:500; }
.ar-trust-details p { font-size:11px; color:var(--color-muted-text); margin-top:10px; }
.ar-trust-details .ar-registration-number { font-size:13px; color:var(--color-primary-forest); letter-spacing:.05em; }
.ar-trust-details a { display:inline-flex; gap:6px; align-items:center; font-size:9px; text-decoration:underline; text-underline-offset:4px; margin-top:12px; margin-right:20px; }
.ar-trust-details svg { width:13px; height:13px; }
.ar-faq { border-top:1px solid var(--ar-line); }
.ar-faq-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:11%; }
.ar-faq-list { border-top:1px solid var(--ar-line); }
.ar-faq-list details { border-bottom:1px solid var(--ar-line); }
.ar-faq-list summary { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-block:21px; cursor:pointer; font-size:12px; font-weight:500; list-style:none; }
.ar-faq-list summary::-webkit-details-marker { display:none; }
.ar-faq-list summary svg { width:18px; height:18px; transition:transform .2s; }
.ar-faq-list details[open] summary svg { transform:rotate(45deg); }
.ar-faq-list details>div { padding-bottom:20px; max-width:95%; }
.ar-faq-list details p { font-size:12px; color:var(--color-muted-text); }
.ar-enquiry { background:var(--color-deep-forest); color:var(--color-warm-white); }
.ar-enquiry-grid { display:grid; grid-template-columns:1fr 1fr; gap:11%; }
.ar-enquiry .ar-eyebrow { color:var(--color-brass); }
.ar-enquiry-copy h2 { max-width:440px; }
.ar-enquiry-copy>p:not(.ar-eyebrow) { margin-top:24px; max-width:360px; font-size:13px; color:rgba(250,248,242,.75); }
.ar-enquiry-selected { margin-top:36px; border-top:1px solid rgba(250,248,242,.22); padding-top:20px; max-width:390px; }
.ar-enquiry-selected>span { display:block; font-size:8px; text-transform:uppercase; letter-spacing:.1em; color:var(--color-brass); margin-bottom:9px; }
.ar-enquiry-selected>strong { font-family:var(--font-headline); font-size:25px; font-weight:400; line-height:1.3; display:block; }
.ar-enquiry-selected .ar-text-link { margin-top:16px; font-size:10px; }
.ar-enquiry-modes { margin:0 0 22px; padding:0; border:0; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.ar-enquiry-modes legend { font-size:10px; margin-bottom:14px; color:rgba(250,248,242,.7); }
.ar-enquiry-modes label { cursor:pointer; min-width:0; position:relative; }
.ar-enquiry-modes label>span { display:flex; align-items:center; justify-content:center; border:1px solid rgba(250,248,242,.3); padding:12px 5px; min-height:46px; font-size:11px; text-align:center; }
.ar-enquiry-modes input:checked+span { background:var(--color-warm-ivory); border-color:var(--color-warm-ivory); color:var(--color-primary-forest); }
.ar-form-wrap form>label { display:block; font-size:10px; margin-bottom:18px; }
.ar-form-wrap input,.ar-form-wrap select { display:block; width:100%; min-height:46px; border:0; border-bottom:1px solid rgba(250,248,242,.3); border-radius:0; background:transparent; color:var(--color-warm-white); padding:9px 0; margin-top:3px; font-size:13px; }
.ar-form-wrap input::placeholder { color:rgba(250,248,242,.4); }
.ar-form-wrap select { font-size:11px; padding-right:18px; text-overflow:ellipsis; }
.ar-form-wrap select option,.ar-form-wrap select optgroup { color:var(--color-dark-ink); background:var(--color-warm-white); }
.ar-form-wrap .ar-button { width:100%; margin-top:8px; }
.ar-error { font-size:10px; color:#ecd3a5; margin-top:5px; display:block; }
.ar-form-wrap input[aria-invalid="true"] { border-color:#ecd3a5; }
.ar-page .ar-preview-note { color:rgba(250,248,242,.59); font-size:9px; line-height:1.7; margin-top:14px; }
.ar-request-review { border:1px solid rgba(181,154,104,.6); padding:20px; margin-top:20px; }
.ar-request-review>strong { font-family:var(--font-headline); font-size:28px; font-weight:400; }
.ar-request-review p { font-size:11px; margin-block:10px 15px; color:rgba(250,248,242,.75); }
.ar-request-review a { font-size:10px; }
.ar-footer { background:var(--color-deep-forest); color:var(--color-warm-white); border-top:1px solid rgba(250,248,242,.16); padding-block:36px 26px; }
.ar-footer-top { display:flex; justify-content:space-between; align-items:center; gap:26px; }
.ar-footer nav { display:flex; gap:27px; }
.ar-footer a:not(.ar-wordmark) { font-size:10px; }
.ar-footer a[aria-current="page"] { color:var(--color-brass); }
.ar-footer-bottom { display:flex; justify-content:space-between; gap:38px; align-items:flex-start; border-top:1px solid rgba(250,248,242,.15); margin-top:30px; padding-top:20px; }
.ar-footer-bottom p { font-size:8px; max-width:700px; color:rgba(250,248,242,.5); }
.ar-footer-bottom>a { font-size:9px!important; display:flex; align-items:center; gap:8px; white-space:nowrap; color:var(--color-brass); }
.ar-footer-bottom svg { width:14px; height:14px; }
.ar-media-dialog { width:min(1120px,95vw); height:min(920px,94dvh); max-width:95vw; max-height:94dvh; padding:0; border:0; background:var(--color-warm-white); color:var(--color-dark-ink); overflow:hidden; box-shadow:0 24px 100px rgba(0,0,0,.4); }
.ar-media-dialog[open] { display:flex; flex-direction:column; }
.ar-media-dialog::backdrop { background:rgba(7,22,18,.85); backdrop-filter:blur(4px); }
.ar-media-toolbar { padding:18px 22px; border-bottom:1px solid var(--ar-line); display:flex; align-items:center; justify-content:space-between; gap:15px; }
.ar-media-toolbar h2 { font-size:30px; line-height:1.1; }
.ar-media-toolbar p { font-size:9px; margin-top:4px; color:var(--color-muted-text); }
.ar-dialog-close { border:1px solid var(--ar-line); min-width:42px; min-height:42px; background:transparent; color:inherit; font-size:26px!important; }
.ar-zoom-toolbar { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:12px 22px; border-bottom:1px solid var(--ar-line); }
.ar-zoom-toolbar>span { font-size:9px; color:var(--color-muted-text); }
.ar-zoom-toolbar>div { display:flex; align-items:center; gap:3px; }
.ar-zoom-toolbar button { min-height:35px; min-width:35px; border:1px solid var(--ar-line); background:transparent; color:inherit; font-size:13px; }
.ar-zoom-toolbar output { min-width:50px; text-align:center; font-size:10px; }
.ar-zoom-toolbar>a { display:flex; align-items:center; gap:8px; font-size:10px; }
.ar-zoom-toolbar svg { width:15px; height:15px; }
.ar-media-viewport { flex:1; min-height:0; overflow:auto; background:#fff; overscroll-behavior:contain; }
.ar-media-viewport img { width:100%; max-width:none; height:auto; min-height:100%; object-fit:contain; }
.ar-body.ar-dialog-open { overflow:hidden; }
@media (min-width:1440px) { .ar-hero-inner { min-height:680px; } .ar-hero-image { width:61%; } }
@media (max-width:1100px) {
  .ar-header-inner { gap:25px; } .ar-header-project { display:none; } .ar-navigation { gap:23px; }
  .ar-hero-inner { min-height:600px; } .ar-hero-copy { width:48%; } .ar-hero h1 { font-size:clamp(83px,10vw,112px); }
  .ar-hero .ar-hero-eyebrow { font-size:8px; } .ar-hero-image { width:62%; }
  .ar-facts div { flex-direction:column; align-items:flex-start; gap:6px; }
  .ar-residence-controls { padding:26px; } .ar-select-row { grid-template-columns:1fr; gap:14px; }
  .ar-drawing-link { min-height:400px; } .ar-drawing-heading { flex-wrap:wrap; }
  .ar-areas dd { font-size:20px; } .ar-area-head>span { max-width:130px; line-height:1.6; }
  .ar-tower-plan { gap:8%; } .ar-experience-grid,.ar-faq-grid,.ar-enquiry-grid,.ar-trust-grid { gap:7%; }
}
@media (max-width:850px) {
  html { scroll-padding-top:82px; }
  .ar-header-inner { height:76px; } .ar-wordmark span { font-size:23px; }
  .ar-menu { display:flex; flex-direction:column; justify-content:center; gap:6px; width:44px; height:44px; margin-left:auto; background:transparent; border:1px solid rgba(250,248,242,.25); padding:10px; color:inherit; }
  .ar-menu>span { width:22px; height:1px; background:currentColor; }
  .ar-navigation { display:none; position:absolute; top:76px; left:0; width:100%; background:var(--color-deep-forest); margin:0; padding:22px var(--ar-gutter); border-bottom:1px solid rgba(250,248,242,.2); }
  .ar-navigation.is-open { display:flex; flex-wrap:wrap; } .ar-navigation a { font-size:12px; min-height:44px; display:flex; align-items:center; }
  .ar-hero-inner { min-height:620px; } .ar-hero-copy { width:53%; }
  .ar-hero h1 { font-size:clamp(80px,11vw,96px); } .ar-page .ar-hero-line { font-size:43px; }
  .ar-hero-description { max-width:270px!important; } .ar-hero-image { width:65%; }
  .ar-hero-image img { object-position:57% top; }
  .ar-section-heading { gap:28px; } .ar-section-heading>p { width:270px; flex-shrink:0; font-size:12px; }
  .ar-idea-grid { column-gap:7%; } .ar-page .ar-lead { font-size:16px; }
  .ar-rhythm>span { font-size:22px; } .ar-rhythm>span::before { margin-right:6px; }
  .ar-explorer { grid-template-columns:1fr; } .ar-residence-controls { padding:30px; }
  .ar-select-row { grid-template-columns:1fr 1fr; } .ar-areas { grid-template-columns:1fr 1fr; }
  .ar-residence-controls h3 { font-size:46px; } .ar-area-head>span { max-width:none; }
  .ar-drawing-link { min-height:0; } .ar-drawing-link img { max-height:620px; }
  .ar-unit-drawing { padding:20px 30px; } .ar-drawing-heading { flex-wrap:nowrap; }
  .ar-plan-context { width:250px; } .ar-plan-context strong { font-size:12px; }
  .ar-tower-plan { grid-template-columns:.85fr 1.15fr; gap:6%; }
  .ar-tower-plan h3 { font-size:37px; } .ar-tower-plan p { font-size:12px; }
  .ar-experience-grid { grid-template-columns:.8fr 1.2fr; gap:6%; } .ar-experience-stories h3 { font-size:30px; }
  .ar-court-lines { height:150px; } .ar-location-grid { grid-template-columns:1fr; gap:34px; }
  .ar-location-copy { display:grid; grid-template-columns:1fr 1fr; column-gap:50px; align-items:start; }
  .ar-location-copy>.ar-eyebrow,.ar-location-copy>h3,.ar-location-copy>p { grid-column:1; }
  .ar-location-copy>.ar-button { grid-column:2; grid-row:2; }
  .ar-location-copy>.ar-map-note { grid-column:2; grid-row:3/5; margin-block:14px 0; }
  .ar-location-copy>.ar-text-link { grid-column:1; }
  .ar-trust-grid,.ar-faq-grid { grid-template-columns:1fr; gap:32px; }
  .ar-trust-grid>div:first-child>p:not(.ar-eyebrow) { max-width:520px; }
  .ar-enquiry-grid { grid-template-columns:1fr; gap:36px; } .ar-enquiry-copy h2 { max-width:550px; }
  .ar-enquiry-selected { max-width:none; } .ar-enquiry-copy>p:not(.ar-eyebrow) { max-width:520px; }
  .ar-footer-top { flex-wrap:wrap; } .ar-footer nav { gap:20px; }
}
@media (max-width:600px) {
  .ar-page { --ar-gutter:22px; --ar-space:58px; }
  .ar-page h2 { font-size:43px; } .ar-page .ar-eyebrow { font-size:9px; margin-bottom:17px; }
  .ar-header-inner { height:72px; } .ar-wordmark span { font-size:22px; } .ar-wordmark small { font-size:7px; margin-top:5px; }
  .ar-header-project { display:block; padding-left:16px; font-size:8px; } .ar-header-inner { gap:16px; }
  .ar-navigation { top:72px; gap:10px 25px; flex-direction:column; align-items:stretch; }
  .ar-navigation .ar-nav-cta { width:100%; justify-content:space-between; }
  .ar-hero { display:flex; flex-direction:column; }
  .ar-hero-inner { min-height:0; padding:35px 0 29px; width:calc(100% - 44px); }
  .ar-hero-copy { width:100%; } .ar-hero .ar-hero-eyebrow { font-size:8px; letter-spacing:.1em; margin-bottom:13px; }
  .ar-hero h1 { font-size:clamp(72px,20.2vw,112px); white-space:normal; margin-bottom:18px; }
  .ar-page .ar-hero-line { font-size:36px; line-height:1.1; width:68%; margin-bottom:15px; }
  .ar-page .ar-hero-description { max-width:290px!important; font-size:11px; line-height:1.75; }
  .ar-status { font-size:8px; margin-top:14px; }
  .ar-hero-actions { margin-top:22px; gap:17px; } .ar-hero-actions .ar-button { width:100%; font-size:12px; }
  .ar-hero-image { order:2; position:relative; inset:auto; width:100%; height:clamp(290px,84vw,430px); }
  .ar-hero-image img { width:100%; height:100%; object-fit:cover; object-position:center 8%; }
  .ar-hero-image::after { background:linear-gradient(0deg,rgba(13,39,34,.65),transparent 24%); }
  .ar-media-label { right:22px; left:22px; text-align:right; font-size:7px; bottom:12px; }
  .ar-hero-bottom { order:3; } .ar-facts { grid-template-columns:1fr 1fr; min-height:0; padding-block:22px; gap:22px; }
  .ar-facts div { gap:6px; } .ar-facts div>span { font-size:7px; } .ar-facts strong { font-size:10px; } .ar-facts>a { justify-content:flex-end; font-size:9px; }
  .ar-idea-grid { grid-template-columns:1fr; gap:24px; } .ar-idea-copy { padding-top:0; } .ar-page .ar-lead { font-size:16px; line-height:1.75; }
  .ar-idea-copy .ar-text-link { font-size:11px; margin-top:18px; }
  .ar-rhythm { margin-top:6px; grid-template-columns:1fr; gap:14px; padding-top:22px; }
  .ar-rhythm>span { font-size:23px; } .ar-rhythm>span::before { margin-right:12px; }
  .ar-section-heading { flex-direction:column; align-items:flex-start; gap:22px; margin-bottom:28px; }
  .ar-section-heading>p { width:auto; max-width:100%; font-size:12px; }
  .ar-residence-controls { padding:23px 19px; } .ar-configs { margin-bottom:21px; }
  .ar-configs legend { font-size:10px; } .ar-configs label>span { min-height:55px; padding:10px 7px; }
  .ar-select-row { grid-template-columns:1fr; gap:15px; margin-bottom:23px; } .ar-select-row select { font-size:13px; min-height:44px; }
  .ar-residence-controls h3 { font-size:38px; line-height:1.08; margin-bottom:21px; }
  .ar-area-head { gap:6px; } .ar-area-head>span { max-width:150px; font-size:8px; }
  .ar-unit-switch button { min-height:36px; min-width:39px; }
  .ar-areas { grid-template-columns:1.5fr 1fr; gap:10px; } .ar-areas dd { font-size:19px; } .ar-areas>div:last-child dd { font-size:13px; }
  .ar-residence-meta { font-size:9px; gap:10px; } .ar-residence-meta>div { flex-direction:column; gap:3px; }
  .ar-page .ar-drawing-note { font-size:10px; } .ar-page .ar-other-note { font-size:9px; }
  .ar-unit-drawing { padding:17px 12px; } .ar-drawing-heading { font-size:8px; gap:8px; padding-bottom:12px; }
  .ar-drawing-heading>a { font-size:8px; } .ar-drawing-link { flex-direction:column; }
  .ar-drawing-link img { max-height:none; aspect-ratio:1; }
  .ar-unit-drawing .ar-enlarge { position:static; margin-top:12px; width:100%; box-shadow:none; min-height:46px; font-size:11px; }
  .ar-unit-drawing figcaption { font-size:8px; margin-top:15px; }
  .ar-plan-context { width:100%; padding-left:15px; } .ar-plan-context>strong { font-size:12px; }
  .ar-masterplan>a { padding-bottom:58px; } .ar-masterplan img { aspect-ratio:2; }
  .ar-masterplan .ar-enlarge { right:12px; left:12px; bottom:12px; min-height:38px; padding:9px 10px; font-size:9px; }
  .ar-plans figcaption { flex-direction:column; gap:6px; font-size:8px; }
  .ar-tower-plan { grid-template-columns:1fr; gap:26px; margin-top:36px; }
  .ar-tower-plan h3 { font-size:37px; } .ar-tower-plan figure img { max-height:none; }
  .ar-tower-plan figure .ar-enlarge { left:12px; right:12px; bottom:10px; min-height:42px; font-size:10px; }
  .ar-experience-grid { grid-template-columns:1fr; gap:30px; } .ar-experience-intro>p:not(.ar-eyebrow) { max-width:100%; margin-top:18px; font-size:12px; }
  .ar-proposed-label { font-size:8px; margin-top:13px; } .ar-court-lines { display:none; }
  .ar-experience-stories article { padding-block:21px 25px; grid-template-columns:20px 1fr; gap:14px; }
  .ar-experience-stories .ar-eyebrow { font-size:7px; margin-bottom:8px; } .ar-experience-stories h3 { font-size:31px; }
  .ar-experience-stories article p:not(.ar-eyebrow) { font-size:11px; } .ar-experience-stories>.ar-source-link { margin-left:34px; font-size:9px; }
  .ar-location-grid { gap:30px; } .ar-location figure .ar-enlarge { right:10px; left:10px; bottom:10px; font-size:9px; padding:10px; }
  .ar-location-copy { display:block; } .ar-location-copy h3 { font-size:47px; }
  .ar-location-copy>.ar-button { width:100%; min-height:48px; } .ar-location-copy>.ar-map-note { margin-block:24px 20px; }
  .ar-location-copy>p { max-width:none; } .ar-location figure figcaption { font-size:8px; }
  .ar-trust-grid,.ar-faq-grid { gap:26px; } .ar-trust-grid>div:first-child>p:not(.ar-eyebrow) { font-size:12px; }
  .ar-trust-details>div { padding-block:16px 21px; } .ar-faq-list summary { font-size:12px; line-height:1.6; gap:15px; padding-block:18px; }
  .ar-faq-list details p { font-size:11px; } .ar-faq-list details>div { max-width:100%; }
  .ar-enquiry-copy h2 { font-size:44px; } .ar-enquiry-copy>p:not(.ar-eyebrow) { font-size:12px; margin-top:20px; }
  .ar-enquiry-selected { margin-top:26px; } .ar-enquiry-selected>strong { font-size:24px; }
  .ar-enquiry-grid { gap:29px; } .ar-enquiry-modes label>span { font-size:10px; min-height:46px; }
  .ar-form-wrap input { font-size:16px; min-height:48px; } .ar-form-wrap select { font-size:16px; min-height:48px; }
  .ar-form-wrap form>label { margin-bottom:18px; } .ar-page .ar-preview-note { font-size:9px; }
  .ar-footer { padding-block:28px 24px; } .ar-footer-top { gap:23px; }
  .ar-footer-top>.ar-wordmark { margin-right:auto; } .ar-footer nav { order:3; width:100%; justify-content:space-between; gap:10px; }
  .ar-footer-bottom { flex-direction:column; gap:16px; margin-top:24px; padding-top:18px; }
  .ar-footer-bottom p { font-size:8px; } .ar-footer-bottom>a { font-size:9px!important; }
  .ar-media-dialog { width:calc(100vw - 16px); max-width:calc(100vw - 16px); height:94dvh; }
  .ar-media-toolbar { padding:15px 12px; } .ar-media-toolbar h2 { font-size:25px; }
  .ar-media-toolbar p { font-size:8px; } .ar-zoom-toolbar { padding:9px 12px; flex-wrap:wrap; gap:8px; }
  .ar-zoom-toolbar>span { display:none; } .ar-zoom-toolbar button { min-width:36px; min-height:40px; }
  .ar-zoom-toolbar>a { font-size:9px; margin-left:auto; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .ar-page *, .ar-page *::before,.ar-page *::after { transition:none!important; animation:none!important; } }
/* =========================================================
   01 / THE ARENA IDEA — VISUAL-FIRST FINAL
   ========================================================= */

.ar-idea-v2 {
  background: var(--color-warm-ivory);
}


/* INTRO */

.ar-idea-v2-head {
  display: grid;
  grid-template-columns:
    minmax(0, 0.9fr)
    minmax(360px, 0.7fr);

  gap: clamp(70px, 10vw, 160px);

  align-items: end;

  margin-bottom:
    clamp(42px, 5vw, 70px);
}


.ar-idea-v2-title h2 {
  max-width: 620px;

  font-size:
    clamp(58px, 5.5vw, 86px);

  line-height: 0.96;

  letter-spacing: -0.025em;
}


.ar-idea-v2-title .ar-eyebrow {
  margin-bottom: 27px;
}


.ar-idea-v2-intro {
  max-width: 560px;

  padding-bottom: 8px;
}


.ar-idea-v2-intro > p {
  margin: 0;

  font-size:
    clamp(18px, 1.4vw, 22px);

  line-height: 1.7;

  color: var(--color-dark-ink);
}


.ar-idea-v2-intro .ar-text-link {
  margin-top: 27px;
}



/* =========================================================
   MAIN VISUAL
   ========================================================= */

.ar-idea-v2-visual {
  position: relative;

  overflow: hidden;

  width: 100%;

  height:
    clamp(470px, 54vw, 680px);

  margin: 0;

  background: var(--color-primary-forest);
}


.ar-idea-v2-visual img {
  display: block;
  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center 52%;

  filter:
    brightness(0.78)
    saturate(0.84)
    contrast(1.06);
}


.ar-idea-v2-shade {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      180deg,
      rgba(13, 39, 34, 0.06) 0%,
      rgba(13, 39, 34, 0.10) 50%,
      rgba(13, 39, 34, 0.28) 100%
    );

  pointer-events: none;
}


/* IMAGE COPY */

.ar-idea-v2-image-copy {
  position: absolute;

  left:
    clamp(28px, 4vw, 64px);

  bottom:
    clamp(34px, 5vw, 70px);

  z-index: 2;
}


.ar-idea-v2-image-copy > span {
  display: block;

  margin-bottom: 15px;

  font-size: 9px;

  font-weight: 600;

  letter-spacing: 0.15em;

  color: var(--color-brass);
}


.ar-idea-v2-image-copy strong {
  display: block;

  font-family: var(--font-headline);

  font-size:
    clamp(48px, 5.2vw, 78px);

  font-weight: 400;

  line-height: 0.9;

  letter-spacing: -0.025em;

  color: var(--color-warm-white);
}


.ar-idea-v2-visual figcaption {
  position: absolute;

  right: 18px;
  bottom: 15px;

  z-index: 2;

  font-size: 8px;

  color:
    rgba(250,248,242,0.78);
}



/* =========================================================
   THREE IMAGINED MOMENTS
   ========================================================= */

.ar-idea-v2-moments {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap:
    clamp(32px, 5vw, 78px);

  padding-top:
    32px;
}


.ar-idea-v2-moments article {
  padding-top: 22px;

  border-top:
    1px solid rgba(22,53,46,0.22);
}


.ar-idea-v2-moments article:first-child {
  border-top:
    3px solid var(--color-brass);
}


.ar-idea-v2-moments article > span {
  display: block;

  margin-bottom: 13px;

  font-size: 8px;

  font-weight: 600;

  letter-spacing: 0.14em;

  color: var(--color-brass);
}


.ar-idea-v2-moments h3 {
  margin: 0;

  font-family: var(--font-headline);

  font-size:
    clamp(27px, 2.2vw, 36px);

  font-weight: 400;

  line-height: 1.05;
}


.ar-idea-v2-moments p {
  max-width: 350px;

  margin-top: 14px;

  font-size: 12px;

  line-height: 1.7;

  color: var(--color-muted-text);
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

  .ar-idea-v2-head {
    grid-template-columns:
      1fr 1fr;

    gap: 45px;
  }


  .ar-idea-v2-moments {
    gap: 30px;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

  .ar-idea-v2-head {
    grid-template-columns: 1fr;

    gap: 27px;

    margin-bottom: 36px;
  }


  .ar-idea-v2-title h2 {
    font-size:
      clamp(50px, 14vw, 67px);
  }


  .ar-idea-v2-intro > p {
    font-size: 16px;
  }


  .ar-idea-v2-visual {
    width: calc(100% + 38px);

    margin-left: -19px;

    height: 520px;
  }


  .ar-idea-v2-visual img {
    object-position: center;
  }


  .ar-idea-v2-shade {
    background:
      linear-gradient(
        0deg,
        rgba(10,31,27,0.72) 0%,
        rgba(10,31,27,0.10) 55%
      );
  }


  .ar-idea-v2-image-copy {
    left: 22px;
    bottom: 44px;
  }


  .ar-idea-v2-image-copy strong {
    font-size:
      clamp(48px, 14vw, 64px);
  }


  .ar-idea-v2-visual figcaption {
    right: 14px;
    bottom: 12px;
  }


  .ar-idea-v2-moments {
    grid-template-columns: 1fr;

    gap: 24px;

    padding-top: 28px;
  }


  .ar-idea-v2-moments article {
    padding-top: 18px;
  }


  .ar-idea-v2-moments p {
    font-size: 13px;
  }

}
/* =========================================================
   01 / THE ARENA IDEA — LUXURY EDITORIAL FINAL
   ========================================================= */

.ar-idea-luxe {
  background:
    var(--color-warm-ivory, #F4F0E7);

  color:
    var(--color-dark-ink, #172521);

  padding-block:
    clamp(86px, 8vw, 128px);
}


/* =========================================================
   EDITORIAL INTRO
   ========================================================= */

.ar-idea-luxe-intro {
  display: grid;

  grid-template-columns:
    minmax(0, 1.05fr)
    minmax(340px, 0.72fr);

  gap:
    clamp(60px, 9vw, 145px);

  align-items: end;

  margin-bottom:
    clamp(34px, 4vw, 48px);
}


.ar-idea-luxe-heading .ar-eyebrow {
  margin-bottom:
    25px;

  color:
    var(--color-brass, #B59A68);
}


.ar-idea-luxe-heading h2 {
  max-width:
    650px;

  margin:
    0;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(60px, 5.4vw, 84px);

  font-weight:
    400;

  line-height:
    0.94;

  letter-spacing:
    -0.035em;
}


.ar-idea-luxe-copy {
  max-width:
    500px;

  padding-bottom:
    6px;
}


.ar-idea-luxe-copy > p {
  margin:
    0;

  font-size:
    clamp(16px, 1.2vw, 19px);

  line-height:
    1.75;

  color:
    rgba(23, 37, 33, 0.70);
}


/* =========================================================
   TEXT CTA
   ========================================================= */

.ar-idea-luxe-link {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    12px;

  width:
    fit-content;

  margin-top:
    24px;

  padding-bottom:
    7px;

  border-bottom:
    1px solid rgba(22, 53, 46, 0.30);

  font-size:
    11px;

  font-weight:
    600;

  color:
    var(--color-primary-forest, #16352E);

  text-decoration:
    none;

  transition:
    border-color 180ms ease;
}


.ar-idea-luxe-link svg {
  width:
    18px;

  height:
    18px;

  transition:
    transform 180ms ease;
}


@media (hover: hover) and (pointer: fine) {

  .ar-idea-luxe-link:hover {
    border-color:
      var(--color-primary-forest, #16352E);
  }

  .ar-idea-luxe-link:hover svg {
    transform:
      translateX(4px);
  }

}


/* =========================================================
   CINEMATIC VISUAL
   ========================================================= */

.ar-idea-luxe-visual {
  position:
    relative;

  overflow:
    hidden;

  width:
    100%;

  height:
    clamp(500px, 50vw, 680px);

  margin:
    0;

  background:
    var(--color-deep-forest, #0D2722);
}


.ar-idea-luxe-visual img {
  display:
    block;

  width:
    100%;

  height:
    100%;

  object-fit:
    cover;

  object-position:
    center 51%;

  /*
    Slightly restrained evening treatment:
    vibrant without looking overprocessed.
  */

  filter:
    brightness(0.83)
    saturate(0.84)
    contrast(1.05);
}


/* =========================================================
   SUBTLE CINEMATIC TINT
   ========================================================= */

.ar-idea-luxe-overlay {
  position:
    absolute;

  inset:
    0;

  background:

    linear-gradient(
      90deg,
      rgba(9, 30, 26, 0.22) 0%,
      rgba(9, 30, 26, 0.07) 38%,
      rgba(9, 30, 26, 0) 65%
    ),

    linear-gradient(
      180deg,
      rgba(13, 39, 34, 0.01) 40%,
      rgba(13, 39, 34, 0.31) 100%
    );

  pointer-events:
    none;
}


/* =========================================================
   QUIET IMAGE COPY
   ========================================================= */

.ar-idea-luxe-caption {
  position:
    absolute;

  z-index:
    2;

  left:
    clamp(28px, 3.7vw, 56px);

  bottom:
    clamp(34px, 4vw, 55px);
}


.ar-idea-luxe-caption > span {
  display:
    block;

  margin-bottom:
    13px;

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.20em;

  color:
    var(--color-brass, #B59A68);
}


.ar-idea-luxe-caption > p {
  margin:
    0;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(34px, 3.1vw, 47px);

  font-weight:
    400;

  line-height:
    0.98;

  letter-spacing:
    -0.025em;

  color:
    var(--color-warm-white, #FAF8F2);
}


/* =========================================================
   IMAGE DISCLOSURE
   ========================================================= */

.ar-idea-luxe-visual figcaption {
  position:
    absolute;

  z-index:
    2;

  right:
    16px;

  bottom:
    13px;

  margin:
    0;

  font-size:
    8px;

  line-height:
    1.4;

  letter-spacing:
    0.025em;

  color:
    rgba(250, 248, 242, 0.66);
}


/* =========================================================
   THREE DAILY MOMENTS
   ========================================================= */

.ar-idea-luxe-moments {
  display:
    grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap:
    clamp(38px, 6vw, 88px);

  margin-top:
    30px;
}


.ar-idea-luxe-moments article {
  padding-top:
    19px;

  border-top:
    1px solid rgba(22, 53, 46, 0.20);
}


/*
   One restrained brass rule gives hierarchy
   without turning the section into gold decoration.
*/

.ar-idea-luxe-moments article:first-child {
  border-top-color:
    var(--color-brass, #B59A68);
}


.ar-idea-luxe-moments article > span {
  display:
    block;

  margin-bottom:
    14px;

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.16em;

  color:
    var(--color-brass, #B59A68);
}


.ar-idea-luxe-moments h3 {
  margin:
    0;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(27px, 2.1vw, 35px);

  font-weight:
    400;

  line-height:
    1.06;

  letter-spacing:
    -0.015em;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

  .ar-idea-luxe-intro {
    grid-template-columns:
      1fr 1fr;

    gap:
      45px;
  }


  .ar-idea-luxe-heading h2 {
    font-size:
      clamp(54px, 7vw, 72px);
  }


  .ar-idea-luxe-visual {
    height:
      560px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

  .ar-idea-luxe {
    padding-block:
      70px;
  }


  .ar-idea-luxe-intro {
    grid-template-columns:
      1fr;

    gap:
      26px;

    margin-bottom:
      34px;
  }


  .ar-idea-luxe-heading h2 {
    font-size:
      clamp(48px, 14vw, 64px);

    line-height:
      0.95;
  }


  .ar-idea-luxe-copy > p {
    font-size:
      15px;
  }


  .ar-idea-luxe-visual {
    width:
      calc(100% + 38px);

    height:
      500px;

    margin-left:
      -19px;
  }


  .ar-idea-luxe-visual img {
    object-position:
      center;

    filter:
      brightness(0.81)
      saturate(0.84)
      contrast(1.04);
  }


  .ar-idea-luxe-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(13, 39, 34, 0.02) 25%,
        rgba(13, 39, 34, 0.56) 100%
      );
  }


  .ar-idea-luxe-caption {
    left:
      22px;

    right:
      22px;

    bottom:
      39px;
  }


  .ar-idea-luxe-caption > p {
    font-size:
      clamp(33px, 9.5vw, 43px);
  }


  .ar-idea-luxe-visual figcaption {
    right:
      11px;

    bottom:
      9px;
  }


  .ar-idea-luxe-moments {
    grid-template-columns:
      1fr;

    gap:
      24px;

    margin-top:
      27px;
  }


  .ar-idea-luxe-moments article {
    padding-top:
      17px;
  }


  .ar-idea-luxe-moments h3 {
    font-size:
      30px;
  }

}
/* =========================================================
   03 / THE BIGGER PICTURE
   SINGLE-SCREEN ARCHITECTURAL BOARD
   ========================================================= */

.ar-plans-luxe {
  background:
    var(--color-primary-forest, #16352E);

  color:
    var(--color-warm-ivory, #F4F0E7);

  padding-block:
    clamp(38px, 4vh, 58px) !important;
}


.ar-plans-luxe .ar-container {
  width:
    min(
      calc(100% - var(--ar-gutter) * 2),
      1380px
    );
}


/* =========================================================
   HEADING
   ========================================================= */

.ar-plans-luxe-heading {
  display:
    grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(260px, 340px);

  gap:
    clamp(50px, 8vw, 120px);

  align-items:
    end;

  margin-bottom:
    clamp(24px, 3vh, 34px);
}


.ar-plans-luxe-heading .ar-eyebrow {
  margin-bottom:
    14px;

  color:
    var(--color-brass, #B59A68);
}


.ar-plans-luxe-heading h2 {
  margin:
    0;

  font-size:
    clamp(46px, 4.4vw, 67px);

  line-height:
    0.95;

  color:
    var(--color-warm-ivory, #F4F0E7);
}


/* CURRENT RESIDENCE */

.ar-plans-luxe-context {
  padding-left:
    20px;

  border-left:
    1px solid rgba(181, 154, 104, 0.65);
}


.ar-plans-luxe-context > span {
  display:
    block;

  margin-bottom:
    8px;

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.15em;

  color:
    var(--color-brass, #B59A68);
}


.ar-plans-luxe-context > strong {
  display:
    block;

  margin-bottom:
    11px;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(20px, 1.8vw, 27px);

  font-weight:
    400;

  line-height:
    1.08;

  color:
    var(--color-warm-ivory, #F4F0E7);
}


.ar-plans-luxe-context .ar-text-link {
  font-size:
    9px;

  color:
    rgba(244, 240, 231, 0.72);
}



/* =========================================================
   MAIN TWO-DRAWING BOARD
   ========================================================= */

.ar-plans-luxe-board {
  display:
    grid;

  grid-template-columns:
    minmax(0, 1.35fr)
    minmax(330px, 0.75fr);

  gap:
    14px;

  height:
    clamp(340px, 48vh, 540px);
}



/* =========================================================
   SHARED PANEL TREATMENT
   ========================================================= */

.ar-plans-luxe-master,
.ar-plans-luxe-floor {
  min-width:
    0;

  height:
    100%;

  margin:
    0;

  overflow:
    hidden;

  border:
    1px solid rgba(244, 240, 231, 0.16);
}


.ar-plans-luxe-panel-head,
.ar-plans-luxe-floor-copy {
  flex-shrink:
    0;
}



/* =========================================================
   MASTERPLAN PANEL
   ========================================================= */

.ar-plans-luxe-master {
  display:
    grid;

  grid-template-rows:
    auto
    minmax(0, 1fr)
    auto;

  background:
    #355f67;
}


.ar-plans-luxe-panel-head {
  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  gap:
    20px;

  min-height:
    50px;

  padding:
    11px 15px;

  background:
    rgba(13, 39, 34, 0.30);

  border-bottom:
    1px solid rgba(244, 240, 231, 0.13);
}


.ar-plans-luxe-panel-head > div {
  display:
    flex;

  align-items:
    baseline;

  gap:
    13px;
}


.ar-plans-luxe-panel-head span,
.ar-plans-luxe-panel-head small {
  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    0.15em;

  text-transform:
    uppercase;

  color:
    var(--color-brass, #B59A68);
}


.ar-plans-luxe-panel-head strong {
  font-family:
    "Instrument Serif",
    serif;

  font-size:
    20px;

  font-weight:
    400;

  color:
    var(--color-warm-ivory, #F4F0E7);
}


.ar-plans-luxe-master-visual {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  min-height:
    0;

  overflow:
    hidden;
}


.ar-plans-luxe-master-visual img {
  width:
    100%;

  height:
    100%;

  object-fit:
    contain;
}



/* =========================================================
   FLOOR PLAN PANEL
   ========================================================= */

.ar-plans-luxe-floor {
  display:
    grid;

  grid-template-rows:
    auto
    minmax(0, 1fr)
    auto;

  background:
    var(--color-warm-white, #FAF8F2);

  color:
    var(--color-dark-ink, #172521);
}


.ar-plans-luxe-floor-copy {
  padding:
    15px 18px 12px;

  border-bottom:
    1px solid rgba(22, 53, 46, 0.15);
}


.ar-plans-luxe-floor-copy .ar-eyebrow {
  margin-bottom:
    7px;

  font-size:
    7px;

  color:
    var(--color-brass, #B59A68);
}


.ar-plans-luxe-floor-copy h3 {
  margin:
    0;

  font-size:
    clamp(25px, 2.2vw, 34px);

  line-height:
    0.98;

  color:
    var(--color-dark-ink, #172521);
}


.ar-plans-luxe-floor-copy > p:not(.ar-eyebrow) {
  max-width:
    370px;

  margin-top:
    8px;

  font-size:
    9px;

  line-height:
    1.55;

  color:
    rgba(23, 37, 33, 0.60);
}


.ar-plans-luxe-floor-visual {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  min-height:
    0;

  overflow:
    hidden;

  padding:
    8px 14px;
}


.ar-plans-luxe-floor-visual img {
  width:
    100%;

  height:
    100%;

  max-height:
    none !important;

  object-fit:
    contain;
}



/* =========================================================
   ENLARGE BUTTONS
   ========================================================= */

.ar-plans-luxe-enlarge {
  position:
    absolute;

  right:
    12px;

  bottom:
    12px;

  display:
    inline-flex;

  align-items:
    center;

  gap:
    8px;

  min-height:
    34px;

  padding:
    8px 11px;

  border:
    1px solid rgba(250, 248, 242, 0.18);

  border-radius:
    var(--button-radius);

  background:
    rgba(13, 39, 34, 0.92);

  color:
    var(--color-warm-white, #FAF8F2);

  font-size:
    8px;

  font-weight:
    600;

  box-shadow:
    0 6px 18px rgba(13, 39, 34, 0.13);

  backdrop-filter:
    blur(5px);
}


.ar-plans-luxe-enlarge svg {
  width:
    13px;

  height:
    13px;
}



/* =========================================================
   PANEL FOOTERS
   ========================================================= */

.ar-plans-luxe figcaption {
  display:
    flex !important;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  min-height:
    34px;

  margin:
    0 !important;

  padding:
    8px 13px;

  border-top:
    1px solid rgba(22, 53, 46, 0.13);

  font-size:
    7px !important;

  line-height:
    1.4;

  color:
    rgba(23, 37, 33, 0.58) !important;
}


.ar-plans-luxe-master figcaption {
  border-color:
    rgba(244, 240, 231, 0.13);

  color:
    rgba(244, 240, 231, 0.64) !important;
}


.ar-plans-luxe figcaption a {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    5px;

  white-space:
    nowrap;
}


.ar-plans-luxe figcaption svg {
  width:
    11px;

  height:
    11px;
}



/* =========================================================
   TECHNICAL NOTE
   ========================================================= */

.ar-plans-luxe-note {
  max-width:
    880px;

  margin-top:
    13px !important;

  font-size:
    8px !important;

  line-height:
    1.6 !important;

  color:
    rgba(244, 240, 231, 0.47) !important;
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

  .ar-plans-luxe-board {
    grid-template-columns:
      1.15fr
      0.85fr;

    height:
      clamp(360px, 52vh, 500px);
  }


  .ar-plans-luxe-heading {
    grid-template-columns:
      1fr
      260px;

    gap:
      40px;
  }


  .ar-plans-luxe-floor-copy h3 {
    font-size:
      27px;
  }

}



/* =========================================================
   MOBILE
   Technical drawings stack for readability.
   ========================================================= */

@media (max-width: 700px) {

  .ar-plans-luxe {
    padding-block:
      58px !important;
  }


  .ar-plans-luxe-heading {
    grid-template-columns:
      1fr;

    gap:
      25px;

    margin-bottom:
      27px;
  }


  .ar-plans-luxe-context {
    width:
      100%;

    padding-left:
      15px;
  }


  .ar-plans-luxe-board {
    grid-template-columns:
      1fr;

    height:
      auto;

    gap:
      24px;
  }


  .ar-plans-luxe-master,
  .ar-plans-luxe-floor {
    height:
      auto;
  }


  .ar-plans-luxe-master {
    grid-template-rows:
      auto
      auto
      auto;
  }


  .ar-plans-luxe-master-visual {
    min-height:
      270px;
  }


  .ar-plans-luxe-master-visual img {
    height:
      auto;
  }


  .ar-plans-luxe-floor {
    grid-template-rows:
      auto
      auto
      auto;
  }


  .ar-plans-luxe-floor-visual {
    min-height:
      340px;

    padding:
      15px;
  }


  .ar-plans-luxe-floor-visual img {
    height:
      auto;
  }


  .ar-plans-luxe-enlarge {
    right:
      10px;

    left:
      10px;

    bottom:
      10px;

    justify-content:
      space-between;

    min-height:
      40px;
  }


  .ar-plans-luxe figcaption {
    flex-direction:
      column;

    align-items:
      flex-start;

    gap:
      5px;

    padding:
      10px 12px;
  }


  .ar-plans-luxe-note {
    margin-top:
      18px !important;
  }

}
/* =========================================================
   03 / THE BIGGER PICTURE
   SINGLE-SCREEN LUXURY ARCHITECTURAL BOARD
   ========================================================= */

.ar-plans-luxe {
  background:
    var(--color-primary-forest, #16352E) !important;

  color:
    var(--color-warm-ivory, #F4F0E7) !important;

  padding-block:
    clamp(30px, 4vh, 48px) !important;
}


/* slightly wider presentation area */

.ar-plans-luxe > .ar-container {
  width:
    min(
      1380px,
      calc(100% - (var(--ar-gutter) * 2))
    );
}



/* =========================================================
   TOP HEADING
   ========================================================= */

.ar-plans-luxe-heading {
  display:
    grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(250px, 330px);

  gap:
    clamp(45px, 8vw, 120px);

  align-items:
    end;

  margin-bottom:
    clamp(20px, 2.7vh, 28px);
}


.ar-plans-luxe-title .ar-eyebrow {
  margin-bottom:
    11px !important;

  color:
    var(--color-brass, #B59A68) !important;
}


.ar-plans-luxe-title h2 {
  margin:
    0 !important;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(42px, 4vw, 62px) !important;

  font-weight:
    400;

  line-height:
    0.94 !important;

  letter-spacing:
    -0.025em;

  color:
    var(--color-warm-ivory, #F4F0E7) !important;
}



/* =========================================================
   CURRENT RESIDENCE
   ========================================================= */

.ar-plans-luxe-context {
  padding-left:
    20px;

  padding-bottom:
    2px;

  border-left:
    1px solid rgba(181, 154, 104, 0.75);
}


.ar-plans-luxe-context > span {
  display:
    block;

  margin-bottom:
    7px;

  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    0.16em;

  color:
    var(--color-brass, #B59A68);
}


.ar-plans-luxe-context > strong {
  display:
    block;

  margin-bottom:
    10px;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(18px, 1.7vw, 25px);

  font-weight:
    400;

  line-height:
    1.08;

  color:
    var(--color-warm-ivory, #F4F0E7);
}


.ar-plans-change {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    8px;

  padding-bottom:
    5px;

  border-bottom:
    1px solid rgba(244, 240, 231, 0.34);

  font-size:
    8px;

  color:
    rgba(244, 240, 231, 0.72);

  text-decoration:
    none;
}


.ar-plans-change svg {
  width:
    13px;

  height:
    13px;
}



/* =========================================================
   BOTH DRAWINGS — SAME SCREEN
   ========================================================= */

.ar-plans-luxe-board {
  display:
    grid !important;

  grid-template-columns:
    minmax(0, 1.42fr)
    minmax(300px, 0.72fr) !important;

  gap:
    13px !important;

  /*
     Main trick:
     at desktop both panels stay within one viewport.
  */

  height:
    clamp(360px, 56vh, 570px);
}



/* =========================================================
   BOTH PANELS
   ========================================================= */

.ar-plans-luxe-master,
.ar-plans-luxe-floor {
  display:
    grid;

  grid-template-rows:
    auto minmax(0, 1fr) auto;

  min-width:
    0;

  min-height:
    0;

  height:
    100%;

  margin:
    0 !important;

  overflow:
    hidden;

  border:
    1px solid rgba(244, 240, 231, 0.15);
}



/* =========================================================
   MASTERPLAN
   ========================================================= */

.ar-plans-luxe-master {
  background:
    #3e6d76;
}


.ar-plans-panel-label {
  display:
    flex;

  align-items:
    baseline;

  gap:
    14px;

  min-height:
    43px;

  padding:
    10px 14px;

  background:
    rgba(13, 39, 34, 0.32);

  border-bottom:
    1px solid rgba(244, 240, 231, 0.13);
}


.ar-plans-panel-label > span {
  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    0.15em;

  color:
    var(--color-brass, #B59A68);
}


.ar-plans-panel-label > strong {
  font-family:
    "Instrument Serif",
    serif;

  font-size:
    19px;

  font-weight:
    400;

  color:
    var(--color-warm-ivory, #F4F0E7);
}


.ar-plans-master-image {
  position:
    relative;

  display:
    flex !important;

  align-items:
    center;

  justify-content:
    center;

  min-width:
    0;

  min-height:
    0;

  overflow:
    hidden;

  padding:
    0 !important;

  background:
    #3e6d76 !important;
}


.ar-plans-master-image img {
  display:
    block;

  width:
    100% !important;

  height:
    100% !important;

  aspect-ratio:
    auto !important;

  object-fit:
    contain !important;
}



/* =========================================================
   SELECTED TOWER PANEL
   ========================================================= */

.ar-plans-luxe-floor {
  background:
    var(--color-warm-white, #FAF8F2);

  color:
    var(--color-dark-ink, #172521);
}


.ar-plans-floor-heading {
  min-height:
    112px;

  padding:
    13px 17px 12px;

  border-bottom:
    1px solid rgba(22, 53, 46, 0.13);
}


.ar-plans-floor-heading .ar-eyebrow {
  margin-bottom:
    6px !important;

  font-size:
    7px !important;

  color:
    var(--color-brass, #B59A68) !important;
}


.ar-plans-floor-heading h3 {
  margin:
    0 !important;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(23px, 2vw, 31px) !important;

  font-weight:
    400;

  line-height:
    0.98 !important;

  letter-spacing:
    -0.015em;

  color:
    var(--color-dark-ink, #172521) !important;
}


.ar-plans-floor-heading > p:not(.ar-eyebrow) {
  max-width:
    320px;

  margin-top:
    7px !important;

  font-size:
    8px !important;

  line-height:
    1.5 !important;

  color:
    rgba(23, 37, 33, 0.57) !important;
}


.ar-plans-floor-image {
  position:
    relative;

  display:
    flex !important;

  align-items:
    center;

  justify-content:
    center;

  min-width:
    0;

  min-height:
    0;

  overflow:
    hidden;

  padding:
    9px 13px !important;

  background:
    #fff !important;
}


.ar-plans-floor-image img {
  display:
    block;

  width:
    100% !important;

  height:
    100% !important;

  max-height:
    none !important;

  object-fit:
    contain !important;
}



/* =========================================================
   ENLARGE ACTIONS
   ========================================================= */

.ar-plans-open {
  position:
    absolute;

  right:
    10px;

  bottom:
    10px;

  display:
    inline-flex;

  align-items:
    center;

  gap:
    7px;

  min-height:
    32px;

  padding:
    7px 10px;

  border:
    1px solid rgba(250, 248, 242, 0.15);

  border-radius:
    var(--button-radius);

  background:
    rgba(13, 39, 34, 0.94);

  color:
    var(--color-warm-white, #FAF8F2);

  font-size:
    7px;

  font-weight:
    600;

  box-shadow:
    0 5px 15px rgba(13, 39, 34, 0.12);

  backdrop-filter:
    blur(5px);
}


.ar-plans-open svg {
  width:
    12px;

  height:
    12px;
}



/* =========================================================
   PANEL CAPTIONS
   ========================================================= */

.ar-plans-luxe-board figcaption {
  display:
    flex !important;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  min-height:
    31px;

  margin:
    0 !important;

  padding:
    7px 11px;

  border-top:
    1px solid rgba(22, 53, 46, 0.12);

  font-size:
    7px !important;

  line-height:
    1.35 !important;

  color:
    rgba(23, 37, 33, 0.53) !important;
}


.ar-plans-luxe-master figcaption {
  border-top-color:
    rgba(244, 240, 231, 0.12);

  color:
    rgba(244, 240, 231, 0.60) !important;
}


.ar-plans-luxe-board figcaption a {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    5px;

  white-space:
    nowrap;
}


.ar-plans-luxe-board figcaption svg {
  width:
    10px;

  height:
    10px;
}



/* =========================================================
   QUIET DISCLAIMER
   ========================================================= */

.ar-plans-luxe-disclosure {
  max-width:
    880px;

  margin:
    11px 0 0 !important;

  font-size:
    7px !important;

  line-height:
    1.55 !important;

  color:
    rgba(244, 240, 231, 0.43) !important;
}



/* =========================================================
   MEDIUM DESKTOP / TABLET
   ========================================================= */

@media (max-width: 1000px) {

  .ar-plans-luxe-board {
    grid-template-columns:
      minmax(0, 1.18fr)
      minmax(280px, 0.82fr) !important;

    height:
      clamp(360px, 53vh, 510px);
  }


  .ar-plans-luxe-heading {
    grid-template-columns:
      minmax(0, 1fr)
      260px;

    gap:
      40px;
  }


  .ar-plans-floor-heading {
    min-height:
      105px;
  }

}



/* =========================================================
   MOBILE
   STACK THEM — READABILITY WINS
   ========================================================= */

@media (max-width: 700px) {

  .ar-plans-luxe {
    padding-block:
      56px !important;
  }


  .ar-plans-luxe-heading {
    grid-template-columns:
      1fr;

    gap:
      23px;

    margin-bottom:
      25px;
  }


  .ar-plans-luxe-context {
    padding-left:
      14px;
  }


  .ar-plans-luxe-board {
    grid-template-columns:
      1fr !important;

    height:
      auto;

    gap:
      22px !important;
  }


  .ar-plans-luxe-master,
  .ar-plans-luxe-floor {
    height:
      auto;
  }


  .ar-plans-master-image {
    min-height:
      265px;
  }


  .ar-plans-master-image img {
    height:
      auto !important;
  }


  .ar-plans-floor-heading {
    min-height:
      0;
  }


  .ar-plans-floor-image {
    min-height:
      330px;

    padding:
      14px !important;
  }


  .ar-plans-floor-image img {
    height:
      auto !important;
  }


  .ar-plans-open {
    left:
      10px;

    right:
      10px;

    justify-content:
      space-between;

    min-height:
      40px;

    font-size:
      9px;
  }


  .ar-plans-luxe-board figcaption {
    flex-direction:
      column;

    align-items:
      flex-start;

    gap:
      4px;

    padding:
      9px 11px;
  }


  .ar-plans-luxe-disclosure {
    margin-top:
      16px !important;

    font-size:
      8px !important;
  }

}
/* =========================================================
   04 / THE ARENA EXPERIENCE
   DUAL LUXURY CAROUSELS
   ========================================================= */

.ar-experience-luxe {
  background:
    var(--color-warm-ivory, #F4F0E7);
}


/* =========================================================
   MAIN COMPOSITION
   ========================================================= */

.ar-experience-luxe-grid {
  display:
    grid !important;

  grid-template-columns:
    minmax(420px, 0.9fr)
    minmax(0, 1.1fr) !important;

  gap:
    clamp(58px, 7vw, 112px) !important;

  align-items:
    start;
}


.ar-experience-visuals {
  min-width:
    0;
}



/* =========================================================
   SECTION INTRO
   ========================================================= */

.ar-experience-luxe-intro {
  margin-bottom:
    30px;
}


.ar-experience-luxe-intro h2 {
  margin-top:
    22px;

  font-size:
    clamp(56px, 4.8vw, 76px);

  line-height:
    0.94;
}


.ar-experience-luxe-intro
> p:not(.ar-eyebrow) {

  max-width:
    460px !important;

  margin-top:
    22px !important;

  font-size:
    13px;

  line-height:
    1.75;
}


.ar-experience-luxe-intro
.ar-proposed-label {

  margin-top:
    15px;
}



/* =========================================================
   CAROUSEL SHELL
   ========================================================= */

.ar-amenity-carousel {
  margin-top:
    24px;

  outline:
    none;
}


.ar-amenity-carousel
+ .ar-amenity-carousel {

  margin-top:
    28px;
}


.ar-amenity-carousel:focus-visible {

  outline:
    1px solid
    var(--color-brass, #B59A68);

  outline-offset:
    5px;
}



/* =========================================================
   CAROUSEL HEADER
   ========================================================= */

.ar-amenity-carousel-head {

  display:
    grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(150px, 0.72fr);

  gap:
    24px;

  align-items:
    end;

  margin-bottom:
    13px;
}


.ar-amenity-carousel-head
.ar-eyebrow {

  margin-bottom:
    7px;

  color:
    var(--color-brass, #B59A68);

  font-size:
    7px;
}


.ar-amenity-carousel-head h3 {

  margin:
    0;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(27px, 2.2vw, 35px);

  font-weight:
    400;

  line-height:
    1;
}


.ar-amenity-carousel-head
> p {

  margin:
    0;

  font-size:
    9px;

  line-height:
    1.55;

  color:
    var(--color-muted-text);
}



/* =========================================================
   VISUAL STAGE
   ========================================================= */

.ar-amenity-carousel-stage {

  position:
    relative;

  overflow:
    hidden;

  aspect-ratio:
    16 / 8.7;

  background:
    var(--color-deep-forest, #0D2722);
}


.ar-amenity-slide {

  position:
    relative;

  width:
    100%;

  height:
    100%;

  margin:
    0;
}


.ar-amenity-slide[hidden] {

  display:
    none !important;
}


.ar-amenity-slide img {

  display:
    block;

  width:
    100%;

  height:
    100%;

  object-fit:
    cover;

  /*
    Premium / cinematic treatment for
    illustrative visuals.
  */

  filter:
    brightness(0.82)
    saturate(0.88)
    contrast(1.04);
}



/* =========================================================
   CINEMATIC IMAGE SHADE
   ========================================================= */

.ar-amenity-slide-shade {

  position:
    absolute;

  inset:
    0;

  background:
    linear-gradient(
      180deg,
      rgba(13,39,34,0.02) 36%,
      rgba(13,39,34,0.68) 100%
    );

  pointer-events:
    none;
}



/* =========================================================
   PREMIUM PLACEHOLDER

   This is what you see BEFORE adding photos.
   Once an image path exists, it disappears automatically.
   ========================================================= */

.ar-amenity-placeholder {

  position:
    absolute;

  inset:
    0;

  display:
    flex;

  flex-direction:
    column;

  justify-content:
    flex-end;

  padding:
    24px;

  background:

    linear-gradient(
      135deg,
      rgba(181,154,104,0.08),
      transparent 40%
    ),

    linear-gradient(
      160deg,
      #183c34 0%,
      #0D2722 72%
    );
}


.ar-amenity-placeholder::before,
.ar-amenity-placeholder::after {

  content:
    "";

  position:
    absolute;

  border:
    1px solid
    rgba(181,154,104,0.18);

  pointer-events:
    none;
}


.ar-amenity-placeholder::before {

  inset:
    18px;
}


.ar-amenity-placeholder::after {

  width:
    42%;

  height:
    1px;

  left:
    29%;

  top:
    50%;

  border-width:
    1px 0 0;
}


.ar-amenity-placeholder span {

  position:
    relative;

  z-index:
    1;

  margin-bottom:
    7px;

  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    0.18em;

  color:
    var(--color-brass, #B59A68);
}


.ar-amenity-placeholder strong {

  position:
    relative;

  z-index:
    1;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    28px;

  font-weight:
    400;

  color:
    rgba(250,248,242,0.76);
}



/* =========================================================
   IMAGE CAPTION
   ========================================================= */

.ar-amenity-slide figcaption {

  position:
    absolute;

  z-index:
    2;

  left:
    20px;

  right:
    20px;

  bottom:
    17px;

  margin:
    0 !important;

  color:
    var(--color-warm-white, #FAF8F2) !important;
}


.ar-amenity-slide figcaption
> div {

  max-width:
    72%;
}


.ar-amenity-slide
figcaption span {

  display:
    block;

  margin-bottom:
    6px;

  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    0.16em;

  color:
    var(--color-brass, #B59A68);
}


.ar-amenity-slide
figcaption strong {

  display:
    block;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(25px, 2.3vw, 34px);

  font-weight:
    400;

  line-height:
    1;
}


.ar-amenity-slide
figcaption small {

  display:
    block;

  margin-top:
    7px;

  font-size:
    7px;

  line-height:
    1.4;

  color:
    rgba(250,248,242,0.62);
}



/* =========================================================
   COUNTER + ARROWS
   ========================================================= */

.ar-amenity-carousel-controls {

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    20px;

  padding-top:
    11px;

  padding-bottom:
    10px;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-amenity-counter {

  display:
    inline-flex;

  align-items:
    baseline;

  gap:
    6px;

  font-size:
    8px;

  color:
    var(--color-muted-text);
}


.ar-amenity-counter strong {

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    19px;

  font-weight:
    400;

  color:
    var(--color-dark-ink, #172521);
}


.ar-amenity-counter i {

  font-style:
    normal;

  opacity:
    0.45;
}



/* ARROWS */

.ar-amenity-arrows {

  display:
    flex;

  align-items:
    center;

  gap:
    6px;
}


.ar-amenity-arrows button {

  width:
    36px;

  height:
    32px;

  border:
    1px solid
    rgba(22,53,46,0.20);

  background:
    transparent;

  color:
    var(--color-primary-forest, #16352E);

  font-size:
    14px;

  cursor:
    pointer;

  transition:
    background 160ms ease,
    color 160ms ease,
    border-color 160ms ease;
}


@media (hover: hover) and (pointer: fine) {

  .ar-amenity-arrows
  button:hover {

    border-color:
      var(--color-primary-forest, #16352E);

    background:
      var(--color-primary-forest, #16352E);

    color:
      var(--color-warm-white, #FAF8F2);
  }

}


.ar-amenity-arrows
button:disabled {

  opacity:
    0.3;

  cursor:
    default;
}



/* =========================================================
   RIGHT-SIDE STORY
   ========================================================= */

.ar-experience-luxe-stories article {

  padding-block:
    26px 29px;
}


.ar-experience-luxe-stories
article:first-child {

  padding-top:
    16px;
}


.ar-experience-luxe-stories h3 {

  font-size:
    clamp(34px, 3vw, 45px);
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

  .ar-experience-luxe-grid {

    grid-template-columns:
      minmax(350px, 0.9fr)
      minmax(0, 1.1fr) !important;

    gap:
      45px !important;
  }


  .ar-amenity-carousel-head {

    grid-template-columns:
      1fr;

    gap:
      8px;
  }


  .ar-amenity-carousel-head
  > p {

    max-width:
      360px;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-experience-luxe-grid {

    grid-template-columns:
      1fr !important;

    gap:
      42px !important;
  }


  .ar-experience-luxe-intro h2 {

    font-size:
      clamp(48px, 13vw, 64px);
  }


  .ar-amenity-carousel-stage {

    aspect-ratio:
      4 / 3;
  }


  .ar-amenity-slide
  figcaption > div {

    max-width:
      82%;
  }


  .ar-amenity-slide
  figcaption strong {

    font-size:
      30px;
  }


  .ar-experience-luxe-stories
  article:first-child {

    padding-top:
      23px;
  }

}
/* Empty carousel state */

.ar-amenity-placeholder-empty {
  padding: 0 !important;
}

.ar-amenity-placeholder-empty::after {
  width: 28%;
  left: 36%;
  opacity: 0.45;
}
/* =========================================================
   04 / ARENA EXPERIENCE — ALIGNMENT FIX
   ========================================================= */

/* Center the whole section properly */

.ar-experience-luxe > .ar-container {
  width: min(
    1380px,
    calc(100% - (var(--ar-gutter) * 2))
  ) !important;

  margin-inline: auto !important;
}


/* Balanced two-column composition */

.ar-experience-luxe-grid {
  display: grid !important;

  grid-template-columns:
    minmax(0, 0.92fr)
    minmax(0, 1.08fr) !important;

  gap:
    clamp(70px, 8vw, 125px) !important;

  align-items: start !important;
}


/* LEFT COLUMN */

.ar-experience-visuals {
  width: 100% !important;
  max-width: none !important;

  min-width: 0;
}


/* RIGHT COLUMN */

.ar-experience-luxe-stories {
  width: 100% !important;
  max-width: none !important;

  min-width: 0;

  margin: 0 !important;
  padding: 0 !important;
}


/* Make first story begin at same visual height as intro */

.ar-experience-luxe-stories article:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* =========================================================
   LEFT INTRO — CLEAN ALIGNMENT
   ========================================================= */

.ar-experience-luxe-intro {
  width: 100%;

  margin: 0 0 32px !important;
}


.ar-experience-luxe-intro h2 {
  margin-top: 20px !important;
}


.ar-experience-luxe-intro > p:not(.ar-eyebrow) {
  max-width: 430px !important;
}


/* =========================================================
   CAROUSEL HEADERS
   ========================================================= */

.ar-amenity-carousel {
  width: 100%;
}


.ar-amenity-carousel-head {
  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(150px, 0.65fr) !important;

  gap: 28px !important;

  align-items: end !important;

  width: 100%;
}


.ar-amenity-carousel-head > div,
.ar-amenity-carousel-head > p {
  min-width: 0;
}


.ar-amenity-carousel-head > p {
  justify-self: end;

  max-width: 185px;

  text-align: left;
}


/* =========================================================
   CAROUSEL STAGE
   ========================================================= */

.ar-amenity-carousel-stage {
  width: 100% !important;

  aspect-ratio: 16 / 8.3 !important;
}


.ar-amenity-carousel-controls {
  width: 100%;
}


/* Same spacing between both carousels */

.ar-amenity-carousel + .ar-amenity-carousel {
  margin-top: 36px !important;
}


/* =========================================================
   RIGHT STORY ROWS
   ========================================================= */

.ar-experience-luxe-stories article {
  display: grid !important;

  grid-template-columns:
    38px
    minmax(0, 1fr) !important;

  gap: 18px !important;

  width: 100%;

  padding:
    25px
    0
    28px !important;
}


.ar-experience-luxe-stories article:first-child {
  border-top:
    1px solid var(--ar-line);

  padding-top:
    24px !important;
}


.ar-experience-luxe-stories h3 {
  max-width: none;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

  .ar-experience-luxe-grid {
    grid-template-columns:
      minmax(340px, 0.9fr)
      minmax(0, 1.1fr) !important;

    gap: 48px !important;
  }


  .ar-amenity-carousel-head {
    grid-template-columns:
      1fr !important;

    gap: 8px !important;
  }


  .ar-amenity-carousel-head > p {
    justify-self: start;

    max-width: 360px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-experience-luxe-grid {
    grid-template-columns:
      1fr !important;

    gap: 48px !important;
  }


  .ar-experience-luxe-stories article {
    grid-template-columns:
      34px
      minmax(0, 1fr) !important;

    gap: 13px !important;
  }


  .ar-amenity-carousel-stage {
    aspect-ratio:
      4 / 3 !important;
  }

}

/* =========================================================
   04 / ARENA EXPERIENCE
   FINAL STRUCTURAL ALIGNMENT
   ========================================================= */

.ar-experience-luxe-shell {
  display: block !important;
}


/* =========================================================
   FULL-WIDTH TOP INTRO
   ========================================================= */

.ar-experience-luxe-top {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(340px, 0.72fr);

  gap:
    clamp(70px, 10vw, 155px);

  align-items: end;

  margin-bottom:
    clamp(42px, 5vw, 65px);

  padding-bottom:
    34px;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-experience-luxe-top .ar-eyebrow {
  margin-bottom:
    22px;

  color:
    var(--color-brass, #B59A68);
}


.ar-experience-luxe-top h2 {
  margin:
    0;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(58px, 5vw, 78px);

  font-weight:
    400;

  line-height:
    0.94;

  letter-spacing:
    -0.03em;
}


.ar-experience-luxe-top-copy {
  max-width:
    500px;

  padding-bottom:
    5px;
}


.ar-experience-luxe-top-copy > p {
  margin:
    0;

  font-size:
    14px;

  line-height:
    1.75;

  color:
    rgba(23, 37, 33, 0.68);
}


.ar-experience-luxe-top-copy
.ar-proposed-label {

  display:
    block;

  margin-top:
    18px;
}



/* =========================================================
   BODY — THIS IS THE IMPORTANT FIX
   ========================================================= */

.ar-experience-luxe-content {
  display:
    grid;

  grid-template-columns:
    minmax(0, 0.9fr)
    minmax(0, 1.1fr);

  gap:
    clamp(70px, 8vw, 125px);

  align-items:
    start;
}


/* Both sides now begin at EXACTLY the same Y position */

.ar-experience-visuals,
.ar-experience-luxe-stories {
  min-width:
    0;

  margin:
    0 !important;

  padding:
    0 !important;
}



/* =========================================================
   FIRST CAROUSEL
   ========================================================= */

.ar-experience-visuals
> .ar-amenity-carousel:first-child {

  margin-top:
    0 !important;
}



/* =========================================================
   FIRST STORY
   ========================================================= */

.ar-experience-luxe-stories
article:first-child {

  margin-top:
    0 !important;

  padding-top:
    0 !important;

  border-top:
    0 !important;
}



/* Give both first items a matching top rule */

.ar-experience-visuals
> .ar-amenity-carousel:first-child
.ar-amenity-carousel-head {

  padding-top:
    20px;

  border-top:
    1px solid var(--ar-line);
}


.ar-experience-luxe-stories
article:first-child {

  padding-top:
    20px !important;

  border-top:
    1px solid var(--ar-line) !important;
}



/* =========================================================
   CAROUSELS
   ========================================================= */

.ar-amenity-carousel {
  width:
    100%;
}


.ar-amenity-carousel
+ .ar-amenity-carousel {

  margin-top:
    42px !important;
}


.ar-amenity-carousel-head {
  margin-bottom:
    14px;
}


.ar-amenity-carousel-stage {
  width:
    100%;

  aspect-ratio:
    16 / 8.5;
}



/* =========================================================
   RIGHT STORY
   ========================================================= */

.ar-experience-luxe-stories article {
  display:
    grid !important;

  grid-template-columns:
    36px
    minmax(0, 1fr);

  gap:
    18px;

  padding:
    27px
    0
    30px !important;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-experience-luxe-stories h3 {
  font-size:
    clamp(34px, 3vw, 45px);
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {

  .ar-experience-luxe-top {
    grid-template-columns:
      1fr 1fr;

    gap:
      48px;
  }


  .ar-experience-luxe-content {
    grid-template-columns:
      minmax(340px, 0.9fr)
      minmax(0, 1.1fr);

    gap:
      48px;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-experience-luxe-top {
    grid-template-columns:
      1fr;

    gap:
      25px;

    margin-bottom:
      35px;
  }


  .ar-experience-luxe-top h2 {
    font-size:
      clamp(48px, 13vw, 64px);
  }


  .ar-experience-luxe-content {
    grid-template-columns:
      1fr;

    gap:
      44px;
  }


  .ar-experience-luxe-stories
  article:first-child {

    padding-top:
      20px !important;
  }

}

/* =========================================================
   06 / A CLEARER VIEW
   DARK TRUST INTERLUDE
   ========================================================= */

.ar-trust-luxe {
  background:
    var(--color-deep-forest, #0D2722) !important;

  color:
    var(--color-warm-ivory, #F4F0E7) !important;

  padding-block:
    clamp(78px, 7vw, 110px) !important;
}


/* =========================================================
   TWO-COLUMN COMPOSITION
   ========================================================= */

.ar-trust-luxe-grid {
  display:
    grid !important;

  grid-template-columns:
    minmax(0, 0.88fr)
    minmax(0, 1.12fr) !important;

  gap:
    clamp(70px, 9vw, 145px) !important;

  align-items:
    start;
}



/* =========================================================
   LEFT
   ========================================================= */

.ar-trust-luxe-intro {
  max-width:
    560px;
}


.ar-trust-luxe-intro .ar-eyebrow {
  margin-bottom:
    25px;

  color:
    var(--color-brass, #B59A68) !important;
}


.ar-trust-luxe-intro h2 {
  margin:
    0;

  max-width:
    570px;

  font-size:
    clamp(54px, 4.8vw, 74px) !important;

  line-height:
    0.95 !important;

  letter-spacing:
    -0.03em;

  color:
    var(--color-warm-ivory, #F4F0E7) !important;
}


.ar-trust-luxe-lead {
  max-width:
    430px !important;

  margin-top:
    26px !important;

  font-size:
    14px !important;

  line-height:
    1.8 !important;

  color:
    rgba(244, 240, 231, 0.67) !important;
}



/* =========================================================
   CURRENT SELECTION
   ========================================================= */

.ar-trust-selection {
  max-width:
    440px;

  margin-top:
    37px;

  padding:
    18px 0 18px 20px;

  border-left:
    1px solid
    var(--color-brass, #B59A68);
}


.ar-trust-selection > span {
  display:
    block;

  margin-bottom:
    8px;

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.17em;

  color:
    var(--color-brass, #B59A68);
}


.ar-trust-selection > strong {
  display:
    block;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(23px, 2vw, 31px);

  font-weight:
    400;

  line-height:
    1.08;

  color:
    var(--color-warm-ivory, #F4F0E7);
}



/* OFFICIAL PROJECT LINK */

.ar-trust-official {
  margin-top:
    27px;

  color:
    rgba(244, 240, 231, 0.76) !important;
}



/* =========================================================
   RIGHT / VERIFICATION ROWS
   ========================================================= */

.ar-trust-luxe-details {
  border-top:
    1px solid rgba(244, 240, 231, 0.20);
}


.ar-trust-luxe-row {
  display:
    grid;

  grid-template-columns:
    40px
    minmax(0, 1fr);

  gap:
    21px;

  padding:
    24px 0 27px;

  border-bottom:
    1px solid rgba(244, 240, 231, 0.17);
}


.ar-trust-luxe-number {
  padding-top:
    2px;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    18px;

  color:
    var(--color-brass, #B59A68);
}


.ar-trust-luxe-label {
  margin:
    0 0 8px !important;

  font-size:
    8px !important;

  font-weight:
    600;

  letter-spacing:
    0.16em;

  color:
    var(--color-brass, #B59A68) !important;
}


.ar-trust-luxe-row strong {
  display:
    block;

  font-family:
    "Instrument Serif",
    serif;

  font-size:
    clamp(25px, 2.2vw, 34px);

  font-weight:
    400;

  line-height:
    1.05;

  color:
    var(--color-warm-ivory, #F4F0E7);
}


.ar-trust-luxe-row
> div
> p:not(.ar-trust-luxe-label):not(.ar-trust-luxe-registration) {

  max-width:
    580px;

  margin-top:
    11px !important;

  font-size:
    11px !important;

  line-height:
    1.75 !important;

  color:
    rgba(244, 240, 231, 0.61) !important;
}



/* =========================================================
   RERA
   ========================================================= */

.ar-trust-luxe-registration {
  margin-top:
    9px !important;

  font-size:
    11px !important;

  font-weight:
    600;

  letter-spacing:
    0.07em;

  color:
    var(--color-brass, #B59A68) !important;
}


.ar-trust-luxe-links {
  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    13px 26px;

  margin-top:
    15px;
}


.ar-trust-luxe-links a {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    6px;

  padding-bottom:
    4px;

  border-bottom:
    1px solid rgba(244, 240, 231, 0.34);

  font-size:
    9px;

  color:
    rgba(244, 240, 231, 0.80);
}


.ar-trust-luxe-links svg {
  width:
    12px;

  height:
    12px;
}



/* =========================================================
   TABLET / MOBILE
   ========================================================= */

@media (max-width: 800px) {

  .ar-trust-luxe-grid {
    grid-template-columns:
      1fr !important;

    gap:
      48px !important;
  }


  .ar-trust-luxe-intro {
    max-width:
      650px;
  }

}


@media (max-width: 600px) {

  .ar-trust-luxe {
    padding-block:
      66px !important;
  }


  .ar-trust-luxe-intro h2 {
    font-size:
      clamp(46px, 13vw, 60px) !important;
  }


  .ar-trust-selection {
    margin-top:
      30px;
  }


  .ar-trust-luxe-row {
    grid-template-columns:
      31px
      minmax(0, 1fr);

    gap:
      13px;

    padding:
      21px 0 23px;
  }

}

/* =========================================================
   04 / ARENA EXPERIENCE — AMENITY CAROUSELS
   ========================================================= */

.ar-experience-luxe {
  background:
    var(--color-warm-ivory);
}



/* =========================================================
   TOP INTRO
   ========================================================= */

.ar-experience-luxe-top {
  display:
    grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(340px, 0.72fr);

  gap:
    clamp(70px, 10vw, 155px);

  align-items:
    end;

  margin-bottom:
    clamp(42px, 5vw, 65px);

  padding-bottom:
    34px;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-experience-luxe-top h2 {
  margin:
    0;

  font-size:
    clamp(54px, 5.5vw, 78px);

  line-height:
    0.95;

  letter-spacing:
    -0.03em;
}


.ar-experience-top-copy {
  max-width:
    420px;
}


.ar-experience-top-copy > p {
  margin:
    0 0 20px;

  font-size:
    13px;

  line-height:
    1.8;

  color:
    var(--color-muted-text);
}



/* =========================================================
   MAIN TWO-COLUMN AREA
   ========================================================= */

.ar-experience-luxe-content {
  display:
    grid;

  grid-template-columns:
    minmax(0, 0.9fr)
    minmax(0, 1.1fr);

  gap:
    clamp(70px, 8vw, 125px);

  align-items:
    start;
}


.ar-experience-visuals,
.ar-experience-luxe-stories {
  min-width:
    0;

  margin:
    0 !important;

  padding:
    0 !important;
}



/* =========================================================
   EACH CAROUSEL
   ========================================================= */

.ar-amenity-carousel {
  width:
    100%;

  outline:
    none;
}


.ar-amenity-carousel + .ar-amenity-carousel {
  margin-top:
    62px;
}


.ar-amenity-carousel-head {
  display:
    grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(150px, 0.75fr);

  gap:
    30px;

  align-items:
    end;

  padding-top:
    20px;

  margin-bottom:
    19px;

  border-top:
    1px solid var(--ar-line);
}


.ar-amenity-carousel-head .ar-eyebrow {
  margin-bottom:
    8px;
}


.ar-amenity-carousel-head h3 {
  margin:
    0;

  font-family:
    var(--font-headline);

  font-size:
    clamp(28px, 2.7vw, 40px);

  font-weight:
    400;

  line-height:
    1;

  letter-spacing:
    -0.02em;
}


.ar-amenity-carousel-intro {
  margin:
    0;

  font-size:
    10px;

  line-height:
    1.7;

  color:
    var(--color-muted-text);
}



/* =========================================================
   SLIDE
   ========================================================= */

.ar-amenity-stage {
  position:
    relative;

  width:
    100%;

  overflow:
    hidden;
}


.ar-amenity-slide {
  width:
    100%;
}


.ar-amenity-slide[hidden] {
  display:
    none !important;
}



/* =========================================================
   IMAGE
   ========================================================= */

.ar-amenity-figure {
  position:
    relative;

  width:
    100%;

  aspect-ratio:
    16 / 10;

  margin:
    0;

  overflow:
    hidden;

  background:
    var(--color-deep-forest);
}


.ar-amenity-figure img {
  display:
    block;

  width:
    100%;

  height:
    100%;

  object-fit:
    cover;
}


.ar-amenity-image-shade {
  position:
    absolute;

  inset:
    0;

  pointer-events:
    none;

  background:
    linear-gradient(
      180deg,
      rgba(13, 39, 34, 0) 55%,
      rgba(13, 39, 34, 0.40) 100%
    );
}



/* =========================================================
   IMPORTANT:
   OFFICIAL ARTIST IMPRESSION DISCLOSURE ON IMAGE
   ========================================================= */

.ar-amenity-disclosure {
  position: absolute;

  left: 18px;
  bottom: 16px;

  z-index: 3;

  max-width: calc(100% - 36px);

  padding: 0;

  border: 0;

  background: transparent;

  color: #FAF8F2;

  font-size: 8px;
  font-weight: 600;

  line-height: 1.4;

  letter-spacing: 0.12em;

  text-transform: uppercase;

  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.65),
    0 2px 8px rgba(0, 0, 0, 0.45);

  backdrop-filter: none;
}


/* =========================================================
   SLIDE TEXT
   ========================================================= */

.ar-amenity-copy {
  display:
    grid;

  grid-template-columns:
    minmax(0, 0.65fr)
    minmax(0, 1.35fr);

  column-gap:
    28px;

  row-gap:
    7px;

  align-items:
    start;

  padding:
    19px 0 4px;
}


.ar-amenity-copy .ar-eyebrow {
  grid-column:
    1;

  grid-row:
    1 / span 2;

  margin:
    3px 0 0;

  color:
    var(--color-brass);
}


.ar-amenity-copy h4 {
  grid-column:
    2;

  margin:
    0;

  font-family:
    var(--font-headline);

  font-size:
    clamp(26px, 2.4vw, 36px);

  font-weight:
    400;

  line-height:
    1;

  letter-spacing:
    -0.02em;

  color:
    var(--color-dark-ink);
}


.ar-amenity-copy > p:not(.ar-eyebrow) {
  grid-column:
    2;

  margin:
    0;

  max-width:
    450px;

  font-size:
    10px;

  line-height:
    1.7;

  color:
    var(--color-muted-text);
}



/* =========================================================
   EMPTY PROJECT-AMENITY PLACEHOLDER
   ========================================================= */

.ar-amenity-placeholder {
  position:
    relative;

  display:
    grid;

  place-items:
    center;

  width:
    100%;

  aspect-ratio:
    16 / 10;

  overflow:
    hidden;

  border:
    1px solid rgba(22, 53, 46, 0.15);

  background:
    rgba(22, 53, 46, 0.035);
}


.ar-amenity-placeholder::before,
.ar-amenity-placeholder::after {
  content:
    "";

  position:
    absolute;

  pointer-events:
    none;
}


.ar-amenity-placeholder::before {
  inset:
    16px;

  border:
    1px solid rgba(22, 53, 46, 0.09);
}


.ar-amenity-placeholder::after {
  width:
    90%;

  height:
    1px;

  transform:
    rotate(-28deg);

  background:
    rgba(22, 53, 46, 0.08);
}


.ar-amenity-placeholder span {
  position:
    relative;

  z-index:
    2;

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.16em;

  color:
    rgba(22, 53, 46, 0.40);
}



/* =========================================================
   CAROUSEL CONTROLS
   ========================================================= */

.ar-amenity-controls {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    20px;

  margin-top:
    15px;

  padding-top:
    14px;

  border-top:
    1px solid var(--ar-line);
}


.ar-amenity-counter {
  display:
    inline-flex;

  align-items:
    baseline;

  gap:
    7px;

  font-size:
    8px;

  color:
    rgba(23, 37, 33, 0.42);
}


.ar-amenity-counter strong {
  font-family:
    var(--font-headline);

  font-size:
    19px;

  font-weight:
    400;

  color:
    var(--color-dark-ink);
}


.ar-amenity-arrows {
  display:
    flex;

  gap:
    7px;
}


.ar-amenity-arrows button {
  display:
    grid;

  place-items:
    center;

  width:
    42px;

  height:
    42px;

  padding:
    0;

  border:
    1px solid rgba(22, 53, 46, 0.23);

  border-radius:
    50%;

  background:
    transparent;

  color:
    var(--color-primary-forest);

  cursor:
    pointer;

  transition:
    background 170ms ease,
    color 170ms ease,
    border-color 170ms ease,
    transform 170ms ease;
}


@media (hover: hover) and (pointer: fine) {

  .ar-amenity-arrows button:hover {
    background:
      var(--color-primary-forest);

    border-color:
      var(--color-primary-forest);

    color:
      var(--color-warm-white);

    transform:
      translateY(-1px);
  }

}



/* =========================================================
   RIGHT-SIDE STORIES
   ========================================================= */

.ar-experience-luxe-stories article {
  display:
    grid;

  grid-template-columns:
    28px
    minmax(0, 1fr);

  gap:
    21px;

  margin:
    0 !important;

  padding:
    20px 0 28px !important;

  border-top:
    1px solid var(--ar-line) !important;
}


.ar-experience-luxe-stories article + article {
  margin-top:
    0 !important;
}


.ar-experience-luxe-stories
.ar-experience-number {
  padding-top:
    3px;

  font-size:
    10px;

  color:
    #7e745a;
}


.ar-experience-luxe-stories
.ar-eyebrow {
  margin-bottom:
    8px;

  font-size:
    8px;
}


.ar-experience-luxe-stories h3 {
  margin:
    0 0 12px;

  font-size:
    clamp(31px, 3vw, 40px);
}


.ar-experience-luxe-stories
article p:not(.ar-eyebrow) {
  margin:
    0;

  font-size:
    12px;

  line-height:
    1.75;

  color:
    var(--color-muted-text);
}


.ar-experience-luxe-stories
.ar-text-link {
  margin-top:
    14px;

  font-size:
    10px;
}


.ar-experience-luxe-stories
> .ar-source-link {
  display:
    inline-flex;

  margin:
    17px 0 0 49px;
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

  .ar-experience-luxe-content {
    grid-template-columns:
      minmax(0, 0.95fr)
      minmax(0, 1.05fr);

    gap:
      55px;
  }


  .ar-amenity-carousel-head {
    grid-template-columns:
      1fr;

    gap:
      10px;
  }


  .ar-amenity-carousel-intro {
    max-width:
      330px;
  }


  .ar-amenity-copy {
    grid-template-columns:
      1fr;
  }


  .ar-amenity-copy .ar-eyebrow,
  .ar-amenity-copy h4,
  .ar-amenity-copy > p:not(.ar-eyebrow) {
    grid-column:
      1;
  }


  .ar-amenity-copy .ar-eyebrow {
    grid-row:
      auto;

    margin:
      0 0 3px;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-experience-luxe-top {
    grid-template-columns:
      1fr;

    gap:
      24px;

    margin-bottom:
      36px;

    padding-bottom:
      27px;
  }


  .ar-experience-luxe-top h2 {
    font-size:
      clamp(48px, 14vw, 63px);
  }


  .ar-experience-luxe-content {
    grid-template-columns:
      1fr;

    gap:
      58px;
  }


  .ar-experience-visuals {
    width:
      100%;
  }


  .ar-amenity-carousel + .ar-amenity-carousel {
    margin-top:
      54px;
  }


  .ar-amenity-carousel-head {
    grid-template-columns:
      1fr;

    gap:
      9px;

    margin-bottom:
      16px;
  }


  .ar-amenity-carousel-head h3 {
    font-size:
      32px;
  }


  .ar-amenity-figure,
  .ar-amenity-placeholder {
    aspect-ratio:
      4 / 3;
  }


  .ar-amenity-disclosure {
    left:
      11px;

    bottom:
      11px;

    max-width:
      calc(100% - 22px);

    padding:
      7px 8px;

    font-size:
      6px;

    letter-spacing:
      0.09em;
  }


  .ar-amenity-copy {
    grid-template-columns:
      1fr;

    gap:
      7px;

    padding-top:
      17px;
  }


  .ar-amenity-copy .ar-eyebrow,
  .ar-amenity-copy h4,
  .ar-amenity-copy > p:not(.ar-eyebrow) {
    grid-column:
      1;
  }


  .ar-amenity-copy .ar-eyebrow {
    grid-row:
      auto;

    margin:
      0;
  }


  .ar-amenity-copy h4 {
    font-size:
      31px;
  }


  .ar-amenity-copy
  > p:not(.ar-eyebrow) {
    font-size:
      11px;
  }


  .ar-amenity-arrows button {
    width:
      46px;

    height:
      46px;
  }


  .ar-experience-luxe-stories article {
    grid-template-columns:
      21px
      minmax(0, 1fr);

    gap:
      14px;

    padding:
      20px 0 25px !important;
  }


  .ar-experience-luxe-stories
  > .ar-source-link {
    margin-left:
      35px;
  }

}

/* =========================================================
   ARENA EXPERIENCE — MATCHED CAROUSEL / TEXT ROWS
   ========================================================= */

.ar-experience-row {
  display: grid;

  grid-template-columns:
    minmax(0, 0.9fr)
    minmax(0, 1.1fr);

  gap:
    clamp(70px, 8vw, 125px);

  align-items: start;
}


.ar-experience-row + .ar-experience-row {
  margin-top:
    clamp(72px, 8vw, 120px);

  padding-top:
    clamp(55px, 6vw, 80px);

  border-top:
    1px solid var(--ar-line);
}


.ar-experience-row-carousel,
.ar-experience-row-copy {
  min-width: 0;
}


/* Remove redundant top line because row itself now controls rhythm */

.ar-experience-row
.ar-amenity-carousel-head {
  padding-top: 20px;

  border-top:
    1px solid var(--ar-line);
}



/* =========================================================
   PROJECT STORIES
   ========================================================= */

.ar-experience-row-copy
.ar-experience-story {
  display: grid;

  grid-template-columns:
    28px minmax(0, 1fr);

  gap:
    22px;

  padding:
    20px 0 30px;

  border-top:
    1px solid var(--ar-line);
}


.ar-experience-row-copy
.ar-experience-story + .ar-experience-story {
  margin-top: 0;
}


.ar-experience-story
.ar-experience-number {
  padding-top: 3px;

  font-size: 9px;

  color:
    #8b7e60;
}


.ar-experience-story h3 {
  margin:
    0 0 13px;

  font-size:
    clamp(34px, 3.1vw, 45px);

  line-height: 1;
}


.ar-experience-story
p:not(.ar-eyebrow) {
  margin: 0;

  max-width: 620px;

  font-size: 11px;

  line-height: 1.8;

  color:
    var(--color-muted-text);
}


.ar-experience-story
.ar-text-link {
  margin-top: 15px;
}



/* =========================================================
   CLUBHOUSE RIGHT SIDE
   ========================================================= */

.ar-clubhouse-intro {
  padding:
    20px 0 30px;

  border-top:
    1px solid var(--ar-line);
}


.ar-clubhouse-intro h3 {
  margin:
    0 0 18px;

  font-family:
    var(--font-headline);

  font-size:
    clamp(42px, 4vw, 58px);

  font-weight: 400;

  line-height:
    0.98;

  letter-spacing:
    -0.025em;
}


.ar-clubhouse-intro > p:not(.ar-eyebrow) {
  max-width:
    600px;

  margin: 0;

  font-size:
    12px;

  line-height:
    1.8;

  color:
    var(--color-muted-text);
}



/* =========================================================
   CLUBHOUSE MOMENTS
   ========================================================= */

.ar-clubhouse-moments {
  margin-top:
    8px;

  border-top:
    1px solid var(--ar-line);
}


.ar-clubhouse-moments > div {
  display:
    grid;

  grid-template-columns:
    32px minmax(0, 1fr);

  gap:
    18px;

  padding:
    20px 0;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-clubhouse-moments > div > span {
  padding-top:
    3px;

  font-size:
    8px;

  color:
    var(--color-brass);
}


.ar-clubhouse-moments strong {
  display: block;

  margin-bottom:
    5px;

  font-family:
    var(--font-headline);

  font-size:
    27px;

  font-weight:
    400;

  line-height:
    1;
}


.ar-clubhouse-moments p {
  margin: 0;

  max-width:
    480px;

  font-size:
    10px;

  line-height:
    1.65;

  color:
    var(--color-muted-text);
}



/* Closing HOME story */

.ar-clubhouse-story
.ar-experience-story {
  margin-top:
    34px;
}


.ar-clubhouse-story
.ar-source-link {
  display:
    inline-flex;

  margin:
    21px 0 0 50px;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-experience-row {
    grid-template-columns:
      1fr;

    gap:
      40px;
  }


  .ar-experience-row + .ar-experience-row {
    margin-top:
      65px;

    padding-top:
      48px;
  }


  .ar-experience-row-copy {
    width:
      100%;
  }


  .ar-experience-story h3 {
    font-size:
      35px;
  }


  .ar-clubhouse-intro h3 {
    font-size:
      45px;
  }


  .ar-clubhouse-story
  .ar-source-link {
    margin-left:
      0;
  }

}
/* =========================================================
   ARENA EXPERIENCE — FINAL EDITORIAL REDESIGN
   ========================================================= */

.ar-x-section {
  overflow: hidden;

  background:
    var(--color-warm-ivory);
}


/* =========================================================
   HEADING
   ========================================================= */

.ar-x-heading {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(320px, 0.65fr);

  gap:
    clamp(70px, 10vw, 155px);

  align-items:
    end;

  padding-bottom:
    42px;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-x-heading h2 {
  margin:
    0;

  font-size:
    clamp(62px, 6vw, 88px);

  line-height:
    0.92;

  letter-spacing:
    -0.035em;
}


.ar-x-heading-copy {
  max-width:
    400px;
}


.ar-x-heading-copy p {
  margin:
    0 0 19px;

  font-size:
    13px;

  line-height:
    1.8;

  color:
    var(--color-muted-text);
}


.ar-x-heading-copy span {
  font-size:
    8px;

  letter-spacing:
    0.08em;

  color:
    #8b7e60;

  text-transform:
    uppercase;
}



/* =========================================================
   FEATURE ROWS
   ========================================================= */

.ar-x-feature {
  display: grid;

  grid-template-columns:
    minmax(0, 1.18fr)
    minmax(330px, 0.82fr);

  gap:
    clamp(65px, 7vw, 110px);

  align-items:
    center;

  padding:
    clamp(72px, 8vw, 115px) 0;
}


.ar-x-feature + .ar-x-feature {
  border-top:
    1px solid var(--ar-line);
}


.ar-x-feature-reverse {
  grid-template-columns:
    minmax(330px, 0.82fr)
    minmax(0, 1.18fr);
}


.ar-x-feature-visual,
.ar-x-feature-copy {
  min-width:
    0;
}



/* =========================================================
   FEATURE COPY
   ========================================================= */

.ar-x-feature-copy {
  max-width:
    470px;
}


.ar-x-feature-copy > h3 {
  margin:
    9px 0 23px;

  font-family:
    var(--font-headline);

  font-size:
    clamp(50px, 4.9vw, 72px);

  font-weight:
    400;

  line-height:
    0.94;

  letter-spacing:
    -0.03em;
}


.ar-x-lead {
  max-width:
    430px;

  margin:
    0;

  font-size:
    12px;

  line-height:
    1.85;

  color:
    var(--color-muted-text);
}



/* =========================================================
   POINTS
   ========================================================= */

.ar-x-points {
  margin-top:
    36px;

  border-top:
    1px solid var(--ar-line);
}


.ar-x-points article {
  display:
    grid;

  grid-template-columns:
    31px
    minmax(0, 1fr);

  gap:
    18px;

  padding:
    21px 0;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-x-points article > span {
  padding-top:
    4px;

  font-size:
    8px;

  color:
    var(--color-brass);
}


.ar-x-points strong {
  display:
    block;

  margin-bottom:
    7px;

  font-family:
    var(--font-headline);

  font-size:
    27px;

  font-weight:
    400;

  line-height:
    1.05;

  color:
    var(--color-dark-ink);
}


.ar-x-points p {
  margin:
    0;

  max-width:
    370px;

  font-size:
    10px;

  line-height:
    1.7;

  color:
    var(--color-muted-text);
}


.ar-x-points-compact strong {
  font-size:
    24px;
}



/* =========================================================
   CAROUSEL
   ========================================================= */

.ar-x-carousel {
  width:
    100%;

  min-width:
    0;

  outline:
    none;
}


.ar-x-stage {
  width:
    100%;
}


.ar-x-slide[hidden] {
  display:
    none !important;
}



/* =========================================================
   IMAGE
   ========================================================= */

.ar-x-image {
  position:
    relative;

  width:
    100%;

  aspect-ratio:
    16 / 10;

  margin:
    0;

  overflow:
    hidden;

  background:
    var(--color-deep-forest);
}


.ar-x-image img {
  display:
    block;

  width:
    100%;

  height:
    100%;

  object-fit:
    cover;
}


.ar-x-image-shade {
  position:
    absolute;

  inset:
    0;

  pointer-events:
    none;

  background:
    linear-gradient(
      180deg,
      rgba(13, 39, 34, 0) 65%,
      rgba(13, 39, 34, 0.35) 100%
    );
}


.ar-x-disclosure {
  position:
    absolute;

  left:
    16px;

  bottom:
    14px;

  z-index:
    3;

  padding:
    0;

  border:
    0;

  background:
    transparent;

  color:
    var(--color-warm-white);

  font-size:
    7px;

  font-weight:
    600;

  line-height:
    1.4;

  letter-spacing:
    0.11em;

  text-transform:
    uppercase;

  text-shadow:
    0 2px 7px rgba(0, 0, 0, 0.72);
}



/* =========================================================
   PLACEHOLDER
   ========================================================= */

.ar-x-placeholder {
  position:
    relative;

  display:
    grid;

  place-items:
    center;

  width:
    100%;

  aspect-ratio:
    16 / 10;

  overflow:
    hidden;

  border:
    1px solid rgba(22, 53, 46, 0.17);

  background:
    rgba(22, 53, 46, 0.025);
}


.ar-x-placeholder::before {
  content:
    "";

  position:
    absolute;

  inset:
    18px;

  border:
    1px solid rgba(22, 53, 46, 0.10);
}


.ar-x-placeholder span {
  font-size:
    8px;

  letter-spacing:
    0.16em;

  color:
    rgba(22, 53, 46, 0.38);
}



/* =========================================================
   CAPTION BELOW IMAGE
   ========================================================= */

.ar-x-caption {
  display: grid;

  grid-template-columns:
    minmax(120px, 0.43fr)
    minmax(0, 1fr);

  gap:
    28px;

  padding:
    20px 0 5px;
}


.ar-x-caption > span {
  padding-top:
    4px;

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.14em;

  color:
    var(--color-brass);
}


.ar-x-caption h3 {
  margin:
    0 0 8px;

  font-family:
    var(--font-headline);

  font-size:
    clamp(30px, 2.7vw, 42px);

  font-weight:
    400;

  line-height:
    1;

  letter-spacing:
    -0.02em;
}


.ar-x-caption p {
  margin:
    0;

  max-width:
    460px;

  font-size:
    10px;

  line-height:
    1.7;

  color:
    var(--color-muted-text);
}



/* =========================================================
   CONTROLS
   ========================================================= */

.ar-x-controls {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  margin-top:
    17px;

  padding-top:
    15px;

  border-top:
    1px solid var(--ar-line);
}


.ar-x-count {
  display:
    flex;

  align-items:
    baseline;

  gap:
    7px;

  font-size:
    8px;

  color:
    rgba(23, 37, 33, 0.43);
}


.ar-x-count strong {
  font-family:
    var(--font-headline);

  font-size:
    21px;

  font-weight:
    400;

  color:
    var(--color-dark-ink);
}


.ar-x-arrows {
  display:
    flex;

  gap:
    8px;
}


.ar-x-arrows button {
  display:
    grid;

  place-items:
    center;

  width:
    44px;

  height:
    44px;

  padding:
    0;

  border:
    1px solid rgba(22, 53, 46, 0.24);

  border-radius:
    50%;

  background:
    transparent;

  color:
    var(--color-primary-forest);

  cursor:
    pointer;

  transition:
    background 160ms ease,
    color 160ms ease,
    border-color 160ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-x-arrows button:hover {
    background:
      var(--color-primary-forest);

    border-color:
      var(--color-primary-forest);

    color:
      var(--color-warm-white);
  }

}



/* =========================================================
   CLOSING STRIP
   ========================================================= */

.ar-x-closing {
  display:
    grid;

  grid-template-columns:
    minmax(170px, 0.35fr)
    minmax(280px, 0.65fr)
    minmax(260px, 0.7fr);

  gap:
    clamp(40px, 6vw, 90px);

  align-items:
    start;

  padding:
    52px 0;

  border-top:
    1px solid var(--ar-line);

  border-bottom:
    1px solid var(--ar-line);
}


.ar-x-closing h3 {
  margin:
    0;

  font-family:
    var(--font-headline);

  font-size:
    clamp(43px, 4vw, 58px);

  font-weight:
    400;

  line-height:
    0.97;
}


.ar-x-closing > p:not(.ar-eyebrow) {
  margin:
    0;

  font-size:
    11px;

  line-height:
    1.8;

  color:
    var(--color-muted-text);
}


.ar-x-closing .ar-text-link {
  grid-column:
    3;

  margin-top:
    -20px;
}



/* =========================================================
   SOURCE
   ========================================================= */

.ar-x-source {
  padding-top:
    23px;
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

  .ar-x-feature,
  .ar-x-feature-reverse {
    grid-template-columns:
      minmax(0, 1.05fr)
      minmax(300px, 0.95fr);

    gap:
      50px;
  }


  .ar-x-feature-copy > h3 {
    font-size:
      49px;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-x-heading {
    grid-template-columns:
      1fr;

    gap:
      24px;

    padding-bottom:
      31px;
  }


  .ar-x-heading h2 {
    font-size:
      clamp(50px, 15vw, 68px);
  }


  .ar-x-feature,
  .ar-x-feature-reverse {
    grid-template-columns:
      1fr;

    gap:
      40px;

    padding:
      60px 0;
  }


  .ar-x-feature-reverse
  .ar-x-feature-copy {
    order:
      1;
  }


  .ar-x-feature-reverse
  .ar-x-feature-visual {
    order:
      2;
  }


  .ar-x-feature-copy {
    max-width:
      none;
  }


  .ar-x-feature-copy > h3 {
    font-size:
      48px;
  }


  .ar-x-image,
  .ar-x-placeholder {
    aspect-ratio:
      4 / 3;
  }


  .ar-x-caption {
    grid-template-columns:
      1fr;

    gap:
      8px;
  }


  .ar-x-caption h3 {
    font-size:
      33px;
  }


  .ar-x-closing {
    grid-template-columns:
      1fr;

    gap:
      15px;

    padding:
      40px 0;
  }


  .ar-x-closing .ar-text-link {
    grid-column:
      1;

    margin-top:
      7px;
  }


  .ar-x-arrows button {
    width:
      46px;

    height:
      46px;
  }

}

/* =========================================================
   ARENA EXPERIENCE — FINAL EDITORIAL REDESIGN
   ========================================================= */

.ar-x-section {
  overflow: hidden;

  background:
    var(--color-warm-ivory);
}


/* =========================================================
   HEADING
   ========================================================= */

.ar-x-heading {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(320px, 0.65fr);

  gap:
    clamp(70px, 10vw, 155px);

  align-items:
    end;

  padding-bottom:
    42px;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-x-heading h2 {
  margin:
    0;

  font-size:
    clamp(62px, 6vw, 88px);

  line-height:
    0.92;

  letter-spacing:
    -0.035em;
}


.ar-x-heading-copy {
  max-width:
    400px;
}


.ar-x-heading-copy p {
  margin:
    0 0 19px;

  font-size:
    13px;

  line-height:
    1.8;

  color:
    var(--color-muted-text);
}


.ar-x-heading-copy span {
  font-size:
    8px;

  letter-spacing:
    0.08em;

  color:
    #8b7e60;

  text-transform:
    uppercase;
}



/* =========================================================
   FEATURE ROWS
   ========================================================= */

.ar-x-feature {
  display: grid;

  grid-template-columns:
    minmax(0, 1.18fr)
    minmax(330px, 0.82fr);

  gap:
    clamp(65px, 7vw, 110px);

  align-items:
    center;

  padding:
    clamp(72px, 8vw, 115px) 0;
}


.ar-x-feature + .ar-x-feature {
  border-top:
    1px solid var(--ar-line);
}


.ar-x-feature-reverse {
  grid-template-columns:
    minmax(330px, 0.82fr)
    minmax(0, 1.18fr);
}


.ar-x-feature-visual,
.ar-x-feature-copy {
  min-width:
    0;
}



/* =========================================================
   FEATURE COPY
   ========================================================= */

.ar-x-feature-copy {
  max-width:
    470px;
}


.ar-x-feature-copy > h3 {
  margin:
    9px 0 23px;

  font-family:
    var(--font-headline);

  font-size:
    clamp(50px, 4.9vw, 72px);

  font-weight:
    400;

  line-height:
    0.94;

  letter-spacing:
    -0.03em;
}


.ar-x-lead {
  max-width:
    430px;

  margin:
    0;

  font-size:
    12px;

  line-height:
    1.85;

  color:
    var(--color-muted-text);
}



/* =========================================================
   POINTS
   ========================================================= */

.ar-x-points {
  margin-top:
    36px;

  border-top:
    1px solid var(--ar-line);
}


.ar-x-points article {
  display:
    grid;

  grid-template-columns:
    31px
    minmax(0, 1fr);

  gap:
    18px;

  padding:
    21px 0;

  border-bottom:
    1px solid var(--ar-line);
}


.ar-x-points article > span {
  padding-top:
    4px;

  font-size:
    8px;

  color:
    var(--color-brass);
}


.ar-x-points strong {
  display:
    block;

  margin-bottom:
    7px;

  font-family:
    var(--font-headline);

  font-size:
    27px;

  font-weight:
    400;

  line-height:
    1.05;

  color:
    var(--color-dark-ink);
}


.ar-x-points p {
  margin:
    0;

  max-width:
    370px;

  font-size:
    10px;

  line-height:
    1.7;

  color:
    var(--color-muted-text);
}


.ar-x-points-compact strong {
  font-size:
    24px;
}



/* =========================================================
   CAROUSEL
   ========================================================= */

.ar-x-carousel {
  width:
    100%;

  min-width:
    0;

  outline:
    none;
}


.ar-x-stage {
  width:
    100%;
}


.ar-x-slide[hidden] {
  display:
    none !important;
}



/* =========================================================
   IMAGE
   ========================================================= */

.ar-x-image {
  position:
    relative;

  width:
    100%;

  aspect-ratio:
    16 / 10;

  margin:
    0;

  overflow:
    hidden;

  background:
    var(--color-deep-forest);
}


.ar-x-image img {
  display:
    block;

  width:
    100%;

  height:
    100%;

  object-fit:
    cover;
}


.ar-x-image-shade {
  position:
    absolute;

  inset:
    0;

  pointer-events:
    none;

  background:
    linear-gradient(
      180deg,
      rgba(13, 39, 34, 0) 65%,
      rgba(13, 39, 34, 0.35) 100%
    );
}


.ar-x-disclosure {
  position:
    absolute;

  left:
    16px;

  bottom:
    14px;

  z-index:
    3;

  padding:
    0;

  border:
    0;

  background:
    transparent;

  color:
    var(--color-warm-white);

  font-size:
    7px;

  font-weight:
    600;

  line-height:
    1.4;

  letter-spacing:
    0.11em;

  text-transform:
    uppercase;

  text-shadow:
    0 2px 7px rgba(0, 0, 0, 0.72);
}



/* =========================================================
   PLACEHOLDER
   ========================================================= */

.ar-x-placeholder {
  position:
    relative;

  display:
    grid;

  place-items:
    center;

  width:
    100%;

  aspect-ratio:
    16 / 10;

  overflow:
    hidden;

  border:
    1px solid rgba(22, 53, 46, 0.17);

  background:
    rgba(22, 53, 46, 0.025);
}


.ar-x-placeholder::before {
  content:
    "";

  position:
    absolute;

  inset:
    18px;

  border:
    1px solid rgba(22, 53, 46, 0.10);
}


.ar-x-placeholder span {
  font-size:
    8px;

  letter-spacing:
    0.16em;

  color:
    rgba(22, 53, 46, 0.38);
}



/* =========================================================
   CAPTION BELOW IMAGE
   ========================================================= */

.ar-x-caption {
  display: grid;

  grid-template-columns:
    minmax(120px, 0.43fr)
    minmax(0, 1fr);

  gap:
    28px;

  padding:
    20px 0 5px;
}


.ar-x-caption > span {
  padding-top:
    4px;

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.14em;

  color:
    var(--color-brass);
}


.ar-x-caption h3 {
  margin:
    0 0 8px;

  font-family:
    var(--font-headline);

  font-size:
    clamp(30px, 2.7vw, 42px);

  font-weight:
    400;

  line-height:
    1;

  letter-spacing:
    -0.02em;
}


.ar-x-caption p {
  margin:
    0;

  max-width:
    460px;

  font-size:
    10px;

  line-height:
    1.7;

  color:
    var(--color-muted-text);
}



/* =========================================================
   CONTROLS
   ========================================================= */

.ar-x-controls {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  margin-top:
    17px;

  padding-top:
    15px;

  border-top:
    1px solid var(--ar-line);
}


.ar-x-count {
  display:
    flex;

  align-items:
    baseline;

  gap:
    7px;

  font-size:
    8px;

  color:
    rgba(23, 37, 33, 0.43);
}


.ar-x-count strong {
  font-family:
    var(--font-headline);

  font-size:
    21px;

  font-weight:
    400;

  color:
    var(--color-dark-ink);
}


.ar-x-arrows {
  display:
    flex;

  gap:
    8px;
}


.ar-x-arrows button {
  display:
    grid;

  place-items:
    center;

  width:
    44px;

  height:
    44px;

  padding:
    0;

  border:
    1px solid rgba(22, 53, 46, 0.24);

  border-radius:
    50%;

  background:
    transparent;

  color:
    var(--color-primary-forest);

  cursor:
    pointer;

  transition:
    background 160ms ease,
    color 160ms ease,
    border-color 160ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-x-arrows button:hover {
    background:
      var(--color-primary-forest);

    border-color:
      var(--color-primary-forest);

    color:
      var(--color-warm-white);
  }

}



/* =========================================================
   CLOSING STRIP
   ========================================================= */

.ar-x-closing {
  display:
    grid;

  grid-template-columns:
    minmax(170px, 0.35fr)
    minmax(280px, 0.65fr)
    minmax(260px, 0.7fr);

  gap:
    clamp(40px, 6vw, 90px);

  align-items:
    start;

  padding:
    52px 0;

  border-top:
    1px solid var(--ar-line);

  border-bottom:
    1px solid var(--ar-line);
}


.ar-x-closing h3 {
  margin:
    0;

  font-family:
    var(--font-headline);

  font-size:
    clamp(43px, 4vw, 58px);

  font-weight:
    400;

  line-height:
    0.97;
}


.ar-x-closing > p:not(.ar-eyebrow) {
  margin:
    0;

  font-size:
    11px;

  line-height:
    1.8;

  color:
    var(--color-muted-text);
}


.ar-x-closing .ar-text-link {
  grid-column:
    3;

  margin-top:
    -20px;
}



/* =========================================================
   SOURCE
   ========================================================= */

.ar-x-source {
  padding-top:
    23px;
}



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

  .ar-x-feature,
  .ar-x-feature-reverse {
    grid-template-columns:
      minmax(0, 1.05fr)
      minmax(300px, 0.95fr);

    gap:
      50px;
  }


  .ar-x-feature-copy > h3 {
    font-size:
      49px;
  }

}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-x-heading {
    grid-template-columns:
      1fr;

    gap:
      24px;

    padding-bottom:
      31px;
  }


  .ar-x-heading h2 {
    font-size:
      clamp(50px, 15vw, 68px);
  }


  .ar-x-feature,
  .ar-x-feature-reverse {
    grid-template-columns:
      1fr;

    gap:
      40px;

    padding:
      60px 0;
  }


  .ar-x-feature-reverse
  .ar-x-feature-copy {
    order:
      1;
  }


  .ar-x-feature-reverse
  .ar-x-feature-visual {
    order:
      2;
  }


  .ar-x-feature-copy {
    max-width:
      none;
  }


  .ar-x-feature-copy > h3 {
    font-size:
      48px;
  }


  .ar-x-image,
  .ar-x-placeholder {
    aspect-ratio:
      4 / 3;
  }


  .ar-x-caption {
    grid-template-columns:
      1fr;

    gap:
      8px;
  }


  .ar-x-caption h3 {
    font-size:
      33px;
  }


  .ar-x-closing {
    grid-template-columns:
      1fr;

    gap:
      15px;

    padding:
      40px 0;
  }


  .ar-x-closing .ar-text-link {
    grid-column:
      1;

    margin-top:
      7px;
  }


  .ar-x-arrows button {
    width:
      46px;

    height:
      46px;
  }

}
/* =========================================================
   ARENA EXPERIENCE — TIGHTER VERTICAL RHYTHM
   ========================================================= */

/* All feature rows */
.ar-x-feature {
  padding-top: 58px !important;
  padding-bottom: 58px !important;
}


/* Space before the second / Clubhouse feature */
.ar-x-feature + .ar-x-feature {
  padding-top: 48px !important;
}


/* Clubhouse should finish closer to the closing statement */
.ar-x-feature-reverse {
  padding-bottom: 48px !important;
}


/* "And always, back to home." block */
.ar-x-closing {
  padding-top: 36px !important;
  padding-bottom: 36px !important;
}


/* Source link closer to closing block */
.ar-x-source {
  padding-top: 16px !important;
  padding-bottom: 0 !important;
}


/* MOBILE */
@media (max-width: 700px) {

  .ar-x-feature {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }

  .ar-x-feature + .ar-x-feature {
    padding-top: 40px !important;
  }

  .ar-x-feature-reverse {
    padding-bottom: 40px !important;
  }

  .ar-x-closing {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }

}
/* =========================================================
   ARENA EXPERIENCE — EXTRA TIGHT EDITORIAL RHYTHM
   ========================================================= */

/* Feature bands */
.ar-x-feature {
  padding-top: 34px !important;
  padding-bottom: 34px !important;
}


/* Second feature / clubhouse */
.ar-x-feature + .ar-x-feature {
  padding-top: 28px !important;
}


.ar-x-feature-reverse {
  padding-bottom: 28px !important;
}


/* Reduce gap inside each feature */
.ar-x-feature,
.ar-x-feature-reverse {
  row-gap: 26px !important;
}


/* Closing statement much closer */
.ar-x-closing {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}


/* Pull closing block upward slightly */
.ar-x-feature-reverse + .ar-x-closing {
  margin-top: -6px !important;
}


/* Source link closer too */
.ar-x-source {
  padding-top: 10px !important;
}


/* Heading-to-first-feature spacing */
.ar-x-heading + .ar-x-feature {
  padding-top: 38px !important;
}


/* Slightly tighter text rhythm */
.ar-x-feature-copy > h3 {
  margin-bottom: 16px !important;
}


.ar-x-lead {
  margin-bottom: 0 !important;
}


.ar-x-points {
  margin-top: 24px !important;
}


/* MOBILE */

@media (max-width: 700px) {

  .ar-x-feature {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }


  .ar-x-feature + .ar-x-feature {
    padding-top: 26px !important;
  }


  .ar-x-feature-reverse {
    padding-bottom: 26px !important;
  }


  .ar-x-heading + .ar-x-feature {
    padding-top: 32px !important;
  }


  .ar-x-closing {
    padding-top: 22px !important;
    padding-bottom: 22px !important;
  }

}
/* =========================================================
   ARENA EXPERIENCE — FINAL TIGHTENING
   ========================================================= */

.ar-x-feature {
  padding-top: 26px !important;
  padding-bottom: 26px !important;
}

.ar-x-feature + .ar-x-feature {
  padding-top: 22px !important;
}

.ar-x-feature-reverse {
  padding-bottom: 20px !important;
}

.ar-x-heading + .ar-x-feature {
  padding-top: 30px !important;
}

.ar-x-closing {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

.ar-x-feature-reverse + .ar-x-closing {
  margin-top: -10px !important;
}

.ar-x-source {
  padding-top: 6px !important;
}

.ar-x-points {
  margin-top: 18px !important;
}

.ar-x-feature-copy > h3 {
  margin-bottom: 12px !important;
}


/* MOBILE */

@media (max-width: 700px) {

  .ar-x-feature {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }

  .ar-x-feature + .ar-x-feature {
    padding-top: 20px !important;
  }

  .ar-x-feature-reverse {
    padding-bottom: 20px !important;
  }

  .ar-x-heading + .ar-x-feature {
    padding-top: 26px !important;
  }

  .ar-x-closing {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }

}
/* =========================================================
   CLUBHOUSE — ALIGN COPY + CAROUSEL IN ONE VIEW
   ========================================================= */

@media (min-width: 1001px) {

  /* Start both columns at exactly the same height */
  .ar-x-feature-reverse {
    align-items: start !important;

    padding-top: 22px !important;
    padding-bottom: 22px !important;
  }


  /* Slightly tighter clubhouse heading */
  .ar-x-feature-reverse
  .ar-x-feature-copy > h3 {
    margin-top: 7px !important;
    margin-bottom: 14px !important;

    font-size:
      clamp(50px, 4.3vw, 66px) !important;

    line-height:
      0.92 !important;
  }


  /* Tighter intro */
  .ar-x-feature-reverse
  .ar-x-lead {
    max-width: 440px;

    font-size: 11px;

    line-height: 1.7;
  }


  /* Pull the Play / Train / Gather / Unwind list upward */
  .ar-x-feature-reverse
  .ar-x-points {
    margin-top: 16px !important;
  }


  .ar-x-feature-reverse
  .ar-x-points article {
    padding:
      14px 0 !important;
  }


  .ar-x-feature-reverse
  .ar-x-points strong {
    margin-bottom: 4px;

    font-size:
      24px;
  }


  .ar-x-feature-reverse
  .ar-x-points p {
    font-size:
      9px;

    line-height:
      1.5;
  }



  /* =====================================================
     MAKE THE CLUBHOUSE CAROUSEL SHORTER
     ===================================================== */

  .ar-x-feature-reverse
  .ar-x-image {
    aspect-ratio: auto !important;

    height:
      clamp(350px, 35vw, 430px) !important;
  }


  .ar-x-feature-reverse
  .ar-x-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
  }


  /* Caption much more compact */
  .ar-x-feature-reverse
  .ar-x-caption {
    grid-template-columns:
      150px minmax(0, 1fr);

    gap:
      18px;

    padding:
      14px 0 3px;
  }


  .ar-x-feature-reverse
  .ar-x-caption h3 {
    margin-bottom:
      5px;

    font-size:
      clamp(28px, 2.3vw, 36px);
  }


  .ar-x-feature-reverse
  .ar-x-caption p {
    font-size:
      9px;

    line-height:
      1.55;
  }


  /* Controls tighter */
  .ar-x-feature-reverse
  .ar-x-controls {
    margin-top:
      10px;

    padding-top:
      10px;
  }


  .ar-x-feature-reverse
  .ar-x-arrows button {
    width:
      40px;

    height:
      40px;
  }

}
/* CLUBHOUSE CAROUSEL — NUDGE CONTROLS UP */

@media (min-width: 1001px) {

  .ar-x-feature-reverse
  .ar-x-controls {
    margin-top: 4px !important;
    transform: translateY(-18px);
  }

}
/* =========================================================
   ARENA EXPERIENCE — FINAL CLOSING BAND
   ========================================================= */

.ar-x-closing-luxe {
  position: relative;

  display: grid !important;

  grid-template-columns:
    minmax(150px, 0.42fr)
    minmax(330px, 0.82fr)
    minmax(300px, 0.76fr);

  column-gap:
    clamp(42px, 6vw, 90px);

  row-gap:
    30px;

  align-items:
    center;

  margin:
    8px 0 0 !important;

  padding:
    44px 48px 24px !important;

  border:
    0 !important;

  background:
    var(--color-deep-forest, #0D2722);

  color:
    var(--color-warm-white, #FAF8F2);
}


/* BRASS ACCENT */

.ar-x-closing-luxe::before {
  content: "";

  position: absolute;

  top: 0;
  left: 0;

  width: 90px;
  height: 2px;

  background:
    var(--color-brass, #B59A68);
}



/* =========================================================
   LABEL
   ========================================================= */

.ar-x-closing-label {
  align-self:
    start;

  padding-top:
    5px;
}


.ar-x-closing-label
.ar-eyebrow {
  margin:
    0 0 10px;

  color:
    var(--color-brass, #B59A68);
}


.ar-x-closing-label
> span {
  display:
    block;

  font-size:
    7px;

  letter-spacing:
    0.13em;

  text-transform:
    uppercase;

  color:
    rgba(250, 248, 242, 0.38);
}



/* =========================================================
   MAIN TITLE
   ========================================================= */

.ar-x-closing-title h3 {
  margin:
    0;

  font-family:
    var(--font-headline);

  font-size:
    clamp(52px, 5vw, 74px);

  font-weight:
    400;

  line-height:
    0.91;

  letter-spacing:
    -0.035em;

  color:
    var(--color-warm-white, #FAF8F2);
}



/* =========================================================
   DESCRIPTION
   ========================================================= */

.ar-x-closing-action {
  align-self:
    center;
}


.ar-x-closing-action
> p {
  margin:
    0;

  max-width:
    390px;

  font-size:
    11px;

  line-height:
    1.8;

  color:
    rgba(250, 248, 242, 0.63);
}



/* =========================================================
   CTA
   ========================================================= */

.ar-x-closing-cta {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    30px;

  width:
    min(100%, 320px);

  margin-top:
    22px;

  padding:
    12px 0;

  border-bottom:
    1px solid
    rgba(181, 154, 104, 0.72);

  color:
    var(--color-warm-white, #FAF8F2);

  font-size:
    11px;

  font-weight:
    600;

  text-decoration:
    none;

  transition:
    color 160ms ease,
    border-color 160ms ease;
}


.ar-x-closing-cta svg {
  width:
    17px;

  transition:
    transform 160ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-x-closing-cta:hover {
    color:
      var(--color-brass, #B59A68);

    border-color:
      var(--color-brass, #B59A68);
  }


  .ar-x-closing-cta:hover svg {
    transform:
      translateX(4px);
  }

}



/* =========================================================
   SOURCE LINE
   ========================================================= */

.ar-x-closing-source {
  grid-column:
    1 / -1;

  padding-top:
    18px;

  border-top:
    1px solid
    rgba(250, 248, 242, 0.13);
}


.ar-x-closing-source a {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    8px;

  color:
    rgba(250, 248, 242, 0.48);

  font-size:
    8px;

  line-height:
    1.4;

  text-decoration:
    none;

  transition:
    color 160ms ease;
}


.ar-x-closing-source svg {
  width:
    13px;
}


@media (hover:hover) and (pointer:fine) {

  .ar-x-closing-source a:hover {
    color:
      var(--color-brass, #B59A68);
  }

}



/* =========================================================
   MAKE SURE OLD CLOSING STYLES DO NOT INTERFERE
   ========================================================= */

.ar-x-closing-luxe
.ar-text-link {
  grid-column:
    auto !important;

  margin:
    0 !important;
}


.ar-x-closing-luxe
+ .ar-x-source {
  display:
    none !important;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-x-closing-luxe {
    grid-template-columns:
      1fr;

    row-gap:
      22px;

    padding:
      34px 24px 20px !important;
  }


  .ar-x-closing-label {
    padding-top:
      0;
  }


  .ar-x-closing-title h3 {
    font-size:
      clamp(48px, 14vw, 62px);
  }


  .ar-x-closing-action
  > p {
    max-width:
      none;

    font-size:
      11px;
  }


  .ar-x-closing-cta {
    width:
      100%;

    margin-top:
      18px;
  }


  .ar-x-closing-source {
    grid-column:
      1;

    padding-top:
      17px;
  }

}

/* =========================================================
   ARENA EXPERIENCE — CLOSING INFORMATION RAIL
   ========================================================= */

.ar-x-closing-rail {
  grid-column:
    1 / -1;

  display:
    grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 1fr)
    minmax(220px, 0.8fr);

  gap:
    0;

  margin:
    10px -48px -24px;

  border-top:
    1px solid rgba(250, 248, 242, 0.14);

  background:
    rgba(0, 0, 0, 0.09);
}


.ar-x-rail-item,
.ar-x-rail-return {
  min-width:
    0;

  padding:
    21px 28px;

  border-right:
    1px solid rgba(250, 248, 242, 0.12);
}


.ar-x-rail-return {
  border-right:
    0;
}


/* SMALL LABEL */

.ar-x-closing-rail span {
  display:
    block;

  margin-bottom:
    8px;

  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    0.15em;

  line-height:
    1.4;

  color:
    var(--color-brass, #B59A68);

  text-transform:
    uppercase;
}


/* SOURCE + STATUS */

.ar-x-rail-item a,
.ar-x-rail-item strong {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    8px;

  margin:
    0;

  font-size:
    10px;

  font-weight:
    500;

  line-height:
    1.5;

  color:
    rgba(250, 248, 242, 0.72);

  text-decoration:
    none;
}


.ar-x-rail-item strong {
  font-weight:
    400;
}


/* RESIDENCE ACTION */

.ar-x-rail-return a {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    24px;

  width:
    100%;

  font-size:
    11px;

  font-weight:
    600;

  color:
    var(--color-warm-white, #FAF8F2);

  text-decoration:
    none;

  transition:
    color 160ms ease;
}


.ar-x-rail-return svg {
  width:
    16px;

  color:
    var(--color-brass, #B59A68);

  transition:
    transform 160ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-x-rail-item a:hover,
  .ar-x-rail-return a:hover {
    color:
      var(--color-brass, #B59A68);
  }


  .ar-x-rail-return a:hover svg {
    transform:
      translateX(4px);
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-x-closing-rail {
    grid-column:
      1;

    grid-template-columns:
      1fr;

    margin:
      8px -24px -20px;
  }


  .ar-x-rail-item,
  .ar-x-rail-return {
    padding:
      18px 24px;

    border-right:
      0;

    border-bottom:
      1px solid rgba(250, 248, 242, 0.12);
  }


  .ar-x-rail-return {
    border-bottom:
      0;
  }

}

/* =========================================================
   ARENA EXPERIENCE — CLEAN EDITORIAL ENDING
   ========================================================= */

.ar-x-ending {
  position: relative;

  display: grid;

  grid-template-columns:
    minmax(170px, 0.36fr)
    minmax(360px, 0.86fr)
    minmax(300px, 0.68fr);

  column-gap:
    clamp(48px, 6vw, 95px);

  row-gap:
    32px;

  align-items:
    start;

  margin-top:
    18px;

  padding:
    42px 0 24px;

  border-top:
    1px solid var(--ar-line);

  border-bottom:
    1px solid var(--ar-line);

  background:
    transparent;
}


/* BRASS ACCENT */

.ar-x-ending::before {
  content: "";

  position: absolute;

  top: -1px;
  left: 0;

  width: 82px;
  height: 2px;

  background:
    var(--color-brass, #B59A68);
}



/* =========================================================
   LABEL
   ========================================================= */

.ar-x-ending-label {
  padding-top:
    6px;
}


.ar-x-ending-label .ar-eyebrow {
  margin:
    0 0 11px;

  color:
    var(--color-brass, #B59A68);
}


.ar-x-ending-label > span {
  display:
    block;

  font-size:
    7px;

  letter-spacing:
    0.14em;

  color:
    rgba(23, 37, 33, 0.40);

  text-transform:
    uppercase;
}



/* =========================================================
   BIG STATEMENT
   ========================================================= */

.ar-x-ending-main h3 {
  margin:
    0;

  font-family:
    var(--font-headline);

  font-size:
    clamp(58px, 5.7vw, 82px);

  font-weight:
    400;

  line-height:
    0.89;

  letter-spacing:
    -0.038em;

  color:
    var(--color-dark-ink, #172521);
}



/* =========================================================
   COPY
   ========================================================= */

.ar-x-ending-side {
  padding-top:
    8px;
}


.ar-x-ending-side > p {
  margin:
    0;

  max-width:
    390px;

  font-size:
    11px;

  line-height:
    1.85;

  color:
    var(--color-muted-text);
}



/* =========================================================
   CTA
   ========================================================= */

.ar-x-ending-cta {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    26px;

  width:
    min(100%, 315px);

  margin-top:
    24px;

  padding:
    13px 0;

  border-bottom:
    1px solid rgba(22, 53, 46, 0.45);

  color:
    var(--color-dark-ink, #172521);

  font-size:
    11px;

  font-weight:
    600;

  text-decoration:
    none;

  transition:
    color 160ms ease,
    border-color 160ms ease;
}


.ar-x-ending-cta svg {
  width:
    17px;

  color:
    var(--color-brass, #B59A68);

  transition:
    transform 160ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-x-ending-cta:hover {
    color:
      var(--color-brass, #B59A68);

    border-color:
      var(--color-brass, #B59A68);
  }


  .ar-x-ending-cta:hover svg {
    transform:
      translateX(4px);
  }

}



/* =========================================================
   SOURCE — QUIET, NOT ANOTHER PANEL
   ========================================================= */

.ar-x-ending-source {
  grid-column:
    2 / 4;

  display:
    flex;

  align-items:
    center;

  gap:
    18px;

  padding-top:
    18px;

  border-top:
    1px solid rgba(22, 53, 46, 0.12);
}


.ar-x-ending-source > span {
  font-size:
    7px;

  font-weight:
    600;

  letter-spacing:
    0.14em;

  color:
    rgba(23, 37, 33, 0.38);

  text-transform:
    uppercase;
}


.ar-x-ending-source a {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    8px;

  color:
    rgba(23, 37, 33, 0.60);

  font-size:
    9px;

  text-decoration:
    none;

  transition:
    color 160ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-x-ending-source a:hover {
    color:
      var(--color-brass, #B59A68);
  }

}



/* =========================================================
   KILL PREVIOUS CLOSING DESIGNS
   ========================================================= */

.ar-x-closing,
.ar-x-closing-luxe,
.ar-x-closing-rail,
.ar-x-source {
  display:
    none !important;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .ar-x-ending {
    grid-template-columns:
      1fr;

    row-gap:
      21px;

    padding:
      32px 0 22px;
  }


  .ar-x-ending-label {
    padding-top:
      0;
  }


  .ar-x-ending-main h3 {
    font-size:
      clamp(50px, 14vw, 65px);
  }


  .ar-x-ending-side {
    padding-top:
      0;
  }


  .ar-x-ending-cta {
    width:
      100%;
  }


  .ar-x-ending-source {
    grid-column:
      1;

    flex-direction:
      column;

    align-items:
      flex-start;

    gap:
      7px;

    padding-top:
      16px;
  }

}

/* =========================================================
   ARENA LOCATION — PREMIUM MAP BUTTON
   ========================================================= */

.ar-address .ar-button,
.ar-address a[href*="maps"] {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;

  min-width: 260px;
  min-height: 58px;

  padding: 0 18px 0 22px;

  border: 1px solid rgba(181, 154, 104, 0.58);
  border-radius: 2px;

  background:
    #0D2722;

  color:
    #FAF8F2;

  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.025em;

  text-decoration: none;

  box-shadow:
    0 8px 24px rgba(13, 39, 34, 0.08);

  transition:
    background 180ms ease,
    border-color 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}


.ar-address .ar-button svg,
.ar-address a[href*="maps"] svg {
  width: 16px;
  height: 16px;

  margin-left: 22px;

  color:
    #B59A68;

  transition:
    transform 180ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-address .ar-button:hover,
  .ar-address a[href*="maps"]:hover {
    background:
      #16352E;

    border-color:
      #B59A68;

    transform:
      translateY(-2px);

    box-shadow:
      0 12px 28px rgba(13, 39, 34, 0.14);
  }


  .ar-address .ar-button:hover svg,
  .ar-address a[href*="maps"]:hover svg {
    transform:
      translate(3px, -2px);
  }

}


@media (max-width: 700px) {

  .ar-address .ar-button,
  .ar-address a[href*="maps"] {
    width: 100%;

    min-width: 0;
  }

}

/* =========================================================
   ARENA LOCATION — QUIET LUXURY MAP CTA
   ========================================================= */

.ar-address .ar-button,
.ar-address a[href*="maps"] {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;

  min-width: 255px;
  min-height: 56px;

  padding: 0 17px 0 20px;

  border: 1px solid rgba(22, 53, 46, 0.22);
  border-radius: 1px;

  background:
    rgba(250, 248, 242, 0.42);

  color:
    #172521;

  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.025em;

  text-decoration: none;

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.18);

  transition:
    background 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    transform 180ms ease;
}


/* small brass arrow treatment */

.ar-address .ar-button svg,
.ar-address a[href*="maps"] svg {
  width: 15px;
  height: 15px;

  margin-left: 24px;

  color:
    #B59A68;

  transition:
    transform 180ms ease;
}


/* subtle brass line inside the left edge */

.ar-address .ar-button,
.ar-address a[href*="maps"] {
  position: relative;
}


.ar-address .ar-button::before,
.ar-address a[href*="maps"]::before {
  content: "";

  position: absolute;

  left: -1px;
  top: 10px;
  bottom: 10px;

  width: 2px;

  background:
    #B59A68;

  opacity: 0.75;
}


/* hover stays light and elegant */

@media (hover:hover) and (pointer:fine) {

  .ar-address .ar-button:hover,
  .ar-address a[href*="maps"]:hover {
    background:
      rgba(181, 154, 104, 0.09);

    border-color:
      rgba(181, 154, 104, 0.62);

    color:
      #0D2722;

    transform:
      translateY(-1px);
  }


  .ar-address .ar-button:hover svg,
  .ar-address a[href*="maps"]:hover svg {
    transform:
      translate(3px, -2px);
  }

}


/* mobile */

@media (max-width: 700px) {

  .ar-address .ar-button,
  .ar-address a[href*="maps"] {
    width: 100%;
    min-width: 0;
  }

}

/* =========================================================
   ARENA LOCATION — FINAL MAP CTA
   ========================================================= */

.ar-location-map-cta {
  position: relative;

  display: inline-flex;
  align-items: center;
  justify-content: space-between;

  gap: 34px;

  min-width: 255px;
  min-height: 58px;

  padding: 0 14px 0 21px;

  border: 1px solid rgba(22, 53, 46, 0.24);
  border-radius: 2px;

  background: rgba(250, 248, 242, 0.34);

  color: #172521;

  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.015em;

  text-decoration: none;

  overflow: hidden;

  transition:
    background 180ms ease,
    border-color 180ms ease,
    transform 180ms ease;
}


/* subtle brass architectural line */

.ar-location-map-cta::before {
  content: "";

  position: absolute;

  left: 0;
  top: 0;
  bottom: 0;

  width: 3px;

  background: #B59A68;
}


/* arrow circle */

.ar-location-map-cta-icon {
  display: grid;
  place-items: center;

  flex: 0 0 auto;

  width: 31px;
  height: 31px;

  border: 1px solid rgba(22, 53, 46, 0.22);
  border-radius: 50%;

  color: #16352E;

  font-size: 15px;
  line-height: 1;

  transition:
    background 180ms ease,
    color 180ms ease,
    transform 180ms ease;
}


@media (hover:hover) and (pointer:fine) {

  .ar-location-map-cta:hover {
    background: rgba(181, 154, 104, 0.08);

    border-color: rgba(181, 154, 104, 0.62);

    transform: translateY(-1px);
  }


  .ar-location-map-cta:hover
  .ar-location-map-cta-icon {
    background: #16352E;

    color: #FAF8F2;

    transform: translate(2px, -1px);
  }

}


/* MOBILE */

@media (max-width: 700px) {

  .ar-location-map-cta {
    width: 100%;
    min-width: 0;
  }

}

/* =========================================================
   ARENA LOCATION CTA — ISOLATED FINAL STYLE
   ========================================================= */

.arena-map-cta-final {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;

  width: 290px !important;
  min-height: 68px !important;

  padding: 11px 12px 11px 20px !important;

  border: 1px solid rgba(181, 154, 104, 0.62) !important;
  border-radius: 2px !important;

  background: rgba(250, 248, 242, 0.58) !important;

  color: #172521 !important;
  text-decoration: none !important;

  box-shadow:
    0 8px 22px rgba(13, 39, 34, 0.06) !important;

  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease !important;
}


.arena-map-cta-copy {
  display: flex !important;
  flex-direction: column !important;

  gap: 4px !important;
}


.arena-map-cta-kicker {
  font-size: 7px !important;
  font-weight: 700 !important;

  letter-spacing: 0.15em !important;

  color: #B59A68 !important;

  line-height: 1 !important;
}


.arena-map-cta-label {
  font-size: 12px !important;
  font-weight: 600 !important;

  line-height: 1.2 !important;

  color: #172521 !important;
}


.arena-map-cta-icon {
  display: grid !important;
  place-items: center !important;

  flex: 0 0 auto !important;

  width: 38px !important;
  height: 38px !important;

  border-radius: 50% !important;

  background: #16352E !important;

  color: #FAF8F2 !important;

  font-size: 17px !important;

  transition:
    transform 180ms ease,
    background 180ms ease !important;
}


@media (hover:hover) and (pointer:fine) {

  .arena-map-cta-final:hover {
    background: rgba(181, 154, 104, 0.10) !important;

    border-color: #B59A68 !important;

    transform: translateY(-2px) !important;

    box-shadow:
      0 12px 28px rgba(13, 39, 34, 0.10) !important;
  }


  .arena-map-cta-final:hover
  .arena-map-cta-icon {
    background: #B59A68 !important;

    transform: translate(2px, -2px) !important;
  }

}


@media (max-width: 700px) {

  .arena-map-cta-final {
    width: 100% !important;
  }

}
/* =========================================================
   ARENA LOCATION — FINAL MAP CTA
   ========================================================= */

.arena-map-cta-final {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;

  gap: 36px !important;

  width: 300px !important;
  min-height: 68px !important;

  padding: 11px 12px 11px 20px !important;

  border: 1px solid rgba(181, 154, 104, 0.72) !important;
  border-radius: 2px !important;

  background: rgba(250, 248, 242, 0.58) !important;

  color: #172521 !important;
  text-decoration: none !important;

  box-shadow:
    0 8px 22px rgba(13, 39, 34, 0.06) !important;

  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease !important;
}


.arena-map-cta-copy {
  display: flex !important;
  flex-direction: column !important;

  gap: 4px !important;
}


.arena-map-cta-kicker {
  font-size: 7px !important;
  font-weight: 700 !important;

  letter-spacing: 0.15em !important;

  color: #B59A68 !important;

  line-height: 1 !important;
}


.arena-map-cta-label {
  font-size: 12px !important;
  font-weight: 600 !important;

  line-height: 1.2 !important;

  color: #172521 !important;
}


.arena-map-cta-icon {
  display: grid !important;
  place-items: center !important;

  flex: 0 0 auto !important;

  width: 40px !important;
  height: 40px !important;

  border-radius: 50% !important;

  background: #16352E !important;

  color: #FAF8F2 !important;

  font-size: 17px !important;

  transition:
    transform 180ms ease,
    background 180ms ease,
    color 180ms ease !important;
}


@media (hover:hover) and (pointer:fine) {

  .arena-map-cta-final:hover {
    background: rgba(181, 154, 104, 0.10) !important;

    border-color: #B59A68 !important;

    transform: translateY(-2px) !important;

    box-shadow:
      0 12px 28px rgba(13, 39, 34, 0.10) !important;
  }


  .arena-map-cta-final:hover .arena-map-cta-icon {
    background: #B59A68 !important;

    color: #0D2722 !important;

    transform: translate(2px, -2px) !important;
  }

}


@media (max-width: 700px) {

  .arena-map-cta-final {
    width: 100% !important;
  }

}
/* =========================================================
   RESTORE REGIONAL MAP OVERLAY CTA
   ========================================================= */

.ar-location-grid figure > a {
  position: relative;
}

.ar-location-grid figure .ar-enlarge {
  position: absolute !important;

  right: 16px !important;
  bottom: 16px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;

  gap: 28px !important;

  min-width: 220px !important;
  min-height: 52px !important;

  padding: 0 18px !important;

  border: 1px solid rgba(181, 154, 104, 0.45) !important;
  border-radius: 2px !important;

  background: #0D2722 !important;

  color: #FAF8F2 !important;

  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;

  text-decoration: none !important;

  box-shadow:
    0 6px 18px rgba(13, 39, 34, 0.16) !important;
}

.ar-location-grid figure .ar-enlarge svg {
  width: 15px !important;
  height: 15px !important;

  color: #B59A68 !important;
}

@media (hover:hover) and (pointer:fine) {

  .ar-location-grid figure > a:hover .ar-enlarge {
    background: #16352E !important;
    border-color: #B59A68 !important;
  }

}

/* MOBILE */

@media (max-width: 700px) {

  .ar-location-grid figure .ar-enlarge {
    right: 10px !important;
    bottom: 10px !important;

    min-width: 190px !important;
    min-height: 48px !important;
  }

}
/* =========================================================
   ARENA LOCATION — FINAL BUTTON FIX
   ========================================================= */


/* ---------------------------------------------------------
   MAP IMAGE OVERLAY BUTTON
   KEEP THIS DARK / ORIGINAL-STYLE
   --------------------------------------------------------- */

.ar-location-map-media {
  position: relative;
  display: block;
}


.ar-location-map-media .ar-enlarge {
  position: absolute !important;

  right: 16px !important;
  bottom: 16px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;

  gap: 26px !important;

  min-width: 220px !important;
  min-height: 52px !important;

  padding: 0 17px !important;

  border: 1px solid rgba(181, 154, 104, 0.50) !important;
  border-radius: 2px !important;

  background: #0D2722 !important;

  color: #FAF8F2 !important;

  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;

  text-decoration: none !important;

  box-shadow:
    0 7px 20px rgba(13, 39, 34, 0.18) !important;
}


.ar-location-map-media .ar-enlarge svg {
  width: 15px !important;
  height: 15px !important;

  color: #B59A68 !important;
}


@media (hover:hover) and (pointer:fine) {

  .ar-location-map-media:hover .ar-enlarge {
    background: #16352E !important;

    border-color: #B59A68 !important;
  }

}



/* ---------------------------------------------------------
   RIGHT-SIDE GOOGLE MAPS CTA
   LIGHT / PREMIUM / MATCHES IVORY BACKGROUND
   --------------------------------------------------------- */

.arena-map-cta-final {
  display: inline-flex !important;

  align-items: center !important;
  justify-content: space-between !important;

  gap: 36px !important;

  width: 300px !important;
  min-height: 68px !important;

  padding:
    11px 12px 11px 20px !important;

  border:
    1px solid rgba(181, 154, 104, 0.72) !important;

  border-radius:
    2px !important;

  background:
    rgba(250, 248, 242, 0.62) !important;

  color:
    #172521 !important;

  text-decoration:
    none !important;

  box-shadow:
    0 8px 22px rgba(13, 39, 34, 0.06) !important;

  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease !important;
}


/* TEXT BLOCK */

.arena-map-cta-copy {
  display: flex !important;

  flex-direction: column !important;

  gap: 4px !important;
}


.arena-map-cta-kicker {
  font-size: 7px !important;

  font-weight: 700 !important;

  line-height: 1 !important;

  letter-spacing: 0.15em !important;

  color: #B59A68 !important;
}


.arena-map-cta-label {
  font-size: 12px !important;

  font-weight: 600 !important;

  line-height: 1.2 !important;

  color: #172521 !important;
}


/* ROUND ARROW */

.arena-map-cta-icon {
  display: grid !important;

  place-items: center !important;

  flex: 0 0 auto !important;

  width: 40px !important;
  height: 40px !important;

  border-radius: 50% !important;

  background: #16352E !important;

  color: #FAF8F2 !important;

  font-size: 17px !important;

  line-height: 1 !important;

  transition:
    transform 180ms ease,
    background 180ms ease,
    color 180ms ease !important;
}


/* HOVER */

@media (hover:hover) and (pointer:fine) {

  .arena-map-cta-final:hover {
    background:
      rgba(181, 154, 104, 0.10) !important;

    border-color:
      #B59A68 !important;

    transform:
      translateY(-2px) !important;

    box-shadow:
      0 12px 28px rgba(13, 39, 34, 0.10) !important;
  }


  .arena-map-cta-final:hover
  .arena-map-cta-icon {
    background:
      #B59A68 !important;

    color:
      #0D2722 !important;

    transform:
      translate(2px, -2px) !important;
  }

}



/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 700px) {

  .arena-map-cta-final {
    width: 100% !important;
  }


  .ar-location-map-media .ar-enlarge {
    right: 10px !important;
    bottom: 10px !important;

    min-width: 190px !important;
    min-height: 48px !important;
  }

}

/* =========================================
   GOOGLE MAPS CTA — HOVER
   ========================================= */

.arena-google-maps-hover {
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    filter 180ms ease !important;
}

.arena-google-maps-hover:hover {
  transform: translateY(-2px) !important;

  filter: brightness(1.12) !important;

  box-shadow:
    0 14px 30px rgba(13, 39, 34, 0.20) !important;
}


/* make the round arrow react too */

.arena-google-maps-hover:hover > span:last-child {
  background: #B59A68 !important;
  color: #0D2722 !important;

  transform: translate(2px, -2px) !important;
}


/* smooth arrow animation */

.arena-google-maps-hover > span:last-child {
  transition:
    background 180ms ease,
    color 180ms ease,
    transform 180ms ease !important;
}
/* GOOGLE MAPS CTA HOVER */

.arena-google-maps-hover:hover {
  transform: translateY(-2px) !important;

  filter: brightness(1.12) !important;

  box-shadow:
    0 14px 30px rgba(13, 39, 34, 0.20) !important;
}

.arena-google-maps-hover:hover
.arena-google-maps-arrow {
  background: #B59A68 !important;

  color: #0D2722 !important;

  transform: translate(2px, -2px) !important;
}