/* One type system and one quiet navigation system for the CRM storefront. */
:root{--crm-crimson:#a72001;--crm-crimson-dark:#861b00}
:root{--header-h:88px;--font-display:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;--font-mono:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif}
body.crm-page,body.crm-page *{font-family:var(--font-sans)}
body.crm-page em{font-style:normal!important}
body.crm-page{font-size:15px;font-weight:400;letter-spacing:0}
body.crm-page h1,body.crm-page h2,body.crm-page h3{font-weight:500}
.crm-global-header{background:#fafaf8f5;border-bottom:1px solid #1b1d1f12;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.crm-header-inner.wrap-wide{width:calc(100% - 96px);max-width:1760px;display:grid;grid-template-columns:1fr auto 1fr;gap:40px}
.crm-brand{gap:18px;justify-self:start}.crm-brand-logo{width:92px;height:42px}.crm-brand-text{display:none!important}
.crm-nav{gap:34px;justify-content:center}.crm-nav>a,.crm-nav-curtain>summary{font-size:14px;font-weight:500;color:#535659;letter-spacing:0;text-transform:none;height:var(--header-h)}
.crm-nav>a:hover,.crm-nav>a.current,.crm-nav-curtain.current>summary,.crm-nav-curtain[open]>summary{color:#17191b}
.crm-nav>a.current:after,.crm-nav-curtain.current>summary:after{height:2px;bottom:21px;left:0;right:auto;width:16px;background:var(--crm-crimson)}
.crm-nav-chevron{font-size:8px;margin-left:7px;color:#888}
.crm-header-actions{justify-self:end;gap:24px}.crm-selection-pill{font-size:12px;color:#737679;letter-spacing:0;background:none;border:0;font-weight:400}
.crm-selection-pill .cart-count{font-size:10px;color:#25282b;margin-left:2px;background:none;font-weight:500}
.crm-inquire-btn{background:transparent;border:1px solid #242729;color:#25282b!important;height:42px;padding:0 19px;font-size:12px;font-weight:500;letter-spacing:0;gap:22px;white-space:nowrap}
.crm-inquire-btn:hover{background:var(--crm-crimson);border-color:var(--crm-crimson);color:#fff!important}
.crm-search-link{display:flex;align-items:center;justify-content:center;width:20px;height:32px;color:#373b3e}
.crm-search-link svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4}
.mobile-menu{width:38px;height:38px;align-items:center;justify-content:center;padding:6px;color:#343638}
.mobile-menu svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.3;fill:none}
.crm-curtain-panel{background:#fafaf8;color:#222;border-bottom:1px solid #ddd;box-shadow:0 24px 48px #00000012;padding:42px 0}
.crm-curtain-grid{max-width:1440px;gap:64px}.crm-curtain-lead{color:#202326;font-weight:500;font-size:27px;letter-spacing:-.03em}
.crm-curtain-col h4{font-size:10px;letter-spacing:.1em;font-weight:500}.crm-curtain-col p{color:#7c7e80;font-size:13px}
.crm-curtain-links a{color:#35383b;font-size:14px;padding:11px 0;border:0}.crm-curtain-links a small{color:#929496;font-size:10px}
.crm-curtain-links a:hover{background:transparent;color:var(--crm-crimson)}
.intro-copy h1{font-weight:400!important;letter-spacing:-.045em;line-height:1.04}.intro-copy>p{font-size:16px;line-height:1.75}
.eyebrow{font-size:10px;font-weight:500;letter-spacing:.12em}.display-lg{font-weight:500;letter-spacing:-.035em}
.science-heading h1 em,.crm-page-home .science-heading h2 em,.table-caption .caption-element small,.perspective-copy h2 em,.atlas-index-heading>span:nth-child(2),.crm-page-periodic-table .slogan-rest{font-family:var(--font-sans)!important;font-style:normal!important}
.crm-page-home .science-heading h2 em{font-size:inherit;line-height:inherit;font-weight:400;color:#aeb1b7}
.science-heading .eyebrow{letter-spacing:.12em}.table-caption .caption-element small{font-weight:400;letter-spacing:0}


@media(max-width:1250px){.crm-header-inner.wrap-wide{width:calc(100% - 56px);gap:24px}.crm-nav{gap:24px}.crm-header-actions{gap:18px}.crm-inquire-btn{padding:0 14px;gap:12px}.crm-selection-pill{font-size:11px}.crm-brand-logo{width:84px}}
@media(max-width:1100px){:root{--header-h:72px}.crm-header-inner.wrap-wide{display:flex;width:calc(100% - 48px);justify-content:space-between}.crm-nav{display:none;top:var(--header-h);max-height:calc(100dvh - 72px);background:#fafaf8;gap:0}.crm-nav.open{display:flex}.crm-nav>a,.crm-nav-curtain>summary{height:50px;font-size:15px;border-bottom:1px solid #dededb}.crm-nav>a.current:after,.crm-nav-curtain.current>summary:after{bottom:0}.mobile-menu{display:inline-flex}.crm-curtain-panel{position:static;box-shadow:none;padding:22px 0}.crm-curtain-grid{grid-template-columns:1fr;gap:28px;width:100%;padding:0}}
@media(max-width:700px){:root{--header-h:68px}.crm-header-inner.wrap-wide{width:calc(100% - 32px);gap:12px}.crm-brand-logo{width:76px;height:36px}.crm-header-actions{gap:14px}.crm-selection-pill{display:none}.crm-inquire-btn{height:36px;padding:0 12px;font-size:10px;gap:10px}.crm-search-link{width:18px}.mobile-menu{width:30px;padding:3px}.crm-opening{height:auto}.crm-opening-panel.crm-intro{height:auto}.crm-opening .intro-copy{padding:40px 24px 26px}.crm-opening .intro-copy h1{font-size:48px}.crm-opening .intro-copy>p{font-size:14px}.crm-opening .intro-footnote{padding-top:32px}.opening-gallery{height:360px}}
/* A shared 1280px baseline aligns the logo, introduction and content sections. */
.crm-page .crm-header-inner.wrap-wide{width:min(1280px,calc(100% - 96px));max-width:1280px;grid-template-columns:160px minmax(0,1fr) auto;gap:24px}
.crm-page .crm-brand-logo{width:136px;height:50px;object-fit:contain;object-position:left center}
.crm-page .crm-brand{height:var(--header-h);align-items:center}
.crm-page .crm-nav{gap:26px}.crm-page .crm-header-actions{gap:20px}
.crm-page .crm-inquire-btn{gap:16px;padding:0 16px}
.crm-page-home .home-collections{padding:68px 0;background:#f2f3ef}
.home-collections .chapter-header{margin-bottom:28px;align-items:center}
.home-collections h2,.home-method-summary h2,.home-inquiry-band h2{font-size:clamp(28px,2.8vw,40px);font-weight:400;letter-spacing:-.035em;line-height:1.2}
.home-collections .eyebrow{margin-bottom:12px}
.text-collections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.collection-card{display:block;min-width:0;min-height:158px;background:#fafbf8;padding:22px 24px;transition:background .18s ease}
.collection-meta{display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.03em;color:#939693}
.collection-card h3{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:24px;font-size:19px;font-weight:500;letter-spacing:-.02em;line-height:1.25}
.collection-card h3>span{flex-shrink:0;font-size:15px;color:var(--crm-crimson)}
.collection-card p{margin-top:10px;color:#81857f;font-size:12px;line-height:1.65;max-width:38ch}
.collection-card:hover{background:#fff}.collection-card:hover h3{color:var(--crm-crimson)}
.collection-custom{background:#e7e9e3}
.home-method-summary{padding:60px 0;background:#fff}
.method-summary-inner{display:grid;grid-template-columns:1.6fr 1fr;gap:80px;align-items:center}
.home-method-summary .eyebrow{margin-bottom:15px}
.home-method-summary h2{font-size:clamp(27px,2.4vw,35px)}
.home-method-summary p{margin-top:17px;color:#878b86;font-size:14px;line-height:1.7;max-width:50ch}
.method-summary-inner nav{display:flex;flex-direction:column}
.method-summary-inner nav a{display:flex;justify-content:space-between;gap:30px;font-size:13px;padding:17px 0;border-bottom:1px solid #e2e4df;color:#5f655e}
.method-summary-inner nav a>span{color:var(--crm-crimson)}
.home-inquiry-band{background:#f2f3ef;padding:42px 0}
.home-inquiry-band>.wrap{display:flex;justify-content:space-between;align-items:center;gap:32px}
.home-inquiry-band h2{font-size:clamp(26px,2.4vw,36px)}
/* The reviewed product cards retain their original 16:9 layout and complete labels. */
.crm-page-catalog .product-row .formula-art img,.detail-visual img{object-fit:contain}
@media(max-width:1200px){.crm-page .crm-header-inner.wrap-wide{width:calc(100% - 64px);gap:18px}.crm-page .crm-brand-logo{width:124px;height:46px}.crm-page .crm-nav{gap:19px}.crm-page .crm-header-actions{gap:16px}}
@media(max-width:1100px){.crm-page .crm-header-inner.wrap-wide{display:flex;justify-content:space-between}.crm-page .crm-nav{gap:0}.text-collections{grid-template-columns:repeat(2,minmax(0,1fr))}.method-summary-inner{gap:40px}}
@media(max-width:640px){.crm-page .crm-header-inner.wrap-wide{width:calc(100% - 40px)}.crm-page .crm-brand-logo{width:104px;height:39px}.crm-page .crm-header-actions{gap:12px}.crm-page .crm-inquire-btn{padding:0 10px;gap:8px}.crm-opening .intro-copy{padding-left:20px;padding-right:20px}.crm-page-home .home-collections{padding:42px 0}.home-collections .chapter-header{gap:17px;margin-bottom:24px}.text-collections{grid-template-columns:1fr;gap:8px}.collection-card{min-height:132px;padding:20px}.collection-card h3{margin-top:18px;font-size:20px}.collection-card p{margin-top:8px}.home-method-summary{padding:44px 0}.method-summary-inner{grid-template-columns:1fr;gap:22px}.home-inquiry-band{padding:34px 0}.home-inquiry-band>.wrap{align-items:flex-start;flex-direction:column;gap:23px}.home-inquiry-band h2{max-width:15ch}}

/* Native-English information architecture: compact cards, clear reading order. */
.home-family-links{display:flex;flex-wrap:wrap;gap:12px 24px;border-top:1px solid #d9dcd5;margin-top:30px;padding-top:24px;font-size:12px;color:#62685f}.home-family-links>span{flex-basis:100%;color:#868d82;margin-bottom:4px}.home-family-links a:hover{color:var(--crm-crimson)}
.native-heading{padding-top:80px;padding-bottom:62px}.native-heading h1{font-size:clamp(44px,5.5vw,78px);line-height:1.06;letter-spacing:-.055em;margin:22px 0 25px}.native-heading>p{max-width:680px;font-size:18px;line-height:1.7;color:#777c76}
.native-applications{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 32px;padding-bottom:80px}.native-application figure{margin:0 0 24px}.native-application img{width:100%;aspect-ratio:16/9;object-fit:cover}.native-application figcaption,.native-about figcaption{font-size:11px;color:#94978f;padding-top:10px}.native-application h2,.native-process h2{font-size:26px;letter-spacing:-.03em;margin-bottom:15px}.native-application p{font-size:15px;line-height:1.75;color:#777c76;max-width:56ch;margin-bottom:20px}
.native-process{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px;padding-bottom:80px}.native-process article{border-top:1px solid #cdd1c8;padding-top:20px}.native-process h2{font-size:22px;margin-top:24px}.native-process p{color:#777c76;line-height:1.75;font-size:14px}
.native-archive{background:#eef0eb;padding:70px 0}.native-section-title h2{font-size:40px;letter-spacing:-.04em;margin:15px 0}.native-section-title p{max-width:700px;font-size:14px;line-height:1.8;color:#7b8177}.native-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px;margin-top:35px}.native-gallery figure{margin:0}.native-gallery img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#e1e4dc}.native-gallery figcaption{padding:17px 0;display:flex;flex-direction:column;gap:8px}.native-gallery figcaption strong{font-size:17px;font-weight:500}.native-gallery figcaption span{font-size:12px;line-height:1.7;color:#7b8177}
.native-cta{padding:48px 0;background:#f1f3ee}.native-cta>.wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}.native-cta h2{font-size:clamp(25px,3vw,40px);letter-spacing:-.035em}.native-about{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px;padding-bottom:80px}.native-about h2{font-size:clamp(28px,3vw,40px);line-height:1.2;letter-spacing:-.035em;margin-bottom:24px}.native-about p{font-size:15px;line-height:1.85;color:#777c76;margin-bottom:24px}.native-about figure{margin:0}.native-about img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#e9ece4}
#detail-unit{max-width:80px;min-height:46px;border:1px solid #ddd;background:#fff;padding:8px}.detail-actions{flex-wrap:wrap}.product-add{font-size:12px;white-space:normal}.remove-inquiry-item{padding:10px 0;color:var(--crm-crimson);background:none;border:0;cursor:pointer}.crm-nav{white-space:nowrap}.crm-curtain-links small{margin-left:16px}
@media(min-width:1101px){.crm-page .crm-nav{gap:20px}.crm-page .crm-header-actions{gap:14px}.crm-page .crm-selection-pill{font-size:11px}.crm-page .crm-nav>a,.crm-page .crm-nav-curtain>summary{font-size:13px}}
@media(max-width:800px){.native-heading{padding-top:50px;padding-bottom:40px}.native-heading>p{font-size:16px}.native-process{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.native-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.native-about{gap:30px}.native-applications{gap:42px 24px}}
@media(max-width:600px){.native-applications,.native-gallery,.native-process,.native-about{grid-template-columns:1fr}.native-heading h1{font-size:46px}.native-archive{padding:45px 0}.native-cta>.wrap{align-items:flex-start;flex-direction:column}.native-about{padding-bottom:48px}.native-about-reverse>figure{order:2}.native-process{padding-bottom:45px}.native-process h2{margin-top:14px}.native-gallery{gap:20px}.native-application h2{font-size:25px}}

.crm-curtain-col>.text-link{display:block;margin-top:18px}.crm-curtain-col>.btn{margin-top:8px}.quote-item .text-btn{font-size:12px}

.filters label{display:block;font-size:12px;line-height:1.4;margin-bottom:20px}.filters input,.filters select{width:100%;min-height:42px;padding:10px;border:1px solid #d6dad1;background:#f8f9f5;font-size:12px;font-weight:400;box-sizing:border-box}.filters .note{font-size:12px;line-height:1.8;margin-top:22px;color:#808777}.filters .filter-custom{font-size:12px}.product-add{text-transform:none!important;letter-spacing:0!important;font-weight:500!important}.native-about img{filter:saturate(.8)}

@media(min-width:1101px){.text-collections{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:640px){.text-collections{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-card{min-height:138px;padding:18px 15px}.collection-card h3{font-size:17px;margin-top:23px;gap:8px}.collection-meta{font-size:9px;gap:5px}.collection-card p{font-size:11px}.filters{padding:20px}.filters label{margin-bottom:12px}.filters .note{display:none}.filters .filter-custom{margin-top:15px;display:block}}

/* A quieter, more deliberate visual rhythm for the CRM home. */
.crm-page .crm-global-header{background:#f9f9f7;border-bottom:1px solid #1b1d1f10}
.crm-page .crm-inquire-btn{border:1px solid #222629!important;background:transparent!important;color:#222629!important;padding:0 18px!important;height:38px!important;font-size:12px!important;font-weight:500!important;border-radius:0!important;gap:12px!important;display:inline-flex!important;align-items:center!important;text-decoration:none!important;transition:all .2s ease!important}
.crm-page .crm-inquire-btn:hover{background:var(--crm-crimson)!important;border-color:var(--crm-crimson)!important;color:#fff!important}
.crm-page .crm-selection-pill{color:#555}.crm-page .crm-header-actions{gap:25px}
.crm-page-home .home-collections{background:#f5f5f2;padding:100px 0 90px}
.home-collections .chapter-header{align-items:end;margin-bottom:48px}.home-collections h2{font-size:clamp(36px,4vw,56px);letter-spacing:-.045em}
.text-collections{gap:0;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #cfd2cb}
.collection-card,.collection-custom{background:transparent;min-height:110px;padding:22px 24px 22px 0;border-bottom:1px solid #cfd2cb;display:flex;align-items:center;gap:24px}
.collection-card:nth-child(odd){margin-right:30px}.collection-card:nth-child(even){margin-left:30px}
.collection-meta{display:block;flex:0 0 35px;color:#a72001;font-size:11px}.collection-meta span+span{display:none}
.collection-card h3{margin:0;flex:1;font-size:clamp(19px,1.7vw,24px);font-weight:400}.collection-card p{display:none}.collection-card:hover{background:transparent}.collection-card h3 span{font-size:18px}
.home-family-links{margin-top:38px;padding-top:0;border:0;gap:14px 25px}.home-family-links>span{color:#777;margin-bottom:8px}
.home-editorial{background:#17191a;color:#f7f7f3}.editorial-inner{display:grid;grid-template-columns:1fr 1fr;min-height:510px}.editorial-copy{padding:90px 65px 90px 0;align-self:center}.editorial-copy h2,.home-contact h2{font-size:clamp(40px,4.5vw,64px);line-height:1.08;letter-spacing:-.05em;margin:25px 0}.editorial-copy h2 span,.home-contact h2 span{color:#a72001}.editorial-copy p{color:#aaaeac;line-height:1.8;max-width:410px;margin-bottom:38px}.editorial-copy>a,.home-contact a{display:inline-flex;gap:55px;padding-bottom:12px;border-bottom:1px solid #a72001;font-size:13px}.editorial-copy>a span,.home-contact a span{color:#b93213}.editorial-image{background:linear-gradient(90deg,#17191a 0%,transparent 26%),url('../img/banners/en/hero-semiconductor-wafer.jpg') center/cover no-repeat;min-height:430px}
.home-contact{background:#f3f3ef;padding:100px 0}.home-contact>.wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:80px;align-items:end}.home-contact h2{margin-bottom:0}.home-contact p{color:#757b75;line-height:1.8;max-width:360px;margin-bottom:30px}
@media(max-width:1100px){.crm-page .crm-selection-pill{display:none}.crm-page .crm-header-actions{gap:22px}}
@media(max-width:700px){.crm-page .crm-header-actions{gap:15px}.crm-page .crm-inquire-btn{font-size:11px;gap:8px}.crm-page-home .home-collections{padding:65px 0}.home-collections .chapter-header{align-items:start;gap:20px}.home-collections h2{font-size:35px}.text-collections{grid-template-columns:1fr}.collection-card,.collection-card:nth-child(n){margin:0;min-height:76px;padding:17px 0;gap:12px}.collection-meta{flex-basis:28px}.collection-card h3{font-size:19px;margin:0}.editorial-inner{grid-template-columns:1fr}.editorial-copy{padding:65px 0 40px}.editorial-image{min-height:260px;background-image:linear-gradient(180deg,#17191a 0%,transparent 25%),url('../img/banners/en/hero-semiconductor-wafer.jpg')}.home-contact{padding:65px 0}.home-contact>.wrap{grid-template-columns:1fr;gap:30px}.home-contact h2{font-size:40px}}

.crm-page-home .periodic-hero-heading{display:block}.crm-page-home .periodic-hero-heading .hero-search{width:100%;max-width:none}.crm-page-home .hero-search>div{width:100%}

.capability-feature{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center;padding-top:40px;padding-bottom:100px}.capability-feature img{width:100%;height:auto;display:block}.capability-feature h2{font-size:clamp(32px,3.6vw,52px);line-height:1.1;letter-spacing:-.04em;margin:22px 0}.capability-feature p{color:#777c76;line-height:1.8;margin-bottom:28px;max-width:50ch}.about-material-image{min-height:390px;background:url('../img/banners/en/hero-refractory-targets.jpg') center/cover}.native-about-simple{display:block;max-width:1280px}.native-about-simple>div{max-width:650px}@media(max-width:700px){.capability-feature{grid-template-columns:1fr;gap:28px;padding-bottom:60px}.about-material-image{min-height:260px}}

.ketai-second{padding-top:0}.native-about figure img{object-fit:cover}

.equipment-showcase{padding:80px 0 100px;background:#f1f2ee}.equipment-intro h2{font-size:clamp(34px,4vw,54px);letter-spacing:-.04em;margin:18px 0}.equipment-intro p{color:#747a73;line-height:1.7}.equipment-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px;margin-top:42px}.equipment-list figure{margin:0;min-width:0}.equipment-list img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#ddd}.equipment-list figcaption{display:flex;align-items:baseline;gap:16px;padding:16px 0;border-bottom:1px solid #cfd2cb}.equipment-list figcaption span{color:#a72001;font-size:11px}.equipment-list figcaption strong{font-size:17px;font-weight:500;line-height:1.4}.crm-page .crm-nav{gap:18px}.crm-page .crm-nav>a,.crm-page .crm-nav-curtain>summary{font-size:13px}@media(max-width:800px){.equipment-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:550px){.equipment-list{grid-template-columns:1fr;gap:26px}.equipment-showcase{padding:55px 0}}

/* The homepage closes as one continuous dark composition. */
.crm-page-home .crm-opening .intro-copy{padding-bottom:70px}.crm-page-home .periodic-hero-heading{margin-bottom:16px}.crm-page-home .periodic-hero-inner{padding-top:52px}.crm-page-home .atlas-index-heading{margin-top:32px}
.crm-page-home .home-editorial{background:#151718}.crm-page-home footer{background:#151718;border-top:1px solid #ffffff20}.editorial-actions{display:flex;gap:36px;flex-wrap:wrap}.editorial-actions a{display:inline-flex;justify-content:space-between;min-width:175px;gap:32px;padding:0 0 12px;border-bottom:1px solid #a72001;font-size:13px;color:#fff}.editorial-actions a span{color:#b93213}.crm-social{display:flex;flex-wrap:wrap;gap:16px;margin-top:20px}.crm-social a{font-size:12px!important;color:#d2d5d1!important}.crm-page-home .footer-grid{padding-top:50px}
@media(max-width:700px){.crm-page-home .periodic-hero-inner{padding-top:36px}.editorial-actions{gap:24px}.crm-page-home .footer-grid{padding-top:38px}}

/* Editorial chapters: normal scrolling with restrained chapter transitions. */
.crm-page-home section{scroll-margin-top:var(--header-h)}.crm-page-home .home-collections{border-top:1px solid #daddd5}.crm-page-home .crm-atlas{border-top:1px solid #323139}.crm-page-home .home-editorial{border-top:1px solid #292b2c}.facet-group{padding:20px 0 10px;border-top:1px solid #dedfda}.facet-group h3{font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px;color:#787e78}.facet-option{display:flex;justify-content:space-between;gap:10px;padding:9px 10px;font-size:13px;color:#555b56}.facet-option span{font-size:11px;color:#999}.facet-option:hover,.facet-option.active{background:#f0efeb;color:#a72001}.facet-option.active{border-left:2px solid #a72001}.element-filter{padding-top:22px;border-top:1px solid #dedfda}.element-filter button{margin-top:10px}.filters .note{font-size:11px!important}@media(max-width:700px){.facet-group{padding:12px 0}.facet-option{padding:7px 10px}}

/* Optional proximity snap keeps native scrolling and allows tall chapters to scroll internally. */
html.crm-flow-enabled:has(body.crm-page-home){scroll-snap-type:y proximity;scroll-padding-top:var(--header-h)}
.crm-page-home .crm-opening,.crm-page-home #element-atlas,.crm-page-home #material-collections,.crm-page-home .home-editorial{scroll-snap-align:start}
.page-flow-toggle{position:fixed;z-index:80;left:16px;bottom:16px;display:inline-flex;gap:9px;align-items:center;padding:8px 11px;background:#f8f8f5;color:#303431;border:1px solid #cfd1ca;box-shadow:0 3px 16px #0002;font:11px/1.2 Arial,sans-serif;cursor:pointer}
.page-flow-value{color:#a72001;font-weight:600}.page-flow-toggle:focus-visible{outline:2px solid #a72001;outline-offset:3px}
@media(max-width:700px){.page-flow-toggle{bottom:10px;left:10px;font-size:10px;padding:7px 9px}}
@media(prefers-reduced-motion:reduce){html.crm-flow-enabled:has(body.crm-page-home){scroll-behavior:auto}}

/* Full-screen chapters with native scrolling inside taller sections. */
html.crm-flow-enabled:has(body.crm-page-home){scroll-snap-type:y mandatory}
html.crm-flow-enabled .crm-page-home .crm-opening,
html.crm-flow-enabled .crm-page-home #element-atlas,
html.crm-flow-enabled .crm-page-home #material-collections,
html.crm-flow-enabled .crm-page-home .home-editorial{scroll-snap-align:start;scroll-snap-stop:always;min-height:calc(100svh - var(--header-h))}
html.crm-flow-enabled .crm-page-home .crm-opening{height:calc(100svh - var(--header-h));min-height:0}
html.crm-flow-enabled .crm-page-home .home-collections{display:flex;align-items:center}
html.crm-flow-enabled .crm-page-home .home-editorial{display:flex;align-items:center}
html.crm-flow-enabled .crm-page-home .home-editorial .editorial-inner{width:min(1280px,calc(100% - 96px))}
@media(max-width:700px){html.crm-flow-enabled .crm-page-home .crm-opening{height:auto;min-height:calc(100svh - var(--header-h))}html.crm-flow-enabled .crm-page-home .home-editorial .editorial-inner{width:calc(100% - 40px)}}
html.crm-flow-enabled.crm-flow-animating:has(body.crm-page-home){scroll-snap-type:none;scroll-behavior:auto}

/* Keep the atlas legible while fitting desktop presentation chapters. */
@media(min-width:1101px){
 html.crm-flow-enabled .crm-page-home .crm-science-stage{padding-top:8px;padding-bottom:8px}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .periodic-grid{--atlas-cell:min(56px,max(34px,calc((100svh - 420px)/9)),calc((100cqw - 102px)/18));margin-inline:auto}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .element-tile b{font-size:clamp(17px,1.35vw,23px)}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .element-tile .element-cn{font-size:8px}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .periodic-hero-inner{padding-top:28px}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .atlas-index-heading{margin-top:18px}
}

/* Atlas slide: wide columns, compact rows, and room for the complete table. */
@media(min-width:1101px){
 html.crm-flow-enabled .crm-page-home .crm-science-stage .periodic-hero-inner{width:calc(100% - 80px);max-width:1760px;padding-top:14px;padding-bottom:10px}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .periodic-hero-heading{padding-bottom:10px;margin-bottom:0}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .hero-search>div{min-height:38px}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .atlas-index-heading{padding:12px 0 6px;margin-top:0}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .periodic-toolbar{margin-bottom:7px;gap:3px}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .periodic-grid{width:100%;grid-template-columns:repeat(18,minmax(0,1fr));grid-template-rows:repeat(7,clamp(42px,calc((100svh - 450px)/9),60px)) 6px repeat(2,clamp(42px,calc((100svh - 450px)/9),60px));gap:4px;margin:0}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .element-tile{padding:2px 2px;gap:0;overflow:hidden}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .element-tile .atomic-no{font-size:8px;line-height:1}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .element-tile b{font-size:clamp(16px,1.15vw,21px);line-height:1.05}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .element-tile .element-cn{font-size:7px;line-height:1.15;white-space:nowrap}
 html.crm-flow-enabled .crm-page-home .crm-science-stage .periodic-footer-row{padding-top:6px;margin-top:2px}
 html.crm-flow-enabled .crm-page-home .science-stage-footer{padding-top:6px}
 html.crm-flow-enabled .crm-page-home .home-collections{padding-top:40px;padding-bottom:40px}
 html.crm-flow-enabled .crm-page-home .home-collections .chapter-header{margin-bottom:28px}
 html.crm-flow-enabled .crm-page-home .home-family-links{margin-top:22px}
}

/* Sentence case is authored in the copy; do not transform technical notation. */
.crm-page .crm-brand-text span,
.crm-page .crm-nav > a, .crm-page .crm-nav-curtain > summary,
.crm-page .crm-curtain-col h4, .crm-page .crm-selection-pill,
.crm-page .crm-inquire-btn, .crm-page .eyebrow, .crm-page .btn,
.crm-page .hero-search button, .crm-page .table-tip-center,
.crm-page .table-caption > span, .crm-page .periodic-properties dt,
.crm-page .element-inspector a, .crm-page .product-add,
.crm-page .selector-label, .crm-page .footer-grid h3,
.crm-page .facet-group h3 { text-transform: none; letter-spacing: normal; }

/* Purchase path: compact filters and clear editable inquiry quantities. */
.filter-disclosure>summary{display:none;cursor:pointer;font-weight:600;list-style:none}.filter-disclosure>summary::-webkit-details-marker{display:none}
@media(min-width:821px){.filter-disclosure:not([open])>*:not(summary){display:block}}
@media(max-width:820px){.filter-disclosure>summary{display:flex;align-items:center;justify-content:space-between;min-height:42px}.filter-disclosure>summary span{font-size:12px;font-weight:400;color:#767676}.filter-disclosure[open]>summary{margin-bottom:12px}.filter-disclosure .filter-heading{display:none}}
.quote-draft-hint{font-size:12px;color:#666;line-height:1.5;margin:8px 0 20px}.quote-qty{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;font-size:12px;color:#555}.quote-qty label{display:flex;align-items:center;gap:8px}.quote-qty input{width:70px;min-height:38px;padding:6px;border:1px solid #c5c5c5;font:inherit;color:#222;background:#fff}.quote-item{overflow-wrap:anywhere}.filter-disclosure summary:focus-visible,.inquiry-qty:focus-visible{outline:2px solid #a72001;outline-offset:2px}

#crm-print-inquiry{display:none}
@media print{body.crm-page > :not(main),body.crm-page main > :not(#crm-print-inquiry){display:none!important} body.crm-page #crm-print-inquiry{display:block!important;position:absolute;top:0;left:0;width:100%;color:#111;font:11pt Arial,sans-serif} #crm-print-inquiry header{display:flex;align-items:center;gap:24px;border-bottom:2px solid #a72001;padding-bottom:15px} #crm-print-inquiry header img{width:100px;height:auto} #crm-print-inquiry h1{font-size:22pt;margin:0} #crm-print-inquiry h2{font-size:13pt;margin:22px 0 8px} #crm-print-inquiry dl{display:grid;grid-template-columns:110px 1fr;gap:6px;margin:20px 0} #crm-print-inquiry dd{margin:0;overflow-wrap:anywhere} #crm-print-inquiry table{width:100%;border-collapse:collapse;font-size:10pt} #crm-print-inquiry th,#crm-print-inquiry td{border:1px solid #aaa;padding:7px;text-align:left;vertical-align:top;overflow-wrap:anywhere} #crm-print-inquiry tr{break-inside:avoid} #crm-print-inquiry .print-notes{white-space:pre-wrap;overflow-wrap:anywhere} #crm-print-inquiry footer{margin-top:24px;border-top:1px solid #aaa;padding-top:12px;color:#444;background:none;font-size:9pt}}


/* ==========================================================================
   Aesthetic Detail & Micro-Interaction Polish (Preserving CRM Editorial Style)
   ========================================================================== */

/* 1. Restrict section-snap floating toggle strictly to the homepage */
body.crm-page:not(.crm-page-home) .page-flow-toggle {
  display: none !important;
}
body.crm-page-home .page-flow-toggle {
  background: rgba(248, 248, 245, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(27, 29, 31, 0.15);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
  transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
body.crm-page-home .page-flow-toggle:hover {
  background: #ffffff;
  border-color: var(--crm-crimson);
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.12);
}
.crm-page-home .science-stage-footer {
  padding-bottom: 42px;
}

/* 2. Materials Curtain Mega-Menu: 4-column balance, light-theme spotlight & smooth entrance */
.crm-nav-chevron {
  display: inline-block;
  transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), color 0.2s ease;
}
.crm-nav-curtain[open] .crm-nav-chevron {
  transform: rotate(180deg);
  color: var(--crm-crimson);
}
@keyframes crmCurtainReveal {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (min-width: 1101px) {
  .crm-nav-curtain[open] > .crm-curtain-panel {
    animation: crmCurtainReveal 0.24s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }
  .crm-page .crm-curtain-panel {
    white-space: normal;
  }
  .crm-page .crm-curtain-grid {
    width: min(1280px, calc(100% - 96px));
    max-width: 1280px;
    grid-template-columns: 1.15fr 1fr 1fr 1.05fr;
    gap: 44px;
    padding: 0;
  }
  .crm-page .crm-curtain-col {
    min-width: 0;
    white-space: normal;
  }
  .crm-page .crm-curtain-grid > .crm-curtain-col:last-child {
    display: block;
  }
}
.crm-page .crm-curtain-panel {
  white-space: normal;
}
.crm-page .crm-curtain-spotlight {
  background: #f2f3ef;
  border: 1px solid #e1e3dc;
  border-left: 2px solid var(--crm-crimson);
  padding: 24px;
}
.crm-page .crm-curtain-spotlight h4 {
  color: var(--crm-crimson);
  margin-bottom: 10px;
}
.crm-page .crm-curtain-spotlight p {
  color: #5a5f59;
  font-size: 13px;
  line-height: 1.68;
  margin-bottom: 18px;
}
.crm-page .crm-curtain-links a {
  transition: color 0.18s ease, transform 0.18s cubic-bezier(0.22, 1, 0.36, 1);
}
.crm-page .crm-curtain-links a:hover {
  transform: translateX(3px);
}

/* 3. Header & CTA Link Micro-Interactions */
.crm-nav > a,
.crm-nav-curtain > summary,
.crm-search-link,
.crm-selection-pill,
.crm-inquire-btn {
  transition: color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}
.crm-search-link:hover {
  color: var(--crm-crimson);
  transform: scale(1.06);
}
.crm-selection-pill:hover {
  color: #17191b;
}
.crm-selection-pill:hover .cart-count {
  color: var(--crm-crimson);
}
.intro-actions a,
.editorial-actions a,
.home-contact a,
.method-summary-inner nav a,
.doc-link,
.text-link {
  transition: color 0.2s ease, border-color 0.2s ease, padding-left 0.2s ease;
}
.intro-actions a span,
.editorial-actions a span,
.home-contact a span,
.method-summary-inner nav a > span,
.doc-link span {
  display: inline-block;
  transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), color 0.2s ease;
}
.intro-actions a:hover span,
.editorial-actions a:hover span,
.home-contact a:hover span {
  transform: translate(3px, -2px);
}
.method-summary-inner nav a:hover > span,
.doc-link:hover span {
  transform: translateX(4px);
}

/* 4. Opening Split Hero: Restrained Ken Burns Drift & Active Tab Progress */
@media (prefers-reduced-motion: no-preference) {
  .opening-slide {
    transition: opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .opening-slide img {
    transform: scale(1.035);
    transition: transform 6.8s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
  }
  .opening-slide.is-active img {
    transform: scale(1);
  }
}
.opening-choice {
  position: relative;
  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}
.opening-pause {
  transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}
.opening-pause:hover {
  border-color: rgba(255, 255, 255, 0.55);
  color: #ffffff;
}

/* 5. Interactive Periodic Atlas & Inspector Polish */
.periodic-panel .element-tile {
  transition: transform 0.18s cubic-bezier(0.22, 1, 0.36, 1),
              border-color 0.18s ease,
              background-color 0.18s ease,
              box-shadow 0.18s ease,
              opacity 0.22s ease;
}
@media (prefers-reduced-motion: no-preference) {
  .periodic-panel .element-tile:hover,
  .periodic-panel .element-tile:focus-visible {
    transform: translateY(-2px);
    z-index: 3;
  }
}
.periodic-panel .legend-btn {
  transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
}
.element-inspector a {
  transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}
.periodic-properties dd {
  transition: color 0.2s ease;
}

/* 6. Homepage Collection Rows & Family Links */
.collection-card {
  transition: border-color 0.22s ease, padding-left 0.22s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.22s ease;
}
.collection-card h3 {
  transition: color 0.2s ease;
}
.collection-card h3 > span {
  display: inline-block;
  transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), color 0.2s ease;
}
.collection-card:hover {
  border-bottom-color: #8c9188;
}
.collection-card:hover h3 > span {
  transform: translate(3px, -3px);
}
.home-family-links a {
  transition: color 0.18s ease;
}

/* 7. Directory Product Rows, Detail Specimen Stage & Inner Page Cards */
@media (min-width: 641px) {
  .crm-page .product-row .product-add {
    white-space: nowrap;
    padding-left: 16px;
    padding-right: 16px;
  }
}
.product-row {
  transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}
.product-row .formula-art img,
.related-card .formula img,
.detail-visual img {
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
@media (prefers-reduced-motion: no-preference) {
  .product-row:hover .formula-art img,
  .related-card:hover .formula img {
    transform: scale(1.03);
  }
  .detail-visual:hover img {
    transform: scale(1.018);
  }
}
.native-application figure,
.equipment-list figure {
  overflow: hidden;
}
.native-application figure img,
.equipment-list figure img {
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
@media (prefers-reduced-motion: no-preference) {
  .native-application:hover figure img,
  .equipment-list figure:hover img {
    transform: scale(1.025);
  }
}
.selector-chip {
  transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease, transform 0.15s ease;
}
.supply-basis summary {
  cursor: pointer;
  transition: color 0.18s ease;
}
.supply-basis summary:hover {
  color: var(--crm-crimson);
}

/* 8. Restrained Scroll-Reveal Entrance */
@media (prefers-reduced-motion: no-preference) {
  .crm-reveal-pending {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 0.52s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.52s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .crm-reveal-pending.is-revealed {
    opacity: 1;
    transform: translateY(0);
  }
}


/* ==========================================================================
   9. Rebuilt 4-Chapter Homepage Architecture (Natural Viewport Pages & 1280px Grid)
   ========================================================================== */

/* Shared 1280px baseline across chapters 02, 03, 04 and footer on the homepage */
.crm-page-home .periodic-hero-inner,
.crm-page-home .collections-stage-inner,
.crm-page-home .editorial-inner,
.crm-page-home .footer-grid,
.crm-page-home .footer-bottom {
  width: min(1280px, calc(100% - 96px)) !important;
  max-width: 1280px !important;
  margin-inline: auto !important;
  box-sizing: border-box;
}

/* Minimalist grey chapter dots on the left margin (active dot in brand crimson) */
.crm-chapter-rail {
  position: fixed;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 75;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.crm-chapter-rail .chapter-rail-item {
  display: block;
  width: 8px;
  height: 8px;
  padding: 0;
  border-radius: 999px !important;
  background: rgba(142, 146, 142, 0.48);
  border: 0;
  text-decoration: none;
  transition: background-color 0.22s ease, transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}
.crm-chapter-rail .chapter-rail-item:hover {
  background: rgba(142, 146, 142, 0.85);
  transform: scale(1.2);
}
.crm-chapter-rail .chapter-rail-item.is-active {
  background: var(--crm-crimson);
  transform: scale(1.3);
}

/* Chapter 01: Grand Full-Bleed 50/50 Split Stage (Left copy aligned to 1280px logo baseline) */
.crm-page-home .crm-opening {
  background: #f3f3f0;
  padding: 0 !important;
  border-top: 0;
}
.crm-page-home .crm-opening-panel.crm-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  height: 100%;
  min-height: 0;
  background: #f3f3f0;
}
.crm-page-home .crm-opening .intro-copy {
  padding: clamp(48px, 8vh, 96px) 9% clamp(48px, 8vh, 96px) max(48px, calc(100% - 640px)) !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-width: 0;
  height: 100%;
  box-sizing: border-box;
}
.crm-page-home .crm-opening .intro-copy > .eyebrow {
  margin: 0 0 clamp(24px, 3.4vh, 40px) !important;
  color: #5f6360;
}
.crm-page-home .crm-opening .intro-copy h1 {
  font-size: clamp(54px, 5.3vw, 84px);
  line-height: 1.02;
  letter-spacing: -0.055em;
  margin: 0;
}
.crm-page-home .crm-opening .intro-copy > p {
  font-size: 17px;
  line-height: 1.72;
  color: #5c6063;
  max-width: 40ch;
  margin: clamp(22px, 3vh, 32px) 0 0;
}
.crm-page-home .crm-opening .intro-actions {
  margin-top: clamp(28px, 3.8vh, 42px);
}
.crm-page-home .crm-opening .opening-gallery {
  height: 100%;
  min-height: 0;
  position: relative;
  overflow: hidden;
  background: #181a1c;
  border: 0;
}

/* Chapter 02: Periodic Table Atlas Stage */
.crm-page-home #element-atlas.crm-science-stage {
  padding: 0 !important;
}
.crm-page-home #element-atlas .periodic-hero-inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(16px, 2.4vh, 28px) 0 !important;
}
.crm-page-home .atlas-stage-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 64px;
  align-items: end;
  padding-bottom: clamp(10px, 1.4vh, 16px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  flex-shrink: 0;
}
.crm-page-home .atlas-stage-title-col .eyebrow {
  display: block;
  color: #b9b7c6;
  margin-bottom: 8px;
}
.crm-page-home .atlas-stage-title {
  font-size: clamp(26px, 2.5vw, 38px);
  line-height: 1.08;
  letter-spacing: -0.04em;
  color: #f5f5f2;
  margin: 0;
  font-weight: 400;
}
.crm-page-home .atlas-stage-title span {
  color: var(--crm-crimson);
}
.crm-page-home .hero-search-label-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 6px;
}
.crm-page-home .hero-search-label-row label {
  font-size: 11px;
  color: #d6d5de;
  margin: 0;
}
.crm-page-home .atlas-catalog-link {
  font-size: 11px;
  color: #c8c6d2;
}
.crm-page-home .atlas-catalog-link:hover {
  color: #ffffff;
}
.crm-page-home .hero-search-input-row {
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.38);
  min-height: 34px;
}
.crm-page-home .hero-search-input-row input {
  flex: 1;
  background: transparent;
  border: 0;
  color: #ffffff;
  padding: 6px 0;
  font-size: 13px;
  outline: none;
}
.crm-page-home .hero-search-input-row button {
  background: none;
  border: 0;
  color: #ffffff;
  font-size: 12px;
  padding: 4px 0 4px 14px;
  cursor: pointer;
}
.crm-page-home #element-atlas .hero-search > span {
  margin-top: 7px;
  font-size: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  color: #9da0a8;
}
.crm-page-home #element-atlas .periodic-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 0;
  padding: 4px 0;
}
.crm-page-home #element-atlas .periodic-toolbar {
  margin-bottom: 6px !important;
  gap: 3px !important;
}
.crm-page-home #element-atlas .periodic-footer-row {
  padding-top: 6px !important;
  margin-top: 2px !important;
}
.crm-page-home #element-atlas .science-stage-footer {
  padding: 8px 0 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  flex-shrink: 0;
}

/* Chapter 03: Large Architectural 4x2 Grid for Product Forms */
.crm-page-home #material-collections.home-collections {
  background: #f2f3ef;
  padding: 0 !important;
  display: block !important;
}
.crm-page-home .collections-stage-inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(28px, 4.4vh, 56px) 0 !important;
}
.crm-page-home #material-collections .chapter-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 64px;
  align-items: end;
  margin-bottom: 0 !important;
}
.crm-page-home #material-collections .chapter-header > a {
  justify-self: end;
}
.crm-page-home #material-collections h2 {
  font-size: clamp(32px, 3.4vw, 48px);
  line-height: 1.06;
  letter-spacing: -0.04em;
  margin: 8px 0 0;
}
.crm-page-home #material-collections h2 span {
  color: var(--crm-crimson);
}
.crm-page-home #material-collections .text-collections {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  border-top: 0;
  margin: auto 0;
}
.crm-page-home #material-collections .collection-card,
.crm-page-home #material-collections .collection-card:nth-child(odd),
.crm-page-home #material-collections .collection-card:nth-child(even) {
  margin: 0 !important;
  min-height: clamp(168px, 23vh, 224px);
  padding: clamp(20px, 2.6vh, 28px);
  border: 1px solid #d8dad3 !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  gap: 18px;
  background: #fafaf8;
  transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.22s ease;
}
.crm-page-home #material-collections .collection-card.collection-custom {
  background: #e8eae3;
  border-color: #cacdc4 !important;
}
.crm-page-home #material-collections .collection-card:hover {
  background: #ffffff;
  border-color: #b4b8af !important;
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.045);
}
.crm-page-home #material-collections .collection-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  flex: 0 0 auto;
  font-size: 11px;
}
.crm-page-home #material-collections .collection-meta .meta-idx {
  color: var(--crm-crimson);
  font-weight: 600;
}
.crm-page-home #material-collections .collection-meta .meta-count {
  display: inline !important;
  color: #828780;
  font-size: 11px;
}
.crm-page-home #material-collections .collection-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
}
.crm-page-home #material-collections .collection-card h3 {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 0;
}
.crm-page-home #material-collections .collection-card h3 b {
  font-weight: 500;
  font-size: clamp(18px, 1.4vw, 21px);
  line-height: 1.22;
  letter-spacing: -0.02em;
  color: #191b1d;
  transition: color 0.2s ease;
}
.crm-page-home #material-collections .collection-card:hover h3 b {
  color: var(--crm-crimson);
}
.crm-page-home #material-collections .collection-card p {
  display: block !important;
  margin: 0;
  font-size: 12.5px;
  line-height: 1.55;
  color: #727770;
}
.crm-page-home #material-collections .home-family-links {
  margin-top: 0 !important;
  padding-top: 18px;
  border-top: 1px solid #d6d9d2;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px 32px;
  flex-wrap: wrap;
}
.crm-page-home #material-collections .home-family-links > span {
  flex: 0 0 auto;
  margin: 0;
  font-size: 11px;
  color: #747972;
}
.crm-page-home #material-collections .home-family-items {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  flex: 1;
  justify-content: flex-end;
}

/* Chapter 04: Chamber Engineering + Integrated Closing Footer */
.crm-page-home #chamber-engineering.home-editorial {
  background: #151718;
  color: #f7f7f3;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch !important;
}
.crm-page-home .home-editorial-stage {
  flex: 1;
  display: flex;
  align-items: center;
  min-height: 0;
  padding: clamp(18px, 2.8vh, 40px) 0;
}
.crm-page-home #chamber-engineering .editorial-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 64px;
  align-items: center;
  min-height: 0 !important;
}
.crm-page-home #chamber-engineering .editorial-copy {
  padding: 0 !important;
}
.crm-page-home #chamber-engineering .editorial-copy h2 {
  font-size: clamp(34px, 3.6vw, 52px);
  line-height: 1.06;
  letter-spacing: -0.045em;
  margin: clamp(10px, 1.5vh, 18px) 0;
}
.crm-page-home #chamber-engineering .editorial-copy p {
  font-size: 15px;
  line-height: 1.7;
  color: #aeb2b0;
  max-width: 48ch;
  margin-bottom: clamp(14px, 2vh, 22px);
}
.crm-page-home .editorial-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-bottom: clamp(16px, 2.4vh, 26px);
  padding: 11px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 11px;
  color: #cfd3d0;
}
.crm-page-home .editorial-specs span::before {
  content: "· ";
  color: var(--crm-crimson);
  font-weight: 700;
}
.crm-page-home #chamber-engineering .editorial-actions {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.crm-page-home #chamber-engineering .editorial-actions a {
  min-width: 140px;
  gap: 16px;
  padding-bottom: 9px;
}
.crm-page-home .editorial-figure {
  margin: 0;
  position: relative;
  width: 100%;
  height: clamp(220px, 33vh, 350px);
  overflow: hidden;
  background: #1d2022;
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.crm-page-home .editorial-figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.crm-page-home .editorial-figure figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 44px 24px 16px;
  background: linear-gradient(transparent, rgba(12, 14, 15, 0.88));
  color: #eceee9;
  font-size: 10px;
  letter-spacing: 0.03em;
}
.crm-page-home #chamber-engineering footer {
  background: #111314;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding: clamp(16px, 2.2vh, 26px) 0 clamp(10px, 1.4vh, 16px);
  flex-shrink: 0;
  width: 100%;
}
.crm-page-home #chamber-engineering .footer-grid {
  padding-top: 0 !important;
  gap: 40px;
  margin-bottom: clamp(10px, 1.5vh, 18px);
}
.crm-page-home #chamber-engineering .footer-grid h3 {
  margin-bottom: 8px;
}
.crm-page-home #chamber-engineering .footer-grid p,
.crm-page-home #chamber-engineering .footer-grid > div > a:not(.footer-brand) {
  font-size: 11.5px;
  line-height: 1.55;
}
.crm-page-home #chamber-engineering .crm-social {
  margin-top: 8px;
}
.crm-page-home #chamber-engineering .footer-bottom {
  padding-top: 10px;
  font-size: 10px;
}

/* Desktop Full-Viewport Chapter Sizing (Identical whether Page snap is On or Off!) */
@media (min-width: 1025px) and (min-height: 660px) {
  .crm-page-home .home-chapter,
  html.crm-flow-enabled .crm-page-home .home-chapter {
    height: calc(100svh - var(--header-h)) !important;
    min-height: 620px !important;
    max-height: 1120px;
    box-sizing: border-box;
    overflow: hidden;
  }
  .crm-page-home #element-atlas .periodic-grid,
  html.crm-flow-enabled .crm-page-home #element-atlas .periodic-grid {
    width: 100% !important;
    grid-template-columns: repeat(18, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(7, clamp(36px, calc((100svh - var(--header-h) - 245px) / 9), 52px)) 6px repeat(2, clamp(36px, calc((100svh - var(--header-h) - 245px) / 9), 52px)) !important;
    gap: 4px !important;
    margin: 0 !important;
  }
  .crm-page-home #element-atlas .element-tile,
  html.crm-flow-enabled .crm-page-home #element-atlas .element-tile {
    padding: 2px !important;
    gap: 0 !important;
    overflow: hidden;
  }
  .crm-page-home #element-atlas .element-tile .atomic-no,
  html.crm-flow-enabled .crm-page-home #element-atlas .element-tile .atomic-no {
    font-size: 8px !important;
    line-height: 1 !important;
  }
  .crm-page-home #element-atlas .element-tile b,
  html.crm-flow-enabled .crm-page-home #element-atlas .element-tile b {
    font-size: clamp(15px, 1.15vw, 20px) !important;
    line-height: 1.05 !important;
  }
  .crm-page-home #element-atlas .element-tile .element-cn,
  html.crm-flow-enabled .crm-page-home #element-atlas .element-tile .element-cn {
    font-size: 7px !important;
    line-height: 1.15 !important;
    white-space: nowrap;
  }
}

/* Tablet & Mobile Responsive Fallback */
@media (max-width: 1024px) {
  .crm-chapter-rail,
  body.crm-page-home .page-flow-toggle {
    display: none !important;
  }
  .crm-page-home .home-chapter {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible;
  }
  .crm-page-home .periodic-hero-inner,
  .crm-page-home .collections-stage-inner,
  .crm-page-home .editorial-inner,
  .crm-page-home .footer-grid,
  .crm-page-home .footer-bottom {
    width: calc(100% - 48px) !important;
  }
  .crm-page-home .crm-opening-panel.crm-intro,
  .crm-page-home .atlas-stage-header,
  .crm-page-home #material-collections .chapter-header,
  .crm-page-home #chamber-engineering .editorial-inner {
    grid-template-columns: 1fr;
    row-gap: 28px;
  }
  .crm-page-home .crm-opening .intro-copy {
    padding: 48px 24px 32px !important;
  }
  .crm-page-home .crm-opening .opening-gallery {
    height: 380px;
  }
  .crm-page-home #material-collections .text-collections {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 24px 0;
  }
  .crm-page-home #material-collections .home-family-items {
    justify-content: flex-start;
  }
}
@media (max-width: 640px) {
  .crm-page-home .periodic-hero-inner,
  .crm-page-home .collections-stage-inner,
  .crm-page-home .editorial-inner,
  .crm-page-home .footer-grid,
  .crm-page-home .footer-bottom {
    width: calc(100% - 32px) !important;
  }
  .crm-page-home #material-collections .text-collections {
    grid-template-columns: 1fr;
  }
}


/* ==========================================================================
   10. Engineering Workbench (5 Interactive Material Calculators)
   ========================================================================== */
.crm-workbench-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid #d8dad4;
}
.crm-workbench-tabs .wb-tab {
  background: #ffffff;
  border: 1px solid #cfd2cb;
  color: #424643;
  padding: 9px 15px;
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}
.crm-workbench-tabs .wb-tab span {
  color: var(--crm-crimson);
  font-weight: 600;
  margin-right: 5px;
}
.crm-workbench-tabs .wb-tab:hover {
  border-color: var(--crm-crimson);
  color: #191b1d;
}
.crm-workbench-tabs .wb-tab.is-active {
  background: #17191a;
  border-color: #17191a;
  color: #ffffff;
}
.crm-workbench-tabs .wb-tab.is-active span {
  color: #ff6b4a;
}

.crm-toolbox-container {
  display: flex;
  flex-direction: column;
  gap: 36px;
  padding-bottom: 48px;
}
.crm-tool-card {
  background: #ffffff;
  border: 1px solid #d4d7d0;
  box-sizing: border-box;
}
.crm-tool-card * {
  box-sizing: border-box;
  min-width: 0;
}
.crm-tool-head {
  background: #f5f5f2;
  border-bottom: 1px solid #d4d7d0;
  padding: 22px 28px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
}
.crm-tool-title-group .eyebrow {
  display: block;
  color: var(--crm-crimson);
  margin-bottom: 6px;
}
.crm-tool-title-group h2 {
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.025em;
  color: #191b1d;
  margin: 0 0 6px;
}
.crm-tool-title-group p {
  font-size: 13.5px;
  line-height: 1.65;
  color: #636863;
  margin: 0;
  max-width: 78ch;
}
.crm-tool-badge {
  font-size: 11px;
  color: #5b605b;
  background: #ffffff;
  border: 1px solid #cfd2cb;
  padding: 5px 10px;
  white-space: nowrap;
}
.crm-tool-body {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
}
.crm-tool-form-col {
  padding: 26px 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  background: #ffffff;
}
.crm-tool-result-col {
  padding: 26px 28px;
  background: #fafaf8;
  border-left: 1px solid #d4d7d0;
  display: flex;
  flex-direction: column;
}
.crm-tool-result-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 12px;
  margin-bottom: 16px;
  border-bottom: 1px solid #d8dad4;
  font-size: 12px;
  font-weight: 600;
  color: #191b1d;
}
.crm-tool-result-head .status-tag {
  font-size: 11px;
  font-weight: 400;
  color: #747974;
}
.crm-tool-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.crm-tool-row label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
  font-weight: 600;
  color: #252826;
  margin: 0;
}
.crm-tool-row label small {
  font-size: 11px;
  font-weight: 400;
  color: #787d78;
}
.crm-tool-row input,
.crm-tool-row select {
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid #cfd2cb;
  background: #fafaf8;
  font-size: 13px;
  color: #191b1d;
  outline: none;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.crm-tool-row input:focus,
.crm-tool-row select:focus {
  border-color: var(--crm-crimson);
  background: #ffffff;
}
.crm-tool-inline-input {
  display: flex;
  gap: 8px;
}
.crm-tool-inline-input input {
  flex: 1;
}
.crm-tool-btn-primary {
  background: var(--crm-crimson);
  border: 1px solid var(--crm-crimson);
  color: #ffffff;
  padding: 0 18px;
  min-height: 40px;
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.18s ease;
}
.crm-tool-btn-primary:hover {
  background: var(--crm-crimson-dark);
}
.crm-tool-btn-outline {
  background: #ffffff;
  border: 1px solid #c5c8c1;
  color: #262927;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: border-color 0.18s ease, color 0.18s ease;
}
.crm-tool-btn-outline:hover {
  border-color: var(--crm-crimson);
  color: var(--crm-crimson);
}
.crm-tool-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.crm-tool-chip {
  background: #f5f5f2;
  border: 1px solid #d4d7d0;
  color: #4a4f4a;
  padding: 4px 10px;
  font-size: 11.5px;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}
.crm-tool-chip:hover,
.crm-tool-chip.active {
  border-color: var(--crm-crimson);
  color: var(--crm-crimson);
  background: #fff8f6;
}
.crm-tool-basis-bar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.crm-tool-basis-bar .crm-tool-chip {
  padding: 8px 12px;
  font-weight: 500;
  text-align: center;
}
.crm-alloy-grid-head {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1.1fr 34px;
  gap: 8px;
  font-size: 11px;
  font-weight: 600;
  color: #696e69;
  padding-bottom: 2px;
}
.crm-alloy-rows {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.crm-alloy-row {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1.1fr 34px;
  gap: 8px;
  align-items: center;
}
.crm-alloy-del {
  height: 38px;
  background: #ffffff;
  border: 1px solid #d4d7d0;
  color: #777b77;
  cursor: pointer;
  font-size: 12px;
}
.crm-alloy-del:hover {
  border-color: var(--crm-crimson);
  color: var(--crm-crimson);
}
.crm-tool-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.crm-tool-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.crm-tool-grid-4 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.crm-tool-meta-bar {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 12px;
  color: #5c615c;
  margin-bottom: 10px;
}
.crm-table-scroll {
  overflow-x: auto;
}
.crm-tool-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  background: #ffffff;
  border: 1px solid #d8dad4;
  margin-bottom: 14px;
}
.crm-tool-table th,
.crm-tool-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #e4e6e1;
  text-align: left;
}
.crm-tool-table th {
  background: #f2f3ef;
  font-size: 11px;
  font-weight: 600;
  color: #353935;
  white-space: nowrap;
}
.crm-tool-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.crm-tool-table tfoot tr {
  background: #f5f5f2;
  font-weight: 600;
  border-top: 1px solid #cfd2cb;
}
.crm-tool-summary-card {
  background: #ffffff;
  border: 1px solid #d8dad4;
  border-left: 2px solid var(--crm-crimson);
  padding: 12px 15px;
  margin-bottom: 14px;
}
.crm-tool-summary-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.crm-tool-summary-row span {
  display: block;
  font-size: 11px;
  color: #6e736e;
}
.crm-tool-summary-row strong {
  font-size: 17px;
  color: #191b1d;
}
.crm-tool-summary-sub {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #e6e8e3;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 11.5px;
  color: #5b605b;
}
.crm-tool-notice {
  background: #f5f5f2;
  border: 1px solid #d8dad4;
  border-left: 2px solid var(--crm-crimson);
  padding: 11px 14px;
  font-size: 12px;
  line-height: 1.6;
  color: #4f544f;
  margin-bottom: 14px;
}
.crm-tool-notice.is-error {
  background: #fff5f5;
  color: var(--crm-crimson);
}
.crm-tool-actions {
  margin-top: auto;
  padding-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

@media (max-width: 980px) {
  .crm-tool-body {
    grid-template-columns: 1fr;
  }
  .crm-tool-result-col {
    border-left: 0;
    border-top: 1px solid #d4d7d0;
  }
  .crm-tool-grid-3 {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   11. Upgraded Materials Directory Filtering & List/Grid View (all-products.php)
   ========================================================================== */
.crm-catalog-control-bar {
  background: #f3f3f0;
  border: 1px solid #d8dad4;
  padding: 20px 22px;
  margin-bottom: 32px;
}
.crm-catalog-search-row {
  display: flex;
  gap: 10px;
  margin-bottom: 14px;
}
.crm-search-input-wrap {
  flex: 1;
  position: relative;
  display: flex;
  align-items: center;
  background: #ffffff;
  border: 1px solid #cfd2cb;
}
.crm-search-input-wrap:focus-within {
  border-color: var(--crm-crimson);
}
.crm-search-input-wrap svg {
  width: 17px;
  height: 17px;
  stroke: #7a7f7a;
  stroke-width: 1.6;
  fill: none;
  margin-left: 14px;
  flex-shrink: 0;
}
.crm-search-input-wrap input {
  width: 100%;
  border: 0 !important;
  background: transparent !important;
  padding: 12px 14px;
  font-size: 14px;
  color: #191b1d;
  outline: none;
}
.crm-search-clear {
  padding: 0 14px;
  font-size: 18px;
  color: #777b77;
  text-decoration: none;
}
.crm-search-clear:hover {
  color: var(--crm-crimson);
}
.crm-quick-select-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.crm-quick-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.crm-quick-field label {
  font-size: 11px;
  font-weight: 600;
  color: #5e635e;
  margin: 0;
}
.crm-quick-field select {
  width: 100%;
  min-height: 38px;
  padding: 7px 10px;
  background: #ffffff;
  border: 1px solid #cfd2cb;
  font-size: 12.5px;
  color: #191b1d;
  cursor: pointer;
}
.crm-quick-field select:focus {
  border-color: var(--crm-crimson);
  outline: none;
}

.crm-el-chip-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.crm-el-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  padding: 5px 8px;
  font-size: 11.5px;
  font-weight: 500;
  color: #454a45;
  background: #ffffff;
  border: 1px solid #d4d7d0;
  text-decoration: none;
  transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}
.crm-el-chip:hover {
  border-color: var(--crm-crimson);
  color: var(--crm-crimson);
}
.crm-el-chip.active {
  background: var(--crm-crimson);
  border-color: var(--crm-crimson);
  color: #ffffff;
}
.facet-option.is-zero {
  opacity: 0.42;
}
.filter-clear-all {
  font-size: 12px;
  color: var(--crm-crimson);
  padding: 4px 8px;
  align-self: center;
}
.results-toolbar-right {
  display: flex;
  align-items: center;
  gap: 18px;
}
.crm-view-toggle {
  display: inline-flex;
  border: 1px solid #cfd2cb;
  background: #ffffff;
}
.crm-view-toggle .view-mode-btn {
  border: 0;
  background: transparent;
  color: #626762;
  font-size: 11.5px;
  font-weight: 500;
  padding: 5px 11px;
  cursor: pointer;
}
.crm-view-toggle .view-mode-btn.is-active {
  background: #17191a;
  color: #ffffff;
}

/* Grid view option for #product-results */
#product-results.is-grid-view {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
#product-results.is-grid-view .product-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 16px;
  border: 1px solid #d8dad4;
  background: #ffffff;
  gap: 12px;
}
#product-results.is-grid-view .product-row .formula-art {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
}
#product-results.is-grid-view .product-row .product-spec {
  text-align: left;
  padding-top: 8px;
  border-top: 1px solid #ebede8;
}
#product-results.is-grid-view .product-row .product-add {
  margin-top: auto;
  text-align: center;
  justify-content: center;
}

#catalog-dynamic-area {
  transition: opacity 0.16s ease;
}

@media (max-width: 960px) {
  .crm-quick-select-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #product-results.is-grid-view {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .crm-catalog-search-row {
    flex-direction: column;
  }
  .crm-quick-select-bar,
  #product-results.is-grid-view {
    grid-template-columns: 1fr;
  }
}


/* ==========================================================================
   12. Unified North American B2B Industrial Typography & Restrained Color Discipline
   ========================================================================== */

/* Font Smoothing & Unified Single-Font System (Inter) */
html:has(body.crm-page-home) {
  scroll-padding-top: var(--header-h);
}
.crm-page-home .home-chapter {
  scroll-margin-top: 0 !important;
}
body.crm-page {
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Tabular Numerals for Numerical Readouts without Font Switching */
.crm-page .eyebrow,
.crm-page .collection-meta .meta-idx,
.crm-page .collection-meta .meta-count,
.crm-page .element-tile .atomic-no,
.crm-page .table-caption > span,
.crm-page .periodic-properties dt,
.crm-page .periodic-properties dd,
.crm-page .opening-tabs button span,
.crm-page .element-inspector strong span,
.crm-page .crm-selection-pill .cart-count,
.crm-page .crm-tool-badge,
.crm-page .crm-workbench-tabs .wb-tab span {
  font-variant-numeric: tabular-nums;
}

/* Eyebrows: Clean uppercase with 2px Crimson Indicator */
.crm-page-home .home-chapter .eyebrow {
  display: inline-flex !important;
  align-items: center;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-left: 2px solid var(--crm-crimson);
  padding-left: 10px;
  color: var(--crm-crimson) !important;
}
.crm-page-home #home-overview .eyebrow,
.crm-page-home #material-collections .eyebrow,
.crm-page-home #element-atlas .eyebrow,
.crm-page-home #chamber-engineering .eyebrow {
  color: var(--crm-crimson) !important;
}

/* Level 1: Screen 01 Hero Display & Lead Copy */
.crm-page-home .crm-opening .intro-copy h1 {
  font-family: var(--font-display) !important;
  font-size: clamp(38px, 3.55vw, 54px) !important;
  font-weight: 500 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.036em !important;
  color: #141618;
}
.crm-page-home .crm-opening .intro-copy > p {
  font-size: 15.5px !important;
  line-height: 1.72 !important;
  letter-spacing: -0.005em;
  color: #4f5451 !important;
  max-width: 46ch !important;
}
.crm-page-home .opening-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
.crm-page-home .opening-tabs button {
  white-space: nowrap !important;
  font-size: 11px !important;
}
.crm-page-home .opening-slide figcaption span:first-child {
  font-weight: 500;
  letter-spacing: -0.01em;
}
.crm-page-home .opening-tabs button span {
  color: #a8acb3;
  transition: color 0.2s ease;
}
.crm-page-home .opening-tabs button[aria-pressed="true"] span {
  color: #f0482b;
}

/* Level 2: Chapter Display Headings (Screens 02, 03, 04) */
.crm-page-home .atlas-stage-title {
  font-family: var(--font-display) !important;
  font-size: clamp(24px, 2.25vw, 34px) !important;
  font-weight: 500 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.032em !important;
  color: #f5f5f2 !important;
}
.crm-page-home #material-collections h2 {
  font-family: var(--font-display) !important;
  font-size: clamp(30px, 2.85vw, 42px) !important;
  font-weight: 500 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
  color: #141618 !important;
  margin-top: 10px !important;
}
.crm-page-home #chamber-engineering .editorial-copy h2 {
  font-family: var(--font-display) !important;
  font-size: clamp(20px, 1.8vw, 27px) !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.025em !important;
  color: #f5f5f2 !important;
  margin: 12px 0 16px !important;
  max-width: 44ch !important;
}
.crm-page-home #chamber-engineering .editorial-copy p {
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  color: #b0b4b2 !important;
  max-width: 48ch !important;
  margin-bottom: 22px !important;
}

/* Chapter 02: Rectangular Technical Search Console & Clean Stage Header */
.crm-page-home .atlas-stage-header {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  padding-bottom: clamp(10px, 1.4vh, 16px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  flex-shrink: 0 !important;
}
.crm-page-home .atlas-stage-topbar {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
}
.crm-page-home .atlas-stage-topbar .eyebrow {
  margin-bottom: 0 !important;
}
.crm-page-home .atlas-hint-text {
  font-size: 11px !important;
  color: #8c9099 !important;
}
.crm-page-home .hero-search-console {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}
.crm-page-home .hero-search-box {
  display: flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.22);
  height: 40px;
  padding: 0 4px 0 12px;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
.crm-page-home .hero-search-box:focus-within {
  border-color: var(--crm-crimson);
  background: rgba(255, 255, 255, 0.09);
}
.crm-page-home .hero-search-box .search-icon {
  width: 15px;
  height: 15px;
  stroke: #9da0a8;
  margin-right: 10px;
  flex-shrink: 0;
}
.crm-page-home .hero-search-box input {
  flex: 1;
  background: transparent;
  border: 0;
  color: #ffffff;
  font-size: 13px;
  outline: none;
  padding: 0;
}
.crm-page-home .hero-search-box input::placeholder {
  color: #7b8089;
}
.crm-page-home .hero-search-box button {
  background: var(--crm-crimson);
  border: 0;
  color: #ffffff;
  font-size: 12px;
  font-weight: 500;
  padding: 0 16px;
  height: 32px;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.18s ease;
}
.crm-page-home .hero-search-box button:hover {
  background: var(--crm-crimson-dark);
}
.crm-page-home .hero-search-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 11px;
}
.crm-page-home .search-popular-tags {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #8c9099;
}
.crm-page-home .search-popular-tags a {
  color: #c4c7d0;
  text-decoration: none;
}
.crm-page-home .search-popular-tags a:hover {
  color: #ffffff;
  text-decoration: underline;
}
.crm-page-home .atlas-catalog-pill {
  color: #ff4d33 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 0.18s ease;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.crm-page-home .atlas-catalog-pill:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

/* Chapter 02: High-Contrast Platinum Constants with Crimson Count Accent */
.crm-page-home #element-atlas .table-caption > span {
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: #9da1ab !important;
}
.crm-page-home #element-atlas .table-caption .caption-element {
  color: #f5f5f2 !important;
  font-weight: 500 !important;
  letter-spacing: -0.03em;
}
.crm-page-home #element-atlas .table-caption .caption-element small {
  color: #a6aab4 !important;
  font-weight: 400 !important;
}
.crm-page-home #element-atlas .periodic-properties dt {
  font-size: 9.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.09em !important;
  color: #9498a3 !important;
}
.crm-page-home #element-atlas .periodic-properties dd {
  color: #f5f5f2 !important;
  font-size: clamp(15px, 1.25vw, 19px) !important;
  font-weight: 500 !important;
  letter-spacing: -0.02em;
}
.crm-page-home #element-atlas .periodic-properties dd small {
  color: #9da1ab !important;
  font-size: 11px !important;
  font-weight: 400;
}
.crm-page-home #element-atlas .periodic-properties dd[data-property="count"] {
  color: #f0482b !important;
}
.crm-page-home #element-atlas .periodic-properties dd[data-property="count"] small {
  color: #e28271 !important;
}
.crm-page-home #element-atlas .element-inspector .inspector-symbol {
  font-family: var(--font-display) !important;
  font-weight: 500;
  color: #f5f5f2 !important;
}

