/* One material system for the six services; loaded after the legacy theme. */
.mockup-open{width:100%;cursor:zoom-in;padding:0;font:inherit;color:inherit}
.mockup-open:focus-visible{outline:3px solid #9ecbff;outline-offset:3px}
.mockup-lightbox{box-sizing:border-box;position:fixed;inset:0;margin:auto;width:min(96vw,1440px);height:92dvh;max-width:96vw;max-height:92dvh;padding:16px 20px;border:1px solid #ffffff40;border-radius:20px;background:#151c25;color:#f5f7fa;box-shadow:0 28px 100px #0009;overflow:hidden}
.mockup-lightbox[open]{display:flex;flex-direction:column;gap:14px}
.mockup-lightbox::backdrop{background:#030609e8;backdrop-filter:blur(12px)}
.mockup-lightbox header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0}
.mockup-lightbox header strong{font-size:1rem;font-weight:500;min-width:0}
.mockup-lightbox header button{flex-shrink:0;min-height:44px;padding:10px 18px;border:1px solid #ffffff40;border-radius:999px;background:#ffffff17;color:#fff;cursor:pointer;font:inherit}
.mockup-lightbox header button:focus-visible{outline:2px solid #a5ceff;outline-offset:3px}
.mockup-lightbox>img{display:block;flex:1;min-height:0;width:100%;height:0;object-fit:contain}
.mockup-lightbox>p{flex-shrink:0;margin:0;text-align:center;color:#aab7c8;font-size:.75rem}
@media(max-width:600px){.mockup-lightbox{padding:12px;gap:12px}.mockup-lightbox header strong{font-size:.85rem}.mockup-lightbox header button{padding:8px 12px;font-size:.85rem}.mockup-lightbox>p{font-size:.65rem}}
#business-studio{background:radial-gradient(ellipse at 50% 80%,#444f5b44,transparent 62%),linear-gradient(160deg,#101318,#07090d 75%);position:relative;isolation:isolate}
#business-studio .studio-kicker{color:#aab6c5;letter-spacing:.19em}
#business-studio .studio-heading h2{font-weight:600;letter-spacing:-.035em;color:#f5f6f8}
#business-studio .studio-heading>p:last-child{color:#a8b0bc}
#business-studio .service-tabs{gap:7px}
#business-studio .service-tabs button{background:#ffffff05;border:1px solid #ffffff14;color:#b8c0cb;box-shadow:none;font-weight:500}
#business-studio .service-tabs button[aria-selected=true]{color:#fff;background:linear-gradient(160deg,#ffffff24,#ffffff0b);border-color:#ffffff46;box-shadow:inset 0 1px #ffffff35,0 4px 16px #0003}
#business-studio .service-tabs button span{color:#a6afbc}
#business-studio .service-panels::before{content:'';position:absolute;inset:12% 3% -7%;background:radial-gradient(ellipse at 44% 46%,#9eb9ce2b,transparent 61%);filter:blur(24px);pointer-events:none}
#business-studio .service-panel,#business-studio .service-panel[hidden]{
 --glass-tint:145,168,188;--light-x:28%;--light-y:15%;
 background:radial-gradient(ellipse at var(--light-x) var(--light-y),rgba(var(--glass-tint),.18),transparent 65%),linear-gradient(148deg,#a9b8c32b 0%,#303940d9 38%,#171d24e8 75%,#8193a330 100%)!important;
 color:#f6f7f9;border:1px solid #d9e4f13d;border-top-color:#edf6ff8a;border-bottom-color:#d7e6f973;border-radius:30px;
 -webkit-backdrop-filter:blur(22px) saturate(115%);backdrop-filter:blur(22px) saturate(115%);
 box-shadow:inset 0 1px 1px #fff5,inset 0 -1px 2px #e1edff3d,inset 1px 0 1px #fff1,0 25px 70px #0006;
 transition:transform 540ms cubic-bezier(.22,1,.36,1),box-shadow 450ms ease,opacity 350ms ease!important;
}
#business-studio .service-panel:nth-child(2){--glass-tint:174,164,152}
#business-studio .service-panel:nth-child(3){--glass-tint:155,163,184}
#business-studio .service-panel:nth-child(4){--glass-tint:160,150,184}
#business-studio .service-panel:nth-child(5){--glass-tint:176,160,150}
#business-studio .service-panel:nth-child(6){--glass-tint:141,176,168}
#business-studio .service-panel::before{content:'';position:absolute;inset:0;width:auto;height:auto;aspect-ratio:auto;z-index:-1;border:0;border-radius:inherit;opacity:1;box-shadow:none;background:radial-gradient(ellipse 65% 8% at var(--light-x) 0%,#f0f7ff8c,transparent 95%),radial-gradient(ellipse 65% 5% at calc(100% - var(--light-x)) 100%,#d0e4ff70,transparent 95%),linear-gradient(120deg,#fff0 32%,#ffffff09 45%,#fff0 57%);pointer-events:none}
#business-studio .service-panel::after{content:'';position:absolute;inset:8px;border-radius:23px;border:1px solid #ffffff09;pointer-events:none;z-index:-1}
#business-studio .service-panel.deck-pos-0{box-shadow:inset 0 1px 1px #fff7,inset 0 -1px 3px #dfedff55,0 35px 80px #0008,0 0 42px #b5c6d20a}
#business-studio .service-panel .panel-code{color:#b6c2d1!important;font-size:.66rem;letter-spacing:.16em;font-weight:500}
#business-studio .service-panel .panel-intro h3{font-size:clamp(1.8rem,3.5vw,3rem);font-weight:600;line-height:1.2;letter-spacing:-.035em;margin-top:18px}
#business-studio .service-panel .panel-intro p{color:#c2cad4!important;font-size:.95rem;line-height:1.75;max-width:28em}
#business-studio .card-at-a-glance__label{color:#a5b0bf;font-size:.65rem;letter-spacing:.18em;font-weight:500}
#business-studio .card-at-a-glance__items span{background:#ffffff07;border:1px solid #ffffff21;border-radius:9px;color:#d4dce6!important;font-weight:400;box-shadow:inset 0 1px #ffffff0b}
#business-studio .card-detail-trigger{background:linear-gradient(150deg,#ffffff22,#ffffff09);border:1px solid #ffffff3d;color:#fff;border-radius:14px;box-shadow:inset 0 1px #ffffff24;font-weight:500}
#business-studio .card-detail-trigger:hover{background:linear-gradient(150deg,#ffffff32,#ffffff14);box-shadow:inset 0 1px #ffffff40,0 8px 28px #0003;transform:translateY(-2px)}
#business-studio .deck-controls{gap:18px}
#business-studio .deck-controls button{background:linear-gradient(160deg,#ffffff18,#ffffff06);color:#e1e6ee;border:1px solid #ffffff25;border-radius:999px;box-shadow:inset 0 1px #ffffff12;min-height:44px}
#business-studio .deck-count{color:#aeb9c8;font-variant-numeric:tabular-nums;font-weight:400}
.card-detail-dialog[class*="detail-tone-"]{background:transparent!important;color:#f4f6f9!important;border:0;box-shadow:none;border-radius:0}
.card-detail-dialog[class*="detail-tone-"] .card-detail-frame{background:linear-gradient(155deg,#333c46ee,#141a22f5);color:#f4f6f9;border:1px solid #dceaff40;box-shadow:inset 0 1px #ffffff60,inset 0 -1px #ffffff30,0 40px 120px #0009;backdrop-filter:blur(28px)}
.card-detail-dialog::backdrop{background:#05080dc4;backdrop-filter:blur(12px)}
.card-detail-dialog .card-detail-heading{border-bottom:1px solid #ffffff17}
.card-detail-dialog .card-detail-heading strong,.card-detail-dialog .banner-copy h3{color:#f5f7fb!important;font-weight:550}
.card-detail-dialog .banner-copy p{color:#c3cdd9!important}
.card-detail-dialog .card-detail-heading span,.card-detail-dialog .card-detail-heading small,.card-detail-dialog .banner-eyebrow{color:#b5c1d1!important}
.card-detail-dialog .detail-close,.card-detail-dialog .card-detail-pager button{background:#ffffff0b;color:#e8edf4;border-color:#ffffff24}
.card-detail-dialog .card-detail-pager{border-top:1px solid #ffffff17}
.card-detail-dialog .card-detail-page.creator-mockup-slide{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);align-content:stretch;gap:18px;padding:22px 32px;min-height:0}
.card-detail-dialog .creator-mockup-slide .banner-copy h3{font-size:clamp(1.3rem,2.5vw,2rem);margin:0 0 8px}
.card-detail-dialog .creator-mockup-slide .banner-eyebrow{font-size:.65rem;margin:0 0 8px}
.card-detail-dialog .creator-mockup-slide .banner-copy p{font-size:.9rem;line-height:1.6;max-width:70em}
.card-detail-dialog .creator-mockup-slide .banner-visual{min-height:0;height:100%;max-height:none;gap:8px}
.card-detail-dialog .creator-mockup-slide .banner-visual .mockup-open{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;background:#f8f7f1;border:1px solid #fff3;border-radius:12px;box-shadow:0 12px 30px #0003;padding:8px}
.card-detail-dialog .creator-mockup-slide .banner-visual img{display:block;width:100%;height:100%;max-height:100%;object-fit:contain}
.card-detail-dialog .mockup-caption{flex-shrink:0;color:#a6b4c5;font-size:.65rem}
.live-role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;width:100%}
.card-detail-dialog .live-role-slide::after{display:none}
.live-role-grid article{padding:24px;border:1px solid #ffffff30;border-radius:20px;background:linear-gradient(145deg,#ffffff17,#ffffff03);box-shadow:inset 0 1px #ffffff29}
.live-role-grid b{display:block;color:#aabacc;font-size:.7rem;letter-spacing:.12em;margin-bottom:28px}
.live-role-grid h4{color:#fff;font-size:1.7rem;margin-bottom:14px}.live-role-grid p{color:#bdc8d6;font-size:.9rem;line-height:1.8;margin:0}
@media(max-width:767px){
 #business-studio .service-panel,#business-studio .service-panel[hidden]{border-radius:23px;padding:23px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
 #business-studio .service-panel .panel-intro h3{font-size:1.75rem;margin-top:14px}
 #business-studio .service-panel .panel-intro p{font-size:.85rem;line-height:1.65}
 #business-studio .service-panel .panel-code{font-size:.55rem;letter-spacing:.1em}
 #business-studio .deck-controls{gap:14px}
 .card-detail-dialog .card-detail-page.creator-mockup-slide{padding:18px 16px;gap:14px}
 .card-detail-dialog .creator-mockup-slide .banner-copy p{font-size:.8rem;line-height:1.6}
 .card-detail-dialog .creator-mockup-slide .banner-visual .mockup-open{padding:4px}
 .card-detail-dialog .mockup-caption{font-size:.58rem}
 .live-role-grid{gap:8px}.live-role-grid article{padding:14px 10px;border-radius:12px}.live-role-grid h4{font-size:1.2rem}.live-role-grid p{font-size:.75rem}
}
@media(max-height:600px){
 #business-studio .service-panel .panel-intro h3{font-size:1.5rem;margin-top:10px}
 #business-studio .service-panel .panel-intro p{font-size:.8rem}
 .card-detail-dialog .card-detail-page.creator-mockup-slide{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:minmax(0,1fr);padding:12px 18px;gap:16px}
 .card-detail-dialog .creator-mockup-slide .banner-copy h3{font-size:1.2rem}
 .card-detail-dialog .creator-mockup-slide .banner-copy p{font-size:.75rem;line-height:1.5}
}
@supports not (backdrop-filter:blur(1px)){#business-studio .service-panel{background:linear-gradient(145deg,#424d58,#1b222b)!important}}
@media(prefers-reduced-motion:reduce){#business-studio .service-panel,#business-studio .service-panel[hidden]{transition:none!important}}
/* Pastel glass: tinted material, with an opaque-enough base for legibility. */
#business-studio .service-panel,#business-studio .service-panel[hidden]{--pastel:255,202,188;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#ffffff6b,transparent 62%),linear-gradient(145deg,rgba(var(--pastel),.94),rgba(var(--pastel),.76) 65%,#ffffff8a)!important;color:#182b3b;backdrop-filter:none;-webkit-backdrop-filter:none;border-color:#ffffff70;border-top-color:#ffffffe0;border-bottom-color:#ffffffb3;transition:transform 420ms cubic-bezier(.2,.8,.2,1),opacity 260ms ease!important}
#business-studio .service-panel:nth-child(2){--pastel:255,232,156}
#business-studio .service-panel:nth-child(3){--pastel:246,186,215}
#business-studio .service-panel:nth-child(4){--pastel:211,196,251}
#business-studio .service-panel:nth-child(5){--pastel:173,217,250}
#business-studio .service-panel:nth-child(6){--pastel:174,232,205}
#business-studio .service-panel.deck-pos-0{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#business-studio .service-panel .panel-intro h3{color:#172b3b!important}
#business-studio .service-panel .panel-intro p{color:#34495a!important}
#business-studio .service-panel .panel-code,#business-studio .card-at-a-glance__label{color:#435769!important}
#business-studio .card-at-a-glance__items span{background:#ffffff33;border-color:#ffffff88;color:#293f50!important}
#business-studio .card-detail-trigger{background:linear-gradient(150deg,#ffffff80,#ffffff38);color:#192f41;border-color:#ffffffb3;box-shadow:inset 0 1px #fff8}
#business-studio .card-detail-trigger:hover{background:#ffffff99;color:#102637}
#business-studio .service-panel::before{background:radial-gradient(ellipse 65% 8% at var(--light-x) 0%,#fff,transparent 95%),radial-gradient(ellipse 65% 6% at calc(100% - var(--light-x)) 100%,#ffffffb0,transparent 95%),linear-gradient(120deg,#fff0 32%,#ffffff12 45%,#fff0 57%)}
.experience-ready .experience-chapter{scroll-snap-stop:normal}
html[lang=en] #business-studio .panel-intro h3{font-size:clamp(1.65rem,3vw,2.8rem)}
html[lang=ja] #business-studio .panel-intro h3{font-size:clamp(1.55rem,2.7vw,2.6rem)}
@media(max-width:767px){html[lang=en] #business-studio .panel-intro h3,html[lang=ja] #business-studio .panel-intro h3{font-size:1.55rem}#business-studio .card-at-a-glance__items span{font-size:.72rem}.live-role-grid b{font-size:.55rem}.live-role-grid h4{font-size:1rem}}
@media(prefers-reduced-motion:reduce){#business-studio .service-panel,#business-studio .service-panel[hidden]{transition:none!important}}
/* Avoid competing entry and deck transforms during rapid selection. */
#business-studio .service-panel.is-entering{animation:none}
/* A slow showroom turn, independent of page scrolling. */
#business-studio .service-panels.motion-enabled{perspective:1400px;animation:glass-showroom 14s ease-in-out infinite}
#business-studio .service-panels.motion-resting{animation-play-state:paused}
@keyframes glass-showroom{0%,100%{rotate:y -2deg}50%{rotate:y 3deg}}
#business-studio .auto-turning .service-panel{transition:transform 1400ms cubic-bezier(.2,.7,.2,1),opacity 800ms ease!important}
#business-studio .deck-controls .deck-autoplay,#business-studio .deck-controls .deck-sound{width:44px;padding:0;flex-shrink:0;font-size:1rem}
#business-studio .deck-controls .deck-sound[aria-pressed=false]{opacity:.65}
@media(hover:hover) and (pointer:fine){
 #business-studio .service-panel.deck-pos-0:hover{transform:translateX(-50%) perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-10px) scale(1.035);box-shadow:inset 0 2px 2px #fff,inset 0 -2px 5px #fff9,0 40px 85px #0009,0 0 50px rgba(var(--pastel),.25)}
 #business-studio .service-panel.deck-pos-0:hover::before{filter:brightness(1.35)}
 #business-studio .service-tabs button:hover,.deck-controls button:hover{translate:0 -3px;box-shadow:inset 0 1px #ffffff80,0 8px 22px #8ebaff25}
 .btn:hover,.assistant-contact:hover{filter:brightness(1.15);box-shadow:0 10px 34px #69e7d547}
}
@media(max-width:767px){#business-studio .deck-controls{gap:8px}#business-studio .deck-controls button{padding:10px 12px;font-size:.75rem}#business-studio .deck-count{min-width:32px;font-size:.8rem}#business-studio .deck-controls .deck-autoplay,#business-studio .deck-controls .deck-sound{width:38px;min-height:44px}}
@media(prefers-reduced-motion:reduce){#business-studio .service-panels.motion-enabled{animation:none}#business-studio .service-panel.deck-pos-0:hover{transform:translateX(-50%)}#business-studio .auto-turning .service-panel{transition:none!important}}
.card-detail-dialog .service-video-slide{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-rows:minmax(0,1fr);align-content:stretch;gap:24px;padding:24px 32px}
.card-detail-dialog .service-video-slide::after{display:none}
.service-video-slide video{display:block;width:100%;height:100%;min-height:0;max-height:100%;object-fit:contain;border-radius:16px;background:#06090e;box-shadow:0 16px 40px #0004}
.card-detail-dialog .service-video-slide .banner-copy h3{font-size:clamp(1.5rem,3vw,2.6rem)}
.card-detail-dialog .service-video-slide .banner-copy p{font-size:.95rem;line-height:1.7}
.experience-ready .service-block img.service-reference-image{object-fit:contain!important;padding:18px;background:#f7f6f0;border-radius:22px;width:100%;height:auto;max-height:48svh;min-height:0}
@media(max-width:767px){.card-detail-dialog .service-video-slide{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);padding:16px;gap:12px}.card-detail-dialog .service-video-slide .banner-copy h3{font-size:1.3rem;margin-bottom:8px}.card-detail-dialog .service-video-slide .banner-copy p{font-size:.78rem;line-height:1.5}.card-detail-dialog .service-video-slide .banner-eyebrow{margin-bottom:8px}.experience-ready .service-block img.service-reference-image{height:auto;max-height:36svh;padding:10px}}
@media(max-height:520px){.card-detail-dialog .service-video-slide{grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr);padding:12px;gap:16px}.card-detail-dialog .service-video-slide .banner-copy h3{font-size:1.2rem}.card-detail-dialog .service-video-slide .banner-copy p{font-size:.75rem}}
/* Silver display plinth: tint the original light mockup canvas without cropping it. */
#services .service-image-stage{grid-column:1;grid-row:1 / 4;align-self:center;position:relative;isolation:isolate;overflow:hidden;width:100%;padding:20px;border:1px solid #e7f0fa65;border-radius:24px;background:radial-gradient(ellipse at 32% 12%,#d7dee4 0%,#b7c3cd 44%,#899ba9 100%);box-shadow:inset 0 1px 2px #ffffffc4,inset 0 -1px 2px #66798880,0 20px 50px #0004}
#services article:nth-of-type(even) .service-image-stage{grid-column:2}
.experience-ready #services .service-image-stage img.service-reference-image{display:block;background:transparent;mix-blend-mode:multiply;filter:saturate(.85) contrast(1.02);padding:0;border-radius:8px;height:auto;max-height:44svh;min-height:0;margin:0;object-fit:contain!important}
#services .service-image-stage::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px #fff9,inset 0 -1px #ffffff50;pointer-events:none}
@media(max-width:980px){#services .service-image-stage{order:-1;margin-bottom:26px;padding:16px;border-radius:22px}.experience-ready #services .service-image-stage img.service-reference-image{max-height:34svh;margin:0}}
/* Touch-first navigation: swipe the cards and banners; vertical page scroll stays native. */
.touch-swipe-hint{display:none}
.service-panels.is-swiping{animation-play-state:paused!important}
.service-panels.is-swiping .service-panel{will-change:translate}
@media(max-width:767px),(hover:none) and (pointer:coarse){
 #business-studio .deck-prev,#business-studio .deck-next-button,.card-detail-prev,.card-detail-next{display:none!important}
 .touch-swipe-hint{display:inline-block;font-size:.72rem;color:#aebac6;letter-spacing:.02em}
 #business-studio .deck-controls{gap:12px;flex-wrap:wrap}
 .card-detail-pager{flex-wrap:wrap;gap:12px}
 .card-detail-pager .touch-swipe-hint{color:#516170}
 .service-panels,.card-detail-viewport{touch-action:pan-y pinch-zoom}
 .assistant-hint{display:block!important;font-size:.78rem}
}
