/* ===== Global craft polish (high-end tokens) ===== */
:root{
  --font-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-display:"Space Grotesk","Inter",system-ui,sans-serif;
  --ease-smooth:cubic-bezier(.22,1,.36,1);
  --ease-spring:cubic-bezier(.34,1.4,.64,1);
}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:88px}
::selection{background:rgba(245,158,11,.22);color:#0f172a}
[data-theme="dark"] ::selection{color:#fff}

/* premium type touches on shared chrome */
.logo{font-family:var(--font-display);letter-spacing:-.02em}
.nav-link{letter-spacing:-.005em}

/* sticky header glass on scroll (main.js adds .nav-scrolled) */
#site-header{transition:background .3s var(--ease-smooth),border-color .3s ease,box-shadow .3s ease}
#site-header.nav-scrolled{
  background:rgba(255,255,255,.72)!important;
  backdrop-filter:saturate(180%) blur(16px);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid rgba(15,23,42,.07)!important;
  box-shadow:0 1px 24px -12px rgba(15,23,42,.20);
}
[data-theme="dark"] #site-header.nav-scrolled{
  background:rgba(15,23,42,.72)!important;
  border-bottom-color:rgba(255,255,255,.08)!important;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,::before,::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

/* Lock to premium light theme: hide dark/light toggle */
button[aria-label="Toggle theme"]{display:none!important}

/* Neutralize legacy page-enter fade (mp-motion handles entrances now;
   page-enter could leave #main-content stuck at opacity:0 on slow pages) */
#main-content,#main-content.page-enter{opacity:1!important;animation:none!important;transform:none!important}

/* Site-wide utility / announcement bar */
.mp-topbar{background:#0b1424;color:#cbd5e1;font-size:12.5px;border-bottom:1px solid rgba(255,255,255,.06)}
.mp-topbar-in{max-width:1280px;margin:0 auto;padding:8px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.mp-tb-l{display:inline-flex;align-items:center;gap:6px;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-tb-l b{color:#fbbf24;font-weight:600}
.mp-tb-l svg{color:#16a34a;flex-shrink:0}
.mp-tb-r a{color:#fbbf24;font-weight:600;text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}
.mp-tb-r a:hover{color:#fff}
[data-theme="dark"] .mp-topbar{background:#060b14}
@media(max-width:720px){.mp-tb-hide{display:none}.mp-topbar-in{padding:7px 16px;font-size:11.5px}}
@media(max-width:480px){.mp-tb-r{display:none}}

/* ============================================================
   MOBILE SAFETY LAYER (site-wide responsive hardening)
   ============================================================ */
/* Kill horizontal scroll from decorative orbs / wide absolute blocks.
   `clip` (not hidden) does NOT create a scroll container, so position:sticky
   on the header keeps working. */
html,body{overflow-x:clip;max-width:100%}
*,*::before,*::after{box-sizing:border-box}
/* Media never overflows its column */
img,video{max-width:100%;height:auto}
/* Long unbreakable strings (URLs, part numbers) wrap instead of pushing width */
.mh-sub,p,li,dd,figcaption,blockquote{overflow-wrap:break-word}

/* Prevent iOS Safari auto-zoom when focusing inputs (<16px triggers zoom). */
@media(max-width:600px){
  input,select,textarea{font-size:16px!important}
}

/* Tighter, safe gutters on phones so nothing kisses the edge */
@media(max-width:560px){
  .mp-topbar-in{padding:7px 14px}
}

/* Back-to-top + mobile RFQ bar must clear the iOS home indicator */
@media(max-width:768px){
  .back-to-top{bottom:calc(16px + env(safe-area-inset-bottom,0px));right:16px}
}

/* ============================================================
   PREMIUM ELEVATION v2 — site-wide high-end polish
   (craft.css loads before style.css, so chrome overrides use
   !important, which beats normal rules regardless of order)
   ============================================================ */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-optical-sizing:auto}

/* Refined, restrained scrollbar */
*{scrollbar-width:thin;scrollbar-color:#cdd4de transparent}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#d4dae3;border-radius:10px;border:3px solid #fff;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#b45309;background-clip:padding-box}

/* Premium keyboard focus ring (does not show on mouse click) */
:focus-visible{outline:2px solid #d97706;outline-offset:2px;border-radius:5px}
a:focus-visible,button:focus-visible,[role="button"]:focus-visible{outline-offset:3px}
:focus:not(:focus-visible){outline:none}

/* Header: always-on hairline depth + slightly crisper glass */
#site-header{box-shadow:0 1px 0 rgba(15,23,42,.05),0 8px 24px -22px rgba(15,23,42,.28)}
[data-theme="light"] .nav-glass{background:rgba(255,255,255,.86)!important;border-bottom:1px solid rgba(15,23,42,.06)!important}

/* Announcement topbar: deep navy gradient + thin gold hairline = expensive feel */
.mp-topbar{background:linear-gradient(180deg,#0c1627,#0a1220)!important;border-bottom:1px solid rgba(245,158,11,.18)!important;box-shadow:inset 0 -1px 0 rgba(255,255,255,.025)}
.mp-tb-l b{text-shadow:0 0 18px rgba(251,191,36,.25)}

/* Footer links: refined animated underline */
.footer-link{position:relative;transition:color .2s ease}
.footer-link::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:0;background:var(--accent,#d97706);transition:width .28s var(--ease-smooth)}
.footer-link:hover::after{width:100%}

/* Primary buttons: deeper, softer amber elevation + spring press */
.btn-primary{box-shadow:0 1px 2px rgba(180,83,9,.25),0 10px 24px -8px rgba(245,158,11,.5)!important;transition:transform .18s var(--ease-spring),box-shadow .22s ease,background .2s ease!important}
.btn-primary:hover{transform:translateY(-1px)}
.btn-primary:active{transform:translateY(0);transition-duration:.08s!important}

/* Refined hairline rule */
hr{border:none;height:1px;background:linear-gradient(90deg,transparent,rgba(15,23,42,.1),transparent)}

/* Back-to-top: premium soft shadow + spring */
.back-to-top{box-shadow:0 4px 12px -2px rgba(180,83,9,.4),0 12px 32px -8px rgba(15,23,42,.35)!important}

/* ============================================================
   MOBILE POLISH v3 — comfortable tap targets + breathing room
   (verified against a real 375px viewport)
   ============================================================ */
@media(max-width:768px){
  /* Header CTA + dealer link: comfortable ≥42px tap target */
  #site-header .btn,.nav-glass .btn{min-height:42px;padding-top:0;padding-bottom:0;align-items:center}
  /* Header icon buttons (theme / hamburger): ≥40px square */
  #mobile-menu-btn,button[aria-label="Menu"],#site-header button[aria-label*="theme" i]{min-width:42px;min-height:42px;display:inline-flex;align-items:center;justify-content:center}
  /* Footer links: bigger tap area, easier thumbs */
  .footer-link{display:inline-block;padding:5px 0;line-height:1.4}
  .footer-link::after{bottom:3px}
  /* Mobile nav links: generous, app-like rows */
  .mobile-nav-link{padding:13px 14px!important;font-size:15.5px}
  /* Scroll-hint affordance for wide tables inside scroll wrappers */
  .mh-cmp-wrap,.sh-table-wrap,.cp-table-wrap,.dd-table-scroll{-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  /* Slightly larger base for legal/doc body so it reads well on phones */
  .lg-doc p,.lg-doc li{font-size:15.5px}
  /* No hover on touch: reveal card tap-affordances by default so linked
     industry/home cards read as clickable on phones */
  .mh-ind-go,.in-go{opacity:1!important;transform:none!important}
  /* Mobile slide-out menu CTAs (Request Quote / Dealer Login): comfortable size */
  #mobile-menu .btn{min-height:46px;padding-top:0;padding-bottom:0;display:flex;align-items:center;justify-content:center}
}