/* Chapter 03: Distinctive Crimson Accents on 4x2 Cards & Clean Hover Response */
.crm-page-home #material-collections .collection-meta .meta-idx {
  color: var(--crm-crimson) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em;
}
.crm-page-home #material-collections .collection-meta .meta-count {
  color: #7d827b !important;
  font-size: 11px !important;
  letter-spacing: 0.02em;
}
.crm-page-home #material-collections .collection-card h3 b {
  font-family: var(--font-display) !important;
  font-size: clamp(17.5px, 1.3vw, 20.5px) !important;
  font-weight: 500 !important;
  letter-spacing: -0.022em !important;
  color: #16181a !important;
}
.crm-page-home #material-collections .collection-card h3 > span {
  color: var(--crm-crimson) !important;
  font-size: 15px !important;
  transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}
.crm-page-home #material-collections .collection-card p {
  font-size: 12.5px !important;
  line-height: 1.58 !important;
  color: #666b64 !important;
}
.crm-page-home #material-collections .collection-card {
  border-top: 2px solid transparent !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}
.crm-page-home #material-collections .collection-card:hover {
  border-top-color: var(--crm-crimson) !important;
  box-shadow: 0 8px 24px rgba(167, 32, 1, 0.08) !important;
  transform: translateY(-2px);
}
.crm-page-home #material-collections .collection-card:hover h3 > span {
  transform: translate(3px, -3px);
}
.crm-page-home #material-collections .collection-card.collection-custom {
  border-left: 2px solid var(--crm-crimson) !important;
}
.crm-page-home #material-collections .home-family-links > span {
  font-size: 10.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: #6e736c !important;
}

