/* StoreRail shared styles: fonts, brand tokens (Industrial Calm / Midnight Rail), base, shared components.
   Token values come from design/project/uploads/StoreRail_Brand_Handoff_Package (section 4). */

@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-latin-var.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-latin-ext-var.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/jetbrains-mono-latin-400.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/jetbrains-mono-latin-500.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/jetbrains-mono-latin-600.woff2) format('woff2')}

:root,[data-theme="light"]{
  color-scheme:light;
  --sr-canvas:#F3EDE2;--sr-surface:#FFFFFF;--sr-surface-subtle:#F7F5F1;--sr-surface-accent:#D8E8F0;
  --sr-text:#2B2B2B;--sr-text-secondary:#57534E;--sr-border:#D8D1C7;--sr-border-control:#827D75;
  --sr-action:#405F7D;--sr-action-hover:#334C64;--sr-action-active:#293E52;--sr-on-action:#FFFFFF;
  --sr-link:#405F7D;--sr-focus:#405F7D;--sr-selected-bg:#D8E8F0;--sr-selected-fg:#2B2B2B;
  --sr-disabled-bg:#E7E2DA;--sr-disabled-fg:#66615B;
  --sr-success:#237A57;--sr-success-bg:#EAF4EE;--sr-warning:#8A5A12;--sr-warning-bg:#FFF3D6;
  --sr-error:#BA4242;--sr-error-bg:#FBECEC;--sr-info:#356B9A;--sr-info-bg:#EAF2F8;
  --sr-code-bg:#20252B;--sr-code-fg:#F3EDE2;--sr-code-border:#3A424C;
  --sr-syn-key:#B8CDD8;--sr-syn-str:#79D5AB;--sr-syn-num:#F0C36B;--sr-syn-kw:#91C8F0;--sr-syn-attr:#C8C0D8;--sr-syn-punc:#9BA6B4;
  --sr-steel:#A8B8CC;--sr-header:rgba(243,237,226,0.92)
}
[data-theme="dark"]{
  color-scheme:dark;
  --sr-canvas:#181C21;--sr-surface:#222830;--sr-surface-subtle:#2B323B;--sr-surface-accent:#303D4B;
  --sr-text:#F3EDE2;--sr-text-secondary:#B8CDD8;--sr-border:#414B57;--sr-border-control:#7C8C9E;
  --sr-action:#A8B8CC;--sr-action-hover:#B8CDD8;--sr-action-active:#D8E8F0;--sr-on-action:#181C21;
  --sr-link:#B8CDD8;--sr-focus:#D8E8F0;--sr-selected-bg:#303D4B;--sr-selected-fg:#D8E8F0;
  --sr-disabled-bg:#303741;--sr-disabled-fg:#9BA6B4;
  --sr-success:#79D5AB;--sr-success-bg:#16382B;--sr-warning:#F0C36B;--sr-warning-bg:#3A2D16;
  --sr-error:#F39B9B;--sr-error-bg:#402526;--sr-info:#91C8F0;--sr-info-bg:#1D3447;
  --sr-code-bg:#12161B;--sr-code-fg:#F3EDE2;--sr-code-border:#2B323B;
  --sr-steel:#A8B8CC;--sr-header:rgba(24,28,33,0.92)
}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html.smooth{scroll-behavior:smooth}
body{margin:0;background:var(--sr-canvas);color:var(--sr-text);font-family:'Inter',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:var(--sr-link)}
a:hover{color:var(--sr-action-hover)}
:focus-visible{outline:2px solid var(--sr-focus);outline-offset:2px}
input,select,textarea,button{font-family:inherit}
code{font-family:'JetBrains Mono',monospace}
[hidden]{display:none!important}

.skip-link{position:absolute;left:16px;top:-64px;z-index:100;padding:12px 16px;border-radius:8px;background:var(--sr-action);color:var(--sr-on-action);font-weight:600;text-decoration:none}
.skip-link:focus{top:12px;color:var(--sr-on-action)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Logo lockup: one image per theme. Driven by the page theme on <html>, not by nested data-theme sections. */
html[data-theme="dark"] .logo-light{display:none!important}
html:not([data-theme="dark"]) .logo-dark{display:none!important}

/* Theme toggle glyph (half-filled circle). */
.theme-glyph{width:12px;height:12px;border-radius:6px;border:1.5px solid var(--sr-text);background:linear-gradient(90deg,var(--sr-text) 50%,transparent 50%);flex:none}

/* Very small phones: theme toggle keeps its glyph and aria-label, drops the visible word. */
@media (max-width:359.98px){[data-theme-label]{display:none}}

/* Responsive show/hide at the shared 1024px breakpoint. Pages with other breakpoints define their own. */
@media (max-width:1023.98px){.wide-only{display:none!important}}
@media (min-width:1024px){.narrow-only{display:none!important}}

/* Interaction states. Prototype markup carries base styles inline, so state rules must win over inline
   declarations; !important is deliberate and confined to these hv-* / ac-* / fc-* helpers. */
.hv-primary:hover{background:var(--sr-action-hover)!important;color:var(--sr-on-action)!important}
.hv-primary:active,.ac-primary:active{background:var(--sr-action-active)!important}
.hv-subtle:hover{background:var(--sr-surface-subtle)!important}
.hv-subtle-text:hover{background:var(--sr-surface-subtle)!important;color:var(--sr-text)!important}
.hv-text:hover{color:var(--sr-text)!important}
.hv-action:hover{color:var(--sr-action)!important}
.hv-underline:hover{text-decoration:underline!important}
.hv-lift{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.hv-lift:hover{transform:translateY(-3px)}
.hv-lift-border:hover{transform:translateY(-3px);border-color:var(--sr-action)!important}
.hv-lift-shadow:hover{transform:translateY(-3px);border-color:var(--sr-action)!important;box-shadow:0 8px 24px -12px rgba(0,0,0,0.18)}
.hv-row:hover{background:var(--sr-surface-subtle)!important}
.fc-ring:focus{outline:2px solid var(--sr-focus)!important;outline-offset:2px}

/* Native select: custom arrow so it matches text inputs (prototype fix: no serif fallback, consistent chevron). */
select.sr-select{-webkit-appearance:none;appearance:none;padding-right:40px!important;background-image:linear-gradient(45deg,transparent 50%,var(--sr-text-secondary) 50%),linear-gradient(135deg,var(--sr-text-secondary) 50%,transparent 50%)!important;background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important}

/* Interest chips in lead forms (toggle buttons; state via aria-pressed / .is-on set by site.js). */
.chip{min-height:44px;padding:0 14px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;display:flex;align-items:center;gap:8px;border:1px solid var(--sr-border-control);background:transparent;color:var(--sr-text)}
.chip .chip-box{width:14px;height:14px;border-radius:3px;border:1.5px solid currentColor;background:transparent;flex:none}
.chip.is-on{border-color:var(--sr-action);background:var(--sr-selected-bg);color:var(--sr-selected-fg)}
.chip.is-on .chip-box{background:var(--sr-selected-fg)}

/* Invalid required field (aria-invalid is set by site.js after a submit attempt). */
[data-lead-form] [aria-invalid="true"]{border-color:var(--sr-error)!important}

/* Honeypot field for lead forms: off-screen for people, visible to naive bots. */
.hp-field{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}

@media (prefers-reduced-motion:reduce){html.smooth{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
@media print{[data-reveal]{opacity:1!important;translate:none!important}header{position:static!important}}