/* MANGALAM V21 — precision header, brighter full-image product heroes, and premium client logo presentation */
:root{--v21-gold:#d8ad3d;--v21-gold-hi:#ffe48a;--v21-ink:#050607;--v21-white:#fff}

/* ===== HEADER: dedicated brand column + independent navigation ===== */
.site-header{height:88px!important;background:rgba(4,5,6,.97)!important;border-bottom:1px solid rgba(216,173,61,.24)!important;backdrop-filter:blur(18px)!important;position:sticky!important;top:0!important;z-index:9000!important}
.site-header .nav{min-height:88px!important;width:min(100%,1500px)!important;margin:0 auto!important;padding:8px 20px!important;display:grid!important;grid-template-columns:minmax(300px,350px) minmax(0,1fr) 44px!important;align-items:center!important;column-gap:28px!important}
.site-header .brand{width:100%!important;height:70px!important;min-width:0!important;display:grid!important;grid-template-columns:62px minmax(0,1fr)!important;align-items:center!important;gap:13px!important;padding:4px 14px 4px 6px!important;border:1px solid rgba(216,173,61,.28)!important;border-radius:16px!important;background:linear-gradient(110deg,rgba(216,173,61,.10),rgba(255,255,255,.025) 60%,rgba(216,173,61,.045))!important;box-shadow:inset 0 1px rgba(255,255,255,.08),0 8px 28px rgba(0,0,0,.28)!important;overflow:hidden!important}
.site-header .brand-mark{width:62px!important;height:62px!important;min-width:62px!important;border-radius:12px!important;background:#050505!important;border:1px solid rgba(255,224,120,.28)!important;display:grid!important;place-items:center!important;overflow:hidden!important}
.site-header .brand-mark img{width:100%!important;height:100%!important;object-fit:contain!important;padding:5px!important;filter:drop-shadow(0 0 10px rgba(255,215,90,.22))!important}
.site-header .brand-copy{min-width:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;overflow:visible!important}
.site-header .brand-name{display:block!important;color:#fff!important;font-family:'Space Grotesk',system-ui,sans-serif!important;font-size:clamp(.95rem,1.2vw,1.16rem)!important;font-weight:850!important;line-height:1!important;letter-spacing:.075em!important;white-space:nowrap!important;overflow:visible!important;text-transform:uppercase!important}
.site-header .brand-tagline{display:block!important;color:var(--v21-gold-hi)!important;font-size:.52rem!important;font-weight:800!important;letter-spacing:.22em!important;line-height:1!important;margin-top:8px!important;white-space:nowrap!important;text-transform:uppercase!important}
.site-header .nav-center{min-width:0!important;overflow:visible!important}
.site-header .nav-links{width:100%!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:clamp(4px,1vw,16px)!important;min-width:0!important}
.site-header .nav-links a{padding:9px 7px!important;color:rgba(255,255,255,.70)!important;font-size:clamp(.57rem,.64vw,.72rem)!important;letter-spacing:.08em!important;font-weight:800!important;white-space:nowrap!important;border-radius:8px!important;line-height:1!important}
.site-header .nav-links a:hover,.site-header .nav-links a.active{color:#fff!important;background:rgba(216,173,61,.07)!important}
.site-header .nav-links a::after{left:8px!important;right:8px!important;bottom:3px!important;background:var(--v21-gold)!important}
.site-header .nav-actions{display:flex!important;justify-content:flex-end!important}
@media(max-width:1180px){.site-header .nav{grid-template-columns:minmax(275px,315px) minmax(0,1fr) 42px!important;column-gap:15px!important;padding-inline:12px!important}.site-header .brand{grid-template-columns:56px minmax(0,1fr)!important;height:66px!important}.site-header .brand-mark{width:56px!important;height:56px!important;min-width:56px!important}.site-header .brand-name{font-size:.86rem!important;letter-spacing:.055em!important}.site-header .brand-tagline{font-size:.45rem!important;letter-spacing:.16em!important}.site-header .nav-links{gap:2px!important}.site-header .nav-links a{font-size:.55rem!important;padding-inline:5px!important}}
@media(max-width:920px){.site-header{height:78px!important}.site-header .nav{min-height:78px!important;grid-template-columns:minmax(0,1fr) 44px!important}.site-header .brand{max-width:360px!important;height:62px!important}.site-header .nav-links{position:absolute!important;left:12px!important;right:12px!important;top:86px!important;display:none!important;padding:12px!important;background:rgba(5,6,7,.98)!important;border:1px solid rgba(216,173,61,.18)!important;border-radius:14px!important;box-shadow:0 20px 40px rgba(0,0,0,.45)!important;flex-direction:column!important;align-items:stretch!important}.site-header .nav-links.open{display:flex!important}.site-header .nav-links a{font-size:.72rem!important;padding:12px 14px!important}}
@media(max-width:520px){.site-header .nav{padding-inline:8px!important}.site-header .brand{max-width:330px!important;grid-template-columns:50px minmax(0,1fr)!important;height:58px!important;padding-right:9px!important;gap:9px!important}.site-header .brand-mark{width:50px!important;height:50px!important;min-width:50px!important}.site-header .brand-name{font-size:.70rem!important;letter-spacing:.045em!important}.site-header .brand-tagline{font-size:.36rem!important;letter-spacing:.13em!important;margin-top:5px!important}}

/* ===== PRODUCT HERO: full image, same-width stage, brighter product image, readable overlay ===== */
.category-hero-full{min-height:clamp(570px,calc(100svh - 88px),760px)!important;background:#0a0b0c!important;overflow:hidden!important;isolation:isolate!important}
.category-hero-backdrop{position:absolute!important;inset:0!important;background:#111!important;overflow:hidden!important;z-index:-4!important}
.category-hero-backdrop::before{content:""!important;position:absolute!important;inset:-5%!important;background:var(--hero-bg,#151617)!important;filter:blur(22px)!important;transform:scale(1.08)!important;opacity:.72!important}
.category-hero-backdrop .category-image{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;display:block!important;filter:brightness(1.20) saturate(1.08) contrast(1.02)!important;transform:scale(1)!important;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter 1s ease!important}
.category-hero-full:hover .category-hero-backdrop .category-image{transform:scale(1.018)!important;filter:brightness(1.26) saturate(1.12) contrast(1.03)!important}
.category-hero-shade{z-index:-2!important;background:linear-gradient(90deg,rgba(2,3,3,.92) 0%,rgba(2,3,3,.72) 28%,rgba(2,3,3,.30) 58%,rgba(2,3,3,.16) 100%),linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.42))!important}
.category-hero-grid-overlay{z-index:-1!important;opacity:.15!important;background-size:52px 52px!important;mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.5) 58%,transparent 100%)!important}
.category-hero-content{min-height:inherit!important;padding:64px 0 74px!important;align-items:center!important}
.category-hero-copy{max-width:min(760px,64vw)!important;padding:32px 0!important}
.category-hero-full .category-title{font-size:clamp(3rem,5.7vw,6.6rem)!important;line-height:.9!important;letter-spacing:-.055em!important}
.category-hero-full .category-subtitle{font-size:clamp(1rem,1.35vw,1.22rem)!important;line-height:1.5!important;margin-top:22px!important}
.category-hero-full .category-intro{font-size:.91rem!important;line-height:1.72!important;max-width:700px!important}
.category-hero-full .hero-highlight-rail{gap:7px!important;margin-top:19px!important}
.category-hero-full .hero-highlight-rail span{background:rgba(4,5,6,.48)!important;border-color:rgba(255,255,255,.24)!important;padding:8px 11px!important}
.hero-float-card{right:3vw!important;bottom:42px!important;background:rgba(4,5,6,.48)!important;border-color:rgba(255,224,120,.30)!important}
@media(max-width:900px){.category-hero-full{min-height:650px!important}.category-hero-backdrop .category-image{object-fit:contain!important}.category-hero-shade{background:linear-gradient(180deg,rgba(2,3,3,.20),rgba(2,3,3,.58) 48%,rgba(2,3,3,.92) 100%)!important}.category-hero-content{align-items:flex-end!important;padding-bottom:98px!important}.category-hero-copy{max-width:92vw!important}.hero-float-card{right:16px!important;bottom:25px!important}}
@media(max-width:600px){.category-hero-full{min-height:690px!important}.category-hero-content{padding:44px 0 92px!important}.category-hero-full .category-title{font-size:clamp(2.55rem,13vw,4.2rem)!important}.category-hero-full .category-intro{font-size:.84rem!important}.category-hero-full .hero-highlight-rail span{font-size:.53rem!important}.hero-float-card{display:none!important}}

/* ===== HOMEPAGE CLIENT MARQUEE ===== */
.home-clients-section .client-marquee .client-track .client-logo-pill{min-width:220px!important;height:118px!important;padding:18px 22px!important;background:#fff!important;border:1px solid rgba(0,0,0,.07)!important;border-radius:18px!important;box-shadow:0 8px 24px rgba(0,0,0,.08)!important}
.home-clients-section .client-marquee .client-logo-pill img{max-width:180px!important;max-height:82px!important;filter:none!important;transition:transform .32s ease,filter .32s ease!important}
.home-clients-section .client-marquee .client-logo-pill:hover img{transform:scale(1.10)!important;filter:drop-shadow(0 7px 10px rgba(0,0,0,.15))!important}

/* ===== CLIENT DIRECTORY: image-only, all supplied logos, large and animated ===== */
.customer-directory-section{background:#fff!important;color:#151515!important}
.customer-directory-section .section-head h2,.customer-directory-section .section-head p{color:#151515!important}
.customer-directory{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important}
.customer-card{border:0!important;border-radius:20px!important;background:#fff!important;box-shadow:none!important;overflow:hidden!important;transition:transform .34s cubic-bezier(.2,.7,.2,1),box-shadow .34s ease,background .34s ease!important}
.customer-card:hover{transform:translateY(-8px) scale(1.015)!important;background:#fff!important;box-shadow:0 18px 38px rgba(0,0,0,.10)!important}
.customer-card .logo-card-img{height:175px!important;padding:18px!important;background:#fff!important;border:0!important;display:grid!important;place-items:center!important}
.customer-card .logo-card-img img{width:100%!important;height:100%!important;max-width:235px!important;max-height:135px!important;object-fit:contain!important;transition:transform .34s ease,filter .34s ease!important}
.customer-card:hover .logo-card-img img{transform:scale(1.10)!important;filter:drop-shadow(0 7px 10px rgba(0,0,0,.14))!important}
.customer-card .info-body,.customer-card .customer-label,.customer-card strong{display:none!important}
@media(max-width:1050px){.customer-directory{grid-template-columns:repeat(3,minmax(0,1fr))!important}.customer-card .logo-card-img{height:160px!important}.customer-card .logo-card-img img{max-width:210px!important;max-height:120px!important}}
@media(max-width:760px){.customer-directory{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.customer-card .logo-card-img{height:145px!important;padding:12px!important}.customer-card .logo-card-img img{max-width:180px!important;max-height:105px!important}}
@media(max-width:440px){.customer-directory{gap:8px!important}.customer-card .logo-card-img{height:125px!important}.customer-card .logo-card-img img{max-width:150px!important;max-height:88px!important}}

/* ===== no-crop product catalogue ===== */
.product-card .product-img{background:#f4f3ef!important;min-height:250px!important;display:grid!important;place-items:center!important;overflow:hidden!important}
.product-card .product-img img{width:100%!important;height:100%!important;object-fit:contain!important;padding:16px!important;transform:none!important;filter:brightness(1.04) saturate(1.03)!important}
.product-card:hover .product-img img{transform:scale(1.025)!important}

@media(prefers-reduced-motion:reduce){.category-hero-backdrop .category-image,.customer-card,.customer-card .logo-card-img img,.home-clients-section .client-marquee .client-logo-pill img{transition:none!important}.category-hero-full:hover .category-hero-backdrop .category-image,.customer-card:hover,.customer-card:hover .logo-card-img img,.home-clients-section .client-marquee .client-logo-pill:hover img{transform:none!important}}