:root {
  --ink: #10201e;
  --ink-2: #18332f;
  --lime: #d4fa3e;
  --paper: #f1f0e8;
  --muted: #61706b;
  --line: #b9c1b8;
  --signal: #e7ff78;
  --shadow: 0 18px 55px rgba(16, 32, 30, .14);
  --display: "Arial Narrow", "Roboto Condensed", "Noto Sans SC", Arial, sans-serif;
  --body: "Helvetica Neue", "Noto Sans SC", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--body); font-size: 16px; line-height: 1.55; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }
.skip { position: fixed; top: -4rem; left: 1rem; z-index: 100; padding: .7rem 1rem; background: var(--lime); color: var(--ink); }
.skip:focus { top: 1rem; }
.site-header { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 84px; padding: 0 clamp(1rem, 4vw, 4.5rem); background: rgba(241,240,232,.94); border-bottom: 1px solid rgba(16,32,30,.18); backdrop-filter: blur(12px); }
.wordmark { display: inline-flex; align-items: center; gap: .65rem; min-width: 176px; }
.mark { display: grid; place-items: center; width: 42px; height: 42px; color: var(--ink); background: var(--lime); font: 800 16px/1 var(--display); letter-spacing: -.08em; transform: skew(-8deg); }
.wordmark b { display: block; font: 800 15px/1 var(--display); letter-spacing: .1em; }
.wordmark small { display: block; margin-top: .15rem; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .08em; }
.desktop-nav { display: flex; align-items: center; gap: clamp(.8rem, 2vw, 2rem); font-size: 13px; font-weight: 700; }
.desktop-nav a { padding: .35rem 0; border-bottom: 2px solid transparent; }
.desktop-nav a:hover, .desktop-nav a.active { border-color: var(--ink); }
.header-actions { display: flex; align-items: center; gap: .8rem; }
.language-link { font-size: 12px; font-weight: 800; letter-spacing: .06em; }
.button { display: inline-flex; justify-content: center; align-items: center; min-height: 47px; padding: .7rem 1.1rem; border: 1px solid var(--ink); background: var(--lime); color: var(--ink); font-size: 13px; font-weight: 800; letter-spacing: .02em; transition: transform .2s ease, background .2s ease; cursor: pointer; }
.button:hover { transform: translate(-3px,-3px); box-shadow: 4px 4px 0 var(--ink); }
.button-small { min-height: 37px; padding: .45rem .72rem; font-size: 11px; }
.button-ghost { background: transparent; }
.button-dark { background: var(--ink); color: var(--paper); }
.menu-toggle { display: none; padding: .45rem; border: 0; color: var(--ink); background: transparent; font-weight: 800; }
.mobile-menu { position: fixed; inset: 84px 0 auto 0; z-index: 19; padding: 1.2rem; background: var(--paper); border-bottom: 1px solid var(--ink); box-shadow: var(--shadow); }
.mobile-menu a { display: block; padding: .8rem 0; font-weight: 700; }.mobile-menu .button { display: inline-flex; margin-top: .8rem; padding: .7rem 1rem; }
main { overflow: hidden; }
.eyebrow { display: block; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1,h2,h3,p { margin-top: 0; }h1,h2,h3 { font-family: var(--display); line-height: .97; letter-spacing: -.035em; }
h1 { margin-bottom: 1.4rem; font-size: clamp(3rem, 7.1vw, 7.25rem); font-weight: 900; }h2 { font-size: clamp(2rem, 4.1vw, 4.4rem); font-weight: 900; }h3 { font-size: clamp(1.28rem, 2vw, 1.7rem); }
.lead { font-size: clamp(1.1rem, 1.5vw, 1.42rem); line-height: 1.5; }
.hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr); min-height: calc(100vh - 84px); }.hero-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(4rem, 9vw, 10rem) clamp(1.2rem, 7vw, 9rem) clamp(3rem, 6vw, 6rem); background: var(--paper); }.hero-copy .eyebrow { margin-bottom: 1.15rem; }.hero-copy h1 { max-width: 9.4em; }.hero-copy p { max-width: 44rem; }.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin: 1.15rem 0 2.4rem; }.hero-trust { display: flex; flex-wrap: wrap; gap: 1.2rem; color: var(--muted); font-size: 11px; font-weight: 700; }.hero-trust span { border-left: 2px solid var(--lime); padding-left: .55rem; }
.hero-visual { position: relative; min-height: 570px; padding: clamp(2rem, 6vw, 5rem); background: var(--ink); }.hero-visual::before { position: absolute; inset: 0; content:""; opacity: .13; background-image: linear-gradient(90deg, transparent 49%, var(--lime) 50%, transparent 51%), linear-gradient(0deg, transparent 49%, var(--lime) 50%, transparent 51%); background-size: 44px 44px; }.hero-photo-main { position: relative; z-index: 1; height: 78%; overflow: hidden; transform: rotate(2deg); box-shadow: 12px 12px 0 var(--lime); }.hero-photo-main img { width: 100%; height: 100%; object-fit: cover; }.hero-photo-note { position: absolute; z-index: 2; right: 4%; bottom: 7%; display: grid; grid-template-columns: 105px minmax(100px, 1fr); align-items: stretch; width: min(72%, 380px); background: var(--paper); box-shadow: var(--shadow); }.hero-photo-note img { width: 105px; height: 105px; object-fit: cover; }.hero-photo-note span { display: flex; align-items: center; padding: 1rem; font: 800 clamp(.8rem, 1.1vw, 1rem)/1.1 var(--display); letter-spacing: .025em; }
.section { padding: clamp(4rem, 9vw, 9rem) clamp(1.2rem, 7vw, 8rem); }.section-label { display: grid; grid-template-columns: 1fr auto 1fr; gap: .75rem; align-items: center; margin-bottom: clamp(2rem, 5vw, 5rem); color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .12em; }.section-label::after { grid-column: 1 / -1; height: 1px; content:""; background: var(--line); }.section-label span:nth-child(2) { color: var(--ink); }.section-label span:last-child { text-align: right; }.section-intro { display: grid; grid-template-columns: 1.25fr .7fr; gap: 4rem; align-items: start; max-width: 1100px; margin-bottom: 4rem; }.section-intro h2 { margin: 0; }.section-intro p { max-width: 35rem; margin: .6rem 0 0; color: var(--muted); }
.product-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.product-tile { display: grid; grid-template-columns: minmax(150px, .82fr) 1fr; min-height: 280px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.24); }.product-tile:nth-child(2n) { background: #e5e6dc; }.product-image { min-height: 100%; overflow: hidden; background: #d4d8d0; }.product-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }.product-tile:hover img { transform: scale(1.05); }.product-tile-copy { display: flex; flex-direction: column; align-items: flex-start; padding: clamp(1.1rem, 2vw, 2rem); }.tile-index { margin-bottom: auto; color: var(--muted); font: 700 12px var(--display); }.product-tile h3 { margin: 1.2rem 0 .55rem; }.product-tile p { margin: 0; color: #44524d; font-size: 13px; }.text-link { display: inline-flex; gap: .45rem; align-items: center; margin-top: 1.25rem; border-bottom: 1px solid var(--ink); font-size: 12px; font-weight: 800; }.text-link span { font-size: 15px; }
.process-section { padding: clamp(4rem, 9vw, 8rem) clamp(1.2rem, 7vw, 8rem); background: var(--ink); color: var(--paper); }.process-section .section-label { color: #aab7b1; }.process-section .section-label span:nth-child(2) { color: var(--lime); }.process-section .section-label::after { background: rgba(241,240,232,.3); }.process-heading { display: flex; justify-content: space-between; gap: 2rem; align-items: end; }.process-heading h2 { max-width: 12ch; margin: 0; }.process-heading .text-link { border-color: var(--paper); }.process-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: clamp(2.4rem, 5vw, 5rem); background: rgba(241,240,232,.35); }.process-step { min-height: 270px; padding: 1.5rem; background: var(--ink); }.process-step span { color: var(--lime); font: 800 2.5rem/1 var(--display); }.process-step h3 { margin: 3.8rem 0 .6rem; }.process-step p { max-width: 22rem; margin: 0; color: #c5cdc8; font-size: 14px; }
.applications-section { background: #dce2d6; }.applications-rail { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; margin-bottom: 2rem; }.application-card { position: relative; min-height: 390px; padding: 1.2rem; overflow: hidden; color: var(--paper); background: var(--ink); }.application-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .43; mix-blend-mode: screen; }.application-card::after { position: absolute; inset: 0; content:""; background: linear-gradient(0deg, rgba(8,23,21,.96), rgba(8,23,21,.06)); }.application-card>*:not(img) { position: relative; z-index: 1; }.application-card>span { display: block; color: var(--lime); font: 800 1.7rem/1 var(--display); }.application-card h3 { max-width: 12ch; margin: 10rem 0 .5rem; }.application-card p { max-width: 28ch; margin: 0; color: #d8e0db; font-size: 13px; }
.about-slice { display: grid; grid-template-columns: 1.1fr .9fr; min-height: 600px; background: #fdfcf6; }.about-slice-image { overflow: hidden; }.about-slice-image img { width: 100%; height: 100%; object-fit: cover; }.about-slice>div:last-child { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(3rem, 9vw, 9rem); }.about-slice h2 { max-width: 11ch; margin: .7rem 0 1.25rem; }.about-slice p { max-width: 34rem; }.quote-banner { padding: clamp(4rem, 10vw, 9rem) clamp(1.2rem, 8vw, 12rem); background: var(--lime); }.quote-banner h2 { max-width: 16ch; margin: .75rem 0; }.quote-banner p { max-width: 43rem; }.quote-banner.compact { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(2.5rem, 6vw, 5rem) clamp(1.2rem, 8vw, 12rem); }.quote-banner.compact h2 { margin: 0; font-size: clamp(1.8rem, 4vw, 3.7rem); }
.page-hero { padding: clamp(4.5rem, 12vw, 10rem) clamp(1.2rem, 8vw, 12rem) clamp(3rem, 7vw, 6rem); border-bottom: 1px solid var(--line); background: #e4e7dc; }.page-hero h1 { max-width: 11ch; margin: .7rem 0 1rem; }.page-hero p { max-width: 38rem; font-size: 1.1rem; }.products-page { padding-top: 3rem; }.catalogue-note { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-top: 2rem; padding: 2rem; background: var(--ink); color: var(--paper); }.catalogue-note p { max-width: 42rem; margin: 0; }.catalogue-note .eyebrow { color: var(--lime); }
.product-hero { display: grid; grid-template-columns: 1fr 1fr; min-height: 610px; background: var(--ink); color: var(--paper); }.product-hero-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(3rem, 8vw, 8rem); }.product-hero-copy .eyebrow { color: var(--lime); }.product-hero-copy h1 { max-width: 10ch; margin: .8rem 0; }.product-hero-copy p { max-width: 34rem; color: #cbd3ce; }.product-hero-copy .button { margin-top: 1.2rem; }.breadcrumb { margin-top: 1.6rem; border-bottom: 1px solid #cbd3ce; font-size: 12px; }.product-hero-image { position: relative; overflow: hidden; }.product-hero-image img { width: 100%; height: 100%; object-fit: cover; }.detail-layout { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(2rem, 9vw, 10rem); padding: clamp(4rem, 9vw, 8rem) clamp(1.2rem, 12vw, 15rem); }.detail-lead h2 { max-width: 10ch; margin: .7rem 0 0; }.detail-body { max-width: 39rem; padding-top: .4rem; }.detail-body p { font-size: 1.14rem; }.feature-list { margin: 2rem 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }.feature-list li { padding: .8rem 0 .8rem 1.2rem; border-bottom: 1px solid var(--line); position: relative; }.feature-list li::before { position: absolute; left: 0; content: "↗"; color: #4f6c00; font-weight: 800; }.spec-section { display: grid; grid-template-columns: .9fr 1.1fr; gap: 5rem; padding: clamp(3rem, 7vw, 7rem) clamp(1.2rem, 12vw, 15rem); background: #dce2d6; }.spec-section h2 { max-width: 11ch; margin: .7rem 0; }.spec-list { margin: 0; border-top: 1px solid var(--ink); }.spec-list>div { display: grid; grid-template-columns: .8fr 1.2fr; gap: 1.5rem; padding: 1.2rem 0; border-bottom: 1px solid var(--ink); }.spec-list dt { font-size: 12px; font-weight: 800; }.spec-list dd { margin: 0; }.related-section { padding: clamp(3.5rem, 7vw, 7rem) clamp(1.2rem, 12vw, 15rem); }.related-section>div { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-top: 1.5rem; }.related-section a { display: flex; justify-content: space-between; padding: 1.2rem; border: 1px solid var(--ink); font: 800 clamp(1.1rem,2vw,1.6rem)/1 var(--display); }.related-section a:hover { background: var(--ink); color: var(--paper); }
.split-hero { display: grid; grid-template-columns: 1fr .8fr; gap: clamp(2rem,8vw,8rem); align-items: center; min-height: 600px; padding: clamp(4rem, 9vw, 9rem) clamp(1.2rem, 10vw, 12rem); background: #e2e6da; }.split-hero>div h1 { margin: .7rem 0 0; }.split-hero>div h2 { max-width: 10ch; margin: .6rem 0 1.4rem; }.split-hero p { max-width: 38rem; font-size: 1.1rem; }.split-hero>img { width: 100%; aspect-ratio: 1 / 1.1; object-fit: cover; box-shadow: 12px 12px 0 var(--ink); }.about-hero { background: var(--paper); }.application-list { padding: clamp(3rem,8vw,8rem) clamp(1.2rem,10vw,12rem); }.application-card.long { display: grid; grid-template-columns: .85fr 1fr; min-height: 400px; margin-bottom: 1.4rem; color: var(--ink); background: #dce2d6; }.application-card.long img { position: relative; inset: auto; height: 100%; opacity: 1; mix-blend-mode: normal; }.application-card.long::after { display: none; }.application-card.long>div { position: relative; z-index: 1; padding: clamp(2rem,5vw,5rem); }.application-card.long>div>span { color: #597d00; font: 800 1.5rem/1 var(--display); }.application-card.long h2 { margin: 3rem 0 .8rem; }.application-card.long p { max-width: 37rem; color: var(--ink); font-size: 15px; }.company-record { background: var(--ink); color: var(--paper); }.company-record .eyebrow { color: var(--lime); }.company-record .spec-list { border-color: var(--paper); }.company-record .spec-list>div { border-color: rgba(241,240,232,.5); }.contact-prelaunch { padding: clamp(4rem, 9vw, 8rem) clamp(1.2rem, 20vw, 26rem); text-align: center; }.contact-prelaunch h2 { margin: .8rem auto; }.contact-prelaunch p { max-width: 44rem; margin: 0 auto 1.4rem; }.quote-page { display: grid; grid-template-columns: .8fr 1.2fr; min-height: calc(100vh - 84px); }.quote-intro { padding: clamp(3rem, 8vw, 8rem); background: var(--ink); color: var(--paper); }.quote-intro .eyebrow { color: var(--lime); }.quote-intro h1 { margin: .7rem 0; }.quote-intro p { color: #c9d3cc; }.quote-intro img { width: 75%; margin: 3rem auto 0; transform: rotate(-3deg); box-shadow: 10px 10px 0 var(--lime); }.quote-form { padding: clamp(3rem, 7vw, 7rem); background: #e2e6da; }.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }.quote-form label { display: block; margin-bottom: 1rem; font-size: 12px; font-weight: 800; }.quote-form input, .quote-form textarea { width: 100%; margin-top: .35rem; padding: .7rem .8rem; border: 1px solid var(--ink); border-radius: 0; background: #f8f7f1; color: var(--ink); }.quote-form textarea { resize: vertical; }.quote-form .check { display: flex; gap: .6rem; align-items: start; font-weight: 500; }.quote-form .check input { width: auto; margin-top: .2rem; }.form-note { max-width: 40rem; color: var(--muted); font-size: 12px; }.form-result { min-height: 1.5rem; margin: 1rem 0 0; font-weight: 700; }
.site-footer { padding: 1.2rem clamp(1.2rem, 7vw, 8rem) 2rem; background: var(--ink); color: var(--paper); }.footer-rule { height: 7px; background: var(--lime); margin-bottom: 3rem; }.footer-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 4rem; }.footer-grid h2 { margin: .6rem 0; font-size: 2.6rem; }.footer-grid p { max-width: 37rem; color: #bdc9c2; }.footer-grid .eyebrow { color: var(--lime); }.footer-links { display: grid; align-content: start; gap: .8rem; font-size: 13px; font-weight: 700; }.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; margin-top: 4rem; padding-top: 1rem; border-top: 1px solid rgba(241,240,232,.3); color: #9aaba1; font-size: 10px; }.language-gate { display: grid; min-height: 100vh; place-items: center; color: var(--paper); background: var(--ink); text-align: center; }.language-gate main { padding: 2rem; }.language-gate-mark { width: 96px; height: 96px; display: grid; place-items: center; margin: 0 auto 1.5rem; color: var(--ink); background: var(--lime); font: 900 36px var(--display); letter-spacing: -.12em; transform: skew(-8deg); }.language-gate h1 { margin: .5rem 0; }.language-gate p { color: #bdc9c2; }.language-gate .button { margin: .3rem; }
@media (max-width: 900px) { .desktop-nav { display: none; }.menu-toggle { display: block; }.hero { grid-template-columns: 1fr; }.hero-copy { min-height: 560px; }.hero-visual { min-height: 520px; }.section-intro, .detail-layout, .spec-section, .quote-page { grid-template-columns: 1fr; gap: 2rem; }.product-list { grid-template-columns: 1fr; }.applications-rail { grid-template-columns: 1fr; }.about-slice { grid-template-columns: 1fr; }.about-slice-image { min-height: 440px; }.product-hero { grid-template-columns: 1fr; }.product-hero-image { min-height: 380px; }.product-hero-copy { min-height: 510px; }.split-hero { grid-template-columns: 1fr; }.split-hero>img { max-width: 560px; }.application-card.long { grid-template-columns: 1fr; }.application-card.long img { min-height: 280px; }.quote-intro img { width: 55%; }.footer-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .site-header { min-height: 68px; padding-inline: 1rem; }.wordmark { min-width: auto; }.wordmark small { display: none; }.header-actions .button-small { display: none; }.mobile-menu { inset: 68px 0 auto; }.hero-copy { padding: 4.5rem 1.2rem 3rem; min-height: 500px; }.hero-visual { min-height: 380px; padding: 2rem; }.hero-photo-main { height: 83%; }.hero-photo-note { right: 2%; bottom: 5%; grid-template-columns: 73px 1fr; width: 83%; }.hero-photo-note img { width: 73px; height: 73px; }.hero-photo-note span { padding: .65rem; font-size: .72rem; }.section, .process-section { padding-inline: 1.2rem; }.section-intro { gap: 1rem; }.product-tile { grid-template-columns: 43% 57%; min-height: 230px; }.product-tile-copy { padding: 1rem; }.product-tile h3 { margin-top: .8rem; }.product-tile p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }.process-heading { align-items: start; flex-direction: column; }.process-steps { grid-template-columns: 1fr; }.process-step { min-height: 200px; }.process-step h3 { margin-top: 2rem; }.applications-rail { margin-inline: -.15rem; }.about-slice-image { min-height: 320px; }.quote-banner.compact { align-items: flex-start; flex-direction: column; }.catalogue-note { align-items: flex-start; flex-direction: column; }.product-hero-copy, .detail-layout, .spec-section, .split-hero, .application-list, .quote-intro, .quote-form { padding-inline: 1.2rem; }.related-section { padding-inline: 1.2rem; }.related-section>div { grid-template-columns: 1fr; }.spec-list>div { grid-template-columns: 1fr; gap: .3rem; }.form-grid { grid-template-columns: 1fr; }.footer-bottom { align-items: flex-start; flex-direction: column; }.quote-intro img { width: 75%; }.application-card.long>div { padding: 2rem 1.2rem; }.application-card.long h2 { margin-top: 1.8rem; } }

/* Official YOUTUOJINGCHUANG trademark integration */
.brand-symbol { width: 48px; height: 44px; object-fit: contain; mix-blend-mode: multiply; }
.wordmark { min-width: 240px; }
.wordmark b { font-size: clamp(10px, 1.05vw, 13px); letter-spacing: .045em; white-space: nowrap; }
.footer-brand { display: flex; flex-direction: column; align-items: flex-start; }
.footer-lockup { width: min(250px, 74%); margin: .7rem 0 1rem; padding: .25rem; background: #fff; }
.language-gate-lockup { width: min(300px, 72vw); margin: 0 auto 1.2rem; padding: .4rem; background: #fff; }
@media (max-width: 600px) { .wordmark { min-width: 0; gap: .35rem; }.brand-symbol { width: 42px; height: 39px; }.wordmark b { font-size: 10px; letter-spacing: .02em; }.language-gate-lockup { width: min(270px, 82vw); } }
.language-gate .button-ghost { color: var(--paper); border-color: var(--paper); }
.language-gate .button-ghost:hover { color: var(--ink); background: var(--paper); }

/* Product insights and contact pages */
.insights-preview { background: #eef0e5; }
.insight-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; margin-bottom: 2rem; }
.insight-card { display: flex; flex-direction: column; min-height: 100%; background: #fdfcf6; border: 1px solid var(--line); }
.insight-image { display: block; aspect-ratio: 1.35 / 1; overflow: hidden; background: #dce2d6; }
.insight-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.insight-card:hover .insight-image img { transform: scale(1.04); }
.insight-card > div { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: clamp(1.2rem, 2.5vw, 2rem); }
.insight-card h2 { margin: .7rem 0; font-size: clamp(1.6rem, 2.2vw, 2.5rem); }
.insight-card p { margin: 0; color: #44524d; font-size: 14px; }
.insight-card .text-link { margin-top: auto; padding-top: 1.35rem; }
.insights-page { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; padding: clamp(3rem, 8vw, 8rem) clamp(1.2rem, 8vw, 12rem); }
.insights-page .insight-card { min-height: 460px; }
.insight-note { margin: 0 clamp(1.2rem, 8vw, 12rem) clamp(4rem, 8vw, 8rem); }
.article-hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); min-height: 540px; background: var(--ink); color: var(--paper); }
.article-hero > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: clamp(3rem, 9vw, 9rem); }
.article-hero .eyebrow { color: var(--lime); }
.article-hero h1 { max-width: 11ch; margin: .85rem 0; font-size: clamp(2.8rem, 5.2vw, 6.1rem); }
.article-hero p { max-width: 42rem; margin: 0; color: #cbd3ce; font-size: 1.1rem; }
.article-hero > img, .article-hero-figure { width: 100%; height: 100%; min-height: 420px; object-fit: cover; }
.article-hero-figure { position: relative; margin: 0; overflow: hidden; }
.article-hero-figure img { display: block; width: 100%; height: 100%; min-height: 420px; object-fit: cover; }
.article-hero .breadcrumb { margin: 1.4rem 0 0; border-bottom: 1px solid #cbd3ce; font-size: 12px; }
.article-layout { display: grid; grid-template-columns: minmax(0, .66fr) minmax(0, 1.34fr); gap: clamp(2rem, 9vw, 11rem); padding: clamp(4rem, 10vw, 10rem) clamp(1.2rem, 12vw, 15rem); }
.article-intro { font-size: clamp(1.15rem, 1.8vw, 1.55rem); line-height: 1.55; }
.article-intro .eyebrow { margin-bottom: 1rem; }
.article-intro p { margin: 0; }
.article-content { max-width: 50rem; }
.article-section { padding: 0 0 2.5rem; margin-bottom: 2.5rem; border-bottom: 1px solid var(--line); }
.article-section h2 { margin: 0 0 1rem; font-size: clamp(1.75rem, 3vw, 3.1rem); }
.article-section p { margin: 0; font-size: 1.04rem; }
.article-section .feature-list { margin-top: 1.4rem; }
.article-disclaimer { padding: clamp(1.4rem, 3vw, 2.5rem); background: #dce2d6; }
.article-disclaimer .eyebrow { margin-bottom: .65rem; }
.article-disclaimer p { max-width: 40rem; margin: 0 0 1.2rem; }
.contact-hero { display: grid; grid-template-columns: 1.2fr .8fr; align-items: center; gap: clamp(2rem, 7vw, 7rem); min-height: 570px; padding: clamp(4rem, 10vw, 10rem) clamp(1.2rem, 10vw, 12rem); background: #e2e6da; }
.contact-hero > div { max-width: 47rem; }
.contact-hero h1 { margin: .65rem 0 1rem; max-width: 10ch; }
.contact-hero p { max-width: 40rem; font-size: 1.15rem; }
.contact-hero img { width: min(100%, 390px); justify-self: center; background: #fff; padding: 1rem; box-shadow: 12px 12px 0 var(--ink); }
.contact-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 9vw, 10rem); padding: clamp(4rem, 9vw, 8rem) clamp(1.2rem, 12vw, 15rem); }
.contact-layout h2 { max-width: 11ch; margin: .7rem 0 1rem; }
.contact-layout p { max-width: 38rem; }
.contact-list { margin: 0; border-top: 1px solid var(--ink); }
.contact-list > div { display: grid; grid-template-columns: .75fr 1.25fr; gap: 1.5rem; padding: 1.15rem 0; border-bottom: 1px solid var(--ink); }
.contact-list dt { font-size: 12px; font-weight: 800; }
.contact-list dd { margin: 0; }
.contact-status { padding: clamp(4rem, 9vw, 8rem) clamp(1.2rem, 18vw, 24rem); background: var(--ink); color: var(--paper); text-align: center; }
.contact-status .eyebrow { color: var(--lime); }
.contact-status h2 { max-width: 12ch; margin: .8rem auto; }
.contact-status p { max-width: 46rem; margin: 0 auto 1.5rem; color: #cbd3ce; }
@media (max-width: 900px) { .insight-list, .insights-page, .article-hero, .article-layout, .contact-hero, .contact-layout { grid-template-columns: 1fr; }.article-hero > img, .article-hero-figure { max-height: 460px; }.article-layout { gap: 2.2rem; }.contact-hero > img { width: min(340px, 75%); justify-self: start; } }
@media (max-width: 600px) { .insight-list, .insights-page { grid-template-columns: 1fr; }.insights-page { padding-inline: 1.2rem; }.insight-note { margin-inline: 1.2rem; }.article-hero > div, .article-layout, .contact-hero, .contact-layout { padding-inline: 1.2rem; }.article-hero > img, .article-hero-figure, .article-hero-figure img { min-height: 300px; }.article-section { margin-bottom: 2rem; padding-bottom: 2rem; }.contact-list > div { grid-template-columns: 1fr; gap: .25rem; }.contact-hero > img { width: min(280px, 86%); } }

/* AI-assisted product visuals: presentation only, never dimensional specifications */
.ai-image-note, .product-photo-note { position: absolute; right: 1.1rem; bottom: 1.1rem; z-index: 1; max-width: min(82%, 31rem); margin: 0; padding: .65rem .75rem; background: rgba(9, 33, 31, .9); color: #f1f0e8; font-size: 11px; line-height: 1.35; }
.ai-split-visual { position: relative; width: 100%; margin: 0; }
.split-hero .ai-split-visual img { display: block; width: 100%; aspect-ratio: 1 / 1.1; object-fit: cover; box-shadow: 12px 12px 0 var(--ink); }
.ai-split-visual figcaption { max-width: 34rem; margin-top: .65rem; color: #40514a; font-size: 11px; line-height: 1.4; }
@media (max-width: 600px) { .ai-image-note, .product-photo-note { right: .8rem; bottom: .8rem; max-width: calc(100% - 1.6rem); font-size: 10px; }.split-hero .ai-split-visual img { max-width: 560px; } }

/* HDPE interlocking flooring: company-supplied real media */
.featured-subproduct { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); margin: 1.5rem 0; background: #dce2d6; border: 1px solid var(--ink); }
.featured-subproduct img { display: block; width: 100%; height: 100%; min-height: 280px; object-fit: contain; background: #173b36; }
.featured-subproduct > div { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(1.5rem, 4vw, 4rem); }
.featured-subproduct h2 { max-width: 13ch; margin: .7rem 0; font-size: clamp(2rem, 3.5vw, 4.2rem); }
.featured-subproduct p { max-width: 42rem; margin: 0; }
.featured-subproduct .text-link { margin-top: 1.2rem; }
.hdpe-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr); min-height: 610px; background: var(--ink); color: var(--paper); }
.hdpe-hero > div { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(3rem, 8vw, 8rem); }
.hdpe-hero .eyebrow { color: var(--lime); }
.hdpe-hero h1 { max-width: 10ch; margin: .8rem 0; }
.hdpe-hero p { max-width: 37rem; color: #cbd3ce; }
.hdpe-hero .button { margin-top: 1.2rem; }
.hdpe-hero > img { width: 100%; height: 100%; min-height: 420px; object-fit: contain; background: #0a342f; }
.hdpe-gallery-section { padding: clamp(4rem, 9vw, 9rem) clamp(1.2rem, 8vw, 12rem); background: #eef0e5; }
.hdpe-gallery-section .section-intro { margin-bottom: 2.5rem; }
.hdpe-gallery-section .section-intro h2 { max-width: 13ch; margin: .7rem 0 0; }
.hdpe-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.hdpe-gallery figure, .hdpe-video-grid figure { margin: 0; background: #fdfcf6; border: 1px solid var(--line); }
.hdpe-gallery img { display: block; width: 100%; height: auto; background: #173b36; }
.hdpe-gallery figcaption, .hdpe-video-grid figcaption { padding: .75rem .85rem; color: #40514a; font-size: 11px; line-height: 1.4; }
.hdpe-video-section { padding: clamp(4rem, 9vw, 9rem) clamp(1.2rem, 8vw, 12rem); background: var(--ink); color: var(--paper); }
.hdpe-video-section .eyebrow { color: var(--lime); }
.hdpe-video-section h2 { max-width: 12ch; margin: .7rem 0 2rem; }
.hdpe-video-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.hdpe-video-grid figure { display: flex; flex-direction: column; border-color: rgba(241,240,232,.3); background: #10312f; }
.hdpe-video-grid video { display: block; width: 100%; max-height: 610px; background: #071c1b; object-fit: contain; }
.hdpe-video-grid figcaption { color: #d6ded7; }
@media (max-width: 900px) { .featured-subproduct, .hdpe-hero { grid-template-columns: 1fr; }.featured-subproduct img { min-height: 320px; max-height: 520px; }.hdpe-hero > img { min-height: 340px; max-height: 560px; }.hdpe-gallery, .hdpe-video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .featured-subproduct > div, .hdpe-hero > div, .hdpe-gallery-section, .hdpe-video-section { padding-inline: 1.2rem; }.hdpe-gallery, .hdpe-video-grid { grid-template-columns: 1fr; }.featured-subproduct img { min-height: 0; }.hdpe-hero > img { min-height: 270px; }.hdpe-video-grid video { max-height: 660px; } }

/* Chain-guide model library: company-supplied real product photos */
.chain-model-library { padding: clamp(4rem, 9vw, 8rem) clamp(1.2rem, 8vw, 12rem); background: #eef0e5; }
.chain-model-library .section-intro { margin-bottom: 2.2rem; }
.chain-model-library .section-intro h2 { max-width: 14ch; margin: .7rem 0 0; }
.chain-model-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.chain-model-card { display: flex; flex-direction: column; border: 1px solid var(--ink); background: #fdfcf6; }
.chain-model-card > a:first-child { display: grid; min-height: 230px; place-items: center; background: #dae1d8; }
.chain-model-card img { display: block; width: 100%; height: 100%; max-height: 310px; object-fit: contain; }
.chain-model-card > div { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 1.1rem; }
.chain-model-card .tile-index { color: #4f6c00; }
.chain-model-card h3 { margin: .45rem 0; font-size: clamp(1.35rem, 2vw, 2rem); }
.chain-model-card p { margin: 0; color: var(--muted); font-size: 13px; }
.chain-model-card .text-link { margin-top: auto; padding-top: 1rem; }
.model-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr); min-height: 610px; background: var(--ink); color: var(--paper); }
.model-hero > div { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(3rem, 8vw, 8rem); }
.model-hero .eyebrow { color: var(--lime); }
.model-hero h1 { max-width: 12ch; margin: .8rem 0; }
.model-hero p { max-width: 38rem; color: #cbd3ce; }
.model-hero .button { margin-top: 1.2rem; }
.model-hero > img { width: 100%; height: 100%; min-height: 420px; object-fit: contain; background: #dae1d8; }
.model-photo-note { margin: .9rem 0 0; color: var(--muted); font-size: 12px; }
.model-materials { padding: clamp(3.5rem, 7vw, 7rem) clamp(1.2rem, 8vw, 12rem); background: #dce2d6; }
.model-materials h2 { max-width: 15ch; margin: .7rem 0 1.2rem; }
.model-material-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.model-material-list li { min-height: 92px; padding: 1rem; border-top: 2px solid var(--ink); background: #f8f7f1; font: 800 14px/1.25 var(--display); }
.model-library-cta { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 2rem; padding: 1.3rem; border: 1px solid var(--ink); background: var(--paper); }
.model-library-cta p { max-width: 46rem; margin: 0; }
@media (max-width: 900px) { .chain-model-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.model-hero { grid-template-columns: 1fr; }.model-hero > img { min-height: 360px; max-height: 560px; }.model-material-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .chain-model-library, .model-materials { padding-inline: 1.2rem; }.chain-model-grid, .model-material-list { grid-template-columns: 1fr; }.chain-model-card > a:first-child { min-height: 190px; }.model-hero > div { padding-inline: 1.2rem; }.model-hero > img { min-height: 260px; }.model-library-cta { align-items: flex-start; flex-direction: column; } }

.language-gate-heading { max-width: 44rem; margin: .25rem auto 1rem; color: var(--lime); font: 700 clamp(1.1rem, 2vw, 1.5rem)/1.25 var(--display); }

.direct-phone { color: inherit; font-weight: 800; text-decoration: underline; text-underline-offset: .22em; }


.page-keyword-heading, .article-keyword-heading, .quote-keyword-heading {
  margin: .65rem 0 1rem;
  max-width: 52rem;
  color: var(--ink);
  font: 700 clamp(1.15rem, 2vw, 1.75rem)/1.22 var(--display);
}
.page-hero .page-keyword-heading { max-width: 47rem; }
.article-keyword-heading { font-size: clamp(1.35rem, 2.4vw, 2.05rem); }
.quote-keyword-heading { color: var(--paper); }