@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--blue:#0078bd;--navy:#122d43;--green:#a4d62e;--muted:#627786;--line:#e0e8ec}*{box-sizing:border-box}body{margin:0;color:var(--navy);font-family:'DM Sans',Arial,sans-serif;background:#fff}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid var(--green);outline-offset:4px}.topbar{padding:11px 6%;background:var(--navy);color:#fff;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.4px}header{padding:17px 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:white;gap:25px}.logo{width:192px;display:block}nav{display:flex;align-items:center;gap:32px;font-size:14px}nav a:hover{color:var(--blue)}.button{display:inline-flex;gap:28px;align-items:center;justify-content:center;background:var(--blue);color:white;border:0;border-radius:7px;padding:17px 23px;font-weight:600;font-size:14px}.button:hover{background:#005f99;color:white}.button.small{padding:13px 20px}.button.light{background:white;color:var(--navy);border:1px solid var(--line)}.eyebrow{text-transform:uppercase;letter-spacing:2.4px;font-size:11px;font-weight:800;color:var(--blue);display:flex;align-items:center;gap:10px}.eyebrow:before{content:'';width:7px;height:7px;border-radius:50%;background:var(--green)}h1,h2,h3{font-family:Manrope,Arial,sans-serif}h1{font-size:clamp(40px,4.7vw,68px);line-height:1.09;letter-spacing:-2.8px;margin:23px 0}h1 em{font-style:normal;color:var(--blue)}h2{font-size:36px;letter-spacing:-1.3px;line-height:1.2;margin:15px 0}h3{font-size:21px;letter-spacing:-.5px}p{line-height:1.75;color:var(--muted)}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:45px;align-items:center;padding:65px 6% 55px;overflow:hidden}.hero-copy>p{max-width:490px;font-size:16px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.hero-note{font-size:12px;margin-top:28px;color:var(--muted)}.hero-note b{color:#79a817;padding-right:7px}.hero-visual{min-height:460px;position:relative;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse,#e2f4fa 0%,#f5fbfe 49%,#fff 71%);border-radius:50%}.hero-visual:before,.hero-visual:after{content:'';position:absolute;border:1px solid #d6eaf1;border-radius:50%;width:380px;height:380px}.hero-visual:after{width:300px;height:300px}.hero-visual>img{position:relative;z-index:1;width:66%;height:370px;object-fit:contain;filter:drop-shadow(12px 24px 14px #123b4920)}.float{position:absolute;z-index:2;background:white;border:1px solid var(--line);border-radius:10px;padding:14px 19px;box-shadow:0 12px 30px #173c5110;font-size:12px}.float strong{display:block;font-size:15px;margin-bottom:4px}.float.one{left:0;top:42px}.float.two{bottom:36px;right:0}.float small{color:var(--muted)}.green-dot{color:#88b820}.partner-bar{margin:0 6%;padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:30px}.partner-bar>span{max-width:180px;color:var(--muted);font-size:13px;line-height:1.6}.brand{display:flex;align-items:center;gap:22px}.brand img{max-width:170px;max-height:48px;object-fit:contain}.brand .haffmans{font-size:13px;letter-spacing:2px;color:#40596b}.brand.at img{width:106px}.partner-bar .tag{font-size:11px;color:var(--muted)}section.section{padding:65px 6%}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:30px}.text-link{color:var(--blue);font-size:14px;font-weight:700}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.category-card{border:1px solid var(--line);padding:26px;border-radius:12px;transition:.2s}.category-card:hover{transform:translateY(-5px);border-color:#8acde4;box-shadow:0 15px 30px #123b4909}.category-icon{font-size:26px;color:var(--blue);width:50px;height:50px;background:#eff8fc;display:grid;place-items:center;border-radius:12px}.category-card h3{font-size:18px;margin:24px 0 10px}.category-card p{font-size:13px}.category-card>span:last-child{color:var(--blue);font-size:22px}.pale{background:#f5f9fb}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:35px}.service-grid article{border-top:2px solid #d6e7ef;padding-top:20px}.service-grid small{color:var(--blue);font-weight:700}.cta{margin:20px 6% 70px;padding:42px;background:var(--navy);border-radius:14px;display:flex;align-items:center;justify-content:space-between;gap:25px;color:white}.cta h2{margin-top:0;font-size:30px}.cta p{margin-bottom:0;color:#c1d2de}.cta .button{background:var(--green);color:var(--navy);white-space:nowrap}footer{padding:45px 6% 20px;border-top:1px solid var(--line);display:grid;grid-template-columns:1.5fr 1fr 1.3fr;gap:30px;font-size:13px}footer img{width:160px}footer strong{display:block;margin:10px 0 20px}footer a,footer div>span{display:block;margin:12px 0;color:var(--muted)}.copyright{grid-column:1/-1;border-top:1px solid var(--line);display:flex;justify-content:space-between;padding-top:17px;color:var(--muted);font-size:11px}.copyright span{display:inline;margin:0}.page-intro{padding:50px 6% 35px;background:linear-gradient(120deg,#f3faff,#fff)}.page-intro h1{font-size:45px}.page-intro p{max-width:650px}.catalog-layout{display:grid;grid-template-columns:240px 1fr;gap:36px;padding:35px 6% 65px}.brand-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.brand-tabs button,.chip{border:1px solid var(--line);background:#fff;padding:12px 18px;border-radius:6px;color:var(--navy)}.brand-tabs button.active{background:var(--navy);color:#fff}.sidebar h3{font-size:14px;margin:25px 0 16px}.sidebar button{display:flex;justify-content:space-between;text-align:left;gap:7px;width:100%;border:0;background:none;color:var(--muted);font-size:12px;padding:12px;border-radius:5px;line-height:1.4}.sidebar button.active{background:#eaf6fc;color:var(--blue);font-weight:700}.sidebar button:hover{background:#f2f7f9}.sidebar button span{font-size:10px}.sidebar select{width:100%;padding:12px;border:1px solid var(--line);border-radius:6px;background:white}.search{width:100%;padding:15px 18px;border:1px solid var(--line);border-radius:7px}.results-header{display:flex;justify-content:space-between;align-items:center;margin:20px 0;font-size:12px;color:var(--muted)}.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.product-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;text-align:left;background:white;color:var(--navy);padding:0;transition:.2s}.product-card:hover{border-color:#6cb5d8;box-shadow:0 10px 25px #0e456b10;transform:translateY(-3px)}.product-card .image-wrap{height:190px;padding:22px;background:#fff;display:grid;place-items:center}.product-card img{width:100%;height:145px;object-fit:contain}.product-card .product-info{padding:19px;border-top:1px solid #f0f3f5}.product-card small{color:var(--blue);text-transform:uppercase;font-size:9px;letter-spacing:1px}.product-card h3{font-size:17px;margin:9px 0}.product-card p{font-size:12px;line-height:1.6;min-height:39px;margin:0}.product-card .card-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:17px;font-size:10px;color:var(--muted)}.card-bottom b{font-size:19px;color:var(--blue)}.empty{grid-column:1/-1;padding:45px;background:#f5f9fb;border-radius:10px}.pagination{display:flex;justify-content:center;gap:15px;align-items:center;margin-top:30px;font-size:13px}.pagination button{border:1px solid var(--line);padding:10px 17px;border-radius:5px;background:#fff}.pagination button:disabled{opacity:.4;cursor:default}dialog{max-width:850px;width:92%;border:0;border-radius:15px;padding:45px;box-shadow:0 25px 100px #122d4340}dialog::backdrop{background:#0b233c88;backdrop-filter:blur(3px)}.close{position:absolute;right:17px;top:10px;background:none;border:0;font-size:30px;color:var(--muted)}.detail-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:30px;align-items:center}.detail-grid img{width:100%;height:300px;object-fit:contain}.detail-grid h2{font-size:30px}.detail-grid p{font-size:14px}.note{font-size:12px!important;border-left:3px solid var(--green);padding-left:13px}.contact-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:70px}.contact-layout a{color:var(--blue)}form{padding:30px;border:1px solid var(--line);border-radius:12px}label{display:block;font-size:12px;font-weight:700;margin-bottom:17px}input,textarea{display:block;width:100%;margin-top:8px;padding:12px;border:1px solid var(--line);border-radius:5px}textarea{min-height:125px;resize:vertical}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}.about-copy{max-width:800px;font-size:18px}.mobile-label{display:none}@media(min-width:1500px){main,header,footer,.topbar{padding-left:max(6%,calc((100vw - 1400px)/2));padding-right:max(6%,calc((100vw - 1400px)/2))}}@media(max-width:1000px){nav{gap:18px}.hero{gap:20px}.hero-visual{min-height:380px}.hero-visual:before{width:310px;height:310px}.float.one{left:-10px}.category-grid{grid-template-columns:repeat(2,1fr)}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-layout{grid-template-columns:200px 1fr;gap:20px}.partner-bar .tag{display:none}}@media(max-width:700px){header{flex-direction:column;padding:15px 5%;gap:15px}.logo{width:165px}nav{width:100%;gap:15px;justify-content:center;font-size:12px}nav .button{padding:9px 12px;gap:8px}nav a:nth-child(4){display:none}.topbar{font-size:10px;padding:9px 5%}.hero{grid-template-columns:1fr;padding:38px 6% 25px;gap:10px}h1{font-size:44px;letter-spacing:-2px}.hero-copy>p{font-size:14px}.hero-visual{min-height:350px}.hero-visual>img{height:300px}.float.one{left:0;top:20px}.float.two{bottom:15px}.partner-bar{flex-wrap:wrap;gap:20px}.partner-bar>span{max-width:100%;width:100%}.brand{gap:12px}.brand img{width:130px}.brand.at img{width:85px}.brand .haffmans{font-size:10px}.section-head{align-items:start;flex-direction:column;gap:10px}h2{font-size:29px}section.section{padding:40px 6%}.category-card{padding:18px}.category-card h3{font-size:16px}.service-grid{grid-template-columns:1fr;gap:15px}.cta{padding:27px;flex-direction:column;align-items:start;margin-bottom:40px}footer{grid-template-columns:1fr 1fr}footer>div:first-child{grid-column:1/-1}.copyright{gap:15px}.page-intro{padding-top:35px}.page-intro h1{font-size:36px}.catalog-layout{grid-template-columns:1fr;padding-top:20px}.sidebar .categories{display:flex;gap:5px;overflow:auto;padding-bottom:8px}.sidebar button{min-width:140px;width:auto;border:1px solid var(--line)}.sidebar h3{margin:12px 0}.sidebar select{max-width:100%}.product-grid{gap:10px}.product-card .image-wrap{height:155px;padding:14px}.product-card img{height:125px}.product-card .product-info{padding:13px}.product-card h3{font-size:15px}.contact-layout,.detail-grid{grid-template-columns:1fr;gap:20px}dialog{padding:28px}.detail-grid img{height:180px}.two-col{grid-template-columns:1fr;gap:0}.contact-layout form{padding:20px}}
/* October refresh: enlarged brand, illustrated banners and soft brand colours. */
header>a{order:2;flex-shrink:0}header>nav{order:1}.logo{width:384px}header{background:linear-gradient(115deg,#f4fbff,#fff 62%,#f6faed)}
.hero{background:linear-gradient(120deg,#fff 35%,#f0faff 75%,#f6faeb)}
.page-intro{background:linear-gradient(120deg,#edf8fe 0%,#f7fcf3 100%)}
.illustrated-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:45px;min-height:355px;padding-top:42px;padding-bottom:42px}
.illustrated-intro h1{font-size:clamp(34px,3.4vw,49px)}.intro-copy{min-width:0}.intro-copy p{max-width:570px}
.brand-symbol{position:relative;width:min(100%,390px);aspect-ratio:610/420;overflow:hidden;justify-self:center;mix-blend-mode:multiply}.brand-symbol img{position:absolute;width:321%;max-width:none;height:auto;left:-201.6%;top:0}
.about-brand{padding:15px;mix-blend-mode:multiply}.about-brand img{width:100%;height:auto;display:block}
.product-collage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:450px;width:100%;justify-self:end;transform:rotate(-3deg);padding:10px}.collage-tile{background:#ffffffed;border:1px solid #dcebef;border-radius:15px;padding:12px;box-shadow:0 12px 30px #23485a0b;display:flex;align-items:center;flex-direction:column}.collage-tile img{width:100%;height:110px;object-fit:contain}.collage-tile span{font-size:11px;font-weight:700;color:#4a6875;margin-top:8px}.tile-1,.tile-2{background:#f9fced}.tile-0,.tile-3{background:#f8fcff}.collage-tile img{mix-blend-mode:multiply}
.pale{background:linear-gradient(110deg,#eff8fc,#f6fae9)}.category-card{background:linear-gradient(150deg,#fff,#f3faff)}.category-card:nth-child(even){background:linear-gradient(150deg,#fff,#f6faeb)}.catalog-layout{background:linear-gradient(125deg,#f8fcfe,#fff 65%,#fbfdf5)}footer{background:#f4f9fc}.contact-layout{background:linear-gradient(120deg,#f4faff,#fff)}form{background:white}.product-card{background:#fff}.sidebar button.active{background:#e5f3fc}.service-grid article:nth-child(2){border-color:#bed97c}
@media(max-width:1100px){header{gap:20px}nav{gap:16px}.logo{width:330px}nav .button.small{padding:12px}.illustrated-intro{gap:22px}.product-collage{gap:9px}.collage-tile img{height:95px}}
@media(max-width:850px){header{flex-direction:column}header>a{order:0}header>nav{order:1;width:100%;justify-content:center}.logo{width:384px;max-width:85vw}.illustrated-intro{grid-template-columns:1fr 1fr}.brand-symbol{width:100%}.product-collage{padding:0}.collage-tile img{height:85px}}
@media(max-width:600px){.logo{width:330px;max-width:88vw}header>nav{gap:12px;font-size:12px}.illustrated-intro{grid-template-columns:1fr;gap:25px;padding-top:30px;padding-bottom:30px}.brand-symbol{width:260px}.about-brand{max-width:370px;justify-self:center}.product-collage{max-width:360px;justify-self:center;transform:rotate(-2deg)}.collage-tile img{height:100px}.illustrated-intro h1{font-size:36px}.brand-tabs{gap:6px}.brand-tabs button{font-size:12px;padding:11px}.products-intro .intro-copy{order:0}.product-collage{order:1}}
.brand-symbol{clip-path:polygon(0 0,100% 0,100% 100%,30% 100%,30% 55%,0 55%)}
.catalog-layout>*,.sidebar{min-width:0}.sidebar .categories{max-width:100%}.logo{mix-blend-mode:multiply}

/* Eight original transparent product photographs, without frames. */
.products-intro .product-collage{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 16px;max-width:540px;padding:0;transform:none;background:transparent}
.products-intro .collage-tile{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;justify-content:center;min-width:0}
.products-intro .collage-tile img{width:100%;height:135px;object-fit:contain;mix-blend-mode:normal;filter:none}
@media(max-width:1100px){.products-intro .collage-tile img{height:110px}.products-intro .product-collage{gap:18px 12px}}
@media(max-width:600px){.products-intro .product-collage{max-width:400px;gap:18px 10px}.products-intro .collage-tile img{height:105px}}

/* Selected product cutouts; all changes are scoped to the collage. */
.product-cutout{display:block;width:100%;max-width:135px;aspect-ratio:1;background-image:url('assets/selected-product-cutouts.png');background-size:200% 200%;background-repeat:no-repeat}
.cutout-0{background-position:0 0}.cutout-1{background-position:100% 0}.cutout-2{background-position:0 100%}.cutout-3{background-position:100% 100%}
/* Match the transparent cutout sheet bounds without clipping the instruments. */
.cutout-0,.cutout-1{background-size:200% 185.5%}
.cutout-2{background-size:191.6% 218%}
.cutout-3{background-size:209.8% 218%}
/* Transparent logo assets preserve their colours over the page gradients. */
.logo,.about-brand,.brand-symbol{mix-blend-mode:normal}
.brand-symbol{aspect-ratio:676/425}.brand-symbol img{width:289.35%;left:-189.35%}
