/* Homepage materials sections share the theme's industrial type and ruled grid. */
.featured-products,
.quality-section,
.specifications-section,
.why-section {
    overflow-wrap:break-word;
}
.materials-heading {
    display:grid;
    grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);
    align-items:end;
    gap:40px;
    margin-bottom:40px;
}
.materials-heading h2 { max-width:790px; }
.materials-heading>div:last-child { max-width:410px; justify-self:end; }
.materials-heading>div:last-child>p:not(.eyebrow) { color:var(--muted); font-size:15px; }
.materials-heading .text-link { margin-top:20px; }

/* A compact catalogue preview, fed by the product collection. */
.featured-products { border-top:1px solid var(--line); }
.featured-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:22px;
}
.featured-card { min-width:0; background:#fff; display:flex; flex-direction:column; }
.featured-photo { position:relative; overflow:hidden; aspect-ratio:1.15; background:#e3e4e0; }
.featured-photo img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.featured-card:hover .featured-photo img { transform:scale(1.035); }
.featured-index {
    position:absolute;
    top:14px;
    left:14px;
    min-width:34px;
    padding:6px 9px;
    color:#fff;
    background:var(--yellow);
    font:11px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;
    text-align:center;
}
.featured-body { padding:25px 22px; display:flex; flex-direction:column; flex:1; align-items:flex-start; }
.featured-body .eyebrow { padding:0; background:none; color:var(--muted); font-size:9px; margin-bottom:14px; }
.featured-body h3 { font-size:24px; line-height:1.12; margin-bottom:14px; }
.featured-body>p:not(.eyebrow) { color:var(--muted); font-size:13px; line-height:1.6; margin-bottom:24px; }
.featured-body .text-link { margin-top:auto; padding-top:6px; }
.featured-card:focus-within { outline:2px solid var(--yellow); outline-offset:4px; }

/* A dark, numbered process keeps assurance concrete and easy to follow. */
.quality-section { position:relative; color:#fff; background:#202925; }
.quality-section::before {
    content:'';
    position:absolute;
    inset:0;
    margin:0 var(--pad);
    border-inline:1px solid #ffffff12;
    background:linear-gradient(90deg,transparent calc(50% - .5px),#ffffff12 calc(50% - .5px),#ffffff12 calc(50% + .5px),transparent calc(50% + .5px));
    pointer-events:none;
}
.quality-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:80px; position:relative; }
.quality-copy h2 { font-size:clamp(36px,4.1vw,62px); max-width:620px; }
.quality-description { max-width:430px; color:#c3cbc5; font-size:15px; line-height:1.7; margin-top:28px; }
.quality-note {
    max-width:430px;
    border-left:2px solid var(--yellow);
    padding-left:18px;
    margin-top:32px;
    color:#b4beb7;
    font-size:12px;
    line-height:1.7;
}
.quality-process { border-top:1px solid #ffffff30; }
.quality-process article {
    display:grid;
    grid-template-columns:45px minmax(0,1fr);
    gap:24px;
    padding:25px 0;
    border-bottom:1px solid #ffffff26;
}
.quality-step-number { color:#ec6868; font:14px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; padding-top:3px; }
.quality-process h3 { font-size:22px; line-height:1.15; margin-bottom:9px; }
.quality-process p { color:#b4beb7; font-size:13px; line-height:1.65; max-width:430px; }
.quality-capabilities { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; position:relative; }
.quality-capabilities>span {
    border:1px solid #ffffff30;
    padding:8px 12px;
    color:#c3cbc5;
    font-size:10px;
    font-weight:500;
    letter-spacing:.06em;
    text-transform:uppercase;
}

/* An illustrative technical sheet previews the information an RFQ can include. */
.specifications-section { background:#e7e8e3; }
.specifications-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:80px; }
.specifications-copy h2 { font-size:clamp(36px,4.1vw,62px); max-width:620px; }
.specifications-copy>p:not(.eyebrow) { max-width:440px; margin-top:26px; color:#626961; font-size:15px; line-height:1.7; }
.specifications-copy .text-link { border-bottom:1px solid var(--ink); padding-bottom:6px; }
.spec-sheet { min-width:0; background:#fff; padding:30px; border-top:4px solid var(--yellow); box-shadow:10px 10px 0 #d9dcd5; }
.spec-sheet-header { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.spec-sheet-header>span { color:var(--muted); font:10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; text-transform:uppercase; letter-spacing:.08em; }
.spec-sheet-header>strong { font-size:20px; letter-spacing:-.04em; font-weight:600; }
.spec-sheet-label { margin-top:24px; font-size:11px; text-transform:uppercase; letter-spacing:.07em; font-weight:600; }
.spec-sheet dl { margin:18px 0 0; }
.spec-row { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:20px; padding:16px 0; border-top:1px solid var(--line); font-size:12px; line-height:1.5; }
.spec-row dt { color:var(--muted); }
.spec-row dd { margin:0; font-weight:500; }
.spec-sheet-footer { border-top:1px solid var(--ink); padding-top:18px; display:flex; align-items:flex-start; gap:24px; justify-content:space-between; }
.spec-sheet-footer p { color:var(--muted); font-size:10px; line-height:1.6; max-width:300px; }
.spec-sheet-footer>span { color:var(--yellow); font:22px/1 ui-monospace,SFMono-Regular,Consolas,monospace; flex-shrink:0; }

/* Three purchase-focused reasons with a strong, simple ruled structure. */
.why-section { background:#fff; }
.why-section .materials-heading { margin-bottom:45px; }
.why-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.why-grid article { min-width:0; padding:35px 35px 35px 0; }
.why-grid article+article { border-left:1px solid var(--line); padding-left:35px; }
.why-number { display:block; margin-bottom:40px; color:var(--yellow); font:14px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace; }
.why-grid h3 { font-size:28px; max-width:330px; margin-bottom:18px; }
.why-grid p { max-width:350px; color:var(--muted); font-size:14px; line-height:1.65; }

@media(min-width:1600px) {
    .featured-photo { aspect-ratio:1.2; }
    .featured-body { padding:30px; }
    .quality-layout,.specifications-layout { gap:110px; }
}
@media(max-width:1100px) {
    .materials-heading { gap:30px; }
    .featured-grid { gap:16px; }
    .featured-body { padding:22px 17px; }
    .featured-body h3 { font-size:21px; }
    .quality-layout,.specifications-layout { gap:40px; }
    .quality-process article { gap:15px; grid-template-columns:35px minmax(0,1fr); }
    .quality-process h3 { font-size:20px; }
    .why-grid article { padding-right:25px; }
    .why-grid article+article { padding-left:25px; }
    .why-grid h3 { font-size:24px; }
}
@media(max-width:900px) {
    .featured-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
    .featured-photo { aspect-ratio:1.45; }
    .featured-body { padding:25px; }
    .featured-body h3 { font-size:25px; }
    .quality-layout,.specifications-layout { grid-template-columns:minmax(0,1fr); gap:40px; }
    .quality-copy h2,.specifications-copy h2 { max-width:680px; }
    .quality-description,.specifications-copy>p:not(.eyebrow) { max-width:600px; }
    .quality-note { max-width:600px; margin-top:24px; }
    .quality-process { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
    .quality-process article { padding:25px 25px 25px 0; }
    .quality-process article:nth-child(even) { padding-left:25px; border-left:1px solid #ffffff26; }
    .spec-sheet { max-width:720px; width:calc(100% - 10px); }
    .why-grid article { padding:28px 20px 28px 0; }
    .why-grid article+article { padding-left:20px; }
    .why-grid h3 { font-size:22px; }
    .why-grid p { font-size:13px; }
}
@media(max-width:600px) {
    .materials-heading { grid-template-columns:minmax(0,1fr); gap:24px; margin-bottom:30px; }
    .materials-heading>div:last-child { max-width:none; justify-self:stretch; }
    .materials-heading>div:last-child>p:not(.eyebrow) { font-size:14px; }
    .featured-grid { grid-template-columns:minmax(0,1fr); gap:24px; }
    .featured-photo { aspect-ratio:1.5; }
    .featured-body { padding:25px; }
    .featured-body>p:not(.eyebrow) { margin-bottom:18px; }
    .quality-copy h2,.specifications-copy h2 { font-size:34px; }
    .quality-layout,.specifications-layout { gap:32px; }
    .quality-description,.specifications-copy>p:not(.eyebrow) { font-size:14px; margin-top:22px; }
    .quality-process { display:block; }
    .quality-process article,.quality-process article:nth-child(even) { border-left:0; padding:22px 0; }
    .quality-process h3 { font-size:21px; }
    .quality-capabilities { gap:8px; margin-top:22px; }
    .quality-capabilities>span { font-size:9px; padding:7px 10px; }
    .spec-sheet { padding:22px; }
    .spec-sheet-header { padding-bottom:20px; }
    .spec-sheet-header>span { font-size:9px; }
    .spec-sheet-header>strong { font-size:18px; }
    .spec-row { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:14px; padding:14px 0; font-size:11px; }
    .spec-sheet-footer { gap:14px; }
    .why-section .materials-heading { margin-bottom:30px; }
    .why-grid { grid-template-columns:minmax(0,1fr); }
    .why-grid article,.why-grid article+article { border-left:0; padding:25px 0; }
    .why-grid article+article { border-top:1px solid var(--line); }
    .why-number { margin-bottom:22px; }
    .why-grid h3 { font-size:26px; max-width:none; margin-bottom:13px; }
    .why-grid p { max-width:none; font-size:14px; }
}
@media(prefers-reduced-motion:reduce) {
    .featured-photo img { transition:none; }
    .featured-card:hover .featured-photo img { transform:none; }
}
.featured-image-credits { margin-top:22px; color:#626961; font-size:11px; line-height:1.7; }
.featured-image-credits a { text-decoration:underline; text-underline-offset:3px; }