/* Chapter 04: Grand Editorial Split & Immersive Wafer Stage */
.crm-page-home #chamber-engineering.home-editorial {
  background: #111315 !important;
  color: #f7f7f5;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: stretch !important;
}

.crm-page-home #chamber-engineering .home-editorial-stage {
  flex: 1 1 auto !important;
  display: flex !important;
  min-height: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}

.crm-page-home #chamber-engineering .editorial-grand-panel {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  background: #111315 !important;
}

.crm-page-home #chamber-engineering .editorial-copy-col {
  padding: clamp(24px, 4vh, 48px) max(48px, calc(100% - 640px)) clamp(24px, 4vh, 48px) clamp(36px, 4.5vw, 68px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
}

.crm-page-home #chamber-engineering .editorial-copy-col .eyebrow {
  margin-bottom: clamp(6px, 1.2vh, 12px) !important;
  color: #9da1aa !important;
}

.crm-page-home #chamber-engineering #editorial-title {
  font-family: var(--font-display) !important;
  font-size: clamp(20px, 1.95vw, 29px) !important;
  font-weight: 500 !important;
  line-height: 1.18 !important;
  letter-spacing: -0.03em !important;
  color: #f4f5f7 !important;
  margin: 0 0 clamp(8px, 1.4vh, 14px) 0 !important;
  max-width: 580px !important;
}

