/* =========================================================================
   ZEEM brand tokens
   The single source of truth for color, typography, and layout primitives.
   Loaded site-wide. Templates and components reference these — never literals.
   =========================================================================

   Fix 4a — Scroll-snap guard.
   Scroll-snap is intentionally enabled ONLY on the homepage via the
   `html:has(body.page-template-homepage-v2)` rule in homepage-v2.css.
   This global reset ensures no other page inherits snap behaviour.
   ========================================================================= */

/* Disable scroll-snap everywhere by default; homepage-v2.css re-enables via
   a higher-specificity html:has() selector so there is no override conflict. */
html {
	scroll-snap-type: none;
}

:root {
	/* ---------- Color ---------- */
	--zeem-navy:          #0B1A2E;                 /* primary background — all pages */
	--zeem-navy-lifted:   #14253E;                 /* derived: navy +5% L (Home→About tab swap)  */
	--zeem-navy-deep:     #07111F;                 /* derived: navy -3% L (About→Contact swap)   */
	--zeem-gold:          #C9A96E;                 /* logo, headings, active states  */
	--zeem-gold-hover:    #DFC18E;                 /* gold hover/active lift         */
	--zeem-white:         #FFFFFF;                 /* primary text on dark           */
	--zeem-grey:          #5A6478;                 /* muted / unrevealed text        */
	--zeem-grey-light:    #8A92A1;                 /* metadata: location, year       */
	--zeem-overlay:       rgba(11, 26, 46, 0.60);  /* mobile image overlay           */
	--zeem-overlay-heavy: rgba(11, 26, 46, 0.85);  /* fallback over low-contrast art */

	/* ---------- Typography ---------- */
	--zeem-font-sans:     'Montserrat', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
	--zeem-fw-light:      300;
	--zeem-fw-regular:    400;
	--zeem-fw-medium:     500;
	--zeem-fw-semibold:   600;

	/* ---------- Layout ---------- */
	--zeem-content-max:        1400px;
	--zeem-pad-desktop:        60px;
	--zeem-pad-mobile:         20px;
	--zeem-split-images:       55%;                /* desktop split — images column  */
	--zeem-split-content:      45%;                /* desktop split — content column */
	--zeem-section-gap-desktop: 100vh;             /* between-project chapter break  */
	--zeem-section-gap-mobile:  80vh;

	/* ---------- Motion ---------- */
	--zeem-ease:               cubic-bezier(0.25, 0.1, 0.25, 1);
	--zeem-fade-in-duration:   0.6s;
	--zeem-fade-out-duration:  0.4s;
}

/* =========================================================================
   Image placeholder — shown for projects that have no photo yet.
   Fills its container (.project-image, .hero-image, .strip-card-image),
   so it adapts to the archive, single hero, and homepage strip alike.
   Font is inherited so it matches whichever page it appears on.
   ========================================================================= */
.zeem-img-placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 18px;
	padding: 24px;
	text-align: center;
	background: rgba( 255, 255, 255, 0.02 );
	border: 1px solid rgba( 201, 169, 110, 0.18 );
}
.zeem-img-placeholder svg {
	width: clamp( 52px, 22%, 92px );
	height: auto;
	color: var( --zeem-gold );
	opacity: 0.5;
}
.zeem-img-placeholder .zeem-ph-text {
	font-size: 12px;
	font-weight: 300;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var( --zeem-grey-light );
}
