/*
Theme Name:        Hegra Bygg
Theme URI:         https://hegrabygg.no
Author:            Styrk Reklame AS
Author URI:        https://styrkreklame.no
Description:       Hegra Bygg-spesifikt child theme av Styrk Theme. Reproduserer hegrabygg.no sitt visuelle uttrykk (Montserrat + PT Sans, rød/mørk/hvit, store versaler) på en ren PHP 8.3-kompatibel blokk-stack. Innhold og blokker arves fra styrk-blocks-pluginen; tokens og CSS her matcher den gamle Juster-designen uten Rev Slider / WPBakery.
Template:          styrk-theme
Version:           0.1.0
Text Domain:       hegrabygg-theme
Requires at least: 6.4
Requires PHP:      8.3
*/

/* ══════════════════════════════════════════════════════════════════════════
   HEGRA BYGG — design token overrides
   Reproduces hegrabygg.no: Montserrat headings (uppercase, tracked),
   PT Sans body, brand red #E51919, charcoal #222 / slate #35373E, white.
   These :root vars override styrk-blocks' own design-system tokens so the
   shared blocks render in Hegra's palette instead of Styrk's navy/orange.
   ══════════════════════════════════════════════════════════════════════════ */
:root {
	/* design-system color tokens (styrk-blocks/colors_and_type.css) */
	--primary: #222222;
	--primary-r: 34; --primary-g: 34; --primary-b: 34;
	--secondary: #35373e;
	--accent: #e51919;
	--accent-r: 229; --accent-g: 25; --accent-b: 25;
	--light-teal: #9a9a9a;
	--muted: #ececec;
	--surface: #f4f4f4;
	--page-bg: #ffffff;
	--dark-bg: #222222;
	--dark-border: #3a3a3a;
	--dark-text: #fcfcfc;
	--dark-sub: #b8b8b8;
	--fg-on-dark: #fcfcfc;
	--fg1: #222222;
	--fg2: #333333;
	--fg3: #6a6a6a;

	/* typography tokens */
	--font-display: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-sans: "PT Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

	/* flatter than Styrk — Hegra/Juster used near-square corners */
	--radius-sm: 2px;
	--radius-md: 3px;
	--radius-lg: 4px;
	--radius-xl: 4px;
	--radius-2xl: 4px;
}

/* ── Base typography ──────────────────────────────────────────────────────── */
body {
	font-family: var(--font-sans);
	font-size: 15px;
	line-height: 1.65;
	color: #333333;
	background: #ffffff;
}

h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	font-family: var(--font-display);
	color: #222222;
	font-weight: 400;
}

/* Section eyebrows + small section headings = uppercase, tracked (the Hegra look) */
.cb-eyebrow,
.cb-section-header .cb-eyebrow,
.cb-services-tabs__pane-title,
.wp-block-styrk-blocks-feature-cards .cb-eyebrow,
h2.is-style-eyebrow {
	text-transform: uppercase;
	letter-spacing: 2px;
	font-weight: 400;
	color: #222222;
}

/* Big section headings — Montserrat, slightly tracked, dark */
.text-section-heading,
.cb-section-header h2,
h2.wp-block-heading {
	font-family: var(--font-display);
	font-weight: 400;
	letter-spacing: 0.5px;
	color: #222222;
}

/* ── Buttons — Montserrat, uppercase, square, brand red ───────────────────── */
.wp-element-button,
.wp-block-button__link,
.cb-btn,
button.cb-cta,
a.cb-cta {
	font-family: var(--font-display);
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 13px;
	font-weight: 600;
	border-radius: var(--radius-md);
	background-color: var(--accent);
	color: #ffffff;
}
.wp-element-button:hover,
.wp-block-button__link:hover {
	background-color: #c41414;
	color: #ffffff;
}

/* ── Links ────────────────────────────────────────────────────────────────── */
a { color: var(--accent); }
a:hover { color: #c41414; }

/* ── Hero — full-bleed dark photo, big uppercase white heading ────────────── */
.wp-block-styrk-blocks-hero h1,
.wp-block-styrk-blocks-hero h2,
.cb-hero__title {
	font-family: var(--font-display);
	text-transform: uppercase;
	font-weight: 400;
	letter-spacing: 1px;
	color: #fcfcfc;
}

/* ── Footer — Hegra slate ─────────────────────────────────────────────────── */
.site-footer,
.wp-block-template-part .site-footer {
	background-color: #35373e;
	color: #d5d6d9;
}

/* ── Flatten Styrk's rounded cards to match Hegra's squarer surfaces ──────── */
.cb-feature-card,
.wp-block-styrk-blocks-feature-cards li,
.cb-media-grid__cell {
	border-radius: var(--radius-md);
}

/* ══════════════════════════════════════════════════════════════════════════
   Tailwind utility overrides — styrk-blocks bakes the Styrk palette into
   compiled utilities (e.g. `bg-accent` => #F5833C) that CSS-var overrides
   don't reach. Re-point them at Hegra's preset tokens.
   ══════════════════════════════════════════════════════════════════════════ */
.bg-accent { background-color: var(--wp--preset--color--accent, #e51919) !important; }
.text-accent { color: var(--wp--preset--color--accent, #e51919) !important; }
.border-accent { border-color: var(--wp--preset--color--accent, #e51919) !important; }
.bg-primary { background-color: var(--wp--preset--color--primary, #222222) !important; }
.text-primary { color: var(--wp--preset--color--primary, #222222) !important; }
.bg-secondary { background-color: var(--wp--preset--color--secondary, #35373e) !important; }
.text-secondary { color: var(--wp--preset--color--secondary, #35373e) !important; }
.bg-surface { background-color: var(--wp--preset--color--surface, #f4f4f4) !important; }

/* Service / feature cards — Hegra wants a red LEFT border, not a top accent */
.cb-feature-card,
.wp-block-styrk-blocks-feature-cards li.cb-feature-card {
	border-top: 0 !important;
	border-left: 3px solid var(--wp--preset--color--accent, #e51919) !important;
}

/* CTA button (cb-cta-btn) — Hegra red, squared, uppercase Montserrat */
.cb-cta-btn {
	background-color: var(--wp--preset--color--accent, #e51919) !important;
	color: #ffffff !important;
	border-radius: var(--radius-md) !important;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-family: var(--font-display);
	font-weight: 600;
}
.cb-cta-btn:hover { background-color: #c41414 !important; }