/* Locked self-hosted faces. Paths relative to pack root. */

@font-face {
  font-family: "Hanken Grotesk";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/fonts/hanken-grotesk-300-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Hanken Company";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/fonts/hanken-grotesk-300-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Hanken Grotesk";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/hanken-grotesk-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Hanken Company";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/hanken-grotesk-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/manrope-400-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope Company";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/manrope-400-latin.woff2") format("woff2");
}
@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/manrope-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope Company";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/manrope-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/fonts/manrope-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope Company";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/fonts/manrope-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/fonts/manrope-latin-700-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Manrope Company";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/fonts/manrope-latin-700-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Host Grotesk";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/host-grotesk-latin-400-normal.woff2") format("woff2"), url("assets/fonts/host-400.ttf") format("truetype");
}
@font-face {
  font-family: "Host Grotesk";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/host-grotesk-latin-500-normal.woff2") format("woff2"), url("assets/fonts/host-500.ttf") format("truetype");
}
@font-face {
  font-family: "Host Grotesk";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/fonts/host-grotesk-latin-600-normal.woff2") format("woff2"), url("assets/fonts/host-600.ttf") format("truetype");
}
@font-face {
  font-family: "Host Grotesk";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/fonts/host-grotesk-latin-700-normal.woff2") format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/inter-latin-400-normal.woff2") format("woff2"), url("assets/fonts/inter-400.ttf") format("truetype");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/inter-latin-500-normal.woff2") format("woff2"), url("assets/fonts/inter-500.ttf") format("truetype");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/fonts/inter-latin-600-normal.woff2") format("woff2"), url("assets/fonts/inter-600.ttf") format("truetype");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/fonts/inter-latin-700-normal.woff2") format("woff2");
}

/* Roover brand pack — locked tokens only.
   Authority: SYSTEM-LOCKS 18 Aug 2026 + live RoofHero www + V4 company CSS.
   Two skins. Do not mix. Do not invent a third pairing.
   Include this file. Then scope a page as [data-skin="roofhero"] or [data-skin="onroover"]. */

/* --------------------------------------------------------------------------
   Shared (not a third skin)
   -------------------------------------------------------------------------- */
:root {
  --pack-lock: "18 Aug 2026";
  --pack-hero-lock: "21 Aug 2026 ~3:48 AM PT";
  --ease-land: cubic-bezier(.2, .78, .18, 1);
  --ease-paper: cubic-bezier(.22, .72, .18, 1);
}

/* --------------------------------------------------------------------------
   RoofHero — marketplace, a $50k start
   Live on roofhero.com.au. Host Grotesk + Inter. Blaze is the one door.
   -------------------------------------------------------------------------- */
[data-skin="roofhero"],
.skin-roofhero {
  --rh-blaze: #ff7006;
  --rh-blaze-dark: #cc5904;
  --rh-blaze-darker: #662c02;
  --rh-blaze-darkest: #4c2101;
  --rh-blaze-light: #ff9a50;
  --rh-blaze-lighter: #ffe2cd;
  --rh-blaze-lightest: #fff0e6;
  --rh-blaze-ring: rgba(255, 112, 6, 0.18);

  --rh-plantation: #1e4c41;
  --rh-plantation-dark: #0f2620;
  --rh-plantation-darker: #0b1c18;
  --rh-plantation-light: #265f52;

  --rh-pampas: #f4f3ec;
  --rh-pampas-light: #f7f6f1;
  --rh-pampas-lighter: #fcfcfb;
  --rh-pampas-dark: #c3c2bc;

  --rh-ink: #191919;
  --rh-ink-soft: #4c4c4c;
  --rh-ink-mute: #7f7f7f;

  --rh-header-chrome: #2e3a35; /* live www header, not a third green */
  --rh-header-blaze-bar: 3px;

  --rh-font-heading: "Host Grotesk", ui-sans-serif, system-ui, sans-serif;
  --rh-font-body: Inter, ui-sans-serif, system-ui, sans-serif;

  --rh-radius-pill: 999px;
  --rh-radius-card: 14px;
  --rh-door-label: "Find my roof";
  --rh-door-href: "https://get.roofhero.com.au";

  color: var(--rh-ink);
  background: var(--rh-pampas);
  font-family: var(--rh-font-body);
}

