/* Hallmark · macrostructure: paired operations ledger · tone: technical · anchor hue: inherited navy/amber
 * audience: farm project buyers and field coordinators · use: release materials and installation work with a dated record
 * theme: inherited CattleFenceWire · enrichment: page-specific operational photography · nav: existing · footer: existing
 * pre-emit critique: P5 H5 E4 S5 R5 V4 · contrast: pass (40–41) · slop: pass (42–49)
 * mobile: pass (34, 49, 50–57) · icons: pass (30) · honest: pass (46) · tokens: pass (48)
 */
@import url("/tokens.css");

.page-head--operations { position: relative; isolation: isolate; display: grid; min-height: clamp(30rem, 58vw, 40rem); padding-block: 0; overflow: clip; border: 0; color: var(--color-text-inverse); }
.page-head--operations .page-head__media, .page-head--operations .page-head__veil { position: absolute; inset: 0; }
.page-head--operations .page-head__media { z-index: -2; margin: 0; }
.page-head--operations .page-head__media img { width: 100%; height: 100%; object-fit: cover; }
.page-head--storage .page-head__media img { object-position: center 48%; }
.page-head--handoff .page-head__media img { object-position: 54% center; }
.page-head--operations .page-head__veil { z-index: -1; background: linear-gradient(90deg, color-mix(in oklch, var(--color-primary) 95%, transparent), color-mix(in oklch, var(--color-primary) 78%, transparent) 48%, color-mix(in oklch, var(--color-primary) 24%, transparent)); }
.page-head--operations .page-head__grid { width: min(100% - 2rem, var(--content-wide)); align-self: end; padding-block: var(--space-xl) var(--space-3xl); }
.page-head--operations h1 { max-width: 11ch; color: var(--color-text-inverse); text-shadow: 0 2px 1.5rem var(--color-shadow); }
.page-head--operations p { max-width: 55ch; color: var(--color-text-inverse); text-shadow: 0 1px 0.75rem var(--color-shadow); }
.page-head--operations .page-head__note { padding: var(--space-lg); border: var(--rule-thin) solid color-mix(in oklch, var(--color-text-inverse) 28%, transparent); border-inline-start: var(--rule-strong) solid var(--color-accent); border-radius: var(--radius-md); background: color-mix(in oklch, var(--color-primary) 84%, transparent); color: var(--color-text-inverse); backdrop-filter: blur(0.35rem); }
.operation-status { display: grid; gap: var(--space-sm); margin-block: var(--space-xl); }
.operation-status > div { display: grid; grid-template-columns: minmax(0, 0.6fr) minmax(0, 1.4fr); gap: var(--space-md); padding-block: var(--space-sm); border-block-end: var(--rule-thin) solid var(--color-divider); }
.operation-status strong { color: var(--color-text); }
.operation-status span { color: var(--color-text-muted); }
.release-gate { margin-block: var(--space-xl); padding: var(--space-lg); background: var(--color-primary); color: var(--color-text-inverse); border-radius: var(--radius-lg); }
.release-gate h3 { margin-block-start: 0; color: var(--color-text-inverse); }
.release-gate p, .release-gate li { color: var(--color-text-inverse); }
.resource-figure--operations { display: grid; gap: 0; margin: var(--space-2xl) 0; overflow: clip; border: var(--rule-thin) solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); }
.resource-figure--operations img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.resource-figure--operations figcaption { padding: var(--space-md) var(--space-lg); color: var(--color-text-muted); font-size: var(--text-sm); border-block-start: var(--rule-thin) solid var(--color-divider); }
@media (min-width: 48rem) { .page-head--operations .page-head__grid { grid-template-columns: minmax(0, 1.3fr) minmax(17rem, 0.7fr); } .resource-figure--operations { grid-template-columns: minmax(0, 1.45fr) minmax(14rem, 0.55fr); align-items: stretch; } .resource-figure--operations figcaption { display: grid; align-content: end; border-block-start: 0; border-inline-start: var(--rule-thin) solid var(--color-divider); } }
@media (max-width: 47.99rem) { .page-head--operations { min-height: 37rem; } .page-head--operations .page-head__veil { background: linear-gradient(180deg, color-mix(in oklch, var(--color-primary) 30%, transparent), color-mix(in oklch, var(--color-primary) 92%, transparent) 54%, var(--color-primary)); } .page-head--operations .page-head__grid { padding-block: var(--space-xl) var(--space-3xl); } .page-head--storage .page-head__media img { object-position: 58% center; } .page-head--handoff .page-head__media img { object-position: 57% center; } .operation-status > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-xs); } }
@media print { .page-head--operations { min-height: 0; color: var(--color-text); } .page-head--operations .page-head__media, .page-head--operations .page-head__veil, .resource-figure--operations { display: none; } .page-head--operations .page-head__grid { padding-block: var(--space-md); } .page-head--operations h1, .page-head--operations p, .page-head--operations .page-head__note { color: var(--color-text); text-shadow: none; } .page-head--operations .page-head__note { padding: var(--space-md); background: transparent; border-color: var(--color-border); } .release-gate { background: transparent; color: var(--color-text); border: var(--rule-thin) solid var(--color-border); } .release-gate h3, .release-gate p, .release-gate li { color: var(--color-text); } }