/* Source: services/cnc-drilling/styles.css */
:root {
  --ink: #202124;
  --ink-soft: #2b2e33;
  --muted: #62666d;
  --line: #dedfe3;
  --paper: #ffffff;
  --paper-soft: #f5f5f3;
  --paper-warm: #efefeb;
  --red: #ea543f;
  --shadow-sm: 0 12px 34px rgba(16, 17, 20, 0.07);
  --shadow-lg: 0 30px 80px rgba(16, 17, 20, 0.14);
  --radius-md: 6px;
  --shell: 1280px;
  --section-space: clamp(72px, 6vw, 88px);
  --font: "Roboto", Arial, Helvetica, sans-serif;
}








.cnc-drilling-page,
.cnc-drilling-page *,
.cnc-drilling-page *::before,
.cnc-drilling-page *::after { box-sizing: border-box; }








html {
  scroll-behavior: smooth;
  scroll-padding-top: 104px;
}








section[id] { scroll-margin-top: 104px; }








.cnc-drilling-page {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}








.cnc-drilling-page img {
  max-width: 100%;
  height: auto;
  display: block;
}








.cnc-drilling-page a { color: inherit; }








.cnc-drilling-page button,
.cnc-drilling-page a { -webkit-tap-highlight-color: transparent; }








.cnc-drilling-page button,
.cnc-drilling-page input,
.cnc-drilling-page textarea,
.cnc-drilling-page select { font: inherit; }








.shell {
  width: min(calc(100% - 100px), var(--shell));
  margin-inline: auto;
}








.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;
}








.skip-link {
  position: fixed;
  inset: 8px auto auto 8px;
  z-index: 999;
  padding: 10px 14px;
  color: #fff;
  background: var(--ink);
  transform: translateY(-150%);
  transition: transform .2s ease;
}








.skip-link:focus { transform: translateY(0); }








.button {
  min-height: 52px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid transparent;
  border-radius: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}








.button:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(16, 17, 20, .13);
}








.button--small {
  min-height: 44px;
  padding-inline: 20px;
  font-size: 14px;
}








.button--primary {
  color: #fff;
  background: var(--red);
  border-color: var(--red);
}








.button--primary:hover {
  background: #111;
  border-color: #111;
}








.button--ghost {
  color: var(--ink);
  background: transparent;
  border-color: #202124;
}








.button--ghost:hover {
  color: #fff;
  background: #111;
  border-color: #111;
}








.button--dark-ghost {
  color: #fff;
  background: transparent;
  border-color: rgba(255, 255, 255, .4);
}








.button--dark-ghost:hover {
  background: #fff;
  color: var(--ink);
  border-color: #fff;
}








.text-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  font-weight: 750;
  text-decoration-color: var(--red);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}








.hero {
  position: relative;
  overflow: hidden;
  color: var(--ink);
  background: #fff;
}








.hero__grid {
  position: relative;
  width: 100%;
  max-width: none;
  min-height: 650px;
  margin-inline: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
}








.hero__copy {
  width: 100%;
  padding: clamp(72px, 7vw, 88px) clamp(34px, 4vw, 60px) 72px clamp(50px, 11vw, 210px);
  justify-self: stretch;
  align-self: center;
}








.breadcrumbs {
  margin-bottom: 44px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
}








.breadcrumbs a { text-decoration: none; }







.breadcrumbs a:hover { color: var(--ink); }








.hero h1 {
  max-width: 730px;
  font-size: 48px;
  line-height: 1.15;
}








.hero__lead {
  max-width: 650px;
  margin: 26px 0 0;
  color: var(--ink-soft);
  font-size: 16px;
  line-height: 1.72;
}








.hero__actions {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}








.hero__actions .button,
.final-cta__actions .button {
  min-height: 50px;
  padding-inline: 24px;
  font-size: 15px;
}








.trust-line {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 22px;
  color: var(--muted);
  font-size: 13px;
}








.trust-line span { display: inline-flex; align-items: center; gap: 8px; }







.trust-line svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; }








.hero__visual {
  position: relative;
  min-height: 650px;
  overflow: hidden;
}








.hero__visual::before,
.hero__visual::after { display: none; }








.hero__visual img {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: none;
}








.hero__index {
  position: absolute;
  z-index: 2;
  top: 28px;
  right: 28px;
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: rgba(255, 255, 255, .5);
}








.hero__index span { font-size: 50px; }







.hero__index b { font-size: 15px; letter-spacing: .14em; }








.section { padding-block: var(--section-space); }








.section-heading { max-width: 760px; margin-bottom: 48px; }







