/*
 * LJ Hooker: brand theme on the heritage layout (full-screen hero with a centred headline, pill CTAs, warm
 * paper, room cards). LJ Hooker's homepage hero is a centred headline over a lifestyle photo on linen.
 *
 * Evidence (ljhooker.com.au, checked 2026-10-03):
 *  - https://www.ljhooker.com.au/hubfs/hub_generated/template_assets/1/185171852685/1790722306871/template_ljh-brand.css
 *    "LJ Hooker Brand" :root tokens: --ljh-brand-color-vintage-leather:#5E211C (headings and buttons),
 *    -vintage-leather-text:#CFBCBB, -young-leather:#AB826E, -dark-ocean:#223F57, -light-clay:#E5D2AC,
 *    -linen:#FFF9EB (body, header and footer background), --ljh-button-border-radius:100px (pill buttons), and
 *    --ljh-font-family:"Instrument Sans" with h1–h3 at weight 600.
 *  - The homepage loads Instrument Sans from Google Fonts
 *    (fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700), so it's used as-is.
 *  - Homepage bands alternate linen, vintage leather, dark ocean and young leather. The search button is leather.
 *
 *  - Tricolour (logo bars and brochure corner block; sampled from the owner-supplied logo and printed brochure,
 *    2026-10-03): yellow ~#f3cd45, orange ~#f0a142, red ~#d8432c. Printed brochures use vintage leather panels with
 *    linen text and the tricolour block, so dark bands and the footer are leather rather than dark ocean.
 *
 * Contrast: #fff9eb on #5e211c is 11.7:1 (buttons, price card); #5e211c headings on linen are 11.7:1. Eyebrows use a
 * deepened young leather, #8a5f4c (5.2:1 on linen; 4.6:1 on the #f5ebd3 alternate band). The brand's #ab826e is only
 * 3.3:1, so it's kept for decoration. #e5d2ac on the #223f57 footer is 7.4:1.
 */
.brand-lj_hooker {
  --font-display: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-ui: "Instrument Sans", system-ui, sans-serif;

  --color-bg: #fff9eb;
  --color-bg-alt: #f5ebd3;
  --color-surface: #fffdf7;
  --color-text: #24130f;
  --color-muted: #6e5a52;
  --color-rule: #e8dcc2;
  --color-accent: #5e211c;
  --color-accent-hover: #fff9eb;
  --color-accent-contrast: #fff9eb;
  --color-gold-text: #8a5f4c;
  --color-green: #5e211c;
  --color-green-light: #ab826e;
  --color-dark: #5e211c;
  --color-dark-text: #fff9eb;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-btn: 100px;
  --heading-weight: 600;
  --heading-tracking: -0.02em;
  --title-size: clamp(2rem, 1.4rem + 2.2vw, 3.1rem);
  --btn-weight: 600;
  --btn-tracking: 0;
  --btn-pad: 14px 32px;
  --nav-font-size: 0.92rem;
  --nav-tracking: 0;
  --gallery-radius: 10px;
  --field-border: #d8c7a6;
  --footer-bg: #5e211c;
  --footer-text: #fff9eb;
  --footer-rule: rgba(229, 210, 172, 0.25);
  --mobile-cta-bg: #fff9eb;
  --back-to-top-bg: #5e211c;
  --back-to-top-color: #fff9eb;

  --ljh-yellow: #f3cd45;
  --ljh-orange: #f0a142;
  --ljh-red: #d8432c;
  --ljh-tricolour: linear-gradient(90deg, var(--ljh-yellow) 0 33.34%, var(--ljh-orange) 33.34% 66.67%, var(--ljh-red) 66.67% 100%);
}

/* clean linen paper: no grain */
.brand-lj_hooker body::after { display: none; }

