@charset "UTF-8";
/* Top-page presentation. Shared typography and SERVICE stay in their own files. */
.home-page { font-size:16px; line-height:1.95; }
.home-page [id] { scroll-margin-top:calc(var(--header-h) + var(--linkc-admin-bar-h,0px) + 20px); }
.home-page .wrap { width:min(1140px,calc(100% - 80px)); }
.home-page h2,.home-page h3 { text-wrap:balance; }
.home-page .section { padding:80px 0; }
.home-page .sec-head { margin-bottom:36px; }
.home-page .sec-head::after { display:none; }
.home-page .sec-head-rule { border:0; padding:0; }
.home-page .sec-head-en { font-size:13px; letter-spacing:.14em; font-weight:500; color:#7d6746; }
.home-page .sec-head-ja { margin-top:12px; font-size:clamp(26px,2.4vw,34px); line-height:1.6; color:var(--ink-900); letter-spacing:.025em; }
.home-page .sec-head-lead { margin-top:18px; max-width:760px; font-size:16px; line-height:1.95; }
.home-page .sec-action { margin-top:28px; text-align:right; }
.home-page .btn-line { min-height:44px; padding:9px 0; border:0; border-bottom:1px solid #8d99ab; background:none; box-shadow:none; color:var(--ink-900); font-size:14px; }
.home-page .btn-line:hover { background:none; color:var(--ink-700); transform:none; }
.home-text-link { display:inline-flex; align-items:center; gap:22px; min-height:44px; padding:8px 0; border-bottom:1px solid #a4aebd; font-size:14px; font-weight:500; color:var(--ink-900); }
.home-text-link:hover { border-color:var(--ink-900); }
.home-page a:focus-visible,.home-page button:focus-visible { outline:3px solid var(--gold); outline-offset:5px; }
/* Keep the product montage and message in proportion, including tall windows. */
.home-page .tp-hero[data-hero="layered"] { min-height:max(820px,100svh); padding-bottom:48px; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-inner { grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); }
.home-page .tp-hero[data-hero="layered"] .tp-hero-copy { padding-left:clamp(32px,5vw,90px); padding-right:16px; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-ja { font-size:clamp(42px,4.2vw,66px); line-height:1.35; letter-spacing:.035em; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-lead { font-size:clamp(17px,1.35vw,20px); line-height:1.95; font-weight:500; letter-spacing:0; margin-top:26px; max-width:500px; }
.home-hero-mobile-break { display:none; }
.home-page .tp-hero-description { margin-top:14px; max-width:470px; font-size:15px; line-height:1.9; }
.home-hero-service-name { display:inline-block; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-points { display:flex; width:auto; gap:22px; margin-top:27px; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-point-icon { flex-direction:row; border:0; width:auto; height:auto; aspect-ratio:auto; gap:7px; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-points b { font-size:13px; font-weight:500; letter-spacing:0; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-point-icon svg { width:22px; height:22px; }
.home-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px 24px; margin-top:30px; }
.home-page .tp-hero[data-hero="layered"] .btn { margin:0; padding:15px 24px; font-size:15px; line-height:1.7; }
.home-page .tp-hero[data-hero="layered"] .tp-hero-media { min-height:620px; }
.home-page .tp-layered-cards { left:-1%; top:13%; width:74%; }
.home-page .tp-hero[data-hero="layered"] .tp-cardx { width:32.5%; max-width:170px; }
/* Hide the print preview's white margin inside the existing rounded card surface. */
.home-page .tp-hero[data-hero="layered"] .tp-cardx img[data-fit="rounded-inset"] { transform:scale(1.075); }
.home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="0"] { left:21%; top:31%; }
.home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="1"] { left:43%; top:17%; width:42%; max-width:200px; }
.home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="2"] { left:0; top:42%; }
.home-page .tp-layered-phone { right:3%; width:44%; }
.home-page .tp-layered-phone-inner { width:min(94%,270px); }
.home-page .tp-layered-dots { display:none; }
/* The four images are a quick overview before the interactive scene. */
.home-page .tp-flow { margin-top:0; padding:42px 0 52px; background:white; }
.home-page .tp-flow-panel { gap:24px; background:none; border:0; border-radius:0; box-shadow:none; overflow:visible; }
.home-page .tp-flow-item { padding:0; }
.home-page .tp-flow-media { aspect-ratio:1.8; border-radius:4px; }
.home-page .tp-flow-copy { padding:16px 0 0; }
.home-page .tp-flow-num { display:inline; margin-right:10px; font-size:14px; }
.home-page .tp-flow-copy b { display:inline; font-size:16px; letter-spacing:0; }
.home-page .tp-flow-copy p { margin-top:8px; font-size:14px; line-height:1.8; }
/* Light product demonstration with a clearly selected step. */
.home-demo { --demo-card-width:170px; --demo-card-x:0px; --demo-card-y:0px; --demo-card-angle:-9deg; --demo-notice:0; --demo-open:0; --demo-track:0; height:280svh; background:#f4f7fa; color:#192942; }
.home-demo__sticky { position:sticky; top:calc(var(--header-h) + var(--linkc-admin-bar-h,0px)); height:calc(100svh - var(--header-h) - var(--linkc-admin-bar-h,0px)); display:flex; align-items:center; overflow:hidden; background:radial-gradient(ellipse at 78% 38%,#dce8f080,transparent 64%),linear-gradient(115deg,#fcfbf8,#f1f5f8 72%,#e9eff4); }
.home-demo__inner { position:relative; display:grid; grid-template-columns:.86fr 1.14fr; align-items:center; gap:5%; width:min(1200px,calc(100% - 80px)); height:100%; max-height:840px; margin:auto; padding:38px 0; }
.home-demo__copy { position:relative; z-index:2; }
.home-demo__copy h2 { color:#192942; font-weight:700; line-height:1.3; letter-spacing:.025em; }
.home-demo__title-en { display:block; font-family:"Roboto Condensed",sans-serif; font-size:clamp(34px,3.6vw,52px); letter-spacing:.035em; }
.home-demo__title-ja { display:block; margin-top:12px; font-size:clamp(20px,1.8vw,25px); line-height:1.6; }
.home-demo__lead { margin-top:24px; color:#526276; font-size:17px; line-height:1.95; }
.home-demo__overview { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:100%; max-width:460px; margin:32px 0 0; padding:0; list-style:none; }
.home-demo__overview li { position:relative; min-width:0; }
.home-demo__overview li:not(:last-child)::after { content:""; position:absolute; top:30px; left:calc(50% + 35px); width:calc(100% - 70px); height:1px; background:#bbc8d6; }
.home-demo__overview button { position:relative; display:flex; flex-direction:column; align-items:center; gap:13px; width:100%; padding:5px 0 13px; border:0; background:transparent; color:#65758a; font-family:inherit; cursor:pointer; }
.home-demo__phase-icon { display:grid; place-items:center; width:52px; height:52px; border:1px solid #cbd5df; border-radius:50%; background:#ffffffb3; transition:background .2s,color .2s,box-shadow .2s; }
.home-demo__overview svg { display:block; width:30px; height:30px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.home-demo__overview button>span:last-child { font-size:14px; line-height:1.7; font-weight:500; white-space:nowrap; }
.home-demo__overview button:hover .home-demo__phase-icon { border-color:#7b8fa8; color:#192942; }
.home-demo__overview button[aria-current="step"] { color:#192942; }
.home-demo__overview button[aria-current="step"] .home-demo__phase-icon { color:#fff; border-color:#1e3554; background:#1e3554; box-shadow:0 0 0 4px #c6a36450,0 5px 14px #243d5d20; }
.home-demo__overview button[aria-current="step"]>span:last-child { font-weight:700; }
.home-demo__overview button[aria-current="step"]::after { content:""; position:absolute; bottom:0; left:calc(50% - 12px); width:24px; height:3px; border-radius:2px; background:#9b7740; }
.home-demo__current { display:flex; align-items:center; gap:14px; min-height:62px; margin-top:14px; border-top:1px solid #ced7df; color:#243a55; }
.home-demo__step { flex:none; font:500 13px/1.5 "Roboto Condensed",sans-serif; letter-spacing:.06em; }
.home-demo__step b { margin-left:4px; font-size:20px; }
.home-demo__step>span { color:#68788b; }
.home-demo__current p { font-size:15px; line-height:1.7; font-weight:500; }
.home-demo__visual { position:relative; height:min(650px,calc(100svh - var(--header-h) - var(--linkc-admin-bar-h,0px) - 90px)); min-height:410px; isolation:isolate; }
.home-demo__stage { position:relative; width:100%; height:calc(100% - 96px); }
.home-demo__scene-note { position:absolute; left:0; right:0; top:calc(100% + 18px); text-align:center; white-space:nowrap; }
.home-demo__scene-note button { min-height:36px; margin-top:5px; padding:6px 10px; border:0; background:transparent; color:#314c6c; font-family:inherit; font-size:13px; text-decoration:underline; text-decoration-color:#8194a9; text-underline-offset:5px; cursor:pointer; }
.home-demo__scene-note button:hover { color:#15283f; text-decoration-color:#15283f; }
.home-demo__visual::before { content:""; position:absolute; inset:0 -10% 0 -15%; z-index:-1; background:radial-gradient(ellipse 43% 45% at 52% 50%,#a0b9cb26,transparent); }
.home-demo__card { position:absolute; width:var(--demo-card-width); aspect-ratio:54/85.6; margin:0; left:0; top:0; border-radius:6px; overflow:hidden; box-shadow:0 16px 28px #22364e26,0 0 0 1px #ffffff70; transform:translate(var(--demo-card-x),var(--demo-card-y)) rotate(var(--demo-card-angle)); }
.home-demo__card img { width:100%; height:100%; object-fit:cover; }
.home-demo__phone { position:absolute; z-index:1; left:50%; top:14%; height:82%; aspect-ratio:9/19.5; transform:translateX(-40%); padding:5px; background:#1a2029; border:1px solid #788493; border-radius:35px; box-shadow:14px 25px 45px #233a522e,inset 0 0 0 1px #000; container-type:inline-size; }
.home-demo__screen { position:relative; width:100%; height:100%; background:#bdcad6; border-radius:29px; overflow:hidden; }
.home-demo__island { position:absolute; z-index:5; width:35%; height:5%; top:2%; left:32.5%; background:#090b0f; border-radius:20px; }
.home-demo__lock { position:absolute; inset:0; background:radial-gradient(ellipse 115% 66% at 8% 60%,#e8edf2 43%,transparent 43.5%),radial-gradient(ellipse 110% 55% at 95% 100%,#a8b9c9 54%,transparent 54.5%),linear-gradient(135deg,#dbe3ea,#97aabd); opacity:calc(1 - var(--demo-open)); }
.home-demo__status { display:flex; justify-content:space-between; padding:5.5% 7%; color:#213244; font:600 10px/1 Arial,sans-serif; }
.home-demo__notice { position:absolute; z-index:3; top:11%; left:4%; width:92%; padding:12px 9px; display:flex; align-items:center; gap:7px; border:1px solid #ffffffa6; border-radius:12px; background:#f8fafbed; color:#192942; text-align:left; font-family:inherit; box-shadow:0 8px 24px #15223833; opacity:var(--demo-notice); transform:translateY(calc(-10px * (1 - var(--demo-notice)))); cursor:pointer; pointer-events:none; }
.home-demo[data-demo-state="notice"] .home-demo__notice { pointer-events:auto; }
.home-demo__notice-icon { flex:none; display:grid; place-items:center; width:26px; height:26px; border-radius:7px; background:#192942; color:#f1d6af; font:700 10px/1 sans-serif; }
.home-demo__notice b { display:block; font-size:11px; line-height:1.4; }
.home-demo__notice small { display:block; font-size:clamp(9px,4.2cqw,11px); line-height:1.5; margin-top:2px; }
.home-demo__content { position:absolute; inset:0; display:flex; flex-direction:column; background:#fff; opacity:var(--demo-open); pointer-events:none; }
.home-demo[data-demo-state="content"] .home-demo__content,.home-demo[data-demo-state="play"] .home-demo__content { pointer-events:auto; }
.home-demo__browser { padding:19% 4% 5%; color:#576473; text-align:center; font:500 11px/1.5 sans-serif; background:#f4f6f8; }
.home-demo__artwork { flex:1; min-height:0; overflow:hidden; }
.home-demo__artwork img { width:100%; height:100%; object-fit:cover; object-position:center 22%; }
.home-demo__player { flex:none; display:flex; gap:10px; align-items:center; padding:12px 11px; color:#1b2b40; background:#fff; }
.home-demo__player button { flex:none; display:grid; place-items:center; width:34px; height:34px; border:0; border-radius:50%; background:#1b2b40; color:#fff; font-size:12px; cursor:pointer; }
.home-demo__track { flex:1; height:2px; background:#d1d8e1; overflow:hidden; }
.home-demo__track i { display:block; width:100%; height:100%; background:#b38b50; transform:scaleX(var(--demo-track)); transform-origin:left; }
.home-demo__time { font:10px/1 sans-serif; }
.home-demo__toolbar { display:flex; flex:none; justify-content:space-around; align-items:center; padding:0 5% 11%; height:7%; color:#566678; font:18px/1 sans-serif; }
.home-demo__home { position:absolute; z-index:5; bottom:1.3%; left:35%; width:30%; height:3px; background:#172538; border-radius:4px; }
.home-demo__disclaimer { position:absolute; bottom:-6px; left:0; right:0; text-align:center; font-size:11px; line-height:1.6; color:#627084; }
/* Editorial images with less repeated chrome. */
.home-page .tp-works-grid { grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:30px; }
.home-page .tp-work { max-width:400px; }
.home-page .tp-work-media { aspect-ratio:1; background:#f0f3f7; padding:20px; }
.home-page .tp-work-media img { object-fit:contain; }
.home-page .tp-work h3 { margin-top:21px; font-size:20px; line-height:1.65; }
.home-page .tp-work p { font-size:15px; line-height:1.9; }
.home-page .t5.t5--about { --home-story-intro:clamp(135px,20svh,185px); background:#f8f6f2; }
.home-page .t5.t5--about .t5-intro { position:sticky; top:calc(var(--header-h) + var(--linkc-admin-bar-h,0px)); height:var(--home-story-intro); padding:24px 0; background:#f8f6f2; }
.home-page .t5.t5--about .t5-intro::after { display:none; }
/* Give the final scene a short reading interval before the sticky stack exits. */
.home-page .t5--about .t5-panels::after { display:block; height:clamp(180px,35svh,380px); background:#f9f8f4; }
.home-page .t5.t5--about .t5-panel { position:sticky; top:calc(var(--header-h) + var(--linkc-admin-bar-h,0px) + var(--home-story-intro)); min-height:calc(100svh - var(--header-h) - var(--linkc-admin-bar-h,0px) - var(--home-story-intro)); padding:28px 0; box-shadow:0 -18px 44px #24334709,0 -1px 0 #2433470d; }
/* Echo the venue light, quiet room, and daylight in each photograph. */
.home-page .t5.t5--about .t5-panel--keep {
  background:radial-gradient(ellipse 72% 86% at var(--story-light-x,15%) var(--story-light-y,48%),#dcb0784d,transparent 74%),linear-gradient(108deg,#f1e9dd,#faf8f4 68%,#f8f6f1);
}
.home-page .t5.t5--about .t5-panel--replay {
  background:radial-gradient(ellipse 72% 86% at var(--story-light-x,15%) var(--story-light-y,48%),#90a8bc45,transparent 74%),linear-gradient(108deg,#e6edf2,#f7f8f9 68%,#f5f6f7);
}
.home-page .t5.t5--about .t5-panel--next {
  background:radial-gradient(ellipse 72% 86% at var(--story-light-x,15%) var(--story-light-y,48%),#b9d0d633,transparent 74%),linear-gradient(108deg,#edf2f2,#fbfaf7 68%,#f9f7f1);
}
.home-page .t5-panel-in { width:min(1140px,calc(100% - 80px)); grid-template-columns:1.1fr 1fr; gap:7%; }
.home-page .t5--about .t5-media { height:min(440px,calc(100svh - var(--header-h) - var(--linkc-admin-bar-h,0px) - var(--home-story-intro) - 56px)); max-height:none; border-radius:4px; box-shadow:0 16px 36px #25344212,0 2px 6px #25344208; }
.home-page .t5-copy { max-width:470px; }
.home-page .t5-copy h3 { font-size:clamp(25px,2.3vw,32px); line-height:1.6; letter-spacing:.02em; }
.home-page .t5-copy .t5-lead,.home-page .t5-copy p { font-size:16px; line-height:1.95; margin-top:18px; }
.home-page .t5-copy p+p { margin-top:12px; }
.home-page .section:has(.tp-news-list) { padding:56px 0!important; background:#eef2f7; }
.home-page .section:has(.tp-news-list)>.wrap { display:grid; grid-template-columns:170px 1fr; gap:10px 44px; }
.home-page .section:has(.tp-news-list) .sec-head { margin:8px 0 0!important; }
.home-page .section:has(.tp-news-list) .sec-head-en { color:var(--ink-900); font-size:25px; letter-spacing:.04em; font-weight:700; }
.home-page .tp-news-item { grid-template-columns:95px 1fr auto; gap:12px 18px; padding:19px 0; }
.home-page .tp-news-date { font-size:13px; letter-spacing:.04em; }
.home-page .tp-news-tag { display:none; }
.home-page .tp-news-ttl { font-size:15px; line-height:1.9; }
.home-page .section:has(.tp-news-list) .sec-action { grid-column:2; margin-top:5px; }
.home-page .home-faq { padding:72px 0; }
.home-page .home-faq .t7-panel { padding:0; border:0!important; border-top:1px solid var(--line)!important; background:none; box-shadow:none; border-radius:0; }
.home-page .home-faq summary { padding:21px 45px 21px 0; font-size:16px; }
.home-page .home-faq .faq-answer { padding:0 35px 21px 0; font-size:15px; line-height:1.95; }
body.home .site-business-cta::after { display:none; }
/* Desktop: let the products fill more of the light scene, preserving card-to-phone scale. */
@media(min-width:821px) {
  .home-demo__visual { height:min(730px,66vw,calc(100svh - var(--header-h) - var(--linkc-admin-bar-h,0px) - 76px)); }
  .home-demo__stage { height:calc(100% - 64px); }
  .home-demo__phone { left:55%; top:12%; height:85%; }
}
@media(max-width:1100px) {
  .home-page .tp-hero[data-hero="layered"] .tp-hero-media { min-height:570px; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-lead br { display:none; }
  .home-page .tp-flow-panel { gap:16px; }
  .home-page .tp-flow-copy b { font-size:15px; }
  .home-demo__inner { grid-template-columns:.95fr 1.05fr; gap:2%; }
  .home-demo__copy h2 { font-size:34px; }
}
/* A stronger desktop opening, without adding more content or decoration. */
@media(min-width:821px) {
  .home-page .tp-hero[data-hero="layered"] .tp-hero-copy { padding-right:28px; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-ja { font-size:clamp(50px,5.5vw,90px); line-height:1.22; letter-spacing:.025em; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-lead { max-width:560px; margin-top:28px; font-size:clamp(19px,1.6vw,24px); line-height:1.8; font-weight:600; }
  .home-page .tp-hero-description { max-width:500px; margin-top:18px; font-size:clamp(15px,1.16vw,18px); line-height:1.9; text-wrap:pretty; }
  .home-page .home-hero-closing { display:inline-block; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-points { gap:0; margin-top:26px; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-point-icon { flex-direction:column; justify-content:flex-start; gap:10px; padding:0 22px; border-radius:0; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-point-icon:first-child { padding-left:0; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-point-icon+ .tp-hero-point-icon { border-left:1px solid #aab5c44d; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-point-icon svg { width:28px; height:28px; stroke-width:1.5; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-points b { font-size:14px; }
  .home-page .home-hero-actions { margin-top:28px; }
  .home-page .tp-hero[data-hero="layered"] .btn { padding:17px 26px; font-size:16px; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-media { min-height:clamp(560px,70svh,700px); }
  .home-page .tp-layered-cards { left:0; top:10%; bottom:8%; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx { width:37.5%; max-width:200px; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="0"] { top:28%; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="1"] { top:14%; width:48%; max-width:236px; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="2"] { top:39%; }
  .home-page .tp-layered-phone { right:3%; width:46%; }
  .home-page .tp-layered-phone-inner { width:min(94%,310px,calc((clamp(740px,86svh,920px) - var(--header-h) - 100px) * .461538)); }
}
@media(min-width:960px) {
  .home-page .tp-hero[data-hero="layered"] .tp-hero-lead br { display:block; }
}
@media(max-width:820px) {
  .home-page { font-size:15px; }
  .home-page .wrap { width:calc(100% - 40px); }
  .home-page .section { padding:56px 0; }
  .home-page .sec-head { margin-bottom:28px; }
  .home-page .sec-head-ja { font-size:26px; }
  .home-page .sec-head-lead { font-size:15px; }
  .home-page .tp-hero[data-hero="layered"] { padding-bottom:0; min-height:var(--hero-viewport-height,100svh); }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-inner { display:grid!important; grid-template-columns:minmax(0,1fr)!important; grid-template-rows:auto auto minmax(150px,1fr) auto auto auto; grid-template-areas:"title" "lead" "media" "description" "points" "actions"; justify-items:center!important; align-items:center; gap:8px; width:100%; height:calc(var(--hero-viewport-height,100svh) - var(--header-h) - var(--linkc-admin-bar-h,0px)); min-height:min-content; padding:14px 0 16px; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-copy { display:contents; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-ja { grid-area:title; width:calc(100% - 40px); font-size:44px; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-ja-line { display:inline; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-copy-body { display:contents; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-lead { grid-area:lead; width:calc(100% - 40px); max-width:none; margin:0; font-size:15px; line-height:1.7; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-lead br { display:block; }
  .home-page .home-desktop-break { display:none; }
  .home-page .tp-hero-description { grid-area:description; width:calc(100% - 40px); margin:0; font-size:13px; line-height:1.7; max-width:none; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-points { grid-area:points; width:calc(100% - 40px); position:static; margin:0; gap:16px; opacity:1; transform:none; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-point-icon { max-width:none; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-points b { font-size:12px; }
  .home-hero-actions { grid-area:actions; width:calc(100% - 40px); margin:0; gap:16px; }
  .home-page .tp-hero[data-hero="layered"] .btn { width:auto; min-height:44px; margin:0; font-size:14px; padding:10px 17px; }
  .home-page .tp-hero[data-hero="layered"] .tp-hero-media { grid-area:media; width:min(100%,540px); height:100%; min-height:0; margin:0; }
  /* Scale the whole montage, including phone chrome, into the remaining row. */
  .home-page .tp-layered-products { inset:auto; left:50%; top:50%; width:375px; height:350px; transform:translate(-50%,-50%) scale(var(--hero-mobile-scale,.5)); transform-origin:center; }
  .home-page .tp-layered-cards { left:10%; top:9%; bottom:3%; width:60%; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx { width:42%; max-width:150px; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="0"] { left:4%; top:35%; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="1"] { left:28%; top:16%; width:52%; max-width:185px; }
  .home-page .tp-hero[data-hero="layered"] .tp-cardx[data-pos="2"] { left:-6%; top:46%; }
  .home-page .tp-layered-phone { right:8%; top:0; width:42%; }
  /* Scale all phone chrome from the 310px / 16px desktop design, like the demo. */
  .home-page .tp-layered-phone-inner { width:min(92%,195px); container-type:inline-size; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  .home-page .tp-phone-device,.home-page .tp-phone-side-button { font-size:calc(100cqw / 19.375); }
  .home-page .tp-flow { padding:26px 0 38px; }
  .home-page .tp-flow-panel { gap:26px 18px; }
  .home-page .tp-flow-copy { padding-top:12px; }
  .home-page .tp-flow-copy b { font-size:15px; }
  .home-page .tp-flow-copy p { font-size:13px; }
  .home-demo { height:calc(var(--demo-viewport-height,100svh) * 2.55); }
  .home-demo__sticky { height:calc(var(--demo-viewport-height,100svh) - var(--header-h) - var(--linkc-admin-bar-h,0px)); min-height:0; }
  .home-demo__inner { display:grid; grid-template-columns:1fr; grid-template-rows:auto minmax(0,1fr); width:calc(100% - 40px); max-height:none; gap:8px; padding:24px 0 16px; }
  .home-demo__copy { position:static; text-align:center; }
  .home-demo__copy h2 { line-height:1.2; }
  .home-demo__title-en { font-size:30px; line-height:1.2; }
  .home-demo__title-ja { margin-top:4px; font-size:17px; line-height:1.4; }
  .home-demo__lead { display:none; }
  .home-demo__overview { margin:14px auto 0; max-width:400px; }
  .home-demo__overview button { gap:6px; padding:4px 0 8px; }
  .home-demo__phase-icon { width:42px; height:42px; }
  .home-demo__overview svg { width:26px; height:26px; }
  .home-demo__overview li:not(:last-child)::after { top:25px; left:calc(50% + 28px); width:calc(100% - 56px); }
  .home-demo__overview button>span:last-child { font-size:clamp(11px,3.1vw,12px); }
  .home-demo__current { justify-content:center; gap:10px; min-height:34px; margin:8px auto 0; max-width:400px; }
  .home-demo__current p { font-size:12px; }
  .home-demo__step { font-size:11px; }
  .home-demo__step b { font-size:17px; }
  .home-demo__stage { height:calc(100% - 60px); }
  .home-demo__visual { width:100%; height:100%; min-height:0; }
  /* Phone details use the same scale as the device, even on short iPhone screens. */
  .home-demo__phone { top:8%; height:90%; max-height:min(460px,calc((100vw - 40px) * .95)); padding:0; border-radius:18% / 8.308%; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  .home-demo__screen { position:absolute; inset:1.15% 2.5%; width:auto; height:auto; border-radius:16.3% / 7.53%; }
  .home-demo__status { font-size:5cqw; }
  .home-demo__island { border-radius:10cqw; }
  .home-demo__notice { padding:5cqw 3.5cqw; gap:3cqw; border-radius:6cqw; }
  .home-demo__notice>span:last-child { min-width:0; }
  .home-demo__notice-icon { width:14cqw; height:14cqw; border-radius:3.5cqw; font-size:5.5cqw; }
  .home-demo__notice b { font-size:6cqw; white-space:nowrap; }
  .home-demo__notice small { font-size:5.4cqw; margin-top:1cqw; white-space:nowrap; letter-spacing:0; }
  .home-demo__browser { font-size:5.5cqw; }
  .home-demo__player { padding:5cqw; gap:4cqw; }
  .home-demo__player button { width:17cqw; height:17cqw; font-size:6cqw; }
  .home-demo__time { font-size:5cqw; }
  .home-demo__toolbar { font-size:9cqw; }
  .home-demo__home { height:1.5cqw; }
  .home-demo__scene-note { top:calc(100% + 8px); left:50%; right:auto; transform:translateX(-50%); }
  .home-demo__scene-note button { min-height:44px; margin-top:0; }
  .home-demo__disclaimer { bottom:-5px; font-size:10px; }
  .home-page .tp-works-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:27px 18px; }
  .home-page .tp-work h3 { font-size:18px; margin-top:17px; }
  .home-page .tp-work p { font-size:14px; }
  .home-page .tp-work-media { padding:12px; }
  .home-page .t5.t5--about .t5-intro { position:relative; top:auto; height:auto; padding:52px 0 30px; }
  .home-page .t5-panel-in { width:calc(100% - 40px); grid-template-columns:1fr; gap:20px; }
  .home-page .t5--about .t5-media { height:clamp(170px,27svh,290px); max-height:none; aspect-ratio:auto; }
  .home-page .t5-copy { max-width:none; padding:0; }
  .home-page .t5-copy h3 { font-size:25px; line-height:1.5; }
  .home-page .t5-copy .t5-lead,.home-page .t5-copy p { font-size:15px; line-height:1.85; }
  .home-page .t5.t5--about .t5-panel { --story-light-x:28%; --story-light-y:22%; top:calc(var(--header-h) + var(--linkc-admin-bar-h,0px)); min-height:calc(100svh - var(--header-h) - var(--linkc-admin-bar-h,0px)); padding:20px 0; }
  .home-page .t5--about .t5-panels::after { height:clamp(120px,25svh,200px); }
  .home-page .section:has(.tp-news-list) { padding:40px 0!important; }
  .home-page .section:has(.tp-news-list)>.wrap { display:block; }
  .home-page .section:has(.tp-news-list) .sec-head { margin:0 0 22px!important; }
  .home-page .tp-news-item { grid-template-columns:1fr auto; gap:5px; padding:17px 0; }
  .home-page .tp-news-date { grid-column:1; font-size:12px; }
  .home-page .tp-news-ttl { grid-column:1; font-size:14px; }
  .home-page .tp-news-item .arw { grid-row:1 / 3; grid-column:2; }
  .home-page .section:has(.tp-news-list) .sec-action { margin-top:17px; }
  .home-page .home-faq summary { font-size:15px; padding-right:25px; }
}
@media(max-width:420px) {
  .home-page .tp-hero[data-hero="layered"] .tp-hero-ja { font-size:clamp(30px,9.2vw,40px); }
  .home-page .tp-layered-phone { right:5%; width:44%; }
  .home-page .tp-layered-cards { left:9%; width:62%; }
  /* Browser bars change viewport height while scrolling. Keep the heading
     and its spacing tied to width so the demo does not switch layouts. */
  .home-demo__inner { padding:20px 0 14px; gap:6px; }
  .home-demo__title-en { font-size:26px; }
  .home-demo__title-ja { font-size:16px; }
  .home-demo__overview { margin-top:10px; }
}
/* Capture short-screen layout once; toolbar movement must not switch it. */
@media(max-width:820px) {
  .home-page .tp-hero[data-hero="layered"][data-hero-compact] .tp-hero-inner { gap:6px; padding:10px 0 12px; }
  .home-page .tp-hero[data-hero="layered"][data-hero-compact] .tp-hero-ja { font-size:clamp(28px,8.6vw,34px); line-height:1.3; }
  .home-page .tp-hero[data-hero="layered"][data-hero-compact] .tp-hero-lead { font-size:14px; line-height:1.65; }
  .home-page .tp-hero[data-hero-compact] .tp-hero-description { line-height:1.65; }
}
/* Keep the mobile layout mode stable when browser toolbars change height. */
.home-demo[data-demo-compact] { height:auto; }
.home-demo[data-demo-compact] .home-demo__sticky { position:relative; top:auto; height:660px; min-height:0; }
/* Short desktop windows can scroll past the scene and use its controls. */
@media(min-width:821px) and (max-height:540px) {
  .home-demo { height:auto; }
  .home-demo__sticky { position:relative; top:auto; height:660px; min-height:0; }
}
@media(max-height:620px), (prefers-reduced-motion:reduce) {
  .home-page .t5.t5--about .t5-intro { position:relative; top:auto; height:auto; padding:52px 0 30px; }
  .home-page .t5.t5--about .t5-panel { position:static; min-height:0; padding:24px 0 42px; }
  .home-page .t5--about .t5-panels::after { display:none; }
  .home-page .t5--about .t5-media { height:auto; aspect-ratio:1.5; max-height:400px; }
}

@media(prefers-reduced-motion:reduce) { .home-demo__phase-icon { transition:none; } }