:root{--brand-green:#208a50}@font-face{font-family:Russo;src:url(/assets/bc0abcc660bd8b7a.ttf) format('truetype');font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:#080b09;color:#f6f6f1;font:16px/1.6 Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible,input:focus-visible,button:focus-visible{outline:3px solid var(--brand-green);outline-offset:5px}header,footer{display:flex;align-items:center;justify-content:space-between;padding:25px 6%;border-bottom:1px solid #253127}header{position:relative;z-index:2;background:#080b09}.brand{font-family:Russo,Arial,sans-serif;font-weight:bold;font-size:26px;line-height:1}.brand span{display:block;font-size:12px;color:var(--brand-green);letter-spacing:4px;margin-top:8px}nav{display:flex;gap:32px;color:#c5cdc7}.header-call{border-bottom:1px solid var(--brand-green)}.hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;min-height:690px;padding:65px 6%;gap:4%;background:linear-gradient(120deg,transparent 58%,rgba(32,138,80,.10) 58.2%,transparent 78%),radial-gradient(ellipse at 80% 45%,rgba(32,138,80,.14),transparent 50%)}.eyebrow{font-size:11px;letter-spacing:2.5px;color:#92a896;margin:0 0 22px}.hero h1{font-family:Russo,Arial,sans-serif;font-size:clamp(46px,5.7vw,86px);line-height:1.05;margin:0 0 28px;letter-spacing:-2px}.intro{color:#bac5bc;max-width:540px;font-size:18px}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin-top:32px}.button{display:inline-block;background:var(--brand-green);color:#071105;padding:15px 25px;font-weight:bold;transition:background .2s}.button:hover{background:var(--brand-green)}.outline{background:transparent;border:1px solid #405243;color:#f6f6f1}.outline:hover{background:rgba(32,138,80,.16)}.text-link{font-size:14px;border-bottom:1px solid var(--brand-green);padding-bottom:5px}.slogan{font-family:Russo,Arial,sans-serif;color:var(--brand-green);letter-spacing:4px;margin-top:65px}.hero-art img{width:100%;display:block;box-shadow:0 30px 65px #0008}.art-caption{display:block;margin-top:17px;text-align:right;color:#7b9680;font-size:10px;letter-spacing:2px}.ticker{overflow:hidden;white-space:nowrap;font-family:Russo,Arial,sans-serif;letter-spacing:2px;font-size:22px;padding:22px 6%;border-block:1px solid #263b2b;color:#a4baa7}.ticker span{color:var(--brand-green);margin:0 26px}.section{padding:100px 6%}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:45px}.section-head>p{color:#97a69a;font-size:14px}h2{font-family:Russo,Arial,sans-serif;font-size:clamp(34px,4vw,59px);line-height:1.15;margin:0 0 25px}h2 span{color:var(--brand-green)}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.service{background:#0d140f;border:1px solid #233127}.service img{display:block;width:100%;aspect-ratio:1;object-fit:cover}.service>div{padding:20px}.service h3{font-size:16px;font-weight:400;line-height:1.4;margin:0;min-height:45px}.price{font-family:Russo,Arial,sans-serif;color:var(--brand-green);font-size:21px;margin:18px 0 0}.note{color:#859b89;font-size:13px;max-width:760px;margin-top:25px}.studio{background:#0c120e;display:grid;grid-template-columns:1fr 1.1fr;gap:7%;align-items:center;border-block:1px solid #253127}.studio>img{width:100%;aspect-ratio:1.2;object-fit:cover}.studio-line{border-top:1px solid #304133;margin:35px 0;padding-top:25px;display:flex;flex-direction:column;gap:8px}.studio-line span{letter-spacing:2px;font-size:11px;color:#9cafa0}.studio-line strong{font-family:Russo;font-size:32px;color:var(--brand-green)}.contacts{background:linear-gradient(135deg,transparent 70%,rgba(32,138,80,.10) 70.2%,transparent 89%)}.contact-bottom{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px;border-top:1px solid #304133;margin-top:65px;padding-top:40px}.contact-bottom .eyebrow{margin-bottom:10px}.contact-bottom p{margin-top:0}.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.work-grid figure{margin:0}.work-grid img{width:100%;aspect-ratio:1.3;object-fit:cover}.work-grid figcaption{padding:12px 0;color:#bbccbf}footer{border-top:1px solid #253127;gap:25px}footer p,footer>span{font-size:11px;color:#8b9e90}@media(max-width:850px){nav{gap:15px;font-size:13px}.hero{grid-template-columns:1fr 1fr;min-height:auto;padding-block:55px}.hero h1{font-size:46px}.service-grid{grid-template-columns:repeat(2,1fr)}.section{padding-block:65px}.studio{gap:30px}.contact-bottom{grid-template-columns:1fr 1fr}.section-head{display:block}}@media(max-width:560px){header{padding-block:20px}.brand{font-size:22px}nav{display:none}.header-call{font-size:13px}.hero{grid-template-columns:1fr;padding-block:45px;gap:30px}.hero h1{font-size:52px}.hero-art{max-width:420px}.slogan{margin-top:35px}.intro{font-size:16px}.service-grid{gap:12px}.service>div{padding:14px}.service h3{font-size:14px;min-height:60px}.price{font-size:18px}.studio{grid-template-columns:1fr}.contact-bottom{grid-template-columns:1fr}.actions{gap:16px}.button{padding:13px 20px}.work-grid{grid-template-columns:1fr}footer{flex-wrap:wrap}h2{font-size:36px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.button{color:#fff}.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero-art img{border:1px solid #254332}.service:hover{border-color:var(--brand-green)}nav a:hover{color:var(--brand-green)}@media(max-width:850px){.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.hero h1{font-size:48px}.ticker{font-size:17px}.service h3{overflow-wrap:anywhere}}
/* Unified KANF brand accents and borderless hero artwork. */
.brand{display:flex;align-items:center;gap:15px;flex-shrink:0}
.brand-logo{display:block;width:76px;height:76px;object-fit:contain}
.brand .brand-name{font-size:26px;color:#f6f6f1;letter-spacing:0;margin:0}
.brand .brand-name>span{color:var(--brand-green)}
.hero{grid-template-columns:1.1fr 1fr;overflow:hidden;background:radial-gradient(ellipse at 83% 50%,rgba(32,138,80,.13),transparent 55%)}
.hero-art{position:relative}
.hero-art img{border:0;box-shadow:none;mask-image:radial-gradient(ellipse at center,#000 45%,transparent 73%);-webkit-mask-image:radial-gradient(ellipse at center,#000 45%,transparent 73%);transform:scale(1.13)}
.art-caption{position:relative;margin-top:22px;color:#9fa7a2}
.button:hover{background:var(--brand-green);filter:brightness(1.12)}
.outline:hover{background:rgba(32,138,80,.16);filter:none}
.price,h2 span,.slogan,.studio-line strong,.studio-line span{color:var(--brand-green)}
.eyebrow{color:#a9b0ac}.note{color:#a9b0ac}
@media(max-width:850px){.brand-logo{width:62px;height:62px}.brand .brand-name{font-size:23px}header{gap:20px}nav{gap:18px}}
@media(max-width:560px){.brand{gap:10px}.brand-logo{width:56px;height:56px}.brand .brand-name{font-size:21px}.brand .brand-name>span{font-size:10px;letter-spacing:3px}.hero{grid-template-columns:1fr}.hero-art{max-width:420px;margin:0 auto;width:100%}.hero-art img{transform:scale(1.05)}.hero h1{letter-spacing:-1px}header{gap:12px}.header-call{white-space:nowrap}}

/* Final slogan stays readable independently from the artwork fade. */
[hidden]{display:none!important}.hero-art img{clip-path:inset(0 0 12% 0);transform:none;mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent)}
.hero-art{padding-bottom:20px}.art-slogan{position:absolute;top:88%;left:0;right:0;text-align:center;font-family:Russo,Arial,sans-serif;font-size:clamp(22px,2.8vw,40px);line-height:1.2;color:var(--brand-green);letter-spacing:1px}.art-caption{margin-top:0}.slogan{letter-spacing:1px}footer p{color:var(--brand-green);font-family:Russo;font-size:18px}
.marine-teaser{border-block:1px solid #253127;background:radial-gradient(ellipse at 85% 80%,rgba(32,138,80,.16),transparent 60%)}.marine-teaser .price{margin:0}.marine-card-link{display:inline-block;margin-top:14px}.marine-intro{min-height:620px;background:radial-gradient(ellipse at 85% 50%,rgba(32,138,80,.16),transparent 60%)}.marine-intro>.eyebrow{margin-top:50px}.marine-intro h1{font-family:Russo;font-size:clamp(52px,7vw,96px);line-height:1.05;margin:0 0 30px}.marine-intro h1 span{color:var(--brand-green)}.marine-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.marine-grid article{padding:30px;border:1px solid #253127;background:#0d140f}.marine-grid h3{font-family:Russo;font-weight:400;font-size:25px;margin:10px 0}.marine-grid p{color:#bac5bc}.marine-number{color:var(--brand-green);font-family:Russo}.marine-details,.marine-projects{background:#0c120e}.photo-pending{padding:45px;border:1px dashed #405243}.photo-pending span{font-family:Russo;font-size:24px}.photo-pending p{color:#bac5bc}.mobile-marine{display:none}
@media(max-width:1100px){nav{gap:18px;font-size:13px}.brand .brand-name{font-size:22px}}
@media(max-width:700px){.marine-grid{grid-template-columns:1fr}.marine-intro{min-height:auto}.marine-grid article{padding:24px}.photo-pending{padding:25px}}
@media(max-width:560px){.hero-art img{transform:none}.art-slogan{font-size:clamp(22px,6vw,32px)}.mobile-marine{display:block;padding:12px 6%;border-bottom:1px solid #253127;color:var(--brand-green);font-size:14px}.hero-art{padding-bottom:28px}.art-caption{font-size:9px}}
.cinema-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.cinema-grid article{padding:30px;background:#0d140f;border:1px solid #253127}.cinema-grid h3{font-family:Russo;font-weight:400}.cinema-grid p{color:#bac5bc}.cinema-teaser{border-bottom:1px solid #253127}.cinema-teaser .price{margin:0}#back-top{position:fixed;bottom:24px;right:24px;z-index:10;border:1px solid var(--brand-green);background:#080b09;color:#fff;padding:13px 18px;font:600 14px Arial;cursor:pointer;box-shadow:0 8px 25px #0008}nav{gap:18px;font-size:13px}@media(max-width:1000px){header{flex-wrap:wrap}nav{order:3;width:100%;flex-wrap:wrap}}@media(max-width:560px){.cinema-grid{grid-template-columns:1fr}.mobile-marine{display:flex;flex-wrap:wrap;gap:10px 22px}#back-top{bottom:16px;right:16px}.cinema-grid article{padding:24px}}
/* Keep the full subwoofer and soften the perimeter without a square crop. */
.hero-art img{clip-path:none;transform:none;mask-image:radial-gradient(ellipse 72% 76% at 50% 49%,#000 60%,transparent 96%);-webkit-mask-image:radial-gradient(ellipse 72% 76% at 50% 49%,#000 60%,transparent 96%)}
.art-slogan{top:88%;height:8%;display:flex;justify-content:center;align-items:center;color:#fff;background:radial-gradient(ellipse 60% 100% at center,#080b09 65%,transparent 100%);font-size:clamp(23px,2.7vw,38px);letter-spacing:1px;line-height:1;margin:0;z-index:1}
@media(max-width:560px){.art-slogan{font-size:clamp(22px,6vw,32px)}}
.marine-details .marine-grid{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:700px){.marine-details .marine-grid{grid-template-columns:1fr}}.direction-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.direction-card{display:flex;flex-direction:column;align-items:flex-start;padding:30px;border:1px solid #253127;background:#0d140f}.direction-card:hover{border-color:var(--brand-green)}.direction-number{font-size:11px;letter-spacing:2px;color:var(--brand-green)}.direction-card h3{font-family:Russo;font-size:26px;line-height:1.25;font-weight:400}.direction-card p{color:#bac5bc;flex:1}.direction-card .text-link{margin-top:16px}@media(max-width:850px){.direction-grid{grid-template-columns:1fr}.direction-card{padding:25px}}
/* First screen: fade all artwork edges; no separate white slogan. */
.hero-art{padding-bottom:0;display:flex;flex-direction:column;gap:24px;isolation:isolate}
.hero-art img{position:relative;display:block;width:100%;height:auto;clip-path:none;transform:none;border:0;box-shadow:none;mask-image:radial-gradient(ellipse at center,#000 40%,transparent 72%);-webkit-mask-image:radial-gradient(ellipse at center,#000 40%,transparent 72%)}
.art-caption{position:static;display:block;margin:0;text-align:right;line-height:1.5;color:#9fa7a2;flex-shrink:0}
@media(max-width:560px){.hero-art{padding-bottom:0;gap:20px}.hero-art img{transform:none}}

/* Russian typography and monochrome vector arrows. */
.link-arrow{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex-shrink:0;color:inherit}
.hero-phrase{white-space:nowrap}h1,h2,h3{overflow-wrap:normal;word-break:normal}
@media(max-width:560px){.hero h1{font-size:clamp(28px,8.2vw,40px);letter-spacing:-.5px}.section h2{font-size:clamp(25px,7.4vw,34px)}.marine-intro h1{font-size:clamp(32px,9vw,48px)}}

.ticker-mobile{display:none}@media(max-width:560px){.ticker{white-space:normal;padding:18px 6%;font-size:clamp(12px,3.6vw,17px);letter-spacing:1px}.ticker-desktop{display:none}.ticker-mobile{display:grid;gap:9px;text-align:center}.ticker-mobile>div{white-space:nowrap}.ticker-mobile span{margin:0 10px}.ticker-mobile>div:last-child{color:var(--brand-green)}}
/* All navigation links remain visible on phones. */
@media(max-width:560px){header>nav{display:none}.mobile-marine{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;padding:10px 6%;font-size:14px}.mobile-marine a{display:flex;align-items:center;min-height:44px;white-space:normal;line-height:1.35}.mobile-marine a[href="/kanf/domashnie-kinoteatry/"]{grid-column:1/-1}.mobile-marine a:focus-visible{outline-offset:0}}
.menu-toggle{display:none}
@media(max-width:560px){header{gap:12px;flex-wrap:wrap;padding-block:18px}.header-call{margin-left:auto}.menu-toggle{display:flex;align-items:center;justify-content:space-between;gap:9px;border:1px solid #304133;background:transparent;color:#f6f6f1;font:13px Arial,sans-serif;padding:9px 12px;min-height:44px;cursor:pointer}.mobile-marine{display:flex;flex-direction:column;padding:6px 6% 16px;gap:0;font-size:16px;color:#f6f6f1;background:#0c120e}.mobile-marine a{display:flex;justify-content:space-between;min-height:50px;border-bottom:1px solid #253127}.mobile-marine a::after{content:'→';color:var(--brand-green)}.mobile-marine a:last-child{border-bottom:0}.menu-toggle[aria-expanded="true"]{border-color:var(--brand-green);color:var(--brand-green)}}
@media(max-width:560px){header .brand-logo{width:44px;height:44px}header .brand .brand-name{font-size:18px}header .brand .brand-name>span{font-size:9px}.menu-toggle{padding-inline:9px}.header-call{font-size:12px}}
/* Compact, always-visible mobile navigation buttons. */
@media(max-width:560px){header{flex-wrap:nowrap;padding-block:18px}.header-call{font-size:13px}.brand-logo{width:56px;height:56px}header .brand .brand-name{font-size:21px}header .brand .brand-name>span{font-size:10px}.mobile-marine{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;padding:14px 6%;background:#080b09}.mobile-marine a{display:inline-flex;justify-content:center;align-items:center;min-height:36px;padding:8px 11px;border:1px solid #304b3a;color:#d5e0d8;font-size:12px;line-height:1.25;white-space:nowrap}.mobile-marine a:last-child{border:1px solid #304b3a}.mobile-marine a::after{content:none}.mobile-marine a:hover,.mobile-marine a:focus-visible{border-color:var(--brand-green);background:#102119;color:#fff}.mobile-marine a[href="/kanf/domashnie-kinoteatry/"]{grid-column:auto}}
/* Symmetric mobile buttons: three directions, two studio links. */
@media(max-width:560px){.mobile-marine{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.mobile-marine a{grid-column:span 2;min-width:0;padding:9px 4px;font-size:11px;min-height:36px}.mobile-marine a[href="/kanf/domashnie-kinoteatry/"]{grid-column:span 2}.mobile-marine a[href="/kanf/studio/"],.mobile-marine a[href="/kanf/kontakty/"]{grid-column:span 3}}

nav a[aria-current="page"]{color:#fff;border-color:var(--brand-green)}.inner-page h1{font-family:Russo,Arial,sans-serif;font-size:clamp(32px,5vw,64px);line-height:1.12;margin:0 0 28px;overflow-wrap:normal}.inner-page h1 span{color:var(--brand-green)}@media(max-width:560px){.inner-page h1{font-size:clamp(27px,7.5vw,36px)}}

.legal-note{margin:0;padding:18px 6% 25px;color:#92a896;font:12px/1.6 Arial,sans-serif;max-width:1400px}

/* Preserve the complete studio photograph at every screen size. */
.studio>img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}

/* Space the return link away from the section label. */
.inner-page .page-back{display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;line-height:1.5;padding-bottom:8px;margin:0 0 28px}.inner-page .page-back+.eyebrow{margin-top:0}

/* Keep logo and both navigation layouts visible without covering content. */
.site-header{position:sticky;top:0;z-index:100;background:#080b09;box-shadow:0 8px 24px #0003}
html{scroll-padding-top:calc(var(--site-header-height,200px) + 20px)}
@media(max-width:560px){.site-header header{padding-block:12px}.site-header .mobile-marine{padding-block:10px}}

/* Subtle interaction for direction and service cards. */
.direction-card,.service,.cinema-grid article,.marine-grid article{transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;transform-origin:center}
@media(hover:hover) and (pointer:fine){
.direction-card:hover,.service:hover,.cinema-grid article:hover,.marine-grid article:hover{transform:translateY(-6px) scale(1.015);border-color:var(--brand-green);box-shadow:0 16px 36px #0005,0 0 20px #208a5020}
.direction-card .link-arrow{transition:transform .28s ease}
.direction-card:hover .link-arrow{transform:translate(3px,-3px)}
}
.direction-card:focus-visible{transform:translateY(-4px);border-color:var(--brand-green)}
@media(hover:none){.direction-card:active{transform:scale(.985);background:#102119}}
@media(prefers-reduced-motion:reduce){.direction-card,.service,.cinema-grid article,.marine-grid article,.direction-card .link-arrow{transition:none!important;transform:none!important}}

/* Progressive scroll reveals: content stays visible if JavaScript is unavailable. */
.reveal-ready{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s ease}
.reveal-ready.is-visible{opacity:1;transform:translateY(0)}
/* Native page transitions preserve normal links, history and scrolling. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:page-out .16s ease both}
::view-transition-new(root){animation:page-in .24s ease both}
@keyframes page-out{to{opacity:0}}
@keyframes page-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.reveal-ready{opacity:1;transform:none;transition:none}::view-transition-old(root),::view-transition-new(root){animation:none}}

.amplifier-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:48px;align-items:start;margin-top:40px}.amplifier-layout>img{display:block;width:100%;height:auto;border:1px solid #304133}.amplifier-copy h2{font-size:clamp(23px,2.3vw,32px);line-height:1.25;margin:0 0 22px}.amplifier-copy h2:not(:first-child){margin-top:36px}.amplifier-copy>p:not(.price){color:#bac5bc}.service-more{display:inline-block;margin-top:8px;color:var(--brand-green);font-size:14px}a.service{display:block}@media(max-width:850px){.amplifier-layout{grid-template-columns:1fr;gap:28px}.amplifier-layout>img{max-width:500px}}

.cinema-lighting{border-block:1px solid #253127;background:radial-gradient(ellipse at 90% 40%,rgba(32,138,80,.13),transparent 65%)}.lighting-copy{max-width:850px;color:#bac5bc;font-size:18px;line-height:1.75}.lighting-copy p+p{margin-top:24px}.cinema-lighting .price{margin:0}@media(max-width:560px){.lighting-copy{font-size:16px}}

.cinema-lighting-visual{margin:32px 0 40px}.cinema-lighting-visual img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border:1px solid #314337}.cinema-lighting-visual figcaption{margin-top:12px;color:#9ba89f;font-size:13px;line-height:1.6}@media(max-width:560px){.cinema-lighting-visual{margin:24px 0 28px}}

.subwoofer-toc{display:flex;flex-wrap:wrap;gap:12px;margin:40px 0;padding:24px 0;border-block:1px solid #304133}.subwoofer-toc a{padding:10px 16px;border:1px solid #304133;line-height:1.5;color:#bac5bc}.subwoofer-toc a:hover,.subwoofer-toc a:focus-visible{border-color:var(--brand-green);color:#fff}.subwoofer-content{max-width:920px}.subwoofer-content section{padding:32px 0;border-bottom:1px solid #253127;scroll-margin-top:calc(var(--site-header-height,200px) + 24px)}.subwoofer-content h2{font-size:clamp(24px,3vw,36px);line-height:1.3;margin:0 0 24px}.subwoofer-content p{font-size:18px;line-height:1.8;color:#bac5bc}.subwoofer-content p+p{margin-top:20px}@media(max-width:560px){.subwoofer-content p{font-size:16px}.subwoofer-toc{gap:8px}.subwoofer-toc a{padding:10px 12px;font-size:14px}}

.camera-options{padding-left:22px;margin:24px 0;color:#bac5bc;line-height:1.8}.camera-options li{padding-left:6px;margin:12px 0}.camera-options li::marker{color:var(--brand-green)}

/* Green glass controls: solid fallback, translucent depth and a light rim. */
.button,#back-top,.subwoofer-toc a{
  position:relative;isolation:isolate;overflow:hidden;
  border:1px solid rgba(155,235,185,.48);border-radius:18px;
  background-color:#17673e;
  background-image:linear-gradient(155deg,rgba(203,255,222,.20),rgba(32,138,80,.22) 44%,rgba(5,45,26,.32));
  color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(6,37,22,.55),0 8px 24px rgba(0,0,0,.26);
  text-shadow:0 1px 2px rgba(0,0,0,.30);
  transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease,transform .22s ease;
  -webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%);
}
.button::before,#back-top::before,.subwoofer-toc a::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;
  background:radial-gradient(ellipse at 12% 0%,rgba(234,255,242,.25),transparent 58%),linear-gradient(180deg,rgba(255,255,255,.06),transparent 55%);
}
.button.outline,.subwoofer-toc a,#back-top{background-color:#102b1e;border-color:rgba(120,193,147,.38)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .button{background-color:rgba(27,112,66,.76)}
  .button.outline,.subwoofer-toc a,#back-top{background-color:rgba(15,39,26,.78)}
}
@media(hover:hover) and (pointer:fine){
  .button:hover,#back-top:hover,.subwoofer-toc a:hover{filter:none;background-color:rgba(34,132,79,.90);border-color:rgba(186,255,209,.75);box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 10px 30px rgba(0,0,0,.32),0 0 24px rgba(32,138,80,.16);transform:translateY(-2px)}
}
.button:active,#back-top:active,.subwoofer-toc a:active{transform:scale(.98)}
@media(max-width:560px){
  .site-header .mobile-marine a,.site-header .mobile-marine a:last-child{
    border:1px solid rgba(112,185,138,.38);border-radius:12px;
    background:linear-gradient(155deg,rgba(177,244,199,.13),rgba(32,138,80,.10) 48%,rgba(7,29,17,.22)),#102319;
    color:#eef7f0;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 4px 12px #0002;
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  }
  .site-header .mobile-marine a[aria-current="page"]{background:linear-gradient(145deg,#2a7950,#175335);border-color:rgba(160,234,184,.65)}
  .button{border-radius:15px}
}
@media(prefers-reduced-motion:reduce){.button,#back-top,.subwoofer-toc a{transition:none;transform:none!important}}
@media(prefers-reduced-transparency:reduce){.button{background-color:#17673e}.button.outline,.subwoofer-toc a,#back-top{background-color:#102b1e}.button,#back-top,.subwoofer-toc a{-webkit-backdrop-filter:none;backdrop-filter:none}}

/* The floating control must stay fixed despite shared glass button styles. */
#back-top{
  position:fixed;top:auto;left:auto;
  right:calc(24px + env(safe-area-inset-right,0px));
  bottom:calc(24px + env(safe-area-inset-bottom,0px));
  z-index:110;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:46px;border-radius:16px;
}
@media(max-width:560px){#back-top{right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));padding:12px 16px}}

/* Consistent glass treatment for secondary actions and navigation. */
.glass-control{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:10px 16px;border:1px solid rgba(132,212,160,.42);border-radius:14px;background:radial-gradient(ellipse at 10% 0%,rgba(231,255,238,.16),transparent 65%),linear-gradient(145deg,rgba(60,144,90,.28),rgba(13,48,29,.74));color:#f4faf5;box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 5px 18px #0003;-webkit-backdrop-filter:blur(16px) saturate(135%);backdrop-filter:blur(16px) saturate(135%);line-height:1.5;text-shadow:0 1px 2px #0005;transition:background-color .2s,border-color .2s}
.glass-control:hover{color:#fff;border-color:rgba(187,247,205,.7);background-color:#1a5031}
.inner-page .page-back.glass-control{display:inline-flex;padding:10px 16px;margin-bottom:28px;width:max-content}
header>nav{gap:10px}header>nav .glass-control{font-size:12px;padding:8px 12px}
.header-call.glass-control{white-space:nowrap}
@media(max-width:560px){.glass-control{padding:10px 14px}.header-call.glass-control{font-size:12px;padding:9px 11px}.site-header .mobile-marine a.glass-control{padding:9px 4px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.glass-control{transition:none}}
@media(prefers-reduced-transparency:reduce){.glass-control{background-color:#163b27;-webkit-backdrop-filter:none;backdrop-filter:none}}

/* Airy green glass on every page. Content and image proportions stay intact. */
:root{
  --glass-surface:rgba(32,138,80,.065);
  --glass-rim:rgba(174,231,194,.22);
  --glass-shine:linear-gradient(150deg,rgba(219,255,231,.075),rgba(32,138,80,.025) 48%,rgba(8,32,19,.045));
}
.service,.direction-card,.cinema-grid article,.marine-grid article,.photo-pending,.work-grid figure{
  border:1px solid var(--glass-rim);border-radius:24px;overflow:hidden;
  background:var(--glass-shine),var(--glass-surface);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),inset 0 -1px 0 rgba(0,0,0,.12),0 8px 24px rgba(0,0,0,.10);
  -webkit-backdrop-filter:blur(16px) saturate(120%);backdrop-filter:blur(16px) saturate(120%);
}
.service img{border-radius:23px 23px 0 0}
.service>div{background:transparent}
.work-grid figcaption{padding:16px 20px}
.photo-pending{border-style:solid}
.amplifier-layout>img,.studio>img,.cinema-lighting-visual img{border-radius:24px;border-color:var(--glass-rim)}
/* Lighter controls, with one treatment for desktop and mobile navigation. */
.button,.button.outline,#back-top,.subwoofer-toc a,.glass-control,
.site-header .mobile-marine a.glass-control,.site-header .mobile-marine a.glass-control:last-child{
  background-color:rgba(32,138,80,.14);
  background-image:linear-gradient(150deg,rgba(216,255,229,.12),rgba(32,138,80,.025) 52%,rgba(8,32,19,.04));
  border-color:var(--glass-rim);color:#f4faf5;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 5px 16px rgba(0,0,0,.12);
  -webkit-backdrop-filter:blur(16px) saturate(125%);backdrop-filter:blur(16px) saturate(125%);
}
.button:not(.outline){background-color:rgba(32,138,80,.27);border-color:rgba(165,235,189,.32)}
.button::before,#back-top::before,.subwoofer-toc a::before{
  background:radial-gradient(ellipse at 12% 0%,rgba(234,255,242,.09),transparent 60%);
}
.site-header .mobile-marine a.glass-control[aria-current="page"],header>nav a.glass-control[aria-current="page"]{
  background-color:rgba(32,138,80,.25);border-color:rgba(151,230,178,.48);
}
@media(hover:hover) and (pointer:fine){
  .service:hover,.direction-card:hover,.cinema-grid article:hover,.marine-grid article:hover{
    background:var(--glass-shine),rgba(32,138,80,.10);border-color:rgba(158,226,183,.42);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 12px 28px rgba(0,0,0,.18);
  }
  .button:hover,.button.outline:hover,#back-top:hover,.subwoofer-toc a:hover,.glass-control:hover,
  .site-header .mobile-marine a.glass-control:hover{
    background-color:rgba(32,138,80,.32);border-color:rgba(178,241,201,.50);filter:none;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.21),0 7px 20px rgba(0,0,0,.16);
  }
}
@media(hover:none){.direction-card:active{background:var(--glass-shine),rgba(32,138,80,.13)}}
@media(max-width:560px){
  .service,.direction-card,.cinema-grid article,.marine-grid article,.photo-pending,.work-grid figure{border-radius:18px}
  .service img{border-radius:17px 17px 0 0}
  .amplifier-layout>img,.studio>img,.cinema-lighting-visual img{border-radius:18px}
}
/* Respect the reader's accessibility preference for opaque surfaces. */
@media(prefers-reduced-transparency:reduce){
  .service,.direction-card,.cinema-grid article,.marine-grid article,.photo-pending,.work-grid figure,
  .button,.button.outline,#back-top,.subwoofer-toc a,.glass-control,
  .site-header .mobile-marine a.glass-control,.site-header .mobile-marine a.glass-control:last-child{
    background-color:#102419;-webkit-backdrop-filter:none;backdrop-filter:none;
  }
}

/* Studio: return link above the two columns; photograph and copy aligned. */
.studio{align-items:start;column-gap:clamp(28px,5vw,72px);row-gap:32px}
.studio>.page-back,.studio>.actions{grid-column:1 / -1}
.inner-page .studio>.page-back{margin:0;justify-self:start;align-self:start}
.studio>div:not(.actions),.studio>img{min-width:0;align-self:start}
.studio>img{height:auto;aspect-ratio:auto;object-fit:contain}
@media(max-width:560px){.studio{grid-template-columns:1fr;row-gap:28px}}

/* Mobile glass: almost clear surfaces and a quiet rim, with readable text. */
@media(max-width:700px){
  :root{--glass-surface:rgba(32,138,80,.025);--glass-rim:rgba(174,231,194,.13);--glass-shine:linear-gradient(150deg,rgba(219,255,231,.028),rgba(32,138,80,.008) 48%,transparent)}
  .service,.direction-card,.cinema-grid article,.marine-grid article,.photo-pending,.work-grid figure{box-shadow:inset 0 1px 0 rgba(255,255,255,.045);-webkit-backdrop-filter:blur(10px) saturate(110%);backdrop-filter:blur(10px) saturate(110%)}
  .button,.button.outline,#back-top,.subwoofer-toc a,.glass-control,
  .site-header .mobile-marine a.glass-control,.site-header .mobile-marine a.glass-control:last-child{
    background-color:rgba(32,138,80,.04);
    background-image:linear-gradient(150deg,rgba(216,255,229,.035),rgba(32,138,80,.008) 52%,transparent);
    border-color:rgba(174,231,194,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.065);
    -webkit-backdrop-filter:blur(10px) saturate(110%);backdrop-filter:blur(10px) saturate(110%);
    text-shadow:none;
  }
  .button:not(.outline){background-color:rgba(32,138,80,.13);border-color:rgba(165,235,189,.24)}
  .button::before,#back-top::before,.subwoofer-toc a::before{background:radial-gradient(ellipse at 12% 0%,rgba(234,255,242,.025),transparent 60%)}
  .site-header .mobile-marine a.glass-control[aria-current="page"],header>nav a.glass-control[aria-current="page"]{background-color:rgba(32,138,80,.085);border-color:rgba(151,230,178,.30)}
}
@media(max-width:700px) and (prefers-reduced-transparency:reduce){
  .service,.direction-card,.cinema-grid article,.marine-grid article,.photo-pending,.work-grid figure,
  .button,.button.outline,#back-top,.subwoofer-toc a,.glass-control,
  .site-header .mobile-marine a.glass-control,.site-header .mobile-marine a.glass-control:last-child{background-color:#102419;-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* Shared studio label sits above both columns, not above the heading alone. */
.studio{row-gap:24px}
.studio>.eyebrow{grid-column:1 / -1;margin:0}
.studio>div:not(.actions)>h1,.studio>div:not(.actions)>h2{margin-top:0}

/* A clearly visible, staggered entrance on desktop and touch screens. */
.reveal-ready{opacity:0;transform:translateY(46px);transition:opacity .8s cubic-bezier(.2,.75,.25,1),transform .8s cubic-bezier(.2,.75,.25,1);transition-delay:var(--reveal-delay,0ms)}
.reveal-ready.is-visible{opacity:1;transform:translateY(0)}
@media(max-width:700px){.reveal-ready{transform:translateY(34px);transition-duration:.75s}.reveal-ready.is-visible{transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){.reveal-ready.is-visible.service:hover,.reveal-ready.is-visible.direction-card:hover{transform:translateY(-6px) scale(1.015)}}
@media(prefers-reduced-motion:reduce){.reveal-ready,.reveal-ready.is-visible{opacity:1;transform:none!important;transition:none!important;transition-delay:0ms}}

.trust-section .intro{max-width:720px}.trust-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:36px}.trust-grid article{padding:30px;border-radius:24px;border:1px solid var(--glass-rim);background:var(--glass-shine),var(--glass-surface);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.trust-grid h3{font-family:Russo,Arial,sans-serif;font-size:clamp(20px,2vw,26px);line-height:1.3;margin:0 0 16px}.trust-grid article p{color:#bac5bc;margin:0;line-height:1.75}
@media(max-width:700px){.trust-grid{grid-template-columns:1fr;gap:16px}.trust-grid article{padding:24px;border-radius:18px}}
@media(prefers-reduced-transparency:reduce){.trust-grid article{background:#102419;-webkit-backdrop-filter:none;backdrop-filter:none}}

@media(min-width:1000px){.trust-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:701px) and (max-width:999px){.trust-grid article:last-child{grid-column:1/-1}}

/* Start the home copy beside the artwork without vertical centering space. */
.hero{align-items:start;min-height:0;padding-top:40px;padding-bottom:48px}
.hero>.hero-copy,.hero>.hero-art{align-self:start}
@media(max-width:850px){.hero{padding-top:32px;padding-bottom:40px}}
@media(max-width:560px){.hero{padding-top:28px;padding-bottom:36px}}