/* JECPL — unified site stylesheet. One source of truth for colour, layout and responsive behaviour. */
:root {
    color-scheme:light;
    --page:#f4f6f7;
    --surface:#fff;
    --surface-alt:#e9eef1;
    --ink:#17252e;
    --muted:#586873;
    --dark:#17242d;
    --dark-2:#22333e;
    --dark-text:#f4f7f8;
    --dark-muted:#c3cdd3;
    --line:#d7dfe3;
    --line-dark:rgba(255,255,255,.14);
    --accent:#c8752d;
    --accent-hover:#a95e20;
    --radius:10px;
    --max:1240px;
    --shadow:0 12px 32px rgba(23,37,46,.09)
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:100px
}
body {
    margin:0;
    background:var(--page);
    color:var(--ink);
    font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
    font-size:15px;
    line-height:1.7;
    -webkit-font-smoothing:antialiased
}
img {
    max-width:100%;
    height:auto
}
a {
    color:inherit;
    text-decoration:none
}
button,input,select,textarea {
    font:inherit
}
button,a {
    -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
    outline:3px solid #d79a62;
    outline-offset:3px
}
.container {
    width:min(var(--max),calc(100% - 48px));
    margin-inline:auto
}
/* Header and navigation */
.topbar {
    background:#111c23;
    color:#d1d9de;
    border-bottom:1px solid rgba(255,255,255,.1);
    font-size:11px;
    font-weight:600;
    letter-spacing:.055em
}
.topbar .inner {
    display:flex;
    justify-content:flex-end;
    gap:20px;
    padding:8px 0
}
.nav {
    position:sticky;
    top:0;
    z-index:1000;
    overflow:visible;
    background:rgba(12,20,28,.40);
    border-bottom:1px solid rgba(255,255,255,.14);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
    color:#f5f7f8
}
.nav .inner {
    position:relative;
    min-height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px
}
.brand {
    display:flex;
    align-items:center;
    flex-shrink:0
}
.brand img {
    display:block;
    width:184px;
    max-height:54px;
    object-fit:contain
}
.navlinks {
    display:flex;
    min-width:0;
    align-items:center;
    gap:22px;
    font-size:13px;
    font-weight:600
}
.navlinks>a,.menu-trigger {
    display:flex;
    white-space:nowrap;
    align-items:center;
    min-height:44px;
    color:#e4e9ec;
    transition:color .18s
}
.navlinks>a:hover,.navlinks>a.active,.menu-trigger:hover {
    color:#e3a06a
}
.navcta {
    padding:10px 15px;
    border:1px solid #c8752d;
    border-radius:5px;
    color:#fff!important
}
.navcta:hover {
    background:var(--accent);
    color:#fff!important
}
.nav-dropdown {
    position:static;
    height:100%;
    display:flex;
    align-items:center
}
.menu-trigger {
    gap:8px
}
.menu-chevron {
    width:7px;
    height:7px;
    border-right:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;
    transform:rotate(45deg) translateY(-2px)
}
.mega-menu {
    display:none;
    position:absolute;
    z-index:1010;
    left:0;
    right:0;
    top:100%;
    width:min(1380px, calc(100vw - 48px));
    max-width:1380px;
    margin:0 auto;
    padding:26px;
    background:#fff;
    color:var(--ink);
    border:1px solid var(--line);
    border-radius:0 0 10px 10px;
    box-shadow:0 24px 50px rgba(0,0,0,.2)
}
.mega-menu::before {
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:-12px;
    height:12px;
}
.nav-dropdown:hover .mega-menu,.nav-dropdown:focus-within .mega-menu,.nav-dropdown.open .mega-menu {
    display:block;
    animation:megaEnter .16s ease-out both;
}
@keyframes megaEnter {from {opacity:0; transform:translate(-50%,5px)} to {opacity:1; transform:translate(-50%,0)}}
.mega-head {
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:28px;
    padding-bottom:18px;
    border-bottom:1px solid var(--line)
}
.mega-head h3 {
    margin:4px 0 0;
    font-size:23px
}
.mega-head p {
    max-width:430px;
    margin:0;
    color:var(--muted);
    font-size:13px
}
.mega-grid {
    display:grid;
    grid-template-columns:1.1fr 1fr 1fr 1fr;
    gap:18px;
    padding:20px 0
}
.mega-feature {
    min-height:230px;
    display:flex;
    align-items:end;
    background-position:center;
    background-size:cover;
    border-radius:7px;
    overflow:hidden;
    color:#fff
}
.mega-content {
    padding:20px;
    background:linear-gradient(0deg,rgba(10,19,25,.95),rgba(10,19,25,.05))
}
.mega-content h4 {
    margin:6px 0;
    font-size:23px
}
.mega-content p {
    margin:0;
    color:#e0e6e9;
    font-size:12px
}
.mega-tag {
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.12em;
    color:#f0bd92
}
.mega-list {
    display:flex;
    flex-direction:column;
    gap:0
}
.mega-list>a {
    padding:10px 8px;
    border-bottom:1px solid #e7ecef;
    font-weight:700;
    font-size:12px
}
.mega-list>a span {
    display:block;
    margin-top:3px;
    color:var(--muted);
    font-size:11px;
    font-weight:400
}
.mega-list>a:hover {
    color:var(--accent)
}
.mega-bottom {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border-top:1px solid var(--line);
    padding-top:16px
}
.mega-bottom p {
    margin:0;
    color:var(--muted);
    font-size:13px
}
.menu {
    display:none;
    border:1px solid var(--line-dark);
    background:transparent;
    color:white;
    border-radius:5px;
    padding:9px 12px;
    font-size:21px;
    cursor:pointer
}
/* Typography and buttons */
h1,h2,h3,h4,h5,h6 {
    margin:0 0 14px;
    color:inherit;
    line-height:1.16;
    font-weight:750;
    letter-spacing:-.025em
}
h1,h2 {
    font-family:"Barlow Condensed",Inter,sans-serif;
    font-weight:700;
    letter-spacing:-.015em
}
h1,.hero-title {
    font-size:clamp(42px,6vw,76px)
}
.hero-title { margin:0 0 14px; color:inherit; line-height:1.16; font-family:"Barlow Condensed",Inter,sans-serif; font-weight:700; letter-spacing:-.015em; }
h2 {
    font-size:clamp(34px,4.4vw,56px)
}
h3 {
    font-size:21px
}
p {
    margin:0 0 16px;
    color:var(--muted)
}
.kicker,.eyebrow {
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.14em;
    color:var(--accent);
}
.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:46px;
    padding:12px 18px;
    border:1px solid transparent;
    border-radius:5px;
    font-size:12px;
    font-weight:700;
    line-height:1.2;
    transition:background .2s,border-color .2s,transform .2s
}
.btn:hover {
    transform:translateY(-1px)
}
.btn.primary {
    background:var(--accent);
    color:#fff;
    border-color:var(--accent)
}
.btn.primary:hover {
    background:var(--accent-hover);
    border-color:var(--accent-hover)
}
.btn.ghost {
    background:transparent;
    border-color:rgba(255,255,255,.55);
    color:#fff
}
.btn.ghost:hover {
    background:#fff;
    color:var(--dark);
    border-color:#fff
}
.actions {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:24px
}
.arrow {
    font-size:20px;
    color:var(--accent)
}
/* Hero areas */
.hero,.pagehero {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:var(--dark);
    color:var(--dark-text);
    margin-top:-82px
}
.hero {
    min-height: min(760px, calc(100svh - 28px));
    display:flex;
    align-items:center
}
.hero:before {
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    background:linear-gradient(90deg,rgba(13,24,31,.94),rgba(13,24,31,.7) 52%,rgba(13,24,31,.22)),url("https://www.jecpl.co.in/wp-content/uploads/2024/07/rope-painting.png") center/cover no-repeat
}
.hero .container {
    position:relative;
    z-index:2;
    padding:168px 0 86px
}
.hero h1 {
    max-width:850px;
    color:#fff;
    margin:18px 0
}
.hero h1 span {
    color:#e0a06c
}
.hero p {
    max-width:690px;
    color:#e0e6e9;
    font-size:16px;
    line-height:1.8
}
.hero .eyebrow {
    color:#e9b58c
}
.hero-video-frame,.hero-video-overlay {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0
}
.hero-video-frame {
    z-index:0;
    pointer-events:none;
    width:max(100%,177.78vh);
    height:max(100%,56.25vw);
    left:50%;
    top:50%;
    transform:translate(-50%,-50%)
}
.hero-video-overlay {
    z-index:1;
    background:linear-gradient(90deg,rgba(13,24,31,.93),rgba(13,24,31,.72) 55%,rgba(13,24,31,.34)),linear-gradient(0deg,rgba(13,24,31,.6),transparent 55%)
}
.hero-slides {
    position:relative;
    z-index:2;
    max-width:900px
}
.hero-slide {
    display:none
}
.hero-slide.is-active {
    display:block;
    animation:slideIn .65s cubic-bezier(.2,.7,.2,1) both
}
.pagehero {
    min-height:300px;
    display:flex;
    align-items:center;
    background:linear-gradient(110deg,#17242d,#2a3b46)
}
.pagehero:before {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(17,29,37,.93),rgba(17,29,37,.65)),var(--pagehero-image,none) center/cover no-repeat;
    z-index:-1
}
.pagehero .container {
    padding:140px 0 58px
}
.pagehero h1 {
    font-size:clamp(40px,5vw,64px);
    max-width:850px;
    color:#fff
}
.pagehero p {
    max-width:720px;
    color:var(--dark-muted)
}
.hero-dark-overlay {
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(14,25,32,.9),rgba(14,25,32,.45));
    pointer-events:none
}
.hero-rope,.hero-crane-erection,.hero-fabrication,.hero-company,.hero-cleaning,.hero-manpower,.hero-projects,.hero-structural,.hero-services,.hero-contact,.hero-inspection,.hero-equipment,.hero-careers,.hero-crane-maintenance,.hero-civil,.hero-faq {
    background-position:center;
    background-size:cover
}
/* Individual inner-page hero photography (homepage video remains unchanged). */
.hero-company { --pagehero-image:url("../assets/rope-access/rope-access-industrial-team.webp"); }
.hero-rope { --pagehero-image:url("../assets/rope-access/rope-access-steel-frame-day.webp"); }
.hero-projects { --pagehero-image:url("../assets/rope-access/rope-access-conveyor-wide.webp"); }
.hero-services { --pagehero-image:url("../assets/rope-access/rope-access-industrial-platform.webp"); }
.hero-contact { --pagehero-image:url("../assets/rope-access/rope-access-blue-support-column.webp"); }
.hero-careers { --pagehero-image:url("../assets/rope-access/rope-access-industrial-team.webp"); }
.hero-faq { --pagehero-image:url("../assets/rope-access/rope-access-industrial-vessel.webp"); }
.hero-cleaning { --pagehero-image:url("../assets/rope-access/rope-access-industrial-vessel.webp"); }
.hero-crane-erection,.hero-crane-maintenance,.hero-equipment { --pagehero-image:url("../assets/rope-access/rope-access-blue-support-column.webp"); }
.hero-fabrication,.hero-structural,.hero-civil { --pagehero-image:url("../assets/rope-access/rope-access-industrial-steelwork.webp"); }
.hero-inspection { --pagehero-image:url("../assets/rope-access/rope-access-vessel-maintenance.webp"); }
.pagehero:before { background:linear-gradient(90deg,rgba(17,29,37,.88),rgba(17,29,37,.52)),var(--pagehero-image,none) center/cover no-repeat; }