.crm-page-home #chamber-engineering .editorial-lead {
  font-size: clamp(12px, 0.9vw, 13.5px) !important;
  line-height: 1.62 !important;
  color: #9ea2aa !important;
  margin: 0 0 clamp(14px, 2vh, 22px) 0 !important;
  max-width: 50ch !important;
}

.crm-page-home #chamber-engineering .editorial-rfq-flow {
  display: flex !important;
  flex-direction: column !important;
  gap: clamp(8px, 1.2vh, 13px) !important;
  margin-bottom: clamp(16px, 2.2vh, 26px) !important;
  width: 100% !important;
  max-width: 500px !important;
}

.crm-page-home #chamber-engineering .rfq-flow-item {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: clamp(8px, 1.2vh, 12px) 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.crm-page-home #chamber-engineering .flow-num {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--crm-crimson) !important;
  font-variant-numeric: tabular-nums !important;
  flex-shrink: 0 !important;
}

.crm-page-home #chamber-engineering .flow-title {
  font-size: clamp(13px, 1.05vw, 15px) !important;
  font-weight: 500 !important;
  color: #f2f4f7 !important;
  letter-spacing: -0.01em !important;
}

.crm-page-home #chamber-engineering .editorial-actions {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-top: 2px !important;
}

.crm-page-home #chamber-engineering .crm-inquire-btn-primary {
  background: var(--crm-crimson) !important;
  border: 1px solid var(--crm-crimson) !important;
  color: #ffffff !important;
  padding: 10px 22px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
  white-space: nowrap !important;
}

