/*
Theme Name: IFS — Insulation Fastening Solutions
Theme URI: https://ifsinsulation.com
Author: Owen
Description: Custom B2B theme for ifsinsulation.com. Every section is an ACF-driven
  partial — nothing is hardcoded in a page builder. Home and About from the
  2026-09 design prototypes; product families and product pages from the
  CD Weld Pins prototype and the listing design.
Version: 1.1.1
Requires at least: 6.4
Requires PHP: 8.1
Text Domain: ifs
*/

/* ==================================================================
   1. BASE — carried over verbatim from the homepage prototype
   ================================================================== */
/* Fonts are self-hosted: assets/fonts/fonts.css, enqueued in functions.php. */
:root{--navy:#0a3763;--teal:#13aab0;--ink:#182b3b;--muted:#526575;--line:#d8e2e9;--soft:#f2f5f7;--title:'Barlow',Arial,sans-serif;--body:'Source Sans 3',Arial,'Microsoft YaHei',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);background:white;font:18px/1.6 var(--body)}button,input,textarea{font:inherit}button,a,input,textarea,summary{-webkit-tap-highlight-color:transparent}a{color:inherit}button{cursor:pointer}button:disabled{cursor:default}a,button{touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--teal);outline-offset:5px}h1,h2,h3{font-family:var(--title);color:var(--navy);font-weight:600;line-height:1.13;letter-spacing:-.02em;margin:0}h1{font-size:clamp(38px,4.05vw,59px)}h2{font-size:clamp(30px,3vw,42px)}h3{font-size:26px}p{margin:16px 0 24px}.wrap{width:min(1280px,calc(100% - 96px));margin-inline:auto}.section{padding-block:88px}.soft{background:var(--soft)}.eyebrow{display:flex;align-items:center;gap:10px;color:var(--navy);font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;margin:0 0 24px}.eyebrow:before{content:'';width:8px;height:12px;background:var(--teal);transform:skew(-24deg);flex:none}.lead{font-size:21px;line-height:1.5}.reviewbar{padding:8px 48px;background:var(--soft);display:flex;justify-content:space-between;gap:15px;font-size:12px;color:var(--muted)}.header{position:sticky;top:0;z-index:10;background:#fffffff5;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.nav-wrap{display:flex;justify-content:space-between;align-items:center;min-height:92px;gap:20px}.brand{text-decoration:none;display:inline-flex;flex-direction:column;position:relative;flex:none}.brand strong{font-family:Arial,sans-serif;font-style:italic;font-size:47px;line-height:1;font-weight:900;letter-spacing:-4px;color:var(--navy)}.brand i{display:inline-block;width:9px;height:8px;background:var(--teal);margin-left:8px;transform:skew(-22deg)}.brand span{font-size:8px;font-weight:600;letter-spacing:.075em;margin-top:5px;color:var(--navy)}nav{display:flex;gap:32px;align-items:center}nav a{text-decoration:none;font-size:16px;font-weight:600}nav a:hover{color:#087b80}.btn{display:inline-flex;gap:20px;justify-content:center;align-items:center;min-height:49px;padding:12px 22px;border:1px solid var(--navy);border-radius:3px;color:white;background:var(--navy);text-decoration:none;font-weight:600;font-size:16px;transition:background .15s}.btn:hover{background:#082c4f}.btn.small{min-height:44px}.btn.white{background:white;color:var(--navy);border-color:white}.btn.white:hover{background:var(--soft)}.text-link{border:0;background:none;padding:0;display:inline-block;text-decoration:underline;text-underline-offset:5px;font-weight:600;font-size:16px;color:var(--navy)}.text-link:hover{color:#087b80}.menu-toggle{display:none}.actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.hero{padding:30px 0 0}.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:stretch}.hero-copy{padding:65px 0 40px}.hero-copy .lead{max-width:465px;margin:24px 0 32px;color:var(--muted)}.hero-copy h1 span{color:#526575}.hero-foot{border-top:1px solid var(--line);padding-top:20px;margin-top:52px;font-size:13px;display:flex;gap:9px;flex-wrap:wrap}.hero-foot span{color:#9aaab7}.placeholder{position:relative;border:1px dashed #9aacba;background:linear-gradient(135deg,transparent 49.8%,#d8e2e94f 50%,transparent 50.2%),var(--soft);color:var(--muted);width:100%;padding:38px 22px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:10px;min-height:220px;overflow:hidden;border-radius:2px;transition:background-color .15s,border-color .15s}.placeholder:hover{border-color:var(--navy);background-color:#e8eff3}.placeholder .ph-title{font-size:20px;color:var(--navy);font-weight:600;letter-spacing:.01em}.placeholder span:not(.ph-title):not(.ph-mark):not(.ph-tag){font-size:14px}.placeholder small{font-size:12px}.ph-mark{font-weight:400;font-size:38px;line-height:1;color:#809bad;margin-bottom:10px}.ph-action{margin-top:20px;text-decoration:underline;text-underline-offset:4px}.placeholder.dark{background:linear-gradient(135deg,transparent 49.8%,#ffffff10 50%,transparent 50.2%),var(--navy);border-color:#7891a6;color:#d7e6f0}.placeholder.dark:hover{background-color:#0c406f;border-color:var(--teal)}.dark .ph-title,.dark .ph-mark{color:white}.hero-visual{min-height:535px}.ph-tag{position:absolute;bottom:25px;left:28px;font-size:11px;letter-spacing:.16em}.catalog-grid{display:grid;grid-template-columns:31% 1fr;gap:64px}.section-intro p:not(.eyebrow){color:var(--muted);max-width:300px}.catalog details{border-top:1px solid var(--line)}.catalog details:last-child{border-bottom:1px solid var(--line)}summary{list-style:none;cursor:pointer;position:relative;padding-right:32px}summary::-webkit-details-marker{display:none}summary:after{content:'+';position:absolute;right:0;color:var(--navy);font-size:24px;font-weight:400}details[open]>summary:after{content:'−'}.catalog summary{font:600 29px/1.25 var(--title);color:var(--navy);padding-block:23px}.category-body{padding:0 0 26px}.category-body p{margin:0 0 16px;color:var(--muted);font-size:16px}.category-layout{display:grid;grid-template-columns:180px 1fr;gap:24px}.category-layout .placeholder{min-height:190px;padding:20px 12px}.category-layout .ph-title{font-size:16px}.category-layout .ph-action{margin-top:6px}.product-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;column-gap:16px;align-content:start}.product-list button{display:flex;justify-content:space-between;gap:8px;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:9px 0;width:100%;font-size:15px;color:var(--navy);line-height:1.4}.product-list button:hover{color:#087b80}.product-list button span{flex:none}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:36px}.section-heading>p{max-width:360px;color:var(--muted);font-size:17px;margin:0}.featured-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.featured{background:white;display:grid;grid-template-columns:46% 1fr;gap:25px;padding:22px}.featured .placeholder{min-height:270px;padding:20px 10px}.featured .ph-title{font-size:18px}.featured .placeholder small{font-size:11px}.card-copy{align-self:center}.card-copy p:not(.eyebrow){color:var(--muted);font-size:16px;margin:14px 0 22px}.card-copy .eyebrow{font-size:10px;letter-spacing:.08em;margin-bottom:13px}.setup-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}.setup-visual{min-height:510px}.setup-grid>div>p:not(.eyebrow){color:var(--muted)}.requirements{margin:30px 0}.requirements details{border-top:1px solid var(--line)}.requirements details:last-child{border-bottom:1px solid var(--line)}.requirements summary{padding-block:14px;color:var(--navy);font-weight:600;font-size:17px}.requirements p{font-size:16px;color:var(--muted);margin:0 24px 18px 0}.application-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.landscape{aspect-ratio:16/9;min-height:0;padding:20px 12px}.landscape .ph-title{font-size:17px}.landscape .ph-action{margin-top:8px}.application-grid h3{margin-top:22px;font-size:24px}.application-grid p{color:var(--muted);font-size:16px}.caption{font-size:13px;color:var(--muted);margin-bottom:0}.about-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:90px}.about-grid .lead{margin-top:0;color:var(--navy)}.about-grid p{color:var(--muted)}.about-detail{margin:25px 0;border-block:1px solid var(--line)}.about-detail summary{padding-block:15px;color:var(--navy);font-size:17px;font-weight:600}.about-detail p{font-size:16px}.contact{background:var(--navy);color:white}.contact h2,.contact .eyebrow{color:white}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start}.contact .lead{max-width:380px;color:#dce7ee}.prototype-note{font-size:13px;color:#dce7ee;max-width:390px;margin-top:30px}.form{padding:34px;background:white;color:var(--ink);border-radius:4px;display:flex;flex-direction:column;align-items:flex-start}.form label{font-size:16px;font-weight:600;margin:0 0 8px}.form input,.form textarea{width:100%;border:1px solid #788b99;border-radius:2px;padding:12px;color:var(--ink);background:white;font-size:16px;line-height:1.5;margin-bottom:22px}.form textarea{resize:vertical;min-height:150px}.form p{font-size:14px;margin:0 0 16px;color:var(--muted)}.form small{font-size:12px;color:var(--muted);margin-top:10px}.form .error{color:#a72a24}.footer{padding-block:40px;display:flex;align-items:center;gap:30px;justify-content:space-between}.footer p{max-width:230px;font-size:14px;color:var(--muted)}.footer nav{gap:22px}.footer nav a{font-size:14px}.skip{position:absolute;top:-100px;left:20px;background:white;padding:10px;z-index:30}.skip:focus{top:10px}dialog{border:1px solid var(--line);border-radius:5px;padding:32px;width:min(600px,calc(100% - 32px));max-height:85vh;overflow:auto;color:var(--ink);box-shadow:0 20px 100px #001b3840}dialog::backdrop{background:#071e38a8}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.dialog-head .eyebrow{margin-bottom:20px}.close{background:var(--soft);border:0;font-size:27px;width:42px;height:42px;line-height:1;align-self:flex-start;color:var(--navy)}dialog h2{font-size:29px;margin-bottom:20px}dialog p,dialog li{font-size:17px}dialog .actions{margin-top:28px}dialog pre{white-space:pre-wrap;word-break:break-word;font:16px/1.6 var(--body);background:var(--soft);padding:20px}dialog textarea{width:100%;height:170px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;z-index:30;padding:12px 20px;border-radius:4px;max-width:calc(100% - 30px);font-size:15px;opacity:0;pointer-events:none;transition:opacity .2s}.toast.visible{opacity:1}
@media(max-width:1100px){.wrap{width:calc(100% - 56px)}.hero-grid{gap:28px}.hero-copy{padding-top:35px}.hero-visual{min-height:470px}.catalog-grid{gap:35px;grid-template-columns:28% 1fr}.category-layout{grid-template-columns:150px 1fr;gap:18px}.featured{grid-template-columns:1fr}.featured .placeholder{min-height:220px}.setup-grid{gap:35px}.contact-grid{gap:45px}.footer{flex-wrap:wrap}.footer nav{margin-left:auto}.product-list{grid-template-columns:1fr}.category-layout .placeholder{align-self:start}}
@media(max-width:760px){html{scroll-padding-top:80px}.wrap{width:calc(100% - 40px)}.reviewbar{padding:7px 20px;display:block;font-size:11px}.reviewbar span{display:block}.nav-wrap{min-height:75px}.brand strong{font-size:38px}.brand span{font-size:7px}.menu-toggle{display:flex;gap:14px;align-items:center;background:white;border:1px solid var(--line);color:var(--navy);padding:8px 12px;font-size:16px}.header nav{display:none;position:absolute;top:100%;left:0;width:100%;background:white;box-shadow:0 8px 12px #0a376314;padding:20px;flex-direction:column;align-items:stretch;gap:0}.header nav.open{display:flex}.header nav a{padding:14px 0}.header nav button{margin-top:10px}.hero{padding-top:0}.hero-grid{grid-template-columns:1fr;gap:0}.hero-copy{padding:40px 0 25px}h1{font-size:38px}h2{font-size:32px}h3{font-size:24px}.hero-copy .lead{font-size:18px}.hero-foot{margin-top:30px;font-size:12px}.hero-visual{min-height:340px}.section{padding-block:56px}.eyebrow{margin-bottom:18px}.catalog-grid,.setup-grid,.about-grid,.contact-grid{grid-template-columns:1fr;gap:30px}.section-intro p:not(.eyebrow){max-width:none}.catalog summary{font-size:25px;padding-block:20px}.category-layout{grid-template-columns:1fr}.category-layout .placeholder{min-height:160px}.product-list{grid-template-columns:1fr 1fr}.section-heading{display:block}.section-heading>p{margin-top:18px;max-width:none}.featured-grid{grid-template-columns:1fr}.featured{grid-template-columns:42% 1fr;gap:18px;padding:16px}.featured .placeholder{min-height:250px}.featured .placeholder small{display:none}.card-copy h3{font-size:23px}.card-copy .eyebrow{font-size:10px}.setup-visual{min-height:320px}.setup-grid>div{order:-1}.application-grid{grid-template-columns:1fr;gap:35px}.landscape{aspect-ratio:16/9;min-height:200px}.application-grid p{margin:12px 0 15px}.contact-grid{gap:30px}.form{padding:24px}.footer{gap:15px;align-items:flex-start}.footer p{max-width:none;width:100%}.footer nav{width:100%;margin:0;flex-wrap:wrap;gap:15px 24px}.placeholder{padding-inline:15px}.ph-tag{font-size:10px}.actions{gap:20px}.hero .actions{align-items:flex-start;flex-direction:column}}
@media(max-width:400px){h1{font-size:34px}.featured{grid-template-columns:1fr}.featured .placeholder{min-height:210px}.product-list{grid-template-columns:1fr}.hero-foot{font-size:11px}dialog{padding:22px}}
.brand strong{font-style:normal;font-family:var(--title);letter-spacing:-2px}.brand span{font-size:10px;letter-spacing:0}.application-grid>*{min-width:0}.application-grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:760px){.application-grid{grid-template-columns:minmax(0,1fr)}.landscape{aspect-ratio:auto;min-height:190px}.brand span{font-size:8px}}
.drawing-section{padding:115px 0 105px;background:#fff;border-bottom:1px solid var(--line)}.drawing-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:center}.drawing-image{min-height:390px;max-width:335px;justify-self:center;background-color:#fafcfd;transform:rotate(-5deg);box-shadow:12px 20px 35px #0a37630a}.drawing-image:hover{transform:rotate(-5deg)}.drawing-copy h2{font-size:44px}.drawing-copy>p:not(.eyebrow){color:var(--muted);max-width:570px}.quick-fields{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:28px}.quick-fields label,.drawing-file label{display:block;font-size:15px;font-weight:600;margin-bottom:8px}.quick-fields input{width:100%;min-width:0;border:0;border-bottom:1px solid #788b99;background:#fff;padding:10px 0;font-size:17px;border-radius:0}.drawing-file{margin:24px 0}.drawing-file label span{font-weight:400;color:var(--muted)}.drawing-file input{display:block;max-width:100%;font-size:14px}.drawing-file input::file-selector-button{padding:8px 12px;background:var(--soft);border:1px solid var(--line);color:var(--navy);margin-right:10px;border-radius:3px;cursor:pointer}.drawing-file small,.drawing-file #file-status{display:block;color:var(--muted);font-size:12px;margin-top:7px}.drawing-copy .draft-hint{font-size:12px;color:var(--muted);margin:15px 0 0}.drawing-copy .error{font-size:14px;color:#a72a24}.cooperation{background:var(--soft)}.cooperation-intro{max-width:760px;margin-bottom:46px}.cooperation-intro p:not(.eyebrow){max-width:680px;color:var(--muted)}.cooperation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--navy);color:white}.cooperation-grid article{padding:38px 32px;display:flex;flex-direction:column;align-items:flex-start;min-height:320px}.cooperation-grid article+article{border-left:1px solid #ffffff30}.cooperation-label{font-size:11px;letter-spacing:.14em;color:#bde4e6;margin-bottom:30px}.cooperation-grid h3{color:white;font-size:28px}.cooperation-grid p{font-size:17px;color:#e0eaf2}.cooperation-grid .text-link{color:white;margin-top:auto}.cooperation-grid .text-link:hover{color:#bde4e6}@media(max-width:1000px){.drawing-grid{gap:55px;grid-template-columns:.7fr 1.3fr}.drawing-image{max-width:280px;min-height:360px}.cooperation-grid article{padding:30px 24px}}@media(max-width:760px){.drawing-section{padding:65px 0}.drawing-grid{grid-template-columns:minmax(0,1fr);gap:40px}.drawing-image{min-height:230px;max-width:260px;order:2}.drawing-copy h2{font-size:34px}.quick-fields{grid-template-columns:minmax(0,1fr);gap:20px}.cooperation-grid{grid-template-columns:minmax(0,1fr)}.cooperation-grid article{min-height:0;padding:32px 25px}.cooperation-grid article+article{border-left:0;border-top:1px solid #ffffff30}.cooperation-label{margin-bottom:18px}.cooperation-intro{margin-bottom:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.nav-wrap{position:relative}.category-nav{display:flex;align-items:stretch;gap:20px}.nav-category{position:relative;display:flex;align-items:center}.category-toggle{display:flex;align-items:center;gap:7px;background:none;border:0;padding:18px 0;color:var(--navy);font:600 15px/1.2 var(--body);white-space:nowrap}.category-toggle i{font-style:normal;font-size:12px;transition:transform .18s}.category-toggle[aria-expanded=true]{color:#087b80}.category-toggle[aria-expanded=true] i{transform:rotate(180deg)}.category-panel{position:absolute;top:calc(100% + 1px);left:-22px;width:310px;background:white;border-top:2px solid var(--teal);box-shadow:0 20px 42px #092d4224;padding:22px;z-index:25;animation:menu-in .16s ease-out}.nav-category:nth-child(n+3) .category-panel{left:auto;right:-22px}.category-panel[hidden]{display:none}.category-meta{display:flex;justify-content:space-between;gap:16px;padding-bottom:14px;margin-bottom:3px;border-bottom:1px solid var(--line);color:var(--navy);font:600 13px var(--body);text-transform:uppercase;letter-spacing:.09em}.category-meta small{font-size:12px;color:#738797;letter-spacing:.04em}.category-panel ul{list-style:none;margin:0;padding:0}.category-panel li button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:45px;padding:10px 7px;border:0;border-bottom:1px solid #edf1f4;background:none;color:var(--muted);font:16px/1.35 var(--body);text-align:left;transition:background .15s,color .15s,transform .15s}.category-panel li button i{font-style:normal;color:var(--teal);opacity:0;transition:opacity .15s}.category-panel li button:hover,.category-panel li button:focus-visible{background:#edf7f7;color:#08666c;transform:translateX(3px)}.category-panel li button:hover i,.category-panel li button:focus-visible i{opacity:1}.category-catalogue{display:block;margin-top:14px;font-size:14px;color:var(--navy)}.drawing-section{padding:100px 0}.drawing-grid{grid-template-columns:.7fr 1.3fr;gap:110px}.drawing-image{min-height:270px;max-width:235px;padding:24px 16px}.drawing-image .ph-title{font-size:17px}.drawing-image .ph-action{font-size:12px!important;margin-top:10px}.drawing-copy h2{font-size:44px;margin-bottom:12px}.drawing-copy>p{margin:0 0 30px}.quick-fields{margin-top:0}.drawing-copy .actions{margin-top:28px}.drawing-copy .error:empty{display:none}#attachment-error{color:#a72a24;font-size:14px}.drawing-file #file-status{overflow-wrap:anywhere}@keyframes menu-in{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1180px){.category-nav{gap:13px}.category-toggle{font-size:14px}.header nav{gap:18px}.header .btn.small{padding-inline:15px}}
@media(max-width:1080px){.menu-toggle{display:flex;gap:14px;align-items:center;background:white;border:1px solid var(--line);color:var(--navy);padding:8px 12px;font-size:16px}.header nav{display:none;position:absolute;top:100%;left:0;width:100%;max-height:calc(100dvh - 80px);overflow:auto;background:white;box-shadow:0 8px 18px #0a37631c;padding:20px 28px;flex-direction:column;align-items:stretch;gap:0}.header nav.open{display:flex}.category-nav{display:block}.nav-category{display:block;border-bottom:1px solid var(--line)}.category-toggle{width:100%;justify-content:space-between;padding:16px 0;font-size:17px}.category-panel,.nav-category:nth-child(n+3) .category-panel{position:static;width:auto;box-shadow:none;border-top:0;padding:0 0 17px;animation:none}.category-meta{padding:0 8px 10px;margin:0}.category-panel li button{font-size:16px;padding-inline:8px}.category-catalogue{padding:12px 8px!important}.header nav>a{padding:14px 0}.header nav>.btn{margin-top:12px}.drawing-grid{gap:55px}}
@media(max-width:760px){.header nav{padding:18px 20px}.drawing-section{padding:65px 0}.drawing-grid{grid-template-columns:1fr;gap:35px}.drawing-image{min-height:170px;max-width:220px;order:2}.drawing-copy h2{font-size:34px}.drawing-copy>p{font-size:17px;margin-bottom:25px}.quick-fields{gap:18px}.drawing-copy .actions{margin-top:24px}}
@media(prefers-reduced-motion:reduce){.category-panel{animation:none}.category-toggle i,.category-panel li button,.category-panel li button i{transition:none}}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px;width:100%}.form .field{min-width:0}.form .field-wide{grid-column:1/-1}.form select{width:100%;min-height:50px;border:1px solid #788b99;border-radius:2px;padding:12px;color:var(--ink);background:white;font-size:16px;line-height:1.5;margin-bottom:22px}.form label span{color:#a72a24}.form-grid textarea{margin-bottom:12px}.form>#form-error:empty{display:none}
@media(max-width:760px){.form-grid{grid-template-columns:minmax(0,1fr);gap:0}.form .field-wide{grid-column:auto}}
.hero-visual{background:linear-gradient(135deg,transparent 49.8%,#d8e2e94f 50%,transparent 50.2%),#fff;color:var(--muted);border-color:#aebdc8}.hero-visual:hover{background-color:#fff}.drawing-message{grid-column:1/-1}.drawing-message label{display:block;font-size:15px;font-weight:600;margin:20px 0 8px}.drawing-message label span{font-weight:400;color:var(--muted)}.drawing-message textarea{width:100%;resize:vertical;min-height:100px;border:1px solid #788b99;border-radius:2px;padding:12px;color:var(--ink);font-size:16px}.about{background:#fff}.about-heading{display:grid;grid-template-columns:.42fr 1fr;gap:70px;align-items:start;margin-bottom:48px}.about-heading .eyebrow{margin-top:9px}.about-heading h2{max-width:680px}.about-story{display:grid;grid-template-columns:.82fr 1.18fr;gap:70px;align-items:center}.about-copy{max-width:520px}.about-copy .lead{color:var(--navy);margin-top:0}.about-copy p:not(.lead){color:var(--muted)}.about-visual{min-height:410px}.faq{background:var(--soft);border-top:1px solid var(--line)}.faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:90px;align-items:start}.faq-intro{position:sticky;top:125px}.faq-intro p:not(.eyebrow){color:var(--muted);max-width:350px}.faq-list{border-top:1px solid #bfcbd3}.faq-list details{border-bottom:1px solid #bfcbd3}.faq-list summary{padding:21px 42px 21px 0;color:var(--navy);font:600 20px/1.35 var(--title)}.faq-list p{margin:0 40px 22px 0;color:var(--muted);font-size:16px}.form label .optional{color:var(--muted)!important;font-weight:400}
@media(max-width:760px){.about-heading,.about-story,.faq-layout{grid-template-columns:minmax(0,1fr);gap:28px}.about-heading{margin-bottom:30px}.about-story{gap:35px}.about-copy{max-width:none}.about-visual{min-height:260px}.faq-intro{position:static}.faq-list summary{font-size:18px}.drawing-message{grid-column:auto}}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.about-heading{display:block;margin-bottom:48px}.about-heading .eyebrow{margin-top:0}.about-heading h2{max-width:780px}.reference-form input,.reference-form select,.reference-form textarea{width:100%;min-width:0;min-height:50px;margin:0;border:1px solid #c7d3dd;border-radius:6px;background:#fff;color:var(--ink);padding:11px 13px;font:16px/1.5 var(--body)}.reference-form textarea{min-height:118px;resize:vertical}.reference-form input::placeholder,.reference-form textarea::placeholder{color:#71818e;opacity:1}.reference-form select:focus-visible{outline:3px solid var(--teal);outline-offset:3px}.reference-form .phone-row{display:grid;grid-template-columns:minmax(150px,.72fr) minmax(0,1.28fr);gap:12px}.quick-fields{gap:12px;margin-top:24px}.quick-fields .field-wide{grid-column:1/-1}.quick-fields .drawing-message{grid-column:1/-1}.drawing-copy .actions{margin-top:22px}.form.reference-form{gap:0}.form.reference-form .form-grid{gap:12px 12px}.form.reference-form .field{margin:0}.form.reference-form input,.form.reference-form select,.form.reference-form textarea{margin:0}.form.reference-form textarea{min-height:145px}.form.reference-form>#form-error{margin-top:12px}.form.reference-form>.btn{margin-top:18px}
@media(max-width:760px){.about-heading{margin-bottom:30px}.quick-fields{grid-template-columns:minmax(0,1fr);gap:12px}.quick-fields .field-wide,.quick-fields .drawing-message{grid-column:auto}.reference-form .phone-row{grid-template-columns:minmax(112px,.78fr) minmax(0,1.22fr);gap:10px}.form.reference-form .phone-row{grid-column:auto}.form.reference-form .form-grid{gap:12px}.form.reference-form textarea{min-height:125px}}
.placeholder{border:0}.reference-form input,.reference-form select{height:44px;min-height:44px;padding:8px 12px}.reference-form textarea{height:108px;min-height:108px;padding:10px 12px}.form.reference-form textarea{height:116px;min-height:116px}
@media(max-width:760px){.reference-form input,.reference-form select{height:43px;min-height:43px}.reference-form textarea,.form.reference-form textarea{height:104px;min-height:104px}}
.placeholder,.hero-visual,.placeholder:hover,.hero-visual:hover{border:0;background:transparent;box-shadow:none}
/* IFS brand story */
.about-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin:48px 0 0;padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.about-facts dt{font:600 clamp(26px,3vw,38px)/1.2 var(--title);color:var(--navy)}.about-facts dd{margin:10px 0 0;color:var(--muted);font-size:16px;line-height:1.5}.about-chapters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 70px;margin-top:48px}.about-chapters h3{font-size:28px;line-height:1.2}.about-chapters p{color:var(--muted);margin:18px 0 0}.about-closing{max-width:800px;margin-top:48px;padding-top:30px;border-top:3px solid var(--teal)}.about-closing .lead{color:var(--navy);font-weight:600}.about-closing>p:not(.lead){color:var(--muted)}@media(max-width:760px){.about-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 20px;margin-top:32px}.about-chapters{grid-template-columns:minmax(0,1fr);gap:30px;margin-top:32px}.about-chapters h3{font-size:25px}.about-closing{margin-top:32px}}

/* ==================================================================
   2. ABOUT / STORY PAGE — from the About prototype.
   The prototype's duplicate :root block is intentionally NOT copied: it
   re-declared --title as Arial and would have undone the Barlow headings
   the homepage design settled on.
   ================================================================== */
.story-page{--story-blue:#0a3763;--story-teal:#13aab0}
.story-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:64px;padding-block:70px 90px}
.story-hero h1{font-size:clamp(44px,5.3vw,74px);line-height:1.04;letter-spacing:-.035em}.teal-period{color:var(--teal)}
.story-hero .lead{max-width:500px;color:var(--muted);font-size:21px;margin:28px 0}.story-hero-copy>.text-link{margin-bottom:38px}
.hero-origin{display:flex;gap:34px;border-top:1px solid var(--line);padding-top:22px}.hero-origin>span{font-size:10px;letter-spacing:.13em;color:var(--muted)}.hero-origin strong{display:block;font:600 28px/1.3 var(--title);letter-spacing:0;color:var(--navy);margin-top:5px}
.story-hero-images{position:relative;padding:0 0 65px 22px}.story-hero-images:before{content:'';position:absolute;top:30px;right:-16px;width:70%;height:70%;background:#e5f3f3;z-index:-1}.hero-factory{margin:0;background:var(--navy)}.hero-factory>img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center}.hero-factory figcaption{padding:20px 24px 42px;color:white}.hero-factory figcaption span{display:block;font:600 22px/1.2 var(--title)}.hero-factory small{display:block;font-size:12px;color:#c8dfe9;margin-top:7px}
.story-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-block:22px;margin-bottom:0}.story-nav a{display:flex;justify-content:space-between;padding:0 24px;border-right:1px solid var(--line);font-size:15px}.story-nav a:first-child{padding-left:0}.story-nav a:last-child{border:0;padding-right:0}.story-nav a span{color:var(--teal)}
.editorial{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px}.editorial h2{font-size:clamp(30px,3.3vw,45px);line-height:1.12}.prose p{margin:0 0 22px;color:var(--muted)}.prose .lead{color:var(--navy);font-size:25px;line-height:1.4}.prose p:last-child{margin-bottom:0}.origin-section .editorial>div:first-child{border-left:4px solid var(--teal);padding-left:28px}.origin-section .editorial{align-items:start}.people-section{padding-top:30px}.people-section .editorial{border-top:1px solid var(--line);padding-top:66px}
.manufacturing-facts{background:var(--navy);color:white}.manufacturing-facts .about-facts{margin:0;border:0;padding:45px 0;gap:0}.manufacturing-facts .about-facts>div{padding:0 26px;border-right:1px solid #ffffff30}.manufacturing-facts .about-facts>div:first-child{padding-left:0}.manufacturing-facts .about-facts>div:last-child{border-right:0}.manufacturing-facts .about-facts dt{color:white;font-size:clamp(29px,3.4vw,47px)}.manufacturing-facts .about-facts dd{color:#c8dfe9;font-size:14px;max-width:210px}.manufacturing-facts .about-facts dt:after{content:'';display:block;width:28px;height:3px;background:var(--teal);margin-top:17px}
.relationship-heading{display:grid;grid-template-columns:1.05fr .95fr;gap:20px 80px;align-items:end;margin-bottom:60px}.relationship-heading .eyebrow{grid-column:1/-1;margin:0}.relationship-heading h2{font-size:clamp(34px,3.8vw,50px)}.relationship-heading>p:last-child{color:var(--muted);margin:0;font-size:17px}
.customer-story{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;padding:52px 0;border-top:1px solid var(--line);align-items:center}.customer-copy .eyebrow{font-size:13px;letter-spacing:.12em}.customer-copy h3{font-size:clamp(28px,3vw,39px);line-height:1.15}.customer-copy>p:not(.eyebrow){color:var(--muted);font-size:17px}.order-emphasis{display:block;font-size:clamp(44px,5.5vw,70px);color:var(--navy);line-height:1.1;margin-block:12px}.customer-story figure{margin:0;min-width:0}.photo-link{display:block;background:var(--soft)}.customer-story img{display:block;width:100%;height:auto}.customer-story img.letterboxed{aspect-ratio:4/3;object-fit:cover;object-position:center}.customer-story figcaption{font-size:13px;line-height:1.5;color:var(--muted);margin-top:13px;border-left:2px solid var(--teal);padding-left:12px}.customer-story:nth-of-type(1)>.customer-copy{padding-right:24px}.customer-story:nth-of-type(1)>figure{max-width:470px;justify-self:end;transform:rotate(1.5deg);padding:14px;background:#f2f5f7}.customer-story:nth-of-type(2){grid-template-columns:1.15fr .85fr}.customer-story:nth-of-type(2)>.customer-copy{order:2}.visit-gallery{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}.customer-story:nth-of-type(3){padding-bottom:0}.customer-story:nth-of-type(3) .photo-link{border-bottom:5px solid var(--teal)}
.story-cta{background:var(--navy);padding-block:74px;color:white;position:relative;overflow:hidden}.story-cta:after{content:'';position:absolute;right:10%;top:-60px;width:100px;height:130%;background:#13aab018;transform:skew(-24deg);pointer-events:none}.story-cta .wrap{position:relative;z-index:1}.story-cta h2,.story-cta .eyebrow{color:white}.story-cta h2{font-size:clamp(36px,4.5vw,62px);line-height:1.1}.story-cta p:not(.eyebrow){max-width:580px;color:#dbe8f1}.story-page [aria-current=page]{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:7px}.story-page .footer{flex-wrap:wrap}.story-page .footer nav{flex-wrap:wrap}.about-preview-photo{margin:0}
@media(max-width:1100px){.story-hero{gap:30px}.editorial,.customer-story{gap:44px}.relationship-heading{gap:20px 40px}}
@media(max-width:760px){.story-hero{grid-template-columns:1fr;gap:34px;padding-block:42px 40px}.story-hero h1{font-size:clamp(43px,9vw,64px)}.story-hero .lead{font-size:19px}.story-hero-images{padding:0 12px 54px 0}.story-hero-images:before{right:0}.hero-factory figcaption{padding-bottom:38px}.hero-origin{gap:36px}.story-nav{grid-template-columns:1fr 1fr;row-gap:20px}.story-nav a{font-size:14px;padding:0 14px}.story-nav a:nth-child(odd){padding-left:0}.story-nav a:nth-child(even){border:0;padding-right:0}.editorial,.customer-story,.customer-story:nth-of-type(2){grid-template-columns:1fr;gap:28px}.story-page .section{padding-block:54px}.story-page .people-section{padding-top:0}.people-section .editorial{padding-top:40px}.origin-section .editorial>div:first-child{padding-left:20px}.relationship-heading{display:block;margin-bottom:28px}.relationship-heading .eyebrow{margin-bottom:20px}.relationship-heading>p:last-child{margin-top:22px}.customer-story{padding-block:34px}.customer-story:nth-of-type(1)>.customer-copy{padding-right:0}.customer-story:nth-of-type(1)>figure{transform:none;max-width:none;padding:10px}.customer-story:nth-of-type(2)>.customer-copy{order:0}.customer-story:nth-of-type(3){padding-bottom:0}.customer-copy h3{font-size:30px}.customer-copy>p:last-child{margin-bottom:0}.manufacturing-facts .about-facts{grid-template-columns:1fr 1fr;padding-block:30px;row-gap:28px}.manufacturing-facts .about-facts>div{padding-inline:18px}.manufacturing-facts .about-facts>div:nth-child(odd){padding-left:0}.manufacturing-facts .about-facts>div:nth-child(even){border:0}.manufacturing-facts .about-facts dt{font-size:31px}.manufacturing-facts .about-facts dd{font-size:13px}.visit-gallery{gap:12px}.story-cta{padding-block:52px}.story-page .footer nav{gap:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.customer-accordion{position:relative}.customer-entry{border-top:1px solid var(--line)}.customer-entry:last-child{border-bottom:1px solid var(--line)}.customer-entry>summary{padding:23px 36px 23px 0;color:var(--muted);display:flex;align-items:baseline;justify-content:space-between;gap:14px;line-height:1.2}.customer-entry>summary:after{right:0;top:23px;font-size:24px}.customer-country{font:600 27px/1.2 var(--title);letter-spacing:-.02em}.customer-date{font-size:12px;white-space:nowrap}.customer-entry[open]{border-top:2px solid var(--teal)}.customer-entry[open]>summary{color:var(--navy)}.customer-description{padding:0 12px 25px 0}.customer-description h3{font-size:21px;line-height:1.3;letter-spacing:-.01em;margin-bottom:18px}.customer-description p{font-size:16px;line-height:1.6;color:var(--muted);margin:0 0 16px}.customer-description p:last-child{margin-bottom:0}.customer-media{padding-bottom:10px}.customer-media figure{margin:0}.customer-media img{display:block;width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--soft)}.customer-media img.letterboxed{object-fit:cover;object-position:center}.customer-media figcaption{font-size:13px;color:var(--muted);line-height:1.5;padding-left:12px;border-left:2px solid var(--teal);margin-top:14px}.customer-media .visit-gallery{margin-top:22px}.customer-media .photo-link{overflow:hidden}.customer-media .visit-gallery figcaption{font-size:12px}.customer-accordion.is-ready{min-height:var(--customer-height,640px)}
@media(min-width:901px){.customer-accordion.is-ready>.customer-entry{width:35%}.customer-accordion.is-ready .customer-media{position:absolute;top:0;left:41%;width:59%}.customer-entry[open] .customer-media{animation:customer-photo-in .25s ease-out}}
@media(max-width:900px){.customer-accordion.is-ready{min-height:0}.customer-entry>summary{padding-block:21px}.customer-country{font-size:25px}.customer-description{padding-bottom:22px;max-width:680px}.customer-media{padding-bottom:28px}.customer-media>figure,.customer-media>div{max-width:720px}.customer-description h3{font-size:22px}}
@keyframes customer-photo-in{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.customer-entry[open] .customer-media{animation:none}}
.section-split-heading{display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:end;margin-bottom:50px}.section-split-heading>p{color:var(--muted);font-size:18px;max-width:520px;margin:0}.section-split-heading h2{font-size:clamp(34px,3.8vw,50px)}
.manufacturing-section{background:#f2f5f7}.manufacturing-flow{list-style:none;padding:0;margin:0;border-top:1px solid #bdcad3;counter-reset:manufacturing}.manufacturing-flow li{display:grid;grid-template-columns:72px .85fr 1.15fr;gap:30px;align-items:start;padding:25px 0;border-bottom:1px solid #bdcad3}.manufacturing-flow .flow-number{font:600 12px/1.4 var(--title);letter-spacing:.12em;color:var(--teal);padding-top:7px}.manufacturing-flow h3{font-size:24px;line-height:1.25}.manufacturing-flow p{color:var(--muted);font-size:16px;line-height:1.55;margin:3px 0 0;max-width:590px}.manufacturing-flow li:hover h3{color:#087b80}
.supply-scope{background:white}.scope-layout{display:grid;grid-template-columns:.62fr 1.38fr;gap:0;border:1px solid var(--line)}.scope-core{background:var(--navy);color:white;min-height:480px;padding:46px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.scope-core:after{content:'';position:absolute;right:-45px;bottom:-40px;width:135px;height:250px;background:#13aab023;transform:skew(-24deg)}.scope-core>span{font:bold italic clamp(72px,9vw,126px)/.85 Arial,sans-serif;letter-spacing:-9px}.scope-core p{font:600 clamp(23px,2.6vw,34px)/1.15 var(--title);margin:0;position:relative;z-index:1}.scope-list{display:grid;grid-template-columns:1fr 1fr}.scope-list article{display:grid;grid-template-columns:34px 1fr;gap:15px;padding:34px;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}.scope-list article:nth-child(even){border-right:0}.scope-list article:nth-child(n+3){border-bottom:0}.scope-list article>span{font:600 11px/1.5 var(--title);color:var(--teal);letter-spacing:.1em;padding-top:5px}.scope-list h3{font-size:22px;line-height:1.25}.scope-list p{font-size:15px;line-height:1.55;color:var(--muted);margin:13px 0 0}.product-matching{display:grid;grid-template-columns:.35fr 1fr auto;gap:34px;align-items:center;background:#e5f3f3;padding:27px 32px;margin-top:20px}.matching-label{font:600 17px/1.3 var(--title);color:var(--navy)}.product-matching p{font-size:15px;color:var(--muted);margin:0}.product-matching .text-link{white-space:nowrap}
.durability-section{position:relative}.selection-principles{display:grid;grid-template-columns:1fr 1fr;border-top:3px solid var(--navy);border-bottom:1px solid var(--line)}.selection-principles article{padding:34px 42px 38px 0;border-bottom:1px solid var(--line)}.selection-principles article:nth-child(odd){border-right:1px solid var(--line)}.selection-principles article:nth-child(even){padding-left:42px}.selection-principles article:nth-child(n+3){border-bottom:0}.principle-label{display:inline-block;color:#087b80;background:#e5f3f3;padding:5px 9px;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px}.selection-principles h3{font-size:25px}.selection-principles p{font-size:16px;line-height:1.6;color:var(--muted);margin:14px 0 0}.feedback-note{display:grid;grid-template-columns:.35fr 1fr;gap:34px;margin-top:28px;padding:26px 0 0;border-top:1px solid var(--teal)}.feedback-note span{font:600 17px/1.3 var(--title);color:var(--navy)}.feedback-note p{color:var(--muted);font-size:16px;margin:0;max-width:690px}
@media(max-width:900px){.section-split-heading{gap:40px}.manufacturing-flow li{grid-template-columns:52px .75fr 1.25fr;gap:20px}.scope-core{padding:34px;min-height:430px}.scope-list article{padding:27px 24px}.product-matching{grid-template-columns:.3fr 1fr}.product-matching .text-link{grid-column:2}.selection-principles article{padding-right:28px}.selection-principles article:nth-child(even){padding-left:28px}}
@media(max-width:760px){.section-split-heading{grid-template-columns:1fr;gap:22px;margin-bottom:32px}.section-split-heading>p{font-size:17px}.manufacturing-flow li{grid-template-columns:38px 1fr;gap:12px 14px;padding:22px 0}.manufacturing-flow li>div{grid-column:2}.manufacturing-flow h3{font-size:21px}.manufacturing-flow p{margin-top:10px}.scope-layout{grid-template-columns:1fr}.scope-core{min-height:250px;padding:28px}.scope-core>span{font-size:82px}.scope-core p{font-size:25px}.scope-list{grid-template-columns:1fr}.scope-list article,.scope-list article:nth-child(even),.scope-list article:nth-child(n+3){border-right:0;border-bottom:1px solid var(--line);padding:24px 22px}.scope-list article:last-child{border-bottom:0}.product-matching{grid-template-columns:1fr;gap:14px;padding:24px 22px}.product-matching .text-link{grid-column:auto;margin-top:4px}.selection-principles{grid-template-columns:1fr}.selection-principles article,.selection-principles article:nth-child(even),.selection-principles article:nth-child(n+3){padding:26px 0;border-right:0;border-bottom:1px solid var(--line)}.selection-principles article:last-child{border-bottom:0}.selection-principles h3{font-size:22px}.feedback-note{grid-template-columns:1fr;gap:10px}}
.origin-people-section{background:white}.origin-title{display:grid;grid-template-columns:.42fr 1fr;gap:70px;align-items:start;padding-bottom:48px}.origin-title .eyebrow{margin-top:10px}.origin-title h2{font-size:clamp(36px,4.2vw,56px)}.origin-evidence{display:grid;grid-template-columns:1.15fr .85fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.origin-narrative{padding:46px 70px 48px 0}.origin-narrative .lead{font-size:25px;color:var(--navy);margin:0 0 25px}.origin-narrative p:not(.lead){color:var(--muted);margin:0 0 20px}.origin-narrative p:last-child{margin-bottom:0}.origin-timeline{border-left:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr}.origin-timeline>div{padding:42px 34px;display:flex;flex-direction:column}.origin-timeline>div+div{border-left:1px solid var(--line)}.origin-timeline span{font:600 clamp(38px,4vw,56px)/1 var(--title);color:var(--navy)}.origin-timeline span:after{content:'';display:block;width:30px;height:3px;background:var(--teal);margin:20px 0}.origin-timeline h3{font-size:20px}.origin-timeline p{color:var(--muted);font-size:15px;line-height:1.55;margin:14px 0 0}.people-panel{padding-top:70px}.people-intro{display:grid;grid-template-columns:.42fr 1fr;gap:18px 70px;align-items:start;margin-bottom:42px}.people-intro .eyebrow{grid-row:1/3;margin-top:9px}.people-intro h2{font-size:clamp(30px,3.4vw,45px)}.people-intro>p:last-child{color:var(--muted);max-width:720px;margin:0}.people-principles{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.people-principles article{padding:31px 32px 34px 0}.people-principles article+article{border-left:1px solid var(--line);padding-left:32px}.people-principles span{font:600 11px/1 var(--title);letter-spacing:.12em;color:var(--teal)}.people-principles h3{font-size:22px;margin-top:18px}.people-principles p{font-size:15px;line-height:1.55;color:var(--muted);margin:13px 0 0}
.customer-catalog-grid{display:grid;grid-template-columns:31% 1fr;gap:64px;align-items:start}.customer-catalog-grid .relationship-heading{display:block;margin:0}.customer-catalog-grid .relationship-heading .eyebrow{margin-bottom:24px}.customer-catalog-grid .relationship-heading h2{font-size:clamp(32px,3.2vw,44px)}.customer-catalog-grid .relationship-heading>p:last-child{margin-top:24px;font-size:16px}.customer-accordion.is-ready{min-height:0}.customer-accordion.is-ready>.customer-entry{width:auto}.customer-accordion.is-ready .customer-media{position:static;width:auto}.customer-entry{border-top:1px solid var(--line)}.customer-entry:last-child{border-bottom:1px solid var(--line)}.customer-entry[open]{border-top:1px solid var(--line)}.customer-entry>summary{font:600 29px/1.25 var(--title);color:var(--navy);padding:23px 38px 23px 0;align-items:baseline}.customer-entry>summary:after{top:22px}.customer-date{font:500 12px/1.3 var(--body);letter-spacing:.08em;color:var(--muted);text-transform:uppercase}.customer-entry-body{padding:0 0 28px;display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:start}.customer-description{padding:0}.customer-description h3{font-size:20px;margin:0 0 15px}.customer-description p{font-size:15px;line-height:1.55;margin-bottom:13px}.customer-media{padding:0}.customer-media figure{margin:0}.customer-media img{aspect-ratio:4/3;object-fit:cover;background:var(--soft)}.customer-media figcaption{margin:10px 0 0}.customer-entry[open] .customer-entry-body{animation:customer-body-in .2s ease-out}
.customer-carousel{outline:none}.carousel-stage{background:var(--soft)}.carousel-slide[hidden]{display:none}.carousel-slide img{width:100%;aspect-ratio:4/3;object-fit:cover}.carousel-slide figcaption{min-height:30px}.carousel-controls{display:grid;grid-template-columns:42px auto 1fr 42px;align-items:center;gap:12px;margin-top:14px}.carousel-controls>button{width:42px;height:42px;border:1px solid var(--navy);background:white;color:var(--navy);font-size:20px;line-height:1}.carousel-controls>button:hover{background:var(--navy);color:white}.carousel-count{font-size:12px;color:var(--muted);white-space:nowrap}.carousel-dots{display:flex;justify-content:center;gap:8px}.carousel-dots button{width:8px;height:8px;border:0;border-radius:50%;padding:0;background:#b9c6ce}.carousel-dots button[aria-current="true"]{background:var(--teal);transform:scale(1.25)}
@keyframes customer-body-in{from{opacity:.45;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1050px){.origin-title,.people-intro{grid-template-columns:.34fr 1fr;gap:48px}.origin-narrative{padding-right:40px}.origin-timeline>div{padding:34px 22px}.customer-catalog-grid{grid-template-columns:28% 1fr;gap:38px}.customer-entry-body{grid-template-columns:1fr}.customer-media{max-width:620px}}
@media(max-width:760px){.origin-title,.people-intro{grid-template-columns:1fr;gap:18px;padding-bottom:30px}.origin-title .eyebrow,.people-intro .eyebrow{margin-top:0;grid-row:auto}.origin-evidence{grid-template-columns:1fr}.origin-narrative{padding:30px 0}.origin-timeline{border-left:0;border-top:1px solid var(--line)}.origin-timeline>div{padding:28px 18px 30px 0}.origin-timeline>div+div{padding-left:18px}.origin-timeline span{font-size:36px}.people-panel{padding-top:48px}.people-intro{margin-bottom:28px}.people-principles{grid-template-columns:1fr}.people-principles article,.people-principles article+article{padding:24px 0;border-left:0;border-bottom:1px solid var(--line)}.people-principles article:last-child{border-bottom:0}.customer-catalog-grid{grid-template-columns:1fr;gap:34px}.customer-catalog-grid .relationship-heading>p:last-child{margin-top:18px}.customer-entry>summary{font-size:25px}.customer-entry-body{gap:22px}.carousel-controls{grid-template-columns:42px auto 1fr 42px}}
@media(prefers-reduced-motion:reduce){.customer-entry[open] .customer-entry-body{animation:none}}
.origin-story-simple{max-width:980px;text-align:center;padding-block:100px}.origin-story-simple h2{font-size:clamp(34px,4vw,52px);margin-bottom:40px}.origin-story-copy{max-width:790px;margin-inline:auto;text-align:center}.origin-story-copy .lead{font-size:23px;color:var(--navy);margin:0 0 24px}.origin-story-copy p:not(.lead){font-size:17px;line-height:1.65;color:var(--muted);margin:0 0 18px}.origin-story-copy p:last-child{margin-bottom:0}
.people-band{background:var(--navy);color:white;padding-block:74px}.people-band .people-band-intro{text-align:center;max-width:760px;margin:0 auto 48px}.people-band .eyebrow{justify-content:center;color:#dceaf2}.people-band h2,.people-band h3{color:white}.people-band-intro h2{font-size:clamp(34px,4vw,52px)}.people-band-intro>p:last-child{color:#c9dce7;max-width:650px;margin:20px auto 0}.people-band .people-principles{border-color:#ffffff32}.people-band .people-principles article+article{border-color:#ffffff32}.people-band .people-principles h3{color:white}.people-band .people-principles p{color:#c9dce7}.people-band .people-principles span{color:#63d4d8}
.manufacturing-section{background:white}.manufacturing-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:76px;align-items:center}.manufacturing-photo{margin:0;align-self:stretch;min-height:660px;background:var(--soft);position:relative;overflow:hidden}.manufacturing-photo .image-placeholder{height:100%;min-height:660px}.manufacturing-photo figcaption{position:absolute;left:24px;bottom:20px;z-index:1;color:var(--muted);font-size:13px}.manufacturing-copy>h2{font-size:clamp(34px,3.7vw,49px)}.manufacturing-intro{font-size:17px;color:var(--muted);margin:20px 0 30px}.manufacturing-copy .manufacturing-flow{border-top:0}.manufacturing-copy .manufacturing-flow li{grid-template-columns:42px 1fr;gap:14px;padding:16px 0}.manufacturing-copy .manufacturing-flow li>div{display:grid;grid-template-columns:.72fr 1.28fr;gap:24px}.manufacturing-copy .manufacturing-flow h3{font-size:19px}.manufacturing-copy .manufacturing-flow p{font-size:14px;margin:0}.manufacturing-copy .flow-number{padding-top:5px}
.manufacturing-section+.manufacturing-facts{margin-top:0}.relationships-section{padding-top:92px}.carousel-controls{grid-template-columns:auto 1fr;gap:18px}.carousel-dots{justify-content:flex-end}.customer-carousel:focus-visible{outline:3px solid var(--teal);outline-offset:5px}
@media(max-width:950px){.manufacturing-layout{gap:42px}.manufacturing-photo,.manufacturing-photo img{min-height:570px}.manufacturing-copy .manufacturing-flow li>div{grid-template-columns:1fr;gap:8px}}
@media(max-width:760px){.origin-story-simple{padding-block:62px;text-align:center}.origin-story-simple h2{margin-bottom:28px}.origin-story-copy .lead{font-size:21px}.people-band{padding-block:54px}.people-band .people-band-intro{text-align:left;margin-bottom:30px}.people-band .eyebrow{justify-content:flex-start}.manufacturing-layout{grid-template-columns:1fr;gap:34px}.manufacturing-photo,.manufacturing-photo .image-placeholder{min-height:430px}.manufacturing-copy .manufacturing-flow li>div{grid-column:2}.manufacturing-section+.manufacturing-facts{margin-top:0}.relationships-section{padding-top:58px}.carousel-controls{grid-template-columns:auto 1fr}}
.image-placeholder{display:grid;place-items:center;background:linear-gradient(135deg,#eef1f2 0%,#dfe4e6 100%);color:#7b8991;text-align:center;overflow:hidden}.image-placeholder span{font:600 11px/1.2 var(--title);letter-spacing:.12em;text-transform:uppercase}.image-placeholder-main{width:100%;aspect-ratio:4/3}.story-cta .wrap{text-align:center}.story-cta .eyebrow{justify-content:center}.story-cta p:not(.eyebrow){margin-inline:auto}.story-cta .btn{margin-top:8px}
.hero-main-carousel{position:relative;outline:none}.hero-carousel-stage{width:100%;aspect-ratio:4/3}.hero-carousel-stage .hero-slide{height:100%;aspect-ratio:auto}.hero-slide[hidden]{display:none}.hero-carousel-controls{position:absolute;right:18px;bottom:18px;display:flex;align-items:center;gap:14px;padding:9px 12px;background:#fffffff0;box-shadow:0 4px 16px #0a37631c}.hero-carousel-count{font-size:11px;line-height:1;color:var(--muted)}.hero-carousel-dots{display:flex;align-items:center;gap:8px}.hero-carousel-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#aebcc5}.hero-carousel-dots button[aria-current="true"]{background:var(--teal);transform:scale(1.25)}.hero-main-carousel:focus-visible{outline:3px solid var(--teal);outline-offset:5px}
.story-hero-images{padding:0 0 24px 22px}.hero-factory{box-shadow:0 22px 48px #0a376326;position:relative}.hero-factory:before,.hero-factory:after{content:'';position:absolute;inset:12px -12px -12px 12px;background:#dcebed;z-index:-1}.hero-factory:after{inset:22px -22px -22px 22px;background:#edf4f4;z-index:-2}.hero-slide:not([hidden]){animation:hero-card-in .34s cubic-bezier(.2,.75,.25,1)}@keyframes hero-card-in{from{opacity:.35;transform:translateX(22px) rotate(.45deg)}to{opacity:1;transform:none}}@media(max-width:760px){.story-hero-images{padding:0 16px 22px 0}.hero-factory:before{inset:8px -8px -8px 8px}.hero-factory:after{inset:15px -15px -15px 15px}}@media(prefers-reduced-motion:reduce){.hero-slide:not([hidden]){animation:none}}
.hero-caption[hidden]{display:none}.hero-caption:not([hidden]){animation:hero-caption-in .3s ease-out}@keyframes hero-caption-in{from{opacity:.35;transform:translateX(12px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.hero-caption:not([hidden]){animation:none}}
.hero-carousel-stage{cursor:grab;touch-action:pan-y;user-select:none}.hero-carousel-stage.is-dragging{cursor:grabbing}.hero-carousel-stage.is-dragging .hero-slide{animation:none;transition:none}.standalone-nav{display:flex;align-items:center;gap:32px}.standalone-nav a{white-space:nowrap}@media(max-width:760px){.standalone-nav{width:100%;flex-direction:column;align-items:stretch;gap:0}}

/* ==================================================================
   3. WORDPRESS LAYER — everything below is ours, not the prototype's.
   ================================================================== */

/* ---- Brand / logo ------------------------------------------------
   The logo file is not final yet. The header reserves a fixed slot and
   the image is fitted into it, so dropping a new file in Customizer →
   Site Identity never reflows the header. --logo-h is set inline from
   the Customizer control (default 56px, i.e. 60% of the 92px bar).
   With no logo uploaded the slot falls back to the IFS wordmark that
   the prototype drew in type, so the header is never empty.
   ------------------------------------------------------------------ */
.brand-logo{display:flex;align-items:center;height:var(--logo-h,56px)}
.brand-logo img{max-height:100%;width:auto;max-width:340px;display:block;object-fit:contain}
.footer .brand-logo{height:calc(var(--logo-h,56px) * .78)}
@media(max-width:760px){.brand-logo{height:calc(var(--logo-h,56px) * .78)}
 .brand-logo img{max-width:200px}}

/* ---- Image slots -------------------------------------------------
   The prototype used clickable dashed boxes that opened a Chinese brief
   describing the photo to shoot. Those are authoring scaffolding, not
   site content: here each slot is an ACF image field. The wrapper keeps
   the prototype's .placeholder sizing classes so the layout is identical
   whether or not a photo has been uploaded yet.
   ------------------------------------------------------------------ */
.media{margin:0;padding:0;overflow:hidden;display:block}
.media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.media>.image-placeholder{position:absolute;inset:0;min-height:0;width:auto;height:auto;aspect-ratio:auto}
.media.contain>img{object-fit:contain;background:var(--soft)}

/* ---- Sticky header under the WP admin bar ---- */
.admin-bar .header{top:32px}
@media(max-width:782px){.admin-bar .header{top:46px}}
@media(max-width:600px){.admin-bar .header{top:0}}

/* ---- Menu state ---- */
.header nav a[aria-current=page]{color:#087b80}

/* ---- Form feedback ----------------------------------------------
   The prototype's forms only previewed the text they would have sent.
   These carry a real submission, so they need the states a real form has.
   ------------------------------------------------------------------ */
.form-notice{margin:0 0 20px;padding:14px 18px;border-radius:3px;font-size:16px;line-height:1.5}
.form-notice.ok{background:#e7f6f0;border:1px solid #9ccfbb;color:#14573f}
.form-notice.bad{background:#fbeceb;border:1px solid #e0b3b0;color:#8c231e}
.contact .form-notice.ok{background:#e7f6f0}
.form-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.btn[aria-disabled=true]{opacity:.6;pointer-events:none}
.field-error input,.field-error select,.field-error textarea{border-color:#a72a24!important}

/* ---- Product catalogue: real links, not JS-generated buttons -----
   The prototype built the catalogue and the mega menu from a JS array,
   which means neither existed for a crawler. Both are rendered in PHP
   here, so the anchors below need the look the <button>s had.
   ------------------------------------------------------------------ */
.product-list a{display:flex;justify-content:space-between;gap:8px;text-align:left;text-decoration:none;
 border-bottom:1px solid var(--line);padding:9px 0;width:100%;font-size:15px;color:var(--navy);line-height:1.4}
.product-list a:hover{color:#087b80}
.product-list a span{flex:none}
.category-panel li a{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
 min-height:45px;padding:10px 7px;border-bottom:1px solid #edf1f4;text-decoration:none;color:var(--muted);
 font:16px/1.35 var(--body);transition:background .15s,color .15s,transform .15s}
.category-panel li a i{font-style:normal;color:var(--teal);opacity:0;transition:opacity .15s}
.category-panel li a:hover,.category-panel li a:focus-visible{background:#edf7f7;color:#08666c;transform:translateX(3px)}
.category-panel li a:hover i,.category-panel li a:focus-visible i{opacity:1}

/* ---- About teaser photo on the homepage ---- */
.about-preview-photo{margin:0}
.about-preview-photo img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center}
.about-preview-photo figcaption{font-size:14px;color:var(--muted);margin-top:12px}

/* ---- Empty-section guard ----------------------------------------
   A section whose ACF fields are all blank renders nothing at all rather
   than an empty band of padding.
   ------------------------------------------------------------------ */
.section:empty{display:none}

/* ---- Column counts that survive the mobile breakpoint -----------
   Set as classes, inside a min-width query, so hiding one of the three
   "Working with IFS" columns never wins over the rule that stacks them
   on a phone — which an inline grid-template-columns would.
   ------------------------------------------------------------------ */
@media(min-width:761px){
 .cooperation-grid.cols-1{grid-template-columns:minmax(0,1fr)}
 .cooperation-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
 .people-principles.cols-1{grid-template-columns:minmax(0,1fr)}
 .people-principles.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.footer-legal{display:block;margin-top:6px;font-size:12px;color:#9aaab7}
/* Real photographs in the two About carousels and the manufacturing frame.
   The prototype's slides were grey plates with fixed ratios; an <img> has to be
   told to fill the same box or a portrait photo reflows the whole section. */
.hero-slide>img{display:block;width:100%;height:100%;object-fit:cover}
.manufacturing-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* A story with no photograph yet still needs to occupy the 4:3 frame the real
   one will, or the accordion row collapses to a sliver while the client is
   still gathering images. */
.customer-media>.image-placeholder{width:100%;aspect-ratio:4/3}

/* ---- File upload control -----------------------------------------
   The native <input type="file"> renders its button and "no file chosen"
   text in the BROWSER's language, not the site's — on a Chinese-locale
   machine an English-only B2B page suddenly shows non-English chrome.
   (This file is served to the browser, so the comment stays English too.)
   The input is
   hidden but kept focusable and submitted; the visible control is a
   <label for>, which opens the picker with no JavaScript at all.
   ------------------------------------------------------------------ */
.drawing-file .file-input{position:absolute;width:1px;height:1px;padding:0;margin:0;opacity:0;overflow:hidden;z-index:-1}
.drawing-file .file-label{display:block;font-size:15px;font-weight:600;margin-bottom:8px}
.drawing-file .file-label span{font-weight:400;color:var(--muted)}
.drawing-file .file-field{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.drawing-file .file-button{display:inline-flex;align-items:center;justify-content:center;margin:0;
 min-height:44px;padding:10px 20px;border:1px solid var(--navy);border-radius:3px;
 background:#fff;color:var(--navy);font:600 15px/1.2 var(--body);cursor:pointer;
 transition:background .15s,color .15s}
.drawing-file .file-button:hover{background:var(--navy);color:#fff}
.drawing-file .file-input:focus-visible+.file-button{outline:3px solid var(--teal);outline-offset:4px}
.drawing-file .file-name{min-width:0;font-size:14px;color:var(--muted);overflow-wrap:anywhere}
.drawing-file .file-name.has-file{color:var(--navy);font-weight:600}
.drawing-file .file-name.is-bad{color:#a72a24;font-weight:600}
.drawing-file small{display:block;color:var(--muted);font-size:12px;margin-top:10px}
@media(max-width:400px){.drawing-file .file-field{gap:10px}.drawing-file .file-button{width:100%}}

/* ==================================================================
   4. PRODUCT PAGE — carried over from the CD Weld Pins prototype.
   All of it is scoped to .cd-page (set on <body> for single products),
   so it cannot reach the home or About pages. The prototype's duplicate
   @import line is not copied — the fonts are already enqueued.
   ================================================================== */
.cd-page{font-size:17px}.cd-page h1,.cd-page h2{font-weight:700}.cd-page h1{font-size:64px}.cd-page h2{font-size:40px}.cd-page figure{margin:0;min-width:0}.cd-page figcaption,.cd-small{font-size:14px;color:var(--muted);line-height:1.5}.cd-page figcaption{margin-top:14px}.cd-breadcrumb{display:flex;gap:12px;flex-wrap:wrap;font-size:14px;padding-block:25px;color:var(--muted)}.cd-breadcrumb a{text-underline-offset:3px}.cd-hero{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding-block:20px 64px;align-items:center}.cd-hero-copy>p:not(.eyebrow){color:var(--muted)}.cd-hero-copy .lead{font-size:20px}.cd-placeholder{min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:30px;background:#eaf0f4;color:var(--muted);text-align:center;border-radius:6px}.cd-placeholder strong{color:var(--navy);font-weight:600;font-size:18px}.cd-placeholder small{font-size:13px;max-width:300px}.cd-image-icon{font-size:36px;line-height:1.2;color:#748b9d}.cd-main-image{min-height:440px;background:var(--soft)}.cd-thumbnails{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}.cd-thumbnails button{border:1px solid var(--line);background:white;color:var(--muted);font-size:12px;line-height:1.3;padding:12px 6px;min-height:76px;border-radius:4px}.cd-thumbnails button span{display:block;font-size:22px;margin-bottom:5px}.cd-thumbnails button[aria-pressed=true]{border-color:var(--navy);color:var(--navy);background:var(--soft);box-shadow:inset 0 -2px var(--navy)}.cd-key-specs{display:grid;grid-template-columns:1fr 1fr;margin:28px 0;border-block:1px solid var(--line);padding:20px 0;gap:20px}.cd-key-specs dt{font-size:14px;color:var(--muted)}.cd-key-specs dd{margin:4px 0 0;font:600 32px var(--title);color:var(--navy)}.cd-key-specs dd span{font-size:18px}.cd-key-specs{grid-auto-flow:row dense}.cd-key-specs .is-wide{grid-column:1/-1}.cd-hero-copy .cd-small{margin-bottom:0}.cd-section-nav{background:var(--navy);display:block}.cd-section-nav>.wrap{display:flex;gap:36px;overflow-x:auto;scrollbar-width:thin}.cd-section-nav a{color:white;white-space:nowrap;padding-block:20px;font-size:15px;border-bottom:3px solid transparent}.cd-section-nav a:hover{border-color:var(--teal);color:white}.cd-materials{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-bottom:45px}.cd-materials article{border-top:3px solid var(--teal);padding-top:22px}.cd-materials p{margin-bottom:0;color:var(--muted)}.cd-materials h3{font-size:24px}.cd-spec-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:start}.cd-table-wrap{min-width:0}.cd-page table{border-collapse:collapse;width:100%;font-size:16px;font-variant-numeric:tabular-nums}.cd-page caption{text-align:left;font-weight:600;color:var(--navy);padding:0 0 16px}.cd-page th,.cd-page td{text-align:left;vertical-align:top;border-bottom:1px solid var(--line);padding:15px 14px}.cd-page th{width:38%;font-weight:600;color:var(--navy);padding-left:0}.cd-page td{padding-right:0}.cd-marine{border-top:1px solid var(--line);margin-top:40px;padding-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}.cd-marine h3{font-size:22px}.cd-marine p{margin:8px 0 0;color:var(--muted);font-size:15px}.cd-size-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.cd-size-list span{background:var(--soft);padding:10px;text-align:center;color:var(--navy);font-size:15px;font-variant-numeric:tabular-nums}.cd-two{display:grid;grid-template-columns:1fr 1fr;gap:64px}.cd-two article h3{margin-top:24px}.cd-two article p{margin-bottom:0;color:var(--muted)}.cd-note{border-left:3px solid var(--teal);padding-left:20px;color:var(--muted);margin:36px 0 0;font-size:15px;max-width:920px}.cd-aligned{align-items:center}.cd-solo{max-width:760px}.cd-aligned .cd-placeholder{min-height:370px}.cd-aligned p{color:var(--muted)}.cd-related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;border-top:1px solid var(--line);margin-top:64px;padding-top:42px}.cd-related .cd-placeholder{min-height:205px}.cd-related h3{font-size:24px;margin-top:24px}.cd-related p{color:var(--muted);font-size:16px}.cd-delivery{margin:28px 0}.cd-delivery>div{padding:16px 0;border-bottom:1px solid var(--line)}.cd-delivery dt{display:flex;justify-content:space-between;gap:15px;color:var(--navy);font-weight:600}.cd-delivery strong{white-space:nowrap}.cd-delivery dd{margin:8px 0 0;font-size:15px;color:var(--muted)}.cd-contact{padding-block:80px;background:var(--navy);color:white}.cd-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.cd-contact h2,.cd-contact h3,.cd-contact .eyebrow{color:white}.cd-contact p{color:#e0e9ef}.cd-contact .eyebrow:before{background:var(--teal)}.cd-checklist{border-left:1px solid #66829e;padding-left:42px}.cd-checklist ul{padding-left:20px;line-height:2}.cd-checklist p{font-size:14px;margin-bottom:0}.cd-page :is(a,button,summary):focus-visible{outline:2px solid var(--navy);outline-offset:4px;box-shadow:0 0 0 2px white}.cd-contact a:focus-visible,.cd-section-nav a:focus-visible{outline-color:white}.cd-page .text-link{color:#087b80}.cd-brand-image{width:180px;height:auto;display:block}
@media(max-width:1080px){.cd-hero{gap:36px}.cd-page h1{font-size:52px}.cd-two{gap:36px}.cd-contact-grid{gap:45px}.cd-spec-layout{gap:30px}.cd-section-nav>.wrap{gap:26px}}
@media(max-width:760px){.cd-page .wrap{width:calc(100% - 40px)}.cd-page .section{padding-block:52px}.cd-hero,.cd-spec-layout,.cd-two,.cd-marine,.cd-contact-grid{grid-template-columns:minmax(0,1fr);gap:30px}.cd-hero{padding-block:12px 44px}.cd-hero-copy{grid-row:1}.cd-page h1{font-size:36px}.cd-page h2{font-size:28px}.cd-main-image{min-height:310px}.cd-materials{grid-template-columns:1fr;gap:24px}.cd-materials h3{font-size:22px}.cd-related{grid-template-columns:1fr;gap:34px;margin-top:40px}.cd-related .cd-placeholder{min-height:220px}.cd-section-nav>.wrap{gap:24px}.cd-section-nav a{padding-block:16px}.cd-contact{padding-block:52px}.cd-checklist{padding:28px 0 0;border-left:0;border-top:1px solid #66829e}.cd-page .section-heading{display:block}.cd-page .section-heading>p{margin-top:20px;max-width:none}.cd-page th,.cd-page td{font-size:15px;padding-block:12px}.cd-aligned .cd-placeholder{min-height:270px}.cd-size-list{gap:8px}.cd-size-list span{padding:9px 3px;font-size:14px}.cd-breadcrumb{font-size:12px;gap:8px}.cd-page .faq-intro{position:static}.cd-delivery dt{font-size:16px}.cd-brand-image{width:155px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cd-page *{transition:none!important}}
html:has(.cd-page){scroll-padding-top:calc(var(--cd-header-height,92px) + var(--cd-nav-height,66px) + 20px)}
.cd-page .cd-main-image{aspect-ratio:1 / 1;min-height:0;width:100%}
.cd-section-nav{position:sticky;top:var(--cd-header-height,92px);z-index:9}
.cd-section-nav>.wrap{justify-content:safe center}
.cd-section-nav a{position:relative;text-decoration:none;border-bottom:0}
.cd-section-nav a::after{content:'';position:absolute;left:0;right:0;bottom:12px;height:2px;background:var(--teal);transform:scaleX(0);transition:transform .18s}
.cd-section-nav a[aria-current=location]::after,.cd-section-nav a:hover::after{transform:scaleX(1)}
.cd-spec-overview{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,.85fr);gap:80px;align-items:center;margin-top:56px}
.cd-dimension-stage .cd-placeholder{aspect-ratio:3 / 2;min-height:380px;background:#f8fafb;border-radius:0;padding:56px}
.cd-dimension-stage img{display:block;width:100%;height:auto;max-height:540px;object-fit:contain}
.cd-dimension-stage figcaption{margin-top:20px;max-width:580px}
.cd-material-options>h3{font-size:24px;margin-bottom:32px}
.cd-material-options .cd-materials{display:block;margin:0}
.cd-material-options .cd-materials article{border-top:1px solid var(--line);padding-top:22px;margin-top:24px}
.cd-material-options .cd-materials h3{font:600 18px/1.4 var(--body)}
.cd-material-options .cd-materials p{font-size:16px;margin:10px 0 0}
.cd-spec-details{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:88px;margin-top:80px;padding-top:48px;border-top:1px solid var(--line);align-items:start}
.cd-spec-details .cd-table-wrap>h3,.cd-spec-details .cd-marine h3{font:600 26px/1.25 var(--title);margin:0 0 28px}
.cd-spec-details .cd-marine{display:block;border:0;margin:0;padding:0}
.cd-spec-details .cd-marine p{font-size:16px;margin:0 0 30px;max-width:360px}
.cd-spec-details .cd-size-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.cd-spec-details .cd-size-list span{padding:19px 12px;font-size:18px;background:var(--soft)}
.cd-spec-details th,.cd-spec-details td{padding-block:18px}
@media(max-width:1080px){.cd-spec-overview{gap:40px;grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr)}.cd-dimension-stage .cd-placeholder{min-height:340px;padding:32px}.cd-spec-details{gap:40px}}
@media(max-width:760px){.cd-spec-overview,.cd-spec-details{grid-template-columns:minmax(0,1fr);gap:40px}.cd-spec-overview{margin-top:32px}.cd-dimension-stage .cd-placeholder{min-height:260px;padding:24px}.cd-material-options>h3{margin-bottom:20px}.cd-spec-details{margin-top:48px;padding-top:36px;gap:48px}.cd-spec-details .cd-table-wrap>h3,.cd-spec-details .cd-marine h3{font-size:24px;margin-bottom:24px}.cd-spec-details .cd-size-list{gap:12px}.cd-section-nav>.wrap{width:100%;padding-inline:20px;gap:24px}.cd-section-nav a::after{bottom:9px}}
.cd-material-band{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:56px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cd-material-band>div{display:grid;grid-template-columns:1fr;align-content:start;gap:7px;padding:24px 28px 25px 0}
.cd-material-band>div+div{padding-left:28px;border-left:1px solid var(--line)}
.cd-material-band span{color:var(--muted);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.cd-material-band strong{color:var(--navy);font:600 19px/1.35 var(--title)}
.cd-material-band small{color:var(--muted);font-size:15px;line-height:1.45}
.cd-dimension-stage{margin:72px auto 0;max-width:980px}
.cd-dimension-stage .cd-placeholder{aspect-ratio:16 / 9;min-height:0;background:#f8fafb;border-radius:0;padding:64px}
.cd-dimension-stage img{display:block;width:100%;height:100%;object-fit:contain}
.cd-dimension-stage figcaption{margin:18px auto 0;text-align:center;max-width:620px}
.cd-spec-table{max-width:1040px;margin:72px auto 0;padding-top:44px;border-top:1px solid var(--line)}
.cd-spec-table>h3{font:600 28px/1.25 var(--title);margin:0 0 28px;color:var(--navy)}
.cd-spec-table th{width:31%}
.cd-spec-table th,.cd-spec-table td{padding-top:19px;padding-bottom:19px}
.cd-spec-table .cd-marine-row th,.cd-spec-table .cd-marine-row td{padding-top:27px;padding-bottom:27px}
.cd-marine-row td strong{display:block;color:var(--navy);font-weight:600;line-height:1.55}
.cd-marine-row td small{display:block;margin-top:7px;color:var(--muted);font-size:14px;line-height:1.45}
@media(max-width:760px){.cd-material-band{grid-template-columns:1fr;margin-top:34px}.cd-material-band>div,.cd-material-band>div+div{padding:20px 0;border-left:0;border-top:1px solid var(--line)}.cd-material-band>div:first-child{border-top:0}.cd-dimension-stage{margin-top:48px}.cd-dimension-stage .cd-placeholder{aspect-ratio:4 / 3;padding:24px}.cd-spec-table{margin-top:48px;padding-top:34px}.cd-spec-table>h3{font-size:24px}.cd-spec-table th{width:38%}.cd-spec-table th,.cd-spec-table td{padding-block:14px}.cd-marine-row td strong{line-height:1.7}}
.cd-thumbnails button{aspect-ratio:1 / 1;min-height:0;padding:10px 6px}
.cd-spec-overview{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,.78fr);gap:76px;align-items:center;margin-top:58px}
.cd-spec-overview .cd-dimension-stage{margin:0;max-width:none}
.cd-spec-overview .cd-dimension-stage .cd-placeholder{aspect-ratio:4 / 3;min-height:0;padding:54px}
.cd-material-aside>h3{font:600 24px/1.25 var(--title);color:var(--navy);margin:0 0 26px}
.cd-material-aside .cd-material-band{display:block;margin:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cd-material-aside .cd-material-band>div,.cd-material-aside .cd-material-band>div+div{display:grid;gap:6px;padding:20px 0;border-left:0;border-top:1px solid var(--line)}
.cd-material-aside .cd-material-band>div:first-child{border-top:0}
.cd-material-aside .cd-material-band span{font-size:11px}
.cd-material-aside .cd-material-band strong{font-size:18px}
.cd-material-aside .cd-material-band small{font-size:14px}
.cd-spec-overview+.cd-spec-table{margin-top:76px}
@media(max-width:1080px){.cd-spec-overview{grid-template-columns:minmax(0,1.5fr) minmax(230px,.8fr);gap:42px}.cd-spec-overview .cd-dimension-stage .cd-placeholder{padding:34px}}
@media(max-width:760px){.cd-thumbnails{gap:8px}.cd-thumbnails button{font-size:11px;padding:7px 3px}.cd-thumbnails button span{font-size:19px;margin-bottom:3px}.cd-spec-overview{grid-template-columns:minmax(0,1fr);gap:38px;margin-top:36px}.cd-spec-overview .cd-dimension-stage .cd-placeholder{padding:24px}.cd-material-aside>h3{font-size:22px;margin-bottom:18px}.cd-spec-overview+.cd-spec-table{margin-top:50px}}
.cd-page #product-title,.cd-page .cd-main-image strong{color:#0a3763}
.cd-page{color:#182b3b}
.cd-page #product-title,.cd-page main h2,.cd-page main h3,.cd-page .cd-key-specs dd,.cd-page .cd-spec-table th,.cd-page .cd-material-band strong,.cd-page .cd-placeholder strong{color:#0a3763}
.cd-page .header nav>a,.cd-page .footer nav a{color:#0a3763}
.cd-page .cd-breadcrumb,.cd-page .cd-hero-copy>p,.cd-page .section-heading>p,.cd-page figcaption,.cd-page .cd-small,.cd-page .cd-material-band span,.cd-page .cd-material-band small,.cd-page .cd-related p,.cd-page .faq-intro>p:not(.eyebrow),.cd-page .faq-list p,.cd-page .cd-delivery dd,.cd-page .cd-placeholder{color:#526575}
.cd-page .text-link{color:#087b80}
.cd-page .cd-placeholder{background:#f2f5f7}
.cd-page .cd-dimension-stage .cd-placeholder{background:#f7f9fa;border:1px solid #d8e2e9}
.cd-page .cd-image-icon{color:#748b9d}
.cd-page .cd-section-nav a,.cd-page .cd-contact,.cd-page .cd-contact h2,.cd-page .cd-contact h3,.cd-page .cd-contact .eyebrow{color:#ffffff}
.cd-page .cd-contact p{color:#e0e9ef}
.cd-page .btn{color:#ffffff}
.cd-page .btn.white{color:#0a3763}
.cd-page .btn{background:#0a3763;border-color:#0a3763;color:#ffffff}
.cd-page .btn:hover{background:#082c4f;border-color:#082c4f}
.cd-page .btn.white{background:#ffffff;border-color:#ffffff;color:#0a3763}
.cd-page .btn.white:hover{background:#f2f5f7;border-color:#f2f5f7}
.cd-page .text-link{background:transparent}
.cd-page .cd-thumbnails button{background:#ffffff;border-color:#d8e2e9;color:#526575}
.cd-page .cd-thumbnails button[aria-pressed=true]{background:#f2f5f7;border-color:#0a3763;color:#0a3763;box-shadow:inset 0 -2px #0a3763}
.cd-page .soft{background:#f2f5f7}
.cd-page .soft .cd-placeholder{background:#ffffff;border:1px solid #d8e2e9}
.cd-page .cd-key-specs,.cd-page .cd-related,.cd-page .cd-material-band,.cd-page .cd-spec-table{border-color:#d8e2e9}
.cd-page th,.cd-page td{border-color:#d8e2e9}
.cd-page .faq-list,.cd-page .faq-list details{border-color:#bfcbd3}
.cd-page .cd-section-nav,.cd-page .cd-contact{background:#0a3763}
.cd-page .cd-spec-table{border-top-color:#bfcbd3}
.cd-page .cd-spec-table>h3{padding-bottom:22px;border-bottom:1px solid #bfcbd3}
.cd-page .cd-contact .form{color:#182b3b}
.cd-page .cd-contact .form p,.cd-page .cd-contact .form small{color:#526575}
.cd-page .cd-contact .form .error{color:#a72a24}

/* ==================================================================
   5. FAMILY LISTING PAGE
   ==================================================================
   Drawn from the listing design. No prototype HTML came with it, so this is
   ours — built from the same tokens as everything else (--navy, --teal,
   --line, --soft, Barlow headings) so it sits in the same system rather than
   beside it. Scoped to .cat-page on <body>.
   ================================================================== */

/* ---- Navy title band ---- */
.cat-banner{background:var(--navy);color:#fff;padding-block:15px}
.cat-banner h1{color:#fff;font-size:clamp(20px,2.1vw,25px);font-weight:600;text-align:center;letter-spacing:-.01em}

/* ---- Two columns: other families, then the product grid ---- */
.cat-layout{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr);gap:56px;padding-block:14px 72px;align-items:start}

/* The sidebar is the site's cross-family navigation: a buyer who landed on
   pins from search is one click from washers. Sticky so it stays reachable
   next to a long grid. */
.cat-sidebar{position:sticky;top:120px;background:var(--soft);padding:26px 22px;border-radius:2px}
.cat-sidebar>section+section{margin-top:30px}
.cat-sidebar h2{font-size:19px;line-height:1.25;margin-bottom:6px}
.cat-sidebar h2 a{text-decoration:none}
.cat-sidebar h2 a:hover{color:#087b80}
.cat-sidebar ul{list-style:none;margin:0;padding:0}
.cat-sidebar li a{display:block;padding:10px 0;border-bottom:1px solid #dde5ea;color:var(--muted);
 font-size:14px;line-height:1.35;text-decoration:none;transition:color .15s,padding-left .15s}
.cat-sidebar li:last-child a{border-bottom:0}
.cat-sidebar li a:hover{color:#087b80;padding-left:4px}
.cat-sidebar li a[aria-current=page]{color:var(--navy);font-weight:600}

/* ---- Product cards ---- */
.cat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 28px}
.cat-card{display:flex;flex-direction:column;text-decoration:none;color:inherit;
 border:1px solid transparent;border-radius:2px;transition:border-color .15s,box-shadow .15s}
.cat-card:hover,.cat-card:focus-visible{border-color:var(--teal);box-shadow:0 12px 30px #0a376314}
.cat-card:focus-visible{outline:none}
.cat-card-media{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#fff}
.cat-card-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:14px}
.cat-card-media .image-placeholder{position:absolute;inset:0;min-height:0;width:auto;aspect-ratio:auto}
.cat-card-body{padding:0 14px 16px}
.cat-card h3{font-size:15px;line-height:1.3;padding-bottom:9px;border-bottom:2px solid var(--navy)}
.cat-card:hover h3{color:#087b80}
.cat-card dl{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;margin:11px 0 0;font-size:13px}
.cat-card dt{color:var(--muted)}
.cat-card dd{margin:0;text-align:right;color:var(--muted)}

/* ---- Copy under the grid ---- */
.cat-intro{padding-block:44px 76px;border-top:1px solid var(--line)}
.cat-intro p{max-width:860px;color:var(--muted);font-size:16px;margin:0 0 20px}
.cat-intro p:last-child{margin-bottom:0}
.cat-empty{grid-column:1/-1;color:var(--muted);margin:0;padding:40px 0}

@media(max-width:1080px){
 .cat-layout{grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:34px}
 .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 /* The sidebar is cross-navigation, not a filter — on a phone it belongs
    after the products the visitor came for, not above them. */
 .cat-layout{grid-template-columns:minmax(0,1fr);gap:40px;padding-bottom:48px}
 .cat-sidebar{position:static;order:2}
 .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
 .cat-card-body{padding:0 8px 12px}
 .cat-card h3{font-size:14px}
 .cat-intro{padding-block:34px 52px}
 .cat-banner{padding-block:12px}
}
@media(max-width:420px){.cat-grid{grid-template-columns:minmax(0,1fr)}}

/* ---- Product page bits the prototype drew as placeholders ---- */
.cd-page .cd-main-image img,.cd-page .cd-thumbnails img{display:block;width:100%;height:100%;object-fit:contain}
.cd-main-stage{position:relative;width:100%;aspect-ratio:1/1;background:var(--soft);overflow:hidden}
.cd-main-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:22px}
.cd-main-stage>img[hidden]{display:none}
.cd-main-stage .image-placeholder{position:absolute;inset:0;min-height:0;width:auto;aspect-ratio:auto}
.cd-thumbnails button{position:relative;overflow:hidden}
.cd-thumbnails button img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:8px}
.cd-thumbnails button span.cd-thumb-label{position:relative;z-index:1}
.cd-thumbnails button:has(img) span.cd-thumb-label{position:absolute;left:-9999px}
.cd-placeholder>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:16px}
.cd-placeholder{position:relative;overflow:hidden}
.cd-page .cd-section-nav a{white-space:nowrap}
.cat-family-block+.cat-family-block{margin-top:64px;padding-top:56px;border-top:1px solid var(--line)}
.cat-family-block .section-heading h2 a{text-decoration:none}
.cat-family-block .section-heading h2 a:hover{color:#087b80}
@media(max-width:760px){.cat-family-block+.cat-family-block{margin-top:40px;padding-top:36px}}
/* One of the drawing / material pair missing: don't hold a column open for it. */
.cd-spec-overview.is-single{grid-template-columns:minmax(0,1fr);gap:0}
.cd-spec-overview.is-single .cd-material-aside{max-width:760px}

/* The product page's second sticky bar sits directly under the header. With the
   WordPress admin bar the header starts 32px down, so the bar has to follow it
   or it parks behind the header for everyone who is logged in — which, for the
   next few weeks, is everyone filling these pages in. */
.admin-bar .cd-section-nav{top:calc(var(--cd-header-height,92px) + 32px)}
@media(max-width:782px){.admin-bar .cd-section-nav{top:calc(var(--cd-header-height,92px) + 46px)}}
@media(max-width:600px){.admin-bar .cd-section-nav{top:var(--cd-header-height,92px)}}

/* ==================================================================
   BLOG — /blog/, its categories, and single articles
   ================================================================== */
.blog-page .cd-breadcrumb{color:#526575}
.blog-head{padding:24px 0 48px}
.blog-head>*{max-width:860px}
.blog-head .lead{color:var(--muted);max-width:640px}
.blog-list{display:grid;gap:0;padding-bottom:80px}
.blog-card{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;padding-block:36px;border-top:1px solid var(--line);text-decoration:none;align-items:center}
.blog-card:last-child{border-bottom:1px solid var(--line)}
.blog-card-media{aspect-ratio:4/3;background:var(--soft);overflow:hidden}
.blog-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.blog-card:hover .blog-card-media img{transform:scale(1.03)}
.blog-card-media .image-placeholder{height:100%;min-height:0;display:flex;align-items:center;justify-content:center;color:#9aacba;font:600 28px var(--title)}
.blog-card h2{font-size:clamp(26px,2.4vw,34px)}
.blog-card-body>p:not(.blog-meta){color:var(--muted);font-size:17px}
.blog-card:hover h2{color:#087b80}
.blog-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:#526575;margin:0 0 14px}
.blog-meta span:first-child:not(:only-child){color:var(--navy);font-weight:600}
.blog-empty{color:var(--muted);padding:40px 0}
.blog-pagination{padding-bottom:70px}
.blog-pagination .nav-links{display:flex;gap:16px;align-items:center}
.blog-pagination .page-numbers{font-weight:600;text-decoration:none}
.blog-pagination .current{color:var(--teal)}

.blog-article-head{max-width:760px;padding:12px 0 36px}
.blog-article-head .eyebrow a{text-decoration:none}
.blog-article-head h1{font-size:clamp(34px,3.6vw,52px)}
.blog-article-head .blog-meta{margin-top:24px;font-size:15px}
.blog-article-head .blog-meta span:first-child{color:var(--ink);font-weight:600}
.blog-cover{margin-block:0 56px}
.blog-cover img{width:100%;max-height:640px;object-fit:cover;display:block}
.blog-cover figcaption,.blog-prose figcaption{font-size:14px;color:#526575;margin-top:10px}

.blog-prose{max-width:760px;font-size:19px;line-height:1.7}
.blog-prose>*:first-child{margin-top:0}
.blog-prose p{margin:0 0 24px}
.blog-prose h2{font-size:clamp(28px,2.6vw,36px);margin:64px 0 20px;scroll-margin-top:110px}
.blog-prose h3{font-size:23px;margin:40px 0 12px;scroll-margin-top:110px}
.blog-prose a:not(.text-link){color:#087b80;text-underline-offset:3px}
.blog-prose ul,.blog-prose ol{padding-left:1.3em;margin:0 0 28px}
.blog-prose li{margin-bottom:10px}
.blog-prose ol>li::marker{color:var(--teal);font-weight:700}
.blog-prose strong{color:var(--navy)}
.blog-prose figure{margin:40px 0}
.blog-prose figure img,.blog-prose .wp-block-image img{width:100%;height:auto;display:block}
.blog-prose .wp-block-gallery{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.blog-prose .wp-block-gallery figure{margin:0}
.blog-prose table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.5}
.blog-prose .wp-block-table{margin:32px 0;overflow-x:auto}
/* WordPress's table block draws a dark box round every cell and a 3px rule under the head; the site's tables are horizontal rules only. */
.blog-prose .wp-block-table th,.blog-prose .wp-block-table td,.blog-prose th,.blog-prose td{text-align:left;vertical-align:top;padding:12px 14px;border:0;border-bottom:1px solid var(--line)}
.blog-prose .wp-block-table thead{border-bottom:0}
.blog-prose tbody th{color:var(--navy);font-weight:600;width:38%}
.blog-prose thead th{background:var(--navy);color:#fff;font-weight:600}
.blog-prose tbody tr:nth-child(even){background:var(--soft)}
.blog-prose blockquote,.blog-prose .ifs-answer{margin:0 0 36px;padding:22px 26px;background:var(--soft);border-left:4px solid var(--teal)}
.blog-prose blockquote p:last-child,.blog-prose .ifs-answer p:last-child{margin-bottom:0}
.blog-prose .ifs-answer p{font-size:20px;color:var(--navy)}
.blog-faq{margin-top:40px}
.blog-author{display:grid;grid-template-columns:96px 1fr;gap:24px;align-items:start;margin:24px 0 88px;padding-top:32px;border-top:1px solid var(--line)}
.blog-author img,.blog-author-initials{width:96px;height:96px;border-radius:50%;object-fit:cover}
.blog-author-initials{display:flex;align-items:center;justify-content:center;background:var(--navy);color:#fff;font:600 32px var(--title)}
.blog-author p{font-size:16px;color:var(--muted);margin:0 0 12px}
.blog-author .blog-author-label{font-size:12px;letter-spacing:.13em;text-transform:uppercase;margin-bottom:4px}
.blog-author .blog-author-name{font:600 24px var(--title);color:var(--navy)}
.blog-author-name span{font-weight:500;color:var(--muted);font-size:18px}
@media(max-width:760px){
  .blog-head{padding-bottom:32px}
  .blog-card{grid-template-columns:minmax(0,1fr);gap:20px;padding-block:28px}
  .blog-prose{font-size:18px}
  .blog-prose h2{margin-top:48px}
  .blog-prose .wp-block-gallery{grid-template-columns:1fr}
  .blog-cover{margin-bottom:36px}
  .blog-author{grid-template-columns:64px 1fr;gap:16px}
  .blog-author img,.blog-author-initials{width:64px;height:64px;font-size:22px}
}
.blog-toc{margin:8px 0 40px;padding:22px 26px;border:1px solid var(--line)}
.blog-toc-title{font-size:12px!important;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:var(--navy);margin:0 0 10px!important}
.blog-toc ol{margin:0;padding-left:1.3em;columns:2;column-gap:32px;font-size:16px;line-height:1.5}
.blog-toc li{margin-bottom:8px;break-inside:avoid}
.blog-toc a{color:var(--ink)!important;text-decoration:none}
.blog-toc a:hover{color:#087b80!important;text-decoration:underline}
@media(max-width:760px){.blog-toc ol{columns:1}}

/* ==================================================================
   CONTACT PAGE — page-contact.php
   ==================================================================
   No prototype for this page; built from the same tokens and marks as the
   rest (the skewed teal tick of .eyebrow, the ruled numbered row of the
   About principles) so it reads as part of the same site.
   ================================================================== */
.ct-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:72px;align-items:start;padding-block:24px 96px}
.ct-hero h1{font-size:clamp(42px,4.6vw,66px);line-height:1.05;letter-spacing:-.03em}
.ct-hero .lead{color:var(--muted);max-width:540px;margin:28px 0 32px}
.ct-assure{list-style:none;padding:26px 0 0;margin:44px 0 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px 28px;font-size:15px;font-weight:600;color:var(--navy)}
.ct-assure li{display:flex;align-items:center;gap:10px}
.ct-assure li:before{content:'';width:7px;height:11px;background:var(--teal);transform:skew(-24deg);flex:none}

/* The card is where a visitor who does not want a form looks first. */
.ct-card{background:var(--soft);padding:34px 36px 32px;border-top:4px solid var(--teal);border-radius:2px}
.ct-card h2{font-size:24px;margin-bottom:6px}
.ct-channels{margin:0}
.ct-channels>div{display:grid;grid-template-columns:128px minmax(0,1fr);gap:16px;align-items:baseline;padding-block:15px;border-bottom:1px solid var(--line)}
.ct-channels dt{font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.ct-channels dd{margin:0;font-size:18px;font-weight:600;color:var(--navy);line-height:1.4;overflow-wrap:anywhere}
.ct-channels a{text-decoration:none}
.ct-channels a:hover{color:#087b80;text-decoration:underline;text-underline-offset:4px}
.ct-person{display:grid;grid-template-columns:64px minmax(0,1fr);gap:18px;align-items:center;margin-top:24px}
.ct-person img,.ct-person-initials{width:64px;height:64px;border-radius:50%;object-fit:cover}
.ct-person-initials{display:flex;align-items:center;justify-content:center;background:var(--navy);color:#fff;font:600 22px var(--title)}
.ct-person p{margin:0}
.ct-person .ct-person-label{font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.ct-person .ct-person-name{font:600 20px/1.3 var(--title);color:var(--navy);margin:2px 0 4px}
.ct-person-name span{font-weight:500;font-size:16px;color:var(--muted)}
.ct-person .text-link{font-size:15px}

/* Checklist beside the form, on the navy band. */
.contact-include{max-width:420px;margin-top:34px;padding-top:26px;border-top:1px solid #ffffff2e}
.contact-include h3{color:#fff;font-size:18px;letter-spacing:0;margin-bottom:10px}
.contact-include ul{list-style:none;padding:0;margin:0 0 32px}
.contact-include li{position:relative;padding:6px 0 6px 22px;font-size:16px;line-height:1.45;color:#dce7ee}
.contact-include li:before{content:'';position:absolute;left:2px;top:13px;width:6px;height:9px;background:var(--teal);transform:skew(-24deg)}
.contact-page-form .drawing-file{margin-top:4px}

/* What happens next */
.ct-steps-intro{margin-bottom:40px}
.ct-steps-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--line)}
.ct-steps-list li{padding:32px 32px 36px 0}
.ct-steps-list li+li{border-left:1px solid var(--line);padding-left:32px}
.ct-steps-list span{font:600 12px/1 var(--title);letter-spacing:.12em;color:var(--teal)}
.ct-steps-list h3{font-size:22px;margin-top:18px}
.ct-steps-list p{font-size:16px;line-height:1.55;color:var(--muted);margin:12px 0 0}

@media(max-width:1000px){.ct-hero{gap:40px}}
@media(max-width:760px){
  .ct-hero{grid-template-columns:minmax(0,1fr);gap:40px;padding-block:4px 64px}
  .ct-assure{flex-direction:column;gap:10px;margin-top:32px}
  .ct-card{padding:28px 22px 26px}
  .ct-channels>div{grid-template-columns:minmax(0,1fr);gap:4px}
  .ct-steps-list{grid-template-columns:minmax(0,1fr)}
  .ct-steps-list li,.ct-steps-list li+li{padding:26px 0;border-left:0}
  .ct-steps-list li+li{border-top:1px solid var(--line)}
}

/* Product hero with nothing entered yet between the title and the button (no
   lead, intro or key specs): .actions has no margin of its own — on a filled
   product the gap comes from the paragraph or spec table above it — so the
   64px title's descenders ran into the button. Same 28px the spec table uses. */
.cd-hero-copy>h1+.actions{margin-top:28px}

/* ==================================================================
   PRODUCT PAGE — real photographs fill their frames
   ==================================================================
   The prototype's frames were sized for grey placeholders: a fixed height,
   padding, a tinted or bordered box, and the image "contained" inside. Once a
   photo at the recommended size is uploaded, that box showed as a band of
   background colour round it. A frame holding a photo (.has-image) now takes
   the photo's own proportions (set inline from the attachment) and the photo
   fills it edge to edge. Empty frames keep the placeholder look.
   ================================================================== */
.cd-main-stage.has-image{background:none}
.cd-main-stage.has-image>img{padding:0;object-fit:cover}
.cd-thumbnails button:has(img){padding:0}
.cd-thumbnails button img{padding:0;object-fit:cover}
/* Scoped under .cd-page on purpose: the dimension drawing's frame is styled by
   three-class selectors (.cd-spec-overview .cd-dimension-stage …, .cd-page
   .cd-dimension-stage …) that a two-class rule loses to, whatever its order. */
.cd-page .cd-placeholder.has-image{padding:0;min-height:0;background:none;border:0;border-radius:0}
.cd-page .cd-placeholder.has-image>img{position:static;display:block;width:100%;height:100%;max-height:none;padding:0;object-fit:cover}

/* ---- Compatibility: other products' cards --------------------------
   Square, like the product's own gallery, so the photo is shown exactly as
   it is on that product's page. */
.cd-related-media{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:var(--soft)}
.cd-related-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.cd-related-media .image-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
 padding:20px;text-align:center;font:600 18px/1.3 var(--title);color:var(--navy)}
.cd-related article:hover .cd-related-media img{transform:scale(1.03)}
.cd-related h3 a{text-decoration:none}
.cd-related h3 a:hover{color:#087b80}
/* The pressed thumbnail's inset underline is painted beneath a full-bleed photo; ring it instead. */
.cd-thumbnails button[aria-pressed=true]:has(img){box-shadow:0 0 0 2px var(--navy)}

/* === Footer (2026-10-09) ===
   Light on purpose: every page ends on the navy enquiry block, so the footer
   is the soft grey that closes the page below it. Columns collapse 4 → 3+1 → 2. */
.ft{background:var(--soft);color:var(--ink);border-top:3px solid var(--teal)}
.ft-main{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,.8fr) minmax(0,1.25fr);gap:56px;padding-block:64px 52px}
.ft .brand-logo{height:calc(var(--logo-h,56px) * .85)}
.ft .brand-logo img{height:100%;width:auto}
.ft-about{color:var(--muted);font-size:15px;line-height:1.6;max-width:360px;margin:22px 0 0}
.ft-facts{display:flex;flex-wrap:wrap;gap:14px 30px;margin:26px 0 0;padding-top:22px;border-top:1px solid var(--line);max-width:420px}
.ft-facts div{min-width:0}
.ft-facts dt{font:700 22px/1.1 var(--title);color:var(--navy)}
.ft-facts dd{margin:4px 0 0;font-size:12.5px;line-height:1.35;color:var(--muted);max-width:120px}
.ft-social{list-style:none;display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:24px 0 0}
.ft-social a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--line);border-radius:50%;color:var(--navy);text-decoration:none;transition:color .15s,border-color .15s}
.ft-social a:hover{color:#087b80;border-color:#087b80}
.ft-title{display:flex;align-items:center;gap:10px;font:600 12px/1.2 var(--body);letter-spacing:.13em;text-transform:uppercase;color:var(--navy);margin:8px 0 22px}
.ft-title:before{content:'';width:7px;height:11px;background:var(--teal);transform:skew(-24deg);flex:none}
.ft-col ul{list-style:none;padding:0;margin:0;display:grid;gap:13px}
.ft-col a{color:var(--ink);text-decoration:none;font-size:15px;line-height:1.35}
.ft-col a:hover,.ft-col a[aria-current]{color:#087b80;text-decoration:underline;text-underline-offset:4px}
.ft-contact-list li{display:grid;grid-template-columns:17px 1fr;gap:11px;align-items:start;font-size:15px;line-height:1.4;overflow-wrap:anywhere}
.ft-contact-list .ft-ico{color:var(--teal);margin-top:1px}
.ft-contact-list a{color:var(--navy);font-weight:600}
.ft-response{font-size:13.5px;color:var(--muted);margin:16px 0 0}
.ft .ft-cta{font-size:15px;margin-top:18px}
.ft-bottom{border-top:1px solid var(--line)}
.ft-bottom-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 30px;padding-block:20px;font-size:13px;color:var(--muted)}
.ft-copy{margin:0}
.ft-legal{list-style:none;display:flex;flex-wrap:wrap;gap:8px 24px;padding:0;margin:0}
.ft-legal a{color:var(--muted);text-decoration:none}
.ft-legal a:hover{color:var(--navy);text-decoration:underline}
.ft :is(a):focus-visible{outline:2px solid var(--navy);outline-offset:3px}
@media(max-width:1100px){.ft-main{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 36px}.ft-brand{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px;align-items:start}.ft-brand>.brand{grid-column:1}.ft-about{grid-column:1;max-width:none}.ft-facts{grid-column:2;grid-row:1/span 3;margin:0;padding:0 0 0 32px;border:0;border-left:1px solid var(--line);align-self:center}}
@media(max-width:760px){.ft-main{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px 24px;padding-block:48px 40px}.ft-brand{display:block}.ft-facts{margin-top:24px;padding:20px 0 0;border:0;border-top:1px solid var(--line)}.ft-contact{grid-column:1/-1}.ft-bottom-inner{flex-direction:column;align-items:flex-start}}
/* The theme styles every <nav> as a centred flex row and every page type sizes
   its own h2 (.cd-page h2 is 40px). Footer columns are navs with an h2 inside,
   so they need to say what they are with a little more weight than that. */
.ft .ft-col{display:block}
.ft .ft-title{font:600 12px/1.2 var(--body);letter-spacing:.13em;text-transform:uppercase;color:var(--navy);margin:8px 0 22px}
.ft .ft-col a{font-weight:400;font-size:15px}
.ft .ft-contact-list a{font-weight:600}
.ft .ft-facts{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:12px 26px}
.ft .ft-facts dd{max-width:118px}
@media(max-width:1100px){.ft .ft-facts{grid-template-columns:repeat(3,auto)}}
@media(max-width:760px){.ft .ft-facts{grid-template-columns:repeat(3,auto)}}
/* Generic pages (privacy policy, terms): article type, a little smaller. */
.page-prose{margin-top:28px;font-size:17px}
.page-prose h2{font-size:26px;margin:48px 0 14px}
.page-prose h3{font-size:20px;margin:28px 0 10px}
.page-prose .page-updated{color:var(--muted);font-size:15px}

/* === Floating WhatsApp button (2026-10-09) ===
   Above the sticky header (10), below the toast (30). Phones: 56px round icon;
   from 761px the label appears in a pill. Clears the iPhone home indicator. */
.wa-float{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));z-index:25;display:inline-flex;align-items:center;justify-content:center;gap:10px;width:56px;height:56px;border-radius:50%;background:#25d366;color:#fff;text-decoration:none;box-shadow:0 6px 18px #0a376333,0 2px 6px #0a37631f;transition:transform .15s,box-shadow .15s}
.wa-float:hover{transform:translateY(-2px);box-shadow:0 10px 24px #0a376340,0 3px 8px #0a376326;color:#fff}
.wa-float:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.wa-float-icon{flex:none}
.wa-float-label{display:none;font:600 15px/1 var(--body);white-space:nowrap}
@media(min-width:761px){.wa-float:not(.is-icon){width:auto;height:52px;padding:0 22px 0 16px;border-radius:26px;right:max(28px,env(safe-area-inset-right));bottom:28px}.wa-float:not(.is-icon) .wa-float-label{display:inline}}
@media(max-width:760px){.ft-bottom-inner{padding-bottom:88px}}
@media print{.wa-float{display:none}}
.header nav>a{white-space:nowrap}
/* Contact card at tablet width: the two-column hero leaves the card ~300px,
   too narrow for a 128px label column, so labels sit above values as on phones.
   Break long values only where they would overflow, never mid-word by default. */
.ct-channels dd{overflow-wrap:break-word}
@media(min-width:761px) and (max-width:1100px){.ct-channels>div{grid-template-columns:minmax(0,1fr);gap:4px}.ct-card{padding:30px 26px 28px}}

/* Product pages on phones (2026-10-20): main image above the title, and the
   section bar fitted to one screen width with short labels instead of a row
   that scrolls sideways. */
.cd-section-nav .nav-short{display:none}
@media(max-width:760px){
  .cd-hero-copy{grid-row:auto}
  .cd-hero{gap:22px}
  .cd-section-nav>.wrap{justify-content:space-between;gap:6px;padding-inline:14px;overflow-x:visible}
  .cd-section-nav a{font-size:clamp(12.5px,3.7vw,14.5px);padding-block:14px}
  .cd-section-nav a::after{bottom:8px}
  .cd-section-nav .nav-full{display:none}
  .cd-section-nav .nav-short{display:inline}
}
