.services-page .page-hero{background:#f2f3f5;border:1px solid #e8eaed;border-radius:26px;max-width:1224px;width:90%;margin:18px auto 55px;padding:55px 50px}.services-page .page-hero h1{font-size:clamp(32px,3.8vw,55px);line-height:1.25;max-width:1000px}.services-page .page-hero p{max-width:850px;color:#60666e;font-size:16px;line-height:1.8}.services-page .page-hero .eyebrow{background:#fff;border:1px solid #dfe3e7;padding:6px 12px;border-radius:30px;font-family:ui-monospace,monospace;font-size:10px}
.service-offerings-section{padding:0 5% 80px;max-width:1360px;margin:auto}.service-offerings-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}.service-offering{background:#fff;border:1px solid #e1e5e9;border-radius:28px;padding:12px;overflow:hidden;transition:box-shadow .35s,transform .35s}.service-offering:nth-child(even){transform:translateY(85px)}.service-offering:hover{box-shadow:0 15px 40px #182b3c0e}.offering-scene{position:relative;display:block;height:325px;background:#f0f2f4;border-radius:20px;overflow:hidden;isolation:isolate}.offering-1 .offering-scene,.offering-4 .offering-scene{background:#ffded0}.offering-3 .offering-scene{background:#171c21}.offering-5 .offering-scene{background:#e5e9ed}.offering-scene-label{position:absolute;left:15px;top:15px;background:#ffffffef;color:#636d74;border-radius:30px;padding:6px 10px;font-size:7px;z-index:4;display:flex;gap:6px;align-items:center}.offering-scene-label>i{background:var(--orange);width:5px;height:5px;border-radius:50%}.offering-number{position:absolute;right:15px;top:15px;border-radius:50%;background:#101416;color:var(--orange);width:28px;height:28px;font-size:9px;display:grid;place-items:center;z-index:4}.offering-window{position:absolute;left:11%;right:11%;top:63px;bottom:38px;background:#fff;border:1px solid #10141612;box-shadow:0 15px 25px #15202b14;border-radius:14px;overflow:hidden;display:flex;flex-direction:column;animation:offeringFloat 7s ease-in-out infinite}.offering-window-bar{height:27px;flex-shrink:0;border-bottom:1px solid #e9ecef;display:flex;align-items:center;gap:4px;padding:0 10px}.offering-window-bar>i{height:4px;width:4px;background:#ccd2d7;border-radius:50%}.offering-window-bar .mono{margin-left:auto;font-size:5px;letter-spacing:.04em;color:#8b959d}.offering-window>img{height:calc(100% - 27px);width:100%;object-fit:contain;padding:8px;min-height:0;background:#fafbfc}.offering-2 .offering-window{left:30%;right:30%;top:55px;bottom:22px;border-radius:22px}.offering-2 .offering-window-bar{height:23px}.offering-2 .offering-window-bar .mono{display:none}.offering-3 .offering-window{transform:rotate(-3deg)}.offering-scan{position:absolute;inset:27px 0 auto;height:1px;background:var(--orange);box-shadow:0 0 15px #f94d2650;animation:offeringScan 5s ease-in-out infinite}.offering-scene-chip{position:absolute;right:18px;bottom:16px;background:#fff;border:1px solid #fff;border-radius:25px;padding:7px 12px;box-shadow:0 6px 18px #10141612;color:#505c65;font-size:7px;display:flex;gap:6px;align-items:center;animation:offeringChip 5s ease-in-out infinite}.offering-scene-chip i{font-style:normal;color:#fff;background:var(--orange);border-radius:50%;width:13px;height:13px;display:grid;place-items:center;font-size:8px}.offering-copy{padding:26px 16px 12px}.offering-copy h2{font-size:clamp(22px,2.3vw,32px);line-height:1.3;margin:0 0 17px;letter-spacing:-.055em}.offering-copy p{font-size:14px;line-height:1.75;color:#626c75;margin:0 0 20px}.offering-tags{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 25px}.offering-tags li{font-size:9px;line-height:1.4;background:#f2f4f5;border-radius:25px;padding:6px 9px;display:flex;gap:5px;align-items:center;color:#4c5861}.offering-tags i{font-style:normal;color:var(--orange)}.offering-footer{display:flex;align-items:center;justify-content:space-between;padding-top:18px;border-top:1px solid #e4e8eb;gap:15px}.offering-footer>.mono{font-size:7px;color:#89929a}.offering-explore{display:flex;align-items:center;gap:13px;border:1px solid #d9dfe4;border-radius:30px;padding:5px 5px 5px 17px;font-size:11px}.offering-explore span{height:28px;width:28px;border-radius:50%;display:grid;place-items:center;background:#f1f3f5;font-size:17px;transition:background .3s}.offering-explore:hover span{background:var(--orange)}.offering-scene:focus-visible,.offering-explore:focus-visible{outline:2px solid var(--orange);outline-offset:3px}.services-page .service-delivery{max-width:1360px;margin:85px auto 0;padding:80px 5% 95px}.service-delivery .split{gap:65px}.service-delivery .split p{font-size:15px;line-height:1.8}.service-delivery h2{font-size:clamp(28px,3vw,42px)}
@keyframes offeringFloat{0%,100%{translate:0 0}50%{translate:0 -6px}}@keyframes offeringScan{0%,100%{top:27px;opacity:0}15%,85%{opacity:.5}50%{top:92%}}@keyframes offeringChip{0%,100%{transform:translateY(3px)}50%{transform:translateY(-3px)}}
@media(max-width:900px){.service-offerings-grid{gap:18px}.offering-scene{height:280px}.offering-copy{padding:22px 10px 10px}.offering-copy h2{font-size:24px}.offering-copy p{font-size:13px}.offering-scene-label{font-size:6px;max-width:77%}.offering-scene-chip{font-size:6px;right:10px;bottom:12px}.service-delivery .split{gap:35px}}
@media(max-width:650px){.services-page .page-hero{width:calc(100% - 40px);padding:32px 24px;margin:12px auto 35px;border-radius:20px}.services-page .page-hero h1{font-size:28px}.services-page .page-hero p{font-size:13px}.service-offerings-section{padding:0 25px 30px}.service-offerings-grid{grid-template-columns:1fr;gap:22px}.service-offering:nth-child(even){transform:none}.service-offering{border-radius:23px;padding:10px}.offering-scene{height:300px;border-radius:16px}.offering-copy{padding:23px 13px 12px}.offering-copy h2{font-size:25px}.offering-tags li{font-size:8px}.services-page .service-delivery{padding:50px 25px 60px;margin-top:0}.service-delivery .split{grid-template-columns:1fr;gap:25px}.service-delivery .split p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.offering-window,.offering-scan,.offering-scene-chip{animation:none}.service-offering,.offering-explore span{transition:none}}
/* Bespoke animated vector scenes, framed without reusing project screenshots. */
.offering-scene .offering-window,.offering-2 .offering-window{inset:52px 12px 20px;border:0;border-radius:12px;box-shadow:none;background:transparent;animation:none;transform:none;overflow:hidden}
.offering-scene .offering-window-bar,.offering-scene .offering-scan,.offering-scene .offering-scene-chip{display:none}
.offering-scene .offering-window>img{width:100%;height:100%;padding:0;object-fit:contain;background:transparent}
@media(max-width:650px){.offering-scene .offering-window,.offering-2 .offering-window{inset:48px 8px 12px}}
/* Cinematic motion films with a consistent charcoal and orange palette. */
.offering-scene{background:#0c141b!important}
.offering-scene .offering-window,.offering-2 .offering-window{inset:0;border-radius:20px}
.service-film{display:block;width:100%;height:100%;object-fit:cover;background:#0c141b}
.offering-scene-label{background:#131c25dd;color:#d6e0e8;border:1px solid #ffffff20;backdrop-filter:blur(10px)}
.offering-number{background:#f94d26;color:#fff}
@media(max-width:650px){.offering-scene .offering-window,.offering-2 .offering-window{inset:0;border-radius:16px}}