.crm-page-home #chamber-engineering .crm-inquire-btn-primary:hover {
  background: var(--crm-crimson-dark) !important;
  border-color: var(--crm-crimson-dark) !important;
  color: #ffffff !important;
}

.crm-page-home #chamber-engineering .crm-editorial-secondary-link {
  color: #c4c7d0 !important;
  font-size: 12px !important;
  text-decoration: none !important;
  transition: color 0.18s ease !important;
}

.crm-page-home #chamber-engineering .crm-editorial-secondary-link:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

.crm-page-home #chamber-engineering .editorial-grand-visual {
  position: relative !important;
  margin: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #090a0b !important;
  border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.crm-page-home #chamber-engineering .editorial-grand-visual img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.crm-page-home #chamber-engineering .editorial-grand-visual figcaption {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  display: flex !important;
  justify-content: space-between !important;
  padding: 10px 24px 10px max(24px, calc(100% - 640px)) !important;
  background: linear-gradient(180deg, transparent 0%, rgba(9, 10, 11, 0.9) 100%) !important;
  font-size: 11px !important;
  color: #9fa3ac !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.crm-page-home #chamber-engineering footer {
  background: #131516 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.09) !important;
  padding: clamp(12px, 1.8vh, 20px) 0 clamp(8px, 1.2vh, 14px) !important;
}
.crm-page-home #chamber-engineering .footer-grid {
  display: grid !important;
  grid-template-columns: 1.4fr 1fr 1fr 1.15fr !important;
  gap: 36px !important;
  align-items: start !important;
  margin-bottom: clamp(8px, 1.2vh, 14px) !important;
}
.crm-page-home #chamber-engineering .footer-grid .footer-brand {
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  color: #f5f5f2 !important;
  margin-bottom: 6px !important;
  display: block !important;
}
.crm-page-home #chamber-engineering .footer-grid p {
  font-size: 11px !important;
  line-height: 1.55 !important;
  color: #8c9094 !important;
  max-width: 32ch !important;
}
.crm-page-home #chamber-engineering .footer-grid h3 {
  font-size: 10.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: #a8abb2 !important;
  margin-bottom: 8px !important;
}
.crm-page-home #chamber-engineering .footer-grid a {
  font-size: 11.5px !important;
  line-height: 1.6 !important;
  color: #c2c5cb !important;
}
.crm-page-home #chamber-engineering .footer-grid a:hover {
  color: #ffffff !important;
}
.crm-page-home #chamber-engineering .footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  padding-top: 10px !important;
  font-size: 10.5px !important;
  color: #72767d !important;
}

