.supporting-page { --orange: #fe9527; min-height: 100svh; display: flex; flex-direction: column; background: #0b0c0b; color: var(--white); isolation: isolate; }
.page-contours { position: fixed; z-index: -1; inset: 0 auto 0 0; width: min(48vw, 75vh); pointer-events: none; opacity: .58; background: url('../concepts/01-still-calibrating-tribrach-v2.jpg') left top / auto 100vh no-repeat; mask-image: linear-gradient(90deg, #000, transparent); }
.supporting-page .calibration-header { position: relative; flex: none; }
.supporting-page .calibration-header nav a:first-child::after { display: none; }
.supporting-page .calibration-header nav a[aria-current="page"] { color: var(--orange); }
.supporting-page .calibration-header .desktop-navigation a[aria-current="page"]::after { content: ""; display: block; position: absolute; left: 18%; right: 18%; bottom: -.85rem; height: 2px; background: var(--orange); }
.page-main { flex: 1; width: min(1140px, calc(100% - 8vw)); margin: 0 auto; padding: clamp(3.5rem, 7vw, 7rem) 0 5rem; }
.page-heading { margin-bottom: 2.4rem; }
.page-heading .eyebrow { color: var(--orange); font-size: .65rem; }
.page-heading h1 { max-width: 18ch; margin: 1.2rem 0 1.6rem; font: 900 clamp(3.3rem, 6.8vw, 6.2rem)/.92 var(--display); letter-spacing: -.025em; }
.heading-rule { display: block; width: 6.5rem; height: 3px; background: var(--orange); }
.page-intro { max-width: 50rem; margin-bottom: 3.7rem; color: #b8bbb6; font-size: 1.13rem; line-height: 1.7; }
.page-intro p { margin: 0 0 .85rem; }
.page-intro .plain-statement { color: var(--white); }
.text-link { display: inline-flex; align-items: center; gap: 1.2rem; max-width: 100%; padding: .8rem 0; color: var(--orange); text-decoration: none; font: 700 .68rem/1.6 var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.text-link:hover { color: var(--white); }
.survey-index { border-top: 1px solid #3c3f36; }
.survey-row { display: grid; grid-template-columns: 3.4rem minmax(9rem, .48fr) minmax(13rem, .72fr) minmax(0, 1.2fr); gap: 1.4rem; align-items: center; padding: 2rem 0; border-bottom: 1px solid #2b2e28; }
.row-number { padding-top: .25rem; color: var(--orange); font: 700 .72rem/1.4 var(--mono); }
.service-row-image { aspect-ratio: 4 / 3; overflow: hidden; margin: 0; border: 1px solid #3d4037; background: #151713; }
.service-row-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 260ms ease; }
.service-row-image.image-construction img { object-position: 56% center; }
.service-row-image.image-topographical img { object-position: center 48%; }
.service-row-image.image-verification img { object-position: center center; }
.survey-row h2 { margin: 0; font: 800 clamp(1.55rem, 2.3vw, 2.15rem)/1.05 var(--display); text-transform: uppercase; }
.row-copy { color: #b8bbb6; font-size: 1rem; line-height: 1.75; }
.row-copy p { margin: 0 0 .85rem; }
.row-copy p:last-child { margin-bottom: 0; }
.page-enquiry { margin-top: 4rem; padding-top: 2.5rem; border-top: 2px solid var(--orange); }
.page-enquiry > h2 { margin: 1rem 0 1.5rem; font: 800 clamp(2.2rem, 4.5vw, 4rem)/1 var(--display); }
.page-enquiry > p:not(.eyebrow):not(.enquiry-line) { max-width: 47rem; color: #b8bbb6; line-height: 1.7; }
.page-enquiry .enquiry-line { margin: 2rem 0; color: var(--white); font: 700 clamp(1.25rem, 2.3vw, 2rem)/1.3 var(--display); }
.contact-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #494735; border-bottom: 1px solid #494735; margin: 1.5rem 0 1rem; }
.contact-action { min-width: 0; min-height: 7rem; display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; padding: 1.35rem 1.1rem; border: 0; border-right: 1px solid #34362e; border-radius: 0; background: rgba(254,149,39,.035); text-decoration: none; text-align: left; }
.contact-action:last-child { border-right: 0; }
.contact-action strong { color: var(--orange); font: 800 clamp(1.5rem, 2.7vw, 2.3rem)/1 var(--display); }
.contact-action span { color: #aeb2a9; font: .75rem/1.5 var(--body); }
.contact-action .contact-person { display: block; margin-bottom: .12rem; color: var(--white); font-size: .9rem; }
.direct-contact .contact-action[href^="https://wa.me/"] { background: var(--orange); }
.direct-contact .contact-action[href^="https://wa.me/"] strong,
.direct-contact .contact-action[href^="https://wa.me/"] span { color: #11170c; }
.contact-action[href] { transition: background-color 180ms ease; }
.contact-action[href]:hover { background-color: rgba(254,149,39,.12); }
.direct-contact .contact-action[href^="https://wa.me/"]:hover { background-color: #ffad53; }
.text-link { text-underline-offset: .3em; }
.text-link:hover { text-decoration: underline; }
.contact-action:disabled { cursor: not-allowed; opacity: 1; }
.contact-pending { color: #aeb2a9; font-size: .86rem; line-height: 1.65; }
.direct-contact > h2 { margin: 0 0 2rem; color: #b8bbb6; font: 800 clamp(1.85rem, 3.8vw, 3.5rem)/1.12 var(--display); }
.direct-contact > h2 span { color: var(--orange); }
.direct-contact .contact-action { min-height: 8rem; padding-block: 1.65rem; }
.contact-information { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem, 7vw, 7rem); margin-top: 4rem; padding-top: 2.4rem; border-top: 1px solid #34382e; }
.contact-information h2 { margin: 1rem 0 1.1rem; font: 800 clamp(1.7rem, 2.8vw, 2.5rem)/1.12 var(--display); }
.contact-information p, .contact-information li { color: #b8bbb6; line-height: 1.7; }
.contact-legal { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem 1.25rem; margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid #34382e; color: #81877d; font: 700 .65rem/1.5 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.contact-legal span { margin-right: auto; }
.contact-legal a { color: #adb2a9; text-decoration: none; }
.contact-legal a:hover, .contact-legal a:focus-visible { color: var(--orange); }
.enquiry-list { padding: 0 0 0 1.2rem; margin-bottom: 1rem; }
.enquiry-list li { padding: .3rem 0; }
.enquiry-list li::marker { color: var(--orange); }
.service-area-list { list-style: none; padding: 0; margin: 1.1rem 0; }
.service-area-list li { padding: .4rem 0; border-bottom: 1px solid #292d25; }
.supporting-page .calibration-footer { position: relative; flex: none; min-height: 4.4rem; line-height: 1.5; }
.service-tool-link { margin-top: 2.5rem; border-top: 1px solid #34382e; padding-top: 1.5rem; }
.service-tool-link p { color: #b8bbb6; font-size: .95rem; line-height: 1.6; margin-bottom: .2rem; }
.service-row-link { color: inherit; text-decoration: none; transition: background-color 180ms ease, padding-inline 180ms ease; }
.service-row-link:hover { padding-inline: 1rem; background: rgba(254,149,39,.055); }
.service-row-link:hover .service-row-image img { transform: scale(1.035); }
.service-row-link .row-copy::after { content: "VIEW SERVICE  →"; display: block; margin-top: 1rem; color: var(--orange); font: 800 .66rem/1.4 var(--mono); letter-spacing: .08em; }
.secondary-services { margin-top: 2.5rem; padding: 1.6rem 0; border-top: 1px solid #34382e; border-bottom: 1px solid #34382e; }
.secondary-services h2 { margin: 0 0 .75rem; color: var(--white); font: 800 clamp(1.5rem, 2.4vw, 2rem)/1.1 var(--display); text-transform: uppercase; }
.secondary-services p { max-width: 52rem; margin: 0; color: #aeb2a9; line-height: 1.7; }

.service-detail-main { width: min(1180px, calc(100% - 8vw)); }
.service-breadcrumb { margin-bottom: 2.2rem; }
.service-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: end; }
.service-hero-copy h1 { max-width: 11ch; margin: 1rem 0 1.5rem; font: 900 clamp(3.5rem, 6.8vw, 6.6rem)/.88 var(--display); letter-spacing: -.03em; text-transform: uppercase; }
.service-hero-copy .service-lead { max-width: 43rem; margin: 0; color: #c0c3bd; font-size: clamp(1.12rem, 1.8vw, 1.35rem); line-height: 1.6; }
.service-hero-copy .service-truth { max-width: 42rem; margin: 1.5rem 0 0; padding-left: 1rem; border-left: 3px solid var(--orange); color: var(--white); font: 800 clamp(1.05rem, 1.65vw, 1.3rem)/1.4 var(--display); }
.service-image-slot { min-height: clamp(22rem, 45vw, 35rem); display: flex; flex-direction: column; justify-content: flex-end; padding: 1.4rem; border: 1px solid #46483e; background: linear-gradient(145deg, rgba(254,149,39,.09), rgba(10,11,10,.2)), repeating-linear-gradient(135deg, transparent 0 22px, rgba(255,255,255,.035) 22px 23px); }
.service-image-slot span { color: var(--orange); font: 800 .62rem/1.5 var(--mono); letter-spacing: .12em; }
.service-image-slot strong { max-width: 28rem; margin-top: .45rem; color: #d8dad4; font: 800 clamp(1.25rem, 2vw, 1.8rem)/1.15 var(--display); text-transform: uppercase; }
.service-image-live { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; background: #111; }
.service-image-live::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 45%, rgba(6,7,6,.88) 100%); }
.service-image-live img { display: block; width: 100%; height: 100%; min-height: inherit; object-fit: cover; }
.service-image-live figcaption { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 1.4rem; }
.image-construction img { object-position: 56% center; }
.image-topographical img { object-position: center center; }
.image-verification img { object-position: center center; }
.service-sections { margin-top: clamp(4rem, 8vw, 7rem); border-top: 1px solid #3c3f36; }
.service-section { display: grid; grid-template-columns: minmax(12rem, .72fr) minmax(0, 1.28fr); gap: clamp(2rem, 6vw, 6rem); padding: clamp(2.2rem, 5vw, 4.25rem) 0; border-bottom: 1px solid #2b2e28; }
.service-section h2 { margin: 0; font: 800 clamp(1.9rem, 3.3vw, 3rem)/1 var(--display); text-transform: uppercase; }
.service-section-body { color: #b8bbb6; font-size: 1.02rem; line-height: 1.75; }
.service-section-body > :first-child { margin-top: 0; }
.service-section-body > :last-child { margin-bottom: 0; }
.service-checklist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 2rem; padding: 0; margin: 0; list-style: none; }
.service-checklist li { position: relative; padding: .65rem 0 .65rem 1.25rem; border-bottom: 1px solid #292d25; }
.service-checklist li::before { content: "+"; position: absolute; left: 0; color: var(--orange); font-weight: 900; }
.project-slot { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(15rem, .8fr); gap: 2rem; padding: 2rem; border: 1px solid #3f4238; background: rgba(254,149,39,.035); }
.project-slot-copy .eyebrow { margin-bottom: 1rem; }
.project-slot-copy h3 { margin: 0 0 1rem; font: 800 clamp(1.8rem, 3vw, 2.7rem)/1 var(--display); text-transform: uppercase; }
.project-slot-copy p { margin: 0; color: #aeb2a9; line-height: 1.7; }
.project-slot-notes { margin: 0; padding: 0; list-style: none; }
.project-slot-notes li { padding: .55rem 0; border-bottom: 1px solid #34362e; color: #d5d7d1; font: 700 .72rem/1.5 var(--mono); }
.service-section--spotlight { grid-template-columns: minmax(12rem, .42fr) minmax(0, 1.58fr); }
.project-spotlight { overflow: hidden; border: 1px solid #3f4238; background: #0e100e; }
.project-spotlight figure { margin: 0; }
.project-spotlight img { display: block; width: 100%; height: 100%; object-fit: cover; }
.project-spotlight-hero { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #171916; }
.project-spotlight-hero img { object-position: center 31%; }
.project-spotlight--topographical .project-spotlight-hero img { object-position: center 50%; }
.project-spotlight--verification .project-spotlight-hero img { object-position: center 58%; }
.project-spotlight-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 52%, rgba(4,5,4,.84) 100%); }
.project-spotlight-hero figcaption { position: absolute; z-index: 1; right: 1.4rem; bottom: 1.2rem; left: 1.4rem; color: var(--orange); font: 800 .64rem/1.5 var(--mono); letter-spacing: .12em; }
.project-spotlight-story { padding: clamp(1.5rem, 4vw, 3rem); }
.project-spotlight-story h3 { max-width: 17ch; margin: .8rem 0 1.2rem; color: var(--white); font: 900 clamp(2rem, 4vw, 3.6rem)/.96 var(--display); letter-spacing: -.02em; text-transform: uppercase; }
.project-spotlight-story > p:not(.eyebrow):not(.project-spotlight-truth) { max-width: 50rem; }
.project-spotlight-truth { max-width: 42rem; margin: 1.5rem 0 0; padding-left: 1rem; border-left: 3px solid var(--orange); color: var(--white); font: 800 clamp(1.05rem, 1.8vw, 1.35rem)/1.4 var(--display); }
.project-spotlight-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 2rem 0 0; background: #383b33; }
.project-spotlight-facts div { min-width: 0; padding: 1rem; background: #121411; }
.project-spotlight-facts dt { margin-bottom: .4rem; color: var(--orange); font: 800 .58rem/1.4 var(--mono); letter-spacing: .1em; }
.project-spotlight-facts dd { margin: 0; color: #d9dbd5; font: 800 .9rem/1.35 var(--display); text-transform: uppercase; }
.project-spotlight-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: #3f4238; }
.project-spotlight-gallery figure { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #171916; }
.project-spotlight-gallery img { object-position: center 58%; }
.project-spotlight--topographical .project-spotlight-gallery img { object-position: center 48%; }
.project-spotlight-gallery figure::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 55%, rgba(4,5,4,.82) 100%); }
.project-spotlight-gallery figcaption { position: absolute; z-index: 1; right: 1rem; bottom: .9rem; left: 1rem; color: #fff; font: 800 .58rem/1.4 var(--mono); letter-spacing: .08em; }
.service-next { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 3rem; border-top: 1px solid #3c3f36; border-bottom: 1px solid #3c3f36; }
.service-next a { padding: 1.5rem; color: #c7cac3; text-decoration: none; border-right: 1px solid #34362e; }
.service-next a:last-child { border-right: 0; }
.service-next small { display: block; margin-bottom: .6rem; color: var(--orange); font: 800 .58rem/1.4 var(--mono); letter-spacing: .1em; }
.service-next strong { font: 800 clamp(1.25rem, 2vw, 1.7rem)/1.15 var(--display); text-transform: uppercase; }
.service-next a:hover { background: rgba(254,149,39,.08); }

/* Location hub and local landing pages */
.location-hub-intro { max-width: 58rem; }
.location-group { margin-top: 4rem; }
.location-group-heading { display: grid; grid-template-columns: minmax(0, .72fr) minmax(18rem, 1.28fr); gap: clamp(2rem, 6vw, 6rem); align-items: end; margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid #3c3f36; }
.location-group-heading h2 { max-width: 13ch; margin: .8rem 0 0; font: 900 clamp(2.1rem, 4.2vw, 4rem)/.94 var(--display); text-transform: uppercase; }
.location-group-heading > p { margin: 0; color: #aeb2a9; line-height: 1.7; }
.location-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: #34372f; border: 1px solid #34372f; }
.location-card { min-height: 17rem; display: flex; flex-direction: column; padding: clamp(1.4rem, 3vw, 2.2rem); color: inherit; background: #10120f; text-decoration: none; transition: background-color 180ms ease; }
.location-card:hover { background: #171a15; }
.location-card .location-card-number { color: var(--orange); font: 800 .65rem/1.4 var(--mono); letter-spacing: .1em; }
.location-card h3 { max-width: 15ch; margin: auto 0 1rem; font: 900 clamp(1.8rem, 3vw, 2.7rem)/.98 var(--display); text-transform: uppercase; }
.location-card p { max-width: 35rem; margin: 0; color: #aeb2a9; line-height: 1.6; }
.location-card .location-card-link { margin-top: 1.2rem; color: var(--orange); font: 800 .63rem/1.4 var(--mono); letter-spacing: .09em; }
.coverage-principle { display: grid; grid-template-columns: minmax(0, .8fr) minmax(18rem, 1.2fr); gap: clamp(2rem, 6vw, 6rem); margin-top: 4rem; padding: clamp(2rem, 5vw, 4rem); border-left: 3px solid var(--orange); background: rgba(254,149,39,.045); }
.coverage-principle blockquote { margin: .8rem 0 0; color: var(--white); font: 900 clamp(2rem, 4vw, 3.7rem)/.98 var(--display); }
.coverage-principle-copy { color: #b8bbb6; line-height: 1.75; }
.coverage-principle-copy h2 { margin-top: 0; color: var(--white); font: 900 clamp(1.7rem, 3vw, 2.7rem)/1 var(--display); text-transform: uppercase; }

.location-detail-main { width: min(1180px, calc(100% - 8vw)); }
.location-hero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(19rem, .8fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: end; }
.location-hero-copy h1 { max-width: 13ch; margin: 1rem 0 1.6rem; font: 900 clamp(3.3rem, 6.2vw, 6rem)/.9 var(--display); letter-spacing: -.03em; text-transform: uppercase; }
.location-lead { max-width: 48rem; margin: 0; color: #c0c3bd; font-size: clamp(1.1rem, 1.8vw, 1.35rem); line-height: 1.65; }
.location-truth { max-width: 44rem; margin: 1.6rem 0 0; padding-left: 1rem; border-left: 3px solid var(--orange); color: var(--white); font: 800 clamp(1.05rem, 1.7vw, 1.3rem)/1.45 var(--display); }
.location-ground { padding: clamp(1.4rem, 3vw, 2.2rem); border: 1px solid #44473d; background: rgba(17,19,16,.82); }
.location-ground h2 { margin: .9rem 0 1.3rem; font: 900 clamp(1.8rem, 3vw, 2.8rem)/1 var(--display); text-transform: uppercase; }
.location-ground ul { list-style: none; margin: 0 0 1.2rem; padding: 0; border-top: 1px solid #34372f; }
.location-ground li { padding: .58rem 0; border-bottom: 1px solid #34372f; color: #d4d7d0; }
.location-ground li a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: inherit; text-decoration: none; transition: color .18s ease, padding-left .18s ease; }
.location-ground li a span { color: var(--orange); font: 800 .75rem/1 var(--mono); }
.location-ground li a:hover, .location-ground li a:focus-visible { padding-left: .35rem; color: var(--orange); }
.location-ground > p:last-child { margin-bottom: 0; color: #888e84; font-size: .83rem; line-height: 1.6; }
.location-krugersdorp-west-rand .location-hero { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(34rem, 64vh, 46rem); margin-top: 1.2rem; padding: clamp(2rem, 5vw, 4.5rem); border: 1px solid #34372f; }

.location-krugersdorp-west-rand .location-hero::after { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(7,8,7,.93) 0%, rgba(7,8,7,.84) 44%, rgba(7,8,7,.62) 72%, rgba(7,8,7,.5) 100%); }
.location-krugersdorp-west-rand .location-hero-copy { text-shadow: 0 2px 24px rgba(0,0,0,.55); }
.location-krugersdorp-west-rand .location-ground { backdrop-filter: blur(5px); background: rgba(12,14,11,.78); }
.location-sections { margin-top: clamp(4rem, 8vw, 7rem); border-top: 1px solid #3c3f36; }
.location-section { display: grid; grid-template-columns: minmax(14rem, .7fr) minmax(0, 1.3fr); gap: clamp(2rem, 6vw, 6rem); padding: clamp(2.5rem, 5vw, 4.5rem) 0; border-bottom: 1px solid #2b2e28; }
.location-section h2 { max-width: 15ch; margin: .8rem 0 0; font: 900 clamp(1.9rem, 3.5vw, 3.2rem)/.98 var(--display); text-transform: uppercase; }
.location-copy { color: #b8bbb6; font-size: 1.03rem; line-height: 1.75; }
.location-copy > :first-child { margin-top: 0; }
.area-pulse { padding: clamp(3rem, 6vw, 5.5rem) 0; border-bottom: 1px solid #2b2e28; }
.area-pulse-intro { display: grid; grid-template-columns: minmax(14rem, .7fr) minmax(0, 1.3fr); gap: .85rem clamp(2rem, 6vw, 6rem); align-items: start; }
.area-pulse-intro .eyebrow { grid-column: 1; }
.area-pulse-intro h2 { grid-column: 1; max-width: 15ch; margin: 0; font: 900 clamp(2rem, 4vw, 3.7rem)/.94 var(--display); text-transform: uppercase; }
.area-pulse-intro > p:not(.eyebrow) { grid-column: 2; grid-row: 1 / span 2; margin: 0; color: #c2c5bf; font-size: 1.08rem; line-height: 1.75; }
.area-pulse-intro small { grid-column: 2; color: #777d73; font: 700 .6rem/1.5 var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.area-pulse-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: clamp(2.5rem, 5vw, 4.5rem); border: 1px solid #34372f; background: #34372f; }
.area-pulse-card { position: relative; min-width: 0; padding: clamp(1.4rem, 3vw, 2.2rem); background: #111310; }
.area-pulse-number { display: block; margin-bottom: 2.8rem; color: var(--orange); font: 900 1rem/1 var(--mono); }
.area-pulse-card h3 { margin: .75rem 0 1rem; font: 900 clamp(1.45rem, 2.4vw, 2.15rem)/1 var(--display); text-transform: uppercase; }
.area-pulse-card > p:not(.eyebrow) { color: #aeb2a9; font-size: .92rem; line-height: 1.65; }
.area-pulse-links { display: flex; flex-wrap: wrap; gap: .65rem 1rem; margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid #34372f; }
.area-pulse-links a { color: var(--orange); font: 700 .58rem/1.5 var(--mono); letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.area-pulse-links a:hover { color: var(--white); }
.area-pulse-sources { margin-top: 1.5rem; }
.location-services { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: #34372f; border: 1px solid #34372f; }
.location-services a { min-width: 0; display: flex; flex-direction: column; color: inherit; background: #111310; text-decoration: none; }
.location-services img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(.75) contrast(1.04); }
.location-services span { margin: 1.1rem 1.1rem .5rem; color: var(--orange); font: 800 .62rem/1.4 var(--mono); }
.location-services h3 { margin: 0 1.1rem .7rem; font: 900 clamp(1.25rem, 2vw, 1.7rem)/1.05 var(--display); text-transform: uppercase; }
.location-services p { margin: 0 1.1rem 1.3rem; color: #aeb2a9; font-size: .88rem; line-height: 1.55; }
.location-services a:hover { background: #181b16; }
.location-evidence { background: linear-gradient(90deg, rgba(254,149,39,.045), transparent 75%); }
.portfolio-note { margin-top: 1.8rem; padding-top: 1.2rem; border-top: 1px solid #383b33; font-size: .9rem; }
.portfolio-note strong, .portfolio-note span { color: var(--orange); }
.portfolio-teaser { appearance: none; padding: 0; border: 0; border-bottom: 1px solid currentColor; background: none; color: var(--orange); font: inherit; font-weight: 800; cursor: pointer; }
.portfolio-teaser:hover, .portfolio-teaser:focus-visible { color: #fff; }
.portfolio-dialog { width: min(36rem, calc(100vw - 2rem)); padding: 0; border: 1px solid #4a4d43; background: #11130f; color: #f4f3ee; box-shadow: 0 2rem 6rem rgba(0,0,0,.65); }
.portfolio-dialog::backdrop { background: rgba(5,6,4,.82); backdrop-filter: blur(4px); }
.portfolio-dialog-inner { position: relative; padding: clamp(2rem, 6vw, 4rem); border-top: 3px solid var(--orange); }
.portfolio-dialog .eyebrow { margin: 0 0 1rem; }
.portfolio-dialog h2 { max-width: 11ch; margin: 0 0 1.2rem; font: 900 clamp(2.3rem, 7vw, 4.6rem)/.88 var(--display); letter-spacing: -.025em; text-transform: uppercase; }
.portfolio-dialog p:not(.eyebrow) { max-width: 34rem; margin: 0; color: #b9bcb4; line-height: 1.7; }
.portfolio-dialog-close { margin-top: 2rem; padding: .8rem 1rem; border: 1px solid var(--orange); background: var(--orange); color: #0b0c09; font: 800 .68rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.portfolio-dialog-close:hover, .portfolio-dialog-close:focus-visible { background: #fff; border-color: #fff; }
.ground-note { position: relative; overflow: hidden; background: linear-gradient(135deg, rgba(254,149,39,.085), rgba(254,149,39,.018) 58%, transparent); }
.ground-note::after { content: "COORDINATES / CONTEXT / MEMORY"; position: absolute; right: 0; bottom: 1.3rem; color: rgba(244,243,238,.055); font: 900 clamp(1.9rem, 4.5vw, 4.8rem)/.85 var(--display); letter-spacing: -.02em; pointer-events: none; }
.ground-note .location-copy { position: relative; z-index: 1; }
.ground-note-sources { display: flex; flex-wrap: wrap; gap: .65rem 1.1rem; margin-top: 1.8rem; padding-top: 1rem; border-top: 1px solid #3a3d34; font: 700 .58rem/1.5 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.ground-note-sources span { color: #777d73; }
.ground-note-sources a { color: var(--orange); text-decoration: none; }
.ground-note-sources a:hover { color: var(--white); }
.sunshine-referral { margin-inline: calc(50% - 50vw); padding-inline: max(4vw, calc((100vw - 1180px) / 2)); background: #f0eee7; color: #11130f; }
.sunshine-referral .eyebrow { color: #b96108; }
.sunshine-referral blockquote { margin: 1rem 0 0; font: 900 clamp(2.2rem, 4.5vw, 4.2rem)/.96 var(--display); }
.sunshine-referral .location-copy { color: #373a34; }
.sunshine-referral .location-copy h2 { color: #11130f; }
.sunshine-referral .location-truth { color: #11130f; border-left-color: #d46d08; }
.location-next a { min-height: 7rem; display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 760px) {
  .page-contours { width: 100%; }
  .page-main { width: calc(100% - 2.8rem); padding-top: 3rem; padding-bottom: 3.5rem; }
  .page-heading h1 { font-size: clamp(2.75rem, 12vw, 4.2rem); line-height: .98; overflow-wrap: break-word; }
  .page-heading { margin-bottom: 1.8rem; }
  .page-intro { margin-bottom: 2.3rem; font-size: 1.05rem; }
  .survey-row { grid-template-columns: 2rem minmax(0, 1fr); gap: .7rem 1rem; padding-block: 1.6rem; }
  .service-row-image { grid-column: 2; aspect-ratio: 16 / 9; }
  .survey-row h2 { grid-column: 2; }
  .row-copy { grid-column: 2; font-size: 1rem; line-height: 1.65; }
  .survey-row h2 { font-size: 1.65rem; }
  .page-enquiry { margin-top: 2.5rem; padding-top: 2rem; }
  .contact-actions { grid-template-columns: 1fr; }
  .contact-action, .direct-contact .contact-action { min-height: 6rem; padding: 1.2rem 1rem; border-right: 0; border-bottom: 1px solid #34362e; }
  .contact-action:last-child { border-bottom: 0; }
  .contact-action strong { font-size: 1.8rem; }
  .contact-information { grid-template-columns: minmax(0, 1fr); margin-top: 2.5rem; gap: 2.5rem; }
  .contact-legal span { flex-basis: 100%; }
  .business-information { border-top: 1px solid #34382e; padding-top: 2rem; }
  .supporting-page .calibration-footer { padding: 1.2rem 1.4rem; font-size: .4rem; }
  .service-row-link:hover { padding-inline: 0; }
  .service-detail-main { width: calc(100% - 2.8rem); }
  .service-hero { grid-template-columns: minmax(0, 1fr); gap: 2.4rem; }
  .service-hero-copy h1 { font-size: clamp(3rem, 15vw, 4.8rem); }
  .service-image-slot { min-height: 23rem; }
  .service-section { grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
  .service-checklist { grid-template-columns: minmax(0, 1fr); }
  .project-slot { grid-template-columns: minmax(0, 1fr); padding: 1.4rem; }
  .service-section--spotlight { grid-template-columns: minmax(0, 1fr); }
  .project-spotlight-hero { aspect-ratio: 4 / 3; }
  .project-spotlight-facts { grid-template-columns: minmax(0, 1fr); }
  .project-spotlight-gallery { grid-template-columns: minmax(0, 1fr); }
  .project-spotlight-gallery figure { aspect-ratio: 4 / 3; }
  .service-next { grid-template-columns: minmax(0, 1fr); }
  .service-next a { border-right: 0; border-bottom: 1px solid #34362e; }
  .service-next a:last-child { border-bottom: 0; }
  .location-group-heading, .coverage-principle, .location-hero, .location-section { grid-template-columns: minmax(0, 1fr); }
  .location-card-grid, .location-services, .area-pulse-grid { grid-template-columns: minmax(0, 1fr); }
  .location-card { min-height: 14rem; }
  .location-detail-main { width: calc(100% - 2.8rem); }
  .location-hero-copy h1 { font-size: clamp(2.8rem, 14vw, 4.6rem); }
  .location-krugersdorp-west-rand .location-hero { min-height: auto; padding: 1.5rem; }
  
  .location-krugersdorp-west-rand .location-hero::after { background: rgba(7,8,7,.78); }
  .location-section { gap: 1.5rem; }
  .area-pulse-intro { grid-template-columns: minmax(0, 1fr); }
  .area-pulse-intro .eyebrow, .area-pulse-intro h2, .area-pulse-intro > p:not(.eyebrow), .area-pulse-intro small { grid-column: 1; grid-row: auto; }
  .sunshine-referral { margin-inline: calc(50% - 50vw); padding-inline: 1.4rem; }
}
