/* ==========================================================================
   Line Rope Build — site.css
   Layout and section styles built on top of the brand token/component kit.
   Nothing here overrides brand tokens; it only arranges them into pages.
   ========================================================================== */

:root{
  --z-nav:100;
  --container-page:var(--container-xl);
  --edge:var(--gutter);
}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

img{max-width:100%;display:block}
button{font:inherit}

.wrap{max-width:var(--container-page);margin-inline:auto;padding-inline:var(--edge)}

/* ---------- Icon system: Lucide outline set, coloured via currentColor mask ---------- */
.icon{display:inline-block;flex:none;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;width:24px;height:24px}
.icon--sm{width:18px;height:18px}
.icon--lg{width:32px;height:32px}
.icon-paint-roller{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/paint-roller.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/paint-roller.svg")}
.icon-spray-can{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/spray-can.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/spray-can.svg")}
.icon-hard-hat{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/hard-hat.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/hard-hat.svg")}
.icon-brick-wall{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/brick-wall.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/brick-wall.svg")}
.icon-layers{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/layers.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/layers.svg")}
.icon-ruler{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/ruler.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/ruler.svg")}
.icon-anchor{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/anchor.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/anchor.svg")}
.icon-droplets{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/droplets.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/droplets.svg")}
.icon-app-window{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/app-window.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/app-window.svg")}
.icon-shield-check{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/shield-check.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/shield-check.svg")}
.icon-building-2{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/building-2.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/building-2.svg")}
.icon-clipboard-check{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/clipboard-check.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/clipboard-check.svg")}
.icon-phone{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/phone.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/phone.svg")}
.icon-mail{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/mail.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/mail.svg")}
.icon-arrow-right{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/arrow-right.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/arrow-right.svg")}
.icon-arrow-down{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/arrow-down.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/arrow-down.svg")}
.icon-menu{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/menu.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/menu.svg")}
.icon-x{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/x.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/x.svg")}
.icon-check-circle{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/circle-check-big.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/circle-check-big.svg")}
.icon-map-pin{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/map-pin.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/map-pin.svg")}
.icon-chevron-down{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/chevron-down.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/chevron-down.svg")}
.icon-chevron-up{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/chevron-up.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/chevron-up.svg")}
.icon-chevrons-left-right{-webkit-mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/chevrons-left-right.svg");mask-image:url("https://unpkg.com/lucide-static@0.428.0/icons/chevrons-left-right.svg")}

/* ---------- Reveal motion (rope descent / rule draw) ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity var(--duration-reveal) var(--ease-out),transform var(--duration-reveal) var(--ease-out)}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.reveal-rule{width:0;transition:width var(--duration-slow) var(--ease-mechanical)}
.reveal-rule.is-visible{width:56px}
.draw-path{stroke-dasharray:2000;stroke-dashoffset:2000;transition:stroke-dashoffset 1400ms var(--ease-out)}
.draw-path.is-visible{stroke-dashoffset:0}
[data-stagger]{transition-delay:calc(var(--i, 0) * 90ms)}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;left:0;right:0;z-index:var(--z-nav);background:var(--charcoal-900);border-bottom:1px solid rgba(255,255,255,.12)}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;height:84px;gap:var(--space-8)}
.site-header__logo{height:64px;width:auto}
.site-header__nav{display:flex;align-items:center;gap:var(--space-8)}
.site-header__links{display:flex;align-items:center;gap:var(--space-6);list-style:none;margin:0;padding:0;white-space:nowrap}
.site-header__links a{color:var(--white);text-decoration:none;font-size:var(--size-2xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-label);text-transform:uppercase}
.site-header__links a:hover{color:var(--rust-400)}
.site-header__actions{display:flex;align-items:center;gap:var(--space-6)}
.site-header__phone{display:flex;align-items:center;gap:var(--space-2);color:var(--white);font-size:var(--size-sm);font-variant-numeric:tabular-nums;white-space:nowrap}
.site-header__phone .icon{color:var(--steel-400)}
.site-header__menu-btn{display:none;color:var(--white);border-color:rgba(255,255,255,.4)}
@media (max-width:900px){
  .site-header__links{display:none}
  .site-header__phone{display:none}
  .site-header__menu-btn{display:inline-flex}
}
@media (max-width:560px){
  .site-header__logo{height:48px}
  .site-header__actions .lrb-btn{display:none}
}

/* ---------- Hero ---------- */
/* Compact banner hero: text column | divider | framed footage panel,
   proportioned so the panel matches the text block's own height rather
   than dominating the viewport. */
.hero{position:relative;display:flex;flex-direction:column;background:var(--charcoal-900);color:var(--white)}
.hero__row{display:flex;align-items:stretch;gap:var(--space-10);padding-block:var(--space-20)}
.hero__content{flex:1 1 420px;min-width:0;max-width:480px;display:flex;flex-direction:column;justify-content:center}
.hero__divider{flex:none;align-self:stretch;width:var(--line-hair);background:var(--border-inverse)}
.hero__media{flex:1 1 380px;min-width:0;position:relative;min-height:320px;max-height:460px;overflow:hidden;background:var(--charcoal-900)}
.hero__media video{width:100%;height:100%;object-fit:cover;display:block}
/* The source footage sits on true black; lighten-blend a charcoal-900 tint
   over it so its blacks match the hero's own ground instead of reading as
   a darker rectangle cut into the section. White wireframe lines are
   unaffected since lighten keeps whichever value is brighter per channel. */
.hero__media-tint{position:absolute;inset:0;background:var(--charcoal-900);mix-blend-mode:lighten;pointer-events:none}
@media (max-width:760px){
  .hero__row{flex-direction:column;align-items:stretch;padding-block:var(--space-12);gap:var(--space-8)}
  .hero__divider{display:none}
  .hero__content{max-width:none}
  .hero__media{min-height:260px;max-height:320px}
}
.hero__eyebrow{color:var(--rust-400);display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5)}
.hero__eyebrow::before{content:"";width:32px;height:2px;background:var(--rust-400)}
.hero h1{color:var(--white);font-size:clamp(26px,3.2vw,40px);max-width:18ch;margin-bottom:var(--space-5)}
.hero h1 em{font-style:normal;color:var(--rust-400)}
.hero__sub{max-width:48ch;color:var(--steel-300);font-size:var(--size-sm);line-height:var(--leading-normal);margin-bottom:var(--space-8)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-4)}
.hero__actions .lrb-btn--outline{color:var(--white);border-color:rgba(255,255,255,.5)}
.hero__actions .lrb-btn--outline:hover{background:rgba(255,255,255,.08)}
/* ---------- Section scaffolding ---------- */
.section{padding-block:var(--section-y)}
.section--subtle{background:var(--surface-subtle)}
.section--inverse{background:var(--charcoal-800);color:var(--white)}
.section--inverse h2,.section--inverse h3{color:var(--white)}
.section-head{margin-bottom:var(--space-12)}
.section-head--row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:var(--space-6)}

/* ---------- Stats / Delivered ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-8)}
.stats .lrb-stat__value{font-size:clamp(32px,4.5vw,var(--size-4xl))}
@media (max-width:640px){.stats{grid-template-columns:1fr 1fr}}
.stats-delivered{border-top:var(--line-hair) solid var(--border-hairline)}
.stats-delivered__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--space-16);align-items:end}
.stats-delivered__count{display:flex;align-items:baseline;gap:var(--space-2);margin-top:var(--space-3)}
.stats-delivered__count .lrb-stat__value{font-size:clamp(64px,10vw,148px);line-height:.9}
.stats-delivered__plus{font-family:var(--font-body);font-weight:var(--weight-black);font-size:clamp(32px,5vw,72px);line-height:1;color:var(--accent)}
.stats-delivered__rule{width:120px;height:var(--line-heavy);background:var(--accent);margin-top:var(--space-3)}
.stats-delivered__body{margin:var(--space-4) 0 0;max-width:44ch;color:var(--text-secondary);font-size:var(--size-md)}
@media (max-width:900px){.stats-delivered__grid{grid-template-columns:1fr;align-items:start;gap:var(--space-10)}}

/* ---------- Services / casework ---------- */
.cw-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border-hairline);border:var(--line-hair) solid var(--border-hairline);border-bottom:none}
.cw-row:first-child{border-top:var(--line-hair) solid var(--border-hairline)}
.cw{border-bottom:var(--line-hair) solid var(--border-hairline)}
.cw-card{appearance:none;margin:0;text-align:left;font:inherit;color:inherit;cursor:pointer;background:var(--surface-card);border:none;padding:var(--space-6);display:flex;flex-direction:column;width:100%;transition:background-color var(--duration-fast) var(--ease-standard)}
.cw-card:hover{background:var(--surface-subtle)}
.cw-card--open{background:var(--surface-subtle)}
.cw-card__no{font-family:var(--font-mono);font-size:var(--size-2xs);color:var(--text-muted);letter-spacing:var(--tracking-wide)}
.cw-card__icon{color:var(--accent);margin:var(--space-2) 0}
.cw-card__title{font-family:var(--font-body);font-weight:var(--weight-semibold);text-transform:uppercase;font-size:var(--size-lg);line-height:var(--leading-snug);margin-bottom:var(--space-2)}
.cw-card__body{font-size:var(--size-sm);color:var(--text-secondary);max-width:36ch}
.cw-card__cta{display:flex;align-items:center;gap:var(--space-2);margin-top:auto;padding-top:var(--space-4);font-size:var(--size-3xs);font-weight:var(--weight-bold);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--accent)}
.cw-card__cta .icon{color:var(--accent)}

.cw-panel{grid-column:1/-1;background:var(--charcoal-900);color:var(--white);padding:var(--space-8) var(--space-8) var(--space-10)}
.cw-panel__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:var(--space-6);border-bottom:1px solid rgba(255,255,255,.18);padding-bottom:var(--space-5);margin-bottom:var(--space-8)}
.cw-panel__title{color:var(--white);font-size:var(--size-2xl);margin-top:var(--space-2)}
.cw-panel__meta{font-size:var(--size-sm);color:var(--steel-400);text-align:right;line-height:1.5}
.cw-cases{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-10)}
.cw-cases[data-count="1"]{grid-template-columns:minmax(0,480px)}

.cw-compare{position:relative;height:260px;cursor:ew-resize;touch-action:none;user-select:none;overflow:hidden;background:var(--charcoal-700)}
.cw-compare__after,.cw-compare__before{position:absolute;inset:0;display:grid;place-items:center;padding:var(--space-6);text-align:center}
.cw-compare__after{background:var(--steel-200)}
.cw-compare__before{background:var(--charcoal-700)}
.cw-compare__text{font-size:var(--size-xs);line-height:1.55;max-width:26ch;margin-top:var(--space-2)}
.cw-compare__text--after{color:var(--charcoal-700)}
.cw-compare__text--before{color:rgba(255,255,255,.75)}
/* Photo variant: the job shot fills the frame, the caption sits bottom-left
   over a scrim so it stays readable against whatever the photo is doing. */
.cw-compare--photo{height:auto;aspect-ratio:3/2}
.cw-compare--photo .cw-compare__after,
.cw-compare--photo .cw-compare__before{background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;align-items:flex-end;padding:var(--space-5)}
/* Each caption sits on its own side of the wipe, so they never collide
   whichever way the handle is dragged. */
.cw-compare--photo .cw-compare__before{justify-content:flex-start;text-align:left}
.cw-compare--photo .cw-compare__after{justify-content:flex-end;text-align:right}
.cw-compare--photo .cw-compare__after::after,
.cw-compare--photo .cw-compare__before::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,20,20,.88) 0%,rgba(20,20,20,.55) 32%,rgba(20,20,20,0) 62%);pointer-events:none}
.cw-compare--photo .cw-compare__after>div,
.cw-compare--photo .cw-compare__before>div{position:relative;z-index:1}
.cw-compare--photo .lrb-eyebrow{color:var(--rust-400)}
.cw-compare--photo .cw-compare__text{color:#fff;max-width:22ch;text-shadow:0 1px 2px rgba(0,0,0,.6)}
/* Cap each caption block just under half the frame so Before and After can
   never run into each other on a narrow phone. The limit sits on the flex
   item, whose containing block has a definite width; on the paragraph the
   percentage would resolve against an indefinite width and be ignored. */
.cw-compare--photo .cw-compare__before>div,
.cw-compare--photo .cw-compare__after>div{max-width:47%}
.cw-compare__line{position:absolute;top:0;bottom:0;width:2px;background:var(--accent);pointer-events:none}
.cw-compare__handle{position:absolute;top:50%;width:28px;height:28px;background:var(--accent);display:grid;place-items:center;transform:translate(-50%,-50%);pointer-events:none}
.cw-compare__handle .icon{width:14px;height:14px;background-color:#fff}
.cw-compare__state{position:absolute;left:var(--space-3);top:var(--space-3);background:var(--charcoal-900);color:var(--white);padding:var(--space-1) var(--space-2);font-size:10px;font-weight:var(--weight-bold);letter-spacing:.1em;text-transform:uppercase}

.cw-case__head{display:flex;justify-content:space-between;align-items:baseline;margin-top:var(--space-4)}
.cw-case__name{color:var(--white);font-size:var(--size-md)}
.cw-case__ref{font-family:var(--font-mono);font-size:var(--size-2xs);color:var(--steel-400)}
.cw-case__rows{display:flex;flex-direction:column;margin-top:var(--space-4)}
.cw-case__row{display:grid;grid-template-columns:100px 1fr;gap:var(--space-4);padding-block:var(--space-2);border-top:1px solid rgba(255,255,255,.14)}
.cw-case__row span:first-child{font-size:10px;font-weight:var(--weight-semibold);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--steel-500)}
.cw-case__row span:last-child{font-size:var(--size-xs);color:rgba(255,255,255,.86);font-variant-numeric:tabular-nums}

@media (max-width:900px){.cw-row{grid-template-columns:repeat(2,1fr)}.cw-cases{grid-template-columns:1fr}.cw-cases[data-count="1"]{grid-template-columns:1fr}}
@media (max-width:640px){.cw-row{grid-template-columns:1fr}.cw-panel{padding:var(--space-6)}}

/* ---------- Portfolio ---------- */
.portfolio-filter{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-10)}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
.portfolio-card{border:var(--line-hair) solid var(--border-hairline);background:var(--surface-card);display:flex;flex-direction:column;transition:border-color var(--duration-fast) var(--ease-standard)}
.portfolio-card:hover{border-color:var(--border-strong)}
.portfolio-card__media{aspect-ratio:4/3;background:var(--steel-100);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.portfolio-card__media svg{width:40%;height:40%;color:var(--steel-400)}
.portfolio-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.portfolio-card__tag{position:absolute;top:var(--space-3);left:var(--space-3)}
.portfolio-card__body{padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2);flex:1}
.portfolio-card__title{font-family:var(--font-body);font-weight:var(--weight-semibold);text-transform:uppercase;font-size:var(--size-lg)}
.portfolio-card__meta{display:flex;align-items:center;gap:var(--space-2);color:var(--text-muted);font-size:var(--size-2xs);letter-spacing:var(--tracking-wide);text-transform:uppercase}
.portfolio-card__spec{margin-top:auto;padding-top:var(--space-3);border-top:var(--line-hair) solid var(--border-hairline);display:flex;justify-content:space-between;font-size:var(--size-2xs);color:var(--text-muted)}
.portfolio-card__spec strong{color:var(--text-primary);font-variant-numeric:tabular-nums;display:block;font-size:var(--size-sm)}
@media (max-width:900px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.portfolio-grid{grid-template-columns:1fr}}

/* ---------- Safety & certifications ---------- */
.safety-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-16)}
.safety-points{display:flex;flex-direction:column;gap:var(--space-6)}
.safety-point{display:flex;gap:var(--space-4)}
.safety-point .icon{color:var(--accent);flex:none}
.safety-point h4{margin-bottom:var(--space-1)}
.safety-point p{color:var(--text-secondary);font-size:var(--size-sm)}
.cert-panel{background:var(--surface-card);border:var(--line-hair) solid var(--border-hairline);padding:var(--space-8);text-align:center}
.cert-badges{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-top:var(--space-6)}
.cert-badge{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3);border:var(--line-hair) solid var(--border-hairline);font-size:var(--size-2xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase}
.cert-badge .icon{color:var(--signal-success)}
@media (max-width:900px){.safety-layout{grid-template-columns:1fr}.cert-badges{grid-template-columns:1fr}}

/* ---------- Testimonial ---------- */
.testimonial{max-width:820px;margin-inline:auto;text-align:left}
.testimonial blockquote{font-family:var(--font-body);font-weight:var(--weight-semibold);text-transform:uppercase;font-size:clamp(22px,3vw,var(--size-2xl));line-height:var(--leading-snug);letter-spacing:var(--tracking-tight);margin:0 0 var(--space-6);padding-left:var(--space-6);border-left:var(--line-heavy) solid var(--accent)}
.testimonial__attr{display:flex;align-items:center;gap:var(--space-3);padding-left:calc(var(--space-6) + var(--line-heavy))}
.testimonial__attr-name{font-weight:var(--weight-semibold)}
.testimonial__attr-role{color:var(--text-muted);font-size:var(--size-sm)}

/* ---------- Closing CTA + Footer (one continuous charcoal register) ---------- */
/* ---------- Enquiry / contact ---------- */
.enquiry{background:var(--surface-page)}
.enquiry-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--space-16);align-items:center}
.enquiry-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);margin-top:var(--space-10)}
.enquiry-form-grid>[data-full]{grid-column:1/-1}
.enquiry-submit-row{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-6);padding-top:var(--space-2)}
.enquiry-submit-row span{font-size:var(--size-xs);color:var(--text-muted);max-width:34ch}
.enquiry-aside{background:var(--surface-subtle);border:var(--line-hair) solid var(--border-hairline);padding:var(--space-8);display:flex;flex-direction:column;gap:var(--space-6)}
.enquiry-aside__list{display:flex;flex-direction:column}
.enquiry-aside__item{display:flex;flex-direction:column;gap:var(--space-1);padding-block:var(--space-4);border-bottom:var(--line-hair) solid var(--border-hairline)}
.enquiry-aside__item:last-child{border-bottom:none;padding-bottom:0}
.enquiry-aside__item:first-child{padding-top:0}
.enquiry-aside__item span:first-child{font-size:var(--size-3xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-muted)}
.enquiry-aside__item strong{font-size:var(--size-xl);font-variant-numeric:tabular-nums}
.enquiry-map{height:220px;background:var(--steel-200)}
.enquiry-map iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.15) contrast(1.05)}
@media (max-width:900px){.enquiry-grid{grid-template-columns:1fr}}
@media (max-width:560px){.enquiry-form-grid{grid-template-columns:1fr}}

/* ---------- Footer ---------- */
.footer{background:var(--charcoal-900);color:var(--white);padding-block:var(--space-16)}
.footer-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-10);padding-bottom:var(--space-10)}
.footer-brand__logo{height:132px;width:auto}
.footer-brand p{color:var(--steel-400);font-size:var(--size-sm);max-width:36ch;margin-top:var(--space-4)}
.footer-grid{display:grid;grid-template-columns:repeat(3,minmax(140px,auto));gap:var(--space-10)}
.footer h5{color:var(--white);font-size:var(--size-2xs);letter-spacing:var(--tracking-label);text-transform:uppercase;margin-bottom:var(--space-3);font-weight:var(--weight-semibold)}
.footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3)}
.footer a{color:var(--steel-400);text-decoration:none;font-size:var(--size-sm)}
.footer a:hover{color:var(--white)}
.footer-contact-item{display:flex;align-items:center;gap:var(--space-2);color:var(--steel-400);font-size:var(--size-sm)}
.footer-contact-item .icon{color:var(--rust-400)}
.footer-bottom{margin-top:var(--space-10);padding-top:var(--space-6);border-top:var(--line-hair) solid var(--border-inverse);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-4);color:var(--steel-500);font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
@media (max-width:640px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:420px){.footer-grid{grid-template-columns:1fr}}

