.hero-bg{
  background:#080a0c;
}
.hero-bg:before{
  content:"";
  position:absolute;
  inset:0 0 0 40%;
  background:url("assets/radio-production-hero.jpg") center 48% / cover no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 10%,#000 42%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 10%,#000 42%);
}
.services .section-head{position:relative;isolation:isolate;overflow:hidden;min-height:300px;align-items:center}
.services .section-head>p,.services .section-head>h2{position:relative;z-index:2}
.heading-wave{position:absolute;z-index:1;left:7%;right:-8%;top:50%;height:280px;transform:translateY(-50%);opacity:.34;pointer-events:none;filter:drop-shadow(0 0 9px rgba(0,174,239,.35));overflow:hidden;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 280'%3E%3Cpath d='M0 128V152 M12 112V168 M24 126V154 M36 84V196 M48 104V176 M60 54V226 M72 92V188 M84 120V160 M96 70V210 M108 34V246 M120 98V182 M132 116V164 M144 76V204 M156 108V172 M168 124V156 M180 88V192 M192 48V232 M204 22V258 M216 66V214 M228 102V178 M240 118V162 M252 94V186 M264 58V222 M276 112V168 M288 126V154 M300 78V202 M312 42V238 M324 86V194 M336 106V174 M348 120V160 M360 68V212 M372 30V250 M384 52V228 M396 96V184 M408 114V166 M420 82V198 M432 46V234 M444 72V208 M456 122V158 M468 104V176 M480 60V220 M492 18V262 M504 88V192 M516 110V170 M528 126V154 M540 96V184 M552 50V230 M564 76V204 M576 116V164 M588 100V180 M600 64V216 M612 38V242 M624 90V190 M636 120V160' fill='none' stroke='%2300aeef' stroke-width='7' stroke-linecap='round'/%3E%3Cpath d='M0 140H640' stroke='%2300aeef' stroke-width='1' opacity='.45'/%3E%3C/svg%3E");background-repeat:repeat-x;background-position:0 50%;background-size:920px 100%;animation:editorWaveMove 8s linear infinite,editorWaveBreathe 2.8s ease-in-out infinite alternate}
.heading-wave svg{display:none}
@keyframes editorWaveMove{from{background-position-x:0}to{background-position-x:-920px}}
@keyframes editorWaveBreathe{from{transform:translateY(-50%) scaleY(.88);opacity:.27}to{transform:translateY(-50%) scaleY(1.06);opacity:.42}}
@media(max-width:900px){.services .section-head{min-height:300px}.heading-wave{left:-15%;right:-45%;top:64%;height:250px;opacity:.3;background-size:760px 100%}}
@media(prefers-reduced-motion:reduce){.heading-wave{animation:none}}
.heading-wave{left:0;right:0;height:300px;background:none;animation:none;opacity:.42;filter:drop-shadow(0 0 8px rgba(0,174,239,.28))}
.heading-wave canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
@media(max-width:900px){.heading-wave{left:0;right:0;height:260px}}
.project-steps i{font:600 22px/1 Manrope,sans-serif;letter-spacing:-.04em;margin-bottom:24px;color:#8d989d}
.project-steps .done i,.project-steps .active i{color:#70e19d}
.project section:before{content:"";display:block;width:min(310px,82%);height:126px;margin:0 0 22px -40px;background:url("assets/wrexham-city-radio-logo-transparent.png") left center/contain no-repeat}
.project section{position:relative;overflow:hidden;isolation:isolate}
.project section:after{content:"";position:absolute;z-index:-1;inset:0 0 0 18%;background:url("assets/wrexham-city-centre-st-giles.jpg") center 56%/cover no-repeat;opacity:.34;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.1) 18%,#000 72%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.1) 18%,#000 72%)}
.project section:before,.project section>small,.project section>strong,.project section>p{position:relative;z-index:2}
/* Genuine production photography for the six-stage process */
.process-grid article {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.process-grid article::before,
.process-grid article::after {
  content: "";
  position: absolute;
  inset: 0;
}

.process-grid article::before {
  z-index: -2;
  background-size: cover;
  background-position: center;
  opacity: .32;
  filter: saturate(.72) contrast(1.08);
  transform: scale(1.035);
  transition: transform .8s cubic-bezier(.2,.7,.2,1), opacity .45s ease;
}

.process-grid article::after {
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(8,11,13,.40) 0%, rgba(8,11,13,.74) 55%, rgba(8,11,13,.95) 100%),
    linear-gradient(90deg, rgba(0,174,239,.08), transparent 62%);
  transition: opacity .45s ease;
}

.process-grid article:hover::before {
  opacity: .70;
  transform: scale(1.08);
}

.process-grid article:hover::after {
  opacity: .60;
}

.process-grid article:nth-child(1)::before {
  background-image: url("assets/radio-process/v2/listen.jpg");
  background-position: center 48%;
}

.process-grid article:nth-child(2)::before {
  background-image: url("assets/radio-process/v2/idea.jpg");
  background-position: center 46%;
}

.process-grid article:nth-child(3)::before {
  background-image: url("assets/radio-process/v2/write.jpg");
  background-position: center 50%;
}

.process-grid article:nth-child(4)::before {
  background-image: url("assets/radio-process/v3-produce.jpg");
  background-position: center 46%;
}

.process-grid article:nth-child(5)::before {
  background-image: url("assets/radio-process/v2/refine.jpg");
  background-position: center 48%;
}

.process-grid article:nth-child(6)::before {
  background-image: url("assets/radio-process/deliver.jpg");
  background-position: center 50%;
}

.console .wave {
  position: relative;
  height: 220px;
  margin: auto 0;
  overflow: hidden;
  transform: none;
  text-shadow: none;
  border-top: 1px solid rgba(0,174,239,.15);
  border-bottom: 1px solid rgba(0,174,239,.15);
  background:
    linear-gradient(rgba(0,174,239,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,174,239,.055) 1px, transparent 1px);
  background-size: 100% 25%, 48px 100%;
}

.console .wave canvas {
  display: block;
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 0 9px rgba(0,174,239,.38));
}

.reason-grid article {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 235px;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  transition: border-color .4s ease;
}

.reason-grid article video {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .30;
  transform: scale(1.035);
  filter: saturate(.78) contrast(1.08);
  transition: opacity .48s ease, transform 1.1s cubic-bezier(.2,.7,.2,1);
}

.reason-grid article::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(7,10,12,.25), rgba(7,10,12,.92));
  opacity: 0;
  transition: opacity .45s ease;
}

.reason-grid article:hover,
.reason-grid article:focus-visible {
  border-color: rgba(0,174,239,.55);
  outline: none;
}

.reason-grid article:hover video,
.reason-grid article:focus-visible video {
  opacity: .72;
  transform: scale(1.08);
}

.reason-grid article:hover::after,
.reason-grid article:focus-visible::after {
  opacity: 1;
}

.reason-grid article b,
.reason-grid article p {
  position: relative;
  z-index: 1;
}

.reason-grid article:hover p,
.reason-grid article:focus-visible p {
  color: #d3d9dc;
}

@media (prefers-reduced-motion: reduce) {
  .reason-grid article video {
    transition: opacity .2s ease;
    transform: none;
  }
}