.section-heading > p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.7; }








.capabilities-section {
  padding-block: var(--section-space);
  overflow: hidden;
  background: #fff;
}








.capability-heading {
  max-width: 1040px;
  margin-bottom: 40px;
}








.capability-heading > p {
  max-width: 1040px;
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.7;
}








.capability-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px 18px;
  align-items: stretch;
}








.capability-card {
  min-height: 448px;
  height: 100%;
  display: grid;
  grid-template-rows: 190px 1fr;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 7px 22px rgba(32, 33, 36, .055);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}








.capability-card:hover {
  transform: translateY(-3px);
  border-color: rgba(226, 59, 46, .48);
  box-shadow: 0 14px 30px rgba(32, 33, 36, .1);
}








.capability-card__media { min-height: 0; overflow: hidden; background: #e8e8e4; }







.capability-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }







.capability-card:hover .capability-card__media img { transform: scale(1.035); }








.capability-card__body { position: relative; padding: 22px 22px 24px; display: flex; flex-direction: column; }







.card-index { display: flex; align-items: center; gap: 10px; color: var(--red); font-size: 12px; font-weight: 700; letter-spacing: .12em; }







.card-index::after { width: 28px; height: 2px; background: var(--red); content: ""; }







.capability-card h3 { min-height: 50px; margin: 16px 0 10px; font-size: 20px; font-weight: 700; line-height: 1.25; letter-spacing: 0; }







.capability-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.62; }








.specs-section { color: var(--ink); background: #fff; }








.specs-layout {
  display: grid;
  grid-template-columns: minmax(0, .72fr) minmax(560px, 1.28fr);
  gap: clamp(56px, 8vw, 110px);
  align-items: start;
}








.specs-intro { position: sticky; top: 120px; }







.specs-intro > p { margin: 25px 0 0; color: var(--muted); font-size: 16px; line-height: 1.7; }








.spec-callout {
  margin-top: 42px;
  padding-top: 26px;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 18px;
  border-top: 1px solid var(--line);
}








.spec-callout__mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: var(--red);
  border: 1px solid rgba(226, 59, 46, .5);
  border-radius: 50%;
  font-size: 23px;
}








.spec-callout strong { display: block; margin-bottom: 7px; }







.spec-callout p { margin: 0; color: var(--muted); font-size: 14px; }








