/* Process page only: shared site styles remain unchanged. */
html:has(.process-page) { scroll-behavior: auto; }
.process-page .page-hero { background-image: url('../images/pics/30233797.jpeg'); background-position: center 45%; }
.process-page .page-hero .hero-overlay { background: linear-gradient(90deg, #101416ef 0%, #101416c9 48%, #10141650 100%); }
.process-page .page-hero .hero-content { padding-top: 36px; padding-bottom: 72px; }
.process-page .page-hero h1 { max-width: 850px; }
.process-page .page-hero h1 span { color: #dfb675; }
.process-page .page-lead { max-width: 620px; }
.process-page .process-overview { padding-bottom: 0; }
.process-phases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 42px; }
.process-phases figure { margin: 0; background: #171b1e; color: white; }
.process-phases img { width: 100%; height: 230px; object-fit: cover; }
.process-phases figcaption { display: flex; align-items: center; gap: 15px; padding: 20px; font-weight: 600; }
.process-phases figcaption span { color: #dfb675; font-size: .72rem; letter-spacing: .12em; }
.process-page #build-stages { background: #f5f3ee; margin-top: 72px; }
.process-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 58px; align-items: start; }
.process-index { position: sticky; top: 106px; }
.process-page .process-index h2 { font-size: 1.9rem; margin-bottom: 22px; }
.process-index nav { display: grid; }
.process-index nav a { display: flex; align-items: center; gap: 14px; border-bottom: 1px solid #dcd6cb; padding: 14px 0; font-size: .85rem; font-weight: 600; }
.process-index nav a span { color: #87602c; font-size: .75rem; font-variant-numeric: tabular-nums; }
.process-index nav a:hover { color: #81551f; }
.process-index a:focus-visible { outline: 3px solid #a8732d; outline-offset: 4px; }
.process-page .process-index > p:last-child { color: #62666a; font-size: .8rem; margin-top: 24px; }
.process-page .build-stages > li { position: relative; grid-template-columns: 64px minmax(0, 1fr); gap: 24px; border: 0; margin: 0; padding: 0 0 36px; scroll-margin-top: 110px; }
.process-page .build-stages > li::before { content: ''; position: absolute; width: 1px; top: 64px; bottom: 0; left: 31px; background: #d2bb97; }
.process-page .build-stages > li:last-child::before { display: none; }
.process-page .build-stages > li:last-child { padding-bottom: 0; }
.process-page .build-stage-marker { position: relative; z-index: 1; }
.process-page .build-stage-marker > span { width: 64px; height: 64px; background: #191d20; color: #dfb675; font-size: 2rem; border-bottom: 2px solid #c99a52; }
.process-page .build-stage-marker small { background: #f5f3ee; font-size: .7rem; text-align: center; padding: 6px 0; margin: 0; }
.process-page .build-stages article { background: white; padding: clamp(22px, 3vw, 36px); border: 1px solid #e7e1d6; box-shadow: 0 8px 28px #171b1e04; }
.process-page .build-stages h2 { font-size: clamp(1.3rem, 2.2vw, 1.8rem); line-height: 1.3; }
.process-page .build-stages article > p { font-size: .93rem; }
.process-page .stage-details { gap: 22px; padding-top: 22px; border-top: 1px solid #e8e3da; }
.process-page .stage-details > div { padding-left: 12px; }
.process-page .stage-details dt { font-size: .73rem; letter-spacing: .04em; text-transform: uppercase; color: #805925; }
.process-page .stage-details dd { font-size: .85rem; }
.process-ready { background: #191d20; color: white; }
.process-ready-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.process-page .process-ready h2 { color: white; }
.process-page .process-ready p:not(.eyebrow) { color: #d1d3d4; }
.process-checklist { list-style: none; margin: 0; padding: 0; counter-reset: ready; }
.process-checklist li { counter-increment: ready; display: grid; grid-template-columns: 36px 1fr; gap: 16px; padding: 20px 0; border-bottom: 1px solid #ffffff24; }
.process-checklist li::before { content: '0' counter(ready); color: #dfb675; font-size: .8rem; padding-top: 3px; }
.process-checklist strong { display: block; }
.process-checklist span { display: block; color: #bfc4c7; font-size: .875rem; margin-top: 5px; }
@media (max-width: 900px) {
  .process-layout { grid-template-columns: 1fr; gap: 32px; }
  .process-index { position: static; }
  .process-index nav { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 20px; }
  .process-index > p:last-child { max-width: 580px; }
  .process-ready-grid { gap: 32px; }
  .process-phases img { height: 180px; }
}
@media (max-width: 600px) {
  .process-page .page-hero .hero-content { padding-bottom: 44px; }
  .process-page .page-hero h1 { font-size: clamp(2.2rem, 9.4vw, 3.2rem); }
  .process-phases { gap: 8px; margin-top: 30px; }
  .process-phases img { height: 125px; }
  .process-phases figcaption { display: block; padding: 12px 8px; font-size: .75rem; }
  .process-phases figcaption span { display: block; font-size: .6rem; margin-bottom: 4px; }
  .process-page #build-stages { margin-top: 44px; }
  .process-index nav { grid-template-columns: 1fr 1fr; gap: 0 16px; }
  .process-index nav a { font-size: .78rem; gap: 10px; }
  .process-page .build-stages > li { grid-template-columns: 1fr; gap: 0; padding-bottom: 28px; }
  .process-page .build-stages > li::before { display: none; }
  .process-page .build-stage-marker { gap: 12px; }
  .process-page .build-stage-marker > span { width: 46px; height: 46px; font-size: 1.5rem; }
  .process-page .build-stage-marker small { font-size: .78rem; }
  .process-page .build-stages article { padding: 24px 20px; }
  .process-page .stage-details { grid-template-columns: 1fr; gap: 18px; }
  .process-ready-grid { grid-template-columns: 1fr; gap: 20px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
