.subpage-main { max-width: 100%; overflow: clip; background: var(--paper-light); }
.subpage-main :where(h1, h2, h3, p, li, a, span, strong) { overflow-wrap: anywhere; }
.subpage-main :where(.shell, .subpage-hero__layout, .subpage-hero__copy, .service-page-layout, .service-page-copy, .service-side-nav, .page-cta__inner, .page-cta__actions) { min-width: 0; }
.subpage-hero { position: relative; overflow: hidden; padding: clamp(58px, 7vw, 96px) 0 clamp(68px, 8vw, 110px); background: var(--ink); color: var(--white); }
.subpage-hero::after { content: ""; position: absolute; right: -14vw; bottom: -68%; width: 56vw; min-width: 620px; aspect-ratio: 1; border: 1px solid rgba(239,138,25,.2); border-radius: 50%; pointer-events: none; }
.subpage-hero__layout { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,.8fr) minmax(480px,1.2fr); gap: clamp(48px,7vw,100px); align-items: center; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 7px; color: rgba(255,255,255,.68); font-size: .78rem; }
.breadcrumb a { color: inherit; }
.breadcrumb a:hover { color: var(--orange-light); }
.subpage-hero .eyebrow { margin-top: 34px; color: var(--orange-light); }
.subpage-hero h1 { max-width: 760px; margin-top: 17px; font-size: clamp(3rem,5.3vw,5.4rem); line-height: .96; letter-spacing: -.055em; }
.subpage-hero__lead { max-width: 650px; margin-top: 25px; color: rgba(255,255,255,.78); font-size: clamp(1.03rem,1.35vw,1.2rem); }
.subpage-hero__actions { display: flex; flex-wrap: wrap; gap: 14px 22px; margin-top: 30px; }
.subpage-hero__actions .button, .page-cta__actions .button { max-width: 100%; white-space: normal; text-align: center; }
.subpage-hero__media { min-height: 510px; overflow: hidden; border-radius: 8px 8px 92px 8px; background: #2b2a26; box-shadow: 0 28px 65px rgba(0,0,0,.35); }
.subpage-hero__media picture { display: block; width: 100%; height: 100%; min-height: inherit; }
.subpage-hero__media img { width: 100%; height: 100%; min-height: inherit; object-fit: cover; }
.subpage-hero__media--portrait img { object-position: center 35%; }

.service-page-section { padding: clamp(72px,8vw,116px) 0; }
.service-page-section--paper { background: var(--paper); }
.service-page-layout { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: clamp(58px,8vw,112px); align-items: start; }
.service-page-copy h2 { max-width: 760px; margin-top: 16px; font-size: clamp(2.35rem,4.7vw,4.5rem); line-height: .98; letter-spacing: -.055em; }
.service-page-copy > p { max-width: 760px; margin-top: 23px; color: var(--muted); font-size: 1.05rem; }
.service-points { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; margin-top: 37px; list-style: none; }
.service-points li { min-height: 116px; padding: 22px; border: 1px solid var(--border); border-radius: 7px 7px 28px 7px; background: rgba(255,255,255,.56); }
.service-points strong { display: block; font-size: 1rem; }
.service-points span { display: block; margin-top: 8px; color: var(--muted); font-size: .9rem; }
.service-side-nav { position: sticky; top: 116px; padding: 24px; border: 1px solid var(--border); border-top: 4px solid var(--orange); border-radius: 5px 5px 27px 5px; background: var(--paper); }
.service-side-nav h2 { font-size: 1.05rem; }
.service-side-nav ul { display: grid; gap: 4px; margin-top: 14px; list-style: none; }
.service-side-nav a { display: block; padding: 10px 11px; border-radius: 5px 5px 12px 5px; color: var(--muted); font-size: .86rem; font-weight: 720; }
.service-side-nav a:hover,
.service-side-nav a[aria-current="page"] { color: var(--ink); background: rgba(239,138,25,.13); }

.service-image-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 19px; margin-top: clamp(44px,6vw,72px); }
.service-image-grid figure { min-height: 430px; overflow: hidden; border-radius: 8px 8px 52px 8px; background: #ded8cb; box-shadow: var(--shadow); }
.service-image-grid picture { display: block; width: 100%; height: 100%; }
.service-image-grid img { width: 100%; height: 100%; object-fit: cover; }
.service-image-grid--single { grid-template-columns: minmax(0,860px); justify-content: center; }

.project-gallery-section { padding: clamp(66px, 8vw, 112px) 0; border-top: 1px solid var(--border); background: var(--paper); }
.project-gallery__intro { max-width: 760px; }
.project-gallery__intro h2 { margin-top: 16px; font-size: clamp(2.25rem, 4.5vw, 4.25rem); line-height: .98; letter-spacing: -.052em; }
.project-gallery__intro p { max-width: 680px; margin-top: 20px; color: var(--muted); }
.project-gallery__grid { columns: 3 280px; column-gap: 18px; margin-top: clamp(40px, 5vw, 64px); }
.project-gallery__item { position: relative; break-inside: avoid; margin: 0 0 18px; overflow: hidden; border-radius: 8px 8px 34px 8px; background: #ded8cb; box-shadow: 0 14px 34px rgba(24, 23, 19, .11); }
.project-gallery__item picture { display: block; }
.project-gallery__item img { display: block; width: 100%; height: auto; }
.project-gallery__item figcaption { padding: 13px 16px 15px; color: var(--muted); background: rgba(255, 255, 255, .84); font-size: .82rem; font-weight: 700; line-height: 1.35; }

.service-overview { background: var(--paper-light); }
.service-overview-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 18px; margin-top: clamp(48px,7vw,78px); }
.service-overview-card { grid-column: span 2; min-width: 0; }
.service-overview-card:nth-child(4) { grid-column: 2 / span 2; }
.service-overview-card:nth-child(5) { grid-column: 4 / span 2; }
.service-overview-card a { height: 100%; display: flex; flex-direction: column; overflow: hidden; color: var(--ink); border: 1px solid var(--border); border-radius: 8px 8px 36px 8px; background: var(--paper); transition: transform .22s ease, box-shadow .22s ease; }
.service-overview-card a:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.service-overview-card__media { aspect-ratio: 4 / 3; overflow: hidden; }
.service-overview-card__media picture { display: block; width: 100%; height: 100%; }
.service-overview-card__media img { width: 100%; height: 100%; object-fit: cover; }
.service-overview-card--bad img { object-position: center 35%; }
.service-overview-card__body { flex: 1; padding: 24px 24px 28px; }
.service-overview-card__body span { color: var(--orange-dark); font-size: .72rem; font-weight: 850; letter-spacing: .13em; }
.service-overview-card h2 { margin-top: 14px; font-size: 1.5rem; line-height: 1.08; }
.service-overview-card p { margin-top: 12px; color: var(--muted); font-size: .92rem; }

.page-cta { padding: clamp(64px,7vw,92px) 0; background: var(--ink); color: var(--white); }
.page-cta__inner { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; }
.page-cta h2 { max-width: 760px; font-size: clamp(2rem,4vw,3.8rem); line-height: 1; letter-spacing: -.05em; }
.page-cta p { max-width: 650px; margin-top: 15px; color: rgba(255,255,255,.72); }
.page-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }

