/*
Theme Name: AHM Industrial
Theme URI: https://ahminternational.com/theme
Author: AHM International
Author URI: https://ahminternational.com
Description: A bold, Elementor-ready WordPress theme for factories, industrial engineering firms and manufacturing companies. Ships with a full-width homepage builder, custom post types for Services, Projects, Team and Testimonials, custom Elementor widgets, and an importable Elementor template kit. Works with the free version of Elementor.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ahm-industrial
Tags: business, portfolio, blog, one-column, two-columns, right-sidebar, custom-colors, custom-logo, custom-menu, featured-images, full-width-template, block-styles, editor-style, threaded-comments, translation-ready
*/

/* ==========================================================================
   AHM Industrial — Base stylesheet
   1. Design tokens
   2. Reset & document
   3. Typography
   4. Layout primitives
   5. WordPress core classes
   6. Accessibility
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Design tokens
   -------------------------------------------------------------------------- */

:root {
	/* Brand palette */
	--ahm-primary: #ff5b1b;
	--ahm-primary-hover: #e64a0d;
	--ahm-primary-soft: rgba( 255, 91, 27, 0.1 );
	--ahm-accent: #ffa944;
	--ahm-dark: #0a1119;
	--ahm-dark-2: #121b25;
	--ahm-dark-3: #1b2530;
	--ahm-text: #4b535d;
	--ahm-heading: #0a1119;
	--ahm-cream: #faf5ed;
	--ahm-border: #d8dde1;
	--ahm-white: #ffffff;
	--ahm-black: #000000;
	--ahm-muted: #8b939c;

	/* Typography */
	--ahm-font-heading: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--ahm-font-body: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--ahm-fs-base: 16px;
	--ahm-lh-base: 1.75;
	--ahm-lh-heading: 1.12;
	--ahm-ls-heading: -0.02em;

	/* Fluid display sizes */
	--ahm-fs-display: clamp( 2.5rem, 1.35rem + 4.6vw, 5rem );
	--ahm-fs-h1: clamp( 2.25rem, 1.4rem + 3.4vw, 4rem );
	--ahm-fs-h2: clamp( 1.875rem, 1.25rem + 2.4vw, 3rem );
	--ahm-fs-h3: clamp( 1.375rem, 1.1rem + 1.1vw, 1.875rem );
	--ahm-fs-h4: clamp( 1.175rem, 1.05rem + 0.5vw, 1.375rem );
	--ahm-fs-h5: 1.125rem;
	--ahm-fs-h6: 1rem;

	/* Layout */
	--ahm-container: 1320px;
	--ahm-container-narrow: 900px;
	--ahm-gutter: 24px;
	--ahm-section-y: clamp( 64px, 4rem + 3vw, 120px );

	/* Shape */
	--ahm-radius: 7px;
	--ahm-radius-lg: 14px;
	--ahm-radius-pill: 50px;

	/* Elevation */
	--ahm-shadow-sm: 0 2px 8px rgba( 10, 17, 25, 0.05 );
	--ahm-shadow: 0 10px 30px rgba( 10, 17, 25, 0.07 );
	--ahm-shadow-lg: 0 24px 60px rgba( 10, 17, 25, 0.12 );

	/* Motion */
	--ahm-transition: 0.35s cubic-bezier( 0.25, 0.8, 0.25, 1 );

	/* WordPress admin bar offset helper */
	--ahm-header-h: 88px;
}

/* --------------------------------------------------------------------------
   2. Reset & document
   -------------------------------------------------------------------------- */

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc( var( --ahm-header-h ) + 24px );
}