/* Global Header & Cart & Inquire Actions (Frameless Aesthetics) */
.crm-page .crm-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}
.crm-page .crm-header-search {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  height: 34px !important;
  padding: 0 4px !important;
  border-radius: 0 !important;
  transition: border-color 0.18s ease !important;
}
.crm-page .crm-header-search:focus-within {
  border-bottom-color: var(--crm-crimson) !important;
  box-shadow: none !important;
}
.crm-page .crm-header-search svg {
  color: #63676e !important;
  margin-right: 8px !important;
  flex-shrink: 0 !important;
}
.crm-page .crm-header-search input {
  border: none !important;
  background: transparent !important;
  font-size: 13px !important;
  color: #1a1d20 !important;
  outline: none !important;
  width: 130px !important;
  transition: width 0.2s ease !important;
}
.crm-page .crm-header-search input:focus {
  width: 175px !important;
}
.crm-page .crm-header-search input::placeholder {
  color: #8c9098 !important;
}
.crm-page .header-search-dropdown {
  position: absolute !important;
  top: calc(100% + 4px) !important;
  left: 0 !important;
  right: 0 !important;
  min-width: 280px !important;
  background: #ffffff !important;
  border: 1px solid #d5d8dc !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  z-index: 1000 !important;
  max-height: 320px !important;
  overflow-y: auto !important;
}
.crm-page .crm-header-cart {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: none !important;
  background: transparent !important;
  padding: 6px 4px !important;
  height: 36px !important;
  color: #33363a !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
}
.crm-page .crm-header-cart:hover {
  color: var(--crm-crimson) !important;
  background: transparent !important;
}
.crm-page .crm-header-cart svg {
  color: #3b3f45 !important;
  transition: color 0.15s ease !important;
}
.crm-page .crm-header-cart:hover svg {
  color: var(--crm-crimson) !important;
}
.crm-page .crm-header-cart .cart-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 16px !important;
  height: 16px !important;
  padding: 0 4px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  background: var(--crm-crimson) !important;
  border-radius: 8px !important;
  line-height: 1 !important;
  margin-left: 4px !important;
}
.crm-page .crm-inquire-btn {
  background: var(--crm-crimson) !important;
  border: 1px solid var(--crm-crimson) !important;
  color: #ffffff !important;
  height: 36px !important;
  padding: 0 16px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 0 !important;
  gap: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
  white-space: nowrap !important;
}
.crm-page .crm-inquire-btn:hover {
  background: var(--crm-crimson-dark) !important;
  border-color: var(--crm-crimson-dark) !important;
  color: #ffffff !important;
}

/* Compact Catalog Sidebar Selects */
.facet-group-label {
  display: block !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #55595d !important;
  font-weight: 600 !important;
  margin-bottom: 6px !important;
}
.crm-sidebar-select {
  width: 100% !important;
  height: 36px !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  color: #1a1d20 !important;
  background: #ffffff !important;
  border: 1px solid #d5d8dc !important;
  border-radius: 2px !important;
  outline: none !important;
  cursor: pointer !important;
  transition: border-color 0.18s ease !important;
}
.crm-sidebar-select:focus {
  border-color: var(--crm-crimson) !important;
  box-shadow: 0 0 0 1px var(--crm-crimson) !important;
}

/* ==========================================================================
   MAT-World Professional Materials Directory UI
   ========================================================================== */
.crm-mat-catalog-page {
  padding: clamp(24px, 3.6vh, 44px) 0 64px !important;
  width: min(1280px, calc(100% - 64px)) !important;
  margin: 0 auto !important;
}

/* Top MAT-World Search Console */
.crm-mat-search-console {
  margin-bottom: clamp(24px, 3vh, 36px) !important;
}
.crm-mat-search-row {
  display: flex !important;
  gap: 12px !important;
  align-items: stretch !important;
  width: 100% !important;
}
.crm-mat-search-row input {
  flex: 1 !important;
  height: 48px !important;
  border: 1px solid #d8dbe0 !important;
  border-radius: 4px !important;
  padding: 0 18px !important;
  font-size: 14.5px !important;
  color: #1a1d20 !important;
  background: #ffffff !important;
  outline: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}
.crm-mat-search-row input:focus {
  border-color: var(--crm-crimson) !important;
  box-shadow: 0 0 0 1px var(--crm-crimson) !important;
}
.crm-mat-search-row input::placeholder {
  color: #8c9098 !important;
}
.crm-mat-search-btn {
  height: 48px !important;
  background: var(--crm-crimson) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 0 34px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: background-color 0.18s ease !important;
}
.crm-mat-search-btn:hover {
  background: var(--crm-crimson-dark) !important;
}
.crm-mat-search-hint {
  font-size: 13px !important;
  color: #6e737b !important;
  margin: 10px 0 0 !important;
  line-height: 1.5 !important;
}

/* Main MAT-World 2-Column Workspace */
.crm-mat-layout {
  display: grid !important;
  grid-template-columns: 260px minmax(0, 1fr) !important;
  gap: 36px !important;
  align-items: start !important;
  transition: opacity 0.15s ease !important;
}
@media (max-width: 900px) {
  .crm-mat-layout {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
}

/* MAT-World Left Sidebar */
.crm-mat-sidebar {
  background: transparent !important;
}
.crm-mat-sidebar-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid #e1e4e8 !important;
  margin-bottom: 18px !important;
}
.crm-mat-sidebar-head h3 {
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1a1d20 !important;
}
.crm-mat-reset-link {
  font-size: 12.5px !important;
  color: #71767d !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}
.crm-mat-reset-link:hover {
  color: var(--crm-crimson) !important;
  text-decoration: underline !important;
}
.crm-mat-sidebar .facet-group {
  margin-bottom: 18px !important;
  padding: 0 !important;
  border: none !important;
}
.crm-mat-sidebar .facet-group-label {
  display: block !important;
  font-size: 12px !important;
  color: #63676e !important;
  font-weight: 500 !important;
  margin-bottom: 6px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.crm-mat-sidebar .crm-sidebar-select {
  width: 100% !important;
  height: 38px !important;
  border: 1px solid #d5d8dc !important;
  border-radius: 4px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  color: #1a1d20 !important;
  background: #ffffff !important;
  outline: none !important;
  cursor: pointer !important;
  transition: border-color 0.18s ease !important;
}
.crm-mat-sidebar .crm-sidebar-select:focus {
  border-color: var(--crm-crimson) !important;
  box-shadow: 0 0 0 1px var(--crm-crimson) !important;
}

/* Active Elements & Co-occurrence Box (from MAT-World) */
.crm-active-elements-card {
  background: #ffffff !important;
  border: 1px solid #e2e5e9 !important;
  border-radius: 4px !important;
  padding: 12px !important;
  margin: 14px 0 20px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}
.active-el-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #24272a !important;
  margin-bottom: 8px !important;
}
.clear-el-link {
  font-size: 11.5px !important;
  font-weight: 400 !important;
  color: #7b8089 !important;
  text-decoration: none !important;
}
.clear-el-link:hover {
  color: var(--crm-crimson) !important;
  text-decoration: underline !important;
}
.active-el-tags-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 10px !important;
}
.crm-active-el-tag {
  background: var(--crm-crimson) !important;
  color: #ffffff !important;
  padding: 3px 8px !important;
  border-radius: 3px !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: 1.2 !important;
}
.crm-active-el-tag a {
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  opacity: 0.85 !important;
  line-height: 1 !important;
}
.crm-active-el-tag a:hover {
  opacity: 1 !important;
}
.co-el-menu-group {
  margin-top: 10px !important;
  margin-bottom: 8px !important;
}
.co-el-menu-group label {
  font-size: 11px !important;
  color: #63676e !important;
  margin-bottom: 4px !important;
  display: block !important;
}
.co-el-menu-group select {
  height: 34px !important;
  font-size: 12px !important;
}
.co-el-chips-cloud {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 8px !important;
}
.crm-co-chip {
  border: 1px solid #e0e3e7 !important;
  background: #ffffff !important;
  color: #4a4e54 !important;
  padding: 3px 8px !important;
  font-size: 11px !important;
  border-radius: 3px !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}
.crm-co-chip:hover {
  border-color: var(--crm-crimson) !important;
  color: var(--crm-crimson) !important;
  background: #fff7f5 !important;
}
.crm-mat-sidebar-footer {
  margin-top: 24px !important;
  padding-top: 14px !important;
  border-top: 1px solid #e8eaed !important;
  font-size: 11.5px !important;
  color: #7b8089 !important;
}
.crm-mat-sidebar-footer p {
  margin: 0 0 6px !important;
  line-height: 1.45 !important;
}
.crm-mat-sidebar-footer a {
  color: var(--crm-crimson) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
.crm-mat-sidebar-footer a:hover {
  text-decoration: underline !important;
}

/* MAT-World Right Results Column */
.crm-mat-results-col {
  min-width: 0 !important;
}
.crm-mat-toolbar {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid #e2e5e9 !important;
  margin-bottom: 16px !important;
}
.crm-mat-toolbar #result-count {
  font-size: 13.5px !important;
  color: #63676e !important;
  font-variant-numeric: tabular-nums !important;
}
.crm-mat-toolbar #result-count strong {
  color: #1a1d20 !important;
  font-weight: 600 !important;
}
.crm-mat-toolbar-right {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}
.crm-mat-toolbar .crm-view-toggle {
  display: inline-flex !important;
  background: #f0f2f4 !important;
  border-radius: 4px !important;
  padding: 2px !important;
  gap: 2px !important;
}
.crm-mat-toolbar .view-mode-btn {
  border: none !important;
  background: transparent !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  color: #63676e !important;
  border-radius: 3px !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}
.crm-mat-toolbar .view-mode-btn.is-active {
  background: #ffffff !important;
  color: #1a1d20 !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
}

