/* Crown Pavilions: Ex-Display offer + product page UX (4 Nov 2026). Brand: gold #cdac4e, green #07281a. */
:root { --exd-gold: #cdac4e; --exd-gold-d: #a8893a; --exd-green: #07281a; --exd-ink: #2b2b2b; --exd-line: #e5e5e5; }

/* ---- Price toggle ---------------------------------------------------------------------- */
.exd-box { margin-top: 1rem; font-family: Montserrat, system-ui, sans-serif; }
.exd-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .75rem; }
.exd-chip { border: 1px solid var(--exd-line); background: #fff; color: var(--exd-green); padding: .45rem .8rem; font-size: .8125rem; font-weight: 500; cursor: pointer; }
.exd-chip[aria-checked="true"] { border-color: var(--exd-green); background: var(--exd-green); color: #fff; }
.exd-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.exd-t { display: flex; flex-direction: column; align-items: flex-start; gap: .1rem; padding: .7rem .9rem; border: 1px solid var(--exd-line); background: #fff; color: var(--exd-green); text-align: left; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s; min-height: 64px; }
.exd-t:hover:not(:disabled) { border-color: var(--exd-green); }
.exd-t-k { font-size: .6875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; opacity: .7; }
.exd-t-v { font-size: 1.125rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.exd-t-l { font-size: .6875rem; font-weight: 600; color: var(--exd-gold-d); }
.exd-t--rrp[aria-checked="true"] { border-color: var(--exd-green); box-shadow: inset 0 0 0 1px var(--exd-green); }
.exd-t--ex { border-color: var(--exd-gold); background: #fbf7ec; }
.exd-t--ex[aria-checked="true"] { background: var(--exd-gold); border-color: var(--exd-gold); color: var(--exd-green); box-shadow: 0 6px 18px -8px rgba(205,172,78,.8); }
.exd-t--ex[aria-checked="true"] .exd-t-k { opacity: 1; }
.exd-t--ex[aria-checked="true"] .exd-t-l { color: var(--exd-green); }
.exd-t:disabled { cursor: not-allowed; background: #f6f6f4; border-color: var(--exd-line); }
.exd-t:disabled .exd-t-v { font-size: .8125rem; font-weight: 500; opacity: .6; }
.exd-t:disabled .exd-t-l { display: none; }
.exd-rrp-line { margin-top: .6rem; font-size: .8125rem; line-height: 1.45; color: rgba(43,43,43,.72); }
.exd-ex-note { margin-top: .35rem; font-size: .8125rem; line-height: 1.45; color: var(--exd-green); }
.exd-register { display: inline-flex; align-items: center; justify-content: center; width: 100%; margin-top: .85rem; padding: .9rem 1.25rem; background: var(--exd-gold); color: var(--exd-green); border: 0; font: 600 1rem Montserrat, sans-serif; cursor: pointer; transition: filter .15s; }
.exd-register:hover { filter: brightness(1.05); }
.exd-register--sm { width: auto; margin-top: 0; padding: .65rem 1rem; font-size: .875rem; }
.exd-hero-ex { color: var(--exd-gold-d) !important; }
[data-exd-finance].is-ex { border-color: var(--exd-gold) !important; }

/* ---- Header mega-menu buttons ----------------------------------------------------------- */
.exd-mm-wrap { display: flex; gap: .5rem; align-items: stretch; flex-wrap: wrap; }
.exd-mm-btn { display: inline-flex; flex-direction: column; justify-content: center; padding: .45rem .9rem; border: 1px solid var(--exd-gold); background: rgba(205,172,78,.12); color: #fff; text-decoration: none; line-height: 1.2; font-family: Montserrat, sans-serif; transition: background .15s; }
.exd-mm-btn:hover { background: var(--exd-gold); color: var(--exd-green); }
.exd-mm-k { font-size: .6875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--exd-gold); }
.exd-mm-btn:hover .exd-mm-k, .exd-mm-btn:hover .exd-mm-l { color: var(--exd-green); }
.exd-mm-v { font-size: .9375rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.exd-mm-l { font-size: .625rem; opacity: .75; }
.exd-mm-btn--mobile { margin: .4rem 0 .4rem 1rem; align-self: flex-start; }

/* ---- "What's Included as Standard?" over the gallery ----------------------------------- */
.rv-gal-stage { position: relative; }
.exd-incl-btn { position: absolute; left: .75rem; top: .75rem; z-index: 3; display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .8rem; background: rgba(7,40,26,.88); color: #fff; border: 1px solid var(--exd-gold); font: 600 .8125rem Montserrat, sans-serif; text-decoration: none; backdrop-filter: blur(4px); }
.exd-incl-btn:hover { background: var(--exd-gold); color: var(--exd-green); }
.exd-incl-btn svg { width: 14px; height: 14px; }
#included { scroll-margin-top: 110px; }

/* ---- Included as standard: headings only, 8 per row on desktop -------------------------- */
.exd-incl-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem !important; }
.exd-incl-grid > div { padding: 1rem .75rem !important; display: flex; flex-direction: column; align-items: center; text-align: center; }
.exd-incl-grid > div > div:first-child { margin: 0 0 .6rem !important; }
.exd-incl-grid h3 { font-size: .875rem !important; line-height: 1.3 !important; font-family: Montserrat, sans-serif !important; font-weight: 600 !important; }
@media (min-width: 640px) { .exd-incl-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .exd-incl-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); gap: .75rem !important; } .exd-incl-grid h3 { font-size: .8125rem !important; } }
.exd-tight.py-16 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.exd-tight .mb-12 { margin-bottom: 1.5rem; }

/* ---- Feature strip (Redwood, Roof, Guarantee): headings only ---------------------------- */
#quality.exd-tight .grid { gap: 1rem; }
#quality.exd-tight h3 { margin-top: .5rem; font-size: 1rem; }
#quality.exd-tight .h-16 { height: 2.75rem; }

/* ---- Technical specifications: compact on mobile ---------------------------------------- */
#specs.exd-specs .mt-12.grid { margin-top: 1.5rem; gap: .5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
#specs.exd-specs .mt-12.grid > div { padding: .75rem .85rem; display: grid; grid-template-columns: 22px minmax(0, 1fr); grid-template-areas: "i k" "i v"; column-gap: .65rem; row-gap: .1rem; align-items: center; }
#specs.exd-specs .mt-12.grid > div > svg { grid-area: i; width: 20px; height: 20px; align-self: start; margin-top: .1rem; }
#specs.exd-specs .mt-12.grid > div > p { margin: 0; }
#specs.exd-specs .mt-12.grid > div > p:nth-of-type(1) { grid-area: v; font-size: .9375rem; line-height: 1.25; }
#specs.exd-specs .mt-12.grid > div > p:nth-of-type(2) { grid-area: k; font-size: .6875rem; }
#specs.exd-specs .mt-12.grid > div > p:nth-of-type(3) { display: none; }
@media (min-width: 1024px) {
  #specs.exd-specs .mt-12.grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .75rem; }
  #specs.exd-specs .mt-12.grid > div { padding: 1.1rem; grid-template-areas: "i k" "i v" "d d"; align-items: start; }
  #specs.exd-specs .mt-12.grid > div > p:nth-of-type(1) { font-size: 1.125rem; }
  #specs.exd-specs .mt-12.grid > div > p:nth-of-type(3) { display: block; grid-area: d; font-size: .8125rem; margin-top: .5rem; }
}
#specs.exd-specs.py-16 { padding-top: 2.5rem; padding-bottom: 2.5rem; }

/* ---- Interest dialog -------------------------------------------------------------------- */
#exd-dialog { position: fixed; inset: 0; margin: auto !important; height: fit-content; overflow: auto; width: min(640px, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px) !important; padding: 0; border: 0; background: #fff; color: var(--exd-ink); box-shadow: 0 30px 80px -20px rgba(0,0,0,.45); }
#exd-dialog::backdrop { background: rgba(7,40,26,.6); }
.exd-dlg-head { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; padding: 1.1rem 1.25rem; background: var(--exd-green); color: #fff; }
.exd-dlg-head h2 { font-family: Optima, "Optima nova", Candara, serif; font-size: 1.5rem; line-height: 1.2; margin: 0; }
.exd-dlg-head p { margin: .2rem 0 0; font: 500 .8125rem Montserrat, sans-serif; color: var(--exd-gold); }
.exd-dlg-x { background: none; border: 0; color: #fff; font-size: 1.75rem; line-height: 1; cursor: pointer; padding: 0 .25rem; }
.exd-dlg-body { padding: 1.25rem; }
.exd-dlg-body select[name="ex_display_id"] { width: 100% !important; max-width: none !important; }
.exd-dlg-body .lead-form__row:has(select[name="ex_display_id"]) { grid-template-columns: 1fr !important; }

/* ---- /ex-display/ listing --------------------------------------------------------------- */
.exd-page { max-width: 1200px; margin: 0 auto; padding: 2rem 1rem 4rem; font-family: Montserrat, sans-serif; }
.exd-cat { margin-top: 2.5rem; scroll-margin-top: 110px; }
.exd-cat-h { font-family: Optima, "Optima nova", Candara, serif; font-size: 1.75rem; color: var(--exd-green); display: flex; align-items: baseline; gap: .75rem; flex-wrap: wrap; border-bottom: 1px solid var(--exd-gold); padding-bottom: .5rem; }
.exd-cat-h small { font: 600 .875rem Montserrat, sans-serif; color: var(--exd-gold-d); }
.exd-grid { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.exd-card { border: 1px solid var(--exd-line); padding: 1rem; display: flex; flex-direction: column; gap: .2rem; background: #fff; }
.exd-card-n { font-family: Optima, "Optima nova", Candara, serif; font-size: 1.15rem; font-weight: 700; color: var(--exd-green); margin: 0; }
.exd-card-v { font-size: .8125rem; color: rgba(43,43,43,.7); margin: 0; }
.exd-card-p { margin: .5rem 0 0; display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.exd-card-ex { font-size: 1.5rem; font-weight: 700; color: var(--exd-green); font-variant-numeric: tabular-nums; }
.exd-card-l { font-size: .6875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--exd-gold-d); }
.exd-card-r, .exd-card-f { font-size: .8125rem; color: rgba(43,43,43,.72); margin: 0; }
.exd-card-b { display: flex; gap: .75rem; align-items: center; margin-top: .75rem; flex-wrap: wrap; }
.exd-card-link { font-size: .875rem; font-weight: 600; color: var(--exd-green); text-decoration: underline; text-decoration-color: var(--exd-gold); text-underline-offset: 4px; }

/* ---- Year End Sale strip (every page; hidden by script after the end date) ---------------- */
.exd-banner { display: flex; align-items: center; justify-content: center; gap: .4rem 1rem; flex-wrap: wrap; padding: .55rem 1rem; background: var(--exd-gold); color: var(--exd-green); text-decoration: none; font-family: Montserrat, sans-serif; text-align: center; position: relative; z-index: 60; }
.exd-banner:hover .exd-banner-c { background: var(--exd-green); color: #fff; }
.exd-banner-h { font-family: Optima, "Optima nova", Candara, serif; font-weight: 700; font-size: 1.0625rem; letter-spacing: .01em; }
.exd-banner-s { font-size: .8125rem; font-weight: 500; }
.exd-banner-c { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; border: 1px solid var(--exd-green); padding: .25rem .6rem; transition: background .15s, color .15s; }
@media (max-width: 639px) { .exd-banner { padding: .5rem .75rem; gap: .15rem .6rem; } .exd-banner-h { font-size: .9375rem; } .exd-banner-s { font-size: .6875rem; flex-basis: 100%; order: 3; } .exd-banner-c { font-size: .625rem; } }
.exd-ends { margin: 1rem 0 0; padding: .75rem 1rem; background: #fbf7ec; border-left: 3px solid var(--exd-gold); color: var(--exd-green); font-weight: 600; }
.exd-ends a { color: var(--exd-green); text-decoration: underline; text-decoration-color: var(--exd-gold); }
#exd-dialog, #exd-dialog * { box-sizing: border-box; }
#exd-dialog { overflow-x: hidden; }
#exd-dialog .lead-form, #exd-dialog .lead-form__field, #exd-dialog .lead-form__row > * { min-width: 0; max-width: 100%; }
#exd-dialog select, #exd-dialog input, #exd-dialog textarea { max-width: 100%; }
@media (max-width: 639px) { #exd-dialog .lead-form__row { grid-template-columns: 1fr !important; display: grid; } .exd-dlg-body { padding: 1rem; } }
.exd-banner-e { display: none; font-size: .6875rem; font-weight: 600; }
@media (max-width: 639px) {
  .exd-banner { flex-wrap: nowrap; justify-content: space-between; padding: .45rem .75rem; gap: .5rem; text-align: left; }
  .exd-banner-s { display: none; }
  .exd-banner-e { display: block; white-space: nowrap; }
  .exd-banner-h { font-size: .875rem; line-height: 1.2; }
  .exd-banner-c { padding: .2rem .45rem; white-space: nowrap; }
}
.exd-mm-mob { display: flex; flex-direction: column; gap: .5rem; margin: .4rem 0 .6rem 1rem; }
.exd-mm-mob .exd-mm-btn--mobile { margin: 0; align-self: stretch; }
@media (max-width: 639px) {
  .exd-banner-c { display: none; }
  .exd-banner-h { font-size: .8125rem; white-space: nowrap; }
  .exd-banner-e::after { content: " \203A"; font-size: .875rem; }
}
