/* Sticky footer shell + base document layout (pairs with index.html chrome)
   ─────────────────────────────────────────────────────────────────────────
   PREMIUM WHITE THEME (2026-07) — this file is the design-token home.
   Every page on the site links this stylesheet first, so the palette,
   typefaces and elevation system live here as custom properties.
   Type: Bricolage Grotesque (display) + Plus Jakarta Sans (text) — the same
   pairing as the SwitcherMate portal, self-hosted from /assets/fonts. */

/* ——— Typefaces (self-hosted, latin subset, swap) ——— */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/bricolage-600.woff2') format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/bricolage-700.woff2') format('woff2')}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:800;font-display:swap;src:url('../assets/fonts/bricolage-800.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/jakarta-400.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/jakarta-500.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/jakarta-600.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/jakarta-700.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url('../assets/fonts/jakarta-800.woff2') format('woff2')}

/* ——— Design tokens ——— */
:root{
  /* grounds + surfaces */
  --sm-ground:#f7f9fb;          /* page ground — faint cool wash */
  --sm-paper:#ffffff;           /* cards, header, panels */
  --sm-fill:#eef2f8;            /* recessed fills (tab tracks, chips) */
  --sm-fill-2:#e8eef6;          /* slightly deeper fill / hover */
  /* ink scale */
  --sm-ink:#0e1c30;             /* headings, primary text */
  --sm-body:#31435c;            /* body copy */
  --sm-muted:#5b6b80;           /* secondary text */
  --sm-faint:#8a97a8;           /* captions, separators */
  /* hairlines */
  --sm-line:#e6ebf2;
  --sm-line-2:#d9e1eb;
  /* brand accents */
  --sm-accent-blue:#2e7dd2;     /* brand blue — fills, CTAs */
  --sm-blue-ink:#1e5fa8;        /* blue for text/links on white (AA) */
  --sm-blue-soft:#ecf3fb;       /* blue tint fill */
  --sm-accent-green-fill:#4caf50; /* brand green — decorative fills/lines */
  --sm-green-ink:#178a43;       /* green for text on white (AA) */
  --sm-green-soft:#e9f6ee;      /* green tint fill */
  /* elevation (navy-tinted, soft) */
  --sm-shadow-sm:0 1px 1px rgba(14,28,48,.03);
  --sm-shadow-md:0 1px 2px rgba(14,28,48,.04),0 6px 16px -10px rgba(14,28,48,.08);
  --sm-shadow-lg:0 1px 2px rgba(14,28,48,.04),0 12px 32px -16px rgba(14,28,48,.10);
  /* type */
  --sm-font-display:'Bricolage Grotesque',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --sm-font-body:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
}

input, textarea, select { font-size: 16px !important; }

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
html {
  background-color: var(--sm-ground) !important;
  overscroll-behavior: none;
}
body {
  background-color: var(--sm-ground) !important;
  overscroll-behavior: none;
}
    body { font-family: var(--sm-font-body); font-size: 14px; line-height: 1.65; color: var(--sm-ink) !important; position: relative; z-index: 0; background: transparent; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
    /* Signature dot grid — kept from the original identity, tuned to a whisper on white */
    body::after { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(46,125,210,0.10) 1px, transparent 1px); background-size: 50px 50px; animation: moveGrid 20s linear infinite; z-index: -1; }
    @keyframes moveGrid { 0% { transform: translate(0, 0); } 100% { transform: translate(50px, 50px); } }
    /* Disable the sitewide background grid animation for users who prefer reduced motion (WCAG 2.3.3 Animation from Interactions / 2.2.2 Pause, Stop, Hide) */
    @media (prefers-reduced-motion: reduce) {
      body::after { animation: none; }
    }

/* Display type for the headline hierarchy, site-wide */
h1, h2, h3 { font-family: var(--sm-font-display); letter-spacing: -0.02em; }

::selection { background: rgba(46,125,210,.18); }

/* B2B shell: column flex so footer sits at bottom when content is short */
body {
  display: flex;
  flex-direction: column;
  min-height: 100dvh;
}

a,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
body.menu-open{overflow:hidden;position:fixed;width:100%}

.site-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* ——— Skip-to-content link (WCAG 2.4.1 Bypass Blocks) ———
   Styles the skip link injected into the HTML. Visually hidden off-screen
   until it receives keyboard focus, then slides into view at top-left. */
.skip-link {
  position: fixed;
  top: -120px;
  left: 8px;
  z-index: 10000;
  padding: 10px 18px;
  background: var(--sm-accent-blue);
  color: #ffffff !important;
  font-weight: 600;
  font-size: 0.9375rem;
  line-height: 1.2;
  text-decoration: none;
  border-radius: 8px;
  box-shadow: var(--sm-shadow-md);
  transition: top 0.15s ease-in-out;
}
.skip-link:focus,
.skip-link:focus-visible {
  top: 8px;
  outline: 3px solid var(--sm-ink);
  outline-offset: 2px;
}

/* ——— Global visible keyboard focus indicator (WCAG 2.4.7 Focus Visible) ———
   Applies to any focusable element that does not define its own focus ring.
   Elements with bespoke focus styling (search inputs, newsletter field, cards)
   set their own indicator at higher specificity and are unaffected. */
:focus-visible {
  outline: 2px solid var(--sm-accent-blue);
  outline-offset: 2px;
}