/*
Theme Name: Coppice Sirane
Theme URI: https://www.sirane.com
Author: Coppice Sirane / Jake Walter
Description: Custom classic theme for the Coppice Sirane website. Product-catalogue focused, with templates for the homepage, product pages and category archives. Built from the approved design mockup.
Version: 0.2.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: coppice-sirane
*/

:root{
  --navy:#0a2a5e;
  --navy-dark:#071f47;
  --blue:#1a73c2;
  --blue-bright:#2b8fd8;
  --blue-light:#eef5fb;
  --green:#4a9b3f;
  --green-dark:#3d7c33;
  --teal:#2f9e8f;
  --gold:#c2922e;
  --orange:#e8821e;
  --ink:#1c2a3a;
  --grey:#5c6b7a;
  --line:#e3e9f0;
  --radius:14px;
  --max:1180px;
  font-feature-settings:"kern";
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

/* Branded site search */
.site-search{display:flex;align-items:center;margin-left:14px;border:1px solid var(--line);border-radius:999px;background:#fff;overflow:hidden;min-width:210px}
.site-search input{width:174px;border:0;outline:0;padding:10px 2px 10px 14px;font:inherit;font-size:12.5px;color:var(--ink);background:transparent}
.site-search button{width:38px;height:38px;border:0;background:transparent;color:var(--navy);cursor:pointer;font-size:14px}
.site-search:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,115,194,.12)}
.cs-search-page .search-hero{padding:58px 0 62px;background:linear-gradient(135deg,#eef5fb,#f7fbfe 58%,#edf6ec)}
.cs-search-page .search-hero h1{color:var(--navy);font-size:46px;line-height:1.08;margin:8px 0 12px}.cs-search-page .search-hero p:not(.eyebrow){color:var(--grey);font-size:16px;max-width:650px}
.search-page-form{display:flex;gap:10px;margin-top:24px;max-width:760px}.search-page-form input{flex:1;min-width:0;border:1px solid #cbd9e6;border-radius:9px;padding:13px 16px;font:inherit;background:#fff}.search-page-form input:focus{outline:3px solid rgba(26,115,194,.14);border-color:var(--blue)}
.search-results{padding:58px 0 76px}.search-summary{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:26px}.search-summary h2{color:var(--navy);font-size:28px}.search-summary span{color:var(--grey);font-size:13px}
.search-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.search-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 24px rgba(20,48,76,.06)}.search-card-media{height:190px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#e7f0f7,#d9e8f3);color:var(--navy);font-weight:800}.search-card-media img{width:100%;height:100%;object-fit:cover}.search-card-body{padding:21px}.search-type{display:block;color:var(--blue);font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;margin-bottom:8px}.search-card h3{font-size:19px;line-height:1.25;margin-bottom:9px}.search-card h3 a{color:var(--navy)}.search-card p{color:var(--grey);font-size:13.5px;line-height:1.55;margin-bottom:15px}.search-card .arrow{color:var(--blue);font-size:13px;font-weight:800}.search-empty{padding:48px;border-radius:15px;background:var(--blue-light);text-align:center}.search-empty h2{color:var(--navy);margin-bottom:8px}.search-empty p{color:var(--grey);margin-bottom:20px}
@media(max-width:1080px){.site-search{min-width:44px}.site-search input{width:120px}.search-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:880px){.site-search{display:flex;margin-left:auto;min-width:150px}.site-search input{width:112px}.menu-toggle{margin-left:0}.search-grid{grid-template-columns:1fr}.cs-search-page .search-hero h1{font-size:36px}}
@media(max-width:620px){.site-header .nav{gap:10px}.site-header .nav .logo img,.site-header .nav .custom-logo{max-width:130px}.site-search{min-width:126px}.site-search input{width:88px;padding-left:10px}}
@media(max-width:420px){.site-header .nav .logo img,.site-header .nav .custom-logo{max-width:112px}.site-search{min-width:108px}.site-search input{width:70px;font-size:11.5px}}
@media(max-width:560px){.search-page-form{display:block}.search-page-form .btn{margin-top:10px;width:100%}.search-empty{padding:34px 20px}}
body{
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);line-height:1.55;background:#fff;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
h1,h2,h3{line-height:1.15;letter-spacing:-.01em}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;padding:12px 20px;border-radius:8px;transition:.2s;cursor:pointer;border:none}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-dark)}
.btn-outline{background:#fff;color:var(--ink);border:1.5px solid var(--line)}
.btn-outline:hover{border-color:var(--navy)}
.arrow::after{content:"\2192";font-weight:700}
.link{color:var(--ink);font-weight:600;font-size:14px;display:inline-flex;gap:6px;align-items:center}
.link::after{content:"\2192";color:var(--blue);transition:.2s}
.link:hover::after{transform:translateX(3px)}

/* HEADER */
header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.topbar{background:#f4f8fc;border-bottom:1px solid var(--line);font-size:13px}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;height:42px}
.topbar-left{display:flex;gap:24px}
.topbar-left a{display:flex;align-items:center;gap:7px;color:var(--grey);font-weight:500}
.topbar-left a:hover{color:var(--blue)}
.topbar-left svg{width:15px;height:15px}
.topbar-right{display:flex;align-items:center;gap:14px}
.btn-sm{padding:7px 15px;font-size:13px;border-radius:7px}
.basket{display:flex;align-items:center;gap:6px;color:var(--grey);font-size:12.5px}
.basket b{color:var(--navy)}.basket svg{width:18px;height:18px}
.nav{display:flex;align-items:center;gap:26px;height:72px;position:relative}
.logo img{height:40px;width:auto;display:block}
.site-header .nav .logo img,.site-header .nav .custom-logo{height:44px !important;width:auto !important;max-width:200px;object-fit:contain}
.site-header .nav .custom-logo-link{display:block;line-height:0}
nav.menu{display:flex;gap:4px;margin-left:14px;height:72px}
.nav-item{position:relative;display:flex;align-items:center;gap:5px;height:72px;padding:0 9px;font-size:14.5px;font-weight:600;color:var(--ink);cursor:pointer}
.nav-item:hover{color:var(--blue)}
.nav-item > span{display:flex;align-items:center;gap:5px}
.caret{font-size:9px;color:var(--grey)}
.dropdown{position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--line);border-top:2px solid var(--blue);box-shadow:0 18px 36px rgba(10,42,94,.12);padding:24px;display:none;z-index:70;border-radius:0 0 12px 12px}
.nav-item:hover > .dropdown{display:block}
.nav-item.has-mega{position:static}
.dropdown.mega{left:0;right:0}
.mega-grid{display:grid;gap:22px}
.m5{grid-template-columns:repeat(5,1fr)}
.m3{grid-template-columns:repeat(3,1fr)}
.col h5{font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--navy);font-weight:800;margin-bottom:11px}
.col a{display:block;font-size:12.7px;color:var(--grey);padding:4px 0;font-weight:500}
.col a:hover{color:var(--blue)}
.col a.ov{color:var(--blue);font-weight:700;margin-bottom:5px}
.dropdown.small{width:250px;padding:12px}
.dropdown.small a{display:block;font-size:13.5px;color:var(--ink);padding:8px 10px;border-radius:7px;font-weight:500}
.dropdown.small a:hover{background:#f4f8fc;color:var(--blue)}
.menu-toggle{display:none;background:none;border:none;font-size:26px;color:var(--navy);cursor:pointer;margin-left:auto}

/* HERO SLIDER */
.hero{position:relative;overflow:hidden;padding:0}
.slide{display:none}
.slide.active{display:block}
.slide-inner{padding:46px 0 26px}
.s-abs{background:linear-gradient(180deg,#eaf3fb,#f4f9fd)}
.s-board{background:linear-gradient(180deg,#faf4e7,#fbf9f4)}
.s-board .eyebrow{color:var(--gold)}
.s-board h1 span{color:var(--gold)}
.s-board .feature .fi{color:var(--gold)}
.hero-visual{position:relative;display:flex;flex-direction:column;gap:13px;align-items:center;justify-content:center;min-height:440px}
.rings{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:540px;height:540px;border-radius:50%;z-index:0;opacity:.55;pointer-events:none}
.b-abs{background:repeating-radial-gradient(circle at center,transparent 0 33px,rgba(43,143,216,.13) 33px 34px)}
.b-board{background:repeating-radial-gradient(circle at center,transparent 0 33px,rgba(194,146,46,.16) 33px 34px)}
.visual-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;width:100%;position:relative;z-index:2}
.illustration{position:relative;z-index:2;display:flex;justify-content:center;margin:4px 0}
.illustration svg{width:240px;height:auto;filter:drop-shadow(0 14px 24px rgba(10,42,94,.15))}
.pcard-light{background:#fbf6ea;color:var(--ink);border:1px solid #ecdfc4}
.pcard-light h4{color:var(--navy)}
.pcard-light span{color:var(--grey)}
.pcard-light .more{color:var(--blue)}
.c-gold{background:var(--gold)}
.dots{display:flex;gap:9px;justify-content:center;padding:14px 0 4px}
.dot{width:11px;height:11px;border-radius:50%;background:#c4d2e2;cursor:pointer;border:none;transition:.2s;padding:0}
.dot.active{background:var(--navy);width:28px;border-radius:6px}
.slider-arrow{position:absolute;top:46%;z-index:6;width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:0 5px 16px rgba(0,0,0,.1);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--navy);font-size:20px;line-height:1}
.slider-arrow.prev{left:14px}
.slider-arrow.next{right:14px}
.hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center}
.hero h1{font-size:46px;font-weight:800;color:var(--ink);margin:14px 0 16px}
.hero h1 span{color:var(--blue)}
.hero p.lede{font-size:16.5px;color:var(--grey);max-width:430px;margin-bottom:26px}
.hero-cta{display:flex;gap:12px;margin-bottom:34px}
.features{display:flex;gap:18px;flex-wrap:nowrap}
.feature{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.feature .fi{width:30px;height:30px;color:var(--blue)}
.feature .fi-img{object-fit:contain;display:block}
.feature b{font-size:13px;line-height:1.25}
.feature small{font-size:11px;color:var(--grey)}

/* PRODUCT CARD GRID */
.prod-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;position:relative}
.pcard{border-radius:12px;padding:16px;color:#fff;min-height:120px;display:flex;flex-direction:column;justify-content:space-between}
.pcard .pi{width:30px;height:30px;opacity:.95}
.pcard .pi-img{object-fit:contain;display:block;width:36px;height:36px;padding:6px;border-radius:50%;background:rgba(255,255,255,.92);opacity:1}
.pcard h4{font-size:15px;font-weight:700;margin-top:auto}
.pcard span{font-size:11.5px;opacity:.85;font-weight:500}
.pcard .more{font-size:12px;font-weight:600;margin-top:8px}
.c-navy{background:var(--navy)} .c-blue{background:#1f6fc4}
.c-lblue{background:#3a97da} .c-green{background:var(--green)}
.c-teal{background:var(--teal)} .c-orange{background:var(--orange)}

/* SECTION SHELL */
section{padding:64px 0}
.sec-head{text-align:center;max-width:640px;margin:0 auto 40px}
.sec-head h2{font-size:34px;font-weight:800;margin:8px 0}
.sec-head p{color:var(--grey);font-size:16px}

/* CATEGORY CARDS */
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cat{border-radius:var(--radius);overflow:hidden;color:#fff;min-height:300px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.cat.blue{background:linear-gradient(160deg,#2b6fb8,#0a2a5e)}
.cat.gold{background:linear-gradient(160deg,#d4a23c,#9c7320)}
.cat.green{background:linear-gradient(160deg,#5aa84f,#356b2c)}
.cats .cat{background-size:cover;background-position:center;background-blend-mode:multiply}
.cats .cat:nth-child(1){background-image:linear-gradient(160deg,rgba(10,42,94,.82),rgba(10,42,94,.48)),url('/wp-content/uploads/2026/07/h01-absorbency-salmon-pad.png')}
.cats .cat:nth-child(2){background-image:linear-gradient(160deg,rgba(116,75,9,.75),rgba(116,75,9,.36)),url('/wp-content/uploads/2026/07/h02-board-solutions.png')}
.cats .cat:nth-child(3){background-image:linear-gradient(160deg,rgba(20,68,28,.82),rgba(20,68,28,.43)),url('/wp-content/uploads/2026/07/h03-flexible-packaging.png')}
.cat .badge{position:absolute;top:24px;left:30px;width:46px;height:46px;background:rgba(255,255,255,.18);border-radius:10px;display:flex;align-items:center;justify-content:center}
.cat .badge img{display:block;width:30px;height:30px;object-fit:contain}
.cat h3{font-size:24px;font-weight:800;letter-spacing:.02em;margin-bottom:10px}
.cat p{font-size:14px;opacity:.92;margin-bottom:18px;max-width:300px}
.cat .btn{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.35);align-self:flex-start}
.cat .btn:hover{background:rgba(255,255,255,.26)}

/* INDUSTRIES */
.ind-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:14px}
.ind{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;transition:.2s}
.ind:hover{box-shadow:0 8px 24px rgba(10,42,94,.08);transform:translateY(-3px)}
.ind .photo{height:auto;aspect-ratio:3 / 2;background-size:cover;background-position:center;position:relative}
.ind-grid .ind:nth-child(1) .photo{background-image:url('/wp-content/uploads/2026/07/h04-meat.png')!important}.ind-grid .ind:nth-child(2) .photo{background-image:url('/wp-content/uploads/2026/07/h05-poultry.png')!important}.ind-grid .ind:nth-child(3) .photo{background-image:url('/wp-content/uploads/2026/07/h06-seafood-salmon.png')!important}.ind-grid .ind:nth-child(4) .photo{background-image:url('/wp-content/uploads/2026/07/h07-shellfish-prawns.png')!important}.ind-grid .ind:nth-child(5) .photo{background-image:url('/wp-content/uploads/2026/07/h08-berries-produce.png')!important}.ind-grid .ind:nth-child(6) .photo{background-image:url('/wp-content/uploads/2026/07/h09-horticulture.png')!important}.ind-grid .ind:nth-child(7) .photo{background-image:url('/wp-content/uploads/2026/07/h10-healthcare.png')!important}
.ind-grid .ind .photo{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}
.ind .ic{position:absolute;bottom:-17px;left:14px;width:36px;height:36px;padding:5px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 2px 8px rgba(10,42,94,.14)}
.ind .ic img{display:block;width:100%;height:100%;object-fit:contain}
.ind .body{padding:22px 14px 16px}
.ind h4{font-size:14px;font-weight:700;margin-bottom:6px}
.ind p{font-size:11.5px;color:var(--grey);margin-bottom:12px;min-height:62px}
.ind .link{font-size:12.5px}
.center{text-align:center;margin-top:36px}

/* CHALLENGES */
.challenge{background:linear-gradient(180deg,#f4f9fd,#eaf3fb);}
.ch-grid{display:grid;grid-template-columns:.8fr 2fr;gap:50px;align-items:center}
.ch-left h2{font-size:30px;font-weight:800;margin:10px 0 14px}
.ch-left p{color:var(--grey);font-size:15px;margin-bottom:22px}
.ch-flow{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.ch{ text-align:center;padding:6px}
.ch .ci{width:40px;height:40px;margin:0 auto 12px;color:var(--blue)}
.ch .ci-img{object-fit:contain;display:block}
.ch b{display:block;font-size:13px;margin-bottom:6px}
.ch small{font-size:11px;color:var(--grey);display:block;min-height:48px}
.ch .sol{font-size:11.5px;color:var(--grey);margin-top:10px;display:block}
.ch .sol b{color:var(--blue);font-size:13px;margin-top:2px}

/* SUSTAINABILITY */
.sus-grid{display:grid;grid-template-columns:1fr 2fr;gap:50px;align-items:center}
.sus-left{background:linear-gradient(160deg,#2f7d3a,#14441c);color:#fff;border-radius:var(--radius);padding:40px;min-height:300px;display:flex;flex-direction:column;justify-content:center}
.sus-left{background-image:linear-gradient(160deg,rgba(20,68,28,.88),rgba(20,68,28,.48)),url('/wp-content/uploads/2026/07/h12-sustainability-home.png');background-size:cover;background-position:center}
.sus-left .eyebrow{color:#bfe6b5}
.sus-left h2{font-size:30px;font-weight:800;margin:10px 0 14px}
.sus-left p{font-size:14.5px;opacity:.92;margin-bottom:22px}
.sus-left .btn{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.4);align-self:flex-start}
.sus-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.sus-col .si{width:42px;height:42px;color:var(--green);margin-bottom:14px}
.sus-col .si-img{object-fit:contain;display:block}
.sus-col h4{font-size:15px;font-weight:700;margin-bottom:8px}
.sus-col p{font-size:13px;color:var(--grey)}

/* EXPERTISE */
.exp-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;align-items:center}
.exp-photo{background:linear-gradient(160deg,#cfe0ef,#9db9d4);border-radius:var(--radius);min-height:260px;display:flex;align-items:center;justify-content:center;color:#5c7796;font-weight:600}
.exp-mid h3{font-size:24px;font-weight:800;margin:8px 0 12px}
.exp-mid p{font-size:14px;color:var(--grey);margin-bottom:18px}
.checks{list-style:none;display:flex;flex-direction:column;gap:10px}
.checks li{font-size:13.5px;display:flex;gap:10px;align-items:flex-start}
.checks li::before{content:"\2713";color:var(--blue);font-weight:800}
.exp-right h3{font-size:22px;font-weight:800;margin:8px 0 18px}
.stats{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:18px}
.stat{flex:1}
.stat b{display:block;font-size:20px;font-weight:800;color:var(--navy)}
.stat small{font-size:11.5px;color:var(--grey)}
.map{height:120px;background:radial-gradient(circle at 30% 40%,#dce8f4,#eef5fb);border-radius:10px;margin-bottom:18px;display:flex;align-items:center;justify-content:center;color:#9db4cc;font-size:13px;font-weight:600}

/* CTA STRIP */
.cta{background:var(--navy);color:#fff;padding:36px 0}
.cta-grid{display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.cta h3{font-size:24px;font-weight:800}
.cta p{font-size:14px;opacity:.85}
.cta-items{margin-left:auto;display:flex;gap:34px}
.cta-item{display:flex;align-items:center;gap:12px;font-weight:600;font-size:14px}
.cta-item .ci{width:26px;height:26px;color:#7fb4e6}
.cta-item .ci-img{object-fit:contain;padding:4px;border-radius:50%;background:rgba(255,255,255,.94)}
.cta-item small{display:block;font-weight:400;opacity:.75;font-size:12px}

/* FOOTER */
footer.site-footer{background:var(--navy-dark);color:#c5d2e4;padding:54px 0 28px;font-size:13.5px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr 1.2fr;gap:30px}
.foot .logo{color:#fff;margin-bottom:14px;display:inline-block}
.foot .logo small{color:#8fb6e0}
.foot p.tag{font-size:13px;opacity:.8;max-width:240px;margin-bottom:18px}
.socials{display:flex;gap:10px}
.socials a{width:32px;height:32px;border-radius:7px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:#fff}
.foot h5{color:#fff;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.foot ul li{opacity:.85}
.foot ul li:hover{opacity:1;color:#fff;cursor:pointer}
.foot-contact div{margin-bottom:10px;line-height:1.5}
.copyright{border-top:1px solid rgba(255,255,255,.1);margin-top:38px;padding-top:20px;font-size:12px;opacity:.6;text-align:center}

/* PRODUCT ARCHIVE + SINGLE (catalogue) */
.page-head{background:var(--blue-light);padding:40px 0}
.page-head h1{font-size:34px;font-weight:800;color:var(--navy)}
.page-head .crumbs{font-size:12.5px;color:var(--grey);margin-bottom:8px}
.page-head .crumbs a{color:var(--blue)}
.catalogue{display:grid;grid-template-columns:260px 1fr;gap:34px;padding:44px 0}
.filters{border:1px solid var(--line);border-radius:12px;padding:20px;height:max-content;position:sticky;top:96px}
.filters h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--navy);margin:14px 0 8px}
.filters h4:first-child{margin-top:0}
.filters a{display:block;font-size:13px;color:var(--grey);padding:4px 0}
.filters a:hover,.filters a.active{color:var(--blue);font-weight:600}
.prod-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.prod-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;transition:.2s;display:flex;flex-direction:column}
.prod-card:hover{box-shadow:0 10px 28px rgba(10,42,94,.1);transform:translateY(-3px)}
.prod-card .thumb{height:170px;background:var(--blue-light);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;color:#9db4cc}
.prod-card .pc-body{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.prod-card .brand{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.prod-card h3{font-size:16px;font-weight:700;color:var(--ink)}
.prod-card p{font-size:13px;color:var(--grey);flex:1}
.prod-card .link{margin-top:6px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:10.5px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--blue-light);color:var(--blue)}

.single-prod{display:grid;grid-template-columns:1fr 1fr;gap:44px;padding:44px 0}
.single-prod .gallery{background:var(--blue-light);border-radius:14px;min-height:380px;display:flex;align-items:center;justify-content:center;color:#9db4cc}
.single-prod .brand{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.single-prod h1{font-size:32px;font-weight:800;color:var(--navy);margin:8px 0 14px}
.single-prod .lede{font-size:16px;color:var(--grey);margin-bottom:20px}
.spec-table{width:100%;border-collapse:collapse;margin:18px 0}
.spec-table th,.spec-table td{text-align:left;font-size:13.5px;padding:10px 12px;border-bottom:1px solid var(--line)}
.spec-table th{color:var(--navy);font-weight:700;width:38%}
.prod-section{padding:0 0 48px}
.prod-section h2{font-size:22px;font-weight:800;color:var(--navy);margin-bottom:14px}
.feature-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.feature-list li{font-size:14px;display:flex;gap:10px;align-items:flex-start;color:var(--ink)}
.feature-list li::before{content:"\2713";color:var(--green);font-weight:800}

@media(max-width:980px){
  .hero-grid,.ch-grid,.sus-grid,.exp-grid{grid-template-columns:1fr}
  .cats{grid-template-columns:1fr}
  .cat{min-height:340px}
  .ind-grid{grid-template-columns:repeat(3,1fr)}
  .ch-flow{grid-template-columns:repeat(3,1fr)}
  .sus-cols{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr 1fr}
  nav.menu,.topbar-left{display:none}
  .menu-toggle{display:block}
  .catalogue{grid-template-columns:1fr}
  .filters{position:static}
  .prod-cards{grid-template-columns:repeat(2,1fr)}
  .single-prod{grid-template-columns:1fr}
}
@media(max-width:620px){
  .ind-grid,.prod-grid,.prod-cards{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:28px 20px}
  .hero h1{font-size:34px}
  .sec-head h2{font-size:26px}
  .cta-items{margin-left:0;flex-wrap:wrap}
  .feature-list{grid-template-columns:1fr}
}

/* =====================================================================
   SINGLE PRODUCT PAGE (scoped under .cs-product to avoid homepage clashes)
   ===================================================================== */
.cs-product .sec-title{text-align:center;font-size:26px;font-weight:800;color:var(--navy);margin-bottom:8px}
.cs-product section{padding:46px 0}
.cs-product .btn-ghost{background:none;color:var(--blue);padding:12px 4px}
.cs-product .btn-white{background:#fff;color:var(--navy)}
.cs-product .crumb{font-size:12.5px;color:var(--grey);padding:14px 0 0}
.cs-product .crumb a:hover{color:var(--blue)}
.cs-product .crumb span{color:var(--blue);font-weight:600}

.cs-product .p-hero{background:linear-gradient(180deg,#eef5fb,#f7fbfe);padding:22px 0 44px}
.cs-product .p-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.cs-product .p-hero-grid>*{min-width:0}
.cs-product .p-hero h1{font-size:42px;font-weight:800;color:var(--navy);margin:8px 0 6px}
.cs-product .p-hero h2{font-size:21px;font-weight:600;color:var(--blue);margin-bottom:16px}
.cs-product .p-hero p.lede{font-size:15.5px;color:var(--grey);max-width:440px;margin-bottom:22px}
.cs-product .p-hero-copy{margin-bottom:24px;max-width:540px}
.cs-product .p-hero-copy p{font-size:15.5px;color:var(--grey);margin-bottom:12px}
.cs-product .p-hero-copy p:last-child{margin-bottom:0}
.cs-product .p-hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.cs-product .chips{display:flex;justify-content:center;gap:22px;flex-wrap:wrap}
.cs-product .chip{display:flex;flex:0 1 128px;flex-direction:column;gap:7px;align-items:center;justify-content:flex-start;text-align:center;min-width:104px}
.cs-product .chip .dot{width:34px;height:34px;flex:0 0 34px;border-radius:9px;background:var(--blue-light);display:flex;align-items:center;justify-content:center;color:var(--blue);font-weight:800;line-height:1}
.cs-product .chip .dot img,.cs-product .chip > img{display:block;width:22px;height:22px;max-width:100%;object-fit:contain;object-position:center}
.cs-product .chip b{width:100%;margin:0}
.cs-product .chip b{font-size:11.5px;font-weight:700;line-height:1.25}
.cs-product .chip .dot.canva-icon{background:transparent}
.cs-product .chip .dot.canva-icon img{width:34px;height:34px}
.cs-product .p-hero-media{position:relative}
.cs-product .p-hero-img{background:linear-gradient(135deg,#dbe7f3,#b9cde2);border-radius:18px;min-height:360px;display:flex;align-items:center;justify-content:center;color:#7d8ca1;font-weight:600;overflow:hidden}
.cs-product .p-hero-img img{width:100%;height:100%;object-fit:cover}
.cs-product .p-hero-badge{position:absolute;right:-6px;bottom:18px;background:var(--navy);color:#fff;border-radius:12px;padding:14px 18px;display:flex;gap:10px;align-items:center;max-width:240px;box-shadow:0 12px 30px rgba(10,42,94,.25)}
.cs-product .p-hero-badge b{font-size:14px;display:block}
.cs-product .p-hero-badge small{font-size:11px;opacity:.8}

.cs-product .panel{background:var(--panel,#f4f8fc);border-radius:14px}
.cs-product .challenge-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:24px}
.cs-product .challenge-sub{text-align:center;color:var(--grey);font-size:14px}
.cs-product .ch-item{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;width:160px}
.cs-product .ch-item .dot{width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--navy);font-weight:800}
.cs-product .ch-item b{font-size:13.5px;font-weight:600;color:var(--ink)}
.cs-product .ch-item .dot.canva-icon{width:48px;height:48px;border:0;background:transparent}
.cs-product .ch-item .dot.canva-icon img{display:block;width:48px;height:48px;object-fit:contain}

.cs-product .steps{display:grid;grid-template-columns:repeat(var(--step-count,5),minmax(0,1fr));gap:8px;margin-top:26px;align-items:start}
.cs-product .step{text-align:center;padding:0 6px;position:relative}
.cs-product .step .num{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.cs-product .step p{font-size:12.5px;color:var(--grey)}
.cs-product .step:not(:last-child)::after{content:"\2192";position:absolute;top:6px;right:-10px;color:#b8c6d6;font-size:18px}

.cs-product .benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.cs-product .benefit{background:var(--panel,#f4f8fc);border-radius:12px;padding:22px 18px}
.cs-product .benefit b{font-size:14.5px;display:block;margin-bottom:8px;color:var(--navy)}
.cs-product .benefit p{font-size:13px;color:var(--grey)}

.cs-product .two-col{display:grid;grid-template-columns:1.3fr 1fr;gap:34px}
.cs-product .col-title{font-size:18px;font-weight:800;color:var(--navy);text-align:center;margin-bottom:6px}
.cs-product .ideal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.cs-product .ideal{border:1px solid var(--line);border-radius:10px;padding:14px 8px;text-align:center;font-size:12.5px;font-weight:600;color:var(--ink);background:#fff}

.cs-product .opts-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:34px;align-items:start}
.cs-product .opt-box{display:flex;gap:30px;flex-wrap:wrap}
.cs-product .opt-col h4{font-size:13px;font-weight:700;margin-bottom:12px;color:var(--ink)}
.cs-product .opt-col ul{list-style:none;display:flex;flex-direction:column;gap:6px}
.cs-product .opt-col li{font-size:12.5px;color:var(--grey)}
.cs-product .opts-note{font-size:12px;color:var(--grey);margin-top:18px;font-style:italic}
.cs-product .specs{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cs-product .spec-row{display:flex;justify-content:space-between;gap:16px;padding:13px 18px;border-bottom:1px solid var(--line);font-size:13px}
.cs-product .spec-row:last-child{border-bottom:none}
.cs-product .spec-row .k{font-weight:600;color:var(--ink)}
.cs-product .spec-row .v{color:var(--grey);text-align:right}

.cs-product .help{background:var(--navy);color:#fff;border-radius:14px;padding:28px 34px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.cs-product .help h3{font-size:20px;font-weight:800}
.cs-product .help p{font-size:13px;opacity:.85}
.cs-product .help .acts{margin-left:auto;display:flex;gap:12px}
.cs-product .help .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}

.cs-product .fieldnote{background:#fff8e6;border:1px solid #f0dca0;color:#7a5b12;font-size:12px;border-radius:8px;padding:8px 12px;display:inline-block;margin-top:10px}

@media(max-width:980px){
  .cs-product .p-hero-grid,.cs-product .two-col,.cs-product .opts-grid{grid-template-columns:1fr}
  .cs-product .steps,.cs-product .benefits{grid-template-columns:repeat(2,1fr)}
  .cs-product .ideal-grid{grid-template-columns:repeat(2,1fr)}
  .cs-product .step:not(:last-child)::after{display:none}
  .cs-product .p-hero h1{font-size:32px}
}
@media(max-width:620px){
  .cs-product .p-hero-grid{gap:28px}
  .cs-product .p-hero h1{font-size:30px;overflow-wrap:break-word}
  .cs-product .prod-card,.cs-product .pc-body{min-width:0}
  .cs-product .prod-card h3{overflow-wrap:break-word}
  .cs-product .p-hero-badge{right:8px;max-width:calc(100% - 16px)}
}

/* =====================================================================
   CATEGORY / LISTING PAGE (scoped under .cs-cat)
   ===================================================================== */
.cs-cat .crumb{font-size:12.5px;color:var(--grey);padding:16px 0 0}
.cs-cat .crumb a:hover{color:var(--blue)}
.cs-cat .crumb span{color:var(--blue);font-weight:600}
.cs-cat .cat-hero{background:linear-gradient(180deg,#eef5fb,#f7fbfe);padding:14px 0 44px}
.cs-cat .cat-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center}
.cs-cat .cat-hero h1{font-size:42px;font-weight:800;color:var(--navy);margin:10px 0 16px;line-height:1.1}
.cs-cat .cat-hero p{font-size:14.5px;color:var(--grey);max-width:470px;margin-bottom:16px}
.cs-cat .cat-hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.cs-cat .cat-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:230px}
.cs-cat .cat-visual .rings{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:360px;height:360px;border-radius:50%;background:repeating-radial-gradient(circle at center,transparent 0 30px,rgba(43,143,216,.12) 30px 31px);opacity:.6}
.cs-cat .cat-visual .glyph{position:relative;z-index:2;width:180px;height:180px;border-radius:24px;background:linear-gradient(135deg,#dbe7f3,#b9cde2);display:flex;align-items:center;justify-content:center;color:#5c7796;font-weight:800;font-size:15px;text-align:center;padding:16px;box-shadow:0 16px 28px rgba(10,42,94,.18)}
.cs-cat .cat-visual.has-image{min-height:270px;overflow:visible;border-radius:0;box-shadow:none;background:transparent;padding:0}
.cs-cat .cat-hero-image{display:block;width:100%;height:270px;object-fit:contain;object-position:center}
.cs-form-page{padding:84px 0;background:#f7fafc;min-height:65vh}.narrow{max-width:820px}.cs-form-page h1{font-size:clamp(38px,5vw,62px);margin:6px 0 14px}.cs-form-page .lede{font-size:19px;color:#60758d;max-width:680px}.cs-enquiry-form{margin-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:30px;background:#fff;border:1px solid #dce6f0;border-radius:16px}.cs-enquiry-form label{display:flex;flex-direction:column;gap:7px;font-weight:700;color:#1d2d42}.cs-enquiry-form input,.cs-enquiry-form textarea{font:inherit;padding:12px;border:1px solid #bdcddd;border-radius:7px;background:#fff;color:#1d2d42}.cs-enquiry-form .full{grid-column:1/-1}.cs-enquiry-form button{justify-self:start;border:0;cursor:pointer}.form-notice{margin:24px 0 0;padding:14px 16px;border-radius:8px}.form-notice.success{background:#e9f6ef;color:#17663b}.form-notice.error{background:#fff0ef;color:#a42b22}@media(max-width:650px){.cs-enquiry-form{grid-template-columns:1fr}.cs-enquiry-form .full{grid-column:auto}}
.cs-about-hero{padding:110px 0 96px;background:#edf5fb}.cs-about-hero h1{max-width:780px;font-size:clamp(42px,6vw,76px);margin:8px 0 18px}.cs-about-hero p{max-width:650px;font-size:20px;color:#5e7187;margin-bottom:28px}.cs-about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;padding:90px 20px}.cs-about-grid h2,.cs-about-band h2,.cs-about-cta h2{font-size:clamp(30px,4vw,48px);margin:8px 0 16px}.cs-about-grid p{font-size:18px;line-height:1.65;color:#587087}.about-points{display:grid;gap:16px}.about-points div{padding:22px;border-left:4px solid #2b8fd8;background:#f7fafc}.about-points strong,.about-points span{display:block}.about-points strong{font-size:18px;color:#102e5b;margin-bottom:5px}.about-points span{color:#60758d}.cs-about-band{background:#102e5b;color:#fff;padding:78px 0}.cs-about-band p{max-width:690px;color:#d4e2f2;font-size:18px;line-height:1.6}.cs-about-band .eyebrow{color:#72b6eb}.cs-about-cta{text-align:center;padding:86px 20px}.cs-about-cta p{color:#60758d;margin-bottom:26px}@media(max-width:700px){.cs-about-grid{grid-template-columns:1fr;gap:36px;padding:60px 20px}}

.cs-cat .cat-layout{display:grid;grid-template-columns:264px 1fr;gap:32px;align-items:start;padding:34px 0 10px}
.cs-cat .filters{border:1px solid var(--line);border-radius:14px;padding:6px 18px 18px;position:sticky;top:96px}
.cs-cat .mobile-filter-checkbox,.cs-cat .mobile-filter-button{display:none}
.cs-cat .f-head{display:flex;justify-content:space-between;align-items:center;padding:14px 0 10px}
.cs-cat .f-head b{font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--navy);text-transform:uppercase}
.cs-cat .f-head a{font-size:11.5px;color:var(--blue);font-weight:600}
.cs-cat .f-group{border-top:1px solid var(--line);padding:13px 0}
.cs-cat .f-group h4{font-size:11.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);margin-bottom:10px}
.cs-cat .f-opt{display:block;font-size:12.7px;color:var(--grey);padding:5px 0}
.cs-cat .f-opt:hover,.cs-cat .f-opt.active{color:var(--blue);font-weight:600}
.cs-cat .f-opt .c{color:#9aa7b6;font-size:11.5px}
.cs-cat .f-help{background:var(--panel,#f4f8fc);border-radius:10px;padding:14px;margin-top:16px}
.cs-cat .f-help b{font-size:12.5px;display:block;margin-bottom:5px;color:var(--navy)}
.cs-cat .f-help p{font-size:11.5px;color:var(--grey);margin-bottom:10px}
.cs-cat .f-help a{font-size:12px;font-weight:700;color:var(--blue)}

.cs-cat .lhead{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.cs-cat .lhead h2{font-size:22px;font-weight:800;color:var(--navy)}
.cs-cat .lhead .count{font-size:12.5px;color:var(--grey)}

.cs-cat .subcats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:6px 0 26px}
.cs-cat .subcat{border-radius:11px;padding:16px;color:#fff;min-height:96px;display:flex;flex-direction:column;justify-content:flex-end}
.cs-cat .subcat b{font-size:13px;font-weight:700}
.cs-cat .subcat small{font-size:10.5px;opacity:.9;line-height:1.3}
.cs-cat .subcat .ex{font-size:11px;font-weight:600;margin-top:8px}
.cs-cat .c-navy{background:var(--navy)}.cs-cat .c-blue{background:#1f6fc4}.cs-cat .c-bbright{background:#2b8fd8}
.cs-cat .c-lblue{background:#3a97da}.cs-cat .c-green{background:var(--green)}.cs-cat .c-gold{background:#d98a2b}

.cs-cat .plist{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cs-cat .pcard2{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:.2s}
.cs-cat .pcard2:hover{box-shadow:0 12px 28px rgba(10,42,94,.10);transform:translateY(-3px)}
.cs-cat .pcard2 .img{height:160px;position:relative;background:var(--blue-light);display:flex;align-items:center;justify-content:center;color:#9db4cc;overflow:hidden}
.cs-cat .pcard2 .img img{width:100%;height:100%;object-fit:cover}
.cs-cat .pcard2 .body{padding:18px;flex:1;display:flex;flex-direction:column}
.cs-cat .pcard2 h3{font-size:16px;font-weight:800;color:var(--navy);line-height:1.22}
.cs-cat .pcard2 .sub{font-size:11.5px;color:var(--blue);font-weight:700;margin-top:4px;text-transform:uppercase;letter-spacing:.04em}
.cs-cat .pcard2 .desc{font-size:12.2px;color:var(--grey);margin-top:10px;line-height:1.5}
.cs-cat .pcard2 .vp{margin-top:auto;padding-top:14px;font-size:12px;font-weight:700;color:var(--blue)}

/* Application groups ("fruit with fruit, meat with meat") */
.cs-cat .pgroup{padding:0;margin:0 0 32px}
.cs-cat .pgroup-head{display:flex;align-items:center;gap:12px;margin:0 0 16px}
.cs-cat .pgroup:first-of-type .pgroup-head{margin-top:0}
.cs-cat .pgroup-head h3{font-size:14px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--navy);white-space:nowrap;margin:0}
.cs-cat .pgroup-head .pgroup-count{font-size:11px;font-weight:700;color:var(--blue);background:var(--blue-light);border-radius:20px;padding:2px 10px;line-height:1.5}
.cs-cat .pgroup-head:after{content:"";flex:1;height:1px;background:var(--line)}

.cs-cat .pagination{display:flex;gap:8px;justify-content:center;align-items:center;margin:34px 0 6px}
.cs-cat .pagination .page-numbers{min-width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:9px;font-size:13px;font-weight:600;color:var(--ink);border:1px solid var(--line);padding:0 12px}
.cs-cat .pagination .page-numbers.current{background:var(--navy);color:#fff;border-color:var(--navy)}
.cs-cat .pagination a.page-numbers:hover{border-color:var(--navy)}

.cs-cat .help{background:var(--navy);color:#fff;border-radius:14px;padding:26px 32px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin:42px 0}
.cs-cat .help h3{font-size:19px;font-weight:800}
.cs-cat .help p{font-size:13px;opacity:.85}
.cs-cat .help .acts{margin-left:auto;display:flex;gap:12px}
.cs-cat .help .btn-white{background:#fff;color:var(--navy)}
.cs-cat .help .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}

@media(max-width:1080px){
  .cs-cat .cat-layout{grid-template-columns:1fr}
  .cs-cat .filters{position:static}
  .cs-cat .plist{grid-template-columns:repeat(3,1fr)}
  .cs-cat .subcats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:880px){
  .cs-cat .cat-hero-grid{grid-template-columns:1fr}
  .cs-cat .cat-visual{display:none}
  .cs-cat .plist{grid-template-columns:repeat(2,1fr)}
  .cs-cat .filters{padding:0;border:0;background:transparent}
  .cs-cat .mobile-filter-checkbox{position:absolute;opacity:0;pointer-events:none}
  .cs-cat .mobile-filter-button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px 17px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--navy);font-size:14px;font-weight:800;cursor:pointer;box-shadow:0 4px 14px rgba(18,48,78,.06)}
  .cs-cat .mobile-filter-chevron{transition:transform .18s ease}
  .cs-cat .mobile-filter-content{display:none;margin-top:10px;padding:6px 18px 18px;border:1px solid var(--line);border-radius:12px;background:#fff}
  .cs-cat .mobile-filter-checkbox:checked + .mobile-filter-button .mobile-filter-chevron{transform:rotate(180deg)}
  .cs-cat .mobile-filter-checkbox:checked + .mobile-filter-button + .mobile-filter-content{display:block}
}
@media(max-width:560px){.cs-cat .plist,.cs-cat .subcats{grid-template-columns:1fr 1fr}.cs-cat .cat-hero h1{font-size:32px}}

/* =====================================================================
   SUSTAINABILITY LANDING (scoped under .cs-sustain)
   ===================================================================== */
.cs-sustain .crumb{font-size:12.5px;color:var(--grey);padding:16px 0 0}
.cs-sustain .crumb a:hover{color:var(--blue)}
.cs-sustain .s-hero{background:linear-gradient(180deg,#eef5fb,#f2fbf3);padding:24px 0 52px}
.cs-sustain .s-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center}
.cs-sustain .s-hero h1{font-size:48px;font-weight:800;color:var(--navy);line-height:1.08;margin:10px 0 16px}
.cs-sustain .s-hero h1 .b{color:var(--blue)}
.cs-sustain .s-hero h1 .g{color:var(--green)}
.cs-sustain .s-hero p{font-size:15.5px;color:var(--grey);max-width:460px;margin-bottom:22px}
.cs-sustain .s-hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.cs-sustain .s-visual{position:relative;min-height:300px;display:flex;align-items:center;justify-content:center}
.cs-sustain .s-visual .rings{position:absolute;inset:0;background:repeating-radial-gradient(circle at 60% 45%,transparent 0 30px,rgba(74,155,63,.10) 30px 31px);opacity:.7;border-radius:20px}
.cs-sustain .s-visual .panel{position:relative;z-index:2;width:78%;min-height:260px;border-radius:18px;background:linear-gradient(150deg,#dCEBD9,#bcd8ea);display:flex;align-items:center;justify-content:center;color:#5c7796;font-weight:600;overflow:hidden}
.cs-sustain .s-visual .panel img{width:100%;height:100%;object-fit:cover}

.cs-sustain .block{padding:56px 0}
.cs-sustain .band{background:#f7fafc}
.cs-sustain .sec-head{text-align:center;max-width:640px;margin:0 auto 38px}
.cs-sustain .sec-head h2{font-size:30px;font-weight:800;color:var(--navy);margin-bottom:8px}
.cs-sustain .sec-head p{color:var(--grey);font-size:15px}

.cs-sustain .commit-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.cs-sustain .commit{text-align:center}
.cs-sustain .commit .ic{width:44px;height:44px;color:var(--green);margin:0 auto 12px}
.cs-sustain .commit h4{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:7px}
.cs-sustain .commit p{font-size:12px;color:var(--grey);line-height:1.5}

.cs-sustain .design-grid{display:grid;grid-template-columns:1fr 2fr;gap:40px;align-items:center}
.cs-sustain .design-left h2{font-size:28px;font-weight:800;color:var(--navy);margin-bottom:12px}
.cs-sustain .design-left p{font-size:14px;color:var(--grey);margin-bottom:16px}
.cs-sustain .checks{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.cs-sustain .checks li{font-size:13.5px;display:flex;gap:10px;align-items:flex-start;color:var(--ink)}
.cs-sustain .checks li::before{content:"\2713";color:var(--green);font-weight:800}
.cs-sustain .design-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cs-sustain .dcard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.cs-sustain .dcard .top{height:120px;background:linear-gradient(150deg,#e3efe0,#cfe0ef);position:relative}
.cs-sustain .dcard .badge{position:absolute;bottom:-16px;left:16px;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--green)}
.cs-sustain .dcard .body{padding:24px 16px 18px}
.cs-sustain .dcard h4{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:6px}
.cs-sustain .dcard p{font-size:12px;color:var(--grey);line-height:1.5}

.cs-sustain .impact-grid{display:grid;grid-template-columns:1fr 2fr;gap:40px;align-items:center}
.cs-sustain .impact-left h2{font-size:28px;font-weight:800;color:var(--navy);margin-bottom:12px}
.cs-sustain .impact-left p{font-size:14px;color:var(--grey);margin-bottom:18px}
.cs-sustain .sol-panel{background:linear-gradient(150deg,#e7f2e3,#dbead6);border-radius:16px;padding:26px}
.cs-sustain .sol-panel h3{font-size:16px;font-weight:800;color:var(--navy);margin-bottom:18px}
.cs-sustain .sol-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.cs-sustain .scard{background:#fff;border-radius:10px;overflow:hidden;text-align:left}
.cs-sustain .scard .thumb{height:74px;background:var(--blue-light);display:flex;align-items:center;justify-content:center;color:#9db4cc;font-size:10px;overflow:hidden}
.cs-sustain .scard .thumb img{width:100%;height:100%;object-fit:cover}
.cs-sustain .scard .b{padding:10px}
.cs-sustain .scard h5{font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:4px}
.cs-sustain .scard p{font-size:10.5px;color:var(--grey);line-height:1.45}

.cs-sustain .standards-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.cs-sustain .standard{text-align:center}
.cs-sustain .standard .ic{width:40px;height:40px;color:var(--green);margin:0 auto 12px}
.cs-sustain .standard b{display:block;font-size:15px;color:var(--navy);margin-bottom:6px}
.cs-sustain .standard .lead{font-size:12px;font-weight:700;color:var(--green);letter-spacing:.04em}
.cs-sustain .standard p{font-size:11.5px;color:var(--grey);line-height:1.5}

.cs-sustain .s-cta{background:var(--navy);color:#fff;border-radius:16px;padding:30px 36px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:20px 0 10px}
.cs-sustain .s-cta h3{font-size:22px;font-weight:800}
.cs-sustain .s-cta p{font-size:13px;opacity:.85}
.cs-sustain .s-cta .acts{margin-left:auto;display:flex;gap:12px}
.cs-sustain .s-cta .btn-white{background:#fff;color:var(--navy)}
.cs-sustain .s-cta .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}

@media(max-width:1080px){
  .cs-sustain .commit-grid,.cs-sustain .standards-grid{grid-template-columns:repeat(3,1fr)}
  .cs-sustain .design-grid,.cs-sustain .impact-grid{grid-template-columns:1fr}
  .cs-sustain .design-cards,.cs-sustain .sol-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:880px){
  .cs-sustain .s-hero-grid{grid-template-columns:1fr}
  .cs-sustain .s-hero h1{font-size:36px}
}
@media(max-width:560px){
  .cs-sustain .commit-grid,.cs-sustain .standards-grid,.cs-sustain .design-cards,.cs-sustain .sol-cards{grid-template-columns:1fr 1fr}
}
/* Sustainability page */
.cs-sustainability{background:#fff;color:var(--ink)}
.cs-sustainability .eyebrow{color:var(--green);font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;margin:0 0 12px}
.cs-sustainability .sus-hero{padding:18px 0 66px;background:linear-gradient(135deg,#edf4fa 0%,#f7fbf8 58%,#e8f2e7 100%)}
.cs-sustainability .sus-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,.92fr);gap:58px;align-items:center}
.cs-sustainability .sus-crumb{font-size:12px;color:#647487;margin:0 0 42px}.cs-sustainability .sus-crumb a{color:inherit}.cs-sustainability .sus-crumb span{padding:0 7px;color:#a5b1be}
.cs-sustainability .sus-hero h1{max-width:640px;color:var(--navy);font-size:54px;line-height:1.03;letter-spacing:-.045em;font-weight:800;margin:0 0 20px}.cs-sustainability .sus-hero h1 em{font-style:normal;color:var(--green)}
.cs-sustainability .sus-intro{max-width:580px;font-size:18px;line-height:1.55;color:#52657a;margin:0 0 28px}.cs-sustainability .sus-hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.cs-sustainability .sus-hero-media{border-radius:20px;overflow:hidden;box-shadow:0 22px 50px rgba(25,50,75,.14);aspect-ratio:1.32;background:#dde7da}.cs-sustainability .sus-hero-media img{display:block;width:100%;height:100%;object-fit:cover}
.cs-sustainability .sus-principles{padding:80px 0 74px}.cs-sustainability .sus-section-heading{max-width:700px;margin:0 auto 38px;text-align:center}.cs-sustainability h2{color:var(--navy);font-size:34px;line-height:1.12;letter-spacing:-.027em;font-weight:800;margin:0 0 13px}.cs-sustainability .sus-section-heading>p:last-child{color:#627387;font-size:16px;line-height:1.6}
.cs-sustainability .sus-principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.cs-sustainability .sus-principle{padding:27px 25px 25px;border:1px solid #dce6ed;border-radius:14px;background:#fff}.cs-sustainability .sus-principle img{width:48px;height:48px;object-fit:contain;margin:0 0 18px}.cs-sustainability .sus-principle h3{color:var(--navy);font-size:18px;font-weight:800;margin:0 0 8px}.cs-sustainability .sus-principle p{font-size:14px;line-height:1.56;color:#627387;margin:0}
.cs-sustainability .sus-feature{padding:66px 0;background:#f5f9f6}.cs-sustainability .sus-feature-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:68px;align-items:center}.cs-sustainability .sus-feature-copy>p:not(.eyebrow){max-width:630px;color:#5e7083;font-size:16px;line-height:1.62;margin:0 0 20px}.cs-sustainability .sus-feature ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}.cs-sustainability .sus-feature li{position:relative;padding-left:27px;color:#21344b;font-size:15px;font-weight:650}.cs-sustainability .sus-feature li:before{content:'✓';position:absolute;left:0;color:var(--green);font-weight:800}.cs-sustainability .sus-note{padding:30px;border-radius:15px;background:var(--navy);box-shadow:0 18px 36px rgba(15,45,91,.15)}.cs-sustainability .sus-note-kicker{color:#a7d39d;text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:800;margin:0 0 11px}.cs-sustainability .sus-note h3{color:#fff;font-size:23px;line-height:1.12;margin:0 0 12px}.cs-sustainability .sus-note p:not(.sus-note-kicker){color:#dce6f2;font-size:13.5px;line-height:1.6;margin:0 0 17px}.cs-sustainability .text-link{font-weight:800;color:var(--blue);font-size:14px}.cs-sustainability .sus-note .text-link{color:#fff}
.cs-sustainability .sus-solutions{padding:80px 0}.cs-sustainability .sus-solutions-top{display:flex;justify-content:space-between;gap:44px;align-items:end;margin:0 0 30px}.cs-sustainability .sus-solutions-top h2{max-width:520px}.cs-sustainability .sus-solutions-top>p{max-width:350px;color:#617287;line-height:1.57;font-size:15px;margin:0 0 4px}.cs-sustainability .sus-range-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cs-sustainability .sus-range{display:flex;flex-direction:column;border:1px solid #dce6ed;border-radius:14px;overflow:hidden;background:#fff;transition:transform .18s ease,box-shadow .18s ease}.cs-sustainability .sus-range:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(22,53,80,.11)}.cs-sustainability .sus-range-image{height:170px;background:#f3f6f5;overflow:hidden}.cs-sustainability .sus-range-image img{display:block;width:100%;height:100%;object-fit:cover}.cs-sustainability .sus-range-body{padding:20px;display:flex;flex:1;flex-direction:column;align-items:flex-start}.cs-sustainability .sus-range h3{color:var(--navy);font-size:18px;font-weight:800;margin:0 0 8px}.cs-sustainability .sus-range p{color:#627387;font-size:13.5px;line-height:1.52;margin:0 0 18px}.cs-sustainability .sus-range .text-link{margin-top:auto}
.cs-sustainability .sus-cta-wrap{padding:0 0 76px}.cs-sustainability .sus-cta{background:linear-gradient(120deg,#102f5e,#1c4b76);border-radius:18px;padding:42px 46px;display:flex;gap:30px;align-items:center;justify-content:space-between}.cs-sustainability .sus-cta .eyebrow{color:#a6d596}.cs-sustainability .sus-cta h2{color:#fff;font-size:30px;margin:0 0 9px}.cs-sustainability .sus-cta p:not(.eyebrow){max-width:620px;color:#d7e2ef;font-size:15px;line-height:1.55;margin:0}.cs-sustainability .sus-cta-actions{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto}.cs-sustainability .btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45)}
@media(max-width:900px){.cs-sustainability .sus-hero-grid,.cs-sustainability .sus-feature-grid{grid-template-columns:1fr;gap:34px}.cs-sustainability .sus-hero-media{max-width:680px}.cs-sustainability .sus-range-grid{grid-template-columns:repeat(2,1fr)}.cs-sustainability .sus-cta{display:block}.cs-sustainability .sus-cta-actions{margin-top:22px}.cs-sustainability .sus-hero h1{font-size:48px}}
@media(max-width:640px){.cs-sustainability .sus-hero{padding-bottom:42px}.cs-sustainability .sus-crumb{margin-bottom:29px}.cs-sustainability .sus-hero h1{font-size:39px}.cs-sustainability .sus-intro{font-size:16px}.cs-sustainability h2{font-size:29px}.cs-sustainability .sus-principles,.cs-sustainability .sus-solutions{padding:58px 0}.cs-sustainability .sus-principle-grid,.cs-sustainability .sus-range-grid{grid-template-columns:1fr}.cs-sustainability .sus-solutions-top{display:block}.cs-sustainability .sus-solutions-top>p{margin-top:12px}.cs-sustainability .sus-feature{padding:54px 0}.cs-sustainability .sus-cta{padding:30px 24px}.cs-sustainability .sus-cta h2{font-size:26px}}

/* Documentation */
.cs-docs .page-head{background:linear-gradient(135deg,#f2f7fc,#e7f0fa);padding:76px 0 64px}.cs-docs .page-head h1{max-width:760px;margin:8px 0 14px}.cs-docs .page-head p:last-child{max-width:640px;font-size:18px;color:#52677d}.cs-docs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:58px 0 76px}.cs-doc-card{border:1px solid #dce5ef;border-radius:14px;padding:28px;background:#fff;min-height:220px;display:flex;flex-direction:column;align-items:flex-start}.cs-doc-card.featured{grid-column:span 2;background:#103469;color:#fff;border-color:#103469}.cs-doc-card span{font-size:11px;font-weight:800;letter-spacing:.13em;color:#207cc7}.cs-doc-card.featured span{color:#8bc7ff}.cs-doc-card h2{font-size:23px;margin:12px 0 9px}.cs-doc-card p{color:#5c6f84;margin:0 0 22px;line-height:1.55}.cs-doc-card.featured p{color:#dbe9fa}.cs-doc-card>a:not(.btn){font-weight:700;color:#1673c8;margin-top:auto}.cs-doc-card .btn{margin-top:auto}@media(max-width:720px){.cs-docs-grid{grid-template-columns:1fr;padding:40px 20px 58px}.cs-doc-card.featured{grid-column:auto}.cs-docs .page-head{padding:54px 20px 46px}}
.search-card-media .search-card-graphic{display:grid;place-items:center;width:100%;height:100%;min-height:180px;color:#1d76c8;background:linear-gradient(135deg,#e6f0fb,#f6fafc)}.search-card-media .search-card-graphic svg{width:64px;height:64px}

/* Mobile navigation and catalogue layout corrections. */
.cs-cat .cat-hero .cta{background:transparent;padding:0;color:inherit}
@media(max-width:980px){
 .site-header nav.menu{margin-left:0;max-height:calc(100dvh - 130px);overflow-y:auto;overscroll-behavior:contain;gap:0}
 .site-header .nav-item,.site-header .nav-item.has-mega{position:relative;display:block;height:auto;min-height:48px;padding:13px 0;flex-shrink:0;width:100%}
 .site-header .nav-item>.dropdown{position:static;width:100%;margin-top:12px;padding:16px 12px;box-shadow:none;border-radius:0;max-width:100%}
 .site-header .mega-grid{grid-template-columns:1fr;gap:18px}
 .site-header .col a,.site-header .dropdown.small a{padding:9px 0;font-size:14px}
 .site-header .col h5{margin-bottom:4px}
 .cs-cat .cat-layout{padding-left:20px;padding-right:20px;min-width:0}
 .cs-cat .cat-layout>div{min-width:0}
 .cs-cat .crumb{padding-left:20px;padding-right:20px}
}
@media(max-width:620px){
 .cs-cat .cat-hero .cta{flex-direction:column;align-items:stretch;gap:10px}
 .cs-cat .cat-hero .cta .btn{justify-content:center;padding:12px 14px;font-size:14px}
 .site-header .nav{gap:10px}
 .site-header .nav .logo img,.site-header .nav .custom-logo{max-width:112px}
 .site-header .site-search{min-width:0;flex:1;margin-left:0;max-width:220px}
 .site-header .site-search input{width:100%;min-width:0;flex:1}
 .site-header .site-search button{flex-shrink:0}
 .site-header .menu-toggle{flex-shrink:0;margin-left:0}
}

/* Karl review: title wrapping and healthcare navigation, 18 September 2026 */
.cs-product .prod-card:has(a[href*="/product/greaseproof-waxed-siliconised-paper/"]) h3,
.cs-cat .pcard2[href*="/product/greaseproof-waxed-siliconised-paper/"] h3 {font-size:clamp(16px,1.5vw,20px);word-break:normal;overflow-wrap:normal;hyphens:none;}
.site-header .col:has(a[href*="/sector/healthcare/"]) {background:#eef7f7;border:1px solid #b6d9d7;border-left:4px solid #2f817c;border-radius:10px;padding:14px;box-sizing:border-box;}
.site-header .col:has(a[href*="/sector/healthcare/"]) h5 {color:#236b67;}
/*
Theme Name: Coppice Sirane
Theme URI: https://www.sirane.com
Author: Coppice Sirane / Jake Walter
Description: Custom classic theme for the Coppice Sirane website. Product-catalogue focused, with templates for the homepage, product pages and category archives. Built from the approved design mockup.
Version: 0.2.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: coppice-sirane
*/

:root{
  --navy:#0a2a5e;
  --navy-dark:#071f47;
  --blue:#1a73c2;
  --blue-bright:#2b8fd8;
  --blue-light:#eef5fb;
  --green:#4a9b3f;
  --green-dark:#3d7c33;
  --teal:#2f9e8f;
  --gold:#c2922e;
  --orange:#e8821e;
  --ink:#1c2a3a;
  --grey:#5c6b7a;
  --line:#e3e9f0;
  --radius:14px;
  --max:1180px;
  font-feature-settings:"kern";
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

/* Branded site search */
.site-search{display:flex;align-items:center;margin-left:14px;border:1px solid var(--line);border-radius:999px;background:#fff;overflow:hidden;min-width:210px}
.site-search input{width:174px;border:0;outline:0;padding:10px 2px 10px 14px;font:inherit;font-size:12.5px;color:var(--ink);background:transparent}
.site-search button{width:38px;height:38px;border:0;background:transparent;color:var(--navy);cursor:pointer;font-size:14px}
.site-search:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,115,194,.12)}
.cs-search-page .search-hero{padding:58px 0 62px;background:linear-gradient(135deg,#eef5fb,#f7fbfe 58%,#edf6ec)}
.cs-search-page .search-hero h1{color:var(--navy);font-size:46px;line-height:1.08;margin:8px 0 12px}.cs-search-page .search-hero p:not(.eyebrow){color:var(--grey);font-size:16px;max-width:650px}
.search-page-form{display:flex;gap:10px;margin-top:24px;max-width:760px}.search-page-form input{flex:1;min-width:0;border:1px solid #cbd9e6;border-radius:9px;padding:13px 16px;font:inherit;background:#fff}.search-page-form input:focus{outline:3px solid rgba(26,115,194,.14);border-color:var(--blue)}
.search-results{padding:58px 0 76px}.search-summary{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:26px}.search-summary h2{color:var(--navy);font-size:28px}.search-summary span{color:var(--grey);font-size:13px}
.search-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.search-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 24px rgba(20,48,76,.06)}.search-card-media{height:190px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#e7f0f7,#d9e8f3);color:var(--navy);font-weight:800}.search-card-media img{width:100%;height:100%;object-fit:cover}.search-card-body{padding:21px}.search-type{display:block;color:var(--blue);font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;margin-bottom:8px}.search-card h3{font-size:19px;line-height:1.25;margin-bottom:9px}.search-card h3 a{color:var(--navy)}.search-card p{color:var(--grey);font-size:13.5px;line-height:1.55;margin-bottom:15px}.search-card .arrow{color:var(--blue);font-size:13px;font-weight:800}.search-empty{padding:48px;border-radius:15px;background:var(--blue-light);text-align:center}.search-empty h2{color:var(--navy);margin-bottom:8px}.search-empty p{color:var(--grey);margin-bottom:20px}
@media(max-width:1080px){.site-search{min-width:44px}.site-search input{width:120px}.search-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:880px){.site-search{display:flex;margin-left:auto;min-width:150px}.site-search input{width:112px}.menu-toggle{margin-left:0}.search-grid{grid-template-columns:1fr}.cs-search-page .search-hero h1{font-size:36px}}
@media(max-width:620px){.site-header .nav{gap:10px}.site-header .nav .logo img,.site-header .nav .custom-logo{max-width:130px}.site-search{min-width:126px}.site-search input{width:88px;padding-left:10px}}
@media(max-width:420px){.site-header .nav .logo img,.site-header .nav .custom-logo{max-width:112px}.site-search{min-width:108px}.site-search input{width:70px;font-size:11.5px}}
@media(max-width:560px){.search-page-form{display:block}.search-page-form .btn{margin-top:10px;width:100%}.search-empty{padding:34px 20px}}
body{
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);line-height:1.55;background:#fff;-webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--blue)}
h1,h2,h3{line-height:1.15;letter-spacing:-.01em}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;padding:12px 20px;border-radius:8px;transition:.2s;cursor:pointer;border:none}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-dark)}
.btn-outline{background:#fff;color:var(--ink);border:1.5px solid var(--line)}
.btn-outline:hover{border-color:var(--navy)}
.arrow::after{content:"\2192";font-weight:700}
.link{color:var(--ink);font-weight:600;font-size:14px;display:inline-flex;gap:6px;align-items:center}
.link::after{content:"\2192";color:var(--blue);transition:.2s}
.link:hover::after{transform:translateX(3px)}

/* HEADER */
header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.topbar{background:#f4f8fc;border-bottom:1px solid var(--line);font-size:13px}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;height:42px}
.topbar-left{display:flex;gap:24px}
.topbar-left a{display:flex;align-items:center;gap:7px;color:var(--grey);font-weight:500}
.topbar-left a:hover{color:var(--blue)}
.topbar-left svg{width:15px;height:15px}
.topbar-right{display:flex;align-items:center;gap:14px}
.btn-sm{padding:7px 15px;font-size:13px;border-radius:7px}
.basket{display:flex;align-items:center;gap:6px;color:var(--grey);font-size:12.5px}
.basket b{color:var(--navy)}.basket svg{width:18px;height:18px}
.nav{display:flex;align-items:center;gap:26px;height:72px;position:relative}
.logo img{height:40px;width:auto;display:block}
.site-header .nav .logo img,.site-header .nav .custom-logo{height:44px !important;width:auto !important;max-width:200px;object-fit:contain}
.site-header .nav .custom-logo-link{display:block;line-height:0}
nav.menu{display:flex;gap:4px;margin-left:14px;height:72px}
.nav-item{position:relative;display:flex;align-items:center;gap:5px;height:72px;padding:0 9px;font-size:14.5px;font-weight:600;color:var(--ink);cursor:pointer}
.nav-item:hover{color:var(--blue)}
.nav-item > span{display:flex;align-items:center;gap:5px}
.caret{font-size:9px;color:var(--grey)}
.dropdown{position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--line);border-top:2px solid var(--blue);box-shadow:0 18px 36px rgba(10,42,94,.12);padding:24px;display:none;z-index:70;border-radius:0 0 12px 12px}
.nav-item:hover > .dropdown{display:block}
.nav-item.has-mega{position:static}
.dropdown.mega{left:0;right:0}
.mega-grid{display:grid;gap:22px}
.m5{grid-template-columns:repeat(5,1fr)}
.m3{grid-template-columns:repeat(3,1fr)}
.col h5{font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--navy);font-weight:800;margin-bottom:11px}
.col a{display:block;font-size:12.7px;color:var(--grey);padding:4px 0;font-weight:500}
.col a:hover{color:var(--blue)}
.col a.ov{color:var(--blue);font-weight:700;margin-bottom:5px}
.dropdown.small{width:250px;padding:12px}
.dropdown.small a{display:block;font-size:13.5px;color:var(--ink);padding:8px 10px;border-radius:7px;font-weight:500}
.dropdown.small a:hover{background:#f4f8fc;color:var(--blue)}
.menu-toggle{display:none;background:none;border:none;font-size:26px;color:var(--navy);cursor:pointer;margin-left:auto}

/* HERO SLIDER */
.hero{position:relative;overflow:hidden;padding:0}
.slide{display:none}
.slide.active{display:block}
.slide-inner{padding:46px 0 26px}
.s-abs{background:linear-gradient(180deg,#eaf3fb,#f4f9fd)}
.s-board{background:linear-gradient(180deg,#faf4e7,#fbf9f4)}
.s-board .eyebrow{color:var(--gold)}
.s-board h1 span{color:var(--gold)}
.s-board .feature .fi{color:var(--gold)}
.hero-visual{position:relative;display:flex;flex-direction:column;gap:13px;align-items:center;justify-content:center;min-height:440px}
.rings{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:540px;height:540px;border-radius:50%;z-index:0;opacity:.55;pointer-events:none}
.b-abs{background:repeating-radial-gradient(circle at center,transparent 0 33px,rgba(43,143,216,.13) 33px 34px)}
.b-board{background:repeating-radial-gradient(circle at center,transparent 0 33px,rgba(194,146,46,.16) 33px 34px)}
.visual-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;width:100%;position:relative;z-index:2}
.illustration{position:relative;z-index:2;display:flex;justify-content:center;margin:4px 0}
.illustration svg{width:240px;height:auto;filter:drop-shadow(0 14px 24px rgba(10,42,94,.15))}
.pcard-light{background:#fbf6ea;color:var(--ink);border:1px solid #ecdfc4}
.pcard-light h4{color:var(--navy)}
.pcard-light span{color:var(--grey)}
.pcard-light .more{color:var(--blue)}
.c-gold{background:var(--gold)}
.dots{display:flex;gap:9px;justify-content:center;padding:14px 0 4px}
.dot{width:11px;height:11px;border-radius:50%;background:#c4d2e2;cursor:pointer;border:none;transition:.2s;padding:0}
.dot.active{background:var(--navy);width:28px;border-radius:6px}
.slider-arrow{position:absolute;top:46%;z-index:6;width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:0 5px 16px rgba(0,0,0,.1);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--navy);font-size:20px;line-height:1}
.slider-arrow.prev{left:14px}
.slider-arrow.next{right:14px}
.hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;align-items:center}
.hero h1{font-size:46px;font-weight:800;color:var(--ink);margin:14px 0 16px}
.hero h1 span{color:var(--blue)}
.hero p.lede{font-size:16.5px;color:var(--grey);max-width:430px;margin-bottom:26px}
.hero-cta{display:flex;gap:12px;margin-bottom:34px}
.features{display:flex;gap:18px;flex-wrap:nowrap}
.feature{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.feature .fi{width:30px;height:30px;color:var(--blue)}
.feature .fi-img{object-fit:contain;display:block}
.feature b{font-size:13px;line-height:1.25}
.feature small{font-size:11px;color:var(--grey)}

/* PRODUCT CARD GRID */
.prod-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;position:relative}
.pcard{border-radius:12px;padding:16px;color:#fff;min-height:120px;display:flex;flex-direction:column;justify-content:space-between}
.pcard .pi{width:30px;height:30px;opacity:.95}
.pcard .pi-img{object-fit:contain;display:block;width:36px;height:36px;padding:6px;border-radius:50%;background:rgba(255,255,255,.92);opacity:1}
.pcard h4{font-size:15px;font-weight:700;margin-top:auto}
.pcard span{font-size:11.5px;opacity:.85;font-weight:500}
.pcard .more{font-size:12px;font-weight:600;margin-top:8px}
.c-navy{background:var(--navy)} .c-blue{background:#1f6fc4}
.c-lblue{background:#3a97da} .c-green{background:var(--green)}
.c-teal{background:var(--teal)} .c-orange{background:var(--orange)}

/* SECTION SHELL */
section{padding:64px 0}
.sec-head{text-align:center;max-width:640px;margin:0 auto 40px}
.sec-head h2{font-size:34px;font-weight:800;margin:8px 0}
.sec-head p{color:var(--grey);font-size:16px}

/* CATEGORY CARDS */
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cat{border-radius:var(--radius);overflow:hidden;color:#fff;min-height:300px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.cat.blue{background:linear-gradient(160deg,#2b6fb8,#0a2a5e)}
.cat.gold{background:linear-gradient(160deg,#d4a23c,#9c7320)}
.cat.green{background:linear-gradient(160deg,#5aa84f,#356b2c)}
.cats .cat{background-size:cover;background-position:center;background-blend-mode:multiply}
.cats .cat:nth-child(1){background-image:linear-gradient(160deg,rgba(10,42,94,.82),rgba(10,42,94,.48)),url('/wp-content/uploads/2026/07/h01-absorbency-salmon-pad.png')}
.cats .cat:nth-child(2){background-image:linear-gradient(160deg,rgba(116,75,9,.75),rgba(116,75,9,.36)),url('/wp-content/uploads/2026/07/h02-board-solutions.png')}
.cats .cat:nth-child(3){background-image:linear-gradient(160deg,rgba(20,68,28,.82),rgba(20,68,28,.43)),url('/wp-content/uploads/2026/07/h03-flexible-packaging.png')}
.cat .badge{position:absolute;top:24px;left:30px;width:46px;height:46px;background:rgba(255,255,255,.18);border-radius:10px;display:flex;align-items:center;justify-content:center}
.cat .badge img{display:block;width:30px;height:30px;object-fit:contain}
.cat h3{font-size:24px;font-weight:800;letter-spacing:.02em;margin-bottom:10px}
.cat p{font-size:14px;opacity:.92;margin-bottom:18px;max-width:300px}
.cat .btn{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.35);align-self:flex-start}
.cat .btn:hover{background:rgba(255,255,255,.26)}

/* INDUSTRIES */
.ind-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:14px}
.ind{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;transition:.2s}
.ind:hover{box-shadow:0 8px 24px rgba(10,42,94,.08);transform:translateY(-3px)}
.ind .photo{height:auto;aspect-ratio:3 / 2;background-size:cover;background-position:center;position:relative}
.ind-grid .ind:nth-child(1) .photo{background-image:url('/wp-content/uploads/2026/07/h04-meat.png')!important}.ind-grid .ind:nth-child(2) .photo{background-image:url('/wp-content/uploads/2026/07/h05-poultry.png')!important}.ind-grid .ind:nth-child(3) .photo{background-image:url('/wp-content/uploads/2026/07/h06-seafood-salmon.png')!important}.ind-grid .ind:nth-child(4) .photo{background-image:url('/wp-content/uploads/2026/07/h07-shellfish-prawns.png')!important}.ind-grid .ind:nth-child(5) .photo{background-image:url('/wp-content/uploads/2026/07/h08-berries-produce.png')!important}.ind-grid .ind:nth-child(6) .photo{background-image:url('/wp-content/uploads/2026/07/h09-horticulture.png')!important}.ind-grid .ind:nth-child(7) .photo{background-image:url('/wp-content/uploads/2026/07/h10-healthcare.png')!important}
.ind-grid .ind .photo{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}
.ind .ic{position:absolute;bottom:-17px;left:14px;width:36px;height:36px;padding:5px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 2px 8px rgba(10,42,94,.14)}
.ind .ic img{display:block;width:100%;height:100%;object-fit:contain}
.ind .body{padding:22px 14px 16px}
.ind h4{font-size:14px;font-weight:700;margin-bottom:6px}
.ind p{font-size:11.5px;color:var(--grey);margin-bottom:12px;min-height:62px}
.ind .link{font-size:12.5px}
.center{text-align:center;margin-top:36px}

/* CHALLENGES */
.challenge{background:linear-gradient(180deg,#f4f9fd,#eaf3fb);}
.ch-grid{display:grid;grid-template-columns:.8fr 2fr;gap:50px;align-items:center}
.ch-left h2{font-size:30px;font-weight:800;margin:10px 0 14px}
.ch-left p{color:var(--grey);font-size:15px;margin-bottom:22px}
.ch-flow{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.ch{ text-align:center;padding:6px}
.ch .ci{width:40px;height:40px;margin:0 auto 12px;color:var(--blue)}
.ch .ci-img{object-fit:contain;display:block}
.ch b{display:block;font-size:13px;margin-bottom:6px}
.ch small{font-size:11px;color:var(--grey);display:block;min-height:48px}
.ch .sol{font-size:11.5px;color:var(--grey);margin-top:10px;display:block}
.ch .sol b{color:var(--blue);font-size:13px;margin-top:2px}

/* SUSTAINABILITY */
.sus-grid{display:grid;grid-template-columns:1fr 2fr;gap:50px;align-items:center}
.sus-left{background:linear-gradient(160deg,#2f7d3a,#14441c);color:#fff;border-radius:var(--radius);padding:40px;min-height:300px;display:flex;flex-direction:column;justify-content:center}
.sus-left{background-image:linear-gradient(160deg,rgba(20,68,28,.88),rgba(20,68,28,.48)),url('/wp-content/uploads/2026/07/h12-sustainability-home.png');background-size:cover;background-position:center}
.sus-left .eyebrow{color:#bfe6b5}
.sus-left h2{font-size:30px;font-weight:800;margin:10px 0 14px}
.sus-left p{font-size:14.5px;opacity:.92;margin-bottom:22px}
.sus-left .btn{background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.4);align-self:flex-start}
.sus-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.sus-col .si{width:42px;height:42px;color:var(--green);margin-bottom:14px}
.sus-col .si-img{object-fit:contain;display:block}
.sus-col h4{font-size:15px;font-weight:700;margin-bottom:8px}
.sus-col p{font-size:13px;color:var(--grey)}

/* EXPERTISE */
.exp-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;align-items:center}
.exp-photo{background:linear-gradient(160deg,#cfe0ef,#9db9d4);border-radius:var(--radius);min-height:260px;display:flex;align-items:center;justify-content:center;color:#5c7796;font-weight:600}
.exp-mid h3{font-size:24px;font-weight:800;margin:8px 0 12px}
.exp-mid p{font-size:14px;color:var(--grey);margin-bottom:18px}
.checks{list-style:none;display:flex;flex-direction:column;gap:10px}
.checks li{font-size:13.5px;display:flex;gap:10px;align-items:flex-start}
.checks li::before{content:"\2713";color:var(--blue);font-weight:800}
.exp-right h3{font-size:22px;font-weight:800;margin:8px 0 18px}
.stats{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:18px}
.stat{flex:1}
.stat b{display:block;font-size:20px;font-weight:800;color:var(--navy)}
.stat small{font-size:11.5px;color:var(--grey)}
.map{height:120px;background:radial-gradient(circle at 30% 40%,#dce8f4,#eef5fb);border-radius:10px;margin-bottom:18px;display:flex;align-items:center;justify-content:center;color:#9db4cc;font-size:13px;font-weight:600}

/* CTA STRIP */
.cta{background:var(--navy);color:#fff;padding:36px 0}
.cta-grid{display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.cta h3{font-size:24px;font-weight:800}
.cta p{font-size:14px;opacity:.85}
.cta-items{margin-left:auto;display:flex;gap:34px}
.cta-item{display:flex;align-items:center;gap:12px;font-weight:600;font-size:14px}
.cta-item .ci{width:26px;height:26px;color:#7fb4e6}
.cta-item .ci-img{object-fit:contain;padding:4px;border-radius:50%;background:rgba(255,255,255,.94)}
.cta-item small{display:block;font-weight:400;opacity:.75;font-size:12px}

/* FOOTER */
footer.site-footer{background:var(--navy-dark);color:#c5d2e4;padding:54px 0 28px;font-size:13.5px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr 1.2fr;gap:30px}
.foot .logo{color:#fff;margin-bottom:14px;display:inline-block}
.foot .logo small{color:#8fb6e0}
.foot p.tag{font-size:13px;opacity:.8;max-width:240px;margin-bottom:18px}
.socials{display:flex;gap:10px}
.socials a{width:32px;height:32px;border-radius:7px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:#fff}
.foot h5{color:#fff;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.foot ul li{opacity:.85}
.foot ul li:hover{opacity:1;color:#fff;cursor:pointer}
.foot-contact div{margin-bottom:10px;line-height:1.5}
.copyright{border-top:1px solid rgba(255,255,255,.1);margin-top:38px;padding-top:20px;font-size:12px;opacity:.6;text-align:center}

/* PRODUCT ARCHIVE + SINGLE (catalogue) */
.page-head{background:var(--blue-light);padding:40px 0}
.page-head h1{font-size:34px;font-weight:800;color:var(--navy)}
.page-head .crumbs{font-size:12.5px;color:var(--grey);margin-bottom:8px}
.page-head .crumbs a{color:var(--blue)}
.catalogue{display:grid;grid-template-columns:260px 1fr;gap:34px;padding:44px 0}
.filters{border:1px solid var(--line);border-radius:12px;padding:20px;height:max-content;position:sticky;top:96px}
.filters h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--navy);margin:14px 0 8px}
.filters h4:first-child{margin-top:0}
.filters a{display:block;font-size:13px;color:var(--grey);padding:4px 0}
.filters a:hover,.filters a.active{color:var(--blue);font-weight:600}
.prod-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.prod-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;transition:.2s;display:flex;flex-direction:column}
.prod-card:hover{box-shadow:0 10px 28px rgba(10,42,94,.1);transform:translateY(-3px)}
.prod-card .thumb{height:170px;background:var(--blue-light);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;color:#9db4cc}
.prod-card .pc-body{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.prod-card .brand{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.prod-card h3{font-size:16px;font-weight:700;color:var(--ink)}
.prod-card p{font-size:13px;color:var(--grey);flex:1}
.prod-card .link{margin-top:6px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:10.5px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--blue-light);color:var(--blue)}

.single-prod{display:grid;grid-template-columns:1fr 1fr;gap:44px;padding:44px 0}
.single-prod .gallery{background:var(--blue-light);border-radius:14px;min-height:380px;display:flex;align-items:center;justify-content:center;color:#9db4cc}
.single-prod .brand{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue)}
.single-prod h1{font-size:32px;font-weight:800;color:var(--navy);margin:8px 0 14px}
.single-prod .lede{font-size:16px;color:var(--grey);margin-bottom:20px}
.spec-table{width:100%;border-collapse:collapse;margin:18px 0}
.spec-table th,.spec-table td{text-align:left;font-size:13.5px;padding:10px 12px;border-bottom:1px solid var(--line)}
.spec-table th{color:var(--navy);font-weight:700;width:38%}
.prod-section{padding:0 0 48px}
.prod-section h2{font-size:22px;font-weight:800;color:var(--navy);margin-bottom:14px}
.feature-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.feature-list li{font-size:14px;display:flex;gap:10px;align-items:flex-start;color:var(--ink)}
.feature-list li::before{content:"\2713";color:var(--green);font-weight:800}

@media(max-width:980px){
  .hero-grid,.ch-grid,.sus-grid,.exp-grid{grid-template-columns:1fr}
  .cats{grid-template-columns:1fr}
  .cat{min-height:340px}
  .ind-grid{grid-template-columns:repeat(3,1fr)}
  .ch-flow{grid-template-columns:repeat(3,1fr)}
  .sus-cols{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr 1fr}
  nav.menu,.topbar-left{display:none}
  .menu-toggle{display:block}
  .catalogue{grid-template-columns:1fr}
  .filters{position:static}
  .prod-cards{grid-template-columns:repeat(2,1fr)}
  .single-prod{grid-template-columns:1fr}
}
@media(max-width:620px){
  .ind-grid,.prod-grid,.prod-cards{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:28px 20px}
  .hero h1{font-size:34px}
  .sec-head h2{font-size:26px}
  .cta-items{margin-left:0;flex-wrap:wrap}
  .feature-list{grid-template-columns:1fr}
}

/* =====================================================================
   SINGLE PRODUCT PAGE (scoped under .cs-product to avoid homepage clashes)
   ===================================================================== */
.cs-product .sec-title{text-align:center;font-size:26px;font-weight:800;color:var(--navy);margin-bottom:8px}
.cs-product section{padding:46px 0}
.cs-product .btn-ghost{background:none;color:var(--blue);padding:12px 4px}
.cs-product .btn-white{background:#fff;color:var(--navy)}
.cs-product .crumb{font-size:12.5px;color:var(--grey);padding:14px 0 0}
.cs-product .crumb a:hover{color:var(--blue)}
.cs-product .crumb span{color:var(--blue);font-weight:600}

.cs-product .p-hero{background:linear-gradient(180deg,#eef5fb,#f7fbfe);padding:22px 0 44px}
.cs-product .p-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.cs-product .p-hero-grid>*{min-width:0}
.cs-product .p-hero h1{font-size:42px;font-weight:800;color:var(--navy);margin:8px 0 6px}
.cs-product .p-hero h2{font-size:21px;font-weight:600;color:var(--blue);margin-bottom:16px}
.cs-product .p-hero p.lede{font-size:15.5px;color:var(--grey);max-width:440px;margin-bottom:22px}
.cs-product .p-hero-copy{margin-bottom:24px;max-width:540px}
.cs-product .p-hero-copy p{font-size:15.5px;color:var(--grey);margin-bottom:12px}
.cs-product .p-hero-copy p:last-child{margin-bottom:0}
.cs-product .p-hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.cs-product .chips{display:flex;justify-content:center;gap:22px;flex-wrap:wrap}
.cs-product .chip{display:flex;flex:0 1 128px;flex-direction:column;gap:7px;align-items:center;justify-content:flex-start;text-align:center;min-width:104px}
.cs-product .chip .dot{width:34px;height:34px;flex:0 0 34px;border-radius:9px;background:var(--blue-light);display:flex;align-items:center;justify-content:center;color:var(--blue);font-weight:800;line-height:1}
.cs-product .chip .dot img,.cs-product .chip > img{display:block;width:22px;height:22px;max-width:100%;object-fit:contain;object-position:center}
.cs-product .chip b{width:100%;margin:0}
.cs-product .chip b{font-size:11.5px;font-weight:700;line-height:1.25}
.cs-product .chip .dot.canva-icon{background:transparent}
.cs-product .chip .dot.canva-icon img{width:34px;height:34px}
.cs-product .p-hero-media{position:relative}
.cs-product .p-hero-img{background:linear-gradient(135deg,#dbe7f3,#b9cde2);border-radius:18px;min-height:360px;display:flex;align-items:center;justify-content:center;color:#7d8ca1;font-weight:600;overflow:hidden}
.cs-product .p-hero-img img{width:100%;height:100%;object-fit:cover}
.cs-product .p-hero-badge{position:absolute;right:-6px;bottom:18px;background:var(--navy);color:#fff;border-radius:12px;padding:14px 18px;display:flex;gap:10px;align-items:center;max-width:240px;box-shadow:0 12px 30px rgba(10,42,94,.25)}
.cs-product .p-hero-badge b{font-size:14px;display:block}
.cs-product .p-hero-badge small{font-size:11px;opacity:.8}

.cs-product .panel{background:var(--panel,#f4f8fc);border-radius:14px}
.cs-product .challenge-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:24px}
.cs-product .challenge-sub{text-align:center;color:var(--grey);font-size:14px}
.cs-product .ch-item{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;width:160px}
.cs-product .ch-item .dot{width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--navy);font-weight:800}
.cs-product .ch-item b{font-size:13.5px;font-weight:600;color:var(--ink)}
.cs-product .ch-item .dot.canva-icon{width:48px;height:48px;border:0;background:transparent}
.cs-product .ch-item .dot.canva-icon img{display:block;width:48px;height:48px;object-fit:contain}

.cs-product .steps{display:grid;grid-template-columns:repeat(var(--step-count,5),minmax(0,1fr));gap:8px;margin-top:26px;align-items:start}
.cs-product .step{text-align:center;padding:0 6px;position:relative}
.cs-product .step .num{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.cs-product .step p{font-size:12.5px;color:var(--grey)}
.cs-product .step:not(:last-child)::after{content:"\2192";position:absolute;top:6px;right:-10px;color:#b8c6d6;font-size:18px}

.cs-product .benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.cs-product .benefit{background:var(--panel,#f4f8fc);border-radius:12px;padding:22px 18px}
.cs-product .benefit b{font-size:14.5px;display:block;margin-bottom:8px;color:var(--navy)}
.cs-product .benefit p{font-size:13px;color:var(--grey)}

.cs-product .two-col{display:grid;grid-template-columns:1.3fr 1fr;gap:34px}
.cs-product .col-title{font-size:18px;font-weight:800;color:var(--navy);text-align:center;margin-bottom:6px}
.cs-product .ideal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.cs-product .ideal{border:1px solid var(--line);border-radius:10px;padding:14px 8px;text-align:center;font-size:12.5px;font-weight:600;color:var(--ink);background:#fff}

.cs-product .opts-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:34px;align-items:start}
.cs-product .opt-box{display:flex;gap:30px;flex-wrap:wrap}
.cs-product .opt-col h4{font-size:13px;font-weight:700;margin-bottom:12px;color:var(--ink)}
.cs-product .opt-col ul{list-style:none;display:flex;flex-direction:column;gap:6px}
.cs-product .opt-col li{font-size:12.5px;color:var(--grey)}
.cs-product .opts-note{font-size:12px;color:var(--grey);margin-top:18px;font-style:italic}
.cs-product .specs{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cs-product .spec-row{display:flex;justify-content:space-between;gap:16px;padding:13px 18px;border-bottom:1px solid var(--line);font-size:13px}
.cs-product .spec-row:last-child{border-bottom:none}
.cs-product .spec-row .k{font-weight:600;color:var(--ink)}
.cs-product .spec-row .v{color:var(--grey);text-align:right}

.cs-product .help{background:var(--navy);color:#fff;border-radius:14px;padding:28px 34px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.cs-product .help h3{font-size:20px;font-weight:800}
.cs-product .help p{font-size:13px;opacity:.85}
.cs-product .help .acts{margin-left:auto;display:flex;gap:12px}
.cs-product .help .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}

.cs-product .fieldnote{background:#fff8e6;border:1px solid #f0dca0;color:#7a5b12;font-size:12px;border-radius:8px;padding:8px 12px;display:inline-block;margin-top:10px}

@media(max-width:980px){
  .cs-product .p-hero-grid,.cs-product .two-col,.cs-product .opts-grid{grid-template-columns:1fr}
  .cs-product .steps,.cs-product .benefits{grid-template-columns:repeat(2,1fr)}
  .cs-product .ideal-grid{grid-template-columns:repeat(2,1fr)}
  .cs-product .step:not(:last-child)::after{display:none}
  .cs-product .p-hero h1{font-size:32px}
}
@media(max-width:620px){
  .cs-product .p-hero-grid{gap:28px}
  .cs-product .p-hero h1{font-size:30px;overflow-wrap:break-word}
  .cs-product .prod-card,.cs-product .pc-body{min-width:0}
  .cs-product .prod-card h3{overflow-wrap:break-word}
  .cs-product .p-hero-badge{right:8px;max-width:calc(100% - 16px)}
}

/* =====================================================================
   CATEGORY / LISTING PAGE (scoped under .cs-cat)
   ===================================================================== */
.cs-cat .crumb{font-size:12.5px;color:var(--grey);padding:16px 0 0}
.cs-cat .crumb a:hover{color:var(--blue)}
.cs-cat .crumb span{color:var(--blue);font-weight:600}
.cs-cat .cat-hero{background:linear-gradient(180deg,#eef5fb,#f7fbfe);padding:14px 0 44px}
.cs-cat .cat-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center}
.cs-cat .cat-hero h1{font-size:42px;font-weight:800;color:var(--navy);margin:10px 0 16px;line-height:1.1}
.cs-cat .cat-hero p{font-size:14.5px;color:var(--grey);max-width:470px;margin-bottom:16px}
.cs-cat .cat-hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.cs-cat .cat-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:230px}
.cs-cat .cat-visual .rings{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:360px;height:360px;border-radius:50%;background:repeating-radial-gradient(circle at center,transparent 0 30px,rgba(43,143,216,.12) 30px 31px);opacity:.6}
.cs-cat .cat-visual .glyph{position:relative;z-index:2;width:180px;height:180px;border-radius:24px;background:linear-gradient(135deg,#dbe7f3,#b9cde2);display:flex;align-items:center;justify-content:center;color:#5c7796;font-weight:800;font-size:15px;text-align:center;padding:16px;box-shadow:0 16px 28px rgba(10,42,94,.18)}
.cs-cat .cat-visual.has-image{min-height:270px;overflow:visible;border-radius:0;box-shadow:none;background:transparent;padding:0}
.cs-cat .cat-hero-image{display:block;width:100%;height:270px;object-fit:contain;object-position:center}
.cs-form-page{padding:84px 0;background:#f7fafc;min-height:65vh}.narrow{max-width:820px}.cs-form-page h1{font-size:clamp(38px,5vw,62px);margin:6px 0 14px}.cs-form-page .lede{font-size:19px;color:#60758d;max-width:680px}.cs-enquiry-form{margin-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:30px;background:#fff;border:1px solid #dce6f0;border-radius:16px}.cs-enquiry-form label{display:flex;flex-direction:column;gap:7px;font-weight:700;color:#1d2d42}.cs-enquiry-form input,.cs-enquiry-form textarea{font:inherit;padding:12px;border:1px solid #bdcddd;border-radius:7px;background:#fff;color:#1d2d42}.cs-enquiry-form .full{grid-column:1/-1}.cs-enquiry-form button{justify-self:start;border:0;cursor:pointer}.form-notice{margin:24px 0 0;padding:14px 16px;border-radius:8px}.form-notice.success{background:#e9f6ef;color:#17663b}.form-notice.error{background:#fff0ef;color:#a42b22}@media(max-width:650px){.cs-enquiry-form{grid-template-columns:1fr}.cs-enquiry-form .full{grid-column:auto}}
.cs-about-hero{padding:110px 0 96px;background:#edf5fb}.cs-about-hero h1{max-width:780px;font-size:clamp(42px,6vw,76px);margin:8px 0 18px}.cs-about-hero p{max-width:650px;font-size:20px;color:#5e7187;margin-bottom:28px}.cs-about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;padding:90px 20px}.cs-about-grid h2,.cs-about-band h2,.cs-about-cta h2{font-size:clamp(30px,4vw,48px);margin:8px 0 16px}.cs-about-grid p{font-size:18px;line-height:1.65;color:#587087}.about-points{display:grid;gap:16px}.about-points div{padding:22px;border-left:4px solid #2b8fd8;background:#f7fafc}.about-points strong,.about-points span{display:block}.about-points strong{font-size:18px;color:#102e5b;margin-bottom:5px}.about-points span{color:#60758d}.cs-about-band{background:#102e5b;color:#fff;padding:78px 0}.cs-about-band p{max-width:690px;color:#d4e2f2;font-size:18px;line-height:1.6}.cs-about-band .eyebrow{color:#72b6eb}.cs-about-cta{text-align:center;padding:86px 20px}.cs-about-cta p{color:#60758d;margin-bottom:26px}@media(max-width:700px){.cs-about-grid{grid-template-columns:1fr;gap:36px;padding:60px 20px}}

.cs-cat .cat-layout{display:grid;grid-template-columns:264px 1fr;gap:32px;align-items:start;padding:34px 0 10px}
.cs-cat .filters{border:1px solid var(--line);border-radius:14px;padding:6px 18px 18px;position:sticky;top:96px}
.cs-cat .mobile-filter-checkbox,.cs-cat .mobile-filter-button{display:none}
.cs-cat .f-head{display:flex;justify-content:space-between;align-items:center;padding:14px 0 10px}
.cs-cat .f-head b{font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--navy);text-transform:uppercase}
.cs-cat .f-head a{font-size:11.5px;color:var(--blue);font-weight:600}
.cs-cat .f-group{border-top:1px solid var(--line);padding:13px 0}
.cs-cat .f-group h4{font-size:11.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);margin-bottom:10px}
.cs-cat .f-opt{display:block;font-size:12.7px;color:var(--grey);padding:5px 0}
.cs-cat .f-opt:hover,.cs-cat .f-opt.active{color:var(--blue);font-weight:600}
.cs-cat .f-opt .c{color:#9aa7b6;font-size:11.5px}
.cs-cat .f-help{background:var(--panel,#f4f8fc);border-radius:10px;padding:14px;margin-top:16px}
.cs-cat .f-help b{font-size:12.5px;display:block;margin-bottom:5px;color:var(--navy)}
.cs-cat .f-help p{font-size:11.5px;color:var(--grey);margin-bottom:10px}
.cs-cat .f-help a{font-size:12px;font-weight:700;color:var(--blue)}

.cs-cat .lhead{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.cs-cat .lhead h2{font-size:22px;font-weight:800;color:var(--navy)}
.cs-cat .lhead .count{font-size:12.5px;color:var(--grey)}

.cs-cat .subcats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:6px 0 26px}
.cs-cat .subcat{border-radius:11px;padding:16px;color:#fff;min-height:96px;display:flex;flex-direction:column;justify-content:flex-end}
.cs-cat .subcat b{font-size:13px;font-weight:700}
.cs-cat .subcat small{font-size:10.5px;opacity:.9;line-height:1.3}
.cs-cat .subcat .ex{font-size:11px;font-weight:600;margin-top:8px}
.cs-cat .c-navy{background:var(--navy)}.cs-cat .c-blue{background:#1f6fc4}.cs-cat .c-bbright{background:#2b8fd8}
.cs-cat .c-lblue{background:#3a97da}.cs-cat .c-green{background:var(--green)}.cs-cat .c-gold{background:#d98a2b}

.cs-cat .plist{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cs-cat .pcard2{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#fff;display:flex;flex-direction:column;transition:.2s}
.cs-cat .pcard2:hover{box-shadow:0 12px 28px rgba(10,42,94,.10);transform:translateY(-3px)}
.cs-cat .pcard2 .img{height:160px;position:relative;background:var(--blue-light);display:flex;align-items:center;justify-content:center;color:#9db4cc;overflow:hidden}
.cs-cat .pcard2 .img img{width:100%;height:100%;object-fit:cover}
.cs-cat .pcard2 .body{padding:18px;flex:1;display:flex;flex-direction:column}
.cs-cat .pcard2 h3{font-size:16px;font-weight:800;color:var(--navy);line-height:1.22}
.cs-cat .pcard2 .sub{font-size:11.5px;color:var(--blue);font-weight:700;margin-top:4px;text-transform:uppercase;letter-spacing:.04em}
.cs-cat .pcard2 .desc{font-size:12.2px;color:var(--grey);margin-top:10px;line-height:1.5}
.cs-cat .pcard2 .vp{margin-top:auto;padding-top:14px;font-size:12px;font-weight:700;color:var(--blue)}

/* Application groups ("fruit with fruit, meat with meat") */
.cs-cat .pgroup{padding:0;margin:0 0 32px}
.cs-cat .pgroup-head{display:flex;align-items:center;gap:12px;margin:0 0 16px}
.cs-cat .pgroup:first-of-type .pgroup-head{margin-top:0}
.cs-cat .pgroup-head h3{font-size:14px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--navy);white-space:nowrap;margin:0}
.cs-cat .pgroup-head .pgroup-count{font-size:11px;font-weight:700;color:var(--blue);background:var(--blue-light);border-radius:20px;padding:2px 10px;line-height:1.5}
.cs-cat .pgroup-head:after{content:"";flex:1;height:1px;background:var(--line)}

.cs-cat .pagination{display:flex;gap:8px;justify-content:center;align-items:center;margin:34px 0 6px}
.cs-cat .pagination .page-numbers{min-width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:9px;font-size:13px;font-weight:600;color:var(--ink);border:1px solid var(--line);padding:0 12px}
.cs-cat .pagination .page-numbers.current{background:var(--navy);color:#fff;border-color:var(--navy)}
.cs-cat .pagination a.page-numbers:hover{border-color:var(--navy)}

.cs-cat .help{background:var(--navy);color:#fff;border-radius:14px;padding:26px 32px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin:42px 0}
.cs-cat .help h3{font-size:19px;font-weight:800}
.cs-cat .help p{font-size:13px;opacity:.85}
.cs-cat .help .acts{margin-left:auto;display:flex;gap:12px}
.cs-cat .help .btn-white{background:#fff;color:var(--navy)}
.cs-cat .help .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}

@media(max-width:1080px){
  .cs-cat .cat-layout{grid-template-columns:1fr}
  .cs-cat .filters{position:static}
  .cs-cat .plist{grid-template-columns:repeat(3,1fr)}
  .cs-cat .subcats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:880px){
  .cs-cat .cat-hero-grid{grid-template-columns:1fr}
  .cs-cat .cat-visual{display:none}
  .cs-cat .plist{grid-template-columns:repeat(2,1fr)}
  .cs-cat .filters{padding:0;border:0;background:transparent}
  .cs-cat .mobile-filter-checkbox{position:absolute;opacity:0;pointer-events:none}
  .cs-cat .mobile-filter-button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px 17px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--navy);font-size:14px;font-weight:800;cursor:pointer;box-shadow:0 4px 14px rgba(18,48,78,.06)}
  .cs-cat .mobile-filter-chevron{transition:transform .18s ease}
  .cs-cat .mobile-filter-content{display:none;margin-top:10px;padding:6px 18px 18px;border:1px solid var(--line);border-radius:12px;background:#fff}
  .cs-cat .mobile-filter-checkbox:checked + .mobile-filter-button .mobile-filter-chevron{transform:rotate(180deg)}
  .cs-cat .mobile-filter-checkbox:checked + .mobile-filter-button + .mobile-filter-content{display:block}
}
@media(max-width:560px){.cs-cat .plist,.cs-cat .subcats{grid-template-columns:1fr 1fr}.cs-cat .cat-hero h1{font-size:32px}}

/* =====================================================================
   SUSTAINABILITY LANDING (scoped under .cs-sustain)
   ===================================================================== */
.cs-sustain .crumb{font-size:12.5px;color:var(--grey);padding:16px 0 0}
.cs-sustain .crumb a:hover{color:var(--blue)}
.cs-sustain .s-hero{background:linear-gradient(180deg,#eef5fb,#f2fbf3);padding:24px 0 52px}
.cs-sustain .s-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center}
.cs-sustain .s-hero h1{font-size:48px;font-weight:800;color:var(--navy);line-height:1.08;margin:10px 0 16px}
.cs-sustain .s-hero h1 .b{color:var(--blue)}
.cs-sustain .s-hero h1 .g{color:var(--green)}
.cs-sustain .s-hero p{font-size:15.5px;color:var(--grey);max-width:460px;margin-bottom:22px}
.cs-sustain .s-hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.cs-sustain .s-visual{position:relative;min-height:300px;display:flex;align-items:center;justify-content:center}
.cs-sustain .s-visual .rings{position:absolute;inset:0;background:repeating-radial-gradient(circle at 60% 45%,transparent 0 30px,rgba(74,155,63,.10) 30px 31px);opacity:.7;border-radius:20px}
.cs-sustain .s-visual .panel{position:relative;z-index:2;width:78%;min-height:260px;border-radius:18px;background:linear-gradient(150deg,#dCEBD9,#bcd8ea);display:flex;align-items:center;justify-content:center;color:#5c7796;font-weight:600;overflow:hidden}
.cs-sustain .s-visual .panel img{width:100%;height:100%;object-fit:cover}

.cs-sustain .block{padding:56px 0}
.cs-sustain .band{background:#f7fafc}
.cs-sustain .sec-head{text-align:center;max-width:640px;margin:0 auto 38px}
.cs-sustain .sec-head h2{font-size:30px;font-weight:800;color:var(--navy);margin-bottom:8px}
.cs-sustain .sec-head p{color:var(--grey);font-size:15px}

.cs-sustain .commit-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.cs-sustain .commit{text-align:center}
.cs-sustain .commit .ic{width:44px;height:44px;color:var(--green);margin:0 auto 12px}
.cs-sustain .commit h4{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:7px}
.cs-sustain .commit p{font-size:12px;color:var(--grey);line-height:1.5}

.cs-sustain .design-grid{display:grid;grid-template-columns:1fr 2fr;gap:40px;align-items:center}
.cs-sustain .design-left h2{font-size:28px;font-weight:800;color:var(--navy);margin-bottom:12px}
.cs-sustain .design-left p{font-size:14px;color:var(--grey);margin-bottom:16px}
.cs-sustain .checks{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.cs-sustain .checks li{font-size:13.5px;display:flex;gap:10px;align-items:flex-start;color:var(--ink)}
.cs-sustain .checks li::before{content:"\2713";color:var(--green);font-weight:800}
.cs-sustain .design-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cs-sustain .dcard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.cs-sustain .dcard .top{height:120px;background:linear-gradient(150deg,#e3efe0,#cfe0ef);position:relative}
.cs-sustain .dcard .badge{position:absolute;bottom:-16px;left:16px;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--green)}
.cs-sustain .dcard .body{padding:24px 16px 18px}
.cs-sustain .dcard h4{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:6px}
.cs-sustain .dcard p{font-size:12px;color:var(--grey);line-height:1.5}

.cs-sustain .impact-grid{display:grid;grid-template-columns:1fr 2fr;gap:40px;align-items:center}
.cs-sustain .impact-left h2{font-size:28px;font-weight:800;color:var(--navy);margin-bottom:12px}
.cs-sustain .impact-left p{font-size:14px;color:var(--grey);margin-bottom:18px}
.cs-sustain .sol-panel{background:linear-gradient(150deg,#e7f2e3,#dbead6);border-radius:16px;padding:26px}
.cs-sustain .sol-panel h3{font-size:16px;font-weight:800;color:var(--navy);margin-bottom:18px}
.cs-sustain .sol-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.cs-sustain .scard{background:#fff;border-radius:10px;overflow:hidden;text-align:left}
.cs-sustain .scard .thumb{height:74px;background:var(--blue-light);display:flex;align-items:center;justify-content:center;color:#9db4cc;font-size:10px;overflow:hidden}
.cs-sustain .scard .thumb img{width:100%;height:100%;object-fit:cover}
.cs-sustain .scard .b{padding:10px}
.cs-sustain .scard h5{font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:4px}
.cs-sustain .scard p{font-size:10.5px;color:var(--grey);line-height:1.45}

.cs-sustain .standards-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.cs-sustain .standard{text-align:center}
.cs-sustain .standard .ic{width:40px;height:40px;color:var(--green);margin:0 auto 12px}
.cs-sustain .standard b{display:block;font-size:15px;color:var(--navy);margin-bottom:6px}
.cs-sustain .standard .lead{font-size:12px;font-weight:700;color:var(--green);letter-spacing:.04em}
.cs-sustain .standard p{font-size:11.5px;color:var(--grey);line-height:1.5}

.cs-sustain .s-cta{background:var(--navy);color:#fff;border-radius:16px;padding:30px 36px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:20px 0 10px}
.cs-sustain .s-cta h3{font-size:22px;font-weight:800}
.cs-sustain .s-cta p{font-size:13px;opacity:.85}
.cs-sustain .s-cta .acts{margin-left:auto;display:flex;gap:12px}
.cs-sustain .s-cta .btn-white{background:#fff;color:var(--navy)}
.cs-sustain .s-cta .btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}

@media(max-width:1080px){
  .cs-sustain .commit-grid,.cs-sustain .standards-grid{grid-template-columns:repeat(3,1fr)}
  .cs-sustain .design-grid,.cs-sustain .impact-grid{grid-template-columns:1fr}
  .cs-sustain .design-cards,.cs-sustain .sol-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:880px){
  .cs-sustain .s-hero-grid{grid-template-columns:1fr}
  .cs-sustain .s-hero h1{font-size:36px}
}
@media(max-width:560px){
  .cs-sustain .commit-grid,.cs-sustain .standards-grid,.cs-sustain .design-cards,.cs-sustain .sol-cards{grid-template-columns:1fr 1fr}
}
/* Sustainability page */
.cs-sustainability{background:#fff;color:var(--ink)}
.cs-sustainability .eyebrow{color:var(--green);font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;margin:0 0 12px}
.cs-sustainability .sus-hero{padding:18px 0 66px;background:linear-gradient(135deg,#edf4fa 0%,#f7fbf8 58%,#e8f2e7 100%)}
.cs-sustainability .sus-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,.92fr);gap:58px;align-items:center}
.cs-sustainability .sus-crumb{font-size:12px;color:#647487;margin:0 0 42px}.cs-sustainability .sus-crumb a{color:inherit}.cs-sustainability .sus-crumb span{padding:0 7px;color:#a5b1be}
.cs-sustainability .sus-hero h1{max-width:640px;color:var(--navy);font-size:54px;line-height:1.03;letter-spacing:-.045em;font-weight:800;margin:0 0 20px}.cs-sustainability .sus-hero h1 em{font-style:normal;color:var(--green)}
.cs-sustainability .sus-intro{max-width:580px;font-size:18px;line-height:1.55;color:#52657a;margin:0 0 28px}.cs-sustainability .sus-hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.cs-sustainability .sus-hero-media{border-radius:20px;overflow:hidden;box-shadow:0 22px 50px rgba(25,50,75,.14);aspect-ratio:1.32;background:#dde7da}.cs-sustainability .sus-hero-media img{display:block;width:100%;height:100%;object-fit:cover}
.cs-sustainability .sus-principles{padding:80px 0 74px}.cs-sustainability .sus-section-heading{max-width:700px;margin:0 auto 38px;text-align:center}.cs-sustainability h2{color:var(--navy);font-size:34px;line-height:1.12;letter-spacing:-.027em;font-weight:800;margin:0 0 13px}.cs-sustainability .sus-section-heading>p:last-child{color:#627387;font-size:16px;line-height:1.6}
.cs-sustainability .sus-principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.cs-sustainability .sus-principle{padding:27px 25px 25px;border:1px solid #dce6ed;border-radius:14px;background:#fff}.cs-sustainability .sus-principle img{width:48px;height:48px;object-fit:contain;margin:0 0 18px}.cs-sustainability .sus-principle h3{color:var(--navy);font-size:18px;font-weight:800;margin:0 0 8px}.cs-sustainability .sus-principle p{font-size:14px;line-height:1.56;color:#627387;margin:0}
.cs-sustainability .sus-feature{padding:66px 0;background:#f5f9f6}.cs-sustainability .sus-feature-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:68px;align-items:center}.cs-sustainability .sus-feature-copy>p:not(.eyebrow){max-width:630px;color:#5e7083;font-size:16px;line-height:1.62;margin:0 0 20px}.cs-sustainability .sus-feature ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}.cs-sustainability .sus-feature li{position:relative;padding-left:27px;color:#21344b;font-size:15px;font-weight:650}.cs-sustainability .sus-feature li:before{content:'✓';position:absolute;left:0;color:var(--green);font-weight:800}.cs-sustainability .sus-note{padding:30px;border-radius:15px;background:var(--navy);box-shadow:0 18px 36px rgba(15,45,91,.15)}.cs-sustainability .sus-note-kicker{color:#a7d39d;text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:800;margin:0 0 11px}.cs-sustainability .sus-note h3{color:#fff;font-size:23px;line-height:1.12;margin:0 0 12px}.cs-sustainability .sus-note p:not(.sus-note-kicker){color:#dce6f2;font-size:13.5px;line-height:1.6;margin:0 0 17px}.cs-sustainability .text-link{font-weight:800;color:var(--blue);font-size:14px}.cs-sustainability .sus-note .text-link{color:#fff}
.cs-sustainability .sus-solutions{padding:80px 0}.cs-sustainability .sus-solutions-top{display:flex;justify-content:space-between;gap:44px;align-items:end;margin:0 0 30px}.cs-sustainability .sus-solutions-top h2{max-width:520px}.cs-sustainability .sus-solutions-top>p{max-width:350px;color:#617287;line-height:1.57;font-size:15px;margin:0 0 4px}.cs-sustainability .sus-range-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cs-sustainability .sus-range{display:flex;flex-direction:column;border:1px solid #dce6ed;border-radius:14px;overflow:hidden;background:#fff;transition:transform .18s ease,box-shadow .18s ease}.cs-sustainability .sus-range:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(22,53,80,.11)}.cs-sustainability .sus-range-image{height:170px;background:#f3f6f5;overflow:hidden}.cs-sustainability .sus-range-image img{display:block;width:100%;height:100%;object-fit:cover}.cs-sustainability .sus-range-body{padding:20px;display:flex;flex:1;flex-direction:column;align-items:flex-start}.cs-sustainability .sus-range h3{color:var(--navy);font-size:18px;font-weight:800;margin:0 0 8px}.cs-sustainability .sus-range p{color:#627387;font-size:13.5px;line-height:1.52;margin:0 0 18px}.cs-sustainability .sus-range .text-link{margin-top:auto}
.cs-sustainability .sus-cta-wrap{padding:0 0 76px}.cs-sustainability .sus-cta{background:linear-gradient(120deg,#102f5e,#1c4b76);border-radius:18px;padding:42px 46px;display:flex;gap:30px;align-items:center;justify-content:space-between}.cs-sustainability .sus-cta .eyebrow{color:#a6d596}.cs-sustainability .sus-cta h2{color:#fff;font-size:30px;margin:0 0 9px}.cs-sustainability .sus-cta p:not(.eyebrow){max-width:620px;color:#d7e2ef;font-size:15px;line-height:1.55;margin:0}.cs-sustainability .sus-cta-actions{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto}.cs-sustainability .btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45)}
@media(max-width:900px){.cs-sustainability .sus-hero-grid,.cs-sustainability .sus-feature-grid{grid-template-columns:1fr;gap:34px}.cs-sustainability .sus-hero-media{max-width:680px}.cs-sustainability .sus-range-grid{grid-template-columns:repeat(2,1fr)}.cs-sustainability .sus-cta{display:block}.cs-sustainability .sus-cta-actions{margin-top:22px}.cs-sustainability .sus-hero h1{font-size:48px}}
@media(max-width:640px){.cs-sustainability .sus-hero{padding-bottom:42px}.cs-sustainability .sus-crumb{margin-bottom:29px}.cs-sustainability .sus-hero h1{font-size:39px}.cs-sustainability .sus-intro{font-size:16px}.cs-sustainability h2{font-size:29px}.cs-sustainability .sus-principles,.cs-sustainability .sus-solutions{padding:58px 0}.cs-sustainability .sus-principle-grid,.cs-sustainability .sus-range-grid{grid-template-columns:1fr}.cs-sustainability .sus-solutions-top{display:block}.cs-sustainability .sus-solutions-top>p{margin-top:12px}.cs-sustainability .sus-feature{padding:54px 0}.cs-sustainability .sus-cta{padding:30px 24px}.cs-sustainability .sus-cta h2{font-size:26px}}

/* Documentation */
.cs-docs .page-head{background:linear-gradient(135deg,#f2f7fc,#e7f0fa);padding:76px 0 64px}.cs-docs .page-head h1{max-width:760px;margin:8px 0 14px}.cs-docs .page-head p:last-child{max-width:640px;font-size:18px;color:#52677d}.cs-docs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:58px 0 76px}.cs-doc-card{border:1px solid #dce5ef;border-radius:14px;padding:28px;background:#fff;min-height:220px;display:flex;flex-direction:column;align-items:flex-start}.cs-doc-card.featured{grid-column:span 2;background:#103469;color:#fff;border-color:#103469}.cs-doc-card span{font-size:11px;font-weight:800;letter-spacing:.13em;color:#207cc7}.cs-doc-card.featured span{color:#8bc7ff}.cs-doc-card h2{font-size:23px;margin:12px 0 9px}.cs-doc-card p{color:#5c6f84;margin:0 0 22px;line-height:1.55}.cs-doc-card.featured p{color:#dbe9fa}.cs-doc-card>a:not(.btn){font-weight:700;color:#1673c8;margin-top:auto}.cs-doc-card .btn{margin-top:auto}@media(max-width:720px){.cs-docs-grid{grid-template-columns:1fr;padding:40px 20px 58px}.cs-doc-card.featured{grid-column:auto}.cs-docs .page-head{padding:54px 20px 46px}}
.search-card-media .search-card-graphic{display:grid;place-items:center;width:100%;height:100%;min-height:180px;color:#1d76c8;background:linear-gradient(135deg,#e6f0fb,#f6fafc)}.search-card-media .search-card-graphic svg{width:64px;height:64px}

/* Mobile navigation and catalogue layout corrections. */
.cs-cat .cat-hero .cta{background:transparent;padding:0;color:inherit}
@media(max-width:980px){
 .site-header nav.menu{margin-left:0;max-height:calc(100dvh - 130px);overflow-y:auto;overscroll-behavior:contain;gap:0}
 .site-header .nav-item,.site-header .nav-item.has-mega{position:relative;display:block;height:auto;min-height:48px;padding:13px 0;flex-shrink:0;width:100%}
 .site-header .nav-item>.dropdown{position:static;width:100%;margin-top:12px;padding:16px 12px;box-shadow:none;border-radius:0;max-width:100%}
 .site-header .mega-grid{grid-template-columns:1fr;gap:18px}
 .site-header .col a,.site-header .dropdown.small a{padding:9px 0;font-size:14px}
 .site-header .col h5{margin-bottom:4px}
 .cs-cat .cat-layout{padding-left:20px;padding-right:20px;min-width:0}
 .cs-cat .cat-layout>div{min-width:0}
 .cs-cat .crumb{padding-left:20px;padding-right:20px}
}
@media(max-width:620px){
 .cs-cat .cat-hero .cta{flex-direction:column;align-items:stretch;gap:10px}
 .cs-cat .cat-hero .cta .btn{justify-content:center;padding:12px 14px;font-size:14px}
 .site-header .nav{gap:10px}
 .site-header .nav .logo img,.site-header .nav .custom-logo{max-width:112px}
 .site-header .site-search{min-width:0;flex:1;margin-left:0;max-width:220px}
 .site-header .site-search input{width:100%;min-width:0;flex:1}
 .site-header .site-search button{flex-shrink:0}
 .site-header .menu-toggle{flex-shrink:0;margin-left:0}
}