/* Media-Trek single hybrid visual system — stabilized 2026-09-28 */
:root{color-scheme:light;--site-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--header-ui-font:var(--site-font)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body, button, input, select, textarea{font-family:var(--site-font)}
body{font-size:16px;line-height:1.55;letter-spacing:.006em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1, h2, h3, h4, h5, h6{font-family:var(--site-font);font-weight:700;text-wrap:balance}
p, li{line-height:1.55}
button, input, select, textarea{font-size:1rem;letter-spacing:.006em}

/* One authoritative header system. */
.header{position:sticky;top:0;z-index:1000;background:rgba(10,15,19,.965)!important;border-bottom:1px solid #273038!important;box-shadow:0 8px 24px rgba(0,0,0,.12)!important;-webkit-backdrop-filter:blur(16px) saturate(1.08);backdrop-filter:blur(16px) saturate(1.08)}
.header .container{width:min(calc(100% - 36px),1480px)!important}
.header .brand{display:flex;align-items:center;flex:0 0 auto}
.header .brand img{display:block;width:100%;height:auto;filter:brightness(1.05) contrast(1.02)}
.header .nav-links a, .header .nav-trigger, .header .mobile-toggle{color:#f4f6f7!important}
.header .nav-links a, .header .nav-trigger{font-family:var(--site-font)!important;font-size:.9rem!important;font-weight:600!important;line-height:1.2!important;letter-spacing:.006em!important;text-decoration:none!important}
.header .nav-links>a, .header .nav-item>.nav-trigger{position:relative}
.header .nav-links>a:after{content:"";position:absolute;left:50%;right:50%;bottom:-5px;height:2px;background:#CD171F!important;border-radius:99px;transition:left .2s ease,right .2s ease}
.header .nav-links>a:hover:after, .header .nav-links>a:focus-visible:after{left:0;right:0}
.header .nav-item{position:relative!important}
.header .nav-caret{display:inline-block!important;width:7px!important;height:7px!important;flex:0 0 7px!important;border-right:1.5px solid #aeb6bc!important;border-bottom:1.5px solid #aeb6bc!important;font-size:0!important;line-height:0!important;color:transparent!important;transform:rotate(45deg)!important;transition:transform .2s ease,border-color .2s ease!important;margin:-3px 0 0 2px!important}
.header .nav-item:hover>.nav-trigger .nav-caret, .header .nav-item:focus-within>.nav-trigger .nav-caret, .header .nav-item.menu-open>.nav-trigger .nav-caret{border-color:#f14a51!important;transform:rotate(225deg)!important;margin-top:3px!important}

/* Premium header controls. */
.header .nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px!important;white-space:nowrap}
.header .nav-actions>span[aria-hidden="true"]{display:none!important}
.header .lang{display:inline-flex!important;align-items:center;justify-content:center;width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;padding:0!important;border:1px solid #35414a!important;border-radius:8px!important;background:#151c21!important;color:#bdc5cb!important;font:700 .76rem/1 var(--site-font)!important;letter-spacing:.041em!important;transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s ease!important}
.header .lang:hover{background:#1e272e!important;border-color:#4a5862!important;color:#fff!important;transform:translateY(-1px)}
.header .lang.active{background:rgba(205,23,31,.16)!important;border-color:rgba(238,65,74,.72)!important;color:#fff!important}
.header .nav-actions>.btn.btn-primary{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:auto!important;min-width:132px!important;height:42px!important;min-height:42px!important;padding:0 18px!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:9px!important;background:#CD171F!important;color:#fff!important;box-shadow:0 8px 20px rgba(205,23,31,.22)!important;font:700 .86rem/1 var(--site-font)!important;letter-spacing:.011em!important;white-space:nowrap!important;transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease!important}
.header .nav-actions>.btn.btn-primary:hover{background:#b9131b!important;box-shadow:0 11px 24px rgba(205,23,31,.28)!important;transform:translateY(-1px)!important}
.header .lang:focus-visible, .header .nav-trigger:focus-visible, .header .nav-links>a:focus-visible, .header .nav-actions>.btn:focus-visible, .header .mobile-toggle:focus-visible{outline:2px solid #ff5960!important;outline-offset:3px!important}

/* Desktop navigation and mega menus. */
@media (min-width:1180px){
  .header .nav{height:72px!important;display:grid!important;grid-template-columns:145px minmax(0,1fr) auto!important;align-items:center!important;gap:22px!important}
  .header .brand{width:145px!important;min-width:145px!important}
  .header .nav-links, .header .nav-links.open{display:flex!important;position:static!important;align-items:center!important;justify-content:center!important;gap:clamp(11px,1vw,19px)!important;max-height:none!important;overflow:visible!important;padding:0!important;background:transparent!important;box-shadow:none!important;white-space:nowrap!important}
  .header .nav-links>.nav-item{display:flex!important;width:auto!important;flex:0 0 auto!important}
  .header .nav-links>.nav-item>.nav-trigger, .header .nav-links>a{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;width:auto!important;min-height:42px!important;padding:0 2px!important}
  .header .mobile-toggle{display:none!important}
  .header .nav-actions{min-width:max-content!important}
  .header .nav-links>.nav-item.has-menu::after{content:"";position:absolute;top:100%;left:-8px;right:-8px;height:15px;background:transparent;pointer-events:auto}
  .header .mega-menu, .header .mega-menu.compact{position:absolute!important;display:block!important;top:calc(100% + 10px)!important;left:0!important;z-index:1200!important;width:min(470px,calc(100vw - 40px))!important;max-width:none!important;margin:0!important;padding:20px!important;border:1px solid #dfe3e6!important;border-radius:16px!important;background:#fff!important;color:#15191d!important;box-shadow:0 24px 64px rgba(4,10,14,.22)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(8px)!important;transition:opacity .18s ease,transform .18s ease,visibility .18s ease!important;white-space:normal!important}
  .header .mega-menu:before{content:""!important;display:block!important;position:absolute!important;left:0!important;right:0!important;top:-14px!important;height:14px!important;background:transparent!important}
  .header .nav-item:hover>.mega-menu, .header .nav-item:focus-within>.mega-menu, .header .nav-item.menu-open>.mega-menu{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)!important}
  .header .mega-menu-printing{width:min(860px,calc(100vw - 40px))!important}
  .header .nav-item[data-menu="apparel"]>.mega-menu{left:0!important;right:auto!important}
  .header .mega-head{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;margin:0 0 14px!important;padding:0 0 14px!important;border-bottom:1px solid #e8ebed!important}
  .header .mega-kicker{display:block!important;margin-bottom:4px!important;color:#CD171F!important;font-size:.67rem!important;font-weight:800!important;letter-spacing:.126em!important;text-transform:uppercase!important}
  .header .mega-title{color:#121619!important;font-size:1.15rem!important;font-weight:700!important;line-height:1.15!important;letter-spacing:-.009em!important}
  .header .simple-print-products{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px 10px!important;align-content:start!important}
  .header .compact-products{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px 10px!important}
  .header .menu-product{display:flex!important;align-items:center!important;min-height:40px!important;padding:9px 10px!important;border-radius:8px!important;color:#20262b!important;background:transparent!important;font-size:.86rem!important;font-weight:600!important;line-height:1.25!important;transition:background-color .16s ease,color .16s ease!important}
  .header .menu-product:hover, .header .menu-product:focus-visible{background:#f3f5f6!important;color:#CD171F!important;outline:none!important}
}
@media (min-width:1180px) and (max-width:1329px){
  .header .nav{grid-template-columns:122px minmax(0,1fr) auto!important;gap:14px!important}
  .header .brand{width:122px!important;min-width:122px!important}
  .header .nav-links{gap:9px!important}
  .header .nav-links a, .header .nav-trigger{font-size:.8rem!important}
  .header .nav-actions>.btn.btn-primary{min-width:118px!important;padding:0 13px!important;font-size:.79rem!important}
  .header .lang{width:32px!important;min-width:32px!important;height:34px!important;min-height:34px!important;font-size:.7rem!important}
  .header .mega-menu-printing{width:min(760px,calc(100vw - 30px))!important}
  .header .simple-print-products{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* Tablet / small laptop: use the fully functional drill-down menu instead of dead desktop dropdown labels. */
@media (max-width:1179px){
  .header .container{width:min(calc(100% - 28px),1180px)!important}
  .header .nav{height:68px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important}
  .header .brand{width:132px!important;min-width:132px!important}
  .header .nav-links, .header .nav-links.open{display:none!important}
  .header .nav-actions{margin-left:auto!important;gap:8px!important}
  .header .nav-actions>.lang, .header .nav-actions>span[aria-hidden="true"]{display:none!important}
  .header .nav-actions>.btn.btn-primary{display:inline-flex!important;min-width:122px!important;height:40px!important;min-height:40px!important;padding:0 14px!important;font-size:.8rem!important}
  .header .mobile-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:42px!important;min-width:42px!important;height:42px!important;min-height:42px!important;padding:0!important;border:1px solid #35414a!important;border-radius:9px!important;background:#151c21!important;color:#fff!important;box-shadow:none!important}
  .header .mobile-toggle:hover{background:#1e272e!important;border-color:#4a5862!important}
  .mobile-nav-panel{background:#fff!important;color:#15191d!important;border-color:#e3e6e8!important;box-shadow:0 24px 60px rgba(4,10,14,.18)!important}
  .mobile-nav-screen{background:#fff!important;color:#15191d!important}
  .mobile-menu-top, .mobile-menu-row, .mobile-product-link, .mobile-setting-line{border-color:#e6e8ea!important}
  .mobile-menu-back, .mobile-menu-row, .mobile-product-link{color:#171b1f!important}
  .mobile-menu-row, .mobile-product-link{font-size:.98rem!important;font-weight:600!important}
  .mobile-menu-row:hover, .mobile-menu-row:focus-visible, .mobile-product-link:hover, .mobile-product-link:focus-visible{color:#CD171F!important}
  .mobile-lang-controls .lang{display:inline-flex!important;background:#f4f6f7!important;border-color:#dce1e4!important;color:#525b62!important}
  .mobile-lang-controls .lang.active{background:rgba(205,23,31,.08)!important;border-color:rgba(205,23,31,.45)!important;color:#b9131b!important}
}
@media (max-width:680px){
  .header .container{width:min(calc(100% - 22px),1180px)!important}
  .header .nav{height:64px!important}
  .header .brand{width:118px!important;min-width:118px!important}
  .header .nav-actions>.btn.btn-primary{display:none!important}
}

/* Unified typography scale for non-home templates. */
.category-hero h1{font-size:clamp(3rem,5.4vw,4.9rem)!important;line-height:1.01!important;letter-spacing:-.029em!important;max-width:920px!important}
.family-hero h1{font-size:clamp(3rem,5.2vw,4.8rem)!important;line-height:1.02!important;letter-spacing:-.024em!important;max-width:900px!important}
.product-hero h1{font-size:clamp(2.85rem,4.9vw,4.45rem)!important;line-height:1.04!important;letter-spacing:-.019em!important;max-width:920px!important}
.contact-hero h1{font-size:clamp(3rem,5vw,4.65rem)!important;line-height:1.01!important;letter-spacing:-.034em!important}
.launch-hero h1{font-size:clamp(2.85rem,4.7vw,4.35rem)!important;line-height:1.02!important;letter-spacing:-.029em!important}
.category-hero .lead, .family-hero .lead, .product-hero .lead, .contact-hero .lead, .launch-hero .lead{font-size:clamp(1rem,1.2vw,1.16rem)!important;line-height:1.58!important}
.category-hero .eyebrow, .family-hero .eyebrow, .product-hero .eyebrow, .contact-hero .eyebrow, .launch-hero .eyebrow{font-size:.73rem!important;line-height:1.3!important;letter-spacing:.126em!important}
main h2{letter-spacing:-.019em}
main h3{letter-spacing:-.009em}
.btn{font-family:var(--site-font);font-weight:700}

@media (max-width:760px){
  .category-hero h1, .family-hero h1{font-size:clamp(2.6rem,12vw,3.15rem)!important;line-height:1.04!important;letter-spacing:-.024em!important}
  .product-hero h1{font-size:clamp(2.45rem,11vw,3rem)!important;line-height:1.06!important;letter-spacing:-.014em!important}
  .contact-hero h1, .launch-hero h1{font-size:clamp(2.5rem,11vw,3.05rem)!important;line-height:1.04!important;letter-spacing:-.024em!important}
  .category-hero .lead, .family-hero .lead, .product-hero .lead, .contact-hero .lead, .launch-hero .lead{font-size:1rem!important;line-height:1.55!important}
}

/* Final header cascade guards: intentionally last. */
.header .nav-links>.nav-item>.nav-trigger, .header .nav-links>a{font-size:.9rem!important;font-weight:600!important;letter-spacing:.006em!important}
.header .nav-caret{position:relative!important;width:20px!important;height:20px!important;flex:0 0 20px!important;border:0!important;transform:none!important;margin:0 -3px 0 0!important}
.header .nav-caret::after{content:"";position:absolute;left:6px;top:5px;width:7px;height:7px;border-right:1.5px solid #aeb6bc;border-bottom:1.5px solid #aeb6bc;transform:rotate(45deg);transition:transform .2s ease,border-color .2s ease}
.header .nav-item:hover>.nav-trigger .nav-caret, .header .nav-item:focus-within>.nav-trigger .nav-caret, .header .nav-item.menu-open>.nav-trigger .nav-caret{transform:none!important;margin:0 -3px 0 0!important}
.header .nav-item:hover>.nav-trigger .nav-caret::after, .header .nav-item:focus-within>.nav-trigger .nav-caret::after, .header .nav-item.menu-open>.nav-trigger .nav-caret::after{top:8px;border-color:#f14a51;transform:rotate(225deg)}
@media (min-width:1180px) and (max-width:1329px){
  .header .nav-links>.nav-item>.nav-trigger, .header .nav-links>a{font-size:.8rem!important}
}
@media (max-width:1179px){
  body.mobile-menu-open{overflow:hidden!important}
  .header~.mobile-nav-panel, .mobile-nav-panel{display:block!important;position:fixed!important;left:0!important;right:0!important;top:var(--mobile-nav-top,68px)!important;bottom:0!important;z-index:990!important;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease!important}
  .header~.mobile-nav-panel.open, .mobile-nav-panel.open{display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
}
/* Mega-menu link text must stay dark inside the light dropdown surface. */
@media (min-width:1180px){
  .header .nav-links .mega-menu a.menu-product{color:#20262b!important;text-decoration:none!important}
  .header .nav-links .mega-menu a.menu-product:hover, .header .nav-links .mega-menu a.menu-product:focus-visible{color:#CD171F!important;background:#f3f5f6!important}
}
.header .nav-actions{width:auto!important;min-width:0!important;flex:0 0 auto!important}
@media (max-width:1179px){
  .mobile-lang-controls{display:flex!important;align-items:center!important;gap:6px!important}
  .mobile-lang-controls>span[aria-hidden="true"]{display:none!important}
  .mobile-lang-controls .lang{width:40px!important;min-width:40px!important;height:36px!important;min-height:36px!important;padding:0!important;border:1px solid #dce1e4!important;border-radius:8px!important;background:#f4f6f7!important;color:#525b62!important;font-size:.75rem!important;font-weight:700!important;line-height:1!important}
  .mobile-lang-controls .lang.active{background:rgba(205,23,31,.08)!important;border-color:rgba(205,23,31,.45)!important;color:#b9131b!important}
}

/* Audit finishing polish — header controls + mobile directory filters */
.header .lang{
  background:rgba(255,255,255,.035)!important;
  border-color:rgba(255,255,255,.14)!important;
  color:#cbd1d5!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.header .lang:hover{
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(255,255,255,.24)!important;
  color:#fff!important;
}
.header .lang.active{
  background:#f6f7f8!important;
  border-color:#f6f7f8!important;
  color:#11171b!important;
  box-shadow:0 4px 14px rgba(0,0,0,.16)!important;
}
.header .nav-actions>.btn.btn-primary{
  border-color:rgba(255,255,255,.10)!important;
  background:linear-gradient(180deg,#df2029 0%,#c8131c 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 8px 20px rgba(205,23,31,.20)!important;
}
.header .nav-actions>.btn.btn-primary:hover{
  background:linear-gradient(180deg,#e82a33 0%,#bd1018 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 12px 26px rgba(205,23,31,.27)!important;
}
@media (max-width:640px){
  .directory-filters{
    overflow:visible!important;
    flex-wrap:wrap!important;
    padding-bottom:0!important;
    gap:8px!important;
  }
  .directory-filter{
    white-space:normal!important;
    min-height:40px!important;
    padding:8px 12px!important;
    line-height:1.2!important;
  }
}

/* MOBILE LANGUAGE SWITCH REFINEMENT — 2026-09-29
   Treat EN/FR as one compact segmented control instead of two unrelated boxes. */
@media (max-width:1179px){
  .mobile-lang-controls{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    align-items:center!important;
    gap:0!important;
    width:94px!important;
    height:40px!important;
    padding:3px!important;
    border:1px solid #dce1e4!important;
    border-radius:999px!important;
    background:#eef1f3!important;
    box-shadow:inset 0 1px 2px rgba(12,18,22,.04)!important;
  }
  .mobile-lang-controls>span[aria-hidden="true"]{display:none!important}
  .mobile-lang-controls .lang{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    height:32px!important;
    min-height:32px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#697178!important;
    box-shadow:none!important;
    font-size:.74rem!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:.041em!important;
    transition:background .18s ease,color .18s ease,box-shadow .18s ease!important;
  }
  .mobile-lang-controls .lang:hover, .mobile-lang-controls .lang:focus-visible{
    color:#252b30!important;
  }
  .mobile-lang-controls .lang.active{
    background:#fff!important;
    color:#CD171F!important;
    box-shadow:0 1px 4px rgba(12,18,22,.13)!important;
  }
  
  
  
  
}

/* Premium header typography refinement (2026-09-29)
   One consistent, lighter navigation voice across desktop, mega menus and mobile. */
.header{
  --header-ui-font:var(--site-font);
}
.header .nav-links a, .header .nav-trigger, .header .lang, .header .mobile-toggle, .mobile-nav-panel .mobile-menu-row, .mobile-nav-panel .mobile-product-link, .mobile-nav-panel .mobile-menu-back, .mobile-nav-panel .mobile-view-all, .mobile-nav-panel .mobile-setting-label, .header .mega-menu, .header .mega-menu button, .header .mega-menu a{
  font-family:var(--header-ui-font)!important;
}
.header .nav-links>a, .header .nav-links>.nav-item>.nav-trigger{
  font-weight:500!important;
  letter-spacing:.018em!important;
}
.header .mega-title{
  font-family:var(--header-ui-font)!important;
  font-weight:600!important;
  letter-spacing:-.004em!important;
}
.header .mega-kicker{
  font-family:var(--header-ui-font)!important;
  font-weight:600!important;
  letter-spacing:.136em!important;
}
.header .mega-tab, .header .menu-product, .header .mega-menu a.menu-product{
  font-family:var(--header-ui-font)!important;
  font-weight:400!important;
  letter-spacing:.009em!important;
}
.header .mega-tab.active{
  font-weight:600!important;
}
.header .lang, .header .mobile-toggle{
  font-family:var(--header-ui-font)!important;
  font-weight:500!important;
}
.header .lang.active{
  font-weight:600!important;
}
@media (max-width:820px){
  .mobile-nav-panel .mobile-menu-row, .mobile-nav-panel .mobile-product-link, .mobile-nav-panel .mobile-menu-back{
    font-family:var(--header-ui-font)!important;
    font-weight:500!important;
    letter-spacing:.011em!important;
  }
  .mobile-nav-panel .mobile-menu-row.current{
    font-weight:600!important;
  }
}


/* PREMIUM HEADER SPACING + MOBILE TYPOGRAPHY LOCK — 2026-09-29
   Preserve the approved premium font, open desktop navigation spacing slightly,
   and make the drill-down mobile/tablet menu use the exact same type system. */
:root{
  --header-ui-font:var(--site-font);
}
.header, .mobile-nav-panel{
  --header-ui-font:var(--site-font);
}
@media (min-width:1330px){
  .header .nav-links, .header .nav-links.open{
    gap:clamp(22px,1.65vw,28px)!important;
  }
  .header .nav-links>.nav-item>.nav-trigger, .header .nav-links>a{
    padding-inline:3px!important;
  }
}
@media (min-width:1180px) and (max-width:1329px){
  .header .nav-links, .header .nav-links.open{
    gap:12px!important;
  }
}
@media (max-width:1179px){
  .mobile-nav-panel, .mobile-nav-panel button, .mobile-nav-panel a, .mobile-nav-panel .mobile-menu-row, .mobile-nav-panel .mobile-product-link, .mobile-nav-panel .mobile-menu-back, .mobile-nav-panel .mobile-view-all, .mobile-nav-panel .mobile-setting-label, .mobile-nav-panel .lang{
    font-family:var(--header-ui-font)!important;
  }
  .mobile-nav-panel .mobile-menu-row, .mobile-nav-panel .mobile-menu-back, .mobile-nav-panel .mobile-view-all{
    font-weight:500!important;
    letter-spacing:.014em!important;
  }
  .mobile-nav-panel .mobile-product-link{
    font-weight:400!important;
    letter-spacing:.009em!important;
  }
  .mobile-nav-panel .mobile-menu-row.current, .mobile-nav-panel .mobile-menu-row[aria-current="page"]{
    font-weight:600!important;
  }
  .mobile-nav-panel .mobile-setting-label{
    font-weight:500!important;
    letter-spacing:.011em!important;
  }
}

/* ============================================================
   PREMIUM INTERNAL HERO SYSTEM — 2026-09-30
   Shared dark intro treatment for category, family and contact pages.
   ============================================================ */
.category-hero,
.family-hero,
.contact-hero{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  color:#fff!important;
  background:
    radial-gradient(circle at 80% -35%,rgba(229,27,36,.15),transparent 38%),
    radial-gradient(circle at 15% 120%,rgba(255,255,255,.035),transparent 34%),
    linear-gradient(135deg,#080c0f 0%,#0c1216 56%,#090d10 100%)!important;
  border-bottom:1px solid #252e34!important;
}
.category-hero:after,
.family-hero:after,
.contact-hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:120px 100%;
  opacity:.18;
  pointer-events:none;
}
.category-hero{padding:88px 0 82px!important}
.family-hero{padding:82px 0 76px!important}
.contact-hero{padding:88px 0 78px!important}
.category-hero-inner,
.family-hero-inner,
.contact-hero-inner{
  margin-inline:auto!important;
  text-align:center!important;
}
.category-hero .eyebrow,
.family-hero .eyebrow,
.contact-hero .eyebrow{
  justify-content:center!important;
  color:#ef3039!important;
}
.category-hero h1,
.family-hero h1,
.contact-hero h1{
  color:#fff!important;
  text-shadow:0 2px 20px rgba(0,0,0,.18)!important;
}
.category-hero .lead,
.family-hero .lead,
.contact-hero p{
  color:#c3cbd1!important;
}
.family-hero .breadcrumb{
  color:#7f8b93!important;
}
.family-hero .breadcrumb a{
  color:#b7c0c6!important;
}
.family-hero .breadcrumb a:hover,
.family-hero .breadcrumb a:focus-visible{
  color:#fff!important;
}
.family-hero .breadcrumb-sep{color:#606b73!important;opacity:1!important}
.category-hero .category-meta{
  color:#9eabb3!important;
}
.category-hero .category-meta span+span:before{
  background:#e51b24!important;
}
.contact-hero-inner{max-width:850px!important}
.contact-hero h1{max-width:820px!important;margin:14px auto 20px!important}
.contact-hero p{max-width:650px!important;margin:0 auto!important;font-size:clamp(1rem,1.2vw,1.16rem)!important;line-height:1.58!important}

@media (max-width:760px){
  .category-hero{padding:62px 0 58px!important}
  .family-hero{padding:58px 0 54px!important}
  .contact-hero{padding:62px 0 56px!important}
  .category-hero:after,.family-hero:after,.contact-hero:after{background-size:72px 100%}
}

/* Keep internal black hero surfaces clean and consistent with the homepage. */
.category-hero:after,.family-hero:after,.contact-hero:after{display:none!important}


/* MOBILE NAVIGATION RHYTHM + INTERNAL SUBTITLE CONSISTENCY — 2026-09-30
   One symmetrical horizontal gutter for every mobile menu level, including
   category rows, submenu rows, arrows and language controls. */
@media (max-width:1179px){
  .mobile-nav-panel{--mobile-menu-gutter:28px;}
  .mobile-nav-panel .mobile-nav-screen{
    padding-left:0!important;
    padding-right:0!important;
  }
  .mobile-nav-panel .mobile-main-list,
  .mobile-nav-panel .mobile-menu-list,
  .mobile-nav-panel .mobile-menu-settings{
    width:100%!important;
    box-sizing:border-box!important;
  }
  .mobile-nav-panel .mobile-menu-row,
  .mobile-nav-panel .mobile-product-link{
    padding-left:var(--mobile-menu-gutter)!important;
    padding-right:var(--mobile-menu-gutter)!important;
    box-sizing:border-box!important;
  }
  .mobile-nav-panel .mobile-menu-row .mobile-row-arrow{
    margin-right:0!important;
    flex:0 0 9px!important;
  }
  .mobile-nav-panel .mobile-setting-line{
    padding-left:var(--mobile-menu-gutter)!important;
    padding-right:var(--mobile-menu-gutter)!important;
    box-sizing:border-box!important;
  }
  .mobile-nav-panel .mobile-menu-top{
    grid-template-columns:minmax(72px,1fr) auto minmax(72px,1fr)!important;
    padding-left:var(--mobile-menu-gutter)!important;
    padding-right:var(--mobile-menu-gutter)!important;
    box-sizing:border-box!important;
  }
  .mobile-nav-panel .mobile-menu-back{justify-self:start!important;}
  .mobile-nav-panel .mobile-view-all{justify-self:end!important;text-align:right!important;}
  .mobile-nav-panel .mobile-menu-top h2{justify-self:center!important;text-align:center!important;}
}
@media (max-width:380px){
  .mobile-nav-panel{--mobile-menu-gutter:24px;}
}

/* Keep supporting copy a consistent distance below internal-page hero titles. */
.category-hero h1,
.family-hero h1,
.product-hero h1,
.contact-hero h1,
.launch-hero h1{margin-bottom:10px!important;}
.category-hero .lead,
.family-hero .lead,
.product-hero .lead,
.contact-hero .lead,
.launch-hero .lead{margin-top:0!important;}


/* ============================================================
   GLOBAL SQUARE-CORNER SYSTEM — 2026-09-30
   Media-Trek now uses a crisp square visual language throughout the site.
   True circular indicators (process numbers, status dots, separators) remain circular.
   ============================================================ */
:root{--radius:0px!important;}

button,
input,
select,
textarea,
.btn,
.skip-link,
.catalog-link,
.float-quote,
.nav-links,
.history-block,
.step,
.service-card-arrow,
.product-lightbox img,
.promo-book-page-left,
.promo-book-page-right,
.promo-book-turn,
[class*="-card"],
[class*="card-"],
[class*="-panel"],
[class*="panel-"],
[class*="-wrap"],
[class*="wrap-"],
[class*="-menu"],
[class*="menu-"],
[class*="-toggle"],
[class*="toggle-"],
[class*="-photo"],
[class*="photo-"],
[class*="-media"],
[class*="media-"],
[class*="-table"],
[class*="table-"],
[class*="-option"],
[class*="option-"],
[class*="-filter"],
[class*="filter-"],
[class*="-tag"],
[class*="tag-"],
[class*="-slot"],
[class*="slot-"],
[class*="-shell"],
[class*="shell-"],
[class*="-controls"],
[class*="controls-"]{
  border-radius:0!important;
}

/* File-upload button follows the same square button system. */
.quote-form input[type="file"]::file-selector-button{border-radius:0!important;}

/* Keep hamburger strokes crisp rather than pill-ended. */
.mobile-toggle .hamburger span{border-radius:0!important;}

/* Square keyboard-focus treatment so focus states match the visual system. */
.nav-trigger:focus-visible,
.mega-tab:focus-visible,
.menu-product:focus-visible,
.nav-links>a:focus-visible,
.footer-col a:focus-visible,
.catalog-link:focus-visible{border-radius:0!important;}


/* ABSOLUTE SQUARE-CORNER LOCK — 2026-09-30
   This deliberately carries two non-matching ID selectors so it outranks
   legacy class/ID-level !important radius declarations throughout the site.
   Every rectangular surface/control is square. Only tiny status dots and the
   numbered process badges remain genuinely circular. */
html body:not(#__mt_square_lock_a):not(#__mt_square_lock_b) *{
  border-radius:0!important;
}
html body:not(#__mt_square_lock_a):not(#__mt_square_lock_b) *::before,
html body:not(#__mt_square_lock_a):not(#__mt_square_lock_b) *::after{
  border-radius:0!important;
}
html body:not(#__mt_square_lock_a):not(#__mt_square_lock_b) .process .step-num,
html body:not(#__mt_square_lock_a):not(#__mt_square_lock_b) .proof-dot,
html body:not(#__mt_square_lock_a):not(#__mt_square_lock_b) .category-meta span+span::before,
html body:not(#__mt_square_lock_a):not(#__mt_square_lock_b) .promo-catalogue-language-note::before{
  border-radius:50%!important;
}

/* HAMBURGER / FLOATING QUOTE RULE — 2026-10-01
   Whenever the compact hamburger header is active, the header quote CTA is
   removed and the floating quote CTA is the single quote action on screen. */
@media (max-width:820px){
  .nav-actions>.btn,
  .nav-actions>a.btn{
    display:none!important;
  }

  .float-quote{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    min-height:44px!important;
    height:44px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
    vertical-align:middle!important;
  }
  .float-quote.visible{
    display:inline-flex!important;
  }
}

/* HAMBURGER / FLOATING QUOTE AUTHORITATIVE RULE — 2026-10-01
   The global hamburger breakpoint is 1179px. Whenever the hamburger is visible,
   the header quote CTA is removed and the floating CTA is the sole quote action. */
@media (max-width:1179px){
  .header .nav-actions>.btn.btn-primary,
  .header .nav-actions>a.btn.btn-primary{
    display:none!important;
  }
  .header .mobile-toggle{
    display:inline-flex!important;
  }
  .float-quote{
    display:grid!important;
    place-items:center!important;
    box-sizing:border-box!important;
    height:48px!important;
    min-height:48px!important;
    padding:0 20px!important;
    line-height:1!important;
    text-align:center!important;
    white-space:nowrap!important;
    vertical-align:middle!important;
  }
  .float-quote.visible{
    display:grid!important;
    place-items:center!important;
  }
}
@media (min-width:1180px){
  .float-quote,
  .float-quote.visible{
    display:none!important;
  }
}
@media (max-width:430px){
  .float-quote{
    height:48px!important;
    min-height:48px!important;
    padding:0 16px!important;
  }
}
/* Shared legal-link treatment moved from quote-flow.css so form assets can remain contact-only. */
.footer-bottom .footer-privacy{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;white-space:nowrap}