:root {
  --ink: #10171d;
  --muted: #5d6670;
  --paper: #fff;
  --surface: #f2f4f6;
  --line: #dce1e5;
  --white: #fff;
  --blue: #1760c8;
  --mint: #66c8ef;
  --amber: #f6c343;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.6; }
img { max-width: 100%; }
a { color: inherit; }
button { font: inherit; }
h1,h2,h3,p { overflow-wrap: break-word; }
h1,h2,h3 { line-height: 1.18; }
main:focus { outline: none; }
.section-shell { width: min(1200px, calc(100% - 64px)); margin-inline: auto; }
.section-pad { padding-block: 88px; }
.line-icon { width: 24px; height: 24px; flex: 0 0 auto; }
.skip-link { position: absolute; z-index: 100; top: -90px; left: 20px; background: var(--amber); padding: 12px 20px; color: var(--ink); font-weight: 700; }
.skip-link:focus { top: 12px; }
.contact-bar { background: #eaf0f9; color: #273e5b; font-size: 13px; }
.contact-bar .section-shell { display: flex; justify-content: space-between; align-items: center; gap: 24px; min-height: 38px; }
.contact-bar a { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; }
.contact-bar .line-icon { width: 17px; height: 17px; }
.contact-bar a:hover { color: var(--amber); }
.site-header { background: #111; color: white; border-bottom: 1px solid #292929; position: relative; z-index: 10; }
.header-shell { width: min(1280px, calc(100% - 64px)); min-height: 86px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; gap: 14px; align-items: center; text-decoration: none; flex-shrink: 0; }
.brand-mark { display: block; width: 62px; height: 62px; background: #000 url('assets/kangsenlong-ksl-logo.png') center/contain no-repeat; }
.brand strong,.brand small { display: block; }
.brand strong { font-size: 23px; line-height: 1; letter-spacing: -.025em; }
.brand small { font-size: 12px; line-height: 1.4; letter-spacing: .19em; margin-top: 7px; }
.site-nav { display: flex; align-items: center; gap: 27px; }
.site-nav a { color: white; text-decoration: none; font-size: 14px; font-weight: 600; padding-block: 10px; }
.site-nav a:not(.nav-cta):hover,.site-nav a:not(.nav-cta)[aria-current='page'] { text-decoration: underline; text-decoration-color: var(--blue); text-underline-offset: 9px; text-decoration-thickness: 2px; }
.site-nav .nav-cta { padding: 13px 22px; margin-left: 8px; background: var(--blue); color: white; font-size: 14px; border-radius: 3px; }
.menu-toggle { display: none; cursor: pointer; border: 1px solid var(--line); background: white; padding: 9px 13px; font-size: 14px; font-weight: 700; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 16px; min-height: 48px; padding: 13px 23px; border: 1px solid transparent; border-radius: 3px; font-size: 15px; font-weight: 700; text-decoration: none; cursor: pointer; }
.button-primary,.button-dark { color: white; background: var(--blue); }
.button-primary:hover,.button-dark:hover,.site-nav .nav-cta:hover { background: #104da7; }
.button-quiet { padding-inline: 0; color: inherit; text-transform: none; }
.button-quiet:hover { text-decoration: underline; text-underline-offset: 5px; }
.text-link { display: inline-flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 700; text-decoration: none; }
.text-link:hover { text-decoration: underline; text-underline-offset: 5px; }
.eyebrow,.section-kicker { font-size: 13px; color: var(--blue); text-transform: uppercase; letter-spacing: .12em; font-weight: 600; }
.eyebrow { margin: 0 0 18px; }
.eyebrow>span { display: none; }
.home-hero { position: relative; min-height: 560px; background: #191919; color: white; overflow: hidden; }
.hero-art { position: absolute; inset: 0 50% 0 0; background: #e2e5e8 url('assets/optimized/metal-components.webp') center 50%/contain no-repeat; }
.hero-content { position: relative; min-height: 560px; display: flex; align-items: center; padding-block: 64px; }
.hero-copy { width: 46%; margin-left: 54%; max-width: 580px; position: relative; z-index: 1; }
.home-hero .eyebrow { color: #66c8ef; }
.home-hero h1 { font-size: clamp(40px,4.3vw,62px); line-height: 1.09; letter-spacing: -.035em; margin: 0 0 24px; }
.hero-lede { max-width: 600px; font-size: 18px; line-height: 1.6; color: var(--muted); }
.home-hero .hero-lede { max-width: 510px; color: #c5c9ce; margin: 0; font-size: 18px; }
.hero-actions { display: flex; align-items: center; gap: 30px; flex-wrap: wrap; margin-top: 30px; }
.visual-label { position: absolute; left: 0; bottom: 20px; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #252c34; background: #fffd; padding: 6px 10px; }
.feature-strip { background: #f7f9fc; color: var(--ink); border-bottom: 1px solid var(--line); }
.feature-strip .section-shell { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); padding-block: 26px; }
.feature-strip .section-shell>div { display: flex; gap: 18px; align-items: center; padding-inline: 24px; border-right: 1px solid var(--line); }
.feature-strip .section-shell>div:first-child { padding-left: 0; }
.feature-strip .section-shell>div:last-child { border-right: 0; padding-right: 0; }
.feature-strip .line-icon { width: 42px; height: 42px; }
.feature-strip h2 { font-size: 16px; margin: 0 0 7px; }
.feature-strip p { font-size: 14px; line-height: 1.45; color: var(--muted); margin: 0; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 36px; margin: 0 0 30px; }
.section-heading h2 { font-size: clamp(26px,2.7vw,36px); margin: 0 0 12px; letter-spacing: -.015em; }
.section-heading p { margin: 0; color: var(--muted); max-width: 690px; }
.section-heading .text-link { flex-shrink: 0; margin-bottom: 4px; }
.service-card-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; }
.service-card { display: flex; flex-direction: column; padding: 30px 24px; background: #f6f7f9; border: 1px solid #edf0f3; }
.service-icon { height: 70px; display: flex; align-items: flex-start; color: var(--blue); margin-bottom: 24px; }
.service-icon .line-icon { width: 52px; height: 52px; stroke-width: 1; }
.service-card h3 { margin: 0 0 10px; font-size: 20px; }
.service-card p { margin: 0 0 24px; color: var(--muted); font-size: 16px; }
.service-card .text-link { margin-top: auto; }
.selected-parts { background: #f7f8fa; }
.part-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.part-card { background: white; display: flex; flex-direction: column; }
.part-image { display: block; height: 290px; padding: 16px; background: #e6e9ec; }
.part-image img { width: 100%; height: 100%; object-fit: contain; display: block; }
.part-card-copy { padding: 23px; flex: 1; display: flex; flex-direction: column; }
.part-card h3 { margin: 0 0 10px; font-size: 21px; }
.part-card p { margin: 0 0 20px; color: var(--muted); }
.part-card .text-link { margin-top: auto; }
.quality-band { background: var(--ink); color: white; padding-block: 30px; }
.quality-band>.section-shell { display: grid; grid-template-columns: 1.1fr 2fr; align-items: center; gap: 32px; }
.quality-band h2 { font-size: 24px; margin: 0 0 8px; }
.quality-band p { margin: 0; color: #d7dde1; font-size: 15px; }
.inspection-link { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; text-decoration: none; border-left: 1px solid #53606a; padding-left: 30px; }
.inspection-link>span { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.inspection-link .line-icon { width: 30px; height: 30px; }
.inspection-link:hover { color: var(--amber); }
.application-section { padding-block: 54px; }
.application-section h2 { font-size: clamp(25px,2.5vw,32px); }
.application-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 0; margin-top: 30px; }
.application-grid a { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 15px; border-right: 1px solid var(--line); padding: 12px 16px; text-decoration: none; font-size: 15px; }
.application-grid a:last-child { border-right: 0; }
.application-grid .line-icon { width: 35px; height: 35px; }
.application-grid a:hover { color: var(--blue); background: var(--surface); }
.company-intro { border-top: 1px solid var(--line); padding-block: 42px; display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.company-intro h2 { font-size: 27px; margin: 0; }
.company-intro .eyebrow { margin-bottom: 10px; }
.company-intro p:not(.eyebrow) { color: var(--muted); margin: 0 0 14px; }
.quote-band { background: var(--ink); color: white; padding-block: 48px; }
.quote-band>.section-shell { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.quote-band h2 { font-size: 28px; margin: 0 0 10px; }
.quote-band p { margin: 0; color: #d7dde1; }
.quote-band-actions { display: flex; align-items: center; gap: 25px; flex-shrink: 0; }
.site-footer { background: #151e25; color: #d1d8de; border-top: 1px solid #36414a; }
.footer-grid { display: grid; grid-template-columns: 1.2fr 1fr .8fr 1.5fr; gap: 32px; padding-block: 48px; }
.site-footer .brand { color: white; gap: 12px; }
.site-footer .brand-mark { width: 53px; height: 53px; }
.site-footer .brand strong { font-size: 18px; }
.site-footer .brand small { font-size: 10px; letter-spacing: .11em; }
.footer-brand>p { font-size: 14px; line-height: 1.7; max-width: 240px; margin-top: 20px; }
.footer-grid h2 { font-size: 14px; text-transform: uppercase; letter-spacing: .07em; color: white; margin: 0 0 18px; }
.footer-grid>div>a:not(.brand) { display: block; font-size: 14px; text-decoration: none; margin-bottom: 10px; }
.footer-grid a:hover { color: var(--amber); }
.footer-grid .footer-contact>a,.footer-contact>p { display: flex!important; align-items: flex-start; gap: 10px; font-size: 14px; margin: 0 0 12px; }
.footer-contact .line-icon { width: 17px; height: 17px; margin-top: 3px; }
.footer-contact span { overflow-wrap: anywhere; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 28px; border-top: 1px solid #36414a; padding-block: 22px; font-size: 12px; }
.footer-bottom>div { display: flex; gap: 24px; }
.footer-bottom a { text-decoration: none; }
.footer-bottom a:hover { text-decoration: underline; }
.cookie-settings { cursor: pointer; border: 0; background: none; padding: 0; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.cookie-settings.button { background: var(--blue); color: white; padding: 13px 23px; text-decoration: none; }
/* Shared content layouts on the existing inner pages. */
.page-hero.section-shell { width: 100%; background: var(--ink); color: white; padding: 70px max(32px,calc((100% - 1200px)/2)); border-bottom: 1px solid #34414b; }
.page-hero h1 { font-size: clamp(38px,4.5vw,64px); line-height: 1.08; letter-spacing: -.025em; max-width: 930px; margin: 0 0 22px; }
.page-hero h1 em { font-style: normal; color: white; }
.page-hero .eyebrow { color: #66c8ef; }
.page-hero .hero-lede { color: #dce3e8; margin: 0; max-width: 760px; }
.dark-section { background: var(--ink); color: white; }
.light { color: #66c8ef; }
.dark-section p,.dark-section li,.dark-section .section-heading p { color: #d1d8de; }
.dark-section .text-link { color: white; }
.capability-page-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.capability-page-grid article { padding: 28px; background: #1b252d; border-top: 2px solid var(--amber); }
.card-number { font-size: 14px; color: #66c8ef; }
.capability-page-grid h2 { font-size: 27px; margin: 22px 0 16px; }
.capability-page-grid p,.capability-page-grid li { font-size: 16px; }
.capability-page-grid ul { padding-left: 20px; }
.capability-page-grid li { margin-bottom: 8px; }
.capability-materials { margin-top: 35px; }
.material-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.material-columns>div { padding: 28px; background: var(--surface); }
.material-columns h3 { font-size: 16px; text-transform: uppercase; color: var(--blue); margin-top: 0; }
.material-columns p { color: var(--muted); line-height: 2; margin-bottom: 0; }
.medical-detail,.about-story,.quote-detail,.quality-detail,.service-split { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 64px; align-items: center; }
.medical-detail-image img,.about-story img { width: 100%; height: 440px; object-fit: contain; display: block; background: var(--surface); }
.medical-detail h2,.about-story h2,.quote-box h2,.quality-detail h2 { font-size: clamp(28px,3vw,40px); margin: 15px 0 24px; }
.medical-detail p,.about-story p,.quality-detail p,.quote-action p { color: var(--muted); }
.application-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.application-list li { padding: 13px 0; border-bottom: 1px solid var(--line); }
.application-list li:before { content: '—'; color: var(--blue); margin-right: 12px; }
.dark-section .application-list { border-color: #3d4a55; }
.dark-section .application-list li { border-color: #3d4a55; }
.industry-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin-top: 38px; }
.industry-grid>div { border: 1px solid #3d4a55; padding: 24px; }
.industry-grid strong,.industry-grid span { display: block; }
.industry-grid strong { color: white; font-size: 18px; margin-bottom: 12px; }
.industry-grid span { color: #d1d8de; font-size: 16px; }
.quality-equipment { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.quality-equipment>div { padding: 26px; background: var(--surface); border-top: 2px solid var(--blue); }
.quality-equipment strong,.quality-equipment span { display: block; }
.quality-equipment strong { font-size: 26px; }
.quality-equipment span { font-size: 14px; color: var(--muted); margin-top: 7px; }
.quality-flow { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; }
.quality-flow>div { padding-top: 22px; border-top: 1px solid #53606a; }
.quality-flow h3 { font-size: 24px; margin: 22px 0 14px; }
.quote-box { padding: 36px; background: var(--surface); }
.contact-action { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; min-width: 0; }
.contact-action>span { font-size: 21px; font-weight: 600; overflow-wrap: anywhere; }
.contact-extra { display: flex; flex-direction: column; gap: 10px; color: var(--muted); font-size: 15px; overflow-wrap: anywhere; }
.contact-extra a { color: var(--blue); }
.service-topics h2,.service-copy h2,.service-split h2,.service-faq h2 { font-size: clamp(27px,3vw,38px); margin: 0 0 25px; }
.topic-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin-top: 35px; }
.topic-grid.four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.topic-grid article { padding: 26px; background: var(--surface); border-top: 2px solid var(--line); }
.topic-grid h3 { margin: 0 0 15px; font-size: 22px; }
.topic-grid h3 a { text-decoration: none; }
.topic-grid h3 a:hover { text-decoration: underline; }
.topic-grid p { color: var(--muted); }
.dark-section .topic-grid article { background: #1b252d; border-color: #53606a; }
.dark-section .topic-grid p { color: #d1d8de; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 12px; padding-block: 20px; color: var(--muted); font-size: 14px; }
.breadcrumbs a { color: var(--blue); }
.service-split p,.service-copy p,.service-copy li,.service-faq p { color: var(--muted); }
.service-split figure { margin: 0; }
.service-split img { width: 100%; height: 400px; object-fit: contain; display: block; background: var(--surface); }
.service-split figcaption { font-size: 14px; color: var(--muted); margin-top: 13px; }
.service-copy { max-width: 860px; }
.service-copy h1 { font-size: clamp(36px,4vw,52px); }
.service-copy h2:not(:first-child) { margin-top: 40px; }
.service-copy li { margin-block: 10px; }
.service-faq details { border-top: 1px solid var(--line); padding: 23px 0; }
.service-faq summary { cursor: pointer; font-weight: 700; font-size: 18px; }
.service-faq p { max-width: 860px; }
.service-related { border-top: 1px solid var(--line); padding-block: 32px; }
.service-related h2 { font-size: 24px; }
.service-related a { display: inline-block; margin: 0 26px 16px 0; color: var(--blue); }
.contact-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 45px; padding: 40px; background: var(--surface); }
.contact-panel h2 { font-size: 36px; margin: 16px 0; }
.contact-panel p { color: var(--muted); }
.contact-panel .contact-action>span { font-size: 19px; }
:focus-visible { outline: 3px solid #007db9; outline-offset: 4px; }
.dark-section :focus-visible,.site-footer :focus-visible,.home-hero :focus-visible,.quote-band :focus-visible { outline-color: var(--amber); }
.cookie-banner { position: fixed; z-index: 30; bottom: 18px; left: 18px; right: 18px; max-width: 820px; margin: auto; background: white; color: var(--ink); border: 1px solid var(--line); box-shadow: 0 8px 32px #0003; padding: 22px 26px; border-radius: 3px; }
.cookie-banner p { font-size: 14px; margin: 0 0 16px; }
.cookie-banner a { text-underline-offset: 3px; }
.cookie-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.cookie-actions button { cursor: pointer; border: 1px solid var(--ink); border-radius: 2px; padding: 11px 16px; font-size: 14px; font-weight: 700; background: white; color: var(--ink); }
.cookie-actions .accept { background: var(--blue); color: white; border-color: var(--blue); }
[hidden] { display: none!important; }
@media (max-width: 1100px) {
  .header-shell { gap: 20px; }
  .brand strong { font-size: 20px; }
  .brand-mark { width: 53px; height: 53px; }
  .site-nav { gap: 18px; }
  .site-nav .nav-cta { margin-left: 0; padding-inline: 15px; }
  .brand small { font-size: 10px; }
  .quality-band>.section-shell { grid-template-columns: 1fr; gap: 24px; }
  .inspection-link { padding: 0; border: 0; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .quote-band>.section-shell { flex-wrap: wrap; }
  .hero-copy { width: 60%; }
  .topic-grid.four { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 1000px) {
  .header-shell { min-height: 82px; }
  .menu-toggle { display: block; }
  .site-nav { display: none; position: absolute; top: 100%; left: 24px; right: 24px; padding: 20px; background: white; border: 1px solid var(--line); box-shadow: 0 10px 30px #0002; flex-direction: column; align-items: stretch; gap: 5px; }
  .site-nav.open { display: flex; }
  .site-nav a { padding: 13px; font-size: 16px; }
  .site-nav .nav-cta { margin-top: 10px; text-align: center; }
  .service-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .feature-strip .section-shell>div { padding-inline: 16px; gap: 12px; }
  .feature-strip .line-icon { width: 32px; height: 32px; }
  .feature-strip h2 { font-size: 14px; }
  .medical-detail,.about-story,.quote-detail,.quality-detail,.service-split { gap: 32px; }
  .topic-grid,.capability-page-grid,.industry-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .part-image { height: 225px; padding: 10px; }
  .part-card-copy { padding: 20px; }
  .part-card h3 { font-size: 19px; }
}
@media (max-width: 640px) {
  .section-shell,.header-shell { width: calc(100% - 40px); }
  .section-pad { padding-block: 48px; }
  .contact-bar .section-shell { min-height: 36px; gap: 12px; font-size: 12px; }
  .contact-bar .line-icon { display: none; }
  .contact-bar a { gap: 0; }
  .contact-bar .contact-phone { display: none; }
  .header-shell { min-height: 78px; gap: 12px; }
  .brand { gap: 10px; }
  .brand-mark { width: 46px; height: 46px; }
  .brand strong { font-size: 18px; }
  .brand small { font-size: 9px; letter-spacing: .1em; margin-top: 6px; }
  .site-nav { left: 20px; right: 20px; }
  .home-hero { padding-bottom: 270px; }
  .hero-art { inset: auto 0 0; height: 290px; background: linear-gradient(90deg,#10171d 0%,transparent 20%,transparent 80%,#10171d 100%),linear-gradient(180deg,#10171d 0%,transparent 25%,transparent 75%,#10171d 100%),url('assets/optimized/metal-components.webp') center 52%/auto 150% no-repeat; background-color: var(--ink); }
  .hero-content { min-height: auto; padding-block: 48px 28px; }
  .hero-copy { width: 100%; max-width: 100%; }
  .home-hero h1 { font-size: clamp(32px,8.6vw,51px); letter-spacing: -.02em; }
  .home-hero .hero-lede { font-size: 17px; }
  .hero-actions { gap: 14px 23px; margin-top: 25px; }
  .visual-label { bottom: -235px; right: 0; font-size: 10px; }
  .feature-strip .section-shell { grid-template-columns: 1fr; padding-block: 8px; }
  .feature-strip .section-shell>div { padding: 20px 0; border: 0; border-bottom: 1px solid #3d4a55; gap: 20px; }
  .feature-strip .section-shell>div:last-child { border-bottom: 0; }
  .feature-strip h2 { font-size: 16px; }
  .section-heading { display: block; margin-bottom: 25px; }
  .section-heading .text-link { margin-top: 18px; }
  .service-card-grid { gap: 14px; }
  .service-card { padding: 20px 17px; }
  .service-icon { height: 60px; margin-bottom: 15px; }
  .service-icon .line-icon { width: 49px; height: 49px; }
  .service-card h3 { font-size: 18px; }
  .service-card p { font-size: 15px; }
  .part-card-grid { grid-template-columns: 1fr; gap: 22px; }
  .part-image { height: 300px; padding: 20px; }
  .part-card h3 { font-size: 22px; }
  .quality-band { padding-block: 32px; }
  .inspection-link { grid-template-columns: 1fr 1fr; gap: 22px 16px; }
  .inspection-link>span { font-size: 14px; }
  .application-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 0; }
  .application-grid a { min-height: 100px; border-right: 0; border-bottom: 1px solid var(--line); }
  .application-grid a:last-child { grid-column: 1/-1; }
  .company-intro { grid-template-columns: 1fr; gap: 22px; padding-block: 35px; }
  .quote-band { padding-block: 38px; }
  .quote-band h2 { font-size: 26px; }
  .quote-band>.section-shell { gap: 25px; }
  .quote-band-actions { flex-wrap: wrap; gap: 12px 23px; flex-shrink: 1; }
  .footer-grid { gap: 32px 20px; padding-block: 38px; }
  .footer-brand,.footer-contact { grid-column: 1/-1; }
  .footer-brand>p { max-width: none; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 15px; }
  .footer-bottom>div { flex-wrap: wrap; }
  .page-hero.section-shell { padding: 48px 20px; }
  .page-hero h1 { font-size: clamp(34px,9vw,49px); }
  .page-hero .hero-lede { font-size: 17px; }
  .capability-page-grid,.medical-detail,.about-story,.quote-detail,.quality-detail,.service-split,.quality-flow,.industry-grid,.topic-grid,.topic-grid.four,.contact-panel { grid-template-columns: 1fr; gap: 30px; }
  .material-columns { gap: 14px; }
  .material-columns>div { padding: 21px 17px; }
  .medical-detail-image img,.about-story img,.service-split img { height: 300px; }
  .quality-equipment { gap: 14px; }
  .quality-equipment>div { padding: 21px 17px; }
  .quote-box,.contact-panel { padding: 26px 21px; }
  .contact-action>span,.contact-panel .contact-action>span { font-size: 18px; }
  .service-copy { width: calc(100% - 40px); }
  .service-copy h1 { font-size: 36px; }
  .service-related { padding-block: 26px; }
  .cookie-banner { bottom: 12px; left: 12px; right: 12px; padding: 18px; max-height: calc(100dvh - 24px); overflow: auto; }
}
@media (max-width: 370px) {
  .brand strong { font-size: 16px; }
  .brand small { font-size: 8px; }
  .brand-mark { width: 40px; height: 40px; }
  .menu-toggle { padding: 8px 10px; }
  .service-card-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* CNC service layout, drawing-led RFQ and materials navigation. */
.page-jump-nav { position: sticky; top: 0; z-index: 8; background: white; border-bottom: 1px solid var(--line); }
.page-jump-nav .section-shell { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.page-jump-nav a { padding: 21px 10px; color: #344052; text-decoration: none; font-weight: 600; font-size: 14px; white-space: nowrap; }
.page-jump-nav a:hover,.page-jump-nav a:focus-visible { color: var(--blue); box-shadow: inset 0 -3px var(--blue); }
.process-section { background: #f7f8fa; }
.section-heading.centered { justify-content: center; text-align: center; margin-bottom: 50px; }
.section-heading.centered p { margin-inline: auto; }
.process-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); list-style: none; margin: 0; padding: 0; gap: 36px; }
.process-grid li { border-top: 1px solid #ccd6e4; padding-top: 23px; }
.process-grid li>span { display: inline-grid; place-items: center; width: 38px; height: 38px; background: #e7eefb; color: var(--blue); font-size: 14px; font-weight: 700; border-radius: 50%; }
.process-grid h3 { font-size: 20px; margin: 22px 0 12px; }
.process-grid p { color: var(--muted); margin: 0; font-size: 15px; }
.home-material-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.home-material-grid article { border: 1px solid var(--line); padding: 32px; }
.home-material-grid h3 { font-size: 26px; margin: 0 0 14px; }
.home-material-grid p { color: var(--muted); margin: 0; }
.material-tags { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0; }
.material-tags li { padding: 7px 13px; background: #f0f3f7; font-size: 14px; }
.material-tags a { color: var(--blue); font-weight: 700; text-decoration: none; }
.home-material-grid .text-link,.home-faq a { color: var(--blue); }
.home-faq { border-bottom: 1px solid var(--line); }
.home-faq details:last-child { border-bottom: 1px solid var(--line); }
.home-faq details[open] summary { color: var(--blue); }
.home-faq summary { line-height: 1.5; }
.site-header :focus-visible { outline-color: #8cbcff; }
.site-footer a:hover,.inspection-link:hover { color: #8cbcff; }
.contact-bar a:hover { color: var(--blue); }
@media (max-width: 1100px) {
 .home-hero,.hero-content { min-height: 510px; }
 .hero-copy { width: 46%; }
 .home-hero h1 { font-size: 45px; }
 .process-grid { gap: 24px; }
}
@media (max-width: 1000px) {
 .site-nav { background: #111; border-color: #343434; }
 .menu-toggle { color: white; background: transparent; border-color: #626262; }
 .process-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 36px; }
}
@media (max-width: 760px) {
 .home-hero { padding-bottom: 0; display: flex; flex-direction: column; }
 .home-hero .hero-art { order: 2; }
 .home-hero .hero-content { order: 1; }
 .hero-art { position: relative; inset: auto; height: 310px; background: #e2e5e8 url('assets/optimized/metal-components.webp') center/contain no-repeat; }
 .hero-content { min-height: auto; padding-block: 44px; }
 .hero-copy { width: 100%; max-width: 100%; margin-left: 0; }
 .home-hero h1 { font-size: clamp(37px,7.5vw,51px); max-width: 560px; }
 .visual-label { display: none; }
 .page-jump-nav .section-shell { justify-content: flex-start; overflow-x: auto; width: 100%; padding-inline: 20px; }
 .page-jump-nav a { padding: 18px 10px; }
 .home-material-grid { grid-template-columns: 1fr; }
 .home-material-grid article { padding: 26px; }
}
@media (max-width: 640px) {
 .feature-strip .section-shell>div { border-bottom-color: var(--line); }
 .section-pad { padding-block: 52px; }
 .process-grid { gap: 30px 22px; }
 .process-grid h3 { font-size: 18px; }
 .section-heading.centered { text-align: left; margin-bottom: 30px; }
 .home-hero .hero-lede { font-size: 17px; }
 .hero-actions { gap: 14px 22px; }
}
@media (max-width: 370px) {
 .process-grid { grid-template-columns: 1fr; }
 .hero-art { height: 270px; }
}


/* SEO / E-E-A-T content blocks (Phases 2–4) */
.seo-technical-overview .technical-pillars-grid,
.technical-pillars-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-top: 28px;
}
.pillar-card {
  border: 1px solid var(--line);
  padding: 22px 20px;
  background: var(--surface, #fff);
}
.pillar-card h3 { margin: 0 0 10px; font-size: 18px; }
.pillar-card p { margin: 0; color: var(--muted, #444); }
.process-checklist { margin: 16px 0 28px; padding-left: 1.2em; }
.process-checklist li { margin: 0 0 12px; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 18px 0 8px; }
.table-scroll table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
  font-size: 14px;
}
.table-scroll th,
.table-scroll td {
  border: 1px solid var(--line);
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
}
.table-scroll th { background: rgba(0,0,0,0.04); font-weight: 600; }
.eeat-trust-badges {
  margin-top: 18px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,0.02);
}
.eeat-trust-badges ul { margin: 0; padding-left: 1.15em; }
.eeat-trust-badges li { margin: 0 0 8px; }
.eeat-trust-badges li:last-child { margin-bottom: 0; }
.company-credentials {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,0.12);
  font-size: 13px;
  line-height: 1.55;
  grid-column: 1 / -1;
}
.site-footer .company-credentials { color: inherit; opacity: 0.92; }
.company-credentials p { margin: 0 0 6px; }
.company-credentials a { text-decoration: underline; text-underline-offset: 2px; }
.cred-alt { opacity: 0.7; }
@media (max-width: 900px) {
  .seo-technical-overview .technical-pillars-grid,
  .technical-pillars-grid { grid-template-columns: 1fr; }
}