body {
	margin: 0;
	background-color: var( --ahm-white );
	color: var( --ahm-text );
	font-family: var( --ahm-font-body );
	font-size: var( --ahm-fs-base );
	line-height: var( --ahm-lh-base );
	font-weight: 400;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body.ahm-nav-open {
	overflow: hidden;
}

img,
svg,
video,
canvas,
iframe {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

img {
	border: 0;
}

figure {
	margin: 0;
}

iframe {
	border: 0;
}

svg {
	fill: currentColor;
}

hr {
	height: 1px;
	margin: 32px 0;
	border: 0;
	background-color: var( --ahm-border );
}

ul,
ol {
	padding-left: 1.25em;
}

li > ul,
li > ol {
	margin-bottom: 0;
}

table {
	width: 100%;
	margin-bottom: 24px;
	border-collapse: collapse;
	text-align: left;
}

th,
td {
	padding: 12px 16px;
	border: 1px solid var( --ahm-border );
}

th {
	color: var( --ahm-heading );
	font-family: var( --ahm-font-heading );
	font-weight: 600;
}

code,
kbd,
pre,
samp {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.9em;
}

code {
	padding: 0.2em 0.45em;
	border-radius: 4px;
	background-color: var( --ahm-cream );
	color: var( --ahm-primary );
}

pre {
	overflow-x: auto;
	max-width: 100%;
	padding: 24px;
	border-radius: var( --ahm-radius );
	background-color: var( --ahm-dark );
	color: #e6e9ec;
	line-height: 1.6;
}

pre code {
	padding: 0;
	background: none;
	color: inherit;
}

blockquote {
	position: relative;
	margin: 32px 0;
	padding: 28px 32px;
	border-left: 4px solid var( --ahm-primary );
	border-radius: 0 var( --ahm-radius ) var( --ahm-radius ) 0;
	background-color: var( --ahm-cream );
	color: var( --ahm-heading );
	font-family: var( --ahm-font-heading );
	font-size: 1.125rem;
	font-weight: 500;
	font-style: normal;
	line-height: 1.6;
}

blockquote > :last-child {
	margin-bottom: 0;
}

blockquote cite {
	display: block;
	margin-top: 12px;
	color: var( --ahm-text );
	font-family: var( --ahm-font-body );
	font-size: 0.9375rem;
	font-weight: 400;
	font-style: normal;
}

::selection {
	background-color: var( --ahm-primary );
	color: var( --ahm-white );
}

/* --------------------------------------------------------------------------
   3. Typography
   -------------------------------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6,
.ahm-h1,
.ahm-h2,
.ahm-h3,
.ahm-h4 {
	margin: 0 0 0.6em;
	color: var( --ahm-heading );
	font-family: var( --ahm-font-heading );
	font-weight: 600;
	line-height: var( --ahm-lh-heading );
	letter-spacing: var( --ahm-ls-heading );
	text-wrap: balance;
}

h1,
.ahm-h1 {
	font-size: var( --ahm-fs-h1 );
}

h2,
.ahm-h2 {
	font-size: var( --ahm-fs-h2 );
}

h3,
.ahm-h3 {
	font-size: var( --ahm-fs-h3 );
}

h4,
.ahm-h4 {
	font-size: var( --ahm-fs-h4 );
}

h5 {
	font-size: var( --ahm-fs-h5 );
}

h6 {
	font-size: var( --ahm-fs-h6 );
	letter-spacing: 0;
	text-transform: uppercase;
}

p {
	margin: 0 0 1.25em;
}

p:last-child {
	margin-bottom: 0;
}

a {
	color: var( --ahm-primary );
	text-decoration: none;
	transition: color var( --ahm-transition );
}

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

strong,
b {
	color: var( --ahm-heading );
	font-weight: 600;
}

small {
	font-size: 0.875rem;
}

.ahm-display {
	font-size: var( --ahm-fs-display );
	letter-spacing: -0.03em;
}

.ahm-lead {
	font-size: 1.0625rem;
	line-height: 1.8;
}

.ahm-text-primary {
	color: var( --ahm-primary );
}

.ahm-text-white {
	color: var( --ahm-white );
}

.ahm-text-center {
	text-align: center;
}

/* Highlighted words inside headings, e.g. <span class="ahm-mark">Forward</span> */
.ahm-mark {
	position: relative;
	color: var( --ahm-primary );
	white-space: nowrap;
}

.ahm-underline {
	position: relative;
	display: inline-block;
}

.ahm-underline::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0.06em;
	left: 0;
	height: 0.14em;
	border-radius: 2px;
	background-color: var( --ahm-primary-soft );
}

/* --------------------------------------------------------------------------
   4. Layout primitives
   -------------------------------------------------------------------------- */

.ahm-container {
	width: 100%;
	max-width: var( --ahm-container );
	margin-inline: auto;
	padding-inline: var( --ahm-gutter );
}

.ahm-container--narrow {
	max-width: var( --ahm-container-narrow );
}

.ahm-container--wide {
	max-width: 1560px;
}

.ahm-section {
	position: relative;
	padding-block: var( --ahm-section-y );
}

.ahm-section--tight {
	padding-block: calc( var( --ahm-section-y ) * 0.62 );
}

.ahm-section--flush-top {
	padding-top: 0;
}

.ahm-section--flush-bottom {
	padding-bottom: 0;
}

.ahm-section--cream {
	background-color: var( --ahm-cream );
}

.ahm-section--dark {
	background-color: var( --ahm-dark );
	color: rgba( 255, 255, 255, 0.72 );
}

.ahm-section--dark h1,
.ahm-section--dark h2,
.ahm-section--dark h3,
.ahm-section--dark h4,
.ahm-section--dark h5,
.ahm-section--dark h6 {
	color: var( --ahm-white );
}

.ahm-grid {
	display: grid;
	gap: 30px;
}

.ahm-grid--2 {
	grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
}

.ahm-grid--3 {
	grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
}

.ahm-grid--4 {
	grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
}

.ahm-flex {
	display: flex;
	gap: 16px;
	align-items: center;
}

.ahm-flex--between {
	justify-content: space-between;
}

.ahm-flex--wrap {
	flex-wrap: wrap;
}

.ahm-stack > * + * {
	margin-top: var( --ahm-stack-gap, 20px );
}

/* Screen-reader-safe skip link target spacing */
.ahm-site-content {
	display: block;
}

/* --------------------------------------------------------------------------
   5. WordPress core classes
   -------------------------------------------------------------------------- */

.alignleft {
	float: left;
	margin: 0.4em 2em 1.5em 0;
}

.alignright {
	float: right;
	margin: 0.4em 0 1.5em 2em;
}

.aligncenter {
	display: block;
	margin: 0 auto 1.5em;
	clear: both;
}

.alignwide {
	width: calc( 100% + 120px );
	max-width: calc( 100vw - 48px );
	margin-inline: -60px;
}

.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc( 50% - 50vw );
}

