:root{--blue:#1558d6;--blue-dark:#0d3a94;--blue-soft:#e8f0fe;--ink:#0f1b2d;--ink-2:#44546a;--line:#e3e0d9;--paper:#fbf9f5;--card:#fff;--oak:#b07a3c;--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--r:14px;--max:1200px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{font:17px/1.6 var(--sans);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;margin:0}img{max-width:100%;display:block}a{color:var(--blue)}h1,h2,h3{font-family:var(--serif);letter-spacing:-.01em;margin:0 0 .5em;font-weight:600;line-height:1.12}h1{font-size:clamp(2.2rem,5vw,3.9rem)}h2{font-size:clamp(1.7rem,3.2vw,2.5rem)}h3{font-size:1.25rem}.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}.skip{z-index:100;background:#fff;padding:8px 12px;position:absolute;top:8px;left:-999px}.skip:focus{left:8px}:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}.site-header{z-index:50;backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:#fbf9f5f0;position:sticky;top:0}.site-header .wrap{align-items:center;gap:28px;height:76px;display:flex}.logo img{width:auto;height:38px}.nav{gap:6px;margin-left:auto;display:flex}.nav a{color:var(--ink);border-radius:999px;padding:10px 14px;font-size:.97rem;font-weight:500;text-decoration:none}.nav a:hover,.nav a[aria-current]{background:var(--blue-soft);color:var(--blue-dark)}.call{background:var(--blue);color:#fff;white-space:nowrap;border-radius:999px;align-items:center;gap:8px;padding:11px 18px;font-weight:600;text-decoration:none;display:inline-flex}.call:hover{background:var(--blue-dark)}.menu-btn{border:1px solid var(--line);font:inherit;color:var(--ink);background:0 0;border-radius:10px;margin-left:auto;padding:9px 13px;display:none}@media (width<=900px){.menu-btn{display:block}.nav{background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;margin:0;padding:12px 24px 20px;display:none;position:absolute;top:76px;left:0;right:0}.nav.open{display:flex}.call .num{display:none}.site-header .wrap{gap:12px}.call{margin-left:auto}.menu-btn{margin-left:0}}.btn{cursor:pointer;border:2px solid #0000;border-radius:999px;align-items:center;gap:8px;padding:14px 24px;font-family:inherit;font-size:1rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--blue);color:#fff}.btn-primary:hover{background:var(--blue-dark)}.btn-light{color:var(--ink);background:#fff}.btn-light:hover{background:var(--blue-soft)}.btn-ghost{color:#fff;border-color:#ffffffb3}.btn-ghost:hover{background:#ffffff24}.btn-outline{border-color:var(--ink);color:var(--ink)}.btn-outline:hover{background:var(--ink);color:#fff}.hero{color:#fff;background:#12301f;align-items:end;min-height:min(86vh,760px);display:grid;position:relative;overflow:hidden}.hero picture,.hero img.bg{object-fit:cover;object-position:62% 55%;width:100%;height:100%;position:absolute;inset:0}.hero:after{content:"";background:linear-gradient(90deg,#081428b3 0%,#0814285c 40%,#08142800 66%),linear-gradient(#08142800 62%,#0814288c);position:absolute;inset:0}.hero .wrap{z-index:2;width:100%;padding-top:90px;padding-bottom:64px;position:relative}.hero .eyebrow{letter-spacing:.14em;text-transform:uppercase;opacity:.9;margin-bottom:16px;font-size:.8rem;font-weight:600}.hero h1{text-shadow:0 2px 24px #00000059;max-width:15ch}.hero p.lead{color:#eef3fb;max-width:44ch;margin:0 0 28px;font-size:1.2rem}.hero .actions{flex-wrap:wrap;gap:12px;display:flex}@media (width<=700px){.hero:after{background:linear-gradient(#0814281a,#08142859 40%,#081428d9 100%)}.hero picture,.hero img.bg{object-position:70% 50%}.hero{min-height:min(80vh,640px)}}.trust{background:var(--ink);color:#e9eef7}.trust ul{max-width:var(--max);flex-wrap:wrap;justify-content:center;gap:10px 36px;margin:0 auto;padding:18px 24px;font-size:.96rem;font-weight:500;list-style:none;display:flex}.trust li:before{content:"✓";color:#7fb0ff;margin-right:9px;font-weight:700}section.s{padding:84px 0}.s-head{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px;margin-bottom:34px;display:flex}.s-head p{color:var(--ink-2);max-width:48ch;margin:0}.kicker{color:var(--oak);letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px;font-size:.78rem;font-weight:700}.tiles{grid-template-columns:1.4fr 1fr;gap:22px;display:grid}@media (width<=800px){.tiles{grid-template-columns:1fr}}.tile{border-radius:var(--r);color:#fff;isolation:isolate;align-items:end;min-height:380px;text-decoration:none;display:flex;position:relative;overflow:hidden}.tile img{object-fit:cover;z-index:-2;width:100%;height:100%;transition:transform .6s;position:absolute;inset:0}.tile:after{content:"";z-index:-1;background:linear-gradient(#08142800 40%,#081428c7);position:absolute;inset:0}.tile:hover img{transform:scale(1.04)}.tile div{padding:28px}.tile h3{margin:0 0 4px;font-size:2rem}.tile span{opacity:.9}.grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px;display:grid}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);color:inherit;flex-direction:column;text-decoration:none;transition:transform .25s,box-shadow .25s;display:flex;overflow:hidden}.card:hover{transform:translateY(-4px);box-shadow:0 14px 34px #0f1b2d1f}.card .ph{aspect-ratio:3/4;background:#efece6;overflow:hidden}.card .ph img{object-fit:cover;width:100%;height:100%}.card.handle .ph{aspect-ratio:1;background:#fff}.card.handle .ph img{object-fit:contain;padding:10px}.card .b{padding:16px 18px 20px}.card .m{color:var(--ink-2);text-transform:uppercase;letter-spacing:.07em;font-size:.8rem}.card h3{font-family:var(--sans);margin:5px 0 0;font-size:1.02rem;font-weight:600}.tags{flex-wrap:wrap;gap:6px;margin-top:10px;display:flex}.tag{background:var(--blue-soft);color:var(--blue-dark);border-radius:99px;padding:3px 9px;font-size:.75rem;font-weight:600}.steps{counter-reset:s;grid-template-columns:repeat(3,1fr);gap:22px;display:grid}@media (width<=800px){.steps{grid-template-columns:1fr}}.step{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:28px}.step:before{counter-increment:s;content:counter(s);background:var(--blue);color:#fff;border-radius:50%;place-items:center;width:42px;height:42px;margin-bottom:16px;font-weight:700;display:grid}.step p{color:var(--ink-2);margin:0}.reviews{background:var(--blue-soft)}.review-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.review{border-radius:var(--r);background:#fff;border:1px solid #d7e3fb;padding:26px}.review blockquote{font-family:var(--serif);margin:0 0 14px;font-size:1.12rem;line-height:1.5}.review cite{font-size:.92rem;font-style:normal;font-weight:600}.review small{color:var(--ink-2);display:block}.about{grid-template-columns:1fr 1fr;align-items:center;gap:56px;display:grid}@media (width<=800px){.about{grid-template-columns:1fr;gap:28px}}.about img{border-radius:var(--r);aspect-ratio:4/3;object-fit:cover;width:100%}.page-head{padding:56px 0 24px}.crumbs{color:var(--ink-2);margin-bottom:14px;font-size:.9rem}.crumbs a{color:var(--ink-2)}.cat-layout{grid-template-columns:260px 1fr;gap:36px;padding-bottom:84px;display:grid}@media (width<=900px){.cat-layout{grid-template-columns:1fr}}.filters{align-self:start;position:sticky;top:96px}@media (width<=900px){.filters{position:static}.filters details.fold:not([open]) .f-body{display:none}}.filters h2{font-family:var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin:26px 0 10px;font-size:.78rem}.filters label{cursor:pointer;align-items:center;gap:10px;padding:6px 0;display:flex}.filters input[type=checkbox]{width:19px;height:19px;accent-color:var(--blue)}.filters .count{color:var(--ink-2);margin-left:auto;font-size:.85rem}.search{border:1px solid var(--line);width:100%;font:inherit;background:#fff;border-radius:999px;padding:13px 16px}.seg{border:1px solid var(--line);background:#fff;border-radius:999px;margin-bottom:20px;padding:4px;display:inline-flex}.seg button{font:inherit;cursor:pointer;color:var(--ink-2);background:0 0;border:0;border-radius:999px;padding:10px 22px;font-weight:600}.seg button[aria-pressed=true]{background:var(--blue);color:#fff}.bar{color:var(--ink-2);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:18px;display:flex}.reset{color:var(--blue);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.empty{text-align:center;border:1px dashed var(--line);border-radius:var(--r);background:#fff;padding:60px 20px}[hidden]{display:none!important}.product{grid-template-columns:1.15fr 1fr;align-items:start;gap:54px;padding:12px 0 70px;display:grid}@media (width<=900px){.product{grid-template-columns:1fr;gap:28px}}.gallery .main{border-radius:var(--r);aspect-ratio:4/5;background:#efece6;overflow:hidden}.gallery .main img{object-fit:cover;width:100%;height:100%}.handle-gallery .main{aspect-ratio:1;border:1px solid var(--line);background:#fff}.handle-gallery .main img{object-fit:contain;padding:24px}.thumbs{flex-wrap:wrap;gap:10px;margin-top:12px;display:flex}.thumbs button{cursor:pointer;background:#efece6;border:2px solid #0000;border-radius:10px;width:78px;height:78px;padding:0;overflow:hidden}.thumbs button[aria-current=true]{border-color:var(--blue)}.thumbs img{object-fit:cover;width:100%;height:100%}.spec{border-collapse:collapse;width:100%;margin:22px 0}.spec th,.spec td{text-align:left;border-bottom:1px solid var(--line);padding:12px 0}.spec th{width:40%;color:var(--ink-2);font-weight:500}.quote{border:1px solid var(--line);border-radius:var(--r);background:#fff;margin-top:26px;padding:26px}.quote h2{font-size:1.45rem}.field{margin-bottom:14px}.field label{margin-bottom:5px;font-size:.9rem;font-weight:600;display:block}.field input,.field textarea{width:100%;font:inherit;background:#fff;border:1px solid #cfcac0;border-radius:10px;padding:12px 14px}.field textarea{min-height:100px}.row2{grid-template-columns:1fr 1fr;gap:12px;display:grid}@media (width<=520px){.row2{grid-template-columns:1fr}}.note{color:var(--ink-2);margin:10px 0 0;font-size:.85rem}.mobile-bar{display:none}@media (width<=900px){.mobile-bar{border-top:1px solid var(--line);z-index:40;background:#fbf9f5f7;gap:10px;padding:10px 14px;display:flex;position:fixed;bottom:0;left:0;right:0}.mobile-bar .btn{flex:1;justify-content:center;padding:13px 10px}body.has-bar{padding-bottom:70px}}.site-footer{background:var(--ink);color:#c9d3e3;padding:60px 0 28px}.site-footer a{color:#e8eefb}.fgrid{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:34px;display:grid}@media (width<=800px){.fgrid{grid-template-columns:1fr 1fr}}.site-footer h3{font-family:var(--sans);color:#fff;letter-spacing:.12em;text-transform:uppercase;font-size:.8rem}.site-footer ul{margin:0;padding:0;list-style:none}.site-footer li{padding:4px 0}.fine{border-top:1px solid #243349;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:36px;padding-top:20px;font-size:.85rem;display:flex}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Preview footer: retain normal flow and fill short viewports. */
body{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}body>main{flex:1 0 auto}body>.site-header,body>.site-footer{flex-shrink:0}body>.site-footer{margin-top:auto}

/* Preview: consistent white phone icon, replacing the platform emoji visually. */
.site-header .call>span[aria-hidden="true"]{display:inline-block;width:20px;height:20px;flex:0 0 20px;font-size:0;line-height:0;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.69 2.79a2 2 0 0 1-.45 2.11L8.09 9.89a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.89.33 1.83.56 2.79.69A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E")}

/* Preview header logo: 50% larger, with narrow-screen fitting. */
.site-header .logo{min-width:0}
.site-header .logo img{height:57px;width:auto}
@media(max-width:900px){.site-header .logo{flex:0 1 235px}.site-header .logo img{width:100%;height:auto;max-height:57px;object-fit:contain}.site-header .menu-btn,.site-header .call{flex-shrink:0}}
@media(max-width:480px){.site-header .wrap{padding-inline:12px;gap:8px}.site-header .menu-btn{padding-inline:8px}.site-header .call{padding:11px 12px}}

/* Reduce lonely final words; explicit non-breaking spaces protect critical phrases. */
p{ text-wrap:pretty; }
h1,h2,h3{ text-wrap:balance; }

/* Consistent pointer feedback for interactive controls. */
a[href],button:not(:disabled),[role="button"]:not([aria-disabled="true"]),input[type="submit"]:not(:disabled),input[type="button"]:not(:disabled),input[type="reset"]:not(:disabled),summary{cursor:pointer}
button:disabled,input:disabled,[aria-disabled="true"]{cursor:not-allowed}

/* Subtle header separation and breathing room below filter heading. */
.site-header{box-shadow:0 3px 12px rgba(15,27,45,.10)}
.filters .fold[open]>summary{margin-bottom:12px}

/* Readable homepage hero: minimum 70% navy across text area, including mobile. */
.hero:after{background:linear-gradient(90deg,rgba(8,20,40,.82) 0%,rgba(8,20,40,.70) 65%,rgba(8,20,40,.20) 100%)}
.hero .eyebrow{opacity:1;color:#fff}
.hero p.lead{color:#fff}
@media(max-width:700px){.hero:after{background:rgba(8,20,40,.72)}}

/* Shared mobile page gutters. Override legacy component and inline padding shorthands. */
@media (max-width:900px){
  main .wrap{padding-inline:20px!important}
}

/* Two-column door and handle catalogues, including narrow mobile screens. */
@media(max-width:600px){
 .cat-layout{min-width:0}
 .cat-layout #grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .cat-layout #grid .card{min-width:0}
 .cat-layout #grid .card .b{padding:12px 10px 14px;overflow-wrap:anywhere}
 .cat-layout #grid .card h3{font-size:.95rem;line-height:1.35}
 .cat-layout #grid .card .m{font-size:.7rem;letter-spacing:.04em}
 .cat-layout #grid .tags{gap:4px}
 .cat-layout #grid .tag{max-width:100%;padding:3px 6px}
}

/* Shared logo strapline, separate from the animated mark. */
.site-header .wrap{height:90px}
.site-header .logo{display:block;flex-shrink:1;max-width:235px}
.logo-mark{display:block;position:relative;line-height:0}
.site-header .logo img{display:block;max-width:100%;object-fit:contain}
.logo-strapline{display:block;margin-top:5px;color:var(--ink);font-family:var(--sans);font-size:10px;font-weight:700;line-height:1.3;letter-spacing:.06em;text-align:center;white-space:nowrap}
@media(max-width:900px){.site-header .nav{top:90px}.logo-strapline{font-size:clamp(6px,1.9vw,10px)}}

/* Consistent mobile title rhythm and dropdown separation. */
@media(max-width:900px){
 .site-header .nav.open{box-shadow:0 3px 12px rgba(15,27,45,.10)}
 main .page-head{padding-top:28px;padding-bottom:16px}
 .logo-strapline{font-size:clamp(8px,1.9vw,10px);letter-spacing:.02em}
}
@media(max-width:600px){
 .catalogue-intro{height:auto!important;min-height:3lh;margin:10px 0 0!important}
}
@media(max-width:420px){.catalogue-intro{min-height:4lh}}
@media(max-width:360px){.catalogue-intro{min-height:5lh}}

.site-header a.logo{text-decoration:none}

/* Integrated vector logo including outlined strapline. */
.site-header .wrap{height:96px}.site-header .logo{width:235px;flex:0 1 235px}.site-header .logo img{width:100%;height:auto;max-height:none}.site-header a.logo{text-decoration:none}@media(max-width:900px){.site-header .nav{top:96px}}

/* Button-blue header, readable navigation and mobile dropdown. */
.site-header{background:var(--blue);border-bottom-color:rgba(255,255,255,.22)}
.site-header .nav a{color:#fff}
.site-header .nav a:hover,.site-header .nav a[aria-current]{background:#fff;color:var(--blue-dark)}
.site-header .call{border:1px solid rgba(255,255,255,.85)}
.site-header .call:hover{background:var(--blue-dark)}
.site-header .menu-btn{color:#fff;border-color:rgba(255,255,255,.85)}
.site-header a:focus-visible,.site-header button:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media(max-width:900px){.site-header .nav{background:var(--blue);border-bottom-color:rgba(255,255,255,.22)}}

/* Requested navy navigation background. */
.site-header{background:#233658}@media(max-width:900px){.site-header .nav{background:#233658}}

/* Shared navy palette for links, buttons and selected controls. */
:root{--blue:#233658;--blue-dark:#17263f;--blue-soft:#e9edf4}

/* Requested navy navigation background. */
.site-header{background:var(--ink)}@media(max-width:900px){.site-header .nav{background:var(--ink)}}

/* Restore the requested sans-serif heading typography. */
h1,h2,h3,h4,h5,h6{font-family:var(--sans)}
