/* SR GLOBAL / CINEMATIC MOTION 2026
   Original brand colours, content, logos and water opening remain authoritative.
   All effects are self-contained; offline-capable and motion-sensitive. */
:root {
  --cinema-ink: #17191b;
  --cinema-red: #e60012;
  --cinema-red-deep: #98000e;
  --cinema-silver: #e9eaec;
  --cinema-paper: #f7f7f4;
  --cinema-ease: cubic-bezier(.16, 1, .3, 1);
  --cinema-speed: 900ms;
}
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { overflow-x: clip; }
.cinema-scroll-progress { position: fixed; left: 0; top: 0; height: 3px; width: 100%; background: var(--cinema-red); z-index: 490; transform: scaleX(0); transform-origin: left center; pointer-events: none; }
.cinema-route-wipe { position: fixed; inset: 0; background: var(--cinema-ink); z-index: 900; transform: translateY(105%); pointer-events: none; visibility: hidden; }
.cinema-route-wipe::after { content: ""; position: absolute; inset: auto 0 0; height: 5px; background: var(--cinema-red); }
body.cinema-leaving .cinema-route-wipe { visibility: visible; transform: translateY(0); transition: transform 550ms var(--cinema-ease); }
body.cinema-leaving { pointer-events: none; }
.site-header { border-bottom: 1px solid rgba(23,25,27,.1); backdrop-filter: blur(20px) saturate(145%); -webkit-backdrop-filter: blur(20px) saturate(145%); }
.desktop-nav a, body[data-page="official"] .desktop-nav>a, body[data-page="official"] .nav-dropdown-toggle { font-size: clamp(14px, 1.05vw, 18px); font-weight: 500; letter-spacing: -.02em; }
.desktop-nav a::after, .header-cta::after { background: var(--cinema-red); }
.menu-toggle span { height: 2px; transform-origin: center; transition: transform 350ms var(--cinema-ease); }
.menu-toggle:hover span:first-child { transform: translateY(-3px); }
.menu-toggle:hover span:last-child { transform: translateY(3px); }
.site-menu nav a { font-size: clamp(27px, 4.3vw, 52px); transition: color 220ms, padding-left 380ms var(--cinema-ease); }
.site-menu nav a:hover { padding-left: 14px; color: var(--cinema-red); }
h1, h2, h3 { text-wrap: balance; letter-spacing: -.045em; }
body[data-page="home"] .eh-hero .water-copy h1 { font-size: clamp(38px, 5vw, 73px); line-height: 1.08; letter-spacing: -.055em; font-weight: 550; max-width: 14ch; }
.eh-hero .eh-intro { font-size: clamp(16px, 1.35vw, 21px); }
.br-section h2, .br-band h2, .section h2, .section-heading h2 { font-size: clamp(30px, 3.6vw, 56px); line-height: 1.11; }
.br-section h3, .br-feature-copy h3 { font-size: clamp(24px, 2.65vw, 40px); line-height: 1.17; }
.intro h1, .intro.with-image h1, .detail-title>h1, .br-partners-hero h1 { font-size: clamp(34px, 4.65vw, 66px); line-height: 1.08; max-width: 22ch; letter-spacing: -.053em; }
.cta-heading { font-size: clamp(42px, 6vw, 86px); line-height: 1.02; letter-spacing: -.06em; padding: 35px 0 50px; }
.manifesto-heading h2, blockquote, .people-copy>h2 { font-size: clamp(33px, 4vw, 62px); }
.br-band { padding-block: clamp(40px, 6vw, 84px); }
.br-section { padding-block: clamp(72px, 8vw, 128px); }
.eh-layout { grid-template-columns: .9fr 1.2fr; gap: clamp(32px, 5vw, 95px); }
.eh-visual { height: clamp(440px, 39vw, 710px); gap: 11px; }
.eh-photo { overflow: hidden; isolation: isolate; }
.eh-photo::before { content: ""; position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.08); z-index: 2; pointer-events: none; }
.eh-photo figcaption { backdrop-filter: blur(14px); background: rgba(23,25,27,.78); z-index: 5; }
.eh-red-panel { transition: transform 450ms var(--cinema-ease), filter 450ms; }
.eh-red-panel:hover { transform: translateY(-5px); filter: brightness(1.1); }
.eh-service { position: relative; overflow: hidden; transition: background 350ms, padding 350ms var(--cinema-ease); }
.eh-service::before { content: ""; display: block; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--cinema-red); transform: scaleY(0); transform-origin: bottom; transition: transform 420ms var(--cinema-ease); }
.eh-service:hover::before, .eh-service:focus-visible::before { transform: scaleY(1); }
.br-heading { margin-bottom: clamp(40px, 6vw, 96px); gap: 8vw; align-items: end; }
.br-heading p { max-width: 42ch; }
.br-service-nav { margin-bottom: 48px; }
.br-service-nav a { position: relative; transition: color .3s, background .3s; }
.br-service-nav a::after { content: ""; height: 2px; width: 0; background: var(--cinema-red); position: absolute; bottom: -1px; left: 0; transition: width 500ms var(--cinema-ease); }
.br-service-nav a:hover::after, .br-service-nav a:focus-visible::after { width: 100%; }
.br-section--dark { background: var(--cinema-ink); }
.br-engineering-feature { display: grid; grid-template-columns: minmax(0, 1.38fr) minmax(310px, .83fr); align-items: stretch; gap: 0; min-height: min(780px, 89vh); margin: 0 0 clamp(28px, 4.5vw, 76px); padding: 0; border: 1px solid rgba(255,255,255,.16); border-radius: 9px; overflow: clip; background: #1f2225; isolation: isolate; }
.br-engineering-feature:nth-of-type(even) .br-feature-image { order: 2; }
.br-feature-image { position: relative; width: 100%; min-height: 560px; max-height: none; height: 100%; overflow: hidden; background: #262a2d; }
.br-feature-image img { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; max-height: none; display: block; object-fit: cover; filter: saturate(.85); }
.br-feature-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 65%, rgba(0,0,0,.32)); pointer-events: none; z-index: 2; }
.br-feature-image figcaption { z-index: 5; background: rgba(152,0,14,.92); border-radius: 0 5px 0 0; backdrop-filter: blur(10px); }
.br-feature-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 4vw, 66px); }
.br-feature-copy h3 { font-size: clamp(28px, 3vw, 46px); margin-bottom: 22px; }
.br-feature-copy>p:not(.br-kicker) { color: #c7cbce; font-size: 16px; }
.br-scope { grid-template-columns: 1fr 1fr; gap: 0 18px; }
.br-scope li { font-size: 13px; }
.br-feature-copy .br-link { margin-top: 12px; align-self: flex-start; }
.br-engineering-feature .cinema-index { position: absolute; z-index: 4; left: 25px; top: 25px; font: 12px/1.2 "Courier New",monospace; color: #fff; border: 1px solid rgba(255,255,255,.65); border-radius: 100px; padding: 10px 15px; letter-spacing: .08em; background: rgba(23,25,27,.26); backdrop-filter: blur(12px); }
.br-engineering-feature .cinema-playline { position: absolute; height: 3px; width: 100%; left: 0; bottom: 0; z-index: 5; background: var(--cinema-red); transform: scaleX(0); transform-origin: left; transition: transform 600ms var(--cinema-ease); }
.br-engineering-feature:hover .cinema-playline { transform: scaleX(1); }
.cinema-media { position: relative; isolation: isolate; overflow: hidden; }
.cinema-media img { display: block; }
.cinema-media .cinema-loop { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; z-index: 1; pointer-events: none; transform: scale(1.035); transition: opacity 1s ease, transform 1.4s var(--cinema-ease); filter: saturate(.95) contrast(1.04); }
.cinema-media.cinema-ready .cinema-loop { opacity: 1; }
.cinema-media.cinema-ready:hover .cinema-loop { transform: scale(1.09); }
.cinema-media figcaption { position: absolute; z-index: 3; }
.cinema-media.cinema-single { display: block; min-height: 360px; height: clamp(320px, 35vw, 520px); }
.cinema-media.cinema-single img { width: 100%; height: 100%; object-fit: cover; }
.cinema-media .cinema-fallback { z-index: 0; }
.cinema-media.cinema-in-view .cinema-loop { will-change: transform, opacity; }
.br-about-image { min-height: 500px; overflow: hidden; }
.br-about-image img { position: absolute; inset: 0; height: 100%; }
.br-about-image::after { z-index: 4; }
.br-client, .br-supplier, .editorial-grid article { transition: transform 600ms var(--cinema-ease), background 400ms; }
.br-client:hover, .br-supplier:hover, .editorial-grid article:hover { transform: translateY(-6px); background: rgba(255,255,255,.08); }
.br-supplier:hover { background: #fff; }
.br-cert, .br-cert-grid, .site-footer img, .water-intro-overlay img { transform: none; }
.br-section-bottom .br-link { transition: color 300ms; }
.br-link { position: relative; transition: color 250ms; }
.br-link:hover { color: var(--cinema-red); }
.br-section--dark .br-link:hover, .br-section--red .br-link:hover { color: #fff; }
.button, .br-button, .water-quote, .header-cta, .round-cta { transition: transform 400ms var(--cinema-ease), box-shadow 400ms var(--cinema-ease), background 300ms; }
.button:hover, .br-button:hover, .water-quote:hover { transform: translateY(-3px); box-shadow: 0 14px 35px rgba(23,25,27,.16); }
.round-cta:hover { transform: rotate(-45deg) scale(1.04); }
.cinema-marquee { margin: 0 calc(-1 * var(--br-gutter)) clamp(50px, 6vw, 90px); padding: 20px 0; overflow: hidden; border-top: 1px solid currentColor; border-bottom: 1px solid currentColor; border-color: rgba(130,136,137,.32); max-width: none; }
.cinema-marquee-track { display: flex; align-items: center; gap: clamp(30px, 6vw, 95px); width: max-content; animation: cinema-marquee 34s linear infinite; }
.cinema-marquee-token { font: 600 clamp(15px, 2vw, 26px)/1.2 Arial,sans-serif; letter-spacing: -.025em; white-space: nowrap; opacity: .54; }
.cinema-marquee-token::before { content: "✳"; color: var(--cinema-red); margin-right: clamp(30px, 6vw, 95px); font-size: 15px; vertical-align: 12%; }
@keyframes cinema-marquee { to { transform: translateX(-50%); } }
.cinema-reveal { transform: none; opacity: 1; }
html.cinema-has-js .cinema-reveal.is-entering { opacity: 0; transform: translate3d(0,36px,0); filter: blur(6px); }
html.cinema-has-js .cinema-reveal.is-visible { opacity: 1; transform: translate3d(0,0,0); filter: blur(0); transition: opacity 950ms var(--cinema-ease), transform 950ms var(--cinema-ease), filter 950ms var(--cinema-ease); transition-delay: var(--reveal-delay,0ms); }
.cinema-heading { transform-origin: bottom left; }
html.cinema-has-js .cinema-heading.is-entering { transform: translate3d(0,25px,0) scale(.985); opacity: 0; clip-path: inset(10% 0 65% 0); }
html.cinema-has-js .cinema-heading.is-visible { transform: none; opacity: 1; clip-path: inset(0 0 0 0); transition: clip-path 1100ms var(--cinema-ease), transform 1100ms var(--cinema-ease), opacity 1100ms; }
.cinema-parallax { transform: translate3d(0,var(--cinema-parallax,0px),0); }
.cinema-pointer { position: fixed; left: 0; top: 0; width: 25px; height: 25px; border: 1px solid rgba(230,0,18,.9); border-radius: 50%; z-index: 800; pointer-events: none; opacity: 0; transform: translate3d(-40px,-40px,0); transition: opacity 300ms, width 300ms var(--cinema-ease), height 300ms var(--cinema-ease); mix-blend-mode: difference; }
body.cinema-pointer-active .cinema-pointer { opacity: .85; }
body.cinema-pointer-hover .cinema-pointer { width: 54px; height: 54px; }
.cinema-motion-note { display: none; }
@media (min-width:1100px) {
  .br-feature-copy { position: sticky; top: 105px; align-self: start; min-height: min(780px, 89vh); }
  .br-feature-image { min-height: min(780px, 89vh); }
}
@media (max-width:1100px) {
  .eh-layout { grid-template-columns: 1fr 1fr; }
  .eh-visual { height: 490px; }
  .br-engineering-feature { grid-template-columns: minmax(0,1.05fr) minmax(300px, .95fr); min-height: 620px; }
  .br-feature-image { min-height: 620px; }
  .br-feature-copy { padding: 32px; }
  .br-scope { grid-template-columns: 1fr; }
}
@media (max-width:850px) {
  .site-header { backdrop-filter: blur(12px); }
  .eh-layout { grid-template-columns: 1fr; gap: 36px; }
  .eh-visual { height: min(72vw,600px); min-height: 370px; }
  .br-engineering-feature, .br-engineering-feature:nth-of-type(even) { grid-template-columns: 1fr; min-height: 0; }
  .br-engineering-feature .br-feature-image, .br-engineering-feature:nth-of-type(even) .br-feature-image { order: 0; min-height: min(72vh,650px); height: min(72vh,650px); }
  .br-feature-copy { position: static; order: 1; padding: clamp(25px,5vw,50px); }
  .br-scope { grid-template-columns: 1fr 1fr; }
  .br-heading { grid-template-columns: 1fr; gap: 23px; }
  .br-about-image { min-height: 410px; }
}
@media (max-width:580px) {
  .site-header { height: 76px; min-height: 76px; padding-inline: 16px; gap: 8px; }
  .site-header .brand { width: 149px; flex-shrink: 1; min-width: 120px; }
  .header-actions { gap: 10px; }
  .header-cta { font-size: 12px; white-space: nowrap; gap: 8px; }
  .header-cta svg { width: 15px; height: 15px; }
  body[data-page="home"] .eh-hero .water-copy h1 { font-size: clamp(38px,9vw,51px); }
  .eh-intro { font-size: 16px; }
  .eh-visual { min-height: 350px; height: 380px; }
  .br-section, .section { padding-left: 20px; padding-right: 20px; }
  .br-section { padding-top: 65px; padding-bottom: 70px; }
  .br-section h2, .br-band h2, .section h2 { font-size: clamp(29px, 8vw, 42px); }
  .br-feature-copy h3 { font-size: 32px; }
  .br-engineering-feature { border-radius: 8px; }
  .br-engineering-feature .br-feature-image { min-height: 61vh; height: 61vh; }
  .br-feature-copy { padding: 25px 22px 30px; }
  .br-scope { grid-template-columns: 1fr; }
  .br-scope li { padding: 8px 0 8px 15px; }
  .br-service-nav { gap: 0; }
  .br-service-nav a { padding: 13px 7px; font-size: 12px; }
  .br-section-bottom { flex-direction: column; align-items: flex-start; }
  .cinema-marquee { margin-inline: -20px; margin-bottom: 42px; }
  .cinema-marquee-track { gap: 28px; }
  .cinema-marquee-token { font-size: 15px; }
  .cinema-marquee-token::before { margin-right: 28px; }
  .cinema-media.cinema-single { min-height: 290px; height: 320px; }
  .intro h1, .intro.with-image h1, .detail-title>h1, .br-partners-hero h1 { font-size: clamp(33px, 8.5vw, 47px); }
  .cta-heading { font-size: clamp(40px,10vw,63px); }
}
@media (hover:none), (pointer:coarse) {
  .cinema-pointer { display: none; }
  .br-client:hover, .br-supplier:hover, .editorial-grid article:hover, .button:hover, .br-button:hover { transform: none; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .cinema-pointer, .cinema-route-wipe { display: none; }
  .cinema-marquee-track { animation: none; }
  html.cinema-has-js .cinema-reveal, html.cinema-has-js .cinema-heading { opacity: 1; transform: none; filter: none; clip-path: none; transition: none; }
  .cinema-media .cinema-loop { display: none; }
  .button, .br-button, .water-quote, .eh-red-panel, .br-client, .br-supplier { transition: none; }
  .br-feature-image img { transform: none; }
}
html.motion-paused .cinema-marquee-track { animation-play-state: paused; }
html.motion-paused .cinema-loop { display: none; }
html.motion-paused .cinema-reveal { opacity: 1 !important; transform: none !important; filter: none !important; }