/* ---------- Mobile nav drawer ---------- */
.mobile-nav{position:fixed;inset:0;z-index:200;background:var(--charcoal-900);color:var(--white);display:flex;flex-direction:column;padding:var(--space-6);transform:translateX(100%);transition:transform var(--duration-base) var(--ease-standard)}
.mobile-nav.is-open{transform:translateX(0)}
.mobile-nav__head{display:flex;justify-content:flex-end;margin-bottom:var(--space-10)}
.mobile-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-6)}
/* Scoped to the nav list: the panel's CTA is an <a> too, and the large
   nav-link type was overriding its button sizing and bursting the box. */
.mobile-nav ul a{color:var(--white);text-decoration:none;font-family:var(--font-body);font-weight:var(--weight-semibold);font-size:var(--size-2xl);text-transform:uppercase}

/* ---- Enquiry form: alerts and honeypot ---- */
/* display:flex would otherwise beat the UA's [hidden]{display:none}, leaving
   both result alerts on screen before the form is ever submitted. */
.lrb-alert[hidden]{display:none}
.lrb-alert{display:flex;gap:var(--space-3);padding:var(--space-4);margin-top:var(--space-5);border-left:3px solid var(--steel-400);background:var(--surface-subtle);font-size:var(--size-sm);line-height:1.55}
.lrb-alert__title{font-weight:var(--weight-bold);text-transform:uppercase;letter-spacing:var(--tracking-label);font-size:var(--size-2xs);margin-bottom:var(--space-1)}
.lrb-alert a{color:inherit;text-decoration:underline}
.lrb-alert--ok{border-left-color:var(--accent)}
.lrb-alert--ok .lrb-alert__title{color:var(--accent)}
.lrb-alert--error{border-left-color:#b3261e;background:rgba(179,38,30,.06)}
.lrb-alert--error .lrb-alert__title{color:#b3261e}
/* Honeypot: off-screen rather than display:none, which some bots skip. */
.enquiry-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}