/* Approved 1672 x 941 composition; scale dimensions together on desktop. */
.reference-home{--r:calc(100vw / 1672);color:#0b1320}
.reference-home .container{width:calc(100% - 112 * var(--r));max-width:none}
.reference-header{height:calc(88 * var(--r));position:relative;background:linear-gradient(110deg,#1c272c,#181f23);box-shadow:none}
.reference-header .header-inner{height:100%;min-height:0;max-width:none;padding:0;display:block;position:relative}
.reference-logo{position:absolute;left:3.59%;top:50%;transform:translateY(-50%);font-size:calc(40 * var(--r));font-weight:900;letter-spacing:calc(-1 * var(--r));line-height:1.2;color:white;white-space:nowrap}
.reference-logo:hover{color:#fff}
.reference-tagline{position:absolute;left:16.55%;top:50%;transform:translateY(-50%);border-left:1px solid #849098;padding-left:calc(17 * var(--r));font-size:calc(16 * var(--r));line-height:calc(28 * var(--r));white-space:nowrap;color:#ffd34d;font-weight:800}
.reference-header .search-form{position:absolute;left:30.55%;top:calc(20 * var(--r));width:32.36%;max-width:none;min-width:0;min-height:0;height:calc(48 * var(--r));border:0;border-radius:calc(4 * var(--r));overflow:hidden}
.reference-header .search-form:before,.reference-home .hero-search:before{content:'';width:calc(18 * var(--r));height:calc(18 * var(--r));border:calc(1.7 * var(--r)) solid #354352;border-radius:50%;flex:none;align-self:center;margin-left:calc(19 * var(--r));margin-right:calc(2 * var(--r))}
.reference-header .search-form:after,.reference-home .hero-search:after{content:'';position:absolute;width:calc(8 * var(--r));height:calc(1.5 * var(--r));background:#354352;left:calc(33 * var(--r));top:57%;transform:rotate(48deg)}
.reference-header .search-form input{font-size:calc(18 * var(--r));padding:calc(10 * var(--r)) calc(15 * var(--r));letter-spacing:calc(1 * var(--r))}
.reference-header .search-form button{font-size:calc(20 * var(--r));min-width:calc(97 * var(--r));padding:0}
.reference-header .nav{position:absolute;left:65.67%;right:10.35%;top:50%;transform:translateY(-50%);margin:0;display:flex;gap:0;justify-content:space-between;font-size:calc(16 * var(--r));font-weight:600}
.reference-header .nav a{padding-block:calc(10 * var(--r));color:#fff}
.reference-header .nav a[aria-current]:after{height:calc(3 * var(--r));width:calc(31 * var(--r));bottom:calc(1 * var(--r))}
.reference-header .header-quote{position:absolute;right:1.45%;top:calc(23 * var(--r));width:7.42%;height:calc(44 * var(--r));padding:0;min-height:0;font-size:calc(18 * var(--r));border-radius:calc(4 * var(--r));gap:calc(8 * var(--r))}
.reference-header .header-quote svg{width:calc(24 * var(--r));height:calc(24 * var(--r))}
.reference-home .hero{height:calc(334 * var(--r));min-height:0;background-image:url('/assets/hero-reference.png');background-size:100% auto;background-position:center 65%;isolation:isolate}
.reference-home .hero:before{background:none}
.reference-home .hero-content{width:auto;margin:0;padding:calc(48 * var(--r)) 0 0 calc(100 * var(--r))}
.reference-home .hero h1{font-size:calc(56 * var(--r));line-height:1.35;letter-spacing:calc(1 * var(--r));font-weight:900;margin:0;max-width:none;color:#fff}
.reference-home .hero h1 span{display:inline;white-space:nowrap}
.reference-home .red-rule{height:calc(5 * var(--r));width:calc(63 * var(--r));margin:calc(7 * var(--r)) 0 calc(9 * var(--r));border-radius:calc(3 * var(--r))}
.reference-home .hero-subtitle{font-size:calc(31 * var(--r));line-height:1.5;font-weight:500;letter-spacing:calc(2 * var(--r))}
.reference-home .hero-search{position:relative;width:calc(623 * var(--r));max-width:none;height:calc(57 * var(--r));min-height:0;margin-top:calc(10 * var(--r));border-radius:calc(4 * var(--r));border:1px solid #d7dce0}
.reference-home .hero-search input{font-size:calc(21 * var(--r));padding:calc(12 * var(--r)) calc(17 * var(--r));letter-spacing:calc(1 * var(--r))}
.reference-home .hero-search button{font-size:calc(24 * var(--r));min-width:calc(128 * var(--r));padding:0}
.reference-home .hero-label{font-size:calc(15 * var(--r));line-height:1.5;padding:calc(2 * var(--r)) calc(9 * var(--r));border:calc(2 * var(--r)) solid #ee3028;border-radius:calc(3 * var(--r));background:#141f23de}
.reference-home .hero{overflow:hidden}
.reference-home .hero-annotations{position:absolute;left:0;top:65%;width:100%;aspect-ratio:2164 / 727;transform:translateY(-65%);pointer-events:none}
.reference-home .hero-leaders{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.reference-home .hero-label:before,.reference-home .hero-label:after{display:none}
.reference-home .hero-annotations .label-one{left:49.815%;top:33.7%;right:auto}
.reference-home .hero-annotations .label-two{left:77.5%;top:32.46%;right:auto}
.reference-home .hero-annotations .label-three{left:84.1%;top:53.65%;right:auto}
.reference-home .hero-annotations .label-four{left:78.8%;top:77.72%;right:auto}
@media(max-width:900px){.reference-home .hero-annotations{display:none}}
.reference-home .family-strip{width:100%;height:calc(180 * var(--r));padding:calc(13 * var(--r)) calc(26 * var(--r));gap:0;background:#fff}
.reference-home .family-card{height:calc(152 * var(--r));padding:calc(7 * var(--r)) calc(28 * var(--r));gap:calc(23 * var(--r));border-right:1px solid #e0e5e9;overflow:hidden;align-items:flex-start}
.reference-home .family-card:last-child{border:0}
.reference-home .family-card:first-child{padding-left:calc(30 * var(--r))}
.reference-home .family-number{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:calc(56 * var(--r));line-height:1;color:#c8cdd2;letter-spacing:calc(-2 * var(--r));font-weight:700}
.reference-home .family-card>div:not(.category-art){position:relative;z-index:1;width:calc(200 * var(--r));height:calc(139 * var(--r));border-left:calc(3 * var(--r)) solid var(--red);padding-left:calc(18 * var(--r));flex:none}
.reference-home .family-card h2{font-size:calc(24 * var(--r));font-weight:800;line-height:1.25}
.reference-home .family-card p{width:calc(158 * var(--r));margin-top:calc(10 * var(--r));font-size:calc(15 * var(--r));line-height:1.45;color:#505b69}
.reference-home .round-arrow{width:calc(31 * var(--r));height:calc(31 * var(--r));margin-top:calc(16 * var(--r));font-size:calc(22 * var(--r));border-width:1px}
.reference-home .category-art{position:absolute;z-index:2;right:calc(4 * var(--r));bottom:0;width:calc(145 * var(--r));height:calc(145 * var(--r));border:0;padding:0;background-image:url('/assets/category-reference.png');background-size:400% 100%;background-repeat:no-repeat;pointer-events:none}
.reference-home .category-art-0{background-position:0% center}
.reference-home .category-art-1{background-position:33.333333% center}
.reference-home .category-art-2{background-position:66.666667% center}
.reference-home .category-art-3{background-position:100% center}
.reference-home .brand-section{height:calc(236 * var(--r));padding:calc(22 * var(--r)) 0 calc(11 * var(--r));background:#edf1f5}
.reference-home .brand-section-top{height:calc(42 * var(--r));margin-bottom:calc(15 * var(--r));gap:calc(20 * var(--r))}
.reference-home .brand-section-top>div:first-child{gap:calc(23 * var(--r))}
.reference-home .brand-section h2,.reference-home .section-head h2{font-size:calc(34 * var(--r));font-weight:900;letter-spacing:0;padding-left:calc(22 * var(--r))}
.reference-home .brand-section h2:before,.reference-home .section-head h2:before{width:calc(6 * var(--r));top:calc(7 * var(--r));bottom:calc(7 * var(--r));border-radius:calc(2 * var(--r))}
.reference-home .brand-section-top p,.reference-home .section-head p{font-size:calc(16 * var(--r));color:#505c6b;white-space:nowrap}
.reference-home .brand-section-top .brand-tabs{margin-left:auto;gap:calc(12 * var(--r));flex-wrap:nowrap}
.reference-home .brand-tabs button{width:calc(88 * var(--r));min-height:0;height:calc(36 * var(--r));padding:0;font-size:calc(16 * var(--r));border-radius:calc(3 * var(--r))}
.reference-home .brand-section-top>.text-link{font-size:calc(16 * var(--r));font-weight:400;margin-left:auto;white-space:nowrap}
.reference-home .brand-grid{gap:calc(10 * var(--r)) calc(13 * var(--r))}
.reference-home .brand-tile{height:calc(68 * var(--r));min-height:0;padding:0 calc(35 * var(--r));border:1px solid #dde5ed;border-radius:calc(4 * var(--r));color:#071131}
.reference-home .brand-tile strong{font-size:calc(28 * var(--r));font-weight:800;line-height:1.3}
.reference-home .brand-tile span{right:calc(20 * var(--r));font-size:calc(26 * var(--r));color:#00113b}
.reference-home .home-products{padding:calc(8 * var(--r)) 0 calc(40 * var(--r))}
.reference-home .home-products .section-head{height:calc(36 * var(--r));margin-bottom:calc(9 * var(--r))}
.reference-home .section-head>div{gap:calc(24 * var(--r))}
.reference-home .home-products .product-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:calc(14 * var(--r))}
.reference-home .home-products .product-card:nth-child(6){display:none}
.reference-home .floating-quote{display:none}
@media(max-width:900px){
 .reference-home{--r:1px}.reference-home .container{width:calc(100% - 32px)}
 .reference-header{height:128px;position:relative}.reference-header .header-inner{padding:14px 16px;display:flex;flex-wrap:wrap;gap:12px;align-content:flex-start}
 .reference-logo{position:static;transform:none;font-size:27px;line-height:34px}.reference-tagline{display:none}
 .reference-header .menu-toggle{display:block;margin-left:auto;order:0;padding:8px;border:1px solid #52616a;border-radius:3px;font-size:12px}
 .reference-header .header-quote{position:static;width:auto;height:34px;font-size:13px;padding:7px 10px;order:1}.reference-header .header-quote svg{width:17px;height:17px}
 .reference-header .search-form{position:relative;left:auto;top:auto;width:100%;height:39px;order:2;flex:none}.reference-header .search-form input{font-size:14px}.reference-header .search-form button{font-size:15px;min-width:68px}
 .reference-header .nav{display:none;left:0;right:0;top:128px;transform:none;background:#202b31;padding:16px;z-index:51;font-size:14px;flex-wrap:wrap;gap:18px}.reference-header .nav.open{display:flex}
 .reference-home .hero{height:325px;background-size:auto 100%;background-position:65% center}.reference-home .hero:before{background:linear-gradient(90deg,#06101bd9,#06101b55)}
 .reference-home .hero-content{padding:30px 16px 0}.reference-home .hero h1{font-size:30px;line-height:1.45;letter-spacing:0}.reference-home .hero h1 span{display:block}.reference-home .hero-subtitle{font-size:18px;letter-spacing:0}.reference-home .red-rule{margin:10px 0;width:45px;height:4px}.reference-home .hero-search{width:100%;height:46px;margin-top:19px}.reference-home .hero-search input{font-size:14px;padding:10px}.reference-home .hero-search button{min-width:70px;font-size:17px}.reference-home .hero-label{display:none}
 .reference-home .family-strip{height:auto;grid-template-columns:repeat(2,minmax(0,1fr));padding:15px 8px;gap:18px 0}.reference-home .family-card,.reference-home .family-card:first-child{height:150px;padding:5px 8px;gap:8px}.reference-home .family-card:nth-child(2){border:0}.reference-home .family-number{font-size:30px}.reference-home .family-card>div:not(.category-art){width:130px;height:132px;padding-left:9px;border-left-width:2px}.reference-home .family-card h2{font-size:16px}.reference-home .family-card p{font-size:11px;width:105px;line-height:1.6;margin-top:8px}.reference-home .category-art{width:82px;height:82px;right:0;bottom:-4px}.reference-home .round-arrow{width:24px;height:24px;margin-top:11px;font-size:17px}
 .reference-home .brand-section{height:auto;padding:20px 0}.reference-home .brand-section-top{height:auto;flex-wrap:wrap;gap:12px;margin-bottom:14px}.reference-home .brand-section-top>div:first-child{gap:12px;flex-wrap:wrap}.reference-home .brand-section h2,.reference-home .section-head h2{font-size:25px;padding-left:16px}.reference-home .brand-section h2:before,.reference-home .section-head h2:before{width:4px;top:4px;bottom:4px}.reference-home .brand-section-top p,.reference-home .section-head p{font-size:11px}.reference-home .brand-section-top .brand-tabs{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;order:2}.reference-home .brand-tabs button{width:100%;height:32px;font-size:12px}.reference-home .brand-section-top>.text-link{font-size:11px}.reference-home .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.reference-home .brand-tile{height:55px;padding:0 23px}.reference-home .brand-tile strong{font-size:21px}.reference-home .brand-tile span{right:12px;font-size:21px}
 .reference-home .home-products{padding:22px 0}.reference-home .home-products .section-head{height:auto;margin-bottom:15px}.reference-home .home-products .section-head>div{display:block}.reference-home .home-products .section-head p{margin-top:6px}.reference-home .home-products .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.reference-home .home-products .product-card:nth-child(6){display:block}
}
.reference-home .family-card>div.category-art{width:calc(145 * var(--r));height:calc(145 * var(--r));padding:0;border:0;background-size:400% auto;z-index:2}
@media(max-width:900px){.reference-home .family-card>div.category-art{width:82px;height:82px}}
.reference-home .home-products .product-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
.reference-home .home-products .product-card:nth-child(6){display:block}
@media(max-width:900px){.reference-home .home-products .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.reference-home .brand-section{height:auto;min-height:calc(236 * var(--r))}
/* Public contacts directly below the homepage wordmark. */
.reference-header .header-brand-contact{position:absolute;left:3.59%;top:calc(9 * var(--r));display:flex;flex-direction:column;align-items:flex-start;gap:calc(9 * var(--r))}
.reference-header .header-brand-contact .reference-logo{position:static;transform:none;font-size:calc(34 * var(--r));line-height:1.25;letter-spacing:calc(-1 * var(--r))}
.header-public-contacts{display:flex;flex-direction:row;align-items:center;gap:calc(18 * var(--r));font-size:calc(20 * var(--r));line-height:1.35;color:#fff;font-variant-numeric:tabular-nums}
.header-public-contacts>div{display:flex;align-items:center;gap:calc(7 * var(--r));white-space:nowrap}
.header-public-contacts span{padding:calc(3 * var(--r)) calc(6 * var(--r));border-radius:calc(3 * var(--r));font-size:calc(16 * var(--r));color:#fff;background:#e72727;font-weight:800;line-height:1.25}
.header-public-contacts a,.header-public-contacts strong{color:#fff;font-weight:750;letter-spacing:0}
.header-public-contacts a:hover{color:#ff8e89}
@media(min-width:901px){
 .reference-header{height:calc(104 * var(--r))}
 .reference-header .reference-tagline{top:calc(31 * var(--r))}
 .reference-header .search-form{top:calc(28 * var(--r))}
 .reference-header .header-quote{top:calc(31 * var(--r))}
}
@media(max-width:900px){
 .reference-header{height:156px}
 .reference-header .header-inner{align-items:center;gap:12px}
 .reference-header .header-brand-contact{position:static;flex:0 0 100%;min-width:0;gap:12px}
 .reference-header .header-brand-contact .reference-logo{font-size:26px;line-height:1.3}
 .header-public-contacts{font-size:clamp(13px,4vw,18px);line-height:1.4;gap:clamp(8px,3vw,18px)}
 .header-public-contacts>div{gap:5px}
 .header-public-contacts span{font-size:clamp(12px,3.5vw,15px);padding:3px 4px;border-radius:3px}
 .reference-header .menu-toggle{position:absolute;right:111px;top:14px;margin-left:0;padding:7px;font-size:11px}
 .reference-header .header-quote{position:absolute;right:16px;top:14px;font-size:12px;padding:6px 8px;gap:5px}
 .reference-header .nav{top:156px}
 .reference-home .hero{height:325px}
}