/* Ocean and Forest blend across the coloured chapters, with dark intervals. */
.ocean-concept{
 --chapter-black:#0b1012;--chapter-blue:#286179;--chapter-green:#8eae89;--forest-ink:#172c23;--forest-copy:#233a2c;
 --ocean-forest-deep:linear-gradient(118deg,#245b72 0%,#2b6067 46%,#365c46 100%);
 --ocean-forest-light:linear-gradient(118deg,#9fc6d0 0%,#99b9ac 48%,#a4bc8d 100%);
}
body.direction-b.ocean-concept{background:var(--chapter-green)}
body.direction-b.ocean-concept.enquiry-open{background:var(--chapter-black)}
.direction-b.ocean-concept .study-hero{background:var(--chapter-black)}
.ocean-concept .colour-atmosphere{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.ocean-concept .grain-plume{position:absolute;display:block;inset:-7%;--grain-rise-duration:16s;--grain-delay:-3s}
.ocean-concept .grain-plume::before,.ocean-concept .grain-plume::after{content:"";position:absolute;inset:0;background:var(--plume)}
.ocean-concept .grain-plume::before{opacity:.16}
.ocean-concept .grain-plume::after{-webkit-mask-image:url('assets/colour-grain.svg');mask-image:url('assets/colour-grain.svg');-webkit-mask-size:192px 192px;mask-size:192px 192px;-webkit-mask-repeat:repeat;mask-repeat:repeat;opacity:.9;animation:grain-rise var(--grain-rise-duration) linear var(--grain-delay) infinite}
.ocean-concept .grain-blue{--plume:radial-gradient(ellipse 54% 60% at 0% 16%,#5aadc8bf,transparent 84%),radial-gradient(ellipse 39% 28% at 98% 100%,#5aadc873,transparent 85%)}
.ocean-concept .grain-green{--plume:radial-gradient(ellipse 50% 58% at 102% 25%,#8eae89a6,transparent 85%),radial-gradient(ellipse 38% 33% at 0% 100%,#8eae8980,transparent 85%);--grain-rise-duration:20s;--grain-delay:-12s}
/* Move exactly one repeating tile: no reversal, easing, fading or visible reset.
   Only the grain travels; the coloured light and the content stay anchored. */
@keyframes grain-rise{from{-webkit-mask-position:0 0;mask-position:0 0}to{-webkit-mask-position:0 -192px;mask-position:0 -192px}}
.ocean-concept .colour-motion-paused .grain-plume::after{animation-play-state:paused}

/* The grain is a background layer, never a filter on the lettering. */
.ocean-concept :is(.services,.digital-situation,.approach-timeline,.conviction-cta,.connect-section,.next-step-section){position:relative;isolation:isolate;overflow:hidden}
.ocean-concept .section-grain{
 --section-atmosphere:radial-gradient(ellipse 66% 82% at 0% 12%,var(--grain-light,#96d5e6),transparent 84%),radial-gradient(ellipse 58% 76% at 100% 88%,var(--grain-shade,#173e50),transparent 82%);
 position:absolute;inset:-6%;z-index:-1;pointer-events:none;
}
.ocean-concept .section-grain::before,.ocean-concept .section-grain::after{content:"";position:absolute;inset:0}
.ocean-concept .section-grain::before{background:var(--section-atmosphere);opacity:.07}
.ocean-concept .section-grain::after{
 background:var(--section-atmosphere),linear-gradient(var(--grain-floor,#bce6ef20),var(--grain-floor,#bce6ef20));
 -webkit-mask-image:url('assets/colour-grain.svg');mask-image:url('assets/colour-grain.svg');
 -webkit-mask-size:192px 192px;mask-size:192px 192px;
 -webkit-mask-repeat:repeat;mask-repeat:repeat;
 opacity:var(--grain-strength,.52);
 animation:grain-rise 20s linear var(--grain-delay,-9s) infinite;
}
.ocean-concept .colour-motion-paused .section-grain::after{animation-play-state:paused}
.ocean-concept :is(.digital-situation,.conviction-cta){--grain-light:#5aadc8;--grain-shade:#8eae89;--grain-floor:#5aadc81c;--grain-strength:.58}
.ocean-concept :is(.services,.connect-section){--grain-light:#96d5e6;--grain-shade:#2c4f3b}
.ocean-concept :is(.approach-timeline,.next-step-section){--grain-light:#d8edf0;--grain-shade:#3d674c;--grain-floor:#eef3d52b;--grain-strength:.46}
.ocean-concept .digital-situation{--grain-delay:-17s}
.ocean-concept .approach-timeline{--grain-delay:-25s}
.ocean-concept .conviction-cta{--grain-delay:-31s}
.ocean-concept .connect-section{--grain-delay:-6s}
.ocean-concept .next-step-section{--grain-delay:-21s}

/* White service cards sit on the deeper blue/green blend. */
.direction-b.ocean-concept .services{background:var(--ocean-forest-deep);color:#fff}
.direction-b.ocean-concept .services .section-heading h2,
.direction-b.ocean-concept .services .section-heading h2 span{color:#f5fafb}
.direction-b.ocean-concept .services .section-heading>p{color:#d8e8ed}
.direction-b.ocean-concept .service-card{border-color:#fff;box-shadow:0 8px 26px #061c2512}

/* Black: two legible perspectives, with blue and green as quiet cues. */
.ocean-concept .digital-situation{background:var(--chapter-black);color:#f3f7f5;--chapter-grain:#7eabb8}
.ocean-concept .digital-situation h2{color:#f3f7f5}
.ocean-concept .digital-situation .situation-eyebrow{color:#a8c4ad}
.ocean-concept .digital-situation .situation-intro,
.ocean-concept .digital-situation li{color:#bccacb}
.ocean-concept .digital-situation .situation-column{background:linear-gradient(145deg,#1b333d,#14252c 60%);border-color:#35505c}
.ocean-concept .digital-situation .situation-opportunities{background:linear-gradient(145deg,#293b2f,#1b2921 60%);border-color:#405340}
.ocean-concept .digital-situation h3{color:#9dcedd}
.ocean-concept .digital-situation .situation-opportunities h3{color:#b4cdad}

/* A lighter blue/green blend supports dark type and the numbered path. */
.ocean-concept .approach-timeline{background:var(--ocean-forest-light);color:var(--forest-ink);--chapter-grain:#eff4d4}
.ocean-concept .approach-timeline .approach-intro,
.ocean-concept .approach-timeline .approach-steps p{color:var(--forest-copy)}

.ocean-concept .conviction-cta{background:var(--chapter-black);--chapter-grain:#8eae89}

/* The closing sections repeat the shared palette in deep and light tones. */
.ocean-concept .connect-section{background:var(--ocean-forest-deep);color:#f5fafb}
.ocean-concept .connect-section h2 span{color:#c2e1e9}
.ocean-concept .connect-section .closing-eyebrow{color:#d8e8ed}
.ocean-concept .connect-section .connect-copy p{color:#e0ebee}
.ocean-concept .connect-section .connect-copy .connect-audience{color:#cfdee3}
.ocean-concept .connect-section a.connect-button{color:#f5fafb;border-color:#bad6df80;background:#ffffff06}
.ocean-concept .connect-section a.connect-button:hover{color:#173b4a;background:#e2eef1;border-color:#e2eef1}
.ocean-concept .connect-section a.connect-button:active{background:#cde2e8}
.ocean-concept .connect-section a:focus-visible{outline-color:#e6f2ef}
.ocean-concept .connect-section .connect-principle{color:#c5dbe1;border-color:#c1dce340}
.ocean-concept .connect-section .connect-principle strong{color:#f1f7f8}
.ocean-concept .next-step-section{background:var(--ocean-forest-light);color:var(--forest-ink);--chapter-grain:#eff4d4}
.ocean-concept .next-step-section .closing-eyebrow{color:var(--forest-ink)}
.ocean-concept .next-step-section .next-step-intro{color:var(--forest-copy)}
.ocean-concept .next-step-section a.next-step-button{color:#f2f7ed;background:var(--forest-ink);border-color:var(--forest-ink)}
.ocean-concept .next-step-section a.next-step-button:hover{background:#263f30;border-color:#263f30}
.ocean-concept .next-step-section a.next-step-button:active{background:#0f2118}
.ocean-concept .next-step-section a:focus-visible{outline-color:var(--forest-ink)}
.ocean-concept .next-step-section .closing-signoff{border-color:#304a3b42}
.ocean-concept .next-step-section .closing-signoff img{filter:brightness(0);opacity:.78}
.ocean-concept .next-step-section .closing-top{color:var(--forest-copy)}
.ocean-concept .next-step-section .closing-top:hover{color:#0b1b12}
@media(max-width:700px){
 .ocean-concept .grain-blue{--plume:radial-gradient(ellipse 65% 46% at -8% 20%,#5aadc8b3,transparent 85%),radial-gradient(ellipse 46% 25% at 100% 100%,#5aadc866,transparent 85%)}
 .ocean-concept .grain-green{--plume:radial-gradient(ellipse 62% 44% at 108% 24%,#8eae8999,transparent 85%),radial-gradient(ellipse 46% 25% at 0% 100%,#8eae8966,transparent 85%)}
 .ocean-concept .section-grain{inset:-4%}
}
@media(prefers-reduced-motion:reduce){.ocean-concept .grain-plume::after,.ocean-concept .section-grain::after{animation:none;-webkit-mask-position:0 0;mask-position:0 0}}
