/*
Theme Name: Hatch Event Child
Theme URI: https://elementor.com/hello-theme/
Description: A custom child theme for Hatch Event built on Hello Elementor, with global typography and color styles.
Author: Your Name
Author URI: https://he-static.ifdemo.com/
Template: hello-elementor
Version: 1.0.0
Text Domain: hatch-event-child
*/

/* Import parent theme styles */
@import url("../hello-elementor/style.css");

/**********  GLOBAL THEME TYPOGRAPHY + COLORS **********/
:root {
	/* COLORS */
	--color-primary: #FFCF01;
	--color-secondary: #E69B2D;
	--color-text: #231F20;
	--color-accent: #E69B2D;
	--color-white: #FFFFFF;
	--color-grey: #F2F0EF;
	--color-light-grey: #F9F7F7;
	
	/* FONT FAMILIES */
	--font-family-heading: "Baloo 2", sans-serif;
	--font-family-body: "Nunito", sans-serif;
	
	/* FONT SIZES (based on Elementor global settings) */
	--font-size-h1: 3.125em; /* Primary (≈ 50px) */
	--font-size-h2: 2.25em;  /* Secondary (≈ 36px) */
	--font-size-h3: 1.75em;  /* ≈ 28px */
	--font-size-h4: 1.5em;   /* ≈ 24px */
	--font-size-h5: 1.25em;  /* ≈ 20px */
	--font-size-h6: 1.125em; /* ≈ 18px */
	--font-size-body: 1em;   /* 16px */
	--font-size-body2: 0.875em;  /* 14px */
	--font-size-body3: 0.75em;  /* 12px */
	
	
	/*  FONT WEIGHTS */
	--font-weight-light: 300;
	--font-weight-regular: 400;
	--font-weight-medium: 500;
	--font-weight-semibold: 600;
	--font-weight-bold: 700;
	--font-weight-extrabold: 800;
	
	/* LINE HEIGHTS */
/* 	--line-height-heading: 1.26em;
	--line-height-body: 1.5em; */
	
	/*  LETTER SPACING & TRANSFORMS */
	--letter-spacing-none: 0px;
	--text-transform-none: none;
	
	/* BASE STYLES */
	background-color: var(--color-white);
	color: var(--color-text);
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
	line-height: var(--line-height-body);
	font-weight: var(--font-weight-regular);
}

/********** TYPOGRAPHY ELEMENTS **********/
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-family-heading);
	font-weight: var(--font-weight-extrabold);
	line-height: var(--line-height-heading);
	color: var(--color-text);
	margin-bottom: 0.5em;
}

h1 { font-size: var(--font-size-h1); }
h2 { font-size: var(--font-size-h2); }
h3 { font-size: var(--font-size-h3); font-weight: var(--font-weight-bold); }
h4 { font-size: var(--font-size-h4); font-weight: var(--font-weight-bold); }
h5 { font-size: var(--font-size-h5); font-weight: var(--font-weight-medium); }
h6 { font-size: var(--font-size-h6); font-weight: var(--font-weight-medium); }

body, p {
	font-family: var(--font-family-body);
	font-size: var(--font-size-body);
	line-height: var(--line-height-body);
	color: var(--color-text);
	font-weight: var(--font-weight-regular);
}

a {
	color: var(--color-accent);
	text-decoration: none;
	transition: color 0.3s ease;
}

a:hover {
	color: var(--color-primary);
}   

/**********  OPTIONAL UTILITIES **********/
/* .text-primary { color: var(--color-primary); }
.text-secondary { color: var(--color-secondary); }
.text-accent { color: var(--color-accent); }
.bg-primary { background-color: var(--color-primary); }
.bg-secondary { background-color: var(--color-secondary); }
.bg-grey { background-color: var(--color-grey); }
 */