/* ⚠️ WHY THESE CARRY .elementor-widget
   Elementor writes an UNSCOPED .elementor-widget-heading .elementor-heading-title{font-weight;
   color} into the generated stylesheet of every document holding a Heading widget — templates
   included. Those sheets load after this file and, at a tied (0,2,0), took the footer eyebrow,
   the footer H2 and the Newsletter column title to weight 300 / ink on a DARK footer.
   The tell was line 66: ".arc-fcol__title, .arc-foot-coltitle .elementor-heading-title" —
   one declaration block where the shortcode-rendered selector rendered correctly and the
   widget selector did not. Pinning .elementor-widget makes these (0,3,0). Do not remove. */
/* Arcadia Homes — footer (Theme Builder template).
   Reference: build/Footer.js on the approved static site. */

.arc-footer.e-con { background: var(--surface-inverse) !important; color: var(--text-inverse); padding: 0; gap: 0 !important; }
.arc-footer .e-con { padding: 0; }
.arc-footer .arc-foot-cta.e-con, .arc-footer .arc-foot-main.e-con, .arc-footer .arc-foot-bar.e-con,
.arc-footer .arc-foot-cta-inner.e-con, .arc-footer .arc-foot-main-inner.e-con { gap: 0; }

/* ---- CTA band ---- */
.arc-footer .arc-foot-cta-inner.e-con {
  max-width: var(--container-wide); margin-inline: auto; width: 100%;
  padding: 5rem var(--gutter) 4rem; align-items: center;
}
.arc-footer .arc-foot-cta.e-con { border-bottom: 1px solid var(--border-inverse); }
.arc-foot-eyebrow.elementor-widget .elementor-heading-title {
  font-family: var(--font-display); font-weight: 600; font-size: 0.8rem; text-transform: uppercase;
  letter-spacing: var(--ls-widest); color: var(--arc-taupe-300); margin: 0 0 16px; text-align: center;
}
.arc-foot-h2.elementor-widget .elementor-heading-title {
  font-family: var(--font-display); font-weight: 300; font-size: var(--fs-display-md); line-height: 1.12;
  color: #fff; margin: 0 auto 26px; max-width: 18ch; text-align: center;
}
.arc-foot-h2.elementor-widget .elementor-heading-title .arc-grey { color: var(--arc-taupe-300); }

/* ---- Main grid ---- */
.arc-footer .arc-foot-main-inner.e-con {
  max-width: var(--container-wide); margin-inline: auto; width: 100%;
  padding: 4rem var(--gutter) 3rem; display: block !important;
}
.arc-footer .arc-foot-grid.e-con {
  display: grid !important; grid-template-columns: 1.5fr 1fr 1fr 1fr 1.4fr; gap: 44px;
  padding-bottom: 48px; border-bottom: 1px solid var(--border-inverse); width: 100%;
}
.arc-footer .arc-foot-grid.e-con > .e-con { width: auto; min-width: 0; }

/* Brand column */
.arc-footer .arc-foot-brand.e-con { flex-direction: column; align-items: flex-start; gap: 20px; max-width: 320px; }
.arc-foot-brand .arc-foot-logo img { height: 30px !important; width: auto !important; max-width: none !important; display: block; }
.arc-foot-phone.elementor-widget .elementor-heading-title { line-height: 1.2; font-size: 1.05rem; }
.arc-foot-phone.elementor-widget .elementor-heading-title a {
  font-family: var(--font-sans); font-size: 1.05rem; font-weight: 600; color: #fff !important; text-decoration: none;
}
.arc-foot-address p, .arc-foot-address {
  font-family: var(--font-sans); font-size: 0.875rem; color: rgba(255, 255, 255, 0.65); line-height: 1.7; margin: 0;
}
.arc-footer .arc-foot-rating.e-con { flex-direction: row; align-items: center; gap: 10px; margin-top: 4px; width: auto; }
.arc-foot-rating .elementor-widget-star-rating { line-height: 0; }
.arc-foot-rating .elementor-star-rating { color: rgba(255, 255, 255, 0.9); }
/* Reference star mark (SVG path) in place of Elementor's Arial ★ glyph — 15px box, 2px gap = 83px block */
.arc-foot-rating-stars .elementor-star-rating i {
  width: 15px; height: 15px; font-size: 0 !important;
  display: inline-block; vertical-align: middle;
  background-color: currentColor;
  -webkit-mask: var(--arc-star) center / contain no-repeat;
          mask: var(--arc-star) center / contain no-repeat;
}
.arc-foot-rating-stars .elementor-star-rating i.elementor-star-empty { opacity: 0.35; }
.arc-foot-rating .arc-foot-rating-meta.elementor-widget .elementor-heading-title {
  font-family: var(--font-sans); font-size: 0.8rem; font-weight: 400;
  color: rgba(255, 255, 255, 0.8); margin: 0; line-height: 1.4;
}
.arc-foot-rating .arc-foot-rating-meta.elementor-widget .elementor-heading-title strong { font-weight: 600; }