@media (max-width: 940px) {
  .subpage-hero__layout { grid-template-columns: 1fr; }
  .subpage-hero__media { min-height: 460px; }
  .service-page-layout { grid-template-columns: 1fr; }
  .service-side-nav { position: static; }
  .service-overview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .service-overview-card, .service-overview-card:nth-child(4), .service-overview-card:nth-child(5) { grid-column: auto; }
}

@media (max-width: 760px) {
  .subpage-hero { padding-top: 42px; }
  .subpage-hero .eyebrow { margin-top: 27px; }
  .subpage-hero h1 { max-width: 100%; font-size: clamp(2.25rem,10.2vw,3.65rem); line-height: 1; letter-spacing: -.045em; }
  .subpage-hero__media { min-height: 340px; border-radius: 6px 6px 54px 6px; }
  .service-points, .service-image-grid, .service-overview-grid { grid-template-columns: 1fr; }
  .service-image-grid figure { min-height: 340px; }
  .page-cta__inner { grid-template-columns: 1fr; }
  .page-cta__actions { align-items: flex-start; flex-direction: column; }
  .page-cta__actions .button { width: 100%; }
  .project-gallery__grid { columns: 2 220px; }
}

@media (max-width: 430px) {
  .subpage-hero h1 { font-size: clamp(2.05rem, 10vw, 2.8rem); }
  .subpage-hero__media { min-height: 300px; }
  .service-points li { min-height: 0; }
  .service-image-grid figure { min-height: 290px; }
  .project-gallery__grid { columns: 1; }
}
