/* GARAGE AFTER HOURS / The Light Left On / v1.0
   Load this file from the brand-system root so bundled font URLs resolve.
   Breakpoint variables document the scale; CSS @media cannot consume var(). */

:root {
  /* Primitive colors */
  --gah-coal:var(--wp--preset--color--coal);
  --gah-panel:var(--wp--preset--color--panel);
  --gah-cream:var(--wp--preset--color--cream);
  --gah-paper:var(--wp--preset--color--paper);
  --gah-amber:var(--wp--preset--color--amber);
  --gah-amber-hover:var(--wp--preset--color--amber-hover);
  --gah-amber-active:var(--wp--preset--color--amber-active);
  --gah-rust:var(--wp--preset--color--rust);
  --gah-olive:var(--wp--preset--color--olive);
  --gah-steel:var(--wp--preset--color--steel);
  --gah-mist:var(--wp--preset--color--mist);
  --gah-slate:var(--wp--preset--color--slate);
  --gah-line:var(--wp--preset--color--line);
  --gah-control-border:var(--wp--preset--color--control-border);

  /* Light editorial surface is the reading default. */
  --gah-bg:var(--gah-paper);
  --gah-surface:var(--gah-cream);
  --gah-text:var(--gah-coal);
  --gah-text-muted:var(--gah-slate);
  --gah-link:var(--gah-rust);
  --gah-border:var(--gah-line);
  --gah-error:var(--gah-rust);
  --gah-success:var(--gah-olive);
  --gah-focus:var(--wp--preset--color--focus);
  --gah-focus-gap:var(--wp--preset--color--focus-gap);

  /* Four-pixel spacing rhythm */
  --gah-space-0:0;
  --gah-space-1:.25rem;
  --gah-space-2:.5rem;
  --gah-space-3:.75rem;
  --gah-space-4:1rem;
  --gah-space-5:1.25rem;
  --gah-space-6:1.5rem;
  --gah-space-8:2rem;
  --gah-space-10:2.5rem;
  --gah-space-12:3rem;
  --gah-space-16:4rem;
  --gah-space-20:5rem;
  --gah-space-24:6rem;

  --gah-radius-none:0;
  --gah-radius-sm:2px;
  --gah-radius-md:4px;
  --gah-radius-lg:8px;
  --gah-shadow-none:none;
  --gah-shadow-card:0 4px 16px rgb(25 27 26 / .08);
  --gah-shadow-overlay:0 16px 40px rgb(0 0 0 / .24);
  --gah-shadow-focus:0 0 0 2px var(--gah-focus-gap),0 0 0 5px var(--gah-focus);

  --gah-font-display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --gah-font-heading:"Barlow",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --gah-font-body:"Barlow",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --gah-font-code:ui-monospace,SFMono-Regular,Consolas,monospace;
  --gah-weight-regular:400;
  --gah-weight-medium:500;
  --gah-weight-heading:600;
  --gah-weight-display:700;
  --gah-text-xs:.75rem; /* Secondary metadata only */
  --gah-text-sm:.875rem;
  --gah-text-base:1rem;
  --gah-text-lg:1.125rem;
  --gah-text-xl:1.5rem;
  --gah-text-2xl:2rem;
  --gah-text-3xl:2.5rem;
  --gah-text-4xl:3.5rem;
  --gah-text-display:clamp(3rem,2rem + 3vw,5.5rem);
  --gah-leading-display:.98;
  --gah-leading-heading:1.15;
  --gah-leading-body:1.55;
  --gah-leading-caption:1.4;
  --gah-tracking-display:-.015em;
  --gah-tracking-label:.08em;

  --gah-container-wide:76rem;
  --gah-container-content:64rem;
  --gah-container-reading:42rem;
  --gah-gutter:1.25rem;
  --gah-grid-gap:1.5rem;
  --gah-section-gap:4rem;
  --gah-bp-sm:30rem;
  --gah-bp-md:48rem;
  --gah-bp-lg:64rem;
  --gah-bp-xl:80rem;

  --gah-button-bg:var(--gah-amber);
  --gah-button-text:var(--gah-coal);
  --gah-button-hover:var(--gah-amber-hover);
  --gah-button-active:var(--gah-amber-active);
  --gah-button-height:2.75rem;
  --gah-button-padding-x:1.25rem;
  --gah-button-radius:var(--gah-radius-sm);
  --gah-card-padding:1.5rem;
  --gah-card-radius:var(--gah-radius-md);
  --gah-card-bg:var(--gah-bg);
  --gah-card-border:1px solid var(--gah-border);
  --gah-card-media-ratio:16/10;
  --gah-input-height:2.75rem;
  --gah-motion-fast:120ms;
  --gah-motion-base:180ms;
  --gah-ease:cubic-bezier(.2,.7,.2,1);
}