.wp-caption {
	max-width: 100%;
	margin-bottom: 1.5em;
}

.wp-caption img {
	border-radius: var( --ahm-radius );
}

.wp-caption-text,
.wp-block-image figcaption,
.wp-block-embed figcaption {
	margin-top: 12px;
	color: var( --ahm-muted );
	font-size: 0.875rem;
	text-align: center;
}

.gallery {
	display: grid;
	gap: 12px;
	margin-bottom: 1.5em;
}

.gallery-columns-2 { grid-template-columns: repeat( 2, 1fr ); }
.gallery-columns-3 { grid-template-columns: repeat( 3, 1fr ); }
.gallery-columns-4 { grid-template-columns: repeat( 4, 1fr ); }
.gallery-columns-5 { grid-template-columns: repeat( 5, 1fr ); }

.gallery-item {
	margin: 0;
}

.gallery-item img {
	width: 100%;
	border-radius: var( --ahm-radius );
	object-fit: cover;
}

.wp-block-image img,
.wp-block-cover,
.wp-block-embed iframe,
.wp-block-video video {
	border-radius: var( --ahm-radius );
}

.wp-block-button__link,
.wp-element-button {
	border-radius: var( --ahm-radius-pill );
	background-color: var( --ahm-primary );
	color: var( --ahm-white );
	font-family: var( --ahm-font-heading );
	font-weight: 600;
}

.wp-block-quote {
	border-left: 4px solid var( --ahm-primary );
	padding-left: 24px;
}

.wp-block-separator {
	border-color: var( --ahm-border );
}

.sticky .ahm-card__title::after {
	content: " ★";
	color: var( --ahm-primary );
}

.bypostauthor > .comment-body > .comment-meta {
	position: relative;
}

.wp-block-search__button,
.wp-block-file .wp-block-file__button {
	border-radius: var( --ahm-radius-pill );
	background-color: var( --ahm-primary );
	color: var( --ahm-white );
}

/* Embeds keep their aspect ratio */
.wp-block-embed__wrapper {
	position: relative;
}

.wp-embed-aspect-16-9 .wp-block-embed__wrapper::before {
	content: "";
	display: block;
	padding-top: 56.25%;
}

.wp-embed-aspect-16-9 .wp-block-embed__wrapper iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* --------------------------------------------------------------------------
   6. Accessibility
   -------------------------------------------------------------------------- */

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset( 50% );
	margin: -1px;
	padding: 0;
	border: 0;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	z-index: 100000;
	top: 16px;
	left: 16px;
	width: auto;
	height: auto;
	clip-path: none;
	padding: 14px 24px;
	border-radius: var( --ahm-radius );
	background-color: var( --ahm-white );
	box-shadow: var( --ahm-shadow );
	color: var( --ahm-primary );
	font-family: var( --ahm-font-heading );
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
}

:focus-visible {
	outline: 2px solid var( --ahm-primary );
	outline-offset: 3px;
}

/* Respect users who prefer less motion */
@media ( prefers-reduced-motion: reduce ) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}

	.ahm-reveal {
		opacity: 1 !important;
		transform: none !important;
	}
}

/* Admin bar keeps the sticky header clear */
body.admin-bar .ahm-header--sticky.is-stuck {
	top: 32px;
}

@media screen and ( max-width: 782px ) {
	body.admin-bar .ahm-header--sticky.is-stuck {
		top: 46px;
	}
}