/* Ropeaccess: maritime blue, brushed steel, workwear yellow. Typography:
   Barlow Condensed for the scale of industrial structures; Manrope for technical clarity.
   One cinematic hero, then a calm light/dark rhythm. Motion follows user actions. */
:root {
  --navy:#102532;
  --navy-light:#193443;
  --ink:#162e3b;
  --muted:#63717a;
  --paper:#f5f6f3;
  --white:#fff;
  --yellow:#f2cc55;
  --yellow-hover:#ffdb6d;
  --line:#d9dfdd;
  --font:'Manrope',Arial,sans-serif;
  --display:'Barlow Condensed','Arial Narrow',sans-serif;
  --container:1320px;
  --header-height:100px;
  --gutter:clamp(24px,5vw,88px)
}
*,*::before,*::after {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-height) + 16px)
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font);
  font-size:15px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased
}
body.no-scroll {
  overflow:hidden
}
::selection {
  background:var(--yellow);
  color:var(--navy)
}
a {
  color:inherit;
  text-decoration:none
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
button:disabled {
  cursor:default
}
button {
  color:inherit
}
a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid #d6a825;
  outline-offset:6px
}
h1,h2,h3,p {
  margin:0
}
h1,h2 {
  font-family:var(--display);
  font-weight:600;
  letter-spacing:-.025em;
  line-height:1
}
h2 {
  font-size:clamp(46px,5.1vw,76px)
}
h3 {
  font-weight:700;
  line-height:1.35;
  letter-spacing:-.025em
}
p {
  max-width:70ch
}
svg {
  display:block;
  width:24px;
  height:24px;
  flex-shrink:0
}
img {
  display:block;
  max-width:100%;
  object-fit:cover
}
ul,ol {
  margin:0;
  padding:0;
  list-style:none
}
.container {
  width:100%;
  max-width:calc(var(--container) + var(--gutter)*2);
  padding-inline:var(--gutter);
  margin-inline:auto
}
.section {
  padding-block:clamp(80px,8.3vw,128px)
}
.eyebrow {
  font-size:12px;
  font-weight:700;
  color:var(--muted);
  margin-bottom:22px
}
.light-eyebrow {
  color:#acbbc3
}
.lead {
  font-size:clamp(19px,1.6vw,23px);
  line-height:1.65;
  letter-spacing:-.025em
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:40px;
  margin-bottom:52px
}
.section-heading>p {
  color:var(--muted);
  font-size:14px;
  padding-bottom:6px
}
.text-link {
  display:inline-flex;
  align-items:center;
  gap:20px;
  font-size:13px;
  font-weight:700;
  line-height:1.5;
  padding-block:12px
}
.text-link svg {
  width:20px;
  transition:transform .2s
}
.text-link:hover svg {
  transform:translateX(4px)
}
.dark-link {
  color:var(--ink)
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  min-height:56px;
  padding:15px 24px;
  background:var(--yellow);
  border:1px solid var(--yellow);
  color:var(--navy);
  font-size:13px;
  font-weight:800;
  line-height:1.35;
  transition:background .2s,border-color .2s
}
.button:hover {
  background:var(--yellow-hover);
  border-color:var(--yellow-hover)
}
.button svg {
  width:20px;
  height:20px
}
.button-small {
  min-height:46px;
  padding:12px 18px;
  gap:24px;
  font-size:12px
}
.button-outline {
  background:transparent;
  border-color:#758691;
  color:white
}
.button-outline:hover {
  background:white;
  border-color:white;
  color:var(--navy)
}
.skip-link {
  position:fixed;
  top:-100px;
  left:20px;
  z-index:200;
  background:var(--yellow);
  padding:12px 20px;
  color:var(--navy)
}
.skip-link:focus {
  top:15px
}
/* Navigation */
.site-header {
  position:fixed;
  inset:0 0 auto;
  z-index:30;
  color:white;
  transition:background .2s;
  isolation:isolate
}
.home .site-header.is-scrolled { background: var(--navy); }
.inner-page { padding-top: var(--header-height); }
.nav-inner {
  height:100px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  position:relative
}
.nav-inner::after {
  content:'';
  position:absolute;
  bottom:0;
  left:var(--gutter);
  right:var(--gutter);
  height:1px;
  background:#ffffff30
}
.brand {
  display:inline-flex;
  align-items:center;
  gap:11px;
  font-size:24px;
  font-weight:800;
  letter-spacing:-1.3px;
  line-height:1.1;
  white-space:nowrap
}
.brand-mark {
  width:26px;
  height:36px;
  color:var(--yellow)
}
.brand-domain {
  font-weight:400;
  color:#bdc7cb
}
.nav-links {
  display:flex;
  align-items:center;
  gap:32px;
  font-size:12px;
  font-weight:600
}
.nav-links>a:not(.button) {
  padding:14px 0;
  transition:color .2s
}
.nav-links>a:hover {
  color:var(--yellow)
}
.nav-links>a.button:hover {
  color:var(--navy)
}
.menu-toggle {
  display:none
}
.inner-page .site-header {
  background:var(--navy)
}
.inner-page .nav-inner::after {
  display:none
}
/* Cinematic opening */
.hero {
  height: min(920px, 100svh);
  min-height:720px;
  position:relative;
  background:var(--navy);
  overflow:hidden;
  color:white
}
.hero-video {
  position:absolute;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:62% center;
  filter:none
}
.hero-shade {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(8,25,37,.88) 0%,rgba(8,25,37,.62) 36%,rgba(8,25,37,.08) 75%),linear-gradient(0deg,rgba(8,25,37,.9),transparent 24%,transparent 80%,rgba(8,25,37,.45))
}
.hero-inner {
  height:100%;
  position:relative;
  display:flex;
  align-items:center;
  padding-top:70px;
  padding-bottom:82px
}
.hero-copy {
  position:relative;
  z-index:1
}
.hero-kicker {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  color:#e1e8eb;
  font-weight:500;
  margin-bottom:25px
}
.hero-kicker>span {
  width:6px;
  height:6px;
  background:var(--yellow);
  border-radius:50%
}
.hero h1 {
  font-size:clamp(88px,9.1vw,140px);
  line-height:.91;
  font-weight:600;
  letter-spacing:-.018em
}
.hero-description {
  color:#d1dce0;
  margin-top:28px;
  font-size:15px;
  line-height:1.8
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:32px;
  margin-top:30px
}
.hero-actions .text-link {
  color:#f3f6f7
}
.hero-side {
  position:absolute;
  right:var(--gutter);
  top:34%;
  bottom:25%;
  display:flex;
  align-items:center;
  gap:18px;
  writing-mode:vertical-rl;
  font-size:10px;
  letter-spacing:.07em;
  color:#dae2e5
}
.hero-side i {
  height:65px;
  width:1px;
  background:#ffffff55
}
.hero-bottom {
  position:absolute;
  bottom:28px;
  left:var(--gutter);
  right:var(--gutter);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  border-top:1px solid #ffffff36;
  padding-top:22px;
  font-size:11px;
  color:#dce4e7
}
.scroll-link {
  display:flex;
  align-items:center;
  gap:13px
}
.scroll-icon {
  font-size:21px;
  line-height:1
}
.video-controls {
  display:flex;
  align-items:center;
  gap:12px
}
.video-indicator {
  width:5px;
  height:5px;
  background:var(--yellow);
  border-radius:50%
}
.video-toggle {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:1px solid #ffffff55;
  background:transparent;
  border-radius:50%;
  color:white;
  margin-left:6px
}
.video-toggle svg {
  width:13px;
  height:13px
}
.play-icon {
  display:none
}
.video-toggle[aria-pressed=true] .pause-icon {
  display:none
}
.video-toggle[aria-pressed=true] .play-icon {
  display:block
}
.film-open {
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 0 0 18px;
  margin-left:6px;
  border:0;
  border-left:1px solid #ffffff40;
  background:none;
  color:white;
  font-size:11px
}
.film-open svg {
  width:18px
}
.capabilities {
  background:var(--navy);
  color:#c4d0d5;
  border-bottom:1px solid #2b414e
}
.capabilities-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  padding-block:30px;
  gap:30px
}
.capabilities-grid>div {
  display:flex;
  align-items:center;
  gap:18px;
  border-right:1px solid #354a56
}
.capabilities-grid>div:last-child {
  border:0
}
.capability-icon {
  font-size:29px;
  color:var(--yellow);
  width:32px
}
.capabilities p {
  font-size:11px;
  color:#a0b1bb;
  line-height:1.5
}
.capabilities strong {
  display:block;
  color:#e8edef;
  font-size:13px;
  font-weight:600;
  margin-top:4px
}
/* Light editorial sections */
.about-grid {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:100px
}
.about-copy {
  padding-top:34px
}
.about-copy>p:not(.lead) {
  margin-top:22px;
  color:var(--muted);
  font-size:14px
}
.about-copy .text-link {
  margin-top:20px
}
.about {
  padding-bottom:100px
}
.services {
  padding-top:80px;
  background:#ebefed
}
.service-layout {
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:70px;
  align-items:start
}
.service-photo {
  position:relative;
  overflow:hidden;
  min-height:492px
}
.service-photo>img {
  width:100%;
  height:492px;
  object-position:50% 40%
}
.photo-caption {
  position:absolute;
  inset:auto 0 0;
  background:linear-gradient(transparent,#102532dc);
  padding:55px 25px 23px;
  display:flex;
  justify-content:space-between;
  gap:15px;
  color:white;
  font-size:10px
}
.photo-caption span:last-child {
  color:#ced9de
}
.service-list {
  border-top:1px solid #c4ceca
}
details {
  border-bottom:1px solid #c4ceca
}
summary {
  display:flex;
  align-items:center;
  gap:18px;
  cursor:pointer;
  list-style:none;
  padding-block:27px
}
summary::-webkit-details-marker {
  display:none
}
summary h3 {
  font-size:20px;
  font-weight:600
}
.service-icon {
  font-size:26px;
  line-height:1;
  width:28px;
  color:#6f817f
}
.expand-icon {
  position:relative;
  margin-left:auto;
  width:18px;
  height:18px
}
.expand-icon::before,.expand-icon::after {
  content:'';
  background:var(--ink);
  position:absolute;
  left:2px;
  top:8px;
  width:14px;
  height:1px;
  transition:transform .2s
}
.expand-icon::after {
  transform:rotate(90deg)
}
details[open] .expand-icon::after {
  transform:rotate(0)
}
details[open] summary {
  padding-bottom:15px
}
.service-detail {
  padding:0 35px 26px 46px
}
.service-detail>p {
  font-size:13px;
  color:var(--muted);
  line-height:1.9
}
.service-detail .text-link {
  font-size:11px;
  margin-top:10px
}
.industries {
  background:var(--navy);
  color:white
}
.industries .section-heading>p {
  color:#b4c2ca
}
.industry-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px
}
.industry-card {
  min-height:445px;
  position:relative;
  overflow:hidden;
  display:block
}
.industry-card>img {
  position:absolute;
  width:100%;
  height:100%;
  transition:transform .6s cubic-bezier(.22,1,.36,1);
  filter:saturate(.78)
}
.industry-card:hover>img {
  transform:scale(1.045)
}
.industry-card-shade {
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 25%,rgba(9,25,37,.3) 45%,rgba(9,25,37,.94) 100%)
}
.industry-copy {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  padding:28px
}
.industry-copy>span:first-child {
  font-size:11px;
  color:var(--yellow);
  display:block;
  margin-bottom:14px
}
.industry-copy h3 {
  font-family:var(--display);
  font-size:37px;
  font-weight:500;
  line-height:1.05;
  letter-spacing:-.01em;
  padding-right:25px
}
.round-arrow {
  position:absolute;
  right:24px;
  bottom:28px;
  display:grid;
  place-items:center;
  width:35px;
  height:35px;
  border:1px solid #ffffff60;
  border-radius:50%;
  transition:background .2s,color .2s
}
.round-arrow svg {
  width:17px
}
.industry-card:hover .round-arrow {
  background:var(--yellow);
  border-color:var(--yellow);
  color:var(--navy)
}
.safety-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:85px;
  align-items:center
}
.safety-image {
  position:relative
}
.safety-image>img {
  width:100%;
  height:650px;
  object-position:45% center
}
.image-note {
  position:absolute;
  bottom:22px;
  left:22px;
  right:22px;
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--paper);
  padding:18px 20px;
  font-size:11px
}
.note-dot {
  height:6px;
  width:6px;
  background:#a18a35;
  border-radius:50%
}
.safety-copy h2 {
  font-size:clamp(45px,4.6vw,68px)
}
.safety-copy>p:not(.eyebrow) {
  color:var(--muted);
  font-size:13px;
  margin-top:25px;
  margin-bottom:26px
}
.safety-item {
  display:flex;
  gap:18px;
  border-top:1px solid var(--line);
  padding-top:18px;
  margin-top:18px
}
.safety-item>span {
  font-size:14px;
  color:#80702c
}
.safety-item h3 {
  font-size:13px;
  margin-bottom:5px
}
.safety-item p {
  color:var(--muted);
  font-size:12px;
  line-height:1.8
}
.projects {
  padding-top:45px
}
.featured-project {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  background:#e9edeb;
  overflow:hidden
}
.project-image {
  position:relative;
  min-height:490px;
  overflow:hidden
}
.project-image img {
  width:100%;
  height:100%;
  position:absolute;
  transition:transform .6s
}
.featured-project:hover .project-image img {
  transform:scale(1.03)
}
.project-tag {
  position:absolute;
  left:25px;
  top:25px;
  background:var(--paper);
  padding:9px 14px;
  font-size:10px;
  font-weight:700
}
.project-description {
  padding:55px 45px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center
}
.project-description h3 {
  font-family:var(--display);
  font-size:clamp(35px,3.5vw,52px);
  font-weight:600;
  line-height:1.05;
  margin-bottom:22px
}
.project-description>p {
  font-size:13px;
  color:var(--muted)
}
.project-facts {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  width:100%;
  border-top:1px solid #cbd4ce;
  margin:25px 0 16px;
  padding-top:20px
}
.project-facts dt {
  font-size:10px;
  color:var(--muted)
}
.project-facts dd {
  font-size:12px;
  font-weight:700;
  margin:5px 0 0
}
.project-description .text-link {
  font-size:12px
}
.equipment {
  background:#e9edeb
}
.equipment-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px;
  align-items:center
}
.equipment-grid>div>p:not(.eyebrow) {
  font-size:14px;
  color:var(--muted);
  margin-top:25px
}
.equipment-grid>img {
  width:100%;
  height:420px
}
.equipment-brands {
  display:flex;
  align-items:center;
  gap:38px;
  border-top:1px solid #cbd4ce;
  margin-top:35px;
  padding-top:25px;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.04em;
  color:#576c71
}
.equipment-brands > span { white-space: nowrap; }
.process-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:35px
}
.process-grid li {
  border-top:1px solid #bdc9c5;
  padding-top:20px
}
.process-grid li>span {
  font-family:var(--display);
  font-size:32px;
  font-weight:500;
  color:#899b9c
}
.process-grid h3 {
  font-size:15px;
  margin:25px 0 10px
}
.process-grid p {
  font-size:12px;
  color:var(--muted);
  line-height:1.9
}
.careers {
  background:var(--navy-light);
  color:white;
  padding-block:65px
}
.careers-inner {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:40px
}
.careers h2 {
  font-size:46px
}
.careers p:not(.eyebrow) {
  font-size:13px;
  margin-top:20px;
  color:#b9c9d1
}
.contact-banner {
  background:var(--yellow);
  padding-block:80px
}
.contact-banner-inner {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:80px
}
.contact-banner .eyebrow {
  color:#60582d
}
.contact-banner h2 {
  font-size:clamp(50px,5.5vw,80px)
}
.contact-banner-inner>div:last-child {
  justify-self:end
}
.contact-banner-inner>div:last-child>p {
  font-size:14px;
  margin-bottom:28px
}
.contact-banner .button {
  background:var(--navy);
  color:white;
  border-color:var(--navy);
  min-width:230px
}
.contact-banner .button:hover {
  background:#264451
}
/* Footer */
.site-footer {
  background:var(--navy);
  color:#b5c3cb;
  padding-top:65px
}
.footer-top {
  display:grid;
  grid-template-columns:1fr .8fr 1fr;
  align-items:start;
  gap:40px;
  padding-bottom:60px
}
.footer-top .brand {
  color:white
}
.footer-top>p {
  font-size:13px
}
.footer-email {
  font-size:18px;
  color:white;
  display:inline-flex;
  justify-self:end;
  align-items:center;
  gap:25px;
  letter-spacing:-.035em
}
.footer-email svg {
  width:20px
}
.footer-email:hover {
  color:var(--yellow)
}
.footer-bottom {
  padding-block:24px;
  border-top:1px solid #354a56;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:25px;
  font-size:10px;
  color:#a5b6bf
}
.footer-bottom nav {
  display:flex;
  gap:25px
}
.footer-bottom a:hover {
  color:white
}
.film-dialog {
  border:1px solid #4c6270;
  background:var(--navy);
  color:white;
  width:min(1100px,95vw);
  max-height:95svh;
  padding:20px
}
.film-dialog::backdrop {
  background:#06121bea;
  backdrop-filter:blur(6px)
}
.film-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:15px
}
.film-header h2 {
  font:600 15px var(--font)
}
.film-close {
  border:0;
  color:white;
  background:transparent;
  padding:10px;
  font-size:20px;
  line-height:1
}
.film-dialog video {
  display:block;
  width:100%;
  max-height:78svh;
  background:#000
}
/* Inner pages */
.subhero {
  min-height:610px;
  padding-block:45px 70px;
  color:white;
  position:relative;
  display:flex;
  align-items:flex-end;
  background:var(--navy)
}
.subhero-image {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-position:center 46%
}
.subhero-shade {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#0b202ff0,#0b202fa0 50%,#0b202f30),linear-gradient(0deg,#10253290,transparent)
}
.subhero>.container {
  position:relative
}
.breadcrumb {
  display:inline-block;
  font-size:11px;
  color:#c3d1d8;
  margin-bottom:60px
}
.breadcrumb:hover {
  color:var(--yellow)
}
.subhero .eyebrow {
  color:var(--yellow);
  margin-bottom:20px
}
.subhero h1 {
  font-size:clamp(64px,6.8vw,102px)
}
.subhero .container>p:last-child {
  font-size:14px;
  max-width:550px;
  margin-top:28px;
  color:#d3dfe5
}
.detail-layout {
  display:grid;
  grid-template-columns:1.65fr 1fr;
  gap:100px;
  align-items:start
}
.detail-layout h2 {
  font-size:clamp(46px,4.5vw,66px)
}
.application-list {
  margin-top:45px
}
.application-row {
  padding-block:28px;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:.8fr 1fr;
  gap:35px
}
.application-row h3 {
  font-size:19px
}
.application-row p {
  font-size:13px;
  color:var(--muted)
}
.project-aside {
  background:#e8edeb;
  padding:35px;
  position:sticky;
  top:35px
}
.aside-symbol {
  display:block;
  margin-bottom:35px
}
.aside-symbol .brand-mark {
  color:#8b7840;
  width:30px;
  height:45px
}
.project-aside h3 {
  font-size:22px;
  line-height:1.25;
  margin-bottom:20px
}
.project-aside>p {
  color:var(--muted);
  font-size:12px
}
.project-aside ul {
  margin-block:25px 30px;
  font-size:12px
}
.project-aside li {
  padding:12px 0;
  border-bottom:1px solid #cdd7d1
}
.project-aside .button {
  width:100%;
  font-size:12px;
  gap:10px;
  padding-inline:18px
}
.related-sectors {
  padding:0 0 80px
}
.related-sectors .container {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px
}
.related-sectors h2 {
  font-size:36px
}
.related-sectors .container>div {
  display:flex;
  gap:45px
}
.project-summary {
  background:var(--navy-light);
  color:white
}
.project-summary>.container {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
  padding-block:32px
}
.project-summary span {
  display:block;
  color:#b5c6cf;
  font-size:11px
}
.project-summary strong {
  display:block;
  font-size:15px;
  font-weight:500;
  margin-top:6px
}
.project-summary .container>div {
  border-right:1px solid #425966
}
.project-summary .container>div:last-child {
  border:0
}
.project-body>p {
  font-size:14px;
  color:var(--muted);
  margin-top:22px
}
.project-body>p.eyebrow {
  margin-top:0;
  font-size:12px
}
.project-body>p.lead {
  font-size:20px;
  color:var(--ink);
  margin-top:35px
}
.project-callout {
  border-left:3px solid #d0b04c;
  background:#e9edeb;
  padding:26px;
  margin-block:35px
}
.project-callout h3 {
  font-size:16px;
  margin-bottom:15px
}
.project-callout li {
  font-size:13px;
  color:var(--muted);
  padding:5px 0 5px 18px;
  position:relative
}
.project-callout li::before {
  content:'•';
  position:absolute;
  left:0;
  color:#97843e
}
.project-body>h3 {
  font-size:24px
}
.project-gallery {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:40px
}
.project-gallery img {
  width:100%;
  height:260px
}
/* Contact */
.contact-main {
  background:var(--paper)
}
.contact-layout {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:85px
}
.contact-intro h1 {
  font-size:clamp(76px,7.8vw,116px);
  line-height:.95
}
.contact-intro .lead {
  font-size:17px;
  margin-top:30px;
  color:var(--muted)
}
.contact-email {
  margin-top:35px;
  display:inline-flex;
  align-items:center;
  gap:30px;
  border-bottom:1px solid #a7b5b0;
  font-size:20px;
  padding-block:12px
}
.contact-email svg {
  width:20px
}
.contact-location {
  margin-top:50px
}
.contact-location span {
  font-size:11px;
  color:var(--muted)
}
.contact-location p {
  font-size:13px;
  margin-top:10px
}
.contact-form-wrap {
  background:white;
  padding:40px
}
.form-heading h2 {
  font:600 24px/1.3 var(--display);
  font-size:34px;
  letter-spacing:-.02em
}
.form-heading p {
  font-size:12px;
  color:var(--muted);
  margin-block:15px 30px
}
.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.form-field {
  margin-bottom:22px
}
.form-field label,.email-draft>label {
  display:block;
  font-size:11px;
  font-weight:700;
  margin-bottom:9px
}
.form-field label>span {
  color:#8a742d
}
input,select,textarea {
  background:#f4f6f3;
  border:1px solid #d9e0db;
  border-radius:0;
  width:100%;
  min-height:48px;
  padding:13px;
  color:var(--ink);
  font-size:12px;
  line-height:1.6
}
textarea {
  resize:vertical;
  min-height:145px
}
input:focus,select:focus,textarea:focus {
  outline:2px solid #b29337;
  outline-offset:1px
}
input::placeholder,textarea::placeholder {
  color:#7b888a
}
.form-submit {
  width:100%
}
.form-note {
  font-size:10px;
  color:var(--muted);
  margin-top:15px;
  line-height:1.8
}
.form-status {
  font-size:12px;
  color:var(--ink);
  margin-top:15px
}
.email-draft {
  margin-top:20px
}
.email-draft textarea {
  min-height:200px
}
.email-draft .text-link {
  border:0;
  background:none;
  font-size:12px;
  padding-inline:0
}
@keyframes hero-enter {
  from {
    opacity:0;
    transform:translateY(14px)
  }
  to {
    opacity:1;
    transform:none
  }
}
@media(prefers-reduced-motion:no-preference) {
  .hero-copy {
    animation:hero-enter .8s .05s both
  }
}
/* Tablet */
@media(min-width:1600px) {
  .hero-video {
    object-position:center 40%
  }
  .hero h1 {
    font-size:144px
  }
  .hero-copy {
    padding-bottom:12px
  }
}
@media(max-width:1100px) {
  .nav-links {
    gap:22px
  }
  .nav-inner {
    gap:24px
  }
  .brand {
    font-size:22px
  }
  .nav-links>.button {
    gap:15px;
    padding-inline:14px;
    font-size:11px
  }
  .service-layout {
    gap:35px
  }
  .safety-grid {
    gap:45px
  }
  .equipment-grid {
    gap:55px
  }
  .about-grid {
    gap:65px
  }
  .industry-copy {
    padding:22px
  }
  .industry-copy h3 {
    font-size:32px
  }
  .round-arrow {
    right:18px;
    bottom:22px;
    width:30px;
    height:30px
  }
  .industry-card {
    min-height:400px
  }
  .contact-layout {
    gap:40px
  }
  .contact-form-wrap {
    padding:30px
  }
  .detail-layout {
    gap:50px
  }
  .footer-top {
    gap:25px
  }
  .footer-email {
    font-size:16px;
    gap:10px
  }
  .project-description {
    padding:35px
  }
  .hero {
    min-height:700px
  }
  .safety-image>img {
    height:610px
  }
}
@media(max-width:900px) {
  .nav-links {
    gap:18px
  }
  .nav-links>a:not(.button) {
    font-size:11px
  }
  .nav-links .button {
    font-size:0;
    gap:0;
    padding:12px;
    min-height:40px
  }
  .nav-links .button svg {
    width:22px
  }
  .hero h1 {
    font-size:110px
  }
  .hero-side {
    display:none
  }
  .about-grid {
    gap:45px
  }
  .about-copy {
    padding-top:25px
  }
  .service-photo>img {
    height:480px
  }
  .service-photo {
    min-height:480px
  }
  .service-layout {
    gap:30px
  }
  .service-list summary h3 {
    font-size:17px
  }
  .service-detail {
    padding-left:0
  }
  .industry-grid {
    gap:15px
  }
  .industry-card {
    min-height:365px
  }
  .industry-copy h3 {
    font-size:28px
  }
  .industry-copy .round-arrow {
    position:static;
    margin-top:20px
  }
  .safety-grid {
    gap:35px
  }
  .safety-image>img {
    height:620px
  }
  .safety-copy h2 {
    font-size:46px
  }
  .equipment-grid {
    gap:35px
  }
  .equipment-brands {
    gap:20px;
    font-size:16px
  }
  .process-grid {
    gap:22px
  }
  .footer-top {
    grid-template-columns:1fr 1fr
  }
  .footer-top>p {
    display:none
  }
  .footer-bottom {
    flex-wrap:wrap
  }
  .footer-bottom>span:last-child {
    display:none
  }
  .contact-banner-inner {
    gap:35px
  }
  .detail-layout {
    grid-template-columns:1.4fr 1fr;
    gap:35px
  }
  .application-row {
    grid-template-columns:1fr;
    gap:12px
  }
  .project-aside {
    padding:25px
  }
  .contact-layout {
    grid-template-columns:.9fr 1.1fr;
    gap:30px
  }
  .form-row {
    grid-template-columns:1fr;
    gap:0
  }
  .contact-intro h1 {
    font-size:84px
  }
  .contact-email {
    font-size:17px;
    gap:15px
  }
  .contact-form-wrap {
    padding:25px
  }
  .contact-banner-inner>div:last-child>p br {
    display:none
  }
  .careers-inner>.button {
    max-width:260px
  }
  .featured-project {
    grid-template-columns:1fr 1fr
  }
  .project-facts {
    grid-template-columns:1fr;
    gap:14px
  }
}
/* Mobile */
@media(max-width:700px) {
  :root {
    --gutter:24px
  }
  html {
    scroll-padding-top:calc(var(--header-height) + 16px)
  }
  .section {
    padding-block:70px
  }
  .nav-inner {
    height:80px
  }
  .brand {
    font-size:22px
  }
  .brand-mark {
    height:32px;
    width:23px
  }
  .menu-toggle {
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:6px;
    width:42px;
    height:42px;
    border:1px solid #ffffff50;
    background:transparent;
    z-index:32;
    position:relative;
    padding:11px
  }
  .menu-toggle>span {
    height:1px;
    background:white;
    width:18px;
    transition:transform .2s
  }
  .menu-toggle[aria-expanded=true]>span:first-child {
    transform:translateY(3.5px) rotate(45deg)
  }
  .menu-toggle[aria-expanded=true]>span:last-child {
    transform:translateY(-3.5px) rotate(-45deg)
  }
  .nav-links {
    display:none;
    position:absolute;
    top:80px;
    left:0;
    right:0;
    background:var(--navy);
    padding:28px var(--gutter) 36px;
    border-bottom:1px solid #46606b;
    box-shadow:0 20px 30px #06142055;
    flex-direction:column;
    align-items:stretch;
    gap:0
  }
  .nav-links.active {
    display:flex
  }
  .site-header:has(.nav-links.active) {
    background:var(--navy)
  }
  .nav-links>a:not(.button) {
    font-size:17px;
    padding-block:13px;
    border-bottom:1px solid #ffffff20
  }
  .nav-links .button {
    font-size:13px;
    padding:16px 20px;
    margin-top:24px;
    justify-content:space-between;
    min-height:52px
  }
  .hero {
    height:calc(100svh - 0px);
    min-height:760px;
    max-height:930px
  }
  .hero-inner {
    padding-top:105px;
    padding-bottom:105px;
    align-items:center
  }
  .hero-video {
    object-position:52% center
  }
  .hero-shade {
    background:linear-gradient(90deg,#0a2130d9,#0a213065),linear-gradient(0deg,#0a2130ed,transparent 35%,transparent 75%,#0a213055)
  }
  .hero h1 {
    font-size:clamp(86px,19vw,125px);
    line-height:.93
  }
  .hero-kicker {
    font-size:11px;
    margin-bottom:25px
  }
  .hero-description {
    font-size:13px;
    max-width:295px;
    margin-top:24px
  }
  .hero-actions {
    gap:16px;
    flex-wrap:wrap;
    margin-top:24px
  }
  .hero-actions .button {
    padding:15px 18px;
    gap:25px;
    font-size:12px;
    min-height:52px
  }
  .hero-actions>.text-link {
    font-size:11px;
    gap:12px
  }
  .hero-bottom {
    bottom:23px;
    padding-top:18px;
    gap:14px
  }
  .scroll-link {
    font-size:10px;
    gap:10px
  }
  .video-controls {
    gap:8px
  }
  .video-controls>span:not(.video-indicator) {
    display:none
  }
  .video-controls>.video-indicator {
    display:none
  }
  .film-open {
    padding-left:13px;
    font-size:10px;
    gap:8px
  }
  .video-toggle {
    width:28px;
    height:28px
  }
  .capabilities-grid {
    grid-template-columns:1fr;
    gap:0;
    padding-block:8px
  }
  .capabilities-grid>div {
    border-right:0;
    border-bottom:1px solid #354a56;
    padding-block:17px;
    gap:18px
  }
  .capabilities strong {
    font-size:12px
  }
  .capabilities p {
    font-size:10px
  }
  .capability-icon {
    font-size:25px
  }
  .about-grid {
    grid-template-columns:1fr;
    gap:25px
  }
  .about-copy {
    padding:0
  }
  .about-copy>.lead {
    font-size:20px
  }
  .about-copy>p:not(.lead) {
    font-size:13px
  }
  .eyebrow {
    font-size:11px;
    margin-bottom:18px
  }
  h2 {
    font-size:48px
  }
  .section-heading {
    align-items:flex-start;
    flex-direction:column;
    gap:25px;
    margin-bottom:35px
  }
  .section-heading>p {
    font-size:12px
  }
  .section-heading>.text-link {
    margin-top:-5px
  }
  .service-layout {
    grid-template-columns:1fr;
    gap:30px
  }
  .service-photo,.service-photo>img {
    height:340px;
    min-height:0
  }
  .service-list summary {
    padding-block:22px
  }
  .service-list summary h3 {
    font-size:19px
  }
  .service-detail {
    padding-left:44px;
    padding-right:15px
  }
  .service-detail>p {
    font-size:12px
  }
  .service-icon {
    font-size:23px;
    width:26px
  }
  .industry-grid {
    grid-template-columns:1fr;
    gap:20px
  }
  .industry-card {
    min-height:390px
  }
  .industry-card>img {
    object-position:center 40%
  }
  .industry-copy {
    padding:28px
  }
  .industry-copy h3 {
    font-size:39px
  }
  .industry-copy .round-arrow {
    position:absolute;
    right:28px;
    bottom:28px;
    width:38px;
    height:38px
  }
  .safety-grid {
    grid-template-columns:1fr;
    gap:38px
  }
  .safety-image>img {
    height:420px;
    object-position:center 40%
  }
  .image-note {
    left:18px;
    right:18px;
    bottom:18px;
    font-size:10px;
    padding:16px
  }
  .safety-copy h2 {
    font-size:48px
  }
  .safety-copy>p:not(.eyebrow) {
    font-size:13px
  }
  .safety-item h3 {
    font-size:14px
  }
  .safety-item p {
    font-size:12px
  }
  .projects {
    padding-top:15px
  }
  .featured-project {
    grid-template-columns:1fr
  }
  .project-image {
    min-height:350px
  }
  .project-description {
    padding:30px 26px
  }
  .project-description h3 {
    font-size:41px
  }
  .project-description>p {
    font-size:12px
  }
  .project-facts {
    grid-template-columns:1fr 1fr;
    gap:18px
  }
  .project-tag {
    top:20px;
    left:20px
  }
  .equipment-grid {
    grid-template-columns:1fr;
    gap:35px
  }
  .equipment-grid>img {
    height:340px
  }
  .equipment-grid>div>p:not(.eyebrow) {
    font-size:13px
  }
  .equipment-brands {
    gap:35px;
    font-size:18px
  }
  .process-grid {
    grid-template-columns:1fr 1fr;
    gap:35px 25px
  }
  .process-grid h3 {
    font-size:14px;
    margin-top:18px
  }
  .process-grid p {
    font-size:11px
  }
  .process-grid li>span {
    font-size:28px
  }
  .careers {
    padding-block:55px
  }
  .careers-inner {
    flex-direction:column;
    align-items:flex-start;
    gap:30px
  }
  .careers h2 {
    font-size:43px
  }
  .careers-inner>.button {
    max-width:100%;
    font-size:12px
  }
  .careers p:not(.eyebrow) {
    font-size:12px
  }
  .contact-banner {
    padding-block:60px
  }
  .contact-banner-inner {
    grid-template-columns:1fr;
    gap:30px
  }
  .contact-banner-inner>div:last-child {
    justify-self:start
  }
  .contact-banner h2 {
    font-size:57px
  }
  .contact-banner-inner>div:last-child>p {
    font-size:13px
  }
  .site-footer {
    padding-top:45px
  }
  .footer-top {
    grid-template-columns:1fr;
    gap:30px;
    padding-bottom:40px
  }
  .footer-email {
    justify-self:start;
    font-size:19px;
    gap:24px
  }
  .footer-bottom {
    font-size:10px;
    gap:18px;
    align-items:flex-start;
    flex-direction:column
  }
  .footer-bottom nav {
    gap:24px;
    flex-wrap:wrap
  }
  .subhero {
    min-height:585px;
    padding-block:35px 55px
  }
  .subhero h1 {
    font-size:65px
  }
  .subhero .container>p:last-child {
    font-size:13px;
    margin-top:25px
  }
  .subhero-shade {
    background:linear-gradient(90deg,#0b202fdb,#0b202f70),linear-gradient(0deg,#102532a0,transparent)
  }
  .breadcrumb {
    margin-bottom:65px;
    font-size:10px
  }
  .detail-layout {
    grid-template-columns:1fr;
    gap:45px
  }
  .detail-layout h2 {
    font-size:48px
  }
  .application-list {
    margin-top:30px
  }
  .application-row {
    padding-block:23px
  }
  .application-row h3 {
    font-size:19px
  }
  .application-row p {
    font-size:13px
  }
  .project-aside {
    position:static;
    padding:30px
  }
  .project-aside .button {
    width:auto;
    min-width:230px
  }
  .aside-symbol {
    margin-bottom:25px
  }
  .related-sectors {
    padding-bottom:60px
  }
  .related-sectors .container {
    align-items:flex-start;
    flex-direction:column;
    gap:20px
  }
  .related-sectors .container>div {
    gap:30px;
    flex-wrap:wrap
  }
  .related-sectors h2 {
    font-size:34px
  }
  .project-summary>.container {
    grid-template-columns:1fr;
    gap:0;
    padding-block:12px
  }
  .project-summary .container>div {
    border-right:0;
    border-bottom:1px solid #425966;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-block:15px;
    gap:20px
  }
  .project-summary strong {
    margin:0;
    font-size:12px
  }
  .project-summary span {
    font-size:10px
  }
  .project-body>p.lead {
    font-size:19px
  }
  .project-body>p {
    font-size:13px
  }
  .project-gallery {
    gap:12px
  }
  .project-gallery img {
    height:190px
  }
  .project-callout {
    padding:22px
  }
  .project-callout li {
    font-size:12px
  }
  .contact-layout {
    grid-template-columns:1fr;
    gap:40px
  }
  .contact-intro h1 {
    font-size:94px
  }
  .contact-intro .lead {
    font-size:16px;
    margin-top:25px
  }
  .contact-email {
    margin-top:20px;
    font-size:20px
  }
  .contact-location {
    margin-top:25px
  }
  .contact-location p {
    font-size:12px
  }
  .contact-form-wrap {
    padding:28px 22px
  }
  .form-heading h2 {
    font-size:31px
  }
  .form-heading p {
    font-size:12px
  }
  .form-row {
    grid-template-columns:1fr
  }
  .form-field {
    margin-bottom:20px
  }
  input,select,textarea {
    font-size:16px;
    padding:12px;
    min-height:50px
  }
  .form-field label {
    font-size:11px
  }
  .form-submit {
    font-size:12px;
    padding-inline:16px;
    gap:12px
  }
  .form-note {
    font-size:10px
  }
  .contact-main>.section {
    padding-top:55px
  }
  .film-dialog {
    padding:12px
  }
  .film-header h2 {
    font-size:12px
  }
  .film-dialog video {
    max-height:70svh
  }
}
@media(max-width:370px) {
  :root {
    --gutter:20px
  }
  .hero {
    min-height:760px
  }
  .hero h1 {
    font-size:86px
  }
  .hero-actions {
    gap:5px;
    align-items:flex-start;
    flex-direction:column
  }
  .hero-actions>.text-link {
    padding-top:15px
  }
  .hero-kicker {
    font-size:10px
  }
  .hero-bottom .scroll-link {
    font-size:9px
  }
  .film-open {
    font-size:9px
  }
  .equipment-brands {
    gap:25px;
    font-size:16px
  }
  .project-facts {
    grid-template-columns:1fr
  }
  .contact-intro h1 {
    font-size:80px
  }
  .subhero h1 {
    font-size:56px
  }
  .process-grid {
    gap:30px 20px
  }
  .contact-email {
    font-size:18px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
  .hero-video {
    visibility:hidden
  }
  .hero {
    background-image:url('../assets/hero-beam-hold-20261021.webp');
    background-size:cover;
    background-position:52% center
  }
}
/* Keep opening copy below the navigation on shorter desktop displays. */
@media(min-width:701px) and (max-height:800px) {
  .hero-inner {
    padding-top:130px;
    padding-bottom:105px
  }
  .hero h1 {
    font-size:clamp(86px,8vw,118px)
  }
  .hero-kicker {
    margin-bottom:20px
  }
  .hero-description {
    margin-top:22px
  }
  .hero-actions {
    margin-top:24px
  }
}
/* Grid contents must be allowed to shrink on narrow displays. */
.about-grid>*,.service-layout>*,.safety-grid>*,.equipment-grid>*,.detail-layout>*,.contact-layout>* {
  min-width:0
}

/* Full reference overview: both original projects, followed by original locations. */
.reference-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}
.reference-grid .featured-project {
  grid-template-columns: 1fr;
  grid-template-rows: 340px 1fr;
}
.reference-grid .project-image {
  min-height: 0;
}
.reference-grid .project-description {
  padding: 34px;
}
.reference-grid .project-description h3 {
  font-size: clamp(34px, 3.5vw, 49px);
}
.reference-grid .project-description > p {
  flex: 1;
}
.reference-grid .project-facts {
  grid-template-columns: 1fr 1fr;
}
.reference-grid .project-description .text-link {
  gap: 16px;
}
.project-locations {
  background: var(--navy);
  color: white;
}
.project-locations .section-heading > p {
  color: #b4c2ca;
}
.locations-layout {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 70px;
  align-items: center;
}
.locations-map {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1;
  background: #0b1c29;
}
.locations-map img {
  width: 100%;
  height: 100%;
  opacity: .75;
}
.map-caption {
  position: absolute;
  inset: auto 0 0;
  padding: 60px 28px 24px;
  background: linear-gradient(transparent, #0b1c29);
}
.map-caption span {
  display: block;
  font-size: 10px;
  color: var(--yellow);
  margin-bottom: 8px;
}
.map-caption strong {
  display: block;
  font-size: 16px;
  line-height: 1.6;
  font-weight: 500;
}
.location-regions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px 30px;
  align-self: stretch;
  align-content: center;
}
.location-region h3 {
  color: var(--yellow);
  font-size: 13px;
  margin-bottom: 16px;
}
.location-region li {
  border-top: 1px solid #354a56;
  padding: 11px 0;
  font-size: 12px;
  color: #d1dde3;
}
@media (max-width: 900px) {
  .reference-grid { gap: 22px; }
  .reference-grid .featured-project { grid-template-rows: 280px 1fr; }
  .reference-grid .project-description { padding: 26px; }
  .reference-grid .project-facts { grid-template-columns: 1fr; }
  .locations-layout { gap: 35px; grid-template-columns: .8fr 1fr; }
  .location-regions { gap: 25px; }
  .location-region li { font-size: 11px; }
}
@media (max-width: 700px) {
  .reference-grid { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .reference-grid .featured-project { grid-template-rows: 300px 1fr; }
  .reference-grid .project-description h3 { font-size: 38px; }
  .reference-grid .project-facts { grid-template-columns: 1fr 1fr; }
  .locations-layout { grid-template-columns: minmax(0, 1fr); gap: 35px; }
  .locations-map { max-height: 380px; aspect-ratio: 1.15; }
  .location-regions { gap: 30px 25px; }
  .location-region li { font-size: 11px; }
  .project-locations .section-heading h2 { font-size: 46px; }
}
@media (max-width: 370px) {
  .equipment-brands { font-size: 14px; gap: 18px; }
  .reference-grid .project-description { padding: 24px; }
  .reference-grid .project-description h3 { font-size: 34px; }
  .reference-grid .project-facts { grid-template-columns: 1fr; }
  .reference-grid .project-description .text-link { font-size: 11px; gap: 12px; }
  .location-regions { grid-template-columns: minmax(0, 1fr); }
}

/* Project archive: sourced photos, searchable catalogue and accessible galleries. */
[hidden] { display: none !important; }
.catalogue-intro { padding: 45px 0 70px; background: #e9edeb; }
.catalogue-intro .breadcrumb { color: var(--muted); margin-bottom: 55px; }
.catalogue-heading { display: grid; grid-template-columns: 1.5fr 1fr; gap: 70px; align-items: end; }
.catalogue-heading h1 { font-size: clamp(55px, 5.8vw, 86px); }
.catalogue-heading > p { max-width: 37ch; justify-self: end; font-size: 14px; color: var(--muted); }
.catalogue-section { padding: 45px 0 100px; }
.catalogue-tools { display: grid; grid-template-columns: 1fr 300px; gap: 35px; align-items: end; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.project-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.project-filters button { background: transparent; border: 1px solid #c9d2ce; padding: 10px 14px; font-size: 11px; min-height: 42px; text-align: left; }
.project-filters button[aria-pressed="true"] { background: var(--navy); color: white; border-color: var(--navy); }
.project-filters button span { color: var(--yellow); margin-left: 5px; }
.project-search label { display: block; font-size: 11px; font-weight: 600; margin-bottom: 7px; }
.project-search input { background: white; }
.project-result-count { margin: 25px 0; color: var(--muted); font-size: 11px; }
.project-catalogue-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 25px; }
.catalogue-card { min-width: 0; background: white; display: flex; flex-direction: column; }
.catalogue-image { overflow: hidden; aspect-ratio: 4 / 3; position: relative; background: #dde5e1; }
.catalogue-image img { width: 100%; height: 100%; transition: transform .4s ease; }
.catalogue-card:hover .catalogue-image img { transform: scale(1.035); }
.catalogue-image > span { position: absolute; left: 16px; right: 16px; top: 16px; width: fit-content; max-width: calc(100% - 32px); background: var(--paper); padding: 7px 11px; font-size: 10px; font-weight: 600; }
.catalogue-copy { padding: 25px; display: flex; flex-direction: column; flex: 1; }
.catalogue-copy .eyebrow { font-size: 10px; margin-bottom: 15px; }
.catalogue-copy h2 { font-size: clamp(30px, 2.7vw, 39px); line-height: 1.08; }
.catalogue-copy > p:not(.eyebrow) { font-size: 12px; line-height: 1.8; color: var(--muted); margin-top: 18px; flex: 1; }
.catalogue-copy .text-link { margin-top: 20px; font-size: 11px; }
.catalogue-empty { margin-top: 35px; font-size: 15px; }
.home-reference-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-reference-grid .featured-project { grid-template-rows: 280px 1fr; }
.home-reference-grid .project-description { padding: 28px; }
.home-reference-grid .project-description h3 { font-size: clamp(30px, 2.9vw, 40px); }
.home-reference-grid .project-description .text-link { margin-top: 20px; }
.all-projects-link { margin-top: 40px; text-align: center; }
.real-project-hero { min-height: 610px; }
.real-project-hero h1 { max-width: 18ch; font-size: clamp(58px, 6.5vw, 94px); }
.real-project-hero .subhero-image { object-position: center; }
.real-project-story .project-body > p { white-space: normal; overflow-wrap: anywhere; }
.real-project-story .project-body > p:first-of-type:not(.eyebrow) { margin-top: 35px; }
.reference-info { margin: 25px 0 35px; }
.reference-info > div { padding: 14px 0; border-bottom: 1px solid #cbd6d0; }
.reference-info dt { font-size: 10px; color: var(--muted); margin-bottom: 5px; }
.reference-info dd { margin: 0; font-size: 12px; font-weight: 600; }
.reference-gallery-section { padding-top: 30px; }
.reference-gallery-section h2 { font-size: clamp(40px, 4.6vw, 65px); }
.reference-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.gallery-item { display: block; position: relative; overflow: hidden; aspect-ratio: 4 / 3; background: #dfe6e1; }
.gallery-item img { width: 100%; height: 100%; transition: transform .3s ease; }
.gallery-item:hover img { transform: scale(1.035); }
.gallery-item > span { position: absolute; bottom: 9px; left: 10px; font-size: 10px; color: white; padding: 1px 7px; background: #102532c7; }
.gallery-dialog { background: #0a1924; color: white; border: 1px solid #4c6270; padding: 16px; width: min(1250px, 96vw); max-height: 96svh; }
.gallery-dialog::backdrop { background: #06121bf2; }
.gallery-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 15px; }
.gallery-toolbar p { font-size: 12px; max-width: 70ch; }
.gallery-toolbar > div { display: flex; gap: 10px; flex-shrink: 0; }
.gallery-toolbar button { min-width: 42px; min-height: 42px; background: transparent; border: 1px solid #7d919b; color: white; font-size: 19px; }
.gallery-toolbar button:hover { background: #29424f; }
.gallery-full-image { width: 100%; height: min(72svh, 900px); object-fit: contain; background: #06121b; }
.gallery-help { text-align: center; color: #b7c7d0; font-size: 10px; padding-top: 12px; }
.next-reference { padding: 20px 0 70px; }
.next-reference > .container { display: flex; justify-content: space-between; gap: 25px; }
.footer-top > *, .catalogue-heading > *, .catalogue-tools > * { min-width: 0; }
.footer-email { overflow-wrap: anywhere; font-size: clamp(12px, 1.3vw, 18px); }
.contact-email { overflow-wrap: anywhere; font-size: clamp(15px, 1.5vw, 20px); max-width: 100%; }
@media (max-width: 1100px) {
  .catalogue-heading { gap: 40px; }
  .catalogue-tools { grid-template-columns: 1fr 250px; }
  .catalogue-copy { padding: 22px; }
  .home-reference-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .catalogue-heading { grid-template-columns: 1fr; gap: 30px; }
  .catalogue-heading > p { justify-self: start; max-width: 60ch; }
  .catalogue-tools { grid-template-columns: 1fr; gap: 25px; }
  .project-search { max-width: 450px; }
  .project-catalogue-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reference-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .real-project-hero { min-height: 560px; }
}
@media (max-width: 700px) {
  .catalogue-intro { padding: 30px 0 50px; }
  .catalogue-intro .breadcrumb { margin-bottom: 40px; }
  .catalogue-heading h1 { font-size: 56px; }
  .catalogue-heading > p { font-size: 13px; }
  .catalogue-section { padding: 30px 0 65px; }
  .project-filters { gap: 7px; }
  .project-filters button { font-size: 10px; padding: 9px 12px; }
  .project-search { max-width: none; }
  .project-catalogue-grid { grid-template-columns: minmax(0, 1fr); gap: 25px; }
  .catalogue-copy { padding: 25px; }
  .catalogue-copy h2 { font-size: 36px; }
  .catalogue-image > span { font-size: 10px; }
  .home-reference-grid { grid-template-columns: minmax(0, 1fr); }
  .home-reference-grid .featured-project { grid-template-rows: 300px 1fr; }
  .home-reference-grid .project-description h3 { font-size: 37px; }
  .reference-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .reference-gallery-section h2 { font-size: 42px; }
  .real-project-hero { min-height: 560px; }
  .real-project-hero h1 { font-size: 59px; overflow-wrap: anywhere; }
  .real-project-hero .eyebrow { font-size: 10px; }
  .real-project-hero .breadcrumb { margin-bottom: 45px; }
  .reference-gallery-section .section-heading > p { font-size: 11px; }
  .gallery-dialog { padding: 10px; }
  .gallery-toolbar { align-items: flex-start; gap: 12px; flex-direction: column; }
  .gallery-toolbar p { font-size: 11px; }
  .gallery-toolbar > div { align-self: flex-end; }
  .gallery-full-image { height: 62svh; }
  .gallery-help { font-size: 9px; }
  .next-reference .text-link { font-size: 11px; gap: 12px; }
  .footer-email { font-size: 16px; }
  .contact-email { font-size: 17px; }
}
@media (max-width: 370px) {
  .catalogue-heading h1 { font-size: 49px; }
  .catalogue-copy h2 { font-size: 32px; }
  .real-project-hero h1 { font-size: 50px; }
  .reference-gallery-section h2 { font-size: 38px; }
  .next-reference > .container { flex-wrap: wrap; }
}

/* Native language disclosure: shared position across all six static locale trees. */
.language-switch { position: relative; flex: 0 0 auto; color: white; }
.language-switch > summary { display: flex; align-items: center; gap: 6px; padding: 10px 7px; list-style: none; border: 1px solid #ffffff55; min-height: 42px; cursor: pointer; font-size: 11px; font-weight: 700; }
.language-switch > summary::-webkit-details-marker { display: none; }
.language-switch > summary > svg { width: 16px; height: 16px; }
.language-switch > summary > .language-chevron { width: 10px; height: 10px; transition: transform .2s; }
.language-switch[open] > summary { border-color: var(--yellow); color: var(--yellow); }
.language-switch[open] .language-chevron { transform: rotate(180deg); }
.language-options { position: absolute; right: 0; top: calc(100% + 10px); z-index: 70; width: 222px; max-width: calc(100vw - 40px); padding: 8px; background: var(--navy); border: 1px solid #526874; box-shadow: 0 15px 45px #04111c40; }
.language-options > a { display: flex; gap: 17px; align-items: center; padding: 12px 13px; font-size: 12px; color: #e2e9ec; min-height: 43px; }
.language-options > a > span:first-child { width: 23px; font-size: 10px; font-weight: 800; color: #bccbd2; }
.language-options > a:hover { background: #294450; color: white; }
.language-options > a[aria-current="true"] { background: var(--yellow); color: var(--navy); }
.language-options > a[aria-current="true"] > span:first-child { color: var(--navy); }
h1, h2, h3 { overflow-wrap: break-word; hyphens: auto; }
@media (max-width: 1100px) {
  .nav-inner { gap: 18px; }
  .nav-links { gap: 20px; }
}
@media (max-width: 900px) {
  .nav-links { gap: 16px; }
  .language-switch > summary { min-height: 40px; }
}
@media (max-width: 700px) {
  .nav-inner { gap: 12px; }
  .nav-inner > .brand { font-size: clamp(18px, 5.6vw, 22px); gap: 8px; margin-right: auto; }
  .nav-inner > .brand .brand-mark { width: 21px; height: 30px; }
  .language-switch > summary { padding: 9px 6px; gap: 5px; min-height: 42px; }
  .language-switch > summary > svg:first-child { display: none; }
  .language-options { right: -54px; top: calc(100% + 13px); }
  html[lang="fr"] .hero h1, html[lang="de"] .hero h1, html[lang="es"] .hero h1, html[lang="it"] .hero h1 { font-size: clamp(68px, 17vw, 110px); }
  html:not([lang="sk"]) .hero-actions { gap: 12px 20px; }
  html:not([lang="sk"]) .hero-actions > .text-link { font-size: 10px; }
  html:not([lang="sk"]) .contact-intro h1 { font-size: clamp(50px, 15.8vw, 84px); hyphens: none; }
  .nav-links a, .button, .text-link { overflow-wrap: break-word; }
}

/* Field gallery: the original framing of real work photographs sets the rhythm. */
.field-gallery-hero { padding: 65px 0 70px; color: white; background: var(--navy); }
.field-gallery-intro { display: grid; grid-template-columns: 1fr 1.15fr; gap: 70px; align-items: center; }
.field-gallery-intro > * { min-width: 0; }
.field-gallery-intro .breadcrumb { display: inline-block; margin-bottom: 35px; }
.field-gallery-intro h1 { font-size: clamp(64px, 6.8vw, 100px); line-height: .98; margin-bottom: 25px; }
.field-gallery-intro > div > p:not(.eyebrow) { color: #c8d7df; font-size: 14px; max-width: 47ch; }
.field-gallery-intro > img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.field-gallery-intro .field-gallery-total { margin-top: 30px; font-weight: 700; }
.field-gallery-section { padding-top: 45px; }
.field-gallery-controls { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 35px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.field-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.field-filters button { background: transparent; color: var(--ink); border: 1px solid #b7c5c5; min-height: 44px; padding: 11px 18px; font-size: 12px; }
.field-filters button[aria-pressed="true"] { background: var(--navy); color: white; border-color: var(--navy); }
.field-result-count { color: var(--muted); font-size: 12px; }
.field-media-grid { columns: 3; column-gap: 24px; }
.field-media-card { display: inline-block; width: 100%; margin: 0 0 24px; break-inside: avoid; color: var(--ink); }
.field-media-visual { position: relative; background: #dbe2df; }
.field-media-visual img { display: block; width: 100%; height: auto; }
.field-media-caption { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 12px 0; border-bottom: 1px solid #c4ceca; font-size: 11px; }
.field-kind { color: var(--muted); }
.field-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: grid; place-items: center; width: 58px; height: 58px; background: var(--yellow); color: var(--navy); border-radius: 50%; padding-left: 3px; font-size: 20px; }
.field-duration { position: absolute; right: 12px; bottom: 12px; padding: 4px 8px; background: #102532df; color: white; font-size: 12px; }
.field-media-card:hover .field-media-caption { border-color: var(--navy); }
.field-media-card[hidden], .gallery-full-image[hidden], .gallery-full-video[hidden] { display: none; }
.gallery-full-video { display: block; width: 100%; height: min(72svh, 900px); object-fit: contain; background: #06121b; }
.field-gallery-preview { background: #e9eeeb; }
.field-gallery-preview h2 { font-size: clamp(46px, 4.5vw, 65px); max-width: 20ch; }
.field-preview-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 18px; }
.field-preview-grid > a { display: block; min-width: 0; }
.field-preview-grid img { display: block; width: 100%; height: 400px; object-fit: cover; object-position: center 35%; }
.field-preview-grid span { display: block; font-size: 11px; padding-top: 13px; }
@media (max-width: 1000px) {
  .field-gallery-intro { gap: 35px; }
  .field-media-grid { columns: 2; }
  .field-preview-grid img { height: 320px; }
}
@media (max-width: 700px) {
  .field-gallery-hero { padding: 30px 0 35px; }
  .field-gallery-intro { grid-template-columns: 1fr; gap: 30px; }
  .field-gallery-intro .breadcrumb { margin-bottom: 25px; }
  .field-gallery-intro h1 { font-size: clamp(54px, 15vw, 76px); max-width: 12ch; }
  .field-gallery-intro > div > p:not(.eyebrow) { font-size: 13px; }
  .field-gallery-intro > img { aspect-ratio: 16 / 9; }
  .field-gallery-intro .field-gallery-total { margin-top: 20px; }
  .field-gallery-controls { flex-direction: column; align-items: flex-start; gap: 16px; }
  .field-filters button { padding: 10px 12px; font-size: 11px; }
  .field-media-grid { columns: 2; column-gap: 12px; }
  .field-media-card { margin-bottom: 14px; }
  .field-media-caption { font-size: 10px; padding-block: 9px; }
  .field-play { width: 46px; height: 46px; font-size: 17px; }
  .field-preview-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 22px 12px; }
  .field-preview-grid > a:first-child { grid-column: 1 / -1; }
  .field-preview-grid img { height: 280px; }
  .field-preview-grid > a:first-child img { height: auto; aspect-ratio: 16 / 9; }
  .gallery-full-video { height: 62svh; }
}
@media (max-width: 370px) {
  .field-filters { gap: 6px; }
  .field-filters button { padding-inline: 9px; font-size: 10px; }
  .field-media-grid { columns: 1; }
}
@media (max-width: 700px) {
  :root { --header-height: 80px; }
  .nav-links { max-height: calc(100svh - var(--header-height)); overflow-y: auto; }
}