/*
Theme Name: Hellofixx
Theme URI: https://hellofixx.com/
Description: Hellofixx home-services marketplace WordPress theme. Self-contained, ACF-optional, with a service CPT, REST endpoints, dark-mode, and a 13-section homepage that mirrors the Next.js design.
Author: Hellofixx
Author URI: https://hellofixx.com/
Version: 1.0.0
Requires at least: 5.5
Tested up to: 6.5
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hellofixx
Tags: home-services, business, dark-mode, custom-post-type, custom-colors, custom-logo, featured-images, translation-ready
*/

/* ------------------------------------------------------------------ */
/* Brand tokens (CSS custom properties)                               */
/* ------------------------------------------------------------------ */

:root {
	/* Brand palette */
	--hfx-primary:        #FF6741;
	--hfx-primary-dark:   #E85A36;
	--hfx-primary-light:  #FF8F73;
	--hfx-primary-pale:   #FFB89E;
	--hfx-brand-bg:       #FFF5F5;
	--hfx-brand-tint:     #FFF5F2;
	--hfx-ink:            #252525;
	--hfx-ink-soft:       #555555;
	--hfx-ink-muted:      #9CA3AF;
	--hfx-dark-section:   #272D31;
	--hfx-dark-footer:    #1A1A2E;

	/* Surfaces + text */
	--hfx-bg:             #FFF5F5;
	--hfx-surface:        #FFFFFF;
	--hfx-surface-2:      #FFF8F5;
	--hfx-border:         #E5E7EB;
	--hfx-text:           #252525;
	--hfx-text-soft:      #555555;
	--hfx-text-muted:     #9CA3AF;

	/* Radii + shadows */
	--hfx-radius:    0.75rem;
	--hfx-radius-lg: 1.25rem;
	--hfx-radius-2xl: 1.5rem;
	--hfx-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
	--hfx-shadow:    0 4px 16px rgba(0, 0, 0, 0.06);
	--hfx-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.10);

	/* Fonts */
	--hfx-font-poppins: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
	--hfx-font-roboto:  "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;

	--hfx-header-h: 5rem;
}

/* ------------------------------------------------------------------ */
/* Reset / base                                                       */
/* ------------------------------------------------------------------ */

*, *::before, *::after { box-sizing: border-box; }

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--hfx-font-roboto);
	color: var(--hfx-text);
	background-color: var(--hfx-bg);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body.hfx {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

body.hfx main { flex: 1 0 auto; }

h1, h2, h3, h4, h5, h6, nav, button, label, .hfx-font-poppins {
	font-family: var(--hfx-font-poppins);
	color: var(--hfx-ink);
	line-height: 1.2;
	margin: 0 0 0.5em;
	font-weight: 600;
}

p { margin: 0 0 1em; color: var(--hfx-text-soft); }
a { color: var(--hfx-primary); text-decoration: none; transition: color .2s ease; }
a:hover { color: var(--hfx-primary-dark); }

img { max-width: 100%; height: auto; display: block; }

ul, ol { margin: 0 0 1em 1.25em; padding: 0; }
ul li, ol li { margin-bottom: 0.35em; }

button {
	font-family: var(--hfx-font-poppins);
	cursor: pointer;
	border: none;
	background: none;
	color: inherit;
}

input, select, textarea {
	font-family: var(--hfx-font-roboto);
	font-size: 14px;
}

/* Screen-reader text */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}