/* Fluid page width with consistent gutters at the browser's normal zoom. */
:root{--page-gutter:clamp(20px,3vw,64px)}
.wrap{width:100%;max-width:none;margin-inline:auto;padding-inline:var(--page-gutter)}
body>.wrap{width:100%;max-width:none}
header{width:100%;max-width:none;margin-inline:auto;min-height:94px;height:auto;padding-block:18px;gap:clamp(14px,1.5vw,28px)}
header nav{flex:1;flex-wrap:wrap;justify-content:center;font-size:clamp(13px,.85vw,16px);gap:12px clamp(12px,1.3vw,25px);margin-inline-start:0}
header .wordmark{font-size:clamp(29px,2vw,36px)}
header .wordmark small{font-size:9px;letter-spacing:2.6px}
header>.button{font-size:13px;padding:15px 20px;max-width:none}
#language{font-size:13px;max-width:120px;padding:11px 9px}
.photo-credit{padding-inline:var(--page-gutter)}
.photo-credit details{max-width:none}
@media(min-width:1181px){
 .hero,.heroinner{min-height:clamp(560px,38vw,760px)}
 .herocopy{padding-block:clamp(70px,6vw,120px);width:58%}
 .herocopy h1{font-size:clamp(58px,4.4vw,88px);line-height:1.1}
 html:not([lang=en]) .herocopy h1{font-size:clamp(48px,3.6vw,72px)}
 .herocopy p{font-size:clamp(16px,1vw,20px);max-width:620px}
 .herocopy .button{font-size:15px;padding:19px 27px}
 .lookup-heading h2{font-size:clamp(30px,2.1vw,42px)}
 .lookup-heading>p{font-size:15px;max-width:460px}
 .lookup-panel{padding:34px clamp(28px,2.5vw,48px)}
 .lookup-panel h3{font-size:clamp(27px,1.8vw,36px)}
 .lookup-description{font-size:15px;min-height:48px}
 .lookup-number,.lookup .field label,.lookup .searchrow>span{font-size:12px}
 .lookup .field select,.lookup .searchbox input{font-size:15px;height:54px}
 .lookup .finder>.button,.lookup .searchrow>.button{font-size:15px;height:54px}
 .oe-hint{font-size:12px}
 .sectionhead h2,html:not([lang=en]) .sectionhead h2{font-size:clamp(32px,2.2vw,44px)}
 .sectionhead p{font-size:15px;max-width:410px}
 .eyebrow{font-size:12px}
 .brandvisual{height:clamp(240px,18vw,360px)}
 .brandbody strong{font-size:25px}.brandbody p,.brandbody .cardlink{font-size:13px}
 .rangecard{padding:30px}.rangecard h3,html:not([lang=en]) .rangecard h3{font-size:27px}.rangecard p{font-size:14px}
 .catalog-filters label{font-size:14px}.catalog-filters input,.catalog-filters select{font-size:15px;height:50px}
 .catalog-fit{font-size:14px}.product-photo{height:clamp(210px,15vw,300px)}
 .product-card small{font-size:11px}.product-card strong{font-size:20px}.product-card h3{font-size:15px}.product-card span{font-size:13px}
 .product-main-photo{height:clamp(400px,29vw,620px)}
 .product-specs dl{font-size:15px}.product-specs .button{font-size:15px}
 .contact h2{font-size:36px}.contact p{font-size:14px}
}
@media(min-width:701px) and (max-width:1180px){
 header{min-height:90px;padding-block:18px}
 header nav{order:5;flex-basis:100%;font-size:14px;gap:14px 24px}
 #language{margin-inline-start:auto}
}
@media(max-width:700px){
 header{min-height:76px;padding-block:14px;gap:12px}
 header .wordmark{font-size:26px}header .wordmark small{font-size:8px;letter-spacing:2px}
 header nav{flex:none;flex-basis:100%;display:none;font-size:13px;gap:0;justify-content:flex-start}
 header nav.nav-open{display:flex}
 #language{margin-inline-start:auto;font-size:12px;max-width:100px;padding:10px 6px}
 header>.button{display:none}
 #nav-toggle{font-size:12px;padding:10px}
}
@media(max-width:400px){header{gap:8px}header .wordmark{font-size:23px}#nav-toggle{font-size:11px;padding:9px 7px}#language{max-width:88px}}