.spec-table-wrap { overflow: hidden; background: #fff; border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }







.spec-table { width: 100%; border-collapse: collapse; }







.spec-table th, .spec-table td { padding: 22px 24px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }







.spec-table thead th { color: #fff; font-size: 11px; letter-spacing: .13em; text-transform: uppercase; background: #111216; }







.spec-table thead th:first-child { width: 34%; }







.spec-table tbody th { color: var(--ink); font-size: 14px; }







.spec-table tbody td { color: var(--muted); font-size: 14px; }







.spec-table tbody td strong { color: var(--ink); }







.spec-table tbody tr:last-child th, .spec-table tbody tr:last-child td { border-bottom: 0; }







.spec-table tbody tr { transition: background .2s ease; }







.spec-table tbody tr:hover { background: #fafaf8; }







.spec-table__note { margin: 0; padding: 18px 24px; color: var(--muted); background: #f7f7f5; border-top: 1px solid var(--line); font-size: 12px; }







.spec-table__note span { color: var(--red); }








.materials-band { padding-block: var(--section-space); color: var(--ink); background: #fff; border-bottom: 1px solid var(--line); }







.materials-band__inner { padding: clamp(38px, 5vw, 60px); display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; align-items: center; color: #fff; background: #111216; border: 1px solid #111216; border-radius: var(--radius-md); }







.materials-band h2 { margin: 0; }







.materials-band__copy > p { max-width: 720px; margin: 20px 0 0; color: rgba(255, 255, 255, .68); }







.material-links { margin-top: 23px; display: flex; flex-wrap: wrap; gap: 22px; }







.material-links a { color: #fff; font-size: 14px; font-weight: 750; text-decoration-color: var(--red); text-underline-offset: 5px; }







.material-links a:hover { color: var(--red); }







.materials-band__action { padding-left: 55px; border-left: 1px solid rgba(255, 255, 255, .2); }







.materials-band__action > strong { display: block; margin-bottom: 20px; font-size: 18px; }







.materials-band__action > div { display: flex; flex-wrap: wrap; gap: 10px; }







.materials-band .button--ghost { color: #fff; background: transparent; border-color: rgba(255, 255, 255, .55); }







.materials-band .button--ghost:hover { color: var(--ink); background: #fff; border-color: #fff; }







.materials-band .button--primary:hover { color: var(--ink); background: #fff; border-color: #fff; }








.quality-layout {
  display: grid;
  grid-template-columns: minmax(360px, .9fr) minmax(0, 1.1fr);
  gap: clamp(50px, 8vw, 108px);
  align-items: center;
}








.quality-visual { position: relative; min-width: 0; }







.quality-visual__stage { position: relative; }







.quality-visual__stage::before { content: ""; position: absolute; inset: 22px -22px -22px 22px; background: var(--paper-warm); border-radius: var(--radius-md); }







.quality-visual__main { position: relative; z-index: 1; width: 100%; min-height: 560px; display: block; object-fit: cover; border-radius: var(--radius-md); box-shadow: var(--shadow-lg); transition: opacity .18s ease, transform .18s ease; }







.quality-visual__main.is-changing { opacity: .35; transform: scale(.992); }







.quality-visual__badge { position: absolute; z-index: 2; left: -24px; bottom: 38px; padding: 18px 21px; display: grid; color: #fff; background: var(--ink); border-left: 4px solid var(--red); box-shadow: var(--shadow-lg); }







.quality-visual__badge span { color: rgba(255, 255, 255, .55); font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }







.quality-visual__badge strong { margin-top: 2px; font-size: 14px; }








.quality-copy__lead { margin: 24px 0 0; color: var(--muted); font-size: 17px; }







.quality-list { margin: 35px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }







.quality-list li { padding-block: 17px; display: grid; grid-template-columns: 42px 1fr; gap: 14px; border-bottom: 1px solid var(--line); }







.quality-list li > span { color: var(--red); font-size: 12px; font-weight: 850; letter-spacing: .1em; }







.quality-list p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }







.quality-list strong { color: var(--ink); }







.cert-line { margin: 25px 0 0; padding: 18px 20px; color: var(--ink-soft); background: var(--paper-soft); border-left: 3px solid var(--red); font-size: 13px; font-weight: 650; }







.faq-layout { display: grid; grid-template-columns: minmax(260px, .66fr) minmax(0, 1.34fr); gap: clamp(50px, 9vw, 124px); align-items: start; }







.faq-intro { position: sticky; top: 118px; }







.faq-intro > p { margin: 22px 0; color: var(--muted); }







.faq-list { border-top: 1px solid var(--line); }








.final-cta { padding-block: var(--section-space); color: #fff; background: #111216; }







.final-cta__inner { display: grid; grid-template-columns: 1.25fr .75fr; gap: 80px; align-items: end; }







.final-cta p { max-width: 790px; margin: 24px 0 0; color: rgba(255, 255, 255, .61); }







.final-cta__actions { display: grid; gap: 10px; }








.mobile-quote-bar { display: none; }
@media (max-width: 1100px){







  .hero__grid { grid-template-columns: 1fr 1fr; }







  .capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }







  .capability-card { min-height: 420px; }







  .specs-layout { grid-template-columns: 1fr 1.45fr; gap: 48px; }

}
@media (max-width: 900px){







  .shell { width: min(calc(100% - 48px), var(--shell)); }







  .hero__grid { width: min(calc(100% - 48px), var(--shell)); margin-inline: auto; grid-template-columns: 1fr; padding-bottom: 34px; }







  .hero__copy { width: 100%; max-width: 800px; padding: 72px 0 22px; justify-self: start; }







  .hero__visual { min-height: 460px; }







  .quality-layout, .faq-layout { grid-template-columns: 1fr; }







  .capability-card { grid-template-rows: 245px 1fr; }







  .capability-card__media { height: auto; }







  .capability-card__body { min-height: 230px; }







  .specs-layout { grid-template-columns: 1fr; }







  .specs-intro, .faq-intro { position: static; }







  .materials-band__inner { grid-template-columns: 1fr; gap: 38px; }







  .materials-band__action { padding: 34px 0 0; border-top: 1px solid rgba(255, 255, 255, .2); border-left: 0; }







  .quality-visual { max-width: 700px; }







  .quality-visual__main { min-height: 450px; }







  .final-cta__inner { grid-template-columns: 1fr; gap: 38px; }







  .final-cta__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }

}
@media (max-width: 680px){







  :root { --section-space: 56px; }







  body { padding-bottom: 64px; }







  .shell { width: min(calc(100% - 32px), var(--shell)); }







  .hero__grid { width: 100%; min-height: auto; padding: 48px 0 0; gap: 28px; }







  .hero__copy { width: min(calc(100% - 40px), var(--shell)); margin-inline: auto; padding: 0; }







  .breadcrumbs { margin-bottom: 32px; }







  .hero h1 { font-size: clamp(34px, 9.5vw, 38px); }







  .hero__lead { margin-top: 22px; font-size: 15px; line-height: 1.7; }







  .hero__actions { display: grid; }







  .hero__actions .button { width: 100%; }







  .trust-line { gap: 12px; flex-direction: column; }







  .hero__visual { min-height: 330px; }







  .hero__index { top: 0; }







  .section-heading { margin-bottom: 35px; }







  .capability-grid { grid-template-columns: 1fr; }







  .capability-card { grid-template-rows: 230px 1fr; }







  .capability-card__media { height: auto; }







  .capability-card__body { min-height: 0; padding: 25px 22px 26px; }







  .capability-card h3 { min-height: 0; margin: 16px 0 10px; }







  .spec-table-wrap { border: 0; border-radius: 0; }







  .spec-table, .spec-table tbody, .spec-table tr, .spec-table th, .spec-table td { display: block; width: 100%; }







  .spec-table thead { display: none; }







  .spec-table tbody { display: grid; gap: 10px; }







  .spec-table tbody tr { padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: 4px; }







  .spec-table tbody th, .spec-table tbody td { padding: 0; border: 0; }







  .spec-table tbody th { margin-bottom: 7px; color: var(--ink); font-size: 15px; }







  .spec-table tbody td { font-size: 13px; }







  .spec-table__note { margin-top: 12px; border: 1px solid var(--line); border-radius: 4px; }







  .materials-band__inner { width: min(calc(100% - 32px), var(--shell)); padding-inline: 22px; }







  .materials-band__action > div { display: grid; }







  .quality-visual__stage::before { inset: 14px -8px -14px 14px; }







  .quality-visual__main { min-height: 360px; }







  .quality-visual__badge { left: -4px; bottom: 20px; }







  .final-cta__actions { grid-template-columns: 1fr; }







  .mobile-quote-bar { position: fixed; z-index: 200; inset: auto 0 0; height: 64px; display: grid; grid-template-columns: .82fr 1.18fr; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -10px 28px rgba(16, 17, 20, .12); }







  .mobile-quote-bar a { display: grid; place-items: center; color: var(--ink); font-size: 13px; font-weight: 800; text-decoration: none; }







  .mobile-quote-bar a:last-child { color: #fff; background: var(--red); }

}
@media (prefers-reduced-motion: reduce){







  html { scroll-behavior: auto; }







  .cnc-drilling-page *,
  .cnc-drilling-page *::before,
  .cnc-drilling-page *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }

}









/* Source: services/cnc-drilling/cnc-drilling-ui-baseline.css */
:root {
  --xmake-font-sans: "Roboto", Arial, Helvetica, sans-serif;
  --xmake-brand-red: #ea543f;
  --xmake-focus: 3px solid rgba(234, 84, 63, 0.35);
}








.cnc-drilling-page,
.cnc-drilling-page button,
.cnc-drilling-page input,
.cnc-drilling-page textarea,
.foot-container {
  font-family: var(--xmake-font-sans);
}



















/* Approved drilling page type, spacing and action system. */
.cnc-drilling-page {
  width: 100%;
  max-width: 100%;
  margin-top: 0;
}








.cnc-drilling-page :is(h1, h2, h3, h4) {
  font-family: var(--xmake-font-sans);
  font-weight: 700;
}








.cnc-drilling-page .hero h1 {
  font-size: 48px;
  line-height: 1.15;
}








.cnc-drilling-page .button {
  border-radius: 0;
  font-family: var(--xmake-font-sans);
  font-weight: 700;
}








.cnc-drilling-page :is(.hero__actions, .final-cta__actions) .button {
  box-sizing: border-box;
  height: 50px;
  min-height: 50px;
  padding: 0 24px;
  font-size: 15px;
}








.foot-container {
  width: 100%;
  margin-top: 0 !important;
}








.cnc-drilling-page,
.cnc-drilling-page .final-cta {
  margin-bottom: 0 !important;
}
@media (max-width: 1100px) and (min-width: 769px){







  .cnc-drilling-page .hero h1 { font-size: 42px; }

}

@media (max-width: 768px){







  .cnc-drilling-page .hero h1 {
    font-size: 36px;
  }

}
@media (max-width: 680px){








  .cnc-drilling-page .materials-band__inner {
    width: min(calc(100% - 40px), var(--shell));
  }

}
@media (prefers-reduced-motion: reduce){







  .cnc-drilling-page *,
  .cnc-drilling-page *::before,
  .cnc-drilling-page *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

}