.service-studio{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;perspective:1400px}.service-scene{--scene:#63e7f3;--scene-rgb:52,205,231;--pointer-x:50%;--pointer-y:35%;--tilt-x:0deg;--tilt-y:0deg;position:relative;isolation:isolate;grid-column:span 7;border:1px solid rgba(var(--scene-rgb),.25);border-radius:22px;background:linear-gradient(145deg,rgba(var(--scene-rgb),.1),#0d111d 60%);padding:25px 28px 28px;display:flex;flex-direction:column;min-width:0;transition:transform .35s,box-shadow .35s,border-color .35s;overflow:hidden}.service-booking{grid-column:span 5;--scene:#b3a2ff;--scene-rgb:150,122,255}.service-app{grid-column:span 5;--scene:#b6a0ff;--scene-rgb:167,109,255}.service-care{--scene:#ffa4c6;--scene-rgb:250,111,171}
.service-scene::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(400px circle at var(--pointer-x) var(--pointer-y),rgba(var(--scene-rgb),.18),transparent 75%);opacity:.3;transition:opacity .3s}.service-scene:is(:hover,:focus-within){transform:translateY(-7px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));border-color:rgba(var(--scene-rgb),.8);box-shadow:0 20px 50px #0007,0 0 35px rgba(var(--scene-rgb),.13)}.service-scene:is(:hover,:focus-within)::before{opacity:1}.service-scene-head{display:flex;justify-content:space-between;align-items:center;color:var(--scene);font-size:9px;letter-spacing:1.6px}.service-scene-head>span:last-child{font-size:21px;line-height:1;letter-spacing:0}.service-visual{height:240px;position:relative;isolation:isolate;margin-top:20px;pointer-events:none;overflow:hidden}.service-copy{margin-top:5px}.service-copy h3{font-size:25px;letter-spacing:-.7px;margin:18px 0 12px}.service-copy p{font-size:14px;line-height:1.8;margin-bottom:25px;color:#b5bfd5}.service-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid rgba(var(--scene-rgb),.15);padding-top:18px}.service-bottom>span{color:#a7b2ce;font-size:10px}.service-bottom a{font-size:12px;color:#edf4ff;display:inline-flex;align-items:center;gap:12px;min-height:35px}.service-bottom a>span{color:var(--scene);font-size:20px;transition:transform .3s}.service-bottom a:is(:hover,:focus-visible)>span{transform:translate(3px,-3px)}.service-demo-note{font-size:10px;color:#96a2bd;margin-top:15px}
.mini-label{font-size:8px;letter-spacing:1.4px;color:var(--scene)}.mini-browser{position:absolute;left:7%;top:15px;width:83%;height:205px;border:1px solid #79deee55;border-radius:12px;background:linear-gradient(135deg,#142738,#0c1223);box-shadow:0 20px 35px #0006;transform:rotate(-5deg) translateY(12px);transition:transform .5s,border-color .4s}.browser-bar{height:26px;border-bottom:1px solid #ffffff12;display:flex;align-items:center;gap:4px;padding:0 12px}.browser-bar i{width:4px;height:4px;border-radius:50%;background:#647890}.browser-bar>span{font-size:6px;letter-spacing:1px;color:#92b3cd;margin-left:8px}.browser-content{padding:19px 24px;position:relative}.browser-content>strong{display:block;font-size:25px;line-height:1.13;letter-spacing:-1px;margin-top:10px;position:relative;z-index:1}.browser-content em{color:#7ee6f1;background:none}.mini-button{display:inline-block;padding:6px 12px;font-size:7px;background:#64d6e51a;border:1px solid #64d6e566;border-radius:5px;color:#b4f4fb;margin-top:12px}.design-orb{position:absolute;right:7%;top:30px;width:95px;height:95px;border-radius:30% 70% 58% 42%;background:linear-gradient(135deg,#69f3ed,#3663fd 50%,#8e43ec);box-shadow:inset -15px -10px 25px #16014f99,0 5px 30px #486bff44;transform:rotate(15deg);transition:transform .7s,border-radius .7s}.visual-note{position:absolute;right:0;bottom:4px;font-size:8px;letter-spacing:1.8px;color:#85ccde}.service-web:is(:hover,:focus-within) .mini-browser{transform:rotate(0) translateY(0);border-color:#76ecf7}.service-web:is(:hover,:focus-within) .design-orb{transform:rotate(55deg) scale(1.1);border-radius:50% 30% 40% 60%}
.booking-ticket{position:absolute;top:13px;left:7%;width:85%;padding:20px;border:1px solid #bea8ff55;border-radius:14px;background:linear-gradient(140deg,#30254e,#141329);box-shadow:0 15px 30px #0005;transform:rotate(4deg);transition:transform .5s}.booking-ticket>strong{display:block;font-size:22px;line-height:1.2;letter-spacing:-.6px;margin-top:12px}.ticket-days{display:flex;justify-content:space-between;gap:3px;margin-top:20px;font-size:8px;color:#b8b2d5;align-items:center}.ticket-days>*{display:grid;place-items:center;min-width:20px;height:25px}.ticket-days b{background:#9e7bff;color:#fff;border-radius:6px;box-shadow:0 0 20px #9674ff66;transition:transform .4s,background .4s}.ticket-action{font-size:8px;border-top:1px dashed #b59cf955;padding-top:14px;margin-top:15px;color:#e0d6ff;display:flex;justify-content:space-between}.ticket-action>span{font-size:16px}.floating-symbol{position:absolute;right:0;top:0;font-size:55px;color:#b8a2ff;text-shadow:0 0 30px #aa7eff77;transform:rotate(15deg);transition:transform .6s}.service-booking:is(:hover,:focus-within) .booking-ticket{transform:rotate(0) translateY(-5px)}.service-booking:is(:hover,:focus-within) .ticket-days b{transform:translateY(-4px) scale(1.1);background:#b99dff}.service-booking:is(:hover,:focus-within) .floating-symbol{transform:rotate(105deg) scale(1.12)}
.code-window{position:absolute;top:22px;left:0;width:87%;border:1px solid #9f7ee044;border-radius:12px;background:linear-gradient(135deg,#281c3e,#111524);padding:20px 14px;transform:rotate(-4deg);transition:transform .5s}.code-window code{font-size:10px;line-height:2;display:block;color:#b3b6ce;margin-top:14px}.code-window code span{color:#bba6ff}.code-window code b{color:#6bdfda;font-weight:400}.mini-phone{position:absolute;right:3%;top:20px;width:112px;height:202px;border:2px solid #b8a3e38c;background:linear-gradient(150deg,#2b2547,#11182d);border-radius:23px;padding:27px 12px 12px;box-shadow:0 15px 30px #0007;transform:rotate(10deg) translateY(10px);transition:transform .55s,box-shadow .55s}.phone-notch{position:absolute;top:6px;left:36px;width:36px;height:7px;border-radius:10px;background:#080b15}.mini-phone>span{font-size:6px;color:#acb0cd;letter-spacing:1px}.mini-phone>strong{font-size:15px;display:block;letter-spacing:-.5px;margin-top:2px}.phone-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:16px}.phone-grid i{height:32px;display:grid;place-items:center;border:1px solid #ab8bff44;border-radius:7px;background:#8573ed22;font-size:15px;font-style:normal;color:#c8b7ff;transition:background .4s}.phone-line{width:30px;height:3px;background:#aaa0ce;border-radius:10px;position:absolute;bottom:8px;left:39px}.service-app:is(:hover,:focus-within) .mini-phone{transform:rotate(0) translateY(-4px);box-shadow:0 20px 40px #7249c133}.service-app:is(:hover,:focus-within) .code-window{transform:rotate(-7deg) translateX(-3px)}.service-app:is(:hover,:focus-within) .phone-grid i{background:#8573ed44}
.care-grid{position:absolute;inset:0;background-image:linear-gradient(#c77bea0d 1px,transparent 1px),linear-gradient(90deg,#c77bea0d 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(ellipse,#000,transparent 75%)}.care-core{position:absolute;top:55px;left:calc(50% - 57px);width:114px;height:114px;border-radius:32px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#49304e,#21192d);border:1px solid #f2a9d277;transform:rotate(-7deg);box-shadow:0 0 45px #ed70bd18,inset 0 0 20px #e688dc11;transition:transform .6s,box-shadow .6s}.care-core>span{font-weight:800;font-style:italic;font-size:39px;letter-spacing:-5px;padding-right:5px;background:linear-gradient(130deg,#7debff,#b598ff,#ffafc9);background-clip:text;color:transparent}.care-core small{font-size:6px;letter-spacing:1px;color:#dbb6d4}.care-node{position:absolute;padding:8px 12px;border:1px solid #e8a7d644;border-radius:9px;background:#20182bcc;font-size:17px;color:#f4bad9;display:flex;align-items:center;gap:8px;transition:transform .5s,border-color .5s}.care-node span{font-size:9px;color:#d8c4df}.node-one{left:8%;top:24px;transform:rotate(-5deg)}.node-two{right:5%;top:46px;transform:rotate(6deg)}.node-three{right:11%;bottom:26px;transform:rotate(-4deg)}.care-caption{position:absolute;left:4%;bottom:7px;color:#b59bb5;font-size:7px;letter-spacing:1.5px}.service-care:is(:hover,:focus-within) .care-core{transform:rotate(0) scale(1.08);box-shadow:0 0 55px #ef8abd33}.service-care:is(:hover,:focus-within) .node-one{transform:translate(-4px,-4px)}.service-care:is(:hover,:focus-within) .node-two{transform:translate(5px,-4px)}.service-care:is(:hover,:focus-within) .node-three{transform:translate(5px,4px)}.service-care:is(:hover,:focus-within) .care-node{border-color:#f2abd3aa}
.a11y-motion .service-scene,.a11y-motion .service-visual *,.a11y-motion .service-bottom a>span{transform:none!important}.a11y-contrast .service-scene{background:#000;border-color:#fff}.a11y-contrast .service-scene::before{display:none}.a11y-contrast .service-copy p,.a11y-contrast .service-bottom>span{color:#fff}.a11y-contrast .service-scene-head{color:#ffec72}.a11y-contrast .service-visual{opacity:.8}
@media(max-width:1000px){.service-scene{grid-column:span 6;padding:22px}.design-orb{width:75px;height:75px;right:2%}.browser-content>strong{font-size:22px}.mini-phone{right:0}.care-node{padding:7px 9px}.node-one{left:0}.node-two{right:0}.node-three{right:0}.care-core{left:calc(50% - 57px)}}
@media(max-width:650px){.service-studio{grid-template-columns:1fr;gap:22px}.service-scene{grid-column:1;padding:22px}.service-visual{height:230px}.service-copy h3{font-size:24px}.service-bottom{gap:12px}.service-bottom>span{font-size:9px}.browser-content{padding:20px}.design-orb{right:5%;width:80px;height:80px}.mini-browser{left:3%;width:93%}.booking-ticket{left:3%;width:93%}.code-window{width:88%}.service-scene-head{font-size:8px;letter-spacing:1.1px}}
@media(max-width:360px){.service-scene{padding:19px}.browser-content>strong{font-size:20px}.design-orb{width:62px;height:62px;right:0;top:45px}.mini-label{font-size:7px;letter-spacing:1px}.booking-ticket>strong{font-size:21px}.mini-phone{width:99px}.code-window code{font-size:8px}.phone-notch{left:29px}.phone-line{left:32px}.care-node span{font-size:8px}.care-core{width:95px;height:95px;left:calc(50% - 47px);top:65px}.node-one{top:21px}.node-two{top:60px}.care-caption{font-size:6px}}
@media(hover:none){.service-scene:is(:hover,:focus-within){transform:none}}
@media(prefers-reduced-motion:reduce){.service-scene,.service-visual *,.service-bottom a>span{transition:none!important}.service-scene:is(:hover,:focus-within){transform:none}.service-visual *{transform:none!important}}