.ticker {
    overflow:hidden;
    background:#e9eef1;
    border-block:1px solid #dce3e7;
    color:#43535d
}
.ticker .track {
    display:flex;
    width:max-content;
    justify-content:space-around;
    gap:34px;
    padding:13px 20px;
    white-space:nowrap;
    font-size:10px;
    font-weight:800;
    letter-spacing:.12em;
    animation:tickerMove 34s linear infinite
}
.ticker:hover .track {
    animation-play-state:paused
}
.ticker span:before {
    content:"•";
    margin-right:14px;
    color:var(--accent)
}
/* Sections and layouts */
.section {
    padding:76px 0;
    background:var(--page);
    color:var(--ink)
}
.section.dark {
    background:var(--dark);
    color:var(--dark-text)
}
.section.dark p {
    color:var(--dark-muted)
}
.section.steel {
    background:var(--surface-alt);
    color:var(--ink)
}
.section-head {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(280px,.75fr);
    align-items:end;
    gap:40px;
    margin-bottom:34px
}
.section-head h2 {
    margin:9px 0 0;
    color:inherit
}
.section-head p {
    margin:0;
    max-width:600px;
    color:var(--muted);
    line-height:1.85
}
.section.dark .section-head p {
    color:var(--dark-muted)
}
.section.dark .kicker {
    color:#e0a06c
}
.split {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:54px;
    align-items:center
}
.media {
    min-height:350px;
    background-position:center;
    background-size:cover;
    border-radius:var(--radius);
    overflow:hidden
}
.bigcopy p {
    font-size:15px;
    line-height:1.9
}
.grid {
    display:grid;
    gap:20px
}
.grid-2 {
    grid-template-columns:repeat(2,minmax(0,1fr))
}
.grid-3 {
    grid-template-columns:repeat(3,minmax(0,1fr))
}
.grid-4 {
    grid-template-columns:repeat(4,minmax(0,1fr))
}
.card,.service-card,.feature,.sector,.step,.workflow-step,.industry-card,.industry-panel,.contact-info-card,.address-panel {
    min-width:0;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--surface);
    color:var(--ink);
    box-shadow:0 4px 18px rgba(23,37,46,.035)
}
.card,.service-card,.feature,.sector,.step,.workflow-step,.industry-card,.industry-panel {
    padding:24px
}
.card,.service-card,.industry-card,.sector,.step,.workflow-step,.industry-panel,.contact-info-card,.address-panel,.team-card,.cert {
    transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease
}
.card:hover,.service-card:hover,.industry-card:hover,.sector:hover,.step:hover,.workflow-step:hover,.industry-panel:hover,.contact-info-card:hover,.address-panel:hover,.team-card:hover,.cert:hover {
    transform:translateY(-4px);
    border-color:#c7a184;
    box-shadow:var(--shadow)
}
.card h3,.service-card h3,.feature h3,.sector h3,.step h3,.workflow-step h3,.industry-card h3,.industry-panel h3 {
    color:var(--ink)
}
.card p,.service-card p,.feature p,.sector p,.step p,.workflow-step p,.industry-card p,.industry-panel p {
    color:var(--muted);
    font-size:13px;
    line-height:1.8
}
.service-card img,.service-card .image {
    display:block;
    width:calc(100% + 48px);
    max-width:none;
    height:205px;
    aspect-ratio:16/9;
    object-fit:cover;
    background-position:center;
    background-size:cover;
    margin:-24px -24px 20px;
    border-radius:var(--radius) var(--radius) 0 0;
    transition:transform .45s ease
}
.service-card:hover .image,.service-card:hover img {
    transform:scale(1.025)
}
.service-card .body {
    padding:0
}
.service-card {
    overflow:hidden
}
.service-card .body h3 {
    min-height:2.32em
}
.service-card .arrow {
    display:inline-block;
    margin-top:8px
}
.statbar {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--surface);
    overflow:hidden
}
.stat {
    padding:23px 20px;
    display:flex;
    flex-direction:column;
    gap:4px;
    border-right:1px solid var(--line);
    transition:background .25s ease
}
.stat:hover {
    background:#f7f8f9
}
.stat:last-child {
    border-right:0
}
.stat strong {
    font-family:"Barlow Condensed",Inter,sans-serif;
    font-size:32px;
    line-height:1.15;
    color:var(--ink)
}
.stat span {
    font-size:12px;
    color:var(--muted)
}
.stat-plus {
    display:inline!important;
    font-size:inherit!important;
    color:inherit!important
}
.section.dark .statbar {
    background:rgba(255,255,255,.04);
    border-color:var(--line-dark)
}
.section.dark .stat {
    border-color:var(--line-dark)
}
.section.dark .stat:hover {
    background:rgba(255,255,255,.07)
}
.section.dark .stat strong {
    color:#fff
}
.section.dark .stat span {
    color:var(--dark-muted)
}
.stats-section {
    background:#e9eef1
}
.orange-corner {
    border-top:3px solid var(--accent)
}
.checks,.feature-list,.industry-list {
    padding:0;
    margin:18px 0;
    list-style:none
}
.checks li,.feature-list li,.industry-list li {
    position:relative;
    padding:8px 0 8px 24px;
    border-bottom:1px solid var(--line);
    color:var(--muted);
    font-size:13px
}
.checks li:before,.feature-list li:before,.industry-list li:before {
    content:"✓";
    position:absolute;
    left:0;
    color:var(--accent);
    font-weight:800
}
.section.dark .checks li,.section.dark .feature-list li,.section.dark .industry-list li {
    border-color:var(--line-dark);
    color:var(--dark-muted)
}
.industry-no {
    display:block;
    margin-bottom:13px;
    color:var(--accent);
    font-size:10px;
    font-weight:800;
    letter-spacing:.12em
}
.workflow {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:14px
}
.workflow-step .num {
    font-family:"Barlow Condensed",Inter,sans-serif;
    font-size:30px;
    color:var(--accent);
    margin-bottom:12px
}
.industry-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px
}
.industry-grid-4 {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px
}
.industry-panel {
    background:#f9fafb
}
.section.dark .industry-card,.section.dark .industry-panel {
    background:var(--dark-2);
    border-color:var(--line-dark);
    color:var(--dark-text)
}
.section.dark .industry-card h3,.section.dark .industry-panel h3 {
    color:#fff
}
.section.dark .industry-card p,.section.dark .industry-panel p {
    color:var(--dark-muted)
}
.gallery {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:12px
}
.gallery figure {
    grid-column:span 2;
    min-height:220px;
    margin:0;
    border-radius:8px;
    background-position:center;
    background-size:cover;
    position:relative;
    overflow:hidden
}
.gallery figure:nth-child(1),.gallery figure:nth-child(4) {
    grid-column:span 3
}
.gallery figure:after {
    content:attr(data-label);
    position:absolute;
    inset:auto 0 0;
    padding:30px 16px 14px;
    color:#fff;
    font-size:12px;
    font-weight:700;
    background:linear-gradient(transparent,rgba(10,20,26,.88))
}
.cert-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:20px
}
.cert {
    padding:16px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:8px;
    text-align:center
}
.cert img {
    max-height:320px;
    object-fit:contain
}
.team-card {
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:#fff
}
.team-card img {
    width:100%;
    aspect-ratio:4/3;
    object-fit:cover
}
.team-body {
    padding:18px;
}
.team-body h3 {
    margin-bottom:4px;
    color:#333;
}
.team-body p {
    color:#777 !important;
    font-size:14px !important;
}
.team-role {
    font-size:12px;
    color:var(--accent);
}
.team-scroll {
    display:flex;
    gap:18px;
    overflow:auto
}
.org-row {
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:24px;
    align-items:center
}
.org-image-wrap {
    padding:12px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:var(--radius)
}
.org-caption {
    font-size:12px;
    color:var(--muted);
    margin-top:8px
}
.org-responsibilities {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px
}
.client-marquee {
    overflow:hidden
}
.client-track {
    display:flex;
    gap:28px;
    align-items:center
}
.client-track img {
    max-width:150px;
    max-height:70px;
    object-fit:contain
}
/* Contact and forms */
.contact-info-grid,.contact-main-grid,.contact-capability-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px
}
.contact-info-card {
    display:flex;
    align-items:flex-start;
    gap:14px;
    padding:20px
}
.contact-icon {
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    flex-shrink:0;
    border-radius:7px;
    background:#f3e8df;
    color:var(--accent)
}
.contact-label {
    display:block;
    margin-bottom:4px;
    color:var(--muted);
    font-size:10px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase
}
.contact-info-card strong {
    color:var(--ink);
    overflow-wrap:anywhere
}
.contact-info-card p {
    margin:4px 0 0;
    font-size:13px
}
.form {
    padding:28px;
    background:#fff;
    color:var(--ink);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow)
}
.form-heading {
    margin-bottom:20px
}
.form-heading h2,.form-heading h3 {
    color:var(--ink)
}
.form-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px
}
.form label {
    display:block;
    margin-bottom:6px;
    color:#334650;
    font-size:12px;
    font-weight:700
}
.form input:not([type=checkbox]):not([type=radio]),.form select,.form textarea,input:not([type=checkbox]):not([type=radio]),select,textarea {
    width:100%;
    min-height:46px;
    padding:11px 12px;
    border:1px solid #cbd5da;
    border-radius:5px;
    background:#fff;
    color:#17252e;
    font-size:14px
}
.form textarea,textarea {
    min-height:130px;
    resize:vertical
}
.form input::placeholder,.form textarea::placeholder,input::placeholder,textarea::placeholder {
    color:#6b7a83;
    opacity:1
}
.form input:focus,.form select:focus,.form textarea:focus {
    border-color:var(--accent);
    outline:2px solid rgba(200,117,45,.15)
}
.form input[type=checkbox],.form input[type=radio] {
    width:auto;
    min-height:auto;
    accent-color:var(--accent)
}
.form-note {
    font-size:12px;
    color:var(--muted)
}
.contact-service-strip,.contact-coverage,.contact-bottom {
    padding:28px;
    background:var(--surface-alt);
    border-radius:var(--radius)
}
.contact-bottom-inner {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px
}
.contact-title {
    font-family:"Barlow Condensed",Inter,sans-serif;
    font-size:clamp(36px,4vw,52px)
}
.contact-lead {
    font-size:16px
}
.contact-hero {
    min-height:360px
}
.contact-info-section {
    padding-top:40px
}
.map-layout {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px
}
.map-frame {
    min-height:320px;
    border:0;
    border-radius:var(--radius);
    overflow:hidden
}
.address-panel {
    padding:24px
}
.address-panel h3 {
    color:var(--ink)
}
.address-panel p {
    font-size:13px
}
.address-actions {
    display:flex;
    flex-wrap:wrap;
    gap:10px
}
.contact-bottom {
    background:var(--dark);
    color:#fff
}
.contact-bottom h2 {
    color:#fff
}
.contact-bottom p {
    color:var(--dark-muted)
}
.contact-bottom .btn.ghost {
    border-color:#83919a
}
/* FAQ, projects, services and utility components */
.faq details {
    padding:18px 0;
    border-bottom:1px solid var(--line)
}
.faq summary {
    cursor:pointer;
    font-weight:700;
    color:var(--ink)
}
.faq details p {
    margin:12px 0 0;
    color:var(--muted)
}
.section.dark .faq details {
    border-color:var(--line-dark)
}
.section.dark .faq summary {
    color:#fff
}
.section.dark .faq details p {
    color:var(--dark-muted)
}
.ribbon {
    padding:36px 0;
    background:#263741;
    color:#fff
}
.ribbon .container {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px
}
.ribbon h2 {
    font-size:clamp(27px,3vw,38px);
    margin:0;
    max-width:700px;
    color:#fff
}
.ribbon .actions {
    margin:0
}
.evidence-strip {
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:36px;
    align-items:center
}
.evidence-image {
    min-height:330px;
    border-radius:var(--radius);
    background-position:center;
    background-size:cover
}
.evidence-copy h2 {
    margin:10px 0
}
.evidence-copy p {
    color:var(--dark-muted)
}
.anchor-nav {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:20px
}
.anchor-nav a {
    padding:9px 12px;
    border:1px solid var(--line-dark);
    border-radius:5px;
    font-size:12px;
    font-weight:700;
    color:#fff
}
.anchor-nav a:hover {
    background:#fff;
    color:var(--dark)
}
.leadimg {
    width:100%;
    max-height:440px;
    object-fit:cover;
    border-radius:var(--radius)
}
.detail-copy p {
    line-height:1.9
}
.service-pills {
    display:flex;
    flex-wrap:wrap;
    gap:9px
}
.service-pills a {
    padding:8px 12px;
    border:1px solid var(--line);
    border-radius:999px;
    background:#fff;
    color:var(--ink);
    font-size:12px;
    font-weight:600
}
.service-pills a:hover {
    border-color:var(--accent);
    color:var(--accent)
}
.full {
    width:100%
}
.footbottom {
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding-top:22px;
    margin-top:35px;
    border-top:1px solid var(--line-dark);
    color:#aebbc3;
    font-size:11px
}
.footer {
    padding:56px 0 24px
}
.footergrid {
    display:grid;
    grid-template-columns:1.5fr .8fr 1fr 1.2fr;
    gap:36px
}
.footergrid h3 {
    color:#fff;
    font-size:14px;
    letter-spacing:0
}
.footergrid p {
    color:#bdc8ce;
    font-size:12px;
    line-height:1.8
}
.footergrid a {
    display:block;
    width:fit-content;
    margin:7px 0;
    color:#d7dfe3;
    font-size:12px
}
.footergrid a:hover {
    color:#e3a06a
}
footer {
    background:#111c23;
    color:#e8edef;
    border-top:1px solid rgba(255,255,255,.1)
}
.mobile-cta {
    display:none
}
@keyframes slideIn {
    from {
        opacity:0;
        transform:translate3d(0,14px,0)
    }
    to {
        opacity:1;
        transform:translate3d(0,0,0)
    }
}
@keyframes tickerMove {
    from {
        transform:translateX(0)
    }
    to {
        transform:translateX(-35%)
    }
}
@keyframes progressRun {
    from {
        width:0
    }
    to {
        width:100%
    }
}
.js .motion-reveal {
    opacity:0;
    transform:translate3d(0,22px,0);
    transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1);
    transition-delay:calc(var(--i,0)*55ms)
}
.js .motion-reveal.is-visible {
    opacity:1;
    transform:translate3d(0,0,0)
}
.hero-progress {
    position:absolute;
    z-index:3;
    left:0;
    right:0;
    bottom:0;
    height:3px;
    background:rgba(255,255,255,.18)
}
.hero-progress span {
    display:block;
    width:0;
    height:100%;
    background:var(--accent)
}
.cursor-glow {
    position:fixed;
    z-index:999;
    left:0;
    top:0;
    width:180px;
    height:180px;
    border-radius:50%;
    pointer-events:none;
    opacity:0;
    transform:translate(-50%,-50%);
    background:radial-gradient(circle,rgba(200,117,45,.08),transparent 68%);
    transition:opacity .25s ease
}
.cursor-glow.active {
    opacity:1
}
.btn {
    position:relative;
    overflow:hidden
}
.ripple {
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    pointer-events:none;
    background:rgba(255,255,255,.38);
    transform:translate(-50%,-50%);
    animation:rippleOut .6s ease-out forwards
}
@keyframes rippleOut {
    to {
        width:220px;
        height:220px;
        opacity:0
    }
}
.nav.nav-scrolled {
    background:rgba(23,36,45,.97);
    border-bottom-color:rgba(255,255,255,.12);
    box-shadow:0 8px 28px rgba(0,0,0,.16)
}
.navlinks.open {
    box-shadow:0 18px 30px rgba(0,0,0,.18)
}
@media(hover:none) {
    .cursor-glow {
        display:none
    }
    .card:hover,.service-card:hover,.industry-card:hover,.sector:hover,.step:hover,.workflow-step:hover,.industry-panel:hover,.contact-info-card:hover,.address-panel:hover,.team-card:hover,.cert:hover {
        transform:none;
        box-shadow:0 4px 18px rgba(23,37,46,.035)
    }
}
/* Responsive layout */
@media(max-width:1180px) {
    .nav .menu {
        display:block
    }
    .navlinks {
        display:none;
        position:absolute;
        top:100%;
        left:0;
        right:0;
        z-index:1020;
        max-height:calc(100vh - 90px);
        overflow:auto;
        padding:14px 22px 24px;
        background:#17242d;
        border-top:1px solid var(--line-dark);
        align-items:stretch;
        gap:2px;
        flex-direction:column
    }
    .navlinks.open {
        display:flex
    }
    .nav-dropdown {
        display:block;
        width:100%
    }
    .mega-menu {
        position:static;
        width:100%;
        max-width:none;
        display:none;
        margin:0;
        padding:18px;
        border-radius:7px;
        box-shadow:none
    }
    .mega-menu::before {
        display:none
    }
    .nav-dropdown.open .mega-menu {
        display:block
    }
    .menu-trigger {
        width:100%;
        justify-content:space-between;
        white-space:normal
    }
    .mega-feature {
        min-height:200px
    }
    .grid-4,.industry-grid-4 {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .workflow {
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    .footergrid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .hero {
        min-height:560px
    }
}
@media(max-width:820px) {
    .hero,.pagehero { margin-top:-70px; }
    .hero .container { padding-top:142px; }
    .pagehero .container { padding-top:114px; }
    .container {
        width:min(var(--max),calc(100% - 36px))
    }
    .topbar .inner {
        font-size:9px
    }
    .nav .inner {
        min-height:72px
    }
    .brand img {
        width:160px
    }
    .navlinks>a,.menu-trigger {
        min-height:44px;
        padding:5px 0;
        white-space:normal
    }
    .mega-head {
        display:block
    }
    .mega-head p {
        margin-top:10px
    }
    .mega-grid {
        grid-template-columns:1fr
    }
    .mega-feature {
        min-height:180px
    }
    .mega-bottom {
        align-items:flex-start;
        flex-direction:column
    }
    .section {
        padding:58px 0
    }
    .section-head {
        grid-template-columns:1fr;
        gap:14px;
        margin-bottom:26px
    }
    .split,.evidence-strip,.org-row,.map-layout {
        grid-template-columns:1fr;
        gap:28px
    }
    .grid-3 {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .industry-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .statbar {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .stat:nth-child(2) {
        border-right:0
    }
    .stat:nth-child(-n+2) {
        border-bottom:1px solid var(--line)
    }
    .section.dark .stat:nth-child(-n+2) {
        border-bottom-color:var(--line-dark)
    }
    .hero {
        min-height:540px
    }
    .hero .container {
        padding-block:72px
    }
    .pagehero {
        min-height:260px
    }
    .pagehero .container {
        padding-block:48px
    }
    .contact-main-grid,.contact-info-grid,.contact-capability-grid {
        grid-template-columns:1fr
    }
    .gallery figure {
        grid-column:span 3
    }
    .cert-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .ribbon .container,.contact-bottom-inner {
        align-items:flex-start;
        flex-direction:column
    }
    .ribbon .actions {
        margin-top:4px
    }
}
@media(max-width:560px) {
    .container {
        width:calc(100% - 30px)
    }
    .topbar .inner {
        padding:7px 0;
        display:block;
        text-align:center
    }
    .topbar .inner>div+div {
        display:none
    }
    .brand img {
        width:142px;
        max-height:48px
    }
    .nav .inner {
        gap:12px
    }
    .mega-menu {
        padding:12px
    }
    .mega-list>a {
        padding:11px 6px
    }
    .hero {
        min-height:540px;
        min-height:min(680px,calc(100svh - 90px))
    }
    .hero .container {
        padding-block:60px
    }
    .hero-video-overlay {
        background:linear-gradient(90deg,rgba(13,24,31,.91),rgba(13,24,31,.72)),linear-gradient(0deg,rgba(13,24,31,.45),transparent)
    }
    .hero h1 {
        font-size:clamp(40px,12vw,58px)
    }
    .hero p {
        font-size:14px
    }
    .actions {
        gap:9px
    }
    .btn {
        min-height:43px;
        padding:11px 13px
    }
    .section {
        padding:48px 0
    }
    .section-head h2 {
        font-size:clamp(32px,10vw,44px)
    }
    .grid-2,.grid-3,.grid-4,.industry-grid,.industry-grid-4,.workflow,.org-responsibilities {
        grid-template-columns:1fr
    }
    .workflow-step,.industry-card,.industry-panel,.sector,.step {
        height:100%
    }
    .actions .btn {
        flex:0 1 auto
    }
    .hero .actions .btn {
        min-width:0
    }
    .card,.service-card,.feature,.sector,.step,.workflow-step,.industry-card,.industry-panel {
        padding:20px
    }
    .service-card .image,.service-card img {
        width:calc(100% + 40px);
        margin:-20px -20px 18px;
        height:180px
    }
    .stat {
        padding:18px 14px
    }
    .stat strong {
        font-size:27px
    }
    .stat span {
        font-size:11px
    }
    .gallery {
        grid-template-columns:1fr 1fr
    }
    .gallery figure,.gallery figure:nth-child(1),.gallery figure:nth-child(4) {
        grid-column:span 1;
        min-height:160px
    }
    .cert-grid {
        grid-template-columns:1fr
    }
    .form {
        padding:20px
    }
    .form-grid {
        grid-template-columns:1fr
    }
    .footergrid {
        grid-template-columns:1fr;
        gap:22px
    }
    .footbottom {
        flex-direction:column;
        gap:7px
    }
    .pagehero {
        min-height:240px
    }
    .pagehero h1 {
        font-size:40px
    }
    .pagehero .container {
        padding-block:42px
    }
    .ticker .track {
        justify-content:flex-start
    }
    .mobile-cta {
        display:block;
        position:fixed;
        z-index:90;
        bottom:10px;
        left:12px;
        right:12px;
        text-align:center;
        padding:12px;
        background:var(--accent);
        color:#fff;
        border-radius:6px;
        font-size:13px;
        font-weight:800;
        box-shadow:0 8px 24px rgba(0,0,0,.22)
    }
    body {
        padding-bottom:56px
    }
    .ribbon {
        padding:28px 0
    }
    .ribbon h2 {
        font-size:30px
    }
    .contact-title {
        font-size:38px
    }
}
@media(prefers-reduced-motion:reduce) {
    *,*::before,*::after {
        scroll-behavior:auto!important;
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        transition-duration:.01ms!important
    }
}


/* Keyboard skip navigation. */
.skip-link { position:fixed; z-index:2000; left:16px; top:12px; padding:10px 14px; background:#fff; color:#17242d; border-radius:6px; transform:translateY(-160%); box-shadow:var(--shadow); }
.skip-link:focus { transform:translateY(0); }
.mega-menu a:focus-visible { outline-offset:2px; }


/* Production refinement: responsive grids, full-bleed field imagery and bounded navigation. */
.team-scroll.team-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;overflow:visible}
.team-grid .team-card{min-width:0;width:auto;height:100%}
.team-grid .team-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.mega-menu{left:50%;right:auto;transform:translateX(-50%);width:min(1240px,calc(100vw - 40px));max-width:calc(100vw - 40px);box-sizing:border-box}
.mega-menu:hover{display:block}
.client-marquee{overflow:hidden;position:relative;width:100%;}
.sector-track{width:max-content;animation:sectorScroll 34s linear infinite;gap:16px;padding:8px 0}
.sector-track span{display:flex;align-items:center;justify-content:center;min-height:66px;padding:14px 24px;border:1px solid var(--line);border-radius:5px;background:rgba(255,255,255,.04);color:inherit;font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.client-proof-section .client-marquee:hover .sector-track{animation-play-state:paused}
@keyframes sectorScroll{to{transform:translateX(-50%)}}
.map-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.8fr);gap:24px;align-items:stretch}
.map-frame{position:relative;min-height:440px;overflow:hidden;border-radius:var(--radius);background:#e9edf0}
.map-frame iframe{position:absolute;inset:0;width:100%;height:100%;min-height:440px;border:0;display:block}
.address-panel{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:clamp(24px,3vw,40px);border:1px solid var(--line);border-radius:var(--radius)}
.enquiry-points>div{display:grid;grid-template-columns:46px minmax(0,1fr);gap:14px;align-items:start}
.enquiry-points>div span{display:block;line-height:1.65}
.enquiry-points strong{display:block;margin-bottom:4px}
.rope-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.rope-gallery figure{margin:0;overflow:hidden;border-radius:6px;background:#dce1e3;aspect-ratio:4/5}
.rope-gallery img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.rope-gallery figure:hover img{transform:scale(1.045)}
.service-detail .leadimg{width:100%;height:100%;min-height:420px;max-height:680px;object-fit:cover;border-radius:var(--radius)}
.feature-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.feature{min-width:0;padding:18px;border:1px solid var(--line);border-radius:6px}
.feature strong,.feature span{display:block}
.feature span{margin-top:7px;line-height:1.6}
@media(max-width:1000px){.team-scroll.team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mega-menu{width:calc(100vw - 32px);max-width:calc(100vw - 32px)}.map-layout{grid-template-columns:minmax(0,1.2fr) minmax(250px,.8fr)}.rope-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.team-scroll.team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.map-layout{grid-template-columns:1fr}.map-frame,.map-frame iframe{min-height:320px}.rope-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.feature-list{grid-template-columns:1fr}.sector-track span{min-height:58px;padding:12px 16px;font-size:12px}.service-detail .leadimg{min-height:260px}.enquiry-points>div{grid-template-columns:38px minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){.sector-track,.rope-gallery img{animation:none!important;transition:none!important}}
/* Project photography gallery */
.project-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.project-photo-grid figure{margin:0;position:relative;overflow:hidden;min-width:0;aspect-ratio:4/3;background:#17242d;border-radius:5px}
.project-photo-grid img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .4s}
.project-photo-grid figure:hover img{transform:scale(1.045);filter:saturate(1.06)}
.project-photo-grid figcaption{position:absolute;inset:auto 0 0;padding:34px 18px 16px;color:#fff;font-weight:700;background:linear-gradient(transparent,rgba(12,22,28,.86))}
@media(max-width:900px){.project-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.project-photo-grid{grid-template-columns:1fr;gap:14px}.project-photo-grid figure{aspect-ratio:5/4}}

/* Contact enquiry steps and homepage field gallery */
.contact-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}
.contact-steps>div{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:start;min-width:0;padding:22px 18px;border:1px solid rgba(255,255,255,.13);border-radius:7px;background:rgba(255,255,255,.035);transition:transform .25s ease,border-color .25s ease,background .25s ease}
.contact-steps>div:hover{transform:translateY(-3px);border-color:rgba(224,160,108,.55);background:rgba(255,255,255,.06)}
.contact-steps>div>b{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(224,160,108,.55);border-radius:5px;color:#e0a06c;font-size:15px;font-weight:800;letter-spacing:.04em}
.contact-steps>div span{color:var(--dark-muted);font-size:14px;line-height:1.75}
.contact-steps strong{display:block;margin:1px 0 7px;color:var(--dark-text);font-size:16px;line-height:1.35}
.home-field-visuals .section-head{margin-bottom:32px}
.home-field-grid figure{aspect-ratio:4/3}
.home-field-grid figcaption{font-size:15px}
@media(max-width:680px){.contact-steps{grid-template-columns:1fr;gap:12px}.contact-steps>div{padding:18px 16px;grid-template-columns:42px minmax(0,1fr)}.contact-steps>div>b{width:38px;height:38px}.home-field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.home-field-grid figure{aspect-ratio:4/5}.home-field-grid figcaption{padding:28px 12px 12px;font-size:13px}}
@media(max-width:420px){.home-field-grid{grid-template-columns:1fr}.home-field-grid figure{aspect-ratio:5/4}}


/* Production polish: restrained motion, image loading stability and focus accessibility. */
:root{scroll-behavior:smooth;scroll-padding-top:96px}
img{max-width:100%;height:auto}
.project-photo-grid img,.rope-gallery img,.team-card img{background:#e7ebee}
.btn,.navcta,.service-card,.industry-card,.industry-panel,.workflow-step,.feature,.project-photo-grid figure,.rope-gallery figure{transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease,background-color .28s ease}
.btn:hover,.navcta:hover{box-shadow:0 12px 28px rgba(0,0,0,.16)}
.service-card:hover,.industry-card:hover,.industry-panel:hover,.workflow-step:hover,.feature:hover{transform:translateY(-4px)}
.project-photo-grid figure,.rope-gallery figure{isolation:isolate}
.project-photo-grid figure:after,.rope-gallery figure:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid rgba(255,255,255,.08);opacity:0;transition:opacity .35s ease}
.project-photo-grid figure:hover:after,.rope-gallery figure:hover:after{opacity:1}
:focus-visible{outline:3px solid #e0a06c;outline-offset:3px}
.home-field-actions{margin-top:24px}
@media(hover:hover) and (pointer:fine){.project-photo-grid figure:hover,.rope-gallery figure:hover{box-shadow:0 18px 36px rgba(0,0,0,.2)}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}


/* Final responsive motion, service galleries and navigation refinements */
.mega-menu{left:50%;right:auto;transform:translateX(-50%);width:min(1380px,calc(100vw - 48px));box-sizing:border-box;overflow:hidden}
@keyframes megaEnter{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}
.mega-grid>*{min-width:0}
.mega-list a{overflow-wrap:anywhere}
@media(max-width:1180px){.mega-menu{left:auto;right:auto;transform:none;width:100%;max-width:100%;max-height:none;overflow:visible;box-sizing:border-box}.navlinks{box-sizing:border-box;width:100%;overscroll-behavior:contain}.mega-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mega-feature{grid-column:1/-1;min-height:160px}.mega-menu .mega-bottom{flex-wrap:wrap}.nav-dropdown.open .mega-menu{animation:mobileMegaIn .22s ease both}@keyframes mobileMegaIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}}
@media(max-width:560px){.navlinks{padding:10px 16px 22px}.mega-menu{padding:14px}.mega-head h3{font-size:20px}.mega-grid{grid-template-columns:1fr;gap:8px;padding:12px 0}.mega-feature{min-height:145px}.mega-list>a{font-size:13px;padding:11px 8px}.mega-list>a span{font-size:12px}.mega-bottom{gap:12px}.navlinks>a,.menu-trigger{font-size:14px}}
/* The hero sits behind the transparent header; add safe mobile clearance below the fixed header. */
@media(max-width:820px){.hero,.pagehero{margin-top:-82px}.hero .container{padding-top:clamp(148px,22vw,176px)}.pagehero .container{padding-top:clamp(126px,20vw,154px);padding-bottom:44px}.pagehero{min-height:300px}.topbar{position:relative;z-index:1030}.nav{z-index:1025}}
@media(max-width:480px){.hero,.pagehero{margin-top:-78px}.hero .container{padding-top:158px}.pagehero .container{padding-top:138px;padding-bottom:36px}.pagehero h1{font-size:clamp(34px,10vw,46px);line-height:1.05}.pagehero p{max-width:36ch}}
/* Gallery carousel with controls, progress and touch-friendly horizontal movement */
.service-gallery{--gallery-gap:18px;min-width:0}
.service-gallery-viewport{overflow:hidden;border-radius:8px;touch-action:pan-y}
.service-gallery-track{display:flex;gap:var(--gallery-gap);transition:transform .55s cubic-bezier(.22,.7,.25,1);will-change:transform}
.service-slide{position:relative;flex:0 0 calc((100% - 2 * var(--gallery-gap))/3);min-width:0;margin:0;overflow:hidden;aspect-ratio:4/3;border-radius:7px;background:#17242d}
.service-slide img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .45s;filter:saturate(.88)}
.service-slide:hover img{transform:scale(1.055);filter:saturate(1.08)}
.service-slide figcaption{position:absolute;inset:auto 0 0;padding:42px 16px 16px;color:#fff;font-size:14px;font-weight:650;line-height:1.4;background:linear-gradient(transparent,rgba(9,18,24,.88))}
.service-gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px}
.service-gallery-count{display:flex;align-items:center;gap:14px;min-width:0;color:var(--muted);font-size:12px;font-weight:750;letter-spacing:.1em}
.service-gallery-count>[data-gallery-current]{color:var(--ink);font-size:15px}
.service-gallery-progress{display:block;width:clamp(80px,18vw,220px);height:3px;overflow:hidden;background:#dce2e5;border-radius:99px}
.service-gallery-progress i{display:block;width:16.666%;height:100%;background:var(--accent);transition:width .35s ease}
.service-gallery-buttons{display:flex;gap:8px}
.service-gallery-buttons button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line-dark);border-radius:50%;background:transparent;color:var(--ink);font-size:20px;cursor:pointer;transition:background .2s,color .2s,transform .2s,border-color .2s}
.service-gallery-buttons button:hover{background:var(--ink);color:#fff;border-color:var(--ink);transform:translateY(-2px)}
.service-gallery-buttons button:disabled{opacity:.35;cursor:not-allowed;transform:none}
.service-gallery-section{overflow:hidden}
/* A little ambient motion across the site without overwhelming industrial photography. */
@keyframes gentleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes accentSweep{0%{background-position:0% 50%}100%{background-position:200% 50%}}
.kicker{animation:fadeUp .65s both}
.service-gallery,.project-photo-grid,.home-field-grid,.service-detail,.feature-list .feature{animation:fadeUp .7s both}
.service-gallery-buttons button:focus-visible{outline-offset:4px}
@media(max-width:900px){.service-slide{flex-basis:calc((100% - var(--gallery-gap))/2)}}
@media(max-width:560px){.service-gallery{--gallery-gap:12px}.service-slide{flex-basis:86%;aspect-ratio:4/3}.service-gallery-controls{margin-top:14px}.service-gallery-buttons button{width:40px;height:40px}.service-gallery-count{gap:9px}}
@media(prefers-reduced-motion:reduce){.service-gallery-track,.service-slide img,.service-gallery-progress i,.service-gallery-buttons button{transition:none!important}.kicker,.service-gallery,.project-photo-grid,.home-field-grid,.service-detail,.feature-list .feature{animation:none!important}}


/* Final mobile mega-menu: compact, text-first, scrollable and contained. */
@media (max-width: 1180px) {
  .nav { position: relative; z-index: 1200; }
  .nav .inner { position: relative; }
  .navlinks { z-index: 1201; width: 100%; max-width: 100vw; max-height: calc(100dvh - 76px); overflow-x: hidden; overflow-y: auto; }
  .nav-dropdown { display: block; width: 100%; min-width: 0; }
  .nav-dropdown.open { padding-bottom: 8px; }
  .mega-menu { position: static !important; inset: auto !important; display: none; width: 100% !important; max-width: 100% !important; max-height: none; overflow: visible; margin: 6px 0 10px !important; padding: 12px !important; transform: none !important; border-radius: 8px; box-shadow: none; background: #f3f5f6; }
  .nav-dropdown.open > .mega-menu { display: block !important; }
  .mega-menu::before, .mega-feature { display: none !important; }
  .mega-head { display: block; padding-bottom: 10px; }
  .mega-head h3 { font-size: 18px; }
  .mega-head p { margin-top: 6px; font-size: 12px; }
  .mega-grid { display: grid; grid-template-columns: minmax(0,1fr) !important; gap: 0; padding: 6px 0; }
  .mega-list { min-width: 0; }
  .mega-list > a { display: block; min-width: 0; padding: 11px 8px; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; color: #17242d; border-bottom: 1px solid #d9dfe2; }
  .mega-list > a span { font-size: 12px; line-height: 1.4; }
  .mega-bottom { display: block; padding-top: 12px; }
  .mega-bottom p { margin-bottom: 10px; }
  .mega-bottom .btn { display: inline-flex; max-width: 100%; }
}
@media (max-width: 560px) {
  .navlinks { left: 0; right: 0; padding: 12px 14px 22px; }
  .mega-menu { padding: 10px !important; }
  .mega-head h3 { font-size: 17px; }
  .mega-list > a { font-size: 13px; padding: 10px 6px; }
}
/* Certificate preview modal */
.cert-trigger { display:block; width:100%; padding:0; border:0; text-align:inherit; background:transparent; color:inherit; cursor:zoom-in; border-radius:8px; }
.cert-trigger img { display:block; width:100%; height:auto; }
.cert-trigger:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.cert-modal { position:fixed; inset:0; z-index:5000; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(5,12,17,.88); backdrop-filter:blur(8px); }
.cert-modal.is-open { display:flex; }
.cert-modal-panel { position:relative; width:min(100%,1000px); max-height:90vh; display:flex; align-items:center; justify-content:center; }
.cert-modal img { display:block; max-width:100%; max-height:82vh; object-fit:contain; background:#fff; border-radius:6px; box-shadow:0 25px 70px rgba(0,0,0,.35); }
.cert-modal-close,.cert-modal-prev,.cert-modal-next { position:absolute; display:grid; place-items:center; width:44px; height:44px; border:1px solid rgba(255,255,255,.45); border-radius:50%; background:rgba(16,27,35,.9); color:#fff; font-size:24px; cursor:pointer; }
.cert-modal-close { top:-18px; right:-18px; } .cert-modal-prev { left:-56px; top:50%; transform:translateY(-50%); } .cert-modal-next { right:-56px; top:50%; transform:translateY(-50%); }
.cert-modal-count { position:absolute; bottom:-30px; left:50%; transform:translateX(-50%); color:#fff; font-size:13px; white-space:nowrap; }
@media(max-width:640px){.cert-modal{padding:18px}.cert-modal-prev{left:4px}.cert-modal-next{right:4px}.cert-modal-close{top:-12px;right:-8px}.cert-modal img{max-height:76vh}}


/* Social links in the preheader and persistent WhatsApp contact */
.topbar-social{display:flex;align-items:center;justify-content:flex-end;gap:13px;min-height:100%}.topbar-social a{display:grid;place-items:center;width:24px;height:26px;color:#eaf0f3;opacity:.9;transition:opacity .2s ease,transform .2s ease}.topbar-social a:hover{opacity:1;transform:translateY(-2px)}.topbar-social svg{width:17px;height:17px;fill:currentColor}.whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:4500;display:grid;place-items:center;width:56px;height:56px;padding:0;border-radius:50%;background:#168c52;color:#fff;text-decoration:none;box-shadow:0 10px 28px rgba(0,0,0,.25);transition:transform .2s ease,box-shadow .2s ease}.whatsapp-float:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(0,0,0,.3)}.whatsapp-float svg{width:23px;height:23px;fill:currentColor;flex:0 0 auto}.whatsapp-float:focus-visible,.topbar-social a:focus-visible{outline:3px solid #f5a623;outline-offset:4px}@media(max-width:640px){.topbar-social{gap:10px}.topbar-social a{width:26px}.whatsapp-float{right:14px;bottom:78px;padding:12px;border-radius:50%;width:52px;height:52px;justify-content:center}}


/* Homepage rope-access feature slider */
.rope-feature-slider{position:relative;max-width:1100px;margin:0 auto;border:1px solid rgba(255,255,255,.1);border-radius:18px;overflow:hidden;background:#101b22;box-shadow:0 24px 60px rgba(0,0,0,.22)}
.rope-feature-viewport{position:relative;min-height:clamp(260px,52vw,560px);overflow:hidden}
.rope-feature-slide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transform:scale(1.025);transition:opacity .65s ease,transform 1.1s ease,visibility .65s;pointer-events:none}
.rope-feature-slide.is-active{opacity:1;visibility:visible;transform:scale(1);pointer-events:auto;z-index:1}
.rope-feature-slide img{display:block;width:100%;height:clamp(260px,52vw,560px);object-fit:cover}
.rope-feature-slide:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(8,17,23,.86));pointer-events:none}
.rope-feature-slide figcaption{position:absolute;z-index:2;left:clamp(18px,4vw,42px);right:20px;bottom:clamp(20px,4vw,38px);display:flex;flex-direction:column;gap:8px;color:#fff}
.rope-feature-slide figcaption span{font-size:.76rem;font-weight:800;letter-spacing:.13em;color:#f3a04a}
.rope-feature-slide figcaption strong{font-size:clamp(1.25rem,3vw,2rem);line-height:1.2}
.rope-feature-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 20px;background:#101b22}
.rope-feature-controls button{width:44px;height:44px;border:1px solid rgba(255,255,255,.24);border-radius:50%;background:transparent;color:#fff;font-size:1.25rem;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.rope-feature-controls button:hover,.rope-feature-controls button:focus-visible{background:#e9872a;border-color:#e9872a;transform:translateY(-2px);outline:none}
.rope-feature-status{display:flex;align-items:center;gap:14px;flex:1;max-width:280px;color:#fff;font-size:.8rem;font-weight:700;letter-spacing:.08em}
.rope-feature-progress{height:3px;flex:1;background:rgba(255,255,255,.2);overflow:hidden;border-radius:4px}
.rope-feature-progress span{display:block;width:33.333%;height:100%;background:#e9872a;transition:width .35s ease}
@media(max-width:600px){.rope-feature-slider{border-radius:12px}.rope-feature-viewport,.rope-feature-slide img{height:clamp(250px,72vw,390px);min-height:250px}.rope-feature-controls{padding:12px}.rope-feature-controls button{width:40px;height:40px}.rope-feature-status{max-width:190px}}
@media(prefers-reduced-motion:reduce){.rope-feature-slide,.rope-feature-controls button,.rope-feature-progress span{transition:none}}

/* The homepage rope-access carousel now occupies the left column of the feature split. */
.split .rope-feature-slider--split{width:100%;max-width:none;min-width:0;margin:0;align-self:stretch;border-radius:16px}
.split .rope-feature-slider--split .rope-feature-viewport{min-height:clamp(300px,36vw,500px);height:100%}
.split .rope-feature-slider--split .rope-feature-slide img{height:clamp(300px,36vw,500px);min-height:0;object-fit:cover}
@media(max-width:900px){.split .rope-feature-slider--split .rope-feature-viewport,.split .rope-feature-slider--split .rope-feature-slide img{height:clamp(280px,62vw,440px);min-height:280px}}
@media(max-width:600px){.split .rope-feature-slider--split .rope-feature-viewport,.split .rope-feature-slider--split .rope-feature-slide img{height:clamp(260px,78vw,380px);min-height:260px}}

/* Contact form submission feedback and invisible anti-spam honeypot */
.form-trap{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}.form-status{margin:12px 0 0;font-size:.94rem;line-height:1.5;font-weight:650}.form-status:empty{display:none}.form-status.is-success{color:#2f9e67}.form-status.is-error{color:#d85c50}.contact-form-heavy button[disabled]{opacity:.72;cursor:wait}