.gah-night {
  color-scheme:dark;
  --gah-bg:var(--gah-coal);
  --gah-surface:var(--gah-panel);
  --gah-text:var(--gah-cream);
  --gah-text-muted:var(--gah-mist);
  --gah-link:var(--gah-amber);
  --gah-border:var(--wp--preset--color--border);
  --gah-error:var(--wp--preset--color--error);
  --gah-success:var(--wp--preset--color--success);
  --gah-focus:var(--gah-cream);
  --gah-focus-gap:var(--gah-coal);
}

.gah-surface { background:var(--gah-bg); color:var(--gah-text); font:400 var(--gah-text-base)/var(--gah-leading-body) var(--gah-font-body); }
.gah-container { width:min(calc(100% - 2 * var(--gah-gutter)),var(--gah-container-wide)); margin-inline:auto; }
.gah-reading { max-width:var(--gah-container-reading); }
.gah-display { font:700 var(--gah-text-display)/var(--gah-leading-display) var(--gah-font-display); letter-spacing:var(--gah-tracking-display); text-transform:uppercase; }
.gah-heading { font:600 var(--gah-text-2xl)/var(--gah-leading-heading) var(--gah-font-heading); }
.gah-label { font:600 var(--gah-text-sm)/var(--gah-leading-caption) var(--gah-font-heading); letter-spacing:var(--gah-tracking-label); text-transform:uppercase; }
.gah-link { color:var(--gah-link); text-decoration:underline; text-underline-offset:.2em; text-decoration-thickness:1px; }
.gah-button { box-sizing:border-box; display:inline-flex; justify-content:center; align-items:center; gap:.5rem; min-height:var(--gah-button-height); padding:.65rem var(--gah-button-padding-x); border:2px solid transparent; border-radius:var(--gah-button-radius); background:var(--gah-button-bg); color:var(--gah-button-text); font:600 1rem/1.2 var(--gah-font-heading); text-decoration:none; cursor:pointer; transition:background var(--gah-motion-fast) var(--gah-ease); }
.gah-button:hover { background:var(--gah-button-hover); }
.gah-button:active { background:var(--gah-button-active); }
.gah-button-secondary { background:transparent; color:var(--gah-text); border-color:var(--gah-control-border); }
.gah-button-secondary:hover { background:var(--gah-surface); }
.gah-button:disabled { opacity:.5; cursor:not-allowed; }
.gah-card { padding:var(--gah-card-padding); background:var(--gah-card-bg); border:var(--gah-card-border); border-radius:var(--gah-card-radius); box-shadow:var(--gah-shadow-none); }
.gah-card-media { display:block; width:100%; aspect-ratio:var(--gah-card-media-ratio); object-fit:cover; }
.gah-input { box-sizing:border-box; min-height:var(--gah-input-height); width:100%; padding:.75rem 1rem; background:var(--gah-bg); color:var(--gah-text); border:1px solid var(--gah-control-border); border-radius:var(--gah-radius-sm); font:400 1rem/1.4 var(--gah-font-body); }
.gah-input::placeholder { color:var(--gah-text-muted); opacity:1; }
.gah-surface :where(a,button,input,select,textarea):focus-visible { outline:2px solid transparent; outline-offset:3px; box-shadow:var(--gah-shadow-focus); }
.gah-input[aria-invalid="true"] { border:2px solid var(--gah-error); }
.gah-field-error { color:var(--gah-error); font-size:var(--gah-text-sm); }
.gah-skip-link { position:absolute; top:1rem; left:1rem; transform:translateY(-200%); z-index:100; }
.gah-skip-link:focus { transform:translateY(0); }
@media(min-width:48rem) { :root { --gah-gutter:2rem; --gah-grid-gap:2rem; --gah-section-gap:5rem; } }
@media(min-width:64rem) { :root { --gah-gutter:2.5rem; --gah-section-gap:6rem; } }
@media(prefers-reduced-motion:reduce) { :root { --gah-motion-fast:0ms; --gah-motion-base:0ms; } }
@media(forced-colors:active) { .gah-surface :where(a,button,input,select,textarea):focus-visible { outline:2px solid Highlight; box-shadow:none; } .gah-button { border:2px solid ButtonText; } }