/* A single underwater environment links the three chapters. */
.ocean-chapters{position:relative;isolation:isolate;background:#081225;color:#e8f6f8;overflow:hidden}
.ocean-chapters:before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#07182766,#06132e35 48%,#190d3638),url('assets/ocean-descent-v29.png') center/100% 100% no-repeat;pointer-events:none}
.ocean-chapters:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#080f1d 0%,transparent 6%,transparent 93%,#071623);pointer-events:none}
.ocean-chapters .offer,.ocean-chapters .projects,.ocean-chapters .contact{position:relative;background:none;color:#e8f6f8;padding-top:190px;padding-bottom:115px;isolation:isolate}
.ocean-chapters .section-center>p:last-child,.offer-story>p,.ocean-chapters .projects-heading>p{color:#b6ccd7}
.ocean-chapters h2 em{color:#a6e8e3}.ocean-chapters .projects h2 em{color:#c2b8f5}.ocean-chapters .contact h2 em{background:linear-gradient(100deg,#b7b2f6,#aee8ea);background-clip:text;color:transparent}
.ocean-chapters .eyebrow{color:#a9ceda}
.ocean-chapters .chapter-line:before,.ocean-chapters .chapter-line:after{display:none}
.ocean-chapters .chapter-line{justify-content:center;color:#bac8e7;margin-bottom:42px}
.ocean-chapters .project-end{display:none}
.ocean-chapters .projects-heading{margin-bottom:44px}
.ocean-chapters .price-panel{border:1px solid #7fdbdd66;background:linear-gradient(135deg,#0c304caa,#08152ab8);box-shadow:0 25px 70px #010a2155,inset 0 1px #b8f7ff18;backdrop-filter:blur(14px)}
.ocean-chapters .price-panel .eyebrow,.ocean-chapters .price-panel p,.ocean-chapters .price-panel li{color:#c0dde5}.ocean-chapters .price strong{color:#efffff}
.ocean-chapters .step{border-color:#82c7d42e;background:linear-gradient(120deg,#163e5266,#10243e55);color:#ecfaff}.ocean-chapters .step p{color:#b0cbd7}.ocean-chapters .step>span{background:#0b324955;color:#9ce4e7;border-color:#81d9de66}
html:not(.reduced) .ocean-chapters .step:hover,.ocean-chapters .step:focus-within{background:radial-gradient(circle at var(--shine-x,50%) 0%,#224e68e8,#102b43ed);box-shadow:0 15px 35px #020b2855}
.ocean-chapters .geranium,.ocean-chapters .creatvar{background:linear-gradient(135deg,#203e4566,#09172c99);color:#e7f6e4;border:1px solid #b0dacf4f;backdrop-filter:blur(12px);border-radius:22px;box-shadow:0 20px 55px #02091e40}
.ocean-chapters .creatvar{background:linear-gradient(135deg,#39365b77,#10182d99);color:#e5dffa;border-color:#b0a3ea55}
.ocean-chapters .creatvar .project-identity>span>span{color:#b5a5f3}
.ocean-chapters .project-card:hover{box-shadow:0 25px 60px #01071988,0 0 30px #76b5e51a;border-color:#bfe9f5aa}
.ocean-chapters .brief-form{background:linear-gradient(135deg,#1425419c,#18152caa);border:1px solid #a8b4e455;box-shadow:0 25px 80px #05061777,inset 0 1px #dceaff12;backdrop-filter:blur(15px)}
.ocean-chapters .brief-form label,.ocean-chapters .brief-form legend{color:#b2c5e5}
.ocean-chapters .brief-form textarea,.ocean-chapters .form-fields input{color:#effaff;background:#09182a44;border:1px solid #849bc04d;border-radius:12px;padding:15px 16px;font-family:'Segoe UI',Arial,sans-serif;font-size:16px}
.ocean-chapters .brief-form textarea{margin:14px 0 16px}.ocean-chapters textarea::placeholder,.ocean-chapters input::placeholder{color:#a7b9cb;opacity:1}
.ocean-chapters .form-fields{border-color:#a4b9e333}.ocean-chapters .form-fields input{margin-top:10px}
.ocean-chapters .choice span{background:#0d25455c;color:#d4e8ee;border-color:#8cbddc55}.ocean-chapters .choice input:checked+span{background:#267f8677;border-color:#8feee9;color:#ecffff;box-shadow:0 0 15px #80f0e51c}
.ocean-chapters .form-bottom p,.ocean-chapters .direct-contact,.ocean-chapters .form-status{color:#bfd1e0}
.ocean-chapters .pill.primary{background:linear-gradient(110deg,#92f0dd,#98cce9);color:#082939;border:0;box-shadow:0 8px 30px #54ddd52b}.ocean-chapters .pill.primary:hover{background:#b6f6ec}
.ocean-current{position:absolute;top:-15px;left:-3%;width:106%;height:185px;pointer-events:none;z-index:0;overflow:hidden;mask-image:linear-gradient(transparent,#000 25%,#000 75%,transparent)}
.ocean-current svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 5px #69e4ff88)}
.current-thread{stroke-width:1.4;opacity:var(--alpha);transform-origin:center;animation:current-flow var(--t) ease-in-out var(--delay) infinite alternate}
.current-1{filter:hue-rotate(9deg)}.current-2{filter:hue-rotate(35deg)}
.current-particles{position:absolute;inset:0}.current-particles i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:#bdffff;box-shadow:0 0 10px #7ef9ff;animation:current-drift var(--d) ease-in-out var(--delay) infinite alternate;opacity:.65}
.ocean-current:before{content:'';position:absolute;inset:20% 0;background:radial-gradient(ellipse at 45% 50%,#77dfff1a,transparent 66%);animation:current-breathe 8s ease-in-out infinite alternate}
@keyframes current-flow{from{transform:translate(-2%,10px) scaleY(.75)}to{transform:translate(2%,-12px) scaleY(1.1)}}
@keyframes current-drift{from{transform:translate(-14px,14px);opacity:.2}to{transform:translate(30px,-18px);opacity:.8}}
@keyframes current-breathe{to{transform:translateX(6%) scaleY(1.3);opacity:.55}}
@media(max-width:800px){.ocean-chapters .offer,.ocean-chapters .projects,.ocean-chapters .contact{padding-top:145px;padding-bottom:85px}.ocean-current{height:135px}.ocean-chapters:before{background-size:auto 100%;opacity:.8}.ocean-chapters .project-grid{padding-bottom:0}.ocean-chapters .section-center{margin-bottom:48px}.ocean-chapters .price-panel{padding:30px 25px}}
@media(prefers-reduced-motion:reduce){.ocean-current *,.ocean-current:before{animation:none!important}}
.reduced .ocean-current *,.reduced .ocean-current:before{animation:none!important}

.ocean-chapters:after{background:linear-gradient(#080f1d 0%,transparent 8%,#151c5835 42%,#29174755 75%,#24123955 93%,#071623)}
.ocean-current svg{filter:drop-shadow(0 0 3px #80ecff) drop-shadow(0 0 12px #5bdfff66)}
.current-thread{opacity:calc(var(--alpha) + .22);stroke-width:1.8}
.ocean-chapters .offer>.section-center,.ocean-chapters .offer>.offer-grid,.ocean-chapters .projects>.projects-heading,.ocean-chapters .projects>.project-grid,.ocean-chapters .contact>.section-center,.ocean-chapters .contact>.brief-form{position:relative;z-index:1}
/* Raised porcelain cards: strong depth with matching dark typography. */
.ocean-chapters .steps{perspective:900px;isolation:isolate}
.ocean-chapters .step{transform-origin:50% 50%;transition:transform .32s cubic-bezier(.2,.8,.2,1),background .28s,color .28s,box-shadow .32s,border-color .28s}
.ocean-chapters .step b,.ocean-chapters .step p,.ocean-chapters .step>span{transition:color .25s,background .25s,border-color .25s,transform .32s}
@media(min-width:801px) and (hover:hover) and (pointer:fine){
 html:not(.reduced) .ocean-chapters .step:hover{z-index:3;transform:translateY(-12px) translateZ(70px) rotateX(var(--tilt-x,7deg)) rotateY(var(--tilt-y,-7deg)) scale(1.025);background:radial-gradient(circle at var(--shine-x,50%) 0%,#fff,#edf8f8 85%);color:#102c3d;border-color:#d1fff4;box-shadow:0 30px 45px #010e2b80,0 9px 0 #628f9b70,0 0 30px #92eee333,inset 0 1px 0 #fff}
 html:not(.reduced) .ocean-chapters .step:hover b{color:#102c3d;transform:translateZ(22px)}
 html:not(.reduced) .ocean-chapters .step:hover p{color:#3e5c6c}
 html:not(.reduced) .ocean-chapters .step:hover>span{color:#086467;background:#d6f3ed;border-color:#89c8be;transform:translateZ(42px) scale(1.12);box-shadow:0 7px 14px #16555a22}
}
.ocean-chapters .step:focus-within{background:#f4fbfb;color:#102c3d;border-color:#a4e7da}
.ocean-chapters .step:focus-within b{color:#102c3d}.ocean-chapters .step:focus-within p{color:#3e5c6c}.ocean-chapters .step:focus-within>span{background:#d6f3ed;color:#086467}
@media(prefers-reduced-motion:reduce){.ocean-chapters .step,.ocean-chapters .step *{transition:none!important;transform:none!important}}

/* On touch screens only the fully readable step nearest the centre is raised. */
@media(max-width:800px),(hover:none),(pointer:coarse){
 html:not(.reduced) .ocean-chapters .step.mobile-in-focus{z-index:3;transform:translateY(-3px) scale(1.035);background:linear-gradient(135deg,#fff,#edf8f8);color:#102c3d;border-color:#d1fff4;box-shadow:0 15px 28px #010e2b65,0 4px 0 #628f9b50,inset 0 1px 0 #fff}
 html:not(.reduced) .ocean-chapters .step.mobile-in-focus b{color:#102c3d}
 html:not(.reduced) .ocean-chapters .step.mobile-in-focus p{color:#3e5c6c}
 html:not(.reduced) .ocean-chapters .step.mobile-in-focus>span{color:#086467;background:#d6f3ed;border-color:#89c8be;transform:none}
}
@media(prefers-reduced-motion:reduce){.ocean-chapters .step.mobile-in-focus{transform:none!important}}

@media(max-width:800px),(hover:none),(pointer:coarse){
 .ocean-chapters .step>div,.ocean-chapters .step>span{transform:none}
 html:not(.reduced) .ocean-chapters .step:not(.mobile-in-focus):hover{transform:none;background:linear-gradient(120deg,#163e5266,#10243e55);box-shadow:none;border-color:#82c7d42e}
}

/* Perched pirate: the body and short gripping arms stay anchored to the card. */
.price-pirate{position:absolute;z-index:2;pointer-events:none;width:180px;aspect-ratio:1303/1207;right:-49px;top:-95px;filter:drop-shadow(0 6px 5px #03132240)}
.pirate-part{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:fill}
.pirate-body{clip-path:polygon(17% 0,100% 0,100% 45%,85% 49%,83% 58%,77% 59%,73% 65%,71% 68%,61% 65%,62% 76%,65% 85%,100% 85%,100% 100%,0 100%,0 80%,30% 80%,37% 74%,36.5% 65%,31% 64%,30% 56%,25% 50%,17% 40%)}
.pirate-sword{clip-path:polygon(0 0,17% 0,17% 40%,25% 50%,30% 56%,31% 64%,36.5% 65%,37% 74%,30% 80%,0 80%);transform-origin:36.5% 70%;animation:pirate-cutlass 4.6s ease-in-out infinite;animation-play-state:paused}
.pirate-scroll{clip-path:polygon(61% 65%,71% 68%,73% 65%,77% 59%,83% 58%,85% 49%,100% 45%,100% 85%,65% 85%,62% 76%);transform-origin:62% 71%;animation:pirate-chart 6.1s ease-in-out -1.7s infinite;animation-play-state:paused}
.price-scene.in-view .pirate-sword,.price-scene.in-view .pirate-scroll{animation-play-state:running}
@keyframes pirate-cutlass{0%,100%{transform:rotate(-2deg)}35%{transform:rotate(4deg)}65%{transform:rotate(1deg)}}
@keyframes pirate-chart{0%,100%{transform:rotate(1.5deg)}45%{transform:rotate(-3deg)}75%{transform:rotate(-.5deg)}}
@media(max-width:800px){.price-pirate{width:144px;right:-22px;top:-80px}}
@media(prefers-reduced-motion:reduce){.pirate-part{animation:none!important;transform:none!important}}
.reduced .pirate-part{animation:none!important;transform:none!important}

/* Subdued companion and slow bioluminescent life around the contact form. */
.price-pirate{opacity:.82;filter:brightness(.9) saturate(.8) drop-shadow(0 6px 7px #06233966)}
.contact-jellies{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;mask-image:linear-gradient(transparent,#000 12%,#000 87%,transparent)}
.contact-jelly{position:absolute;top:0;height:100%;width:var(--size);opacity:0;animation:jelly-rise var(--duration) linear var(--delay) infinite;animation-play-state:paused;will-change:transform}
.contact-jelly img{display:block;width:100%;height:auto;opacity:var(--glow);filter:drop-shadow(0 0 9px #68cfff55);animation:jelly-sway 7s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:50% 12%}
.jelly-0{left:-4%;--size:230px;--duration:29s;--delay:-14s;--glow:.42}
.jelly-1{right:-3%;--size:190px;--duration:34s;--delay:-25s;--glow:.35}
.jelly-2{left:8%;--size:130px;--duration:38s;--delay:-5s;--glow:.25}
.jelly-3{right:9%;--size:110px;--duration:31s;--delay:-20s;--glow:.27}
.contact.jellies-visible .contact-jelly,.contact.jellies-visible .contact-jelly img{animation-play-state:running}
@keyframes jelly-rise{0%{transform:translateY(105%);opacity:0}8%{opacity:1}85%{opacity:1}100%{transform:translateY(-450px);opacity:0}}
@keyframes jelly-sway{from{transform:translateX(-9px) rotate(-3deg) scaleX(.98)}to{transform:translateX(11px) rotate(3deg) scaleX(1.025)}}
@media(max-width:800px){.jelly-0{left:-20%;--size:190px;--glow:.32}.jelly-1{right:-20%;--size:170px;--glow:.3}.jelly-2,.jelly-3{display:none}}
@media(prefers-reduced-motion:reduce){.contact-jelly,.contact-jelly img{animation:none!important}.contact-jelly{opacity:.5;transform:translateY(45%)}.jelly-1{transform:translateY(12%)}}
.reduced .contact-jelly,.reduced .contact-jelly img{animation:none!important}.reduced .contact-jelly{opacity:.5;transform:translateY(45%)}