/* Active Filter Chips */
#active-filters {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 14px !important;
}
.filter-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: #f1f3f5 !important;
  color: #33363b !important;
  font-size: 12px !important;
  padding: 4px 10px !important;
  border-radius: 3px !important;
  border: 1px solid #e1e4e8 !important;
}
.filter-chip a {
  color: #888c94 !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
.filter-chip a:hover {
  color: #111417 !important;
}
.filter-clear-all {
  font-size: 12px !important;
  color: var(--crm-crimson) !important;
  text-decoration: none !important;
  align-self: center !important;
  margin-left: 4px !important;
}
.filter-clear-all:hover {
  text-decoration: underline !important;
}

/* MAT-World Product Row Cards */
.crm-mat-card {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #ffffff !important;
  border: 1px solid #e5e8ec !important;
  border-radius: 6px !important;
  padding: 14px 20px !important;
  margin-bottom: 10px !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}
.crm-mat-card:hover {
  border-color: #ccd2d8 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
}
.crm-mat-card-main {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  min-width: 0 !important;
}
.crm-mat-thumb {
  width: 58px !important;
  height: 58px !important;
  border-radius: 6px !important;
  border: 1px solid #eaedf1 !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}
.crm-mat-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 0 !important;
  display: block !important;
  background: #ffffff !important;
}
.mat-thumb-badge {
  display: none !important;
}
.detail-visual.has-photo {
  background: #ffffff !important;
  border: 1px solid #eaedf1 !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03) !important;
}
.detail-visual.has-photo img {
  mix-blend-mode: normal !important;
}
.crm-mat-info {
  min-width: 0 !important;
}
.crm-mat-title {
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}
.crm-mat-title a {
  color: #1a1d20 !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}
.crm-mat-title a:hover {
  color: var(--crm-crimson) !important;
  text-decoration: underline !important;
}
.crm-mat-meta {
  margin-top: 4px !important;
  font-size: 12px !important;
  color: #71767d !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}
.crm-mat-meta .sep {
  color: #bcc0c6 !important;
}
.crm-mat-meta .formula {
  color: #4a4e54 !important;
  font-weight: 500 !important;
}
.crm-mat-meta .sku-tag {
  color: #9297a0 !important;
  font-size: 11px !important;
}
.crm-mat-actions {
  flex-shrink: 0 !important;
  margin-left: 20px !important;
}
.crm-mat-inquire-btn {
  border: none !important;
  background: transparent !important;
  color: #24272c !important;
  padding: 6px 0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-radius: 0 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  transition: all 0.18s ease !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}
.crm-mat-inquire-btn:hover {
  border: none !important;
  color: var(--crm-crimson) !important;
  background: transparent !important;
  text-decoration: underline !important;
}
.crm-mat-inquire-btn.is-added {
  border: none !important;
  background: transparent !important;
  color: var(--crm-crimson) !important;
  font-weight: 600 !important;
}

/* Grid View Mode */
#product-results.is-grid-view {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 14px !important;
}
#product-results.is-grid-view .crm-mat-card {
  flex-direction: column !important;
  align-items: stretch !important;
  text-align: left !important;
  padding: 16px !important;
  margin-bottom: 0 !important;
}
#product-results.is-grid-view .crm-mat-card-main {
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
}
#product-results.is-grid-view .crm-mat-thumb {
  width: 100% !important;
  height: 140px !important;
}
#product-results.is-grid-view .crm-mat-actions {
  margin-left: 0 !important;
  margin-top: 14px !important;
  width: 100% !important;
}
#product-results.is-grid-view .crm-mat-inquire-btn {
  width: 100% !important;
  justify-content: center !important;
}

/* Footer Social & Channel Icons (Clean spacious layout in Column 1) */
.footer-social-links {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px 18px !important;
  margin-top: 18px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.footer-social-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #9da1aa !important;
  font-size: 11.5px !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
}
.footer-social-btn:hover {
  color: #ffffff !important;
  text-decoration: none !important;
}
.footer-social-btn svg {
  flex-shrink: 0 !important;
  color: inherit !important;
  opacity: 0.85;
  transition: all 0.18s ease !important;
}
.footer-social-btn:hover svg {
  opacity: 1 !important;
  color: #ffffff !important;
}
.footer-social-btn.is-wechat {
  cursor: default !important;
}
.footer-social-btn.is-wechat:hover svg {
  color: #2dc100 !important;
}
.footer-social-btn[title*="LinkedIn"]:hover svg {
  color: #0a66c2 !important;
}
.footer-social-btn[title*="YouTube"]:hover svg {
  color: #ff0000 !important;
}
.footer-social-btn[title*="Skype"]:hover svg {
  color: #00aff0 !important;
}

