:root{color-scheme:dark;--bg:#020504;--ink:#f2f7f4;--muted:rgba(214,230,222,.55);--accent:116,240,208}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif}body{overflow:hidden}button,a{font:inherit;color:inherit}button{cursor:pointer}.wow-shell{position:relative;height:100dvh;min-height:560px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 48%,rgba(var(--accent),.20),rgba(var(--accent),.055) 31%,transparent 62%),linear-gradient(135deg,rgba(var(--accent),.075),transparent 43%),#020504;transition:background .7s ease}.wow-shell::before{content:"";position:absolute;z-index:0;inset:-12%;pointer-events:none;background:radial-gradient(ellipse at 50% 54%,rgba(var(--accent),.13),transparent 48%),radial-gradient(circle at 17% 42%,rgba(var(--accent),.065),transparent 25%),radial-gradient(circle at 83% 36%,rgba(var(--accent),.05),transparent 27%);filter:blur(18px);opacity:.92}.wow-shell::after{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 66px,rgba(var(--accent),.035) 67px,transparent 68px),linear-gradient(90deg,transparent 0 9%,rgba(var(--accent),.022) 9.2%,transparent 9.4% 90.6%,rgba(var(--accent),.022) 90.8%,transparent 91%);opacity:.62}
.wow-head{position:absolute;z-index:30;top:max(1rem,env(safe-area-inset-top));left:max(1rem,env(safe-area-inset-left));right:max(1rem,env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:center}.wow-head>span{font:650 .7rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}.directory-trigger{border:1px solid rgba(215,235,227,.13);border-radius:999px;background:rgba(3,8,6,.28);padding:.55rem .72rem;color:rgba(232,241,237,.68);font:700 .53rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;backdrop-filter:blur(8px)}.directory-trigger i{margin-left:.35rem;color:rgba(var(--accent),.75);font-style:normal;letter-spacing:.08em}
.wow-stage{position:absolute;z-index:1;inset:0 0 7.35rem;touch-action:none;cursor:grab;overflow:hidden}.wow-stage.is-dragging{cursor:grabbing}.wow-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.grade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(1,4,3,.55),transparent 15%,transparent 68%,rgba(1,4,3,.76)),radial-gradient(ellipse at 50% 48%,transparent 38%,rgba(1,4,3,.22) 72%,rgba(1,4,3,.72))}.hero-copy{position:absolute;z-index:8;left:50%;top:12.4%;width:min(40rem,88vw);transform:translate(-50%,-50%);text-align:center;pointer-events:none;text-shadow:0 4px 28px #000;transition:opacity .2s ease,transform .2s ease}.wow-stage.is-moving .hero-copy{opacity:0;transform:translate(-50%,calc(-50% + .7rem))}.hero-copy p{margin:0 0 .65rem;color:rgba(var(--accent),.82);font:750 .61rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.2em}.hero-copy h1{margin:0;font:500 clamp(1.55rem,3.5vw,3.15rem)/1.08 Georgia,"Yu Mincho","Hiragino Mincho ProN",serif;letter-spacing:-.015em;text-wrap:balance}.hero-copy .demo-name{display:block;margin:.58rem auto 0;color:rgba(226,237,231,.62);font-size:clamp(.62rem,.9vw,.76rem);line-height:1.4;white-space:nowrap}.buyer-context{display:block;position:absolute;z-index:9;left:50%;top:3.7rem;width:min(36rem,78vw);transform:translateX(-50%);text-align:center;pointer-events:none;text-shadow:0 3px 18px #000;transition:opacity .2s ease}.buyer-context p{margin:0;color:rgba(238,246,242,.8);font-size:.68rem;line-height:1.45}.decision-facts{display:flex;justify-content:center;align-items:center;gap:.42rem;flex-wrap:wrap}.decision-facts strong{display:inline-flex;padding:.26rem .48rem;border:1px solid rgba(var(--accent),.25);border-radius:999px;background:rgba(var(--accent),.08);font-weight:780;color:rgba(245,251,248,.96)}.buyer-context span{display:block;margin-top:.24rem;color:rgba(var(--accent),.76);font-size:.6rem;line-height:1.45}.buyer-context small{display:block;margin-top:.2rem;color:rgba(218,232,224,.58);font-size:.56rem;line-height:1.4}.wow-stage.is-moving .buyer-context{opacity:0}.motion-context{display:none}.live-demo{display:block;position:absolute;z-index:7;inset:0;overflow:visible;pointer-events:none;opacity:0;background:transparent;transition:opacity .32s ease}.live-demo.is-ready{opacity:.98}.live-demo iframe{position:absolute;left:0;top:0;width:760px;height:480px;border:0;border-radius:.42rem;background:#fff;transform-origin:0 0;pointer-events:none;will-change:transform}.wow-stage.is-moving .live-demo{opacity:0}.gesture{position:absolute;z-index:12;left:50%;bottom:.6rem;display:flex;align-items:center;gap:.7rem;transform:translateX(-50%);border:0;background:transparent;padding:.45rem .6rem;color:rgba(218,232,224,.44);font:650 .48rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em}.gesture i{display:block;width:2.5rem;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--accent),.35))}.gesture b{color:rgba(var(--accent),.78);font-weight:800}.gesture i:last-child{transform:scaleX(-1)}.gesture-moving{display:none;white-space:nowrap}
.action-dock{position:absolute;z-index:24;left:50%;bottom:4.35rem;display:flex;align-items:center;gap:.7rem;transform:translate(-50%,.6rem);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.action-dock[data-ready="true"]{opacity:1;transform:translate(-50%,0);pointer-events:auto}.action-primary{display:inline-flex;flex-direction:column;align-items:flex-start;gap:.12rem;padding:.68rem 1rem;border:1px solid rgba(var(--accent),.68);border-radius:999px;background:rgba(var(--accent),.2);box-shadow:0 .5rem 1.8rem rgba(0,0,0,.24),0 0 1.5rem rgba(var(--accent),.08);color:#fff;text-decoration:none;font-size:.76rem;font-weight:700;backdrop-filter:blur(10px)}.action-primary span{color:#fff}.action-primary small{color:rgba(var(--accent),.86);font-size:.48rem;font-weight:650;letter-spacing:.02em}.action-secondary{display:flex;gap:.35rem}.action-secondary button{border:0;background:transparent;padding:.65rem .55rem;color:rgba(230,239,234,.6);font-size:.68rem}.action-secondary button:hover,.action-secondary button:focus-visible{color:#fff}.contact-shortcut{flex-direction:column;gap:.12rem;line-height:1.05}.contact-shortcut small{font-size:.48rem;color:rgba(var(--accent),.7);font-weight:650}.article-bridge{position:absolute;left:50%;bottom:calc(100% + .12rem);transform:translateX(-50%);display:inline-flex;align-items:center;gap:.3rem;min-height:34px;padding:.18rem .45rem;color:rgba(222,235,229,.46);font-size:.56rem;line-height:1;text-decoration:none;white-space:nowrap;letter-spacing:.025em;text-shadow:0 2px 12px #000}.article-bridge:hover,.article-bridge:focus-visible{color:rgba(242,248,245,.84);text-decoration:underline;text-underline-offset:3px}.article-bridge[hidden]{display:none}
.peek-nav{position:absolute;z-index:20;left:50%;bottom:max(.35rem,env(safe-area-inset-bottom));width:min(54rem,calc(100% - 1.5rem));height:3.75rem;display:grid;grid-template-columns:minmax(0,1fr) minmax(11rem,1.45fr) minmax(0,1fr);align-items:stretch;transform:translateX(-50%);border-top:1px solid rgba(199,225,214,.12);background:linear-gradient(180deg,rgba(4,9,7,.06),rgba(4,9,7,.72));backdrop-filter:blur(9px)}.peek-nav button{min-width:0;border:0;background:transparent;display:flex;align-items:center;justify-content:center;gap:.65rem;padding:.6rem .8rem}.peek-nav>button:not(.current){color:rgba(225,236,231,.48)}.peek-nav button:disabled{opacity:.2;cursor:default}.peek-nav small{color:rgba(var(--accent),.58);font:700 .5rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}.peek-nav button span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.7rem}.peek-nav .current{flex-direction:column;gap:.32rem;border-inline:1px solid rgba(199,225,214,.1);text-align:center}.peek-nav .current small{color:rgba(var(--accent),.8)}.peek-nav .current strong{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.83rem;font-weight:600}
.directory,.info-sheet{position:absolute;z-index:60;inset:0}.directory[hidden],.info-sheet[hidden]{display:none}.overlay-dismiss{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(0,3,2,.68);backdrop-filter:blur(8px)}.directory-panel,.sheet-panel{position:absolute;z-index:2;left:50%;bottom:0;width:min(58rem,100%);transform:translateX(-50%);border:1px solid rgba(203,231,220,.13);border-bottom:0;border-radius:1.2rem 1.2rem 0 0;background:rgba(5,11,9,.96);box-shadow:0 -2rem 7rem rgba(0,0,0,.45)}.directory-panel{padding:1.1rem 1.1rem max(1.2rem,env(safe-area-inset-bottom))}.directory-panel header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.9rem}.directory-panel header p,.sheet-kicker{margin:0 0 .28rem;color:rgba(var(--accent),.72);font:700 .53rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em}.directory-panel h2,.sheet-panel h2{margin:0;font:500 clamp(1.25rem,2.3vw,2rem)/1.1 Georgia,"Yu Mincho","Hiragino Mincho ProN",serif}.directory-panel header>button,.sheet-close{border:0;background:transparent;color:rgba(230,240,235,.55);font-size:1.4rem}.directory-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.42rem}.directory-grid button{min-width:0;min-height:4.2rem;border:1px solid rgba(210,232,223,.09);border-radius:.65rem;background:rgba(255,255,255,.018);padding:.65rem;text-align:left}.directory-grid button[aria-current="true"]{border-color:rgba(var(--accent),.42);background:rgba(var(--accent),.07)}.directory-grid b{display:block;margin-bottom:.38rem;color:rgba(var(--accent),.68);font:700 .48rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em}.directory-grid span{display:block;font-size:.69rem;line-height:1.35;color:rgba(235,242,238,.78)}
.sheet-panel{padding:1.3rem 1.3rem max(1.4rem,env(safe-area-inset-bottom))}.sheet-close{position:absolute;right:1rem;top:.8rem}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem;margin:1rem 0}.price-grid section{border:1px solid rgba(206,230,220,.1);border-radius:.72rem;padding:.9rem;background:rgba(255,255,255,.018)}.price-grid h3{margin:0 0 .7rem;font-size:.73rem}.price-grid h3 span{color:rgba(220,234,228,.45);font-weight:500}.price-grid strong{display:block;font-size:1.25rem}.price-grid strong small{font-size:.58rem;color:rgba(226,238,232,.5)}.price-grid p,.contact-copy{margin:.65rem 0 0;color:rgba(221,234,227,.62);font-size:.68rem;line-height:1.55}.sheet-action{display:inline-flex;border:1px solid rgba(var(--accent),.38);border-radius:999px;background:rgba(var(--accent),.09);padding:.72rem .92rem;color:#fff;text-decoration:none;font-size:.7rem}.contact-actions{display:flex;gap:.6rem;margin-top:1rem;align-items:center}.contact-actions>a:last-child{color:rgba(230,239,234,.68);font-size:.7rem;text-decoration:none}
@media(min-width:701px){
  /* Above mobile, hide the duplicate hero copy by default. Card width is driven
     by the stage's HEIGHT as well as viewport width, so a width-only breakpoint
     is not enough: 1000/1024px wide but 768px tall still has no honest left
     gutter. The bottom current-demo control continues to name the selection. */
  .hero-copy{display:none}
}
@media(min-width:1000px) and (min-aspect-ratio:3/2){
  /* Re-enable buyer copy only when the viewport is genuinely wide enough for a
     separate left gutter. 3:2 is derived from the current CARD_W / 52deg FOV /
     camera / stage-height projection, and keeps a positive gap from the central
     surface across the supported desktop compositions. */
  .hero-copy{
    display:block;
    left:clamp(1rem,2vw,2rem);
    top:clamp(4.4rem,9vh,5.2rem);
    width:clamp(11rem,13vw,13rem);
    transform:none;
    text-align:left;
  }
  .hero-copy h1{font-size:clamp(.96rem,1.35vw,1.32rem);line-height:1.12;letter-spacing:-.01em;text-wrap:balance}
  .hero-copy p{margin-bottom:.45rem;font-size:.5rem}
  .hero-copy .demo-name{margin:.48rem 0 0;font-size:.58rem;line-height:1.45}
  .buyer-context{left:clamp(1rem,2vw,2rem);top:clamp(10rem,18vh,11.25rem);width:clamp(11rem,14vw,12.5rem);transform:none;text-align:left}
  .buyer-context p{font-size:.64rem}
  .buyer-context span{font-size:.56rem}
  .wow-stage.is-moving .hero-copy{transform:translateY(.45rem)}
}
@media(max-width:700px){.wow-stage{inset:0 0 4.2rem}.wow-head{left:.8rem;right:.8rem}.directory-trigger{padding:.48rem .58rem}.directory-trigger i{display:none}.hero-copy{top:13.1%;width:92vw;transition:none}.hero-copy h1{font-size:1.38rem;line-height:1.12}.hero-copy .demo-name{margin-top:.36rem;font-size:.58rem}.buyer-context{display:block;position:absolute;z-index:9;left:50%;top:19.2%;width:94vw;transform:translateX(-50%);text-align:center;pointer-events:none;text-shadow:0 3px 18px #000;transition:none}.buyer-context p{margin:0;color:rgba(238,246,242,.8);font-size:.59rem;line-height:1.4}.decision-facts{gap:.22rem;flex-wrap:nowrap}.decision-facts strong{padding:.22rem .34rem;font-size:.52rem;white-space:nowrap}.buyer-context span{display:block;margin-top:.14rem;color:rgba(var(--accent),.76);font-size:.53rem;line-height:1.4}.buyer-context small{display:block;margin-top:.14rem;color:rgba(218,232,224,.58);font-size:.51rem;line-height:1.35}.wow-stage.is-moving .buyer-context{opacity:0}.motion-context{display:block;position:absolute;z-index:10;left:50%;top:12.9%;width:92vw;transform:translate(-50%,-50%);text-align:center;pointer-events:none;opacity:0;visibility:hidden;transition:none;text-shadow:0 3px 20px #000}.wow-stage.is-moving .hero-copy{opacity:0;visibility:hidden;transition:none}.wow-stage.is-moving .motion-context{opacity:1;visibility:visible}.motion-context p{display:flex;justify-content:center;align-items:center;gap:.5rem;margin:0;color:rgba(241,248,244,.9);font:650 .76rem/1.25 -apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif}.motion-context p span{max-width:42vw;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.motion-context i{color:rgba(var(--accent),.82);font-style:normal}.motion-context small{display:block;margin-top:.42rem;color:rgba(218,232,224,.52);font:650 .48rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.action-dock{bottom:9.6rem;width:calc(100% - 1rem);justify-content:center;gap:.25rem}.action-primary{padding:.62rem .78rem;font-size:.66rem}.action-primary small{font-size:.42rem}.action-secondary button{padding:.5rem .35rem;font-size:.6rem}.contact-shortcut small{font-size:.44rem}.article-bridge{top:calc(100% + .08rem);bottom:auto;min-height:34px;font-size:.52rem}.peek-nav{width:calc(100% - .65rem);height:3.55rem;grid-template-columns:1fr 1.45fr 1fr}.peek-nav button{padding:.35rem .15rem;gap:.22rem}.peek-nav button span{font-size:.56rem}.peek-nav small{font-size:.43rem}.peek-nav .current strong{font-size:.65rem}.gesture{bottom:3.2rem;padding:.3rem .42rem}.gesture i{width:1.4rem}.gesture span{font-size:.46rem}.gesture-moving{display:none;white-space:nowrap}.wow-stage.is-moving .gesture{bottom:3.2rem;padding:.48rem .72rem;border:1px solid rgba(var(--accent),.24);border-radius:999px;background:rgba(3,10,8,.72);color:rgba(235,246,241,.82);backdrop-filter:blur(10px);box-shadow:0 .55rem 1.8rem rgba(0,0,0,.24)}.wow-stage.is-moving .gesture-idle{display:none}.wow-stage.is-moving .gesture-moving{display:inline}.wow-stage.is-moving .gesture i{width:1.8rem;background:linear-gradient(90deg,transparent,rgba(var(--accent),.62))}.directory-panel{max-height:72dvh;overflow:auto}.directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.directory-grid button{min-height:3.7rem}.price-grid{grid-template-columns:1fr}.sheet-panel{max-height:75dvh;overflow:auto}}
@media(prefers-reduced-motion:reduce){.hero-copy,.action-dock{transition:none}}