/* leather pill buttons; linen with a leather outline on hover (as on ljhooker.com.au) */
.brand-lj_hooker .btn--primary { box-shadow: 0 8px 22px rgba(94, 33, 28, 0.18); }
.brand-lj_hooker .btn--primary:hover { color: #5e211c; border-color: #5e211c; box-shadow: 0 12px 28px rgba(94, 33, 28, 0.22); }
.brand-lj_hooker .section-head__eyebrow { letter-spacing: 0.16em; }
.brand-lj_hooker .section-head__title, .brand-lj_hooker :is(.story-block__title, .room-card__title, .feature-group__title, .places-group__title, .agent-card__name) { color: #5e211c; }

/* nav: frosted linen once scrolled */
.brand-lj_hooker .site-nav { --nav-bg: rgba(255, 249, 235, 0.92); }
.brand-lj_hooker .site-nav__brand-street { font-weight: 600; letter-spacing: -0.01em; }
html.brand-lj_hooker:not(.is-scrolled):not(.menu-open) .site--homes-show .site-nav .btn--primary { background: rgba(94, 33, 28, 0.88); }

/* hero: leather-tinted shade, centred 600-weight headline */
.brand-lj_hooker .hero--heritage .hero__overlay { background: linear-gradient(180deg, rgba(36, 12, 9, 0.5), rgba(36, 12, 9, 0.28) 45%, rgba(36, 12, 9, 0.66)); }
.brand-lj_hooker .hero--heritage .hero__title { font-weight: 600; letter-spacing: -0.025em; }
.brand-lj_hooker .hero--heritage .hero__pill { border-color: rgba(229, 210, 172, 0.7); background: rgba(94, 33, 28, 0.55); color: #f3e6cc; letter-spacing: 0.24em; }
.brand-lj_hooker .hero--heritage .hero__stat dd { font-weight: 500; }
.brand-lj_hooker .hero--heritage .btn--primary:hover { background: #fff9eb; }

/* cards: softer 16px corners, leather shadow */
.brand-lj_hooker .room-card { border-radius: 16px; box-shadow: 0 12px 36px rgba(94, 33, 28, 0.08); }
.brand-lj_hooker :is(.feature-group, .highlight, .facts__price-card, .stats, .document-card, .form-card, .inspection) { border-radius: 16px; }
.brand-lj_hooker .feature-group__title::before { border-radius: 50%; }
.brand-lj_hooker .facts__price-card .facts__label, .brand-lj_hooker .facts__price-card .facts__method { color: rgba(255, 249, 235, 0.78); }
.brand-lj_hooker .facts__price { color: #e5d2ac; }
.brand-lj_hooker .stat__value { font-size: 1.55rem; font-weight: 500; letter-spacing: -0.01em; white-space: nowrap; }
.brand-lj_hooker .inspection__date { background: #5e211c; color: #fff9eb; }
.brand-lj_hooker :is(.inspection__day, .inspection__month) { color: #e5d2ac; }
.brand-lj_hooker .chip.is-active, .brand-lj_hooker .chip[aria-pressed="true"] { color: #fff9eb; }

/* vintage leather footer under a tricolour band, with a clay address line */
.brand-lj_hooker .site-footer { border-top: 6px solid transparent; border-image: var(--ljh-tricolour) 1; }
.brand-lj_hooker .site-footer__address { color: #e5d2ac; }
.brand-lj_hooker .site-footer .btn--outline:hover { color: #5e211c; }

/* mobile action bar on linen: leather pill + leather outline */
.brand-lj_hooker .mobile-cta .btn--outline { color: #5e211c; }

/* The LJ Hooker tricolour: a logo-style mark before the property name, ticks on section labels, the divider
   between sections and a brochure-style block above the hero headline. */
.brand-lj_hooker .site-nav__brand-street::before {
  content: ""; display: inline-block; width: 0.95em; height: 0.82em; margin-right: 0.45em; vertical-align: -0.06em;
  background: var(--ljh-tricolour); border-radius: 1px;
}
.brand-lj_hooker .section-head__eyebrow::before { width: 26px; height: 4px; background: var(--ljh-tricolour); }
.brand-lj_hooker .section + .section::before { width: 48px; height: 3px; background: var(--ljh-tricolour); }
.brand-lj_hooker .hero--heritage .hero__title::before {
  content: ""; display: block; width: 3.4rem; height: 0.5rem; margin: 0 auto 1.15rem; background: var(--ljh-tricolour);
}
