.service-detail-page{background:#fff}
.service-detail-hero{position:relative;overflow:hidden;min-height:650px;background:radial-gradient(ellipse at 70% 24%,rgba(26,139,204,.55) 0%,rgba(16,82,142,.3) 30%,transparent 58%),linear-gradient(115deg,#0e101e 0%,#0b203d 46%,#06145a 100%);color:#fff}
.service-detail-hero:after{content:"";position:absolute;z-index:1;left:-3%;right:-3%;bottom:-1px;height:90px;background:#fff;clip-path:polygon(0 60%,15% 74%,31% 59%,48% 72%,65% 56%,83% 71%,100% 50%,100% 100%,0 100%)}
.service-detail-hero-inner{width:min(1380px,calc(100% - 96px));min-height:650px;margin:auto;padding:210px 0 135px;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.9fr);align-items:center;gap:50px}
.service-detail-hero-copy{position:relative;z-index:2}.service-back-link{display:inline-block;margin-bottom:45px;color:#a9d9ff;text-decoration:none;font-weight:700}.service-back-link:hover{text-decoration:underline}.service-detail-eyebrow{color:#59b7ff;font-size:19px;font-weight:700;margin:0 0 13px}.service-detail-hero h1{font-family:Eurostile,Arial,sans-serif;font-size:clamp(42px,4.6vw,78px);line-height:1.06;margin:0 0 25px;max-width:760px}.service-detail-hero-copy>p:last-child{font-size:clamp(19px,1.5vw,25px);line-height:1.5;max-width:610px;margin:0}
.service-mockup{position:relative;height:400px;filter:drop-shadow(0 27px 35px rgba(0,3,40,.33))}.mockup-browser{position:absolute;inset:35px 14px 35px 0;background:#f5faff;border:10px solid #a8d9ff;border-radius:22px;transform:rotate(-5deg);overflow:hidden}.mockup-topbar{height:37px;background:#e5f2ff;display:flex;align-items:center;gap:8px;padding:0 17px}.mockup-topbar span{width:8px;height:8px;border-radius:50%;background:#168ae1}.mockup-topbar i{font:12px Arial,sans-serif;color:#7895bd;margin-left:15px}.mockup-content{display:flex;height:calc(100% - 37px)}.mockup-sidebar{width:25%;background:#102c7e;padding:27px 17px;box-sizing:border-box;display:grid;align-content:start;gap:20px}.mockup-sidebar>*{height:9px;background:#75bdff;border-radius:20px}.mockup-sidebar b{width:55%;height:18px;background:#d8e9ff;margin-bottom:14px}.mockup-sidebar span:nth-child(3){width:68%}.mockup-sidebar span:nth-child(4){width:84%}.mockup-main{flex:1;padding:31px 36px}.mockup-label{width:53%;height:18px;border-radius:30px;background:#c5daf4}.mockup-bars{height:165px;display:flex;align-items:end;gap:10px;padding:23px 0;box-sizing:border-box}.mockup-bars i{flex:1;height:44%;border-radius:5px 5px 0 0;background:#0c8de5}.mockup-bars i:nth-child(2){height:71%}.mockup-bars i:nth-child(3){height:51%}.mockup-bars i:nth-child(4){height:85%}.mockup-bars i:nth-child(5){height:68%}.mockup-bars i:nth-child(6){height:94%}.mockup-bars i:nth-child(7){height:78%}.mockup-metrics{display:flex;gap:13px}.mockup-metrics span{width:32%;height:35px;background:#dceaff;border-radius:8px}.mockup-phone{position:absolute;right:-10px;bottom:0;width:150px;height:250px;background:#fff;border:9px solid #07366b;border-radius:28px;transform:rotate(9deg);padding:21px 12px;box-sizing:border-box}.mockup-phone-top{height:8px;width:40px;border-radius:9px;background:#0a397d;margin:0 auto 20px}.mockup-phone-image{height:100px;border-radius:12px;background:linear-gradient(140deg,#d8efff 20%,#6bb8ef 55%,#037bd3 56%,#0c3b91)}.mockup-phone-lines{display:grid;gap:8px;margin-top:15px}.mockup-phone-lines i{height:7px;border-radius:7px;background:#c5dff9}.mockup-phone-lines i:nth-child(2){width:74%}.mockup-phone-lines i:nth-child(3){width:53%}.mockup-orbit{position:absolute;border:2px dashed rgba(95,185,255,.3);border-radius:50%;pointer-events:none}.mockup-orbit-a{inset:0 30px 10px -30px}.mockup-orbit-b{inset:32px -30px 27px 10px}
.service-detail-story{width:min(1380px,calc(100% - 96px));margin:65px auto 90px;display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:start}.service-story-kicker{color:#0a8be2;font-size:20px;font-weight:700;margin:0 0 14px}.service-story-copy h2{font-family:Eurostile,Arial,sans-serif;font-size:clamp(36px,3vw,53px);line-height:1.14;color:#06145a;margin:0 0 28px}.service-story-copy>p:not(.service-story-kicker){font-size:21px;line-height:1.72;color:#263467;margin:0 0 32px}.service-price-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-height:62px;padding:0 32px;background:#0c8de5;color:#fff;font-size:20px}.service-steps{display:grid;gap:18px}.service-step{position:relative;border:1px solid #d5e8fb;border-radius:18px;padding:23px 25px 22px 78px;box-shadow:0 13px 30px rgba(12,62,129,.08);background:#fff}.service-step-number{position:absolute;left:23px;top:25px;color:#0b8bdf;font-family:Eurostile,Arial,sans-serif;font-size:24px}.service-step h3{margin:0 0 7px;color:#07145b;font-size:22px}.service-step p{margin:0;color:#465578;font-size:17px;line-height:1.45}
@media(max-width:850px){.service-detail-hero-inner{width:min(100% - 38px,650px);padding:155px 0 110px;grid-template-columns:1fr;gap:30px}.service-detail-hero h1{font-size:clamp(36px,7vw,58px)}.service-mockup{height:300px}.service-detail-story{width:min(100% - 38px,650px);grid-template-columns:1fr;gap:38px;margin:45px auto 65px}.mockup-browser{inset:20px 12px 20px 0}.mockup-phone{width:115px;height:190px}.mockup-phone-image{height:70px}}
@media(max-width:520px){.service-detail-hero-inner{padding-top:135px}.service-mockup{height:235px}.mockup-browser{border-width:6px}.mockup-main{padding:20px}.mockup-sidebar{padding:20px 9px}.mockup-phone{right:-4px;bottom:0;width:95px;height:155px;padding:15px 8px;border-width:5px;border-radius:20px}.mockup-phone-top{margin-bottom:12px}.mockup-phone-image{height:52px}.service-story-copy>p:not(.service-story-kicker){font-size:18px}}
@media(prefers-reduced-motion:no-preference){.service-mockup{animation:mockup-float 6s ease-in-out infinite}.mockup-orbit-a{animation:mockup-orbit 20s linear infinite}.mockup-orbit-b{animation:mockup-orbit 25s linear infinite reverse}@keyframes mockup-float{50%{transform:translateY(-9px)}}@keyframes mockup-orbit{to{transform:rotate(360deg)}}}

/* Each service keeps the same compact animated stage, but has its own visual language. */
.service-visual-variant{position:absolute;inset:0;display:none}
.service-mockup[data-service="0"] .visual-social,.service-mockup[data-service="1"] .visual-advertising,.service-mockup[data-service="2"] .visual-website,.service-mockup[data-service="3"] .visual-photo{display:block}

/* Digital advertising: campaign dashboard, reach chart and target. */
.visual-advertising{filter:drop-shadow(0 25px 30px rgba(0,3,40,.28))}.ad-dashboard{position:absolute;inset:38px 25px 45px 10px;background:#f5faff;border:9px solid #86caff;border-radius:20px;transform:rotate(-4deg);overflow:hidden}.ad-topbar{height:35px;background:#dcefff;display:flex;align-items:center;gap:7px;padding:0 14px;color:#6d88ad;font:11px Arial,sans-serif}.ad-topbar span{width:7px;height:7px;border-radius:50%;background:#118de2}.ad-topbar b{margin-left:10px;font-weight:600}.ad-dashboard-body{display:flex;height:calc(100% - 35px)}.ad-side{width:22%;padding:23px 12px;background:#122e82;display:grid;align-content:start;gap:15px}.ad-side i{display:block;height:8px;border-radius:8px;background:#75bcff}.ad-side i:first-child{width:62%;height:16px;background:#dbedff;margin-bottom:10px}.ad-side i:nth-child(3){width:78%}.ad-side i:nth-child(4){width:55%}.ad-main{flex:1;padding:24px 20px}.ad-heading{display:flex;align-items:center;justify-content:space-between}.ad-heading b{width:42%;height:14px;border-radius:8px;background:#b9d8f7}.ad-heading span{width:28%;height:22px;border-radius:6px;background:#0b8bdf}.ad-metric-row{display:flex;gap:8px;margin:25px 0 20px}.ad-metric-row i{flex:1;height:34px;border-radius:7px;background:#d8eaff}.ad-metric-row i:nth-child(2){background:#bce0ff}.ad-metric-row i:nth-child(3){background:#9dcfff}.ad-chart{position:relative;height:130px;display:flex;align-items:end;gap:8px;padding:15px 4px 0;border-bottom:2px solid #9dcfff;background:repeating-linear-gradient(to bottom,transparent 0 31px,#dfeefd 32px)}.ad-chart span{flex:1;border-radius:5px 5px 0 0;background:#0c8de5}.ad-chart span:nth-child(1){height:40%}.ad-chart span:nth-child(2){height:64%}.ad-chart span:nth-child(3){height:48%}.ad-chart span:nth-child(4){height:82%}.ad-chart span:nth-child(5){height:70%}.ad-chart b{position:absolute;width:72%;height:80px;left:12%;bottom:17px;border-top:3px solid #ef5f71;border-radius:50%;transform:rotate(-7deg);opacity:.8}.ad-megaphone{position:absolute;right:4px;bottom:18px;width:112px;height:110px;transform:rotate(-16deg)}.ad-megaphone b{position:absolute;left:15px;top:35px;width:55px;height:44px;background:#ffcc58;clip-path:polygon(0 20%,100% 0,100% 100%,0 80%);border-radius:5px}.ad-megaphone i{position:absolute;right:6px;top:25px;border-left:38px solid #ef5f71;border-top:32px solid transparent;border-bottom:32px solid transparent}.ad-megaphone span{position:absolute;left:1px;top:46px;width:20px;height:24px;border-radius:5px;background:#0b397d}.ad-target{position:absolute;left:-5px;top:5px;width:78px;height:78px;border-radius:50%;background:#a9d8ff;border:8px solid #fff;box-shadow:0 0 0 2px #0c8de5}.ad-target i,.ad-target b,.ad-target span{position:absolute;border-radius:50%;inset:14px;border:3px solid #ef5f71}.ad-target b{inset:24px;border-color:#0c8de5}.ad-target span{inset:33px;border:0;background:#ef5f71}

/* Website development: browser, code panel and responsive phone preview. */
.visual-website{filter:drop-shadow(0 25px 30px rgba(0,3,40,.28))}.web-browser{position:absolute;inset:40px 25px 45px 2px;background:#f6fbff;border:9px solid #8bceff;border-radius:20px;transform:rotate(-4deg);overflow:hidden}.web-browser-bar{height:34px;background:#dcefff;display:flex;align-items:center;gap:7px;padding:0 14px;color:#6684ab;font:11px Arial,sans-serif}.web-browser-bar span{width:7px;height:7px;border-radius:50%;background:#118de2}.web-browser-bar i{font-style:normal;margin-left:10px}.web-browser-body{display:flex;height:calc(100% - 34px)}.web-code{width:36%;padding:24px 14px;background:#102c7e;display:grid;align-content:start;gap:13px}.web-code b{height:14px;width:57%;background:#d7edff;border-radius:6px;margin-bottom:10px}.web-code i{height:7px;width:83%;background:#75bdff;border-radius:5px}.web-code i:nth-child(3){width:68%}.web-code i:nth-child(4){width:91%}.web-code i:nth-child(5){width:52%}.web-code i:nth-child(6){width:76%}.web-page{flex:1;padding:24px 20px;background:linear-gradient(145deg,#fff,#eaf6ff)}.web-page strong{display:block;width:75%;height:38px;margin:8px 0 18px;background:#0c8de5;border-radius:6px}.web-page b{display:block;width:90%;height:10px;margin-bottom:12px;border-radius:5px;background:#b9d8f7}.web-page b:nth-of-type(2){width:64%}.web-page span{display:block;width:100%;height:65px;margin-top:22px;border-radius:10px;background:linear-gradient(135deg,#bce5ff,#328fdf)}.web-page em{display:block;width:34%;height:12px;margin-top:19px;border-radius:6px;background:#0b397d}.web-phone{position:absolute;right:0;bottom:18px;width:112px;height:205px;padding:15px 11px;background:#fff;border:7px solid #07366b;border-radius:23px;transform:rotate(8deg);box-shadow:0 13px 23px #02174b44}.web-phone div{width:32px;height:6px;margin:0 auto 18px;border-radius:6px;background:#0a397d}.web-phone span{display:block;height:48px;margin-bottom:10px;border-radius:8px;background:linear-gradient(145deg,#ccecff,#168ae1)}.web-phone span:nth-of-type(2){height:8px;background:#c5dff9}.web-phone b{display:block;width:66%;height:8px;margin-top:13px;border-radius:7px;background:#0b8bdf}.web-cursor{position:absolute;right:24%;top:23%;font:bold 48px Arial;color:#ef5f71;transform:rotate(-15deg)}

/* Photo/video production: camera, production frames and play cue. */
.visual-photo{filter:drop-shadow(0 25px 30px rgba(0,3,40,.28))}.photo-orbit{position:absolute;border:2px dashed rgba(95,185,255,.35);border-radius:50%}.photo-orbit-a{inset:15px 40px 20px -35px;transform:rotate(-20deg)}.photo-orbit-b{inset:35px -25px 8px 65px;transform:rotate(22deg)}.camera{position:absolute;left:10%;top:27%;width:58%;height:42%;background:linear-gradient(145deg,#113b83,#071a54);border:7px solid #88cfff;border-radius:18px;box-shadow:0 18px 25px #02174b44;transform:rotate(-5deg)}.camera-top{position:absolute;left:16%;top:-22px;width:33%;height:22px;border-radius:10px 10px 0 0;background:#0b2b6f;border:5px solid #88cfff;border-bottom:0}.camera-top b{display:block;width:40%;height:8px;margin:5px auto;border-radius:5px;background:#ffcf5d}.camera-top i{position:absolute;right:-28px;top:10px;width:13px;height:13px;border-radius:50%;background:#ef5f71}.camera-lens{position:absolute;left:29%;top:12%;width:54%;aspect-ratio:1;border:8px solid #8dd2ff;border-radius:50%;background:#0c8de5;display:grid;place-items:center;box-shadow:inset 0 0 0 10px #07366b}.camera-lens span{width:36%;height:36%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#d9f3ff,#0b397d 48%,#05133e)}.camera-shutter{position:absolute;right:8%;top:16%;width:11px;height:11px;border-radius:50%;background:#ffcf5d}.photo-frame{position:absolute;width:112px;height:82px;padding:9px;background:#fff;border:5px solid #8bcfff;border-radius:8px;box-shadow:0 11px 19px #02174b44}.photo-frame span{display:block;height:45px;background:linear-gradient(145deg,#f9cc67 0 35%,#ff7c74 36% 60%,#168ae1 61%)}.photo-frame b{display:block;width:72%;height:7px;margin-top:9px;border-radius:6px;background:#b9d8f7}.photo-frame i{display:block;width:45%;height:6px;margin-top:6px;border-radius:6px;background:#dcefff}.photo-frame-a{right:3%;top:2%;transform:rotate(9deg)}.photo-frame-b{right:0;bottom:2%;transform:rotate(-8deg)}.photo-play{position:absolute;left:3%;bottom:1%;display:grid;place-items:center;width:55px;height:55px;border-radius:50%;background:#0c8de5;color:#fff;font-size:22px;box-shadow:0 7px 15px #02174b44}.photo-clapper{position:absolute;left:0;bottom:0;width:82px;height:43px;border-radius:3px 3px 8px 8px;background:#fff;border:4px solid #0c8de5;transform:rotate(-12deg);padding-top:12px;display:flex;gap:7px;justify-content:center}.photo-clapper b{position:absolute;left:-4px;right:-4px;top:-12px;height:15px;background:repeating-linear-gradient(135deg,#0c8de5 0 11px,#fff 11px 21px);border:4px solid #0c8de5}

@media(max-width:520px){.ad-dashboard,.web-browser{inset:27px 10px 30px 0;border-width:6px}.ad-main{padding:16px 12px}.ad-metric-row{margin:15px 0 12px}.ad-chart{height:95px;gap:5px}.ad-megaphone{right:-2px;bottom:4px;transform:scale(.78) rotate(-16deg);transform-origin:bottom right}.ad-target{transform:scale(.75);transform-origin:top left}.web-page{padding:16px 12px}.web-code{padding:16px 9px;gap:9px}.web-phone{width:84px;height:150px;padding:10px 7px;border-width:5px}.web-phone div{margin-bottom:11px}.web-phone span{height:34px}.web-cursor{font-size:34px}.photo-frame{width:82px;height:62px;padding:6px;border-width:3px}.photo-frame span{height:33px}.photo-frame b{margin-top:5px;height:5px}.photo-frame i{margin-top:4px;height:4px}.camera{border-width:5px}.camera-lens{border-width:6px;box-shadow:inset 0 0 0 7px #07366b}.camera-top{border-width:4px}.photo-play{width:43px;height:43px;font-size:17px}.photo-clapper{transform:scale(.75) rotate(-12deg);transform-origin:left bottom}}

/* Keep every service detail hero in the same deep space palette as the main rocket hero. */
.service-detail-hero{
  background:#06145a;
}
.service-detail-eyebrow{color:#68b7e6}