/* Link columns (shortcode-rendered) */
.arc-fcol { display: flex; flex-direction: column; gap: 14px; }
.arc-fcol__title, .arc-foot-coltitle.elementor-widget .elementor-heading-title {
  font-family: var(--font-sans); font-size: 0.68rem; text-transform: uppercase; letter-spacing: var(--ls-wider);
  color: rgba(255, 255, 255, 0.5); font-weight: 600; margin: 0;
}
.arc-fcol__link {
  font-family: var(--font-sans); font-size: 0.875rem; color: rgba(255, 255, 255, 0.8) !important;
  text-decoration: none; transition: color var(--dur-fast) var(--ease-out); width: fit-content;
}
.arc-fcol__link:hover { color: #fff !important; }
body .arc-fgroup__btn {
  display: inline-flex !important; align-items: center; gap: 7px; background: none !important; border: none !important;
  cursor: pointer; padding: 0 !important; width: auto !important; text-align: left;
  font-family: var(--font-sans); font-size: 0.875rem; line-height: 1.4 !important;
  color: rgba(255, 255, 255, 0.8) !important; transition: color var(--dur-fast) var(--ease-out);
}
body .arc-fgroup__btn:hover, body .arc-fgroup__btn:focus { color: #fff !important; background: none !important; }
.arc-fgroup__wrap { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--dur-med) var(--ease-out); }
.arc-fgroup.is-open > .arc-fgroup__wrap { grid-template-rows: 1fr; }
.arc-fgroup__clip { overflow: hidden; }
.arc-fgroup__inner {
  display: flex; flex-direction: column; gap: 9px; padding: 0 0 0 12px;
  border-left: 1px solid var(--border-inverse); margin-top: 0;
  transition: margin var(--dur-med) var(--ease-out), padding var(--dur-med) var(--ease-out);
}
.arc-fgroup.is-open .arc-fgroup__inner { padding: 12px 0 4px 12px; margin-top: 10px; }
.arc-fgroup__link {
  font-family: var(--font-sans); font-size: 0.82rem; color: rgba(255, 255, 255, 0.62) !important;
  text-decoration: none; transition: color var(--dur-fast) var(--ease-out); width: fit-content;
}
.arc-fgroup__link:hover { color: #fff !important; }

/* Newsletter column */
.arc-footer .arc-foot-news.e-con { flex-direction: column; gap: 14px; align-items: flex-start; }
.arc-foot-blurb p, .arc-foot-blurb {
  font-family: var(--font-sans); font-size: 0.875rem; color: rgba(255, 255, 255, 0.65); line-height: 1.6; margin: 0;
}
/* Gravity Forms → reference input + inverse sm button */
.arc-foot-news .gform_wrapper, .arc-foot-news .gform_wrapper * { font-family: var(--font-sans) !important; }
.arc-foot-news .gform_wrapper form { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.arc-foot-news .gform_wrapper .gform_fields { grid-row-gap: 10px !important; }
.arc-foot-news .gform_wrapper .gfield_label { display: none !important; }
.arc-foot-news .gform_wrapper .gform_required_legend { display: none !important; }
.arc-foot-news .gform_wrapper input[type="email"] {
  font-size: 0.9rem !important; color: #fff !important;
  background: rgba(255, 255, 255, 0.06) !important; background-image: none !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important; border-radius: var(--radius-sm) !important;
  padding: 0.8rem 1rem !important; height: 46px !important; min-height: 0 !important; line-height: normal !important;
  outline: none !important; box-shadow: none !important; width: 100%;
  transition: border-color var(--dur-fast) var(--ease-out);
}
.arc-foot-news .gform_wrapper input[type="email"]:focus { border-color: var(--arc-taupe-300) !important; }
.arc-foot-news .gform_wrapper input[type="email"]::placeholder { color: rgba(255, 255, 255, 0.45); opacity: 1; }
.arc-foot-news .gform_wrapper .gform_footer { margin: 0 !important; padding: 0 !important; }
.arc-foot-news .gform_wrapper input[type="submit"].gform_button,
.arc-foot-news .gform_wrapper button.gform_button {
  display: inline-flex !important; align-items: center; justify-content: center;
  font-size: 0.6875rem !important; font-weight: 600 !important; text-transform: uppercase !important;
  letter-spacing: var(--ls-wide) !important; padding: 0.6rem 1.1rem !important;
  background: var(--arc-white) !important; background-image: none !important; color: var(--arc-black) !important;
  border: 1px solid var(--arc-white) !important; border-radius: var(--radius-sm) !important;
  height: auto !important; min-height: 0 !important; width: auto !important; line-height: 1.4 !important;
  cursor: pointer; box-shadow: none !important;
  transition: transform var(--dur-med) var(--ease-out), box-shadow var(--dur-med) var(--ease-out) !important;
}
.arc-foot-news .gform_wrapper input[type="submit"].gform_button:hover,
.arc-foot-news .gform_wrapper button.gform_button:hover {
  transform: translateY(-2px); box-shadow: 0 10px 26px rgba(20, 22, 26, 0.16) !important;
  background: var(--arc-white) !important; color: var(--arc-black) !important;
}
.arc-foot-news .gform_confirmation_message { font-size: 0.875rem; color: rgba(255, 255, 255, 0.8); }

/* Disclaimer */
.arc-foot-disclaimer p, .arc-foot-disclaimer {
  font-family: var(--font-sans); font-size: 0.78rem; line-height: 1.8; color: rgba(255, 255, 255, 0.45) /* was 0.32 (2.9:1) — raised 2026-09-04 for WCAG AA 4.5:1 on #111315 */;
  margin: 32px auto 0; max-width: 110ch; text-align: center;
}

/* ---- Bottom bar ---- */
.arc-footer .arc-foot-bar.e-con { border-top: 1px solid var(--border-inverse); }
.arc-footer .arc-foot-bar-inner.e-con {
  max-width: var(--container-wide); margin-inline: auto; width: 100%;
  padding: 20px var(--gutter); flex-direction: row; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 14px;
}
.arc-foot-copy p, .arc-foot-copy {
  font-family: var(--font-sans); font-size: 0.75rem; color: rgba(255, 255, 255, 0.5); letter-spacing: 0.03em; margin: 0;
  line-height: 1.35;
}
.arc-footer .arc-foot-legal.e-con { flex-direction: row; align-items: center; gap: 22px; flex-wrap: wrap; width: auto; }
.arc-nav--legal { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.arc-nav--legal .arc-nav__link {
  font-family: var(--font-sans); font-size: 0.75rem; color: rgba(255, 255, 255, 0.5) !important;
  text-decoration: none; transition: color var(--dur-fast) var(--ease-out); line-height: 1.35;
}
.arc-nav--legal .arc-nav__item { display: flex; align-items: center; }
.arc-credit { line-height: 1.35; }
.arc-foot-legal .elementor-widget-html { line-height: 0; }
.arc-nav--legal .arc-nav__link:hover { color: #fff !important; }
.arc-credit {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--font-sans); font-size: 0.75rem; color: rgba(255, 255, 255, 0.5);
}
.arc-credit a {
  display: inline-flex; align-items: center; gap: 7px; color: rgba(255, 255, 255, 0.5) !important;
  text-decoration: none; transition: color var(--dur-fast) var(--ease-out);
}
.arc-credit a:hover { color: #fff !important; }
.arc-credit img { height: 15px !important; width: auto !important; filter: brightness(0) invert(1); opacity: 0.8; display: inline-block; }

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .arc-footer .arc-foot-grid.e-con { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .arc-footer .arc-foot-grid.e-con { grid-template-columns: 1fr; }
}

/* ---- Tap targets, mobile only (BugHerd #11) ----
   Every interactive item in a footer column renders at ~20px, failing WCAG 2.5.8 (AA, 24px).
   All three types are treated together because they interleave in the same column: raising only
   the four .arc-fgroup__btn toggles would leave 35 items failing and produce a visibly uneven
   rhythm (the DISCOVER column alternates toggle / link / toggle / link / toggle).
   30px, revised down from 44px on 2026-09-03 after the owner saw the rendered result: 44px met
   2.5.5 (AAA) but grew the mobile footer by ~448px at 375. 30px clears AA with headroom and costs
   about a third of that. The footer is therefore AA, not AAA — a deliberate call, not an oversight.
   min-height rather than padding, so the boxes genuinely occupy their height and cannot overlap;
   the 14px column gap is unchanged. The BOTTOM BAR selectors (.arc-nav--legal .arc-nav__link,
   .arc-credit and the footer tel: link) were ADDED 2026-09-03 for BugHerd #17 — the original pass
   covered only the footer COLUMN links, so the bottom bar was still failing AA on all 22 pages.
   Scoped to <=880px (Elementor Mobile Landscape, the top of the
   touch range) so the approved desktop footer is untouched. Reverse by deleting this block. */
@media (max-width: 880px) {
  body .arc-footer .arc-fgroup__btn,
  .arc-footer .arc-fcol__link,
  .arc-footer .arc-fgroup__link,
  .arc-footer .arc-nav--legal .arc-nav__link,
  .arc-footer .arc-credit,
  .arc-footer .arc-credit a,
  .arc-footer a[href^="tel:"] {
    min-height: 30px;
    display: inline-flex !important;
    align-items: center;
  }
}

/* ---- Bottom bar: one item per row, full width, centred (BugHerd #14, owner 2026-09-03) ----
   Owner's intent: below the wrap point every item gets its own full-width row, centred — not two
   centred groups. That means unstacking three nested flex rows, because the bar is built as
   .arc-foot-bar-inner > [.arc-foot-copy | .arc-foot-legal > [nav.arc-nav--legal > Privacy, Terms
   of Use | .arc-credit]]. Column direction alone is not enough: align-items must be stretch or
   the children stay content-width and "full width" does not happen.
   Result at <=727px is four stacked rows: copyright / Privacy / Terms of Use / Designed by Five
   by Five.
   GAP IS NORMALISED TO 14px across all three levels. Horizontally they were 14 / 22 / 22, which
   as vertical rhythm would read as uneven gaps between rows of the same list. This stacked layout
   has no counterpart in the approved static design, so 14px (the outer bar's own gap) is the
   reference chosen.
   BREAKPOINT IS MEASURED, NOT CHOSEN: groups are 321px + 319px + 14px gap, so one row at >=728
   and wrapped at <=727 (binary-searched live). 767px would wrongly restack a healthy single row
   between 728 and 767. RE-MEASURE if the copyright line or link labels change — the real QBCC
   licence number replacing the 000000 placeholder will move it.
   Above 727px the approved one-row space-between layout is untouched. Reverse by deleting this. */
@media (max-width: 727px) {
  .arc-footer .arc-foot-bar-inner.e-con {
    flex-direction: column; align-items: stretch; justify-content: center;
    text-align: center; gap: 14px;
  }
  .arc-footer .arc-foot-bar-inner.e-con > * { width: 100%; }
  .arc-footer .arc-foot-legal.e-con { flex-direction: column; align-items: stretch; gap: 14px; }
  .arc-footer .arc-nav--legal { flex-direction: column; align-items: stretch; gap: 14px; }
  /* the links sit inside .arc-nav__item flex wrappers, so the item stretches but the anchor
     inside it does not — this is what actually centres Privacy and Terms of Use. */
  .arc-footer .arc-nav--legal .arc-nav__item { justify-content: center; }
}

/* ---- Stacked categories (2026-09-15) ----
   Three link cells in the grid now hold one or more [arc_footer_menu] columns each, so Home
   Designs, Locations and About Us can be their own titled categories without adding grid
   columns. The stack is a plain flex column; each .arc-fcol inside keeps its own 14px rhythm. */
.arc-footer .arc-foot-grid.e-con > .arc-fcol-stack.e-con { flex-direction: column; align-items: stretch; gap: 36px; padding: 0; }

/* Footer address links to Google Maps (2026-09-15). Inherit the block colour so the Kit's
   link colour does not recolour it; hover matches the other footer links. */
.arc-foot-address a { color: inherit !important; text-decoration: none; transition: color var(--dur-fast) var(--ease-out); }
.arc-foot-address a:hover, .arc-foot-address a:focus { color: #fff !important; }