/* ============================================================
   Theme: IRONBARK  -  rugged, industrial, builder & carpenter
   ------------------------------------------------------------
   For: registered builders / carpenters / decks, patios, renos.
   Mood: a working site on warm concrete. Pale concrete grey
   ground, charcoal-steel accent with a timber / hi-vis amber
   pop, a condensed uppercase grotesque, squared-off corners,
   heavy and utilitarian - strong but premium, never flimsy.

   A theme = token overrides + a few .theme-ironbark structural
   tweaks. It never edits base.css, sections.css or tradie.css.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

.theme-ironbark {
  /* -------- Surfaces (warm concrete) -------------------- */
  --bg:        #ECE9E3;
  --bg-2:      #E0DBD1;
  --surface:   #F6F4EF;

  /* -------- Text (charcoal-steel) ----------------------- */
  --fg:            #23262A;
  --fg-muted:      #5C6168;
  --heading-color: #181B1F;

  /* -------- Accent (charcoal-steel) + timber amber ------ */
  --accent:        #2A2E33;
  --accent-bright: #3B4148;
  --accent-hover:  #16191C;
  --accent-2:      #C2772E;   /* timber / hi-vis amber - dots, pops */
  --on-accent:     #F6F4EF;

  --hairline:   rgba(35, 38, 42, 0.16);
  --hairline-2: rgba(35, 38, 42, 0.28);

  /* -------- Hero (neutral-dark veil) -------------------- */
  --hero-ink: #F4F2ED;
  --hero-min-h: 92vh;
  --hero-overlay:
    radial-gradient(120% 95% at 50% 40%, rgba(20,22,25,0.34) 0%, rgba(18,20,23,0.62) 64%, rgba(12,14,16,0.88) 100%),
    linear-gradient(180deg, rgba(20,22,25,0.46) 0%, rgba(20,22,25,0.40) 42%, rgba(12,14,16,0.90) 100%);

  /* -------- Footer (deepest charcoal) ------------------- */
  --footer-bg:     #16191C;
  --footer-fg:     rgba(244, 242, 237, 0.78);
  --footer-strong: #F4F2ED;
  --footer-head:   #C2772E;

  /* -------- Type --------------------------------------- */
  --font-display: 'Oswald', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --fs-hero: clamp(2.8rem, 6.5vw + 1rem, 5.4rem);
  --heading-weight: 600;
  --heading-tracking: 0.01em;
  --eyebrow-tracking: 0.24em;

  /* -------- Squared, rugged corners -------------------- */
  --radius-1: 2px;
  --radius-2: 4px;
  --radius-3: 6px;
  --radius-pill: 4px;   /* even pills are squared off          */
  --radius-btn: 4px;       /* tight, utilitarian */
  --rule-color: var(--accent-2);
  --shadow-1: 0 1px 2px rgba(20,22,25,0.10), 0 8px 24px rgba(20,22,25,0.12);
  --shadow-2: 0 18px 48px rgba(20,22,25,0.20);

  --section-pad: var(--space-9);
}

/* ---- Structural personality: heavy, utilitarian ----------- */

/* Headings stamp in uppercase, like stencilled site markings */
.theme-ironbark h1,
.theme-ironbark h2,
.theme-ironbark h3,
.theme-ironbark h4,
.theme-ironbark .nav__brand,
.theme-ironbark .footer__wordmark,
.theme-ironbark .faq summary { text-transform: uppercase; }

/* Eyebrow heavier, timber amber */
.theme-ironbark .eyebrow { color: var(--accent-2); font-weight: 700; }

/* Solid charcoal primary buttons read heavy and dependable */
.theme-ironbark .btn:hover { background: var(--accent-hover); border-color: var(--accent-hover); }

/* The ghost CTA on the dark hero keeps the pale ink, not charcoal */
.theme-ironbark .btn--ghost:hover { color: var(--accent-hover); }

/* Service cards: a left amber edge marks each like a timber batten */
.theme-ironbark .service-card {
  border-left: 3px solid var(--accent-2);
}
.theme-ironbark .service-card .price { color: var(--accent-bright); }

/* Stat numbers and intro emphasis in steel, accents in timber amber */
.theme-ironbark .intro__meta .stat b,
.theme-ironbark .space-meta .stat b { color: var(--accent); }
.theme-ironbark .intro__lede strong { color: var(--accent); }
.theme-ironbark .intro__lede em { color: var(--accent-2); font-style: normal; }

/* Trust badges read like stamped site labels with an amber edge */
.theme-ironbark .trust-badges .badge-pill {
  border-color: color-mix(in srgb, var(--accent-2) 56%, transparent);
}

/* Before/after captions: amber "AFTER" tag pops on the concrete grid */
.theme-ironbark .ba-item figure.is-after figcaption { color: var(--on-accent); }

/* Uppercase buttons reinforce the stencilled site-marking personality */
.theme-ironbark .btn { text-transform: uppercase; letter-spacing: 0.08em; }