/* Global navigation and footer identity */
.crm-page .crm-footer-logo{display:block;width:150px;max-width:100%;height:auto;margin:0 0 22px}.crm-page .footer-brand{display:inline-block}.crm-global-supply>p{max-width:850px;line-height:1.75;color:#626770}.crm-supply-points{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:34px}.crm-supply-points div{border-top:2px solid #a72001;padding-top:16px}.crm-supply-points strong,.crm-supply-points span{display:block}.crm-supply-points span{margin-top:8px;color:#626770;font-size:13px}@media(min-width:1101px){.crm-page .crm-nav{gap:14px}.crm-page .crm-header-inner.wrap-wide{grid-template-columns:145px minmax(0,1fr) auto;gap:14px}.crm-page .crm-header-actions{gap:10px}.crm-page .crm-header-search{width:120px}}@media(max-width:760px){.crm-supply-points{grid-template-columns:1fr}}

.crm-page .crm-footer-company-name{color:#fff;font-size:15px;font-weight:600;line-height:1.4;margin:0 0 14px}.crm-page .crm-footer-logo{margin-bottom:14px}

/* Readable typography on company and contact pages */
.crm-page .native-heading .eyebrow,.crm-page .native-about .eyebrow,.crm-page .native-process .eyebrow,.crm-page .equipment-intro .eyebrow,.crm-page .crm-history .eyebrow,.crm-page .crm-analysis .eyebrow,.crm-page .contact-editorial .eyebrow{font-size:12px;line-height:1.5;letter-spacing:.06em}
.crm-page .contact-editorial>div>.eyebrow{display:block;margin-bottom:12px}.crm-page .contact-email{display:block;font-size:clamp(22px,2.4vw,30px);line-height:1.25;overflow-wrap:anywhere;margin:0 0 24px}.crm-page .contact-editorial p{font-size:16px;line-height:1.7;color:#535c67}.crm-page .contact-editorial dt{font-size:14px;line-height:1.5}.crm-page .contact-editorial dd{font-size:15px;line-height:1.65}.crm-page .contact-detail-note{display:inline-block;font-size:14px;line-height:1.6;color:#596372;margin-top:4px}.crm-page .contact-editorial dl>div{gap:18px}.crm-page .native-about p,.crm-page .native-application p,.crm-page .native-process p,.crm-page .crm-history p,.crm-page .crm-analysis p,.crm-page .crm-analysis li{font-size:16px;line-height:1.7}.crm-page .native-about figcaption,.crm-page .native-application figcaption,.crm-page .crm-history figcaption,.crm-page .crm-analysis figcaption{font-size:13px;line-height:1.5;color:#626a70}.crm-page .equipment-list figcaption span{font-size:12px}.crm-page .crm-supply-points span{font-size:14px;line-height:1.5}@media(max-width:600px){.crm-page .contact-editorial dl>div{grid-template-columns:1fr;gap:6px}.crm-page .contact-email{font-size:clamp(21px,6vw,28px)}.crm-page .contact-editorial p{font-size:16px}}

/* Homepage: restrained image depth and tighter chapter rhythm */
@media(min-width:801px){
.crm-page-home .crm-opening .intro-copy{position:relative;isolation:isolate;background:#eee !important;overflow:hidden}
.crm-page-home .crm-opening .intro-copy::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(246,246,243,.90),rgba(246,246,243,.90)),url('../img/banners/en/product_on_table.png');background-size:cover;background-position:center;transition:background-image .35s ease}
.crm-page-home .crm-opening:has(.opening-slide[data-slide="4"].is-active) .intro-copy::before{background-image:linear-gradient(rgba(246,246,243,.91),rgba(246,246,243,.91)),url('../img/banners/en/pvd_sputtering_plasma.jpg')}
.crm-page-home .crm-opening:has(.opening-slide[data-slide="3"].is-active) .intro-copy::before{background-image:linear-gradient(rgba(246,246,243,.90),rgba(246,246,243,.90)),url('../img/banners/en/refractory_targets_macro.jpg')}
.crm-page-home .crm-opening:has(.opening-slide[data-slide="5"].is-active) .intro-copy::before{background-image:linear-gradient(rgba(246,246,243,.93),rgba(246,246,243,.93)),url('../img/banners/en/semiconductor_thin_film.jpg')}
.crm-page-home .crm-opening:has(.opening-slide[data-slide="6"].is-active) .intro-copy::before{background-image:linear-gradient(rgba(246,246,243,.91),rgba(246,246,243,.91)),url('../img/banners/en/silicon_wafer_gray.png')}
.crm-page-home #element-atlas .periodic-panel{justify-content:flex-start!important;padding-top:20px!important}
.crm-page-home #element-atlas .science-stage-footer{margin-top:auto}
.crm-page-home .collections-stage-inner{justify-content:flex-start!important;padding-top:clamp(55px,7vh,90px)!important;padding-bottom:clamp(25px,3vh,40px)!important}
.crm-page-home #material-collections .text-collections{margin:clamp(28px,3.5vh,42px) 0 0!important}
.crm-page-home #material-collections .home-family-links{margin-top:auto}
.crm-page-home #chamber-engineering .editorial-copy-col{background:linear-gradient(rgba(10,15,22,.86),rgba(10,15,22,.86)),url('../img/banners/en/silicon_wafer_gray.png') center/cover no-repeat!important}
}

@media(min-width:801px){
.crm-page-home .crm-opening .intro-copy::before{inset:-12px;filter:blur(8px)}
.crm-page-home #chamber-engineering .editorial-copy-col{position:relative;isolation:isolate;overflow:hidden;background:#11151b!important}
.crm-page-home #chamber-engineering .editorial-copy-col::before{content:"";position:absolute;inset:-12px;z-index:-1;filter:blur(8px);background:linear-gradient(rgba(10,15,22,.86),rgba(10,15,22,.86)),url('../img/banners/en/silicon_wafer_gray.png') center/cover no-repeat}
}

/* One continuous image beneath each translucent text panel */
@media(min-width:801px){
.crm-page-home .crm-opening-panel.crm-intro{position:relative;display:grid;grid-template-columns:1fr 1fr}
.crm-page-home .crm-opening .opening-gallery{grid-column:1 / -1;grid-row:1;z-index:0}
.crm-page-home .crm-opening .intro-copy{grid-column:1;grid-row:1;z-index:2;background:rgba(246,246,243,.82)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.crm-page-home .crm-opening .intro-copy::before{display:none}
.crm-page-home .opening-controls,.crm-page-home .opening-slide figcaption{left:50%!important;width:50%!important;box-sizing:border-box}
.crm-page-home #chamber-engineering .editorial-grand-panel{position:relative}
.crm-page-home #chamber-engineering .editorial-grand-visual{grid-column:1 / -1;grid-row:1;border-right:0!important}
.crm-page-home #chamber-engineering .editorial-copy-col{grid-column:2;grid-row:1;z-index:2;background:rgba(10,15,22,.78)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.crm-page-home #chamber-engineering .editorial-copy-col::before{display:none}
.crm-page-home #chamber-engineering .editorial-grand-visual figcaption{right:50%!important}
}

/* Refined hero overlays and collection emphasis */
@media(min-width:801px){
.crm-page-home .crm-opening-panel.crm-intro{grid-template-columns:43.5% 56.5%}
.crm-page-home .crm-opening .intro-copy{background:rgba(248,248,246,.94)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding-right:clamp(24px,3vw,48px)!important}
.crm-page-home .opening-controls{left:calc(43.5% + 24px)!important;right:24px!important;width:auto!important;gap:12px!important}
.crm-page-home .opening-slide figcaption{left:43.5%!important;right:0!important;width:56.5%!important}
.crm-page-home #chamber-engineering .editorial-copy-col{background:rgba(10,15,22,.90)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.crm-page-home #chamber-engineering .editorial-grand-visual figcaption{left:0!important;right:50%!important;width:auto!important;padding:10px 24px!important;box-sizing:border-box;gap:12px}
.crm-page-home #material-collections .collection-card,.crm-page-home #material-collections .collection-card:nth-child(n){min-height:clamp(190px,25vh,260px);padding:clamp(22px,2.6vh,30px)}
.crm-page-home #material-collections .collection-card h3 b{font-size:clamp(20px,1.65vw,24px)!important}
.crm-page-home #material-collections .collection-card p{font-size:14px!important;line-height:1.5}
}
.crm-page-home #material-collections .home-family-links>span,.crm-page-home #material-collections .home-family-items a{color:var(--crm-crimson)!important}
.crm-page-home #material-collections .home-family-items a:hover{text-decoration:underline}
@media(min-width:801px){.crm-page-home .opening-controls{background:rgba(0,0,0,.48);padding:8px 10px;align-items:center}.crm-page-home .opening-tabs button,.crm-page-home .opening-pause{color:#fff!important}}

/* Search expansion and analytical content */
.crm-page .crm-search-shell{position:relative;flex:0 0 120px;height:34px;z-index:20}.crm-page .crm-search-shell .crm-header-search{position:absolute!important;right:0;top:0;width:120px!important;box-sizing:border-box;transition:width .25s ease,border-color .2s ease,background-color .2s ease!important}.crm-page .crm-search-shell:hover .crm-header-search,.crm-page .crm-search-shell:focus-within .crm-header-search{width:300px!important;background:#f9f9f7!important;border-bottom-color:var(--crm-crimson)!important}.crm-page .crm-search-shell .crm-header-search input,.crm-page .crm-search-shell .crm-header-search input:focus{min-width:0;width:100%!important;flex:1}.crm-page-home #element-atlas .periodic-properties dd[data-property="count"],.crm-page-home #element-atlas .periodic-properties dd[data-property="count"] small{color:#f3f3f0!important}.crm-page .crm-analysis-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.crm-page .crm-analysis-grid article{min-width:0}.crm-page .crm-analysis-grid figure{margin:0 0 20px}.crm-page .crm-analysis-grid img{aspect-ratio:16/9}.crm-page #analysis-testing{scroll-margin-top:100px}@media(max-width:760px){.crm-page .crm-analysis-grid{grid-template-columns:1fr}.crm-page .crm-search-shell{flex-basis:90px}.crm-page .crm-search-shell .crm-header-search{width:90px!important}.crm-page .crm-search-shell:hover .crm-header-search,.crm-page .crm-search-shell:focus-within .crm-header-search{width:min(270px,60vw)!important}}@media(prefers-reduced-motion:reduce){.crm-page .crm-search-shell .crm-header-search{transition:none!important}}

/* Homepage refinements */
@media(min-width:1101px){.crm-page .crm-nav{justify-content:flex-start!important;gap:12px!important}.crm-page .crm-header-inner.wrap-wide{grid-template-columns:135px minmax(0,1fr) auto!important;gap:10px!important}.crm-page .crm-search-shell:hover .crm-header-search,.crm-page .crm-search-shell:focus-within .crm-header-search{width:260px!important}.crm-page .crm-header-inner:has(.crm-search-shell:hover) .crm-nav,.crm-page .crm-header-inner:has(.crm-search-shell:focus-within) .crm-nav{transform:translateX(-48px)}.crm-page .crm-nav{transition:transform .25s ease}}
@media(min-width:801px){.crm-page-home .crm-opening .intro-copy{background:rgba(248,248,246,.89)!important}.crm-page-home .opening-slide figcaption{background:#080a0c!important}.crm-page-home .opening-controls{background:#080a0c!important}.crm-page-home #material-collections .collection-card,.crm-page-home #material-collections .collection-card:nth-child(n){min-height:clamp(210px,27vh,290px)}}
.crm-page-home #element-atlas .atlas-catalog-pill,.crm-page-home #element-atlas .atlas-catalog-pill:hover{color:var(--crm-crimson)!important}
@media(prefers-reduced-motion:reduce){.crm-page .crm-nav{transition:none}}
@media(min-width:1101px){.crm-page .crm-header-inner:has(.crm-search-shell:hover) .crm-nav,.crm-page .crm-header-inner:has(.crm-search-shell:focus-within) .crm-nav{transform:none}.crm-page .crm-search-shell:hover .crm-header-search,.crm-page .crm-search-shell:focus-within .crm-header-search{width:240px!important}}
@media(min-width:1101px){.crm-page .crm-header-inner.wrap-wide{grid-template-columns:150px minmax(0,1fr) auto!important;gap:12px!important}.crm-page .crm-nav{gap:10px!important}.crm-page .crm-brand-logo{width:126px;height:auto}}

/* Applications closing card and refined inquiry badge */
.crm-page .custom-application{display:flex;align-items:center;background:#f0f0ed;border:1px solid #deded9;min-height:100%;padding:clamp(28px,4vw,52px);box-sizing:border-box}.crm-page .custom-application-inner{max-width:420px}.crm-page .custom-application .eyebrow{display:block;font-size:12px;letter-spacing:.08em;color:var(--crm-crimson);margin-bottom:24px}.crm-page .custom-application h2{font-size:clamp(26px,2.5vw,34px);line-height:1.18;margin:0 0 20px}.crm-page .custom-application p{color:#555f68;font-size:16px;line-height:1.7}.crm-page-industries .native-cta{background:#f7f7f5;border-top:1px solid #e3e3df}.crm-page .crm-header-cart .cart-count{box-sizing:border-box!important;width:17px!important;min-width:17px!important;height:17px!important;padding:0!important;margin-left:5px!important;border-radius:50%!important;position:static!important;transform:none!important;line-height:17px!important;font-variant-numeric:tabular-nums}@media(max-width:600px){.crm-page .custom-application{min-height:260px}}

.crm-page-home #material-collections .home-family-links{margin-top:clamp(24px,3vh,36px)!important}

.crm-page .crm-export-note{background:#f3f2ef;border-left:3px solid var(--crm-crimson);padding:18px 20px;margin:16px 0 22px;color:#30343a;line-height:1.6}.crm-page .crm-export-note strong{display:block;font-size:15px;color:#202326}.crm-page .crm-export-note p{margin:7px 0 0;font-size:14px;line-height:1.6;color:#4e5660}.crm-page .crm-export-note a{color:var(--crm-crimson);text-decoration:underline;text-underline-offset:2px}

/* Restore a readable CRM red accent on the dark element inspector. */
.crm-page-home #element-atlas .table-caption .caption-element,
.crm-page-home #element-atlas .periodic-properties dd,
.crm-page-home #element-atlas .periodic-properties dd[data-property="count"] { color: #d83d20 !important; }
.crm-page-home #element-atlas .periodic-properties dd[data-property="count"] small { color: #9da1ab !important; }

/* Formula placeholders distinguish missing product photography from specimen images. */
.crm-formula-placeholder{display:flex;align-items:center;justify-content:center;width:100%;min-height:100%;box-sizing:border-box;padding:12px;background:#f0f1ee;color:#9f280f;text-align:center;font-size:clamp(28px,3vw,48px);font-weight:600;line-height:1.2;overflow-wrap:anywhere}
.crm-formula-placeholder sub{font-size:.58em;line-height:0;vertical-align:sub}
.crm-mat-thumb .crm-formula-placeholder{height:100%;padding:3px;font-size:clamp(9px,1vw,14px);line-height:1.1}
#product-results.is-grid-view .crm-mat-thumb .crm-formula-placeholder{font-size:clamp(18px,2vw,30px)}
.detail-visual .crm-formula-placeholder{min-height:240px;font-size:clamp(34px,4vw,60px)}


/* ==========================================================================
   390px MOBILE VIEWPORT ZERO-OVERFLOW GUARANTEE (ALL STOREFRONT PAGES)
   ========================================================================== */
html, body.crm-page {
  max-width: 100%;
  overflow-x: clip;
}
@media (max-width: 760px) {
  .crm-page .wrap,
  .crm-page .wrap-wide {
    width: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
  }
  .crm-page .crm-header-inner.wrap-wide {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
    gap: 8px !important;
  }
  .crm-page .crm-brand {
    flex-shrink: 0 !important;
    gap: 8px !important;
  }
  .crm-page .crm-brand-logo {
    width: 82px !important;
    height: 32px !important;
  }
  .crm-page .crm-header-actions {
    gap: 8px !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
  }
  .crm-page .crm-search-shell {
    flex: 0 0 74px !important;
    width: 74px !important;
  }
  .crm-page .crm-search-shell .crm-header-search {
    width: 74px !important;
    padding: 0 6px !important;
  }
  .crm-page .crm-search-shell:hover .crm-header-search,
  .crm-page .crm-search-shell:focus-within .crm-header-search {
    width: min(230px, 58vw) !important;
  }
  .crm-page .crm-header-cart {
    padding: 0 2px !important;
  }
  .crm-page .crm-inquire-btn {
    padding: 0 9px !important;
    height: 32px !important;
    font-size: 11px !important;
    gap: 4px !important;
  }
  .crm-page .mobile-menu {
    width: 30px !important;
    height: 30px !important;
    padding: 3px !important;
    flex-shrink: 0 !important;
  }
  /* Homepage Hero & Periodic Atlas Mobile Containment */
  .crm-page-home .opening-slide img {
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .crm-page .hero-search-console,
  .crm-page .hero-search-meta {
    max-width: 100% !important;
    flex-wrap: wrap !important;
    box-sizing: border-box !important;
  }
  .crm-page .atlas-hint-text {
    white-space: normal !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }
  /* Engineering Workbench & Data Tables Mobile Containment */
  .crm-toolbox-container,
  .crm-tool-card,
  .crm-tool-body,
  .crm-tool-form-col,
  .crm-tool-result-col,
  .crm-table-scroll {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .crm-tool-result-col {
    overflow-x: auto !important;
  }
  .crm-tool-card {
    padding: 18px 14px !important;
  }
  .crm-tool-table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}
@media (max-width: 760px) {
  .crm-page .footer-grid,
  .crm-page-home .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
}
@media (max-width: 760px) {
  .crm-page-home #chamber-engineering .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
}

/* Low-key historical archive hotspot over the "MATERIAL" lettering beneath the CRM logo */
.crm-brand-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-self: start;
  height: var(--header-h);
}
.crm-brand-legacy-link {
  position: absolute;
  left: 61.5%;
  width: 28.5%;
  top: calc(50% + 14px);
  height: 11px;
  z-index: 3;
  display: block;
  border-radius: 2px;
  border-bottom: 1px solid transparent;
  transition: border-color 0.18s ease, background-color 0.18s ease;
}
.crm-brand-legacy-link:hover {
  border-bottom-color: rgba(167, 32, 1, 0.45);
  background-color: rgba(167, 32, 1, 0.04);
}
.crm-brand-legacy-link:focus-visible {
  outline: 1px solid var(--crm-crimson, #a72001);
  outline-offset: 2px;
  background-color: rgba(167, 32, 1, 0.06);
}
.crm-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 640px) {
  .crm-brand-legacy-link {
    top: calc(50% + 10px);
    height: 9px;
  }
}

/* Additional homepage slides: keep the controls accessible at narrow widths. */
.crm-page-home .opening-tabs{min-width:0;overflow-x:auto;scrollbar-width:thin}
.crm-page-home .opening-tabs button{flex:0 0 auto;white-space:nowrap}
.crm-page-home .crm-opening:has(.opening-slide[data-slide="1"].is-active) .intro-copy::before{background-image:linear-gradient(rgba(246,246,243,.93),rgba(246,246,243,.93)),url('../img/banners/en/industrial-plates-hero.png')}
.crm-page-home .crm-opening:has(.opening-slide[data-slide="2"].is-active) .intro-copy::before{background-image:linear-gradient(rgba(246,246,243,.93),rgba(246,246,243,.93)),url('../img/banners/en/metal-crystal-hero.png')}

/* Fit product photographs within the visible image panel without hiding their subject behind the copy. */
@media(min-width:801px){
.crm-page-home .opening-slide[data-slide="3"],.crm-page-home .opening-slide[data-slide="1"],.crm-page-home .opening-slide[data-slide="2"]{background:#101214}
.crm-page-home .opening-slide[data-slide="3"]>img,.crm-page-home .opening-slide[data-slide="1"]>img,.crm-page-home .opening-slide[data-slide="2"]>img{position:absolute;left:43.5%;top:0;width:56.5%;height:100%;object-fit:contain;object-position:center}
}

.crm-page-home .opening-tabs{flex-wrap:nowrap!important;overflow-x:auto!important;max-width:100%;scrollbar-width:thin}
.crm-page-home .opening-pause{flex-shrink:0;white-space:nowrap}

/* Full-bleed wide artwork keeps the subject clear of the copy panel. */
@media(min-width:801px){.crm-page-home .opening-slide[data-slide="3"]>img,.crm-page-home .opening-slide[data-slide="1"]>img,.crm-page-home .opening-slide[data-slide="2"]>img{position:static;left:auto;top:auto;width:100%;height:100%;object-fit:cover;object-position:center}}

.crm-page-home .opening-tabs{scrollbar-width:none!important;-ms-overflow-style:none}.crm-page-home .opening-tabs::-webkit-scrollbar{display:none}

/* Let each image continue behind the carousel controls and caption. */
@media(min-width:801px){
.crm-page-home .opening-controls{background:transparent!important;text-shadow:0 1px 5px rgba(0,0,0,.9)}
.crm-page-home .opening-slide figcaption{background:linear-gradient(to bottom,transparent,rgba(0,0,0,.52))!important;text-shadow:0 1px 4px #000}
}

/* Keep all 18 columns visible on laptop-sized screens; let shorter screens scroll vertically. */
@media(min-width:900px){
.crm-page-home #element-atlas .periodic-grid,html.crm-flow-enabled .crm-page-home #element-atlas .periodic-grid{width:100%!important;min-width:0!important;grid-template-columns:repeat(18,minmax(0,1fr))!important;gap:4px!important}
.crm-page-home #element-atlas .periodic-scroll{width:100%;min-width:0;overflow-x:auto}
}
@media(min-width:900px) and (max-height:850px){
.crm-page-home #element-atlas.home-chapter,html.crm-flow-enabled .crm-page-home #element-atlas.home-chapter{height:auto!important;min-height:calc(100svh - var(--header-h))!important;max-height:none!important;overflow:visible!important}
}
@media(max-width:899px){
.crm-page-home #element-atlas .periodic-scroll{overflow-x:auto!important;max-width:100%;scrollbar-width:thin;scrollbar-color:#a72001 #24272c}
.crm-page-home #element-atlas .atlas-mobile-hint{display:block!important;color:#d5d5d5;font-size:12px;margin:8px 0}
}

/* Brand the equipment photographs without modifying the source files. */
.equipment-list .equipment-photo{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:#ddd}
.equipment-list .equipment-photo>img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
.equipment-list .equipment-brand{position:absolute;right:0;bottom:0;width:18%;height:12%;display:flex;align-items:center;justify-content:center;background:#f5f5f3;color:#a72001;font:bold clamp(9px,1.05vw,16px)/1 Arial,sans-serif;letter-spacing:-.03em;z-index:2}

.equipment-list img[src*="08_vacuum_distillation_furnace"]{object-position:right center}

/* Optional technical content and source documents on material details. */
.crm-description-more summary { color: #a72001; text-decoration: underline; cursor: pointer; margin-top: .75rem; }
.crm-description-more p, .detail-description p, .crm-technical-overview p { margin: 0 0 .75rem; }
.crm-description-heading { font-weight: 600; }
.crm-technical-overview { margin: 2rem 0; padding: 1.5rem 0; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; }

/* Product detail: technical content on the left, specifications and documents on the right. */
.crm-page .crm-detail-with-overview { align-items: start; grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr); gap: clamp(28px,4vw,56px); }
.crm-page .crm-detail-with-overview > .crm-technical-overview { min-width: 0; margin: 0; padding: 24px 0 0; border: 0; border-top: 1px solid #d6d8d5; background: transparent; }
.crm-detail-with-overview .crm-description-heading { margin-top: 1.4rem; }
.crm-detail-specs-docs { min-width: 0; display: grid; gap: 32px; }
.crm-detail-specs-docs > section { background: var(--pure-white); border-top: 1px solid #d6d8d5; padding: 24px; min-width: 0; }
@media (max-width: 800px) { .crm-page .crm-detail-with-overview { grid-template-columns: minmax(0,1fr); gap: 28px; } .crm-detail-specs-docs > section { padding: 20px 0; } }

/* Updated product detail: documents under the image; numbered sections in columns. */
.crm-page .detail-top { align-items:start; }
.crm-page .crm-detail-documents { grid-column:1; grid-row:2; min-width:0; border-top:1px solid #d6d8d5; padding-top:22px; }
.crm-page .detail-content { grid-column:2; grid-row:1 / span 2; }
.crm-page .crm-detail-updated { display:grid; grid-template-columns:minmax(0,1fr); gap:32px; }
.crm-page .crm-detail-updated > section { min-width:0; }
.crm-page .crm-technical-overview { margin:0; }
.crm-page .crm-overview-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 40px; }
.crm-page .crm-overview-item { min-width:0; }
@media (max-width:760px) {
 .crm-page .detail-content { grid-column:1; grid-row:2; }
 .crm-page .crm-detail-documents { grid-column:1; grid-row:3; }
 .crm-page .crm-overview-grid { grid-template-columns:minmax(0,1fr); }
}

.crm-page .crm-spec-tables { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:start; }
.crm-page .crm-spec-tables .data-table { width:100%; table-layout:fixed; }
.crm-page .crm-spec-tables td { overflow-wrap:anywhere; }
@media (max-width:760px) { .crm-page .crm-spec-tables { grid-template-columns:minmax(0,1fr); gap:0; } }