:root {
  --navy: #071a3d;
  --blue: #0878f9;
  --blue-dark: #0063dc;
  --green: #10a84a;
  --green-dark: #087a3e;
  --ink: #14233b;
  --muted: #58677e;
  --line: #dfe7f1;
  --soft: #f5f8fc;
  --paper: #ffffff;
  --shadow: 0 12px 36px rgba(7, 26, 61, 0.1);
  --container: min(1180px, calc(100% - 40px));
  color-scheme: light;
  scroll-behavior: smooth;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  font-synthesis: none;
}

*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: hidden; background: var(--paper); }
body { min-width: 320px; margin: 0; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: Inter, "Segoe UI", Arial, sans-serif; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
img, picture, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
h1, h2, h3, h4, p { overflow-wrap: anywhere; }
h1, h2, h3, h4 { color: var(--navy); font-family: Inter, "Segoe UI", Arial, sans-serif; font-weight: 800; }
.container { width: var(--container); margin-inline: auto; }
main { min-width: 0; }
.section-head { margin-bottom: 30px; }
.section-head h2 { max-width: 760px; margin: 4px 0 0; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.08; letter-spacing: -0.04em; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 8px; color: var(--blue); font-size: 0.74rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.eyebrow::before { width: 22px; height: 2px; background: currentColor; content: ""; }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 12px; padding: 11px 20px; border: 1px solid var(--blue); border-radius: 7px; background: var(--blue); color: #fff; font-size: 0.86rem; font-weight: 780; line-height: 1.2; text-decoration: none; transform: translateZ(0); transition: transform .22s ease, background .18s ease, border-color .18s ease, box-shadow .22s ease; }
.button:hover { border-color: var(--blue-dark); background: var(--blue-dark); box-shadow: 0 10px 24px rgba(8,120,249,.25); transform: translateY(-2px); }
.button:active { box-shadow: 0 4px 12px rgba(8,120,249,.2); transform: translateY(0) scale(.98); }
.button > span[aria-hidden="true"] { transition: transform .22s ease; }
.button:hover > span[aria-hidden="true"] { transform: translateX(4px); }
.button--outline { border-color: #b9d1ec; background: #fff; color: var(--blue-dark); }
.button--outline:hover { background: #eff6ff; color: var(--navy); }
a:focus-visible, button:focus-visible { outline: 3px solid var(--navy); outline-offset: 3px; }
.anchor-target { position: relative; top: -90px; }

/* Progressive enhancement: elements stay visible when JavaScript is unavailable. */
.has-reveal-motion .scroll-reveal { opacity: 0; transform: translateY(28px); transition: opacity .62s ease, transform .62s cubic-bezier(.22,1,.36,1); transition-delay: var(--reveal-delay, 0ms); will-change: opacity, transform; }
.has-reveal-motion .scroll-reveal.is-visible { opacity: 1; transform: translateY(0); will-change: auto; }
.has-reveal-motion .scroll-reveal[data-reveal="scale"] { transform: translateY(18px) scale(.975); }
.has-reveal-motion .scroll-reveal[data-reveal="scale"].is-visible { transform: translateY(0) scale(1); }

.product-filters button,.hero__actions a,.nav-toggle { transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease; }
.product-filters button:hover,.hero__actions a:hover { box-shadow: 0 10px 24px rgba(7,26,61,.12); transform: translateY(-2px); }
.product-filters button:active,.hero__actions a:active,.nav-toggle:active { transform: scale(.97); }

@media (max-width: 680px) {
  :root { --container: min(100% - 32px, 1180px); }
  body { font-size: 16px; padding-bottom: 68px; }
  .section-head { margin-bottom: 22px; }
  .section-head h2 { font-size: clamp(1.85rem, 9vw, 2.5rem); }
}

@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
  .has-reveal-motion .scroll-reveal,.has-reveal-motion .scroll-reveal[data-reveal="scale"] { opacity: 1 !important; transform: none !important; }
  .button:hover,.button:active,.product-filters button:hover,.product-filters button:active,.hero__actions a:hover,.hero__actions a:active,.nav-toggle:active { box-shadow: none; transform: none; }
  .button:hover > span[aria-hidden="true"] { transform: none; }
}

.skip-link{position:fixed;z-index:1000;top:12px;left:12px;padding:10px 16px;background:#fff;box-shadow:var(--shadow);transform:translateY(-200%)}.skip-link:focus{transform:none}
.site-header{position:sticky;z-index:100;top:0;border-bottom:1px solid #e8eef5;background:rgba(255,255,255,.97);backdrop-filter:blur(12px)}
.site-header__inner{display:flex;min-height:72px;align-items:center;gap:24px}.site-logo{display:block;flex:0 0 auto}.site-logo img{width:128px;height:auto}
.main-nav{display:flex;align-items:center;gap:4px;margin-left:auto}.main-nav__item{position:relative}.main-nav__item>a{display:flex;min-height:44px;align-items:center;gap:5px;padding:10px 9px;color:#17243a;font-size:.78rem;font-weight:650;text-decoration:none}.main-nav__item>a:hover,.main-nav__item>a:focus-visible{color:var(--blue)}
.main-nav__submenu{position:absolute;top:100%;left:0;display:none;min-width:190px;padding:8px;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:var(--shadow)}.main-nav__submenu a{display:block;padding:9px 12px;border-radius:6px;font-size:.8rem;text-decoration:none}.main-nav__submenu a:hover{background:var(--soft);color:var(--blue)}.main-nav__item:hover .main-nav__submenu,.main-nav__item:focus-within .main-nav__submenu{display:block}
.header-actions{display:flex;align-items:center;gap:14px}.header-phone{display:flex;align-items:center;gap:8px;text-decoration:none}.header-phone svg{width:21px;fill:none;stroke:var(--blue);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.header-phone strong,.header-phone small{display:block}.header-phone strong{color:var(--blue);font-size:.78rem;line-height:1.25}.header-phone small{color:#718096;font-size:.56rem;text-align:center}.header-cta{min-height:42px;padding-inline:15px;font-size:.72rem}.nav-toggle{display:none;width:46px;height:46px;padding:11px;border:0;background:transparent}.nav-toggle span{display:block;height:2px;margin:5px 0;background:var(--navy);transition:transform .2s ease,opacity .2s ease}
.site-footer{padding:54px 0 18px;background:#071a2f;color:#c7d3df}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:42px}.footer-brand img{width:150px;height:auto;filter:brightness(0) invert(1)}.footer-brand p{max-width:310px;margin:14px 0 0;font-size:.82rem;line-height:1.55}.footer-brand p:first-of-type{color:#fff;font-weight:700}.site-footer h2{margin:0 0 15px;color:#fff;font-size:.9rem}.site-footer nav,.site-footer address{display:grid;gap:9px;font-style:normal}.site-footer nav a,.site-footer address a,.site-footer address span,.site-footer address strong{color:#c7d3df;font-size:.78rem;line-height:1.5;text-decoration:none}.site-footer address strong{color:#fff}.site-footer a:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:42px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);font-size:.68rem}
@media(max-width:1050px){.main-nav{gap:0}.main-nav__item>a{padding-inline:6px}.header-phone{display:none}}
@media(max-width:820px){.site-header__inner{min-height:68px}.header-actions{margin-left:auto}.header-cta{display:none}.nav-toggle{display:block}.main-nav{position:absolute;top:68px;right:0;left:0;display:none;padding:10px 20px 18px;border-bottom:1px solid var(--line);background:#fff;box-shadow:var(--shadow)}.site-header.is-open .main-nav{display:block}.main-nav__item>a{min-height:48px;justify-content:space-between}.main-nav__submenu{position:static;display:block;margin:0 0 4px 14px;border:0;box-shadow:none}.nav-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.site-logo img{width:122px}.footer-grid{grid-template-columns:1fr}.footer-bottom{align-items:flex-start;flex-direction:column}.site-footer{padding-bottom:84px}}