[data-skin="roofhero"] h1,
[data-skin="roofhero"] h2,
[data-skin="roofhero"] h3,
[data-skin="roofhero"] h4,
.skin-roofhero h1,
.skin-roofhero h2,
.skin-roofhero h3,
.skin-roofhero h4 {
  font-family: var(--rh-font-heading);
  font-weight: 600;
  letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   OnRoover — company, quiet paper
   V4 paper system (the lock). Apex Inter-only onroover.com is off-lock.
   Hanken Grotesk 300 display. Manrope 400–700 body. Amber is the wordmark DOT only.
   -------------------------------------------------------------------------- */
[data-skin="onroover"],
.skin-onroover {
  --or-paper: #f3f4ef;
  --or-paper-clean: #faf9f3;
  --or-paper-deep: #e7eae4;
  --or-hero-wash: #eef1ec;

  --or-ink: #0b2a20;
  --or-ink-soft: #3f514a;
  --or-green: #0e6545;

  --or-amber: #ffb54c;
  --or-amber-halo: #ffb54c26;
  --or-steel: #d8dbd5;
  --or-line: rgba(11, 42, 32, 0.14);
  --or-header: #f3f4eff5;

  --or-font-display: "Hanken Grotesk", "Hanken Company", ui-sans-serif, system-ui, sans-serif;
  --or-font-body: Manrope, "Manrope Company", ui-sans-serif, system-ui, sans-serif;

  --or-door-label: "Talk to Roover";
  --or-door-href: "https://onroover.com/contact";

  color: var(--or-ink);
  background: var(--or-paper);
  font-family: var(--or-font-body);
}

[data-skin="onroover"] h1,
[data-skin="onroover"] h2,
[data-skin="onroover"] h3,
.skin-onroover h1,
.skin-onroover h2,
.skin-onroover h3 {
  font-family: var(--or-font-display);
  font-weight: 300;
  letter-spacing: -0.04em;
}

/* Wordmark — V4 .company-wordmark. Amber disc is NOT a button. */
.company-wordmark {
  display: inline-flex;
  align-items: center;
  gap: 0.72rem;
  color: var(--or-ink, #0b2a20);
  font-family: var(--or-font-display, "Hanken Grotesk", sans-serif);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.19em;
  text-decoration: none;
  text-transform: uppercase;
}
.company-wordmark span,
.company-wordmark .dot {
  width: 0.56rem;
  height: 0.56rem;
  border-radius: 50%;
  background: var(--or-amber, #ffb54c);
  box-shadow: 0 0 0 0.28rem #ffb54c26;
}

/* --------------------------------------------------------------------------
   V4 RoofViz materials — PRODUCT, not brand meaning
   Use only inside the visualiser / proof. Never as the first-screen story.
   -------------------------------------------------------------------------- */
:root {
  --viz-ironsand: #2e3033;
  --viz-grey-friars: #54585a;
  --viz-titania: #d8d5cc;
  --viz-karaka: #2c302b;
}

/* --------------------------------------------------------------------------
   Kill list as comments so a search finds them
   -------------------------------------------------------------------------- */
/*
  NEVER on RoofHero: --or-paper, --or-amber, Hanken, Manrope, blaze wash, blaze hero,
  second primary CTA, Roof Review, instant quote, AI, guaranteed price.
  NEVER on OnRoover: --rh-blaze, Host Grotesk, Inter as brand face, Find My Roof,
  address field, live Start, truck, lab chrome, new first-screen concept.
  NEVER either: gold #f1be3f, terracotta #b44724, RoofViz yellow #FCE352 as brand,
  Project Room palette, Host on the RoofHero logo, amber as a button.
*/