@font-face{font-family:Manrope;src:url('../home-20260920/manrope.ttf') format('truetype');font-display:swap;font-weight:200 800}
:root{color-scheme:light;--paper:#eff4f8;--white:#f8fafb;--ink:#202329;--muted:#526779;--line:#20232925;--header:84px;--edge:6vw;--ease:cubic-bezier(.22,.75,.2,1);font-family:Manrope,'PingFang SC','Microsoft YaHei',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 20px);scrollbar-gutter:stable}
body{margin:0}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:not-allowed}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,figure,dl,dd{margin:0}
[hidden]{display:none!important}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #a15198;outline-offset:5px}
::selection{background:#d3dce9}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:fixed;top:-100px;left:20px;z-index:200;padding:16px;background:white}
.skip-link:focus{top:12px}
.product-header{height:var(--header);position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;background:#eff4f8ed;backdrop-filter:blur(18px);border-bottom:1px solid #2023290c}
.brand,.brand img{width:104px;height:70px;object-fit:contain}
.product-nav{display:flex;gap:32px;font-size:13px}
.product-nav a{display:flex;align-items:center;min-height:44px;position:relative}
.product-nav a[aria-current]:after{content:'';position:absolute;bottom:5px;left:0;right:0;height:1px;background:currentColor}
.cart-trigger{height:44px;padding:0 16px;border:1px solid #20232933;border-radius:8px;font-size:12px;display:flex;align-items:center;gap:12px}
.cart-trigger span{min-width:16px;font-variant-numeric:tabular-nums}
.button{min-height:52px;display:inline-flex;justify-content:center;align-items:center;padding:13px 25px;border:1px solid transparent;border-radius:10px;font-size:13px;font-weight:550;line-height:1.5;transition:background .2s,border-color .2s}
.primary{background:var(--ink);color:white}
.primary:hover{background:#39434d}
.secondary{border-color:#20232940;background:#eff4f860}
.secondary:hover{background:#fff9;border-color:#20232980}
.checkout{width:100%;background:#e1e5e8;color:#626c75}
.button:disabled:not(.checkout){opacity:.5}
.text-button{display:inline-flex;align-items:center;min-height:44px;padding:4px 0;text-decoration:underline;text-underline-offset:5px;font-size:12px}
.image-open{padding:0;display:block;cursor:zoom-in}
.hero-scene{position:relative;height:calc(100svh - var(--header));min-height:600px;isolation:isolate;overflow:hidden;background:var(--paper)}
.hero-title{position:absolute;left:10vw;top:18%;z-index:2}
.hero-title h1{font-size:clamp(160px,21vw,330px);line-height:1.05;font-weight:500;letter-spacing:-.08em;margin-left:-.055em}
.hero-title p{font-size:13px;margin-top:28px;font-weight:550}
.hero-title p span{display:block;color:var(--muted);margin-top:7px;font-size:12px;font-weight:400}
.hero-product{position:absolute;left:39%;right:5%;top:6%;height:76%;display:flex;align-items:center;justify-content:center;z-index:1}
.hero-product img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 28px 25px #52677923);user-select:none}
.hero-bottom{position:absolute;bottom:7%;left:10vw;right:var(--edge);display:flex;justify-content:space-between;align-items:center;gap:28px;z-index:3}
.hero-actions,.closing-actions{display:flex;gap:12px;flex-wrap:wrap}
.scroll-hint{font-size:12px;display:flex;gap:36px;align-items:center;min-height:44px}
.scroll-hint span{font-size:22px}
.hero-word{position:absolute;bottom:0;right:6vw;font-size:clamp(70px,11vw,180px);line-height:1.1;letter-spacing:-.07em;font-weight:600;color:#344c680b;pointer-events:none;z-index:0}
.art-scene{height:calc(100svh - var(--header));min-height:560px;position:relative;overflow:hidden;background:#dce7ef;color:white;isolation:isolate}
.art-photo{position:absolute;inset:0;z-index:-2}
.art-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.art-scene:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#142735b8,transparent 62%)}
.art-copy{position:absolute;left:var(--edge);bottom:12%;display:flex;align-items:end;gap:7vw}
.art-copy h2,.section-heading h2,.desk-copy h2,.package-copy h2,.closing-copy h2{font-size:clamp(38px,5vw,76px);line-height:1.2;font-weight:500;letter-spacing:-.05em}
.art-copy p{font-size:14px;line-height:1.9;padding-bottom:6px}
.image-label{position:absolute;right:var(--edge);bottom:5%;display:flex;align-items:center;gap:25px;color:inherit;border-bottom:1px solid currentColor;min-height:44px;font-size:12px;padding:0}
.image-label span{font-size:24px;font-weight:300}
.scroll-story .opening{height:260svh;position:relative}
.scroll-story .opening-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header));overflow:hidden;isolation:isolate}
.scroll-story .hero-scene{height:100%;min-height:0;transform-origin:50% 0}
.scroll-story .art-scene{position:absolute;inset:0;height:100%;min-height:0;z-index:5;transform:translate3d(0,100%,0);border-radius:32px 32px 0 0}
.scroll-story .hero-product,.scroll-story .hero-title,.scroll-story .art-scene,.scroll-story .art-photo{will-change:transform}
.details-section{position:relative;padding:145px var(--edge) 155px;background:var(--white);overflow:clip}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:85px}
.section-heading p{font-size:14px;line-height:1.9;color:var(--muted);padding-bottom:5px;margin-right:8vw}
.detail-pair{display:grid;grid-template-columns:1.2fr 1fr;gap:6vw;align-items:start}
.base-figure{margin-top:180px}
.photo-frame{width:100%;overflow:hidden;border-radius:12px;background:#dce7ef}
.photo-frame img{width:100%;height:100%;object-fit:cover}
.edge-figure .photo-frame{aspect-ratio:1.13}
.base-figure .photo-frame{aspect-ratio:.92}
.edge-figure img{object-position:58% 50%}
.base-figure img{object-position:56% 50%}
.detail-pair figcaption{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 2px 0}
.detail-pair figcaption strong{font-size:16px;font-weight:500}
.detail-pair figcaption span{font-size:11px;color:var(--muted)}
.desk-scene{height:105svh;min-height:650px;position:relative;overflow:hidden;color:white;isolation:isolate;background:#202329}
.desk-photo{position:absolute;inset:-80px 0;z-index:-2}
.desk-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.desk-scene:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0c121968,transparent 45%,#0c121973)}
.desk-copy{padding:8% var(--edge)}
.desk-copy p{font-size:14px;margin-top:24px}
.package-section{padding:150px 10vw;display:grid;grid-template-columns:1fr .8fr;gap:12vw;align-items:center;background:var(--white);overflow:clip}
.package-photo .photo-frame{aspect-ratio:.8;max-height:740px}
.package-copy p{font-size:15px;color:var(--muted);margin-top:30px;line-height:1.8}
.package-copy small{display:block;font-size:11px;color:var(--muted);line-height:1.8;max-width:28ch;margin-top:70px}
.closing-section{padding:100px 10vw;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:7vw;min-height:80svh;background:#e4edf3}
.closing-section>img{width:100%;max-height:540px;object-fit:contain;filter:drop-shadow(0 25px 25px #52677920)}
.closing-copy h2{font-size:clamp(34px,4vw,60px)}
.closing-copy>p{font-size:14px;color:var(--muted);margin-top:22px}
.closing-actions{margin-top:38px}
.closing-copy small{display:block;font-size:11px;color:var(--muted);line-height:1.8;margin-top:22px}
.site-footer{padding:40px var(--edge);display:flex;justify-content:space-between;align-items:center;gap:28px;background:var(--paper);font-size:13px}
.site-footer>a{font-weight:650;font-size:16px}
.site-footer nav{display:flex;gap:25px;flex-wrap:wrap}
.site-footer nav a{display:inline-flex;min-height:44px;align-items:center;font-size:12px}
.site-footer small{font-size:10px;color:var(--muted)}
/* The purchase page stays deliberately still and compact. */
.purchase-main{max-width:1500px;margin:0 auto;padding:32px var(--edge) 80px}
.breadcrumbs{display:flex;align-items:center;gap:16px;font-size:11px;color:var(--muted);margin-bottom:40px}
.breadcrumbs a{display:flex;align-items:center;min-height:44px}
.purchase-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:8vw;align-items:start}
.purchase-visual{position:sticky;top:calc(var(--header) + 35px);text-align:center;padding-top:25px}
.purchase-image{width:100%;height:min(58vw,590px);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.purchase-image img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 24px #5267791d)}
.purchase-info h1{font-size:68px;font-weight:500;line-height:1.2}
.product-category{font-size:13px;color:var(--muted);margin-top:15px}
.price-status{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:30px 0 35px}
.price-status strong{font-size:20px;font-weight:550}
.price-status span{font-size:11px;color:var(--muted)}
.spec-title{font-size:14px;font-weight:550;margin-bottom:10px}
.spec-list>div{display:flex;justify-content:space-between;gap:24px;padding:13px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.5}
.spec-list dt{color:var(--muted)}
.spec-list dd{text-align:right}
.spec-list .pending{color:var(--muted)}
.purchase-form{margin-top:28px;display:grid;gap:12px}
.purchase-quantity{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:13px}
.quantity-control{display:inline-flex;border:1px solid #20232930;border-radius:8px;overflow:hidden;align-items:center;min-height:44px}
.quantity-control button{height:44px;width:44px;padding:0;font-size:18px}
.quantity-control button:disabled{color:#949da4}
.quantity-control input,.quantity-control output{width:48px;min-width:0;text-align:center;padding:0;border:0;background:transparent;font-size:13px;font-variant-numeric:tabular-nums}
.quantity-control input{height:42px;appearance:textfield;-moz-appearance:textfield}
.quantity-control input::-webkit-inner-spin-button,.quantity-control input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.quantity-control :focus-visible{outline-offset:-4px}
.purchase-note{font-size:11px;line-height:1.9;color:var(--muted);margin-top:2px;max-width:55ch}
.skates-link{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:65px;border-top:1px solid var(--line);margin-top:28px;font-size:12px}
.skates-link span:last-child{font-size:11px;text-decoration:underline;text-underline-offset:5px;color:var(--muted)}
.purchase-support{display:grid;grid-template-columns:1fr 1.2fr;gap:8vw;margin-top:110px;padding-top:50px;border-top:1px solid var(--line);scroll-margin-top:20px}
.purchase-support h2{font-size:26px;font-weight:500}
.purchase-support details{border-bottom:1px solid var(--line);padding-bottom:8px}
.purchase-support summary{padding:20px 0;font-size:13px;cursor:pointer}
.purchase-support p{font-size:12px;line-height:1.9;color:var(--muted);max-width:55ch;margin:0 0 10px}
.purchase-support details a{display:inline-flex;align-items:center;min-height:44px;font-size:12px;text-decoration:underline;text-underline-offset:5px}
.support-links{display:flex;gap:24px;flex-wrap:wrap}
/* Native dialogs retain the browser's focus trap and Escape handling. */
dialog{color:var(--ink);border:0;background:var(--white)}
dialog::backdrop{background:#1b293d65;backdrop-filter:blur(7px)}
.cart-drawer{margin:0 0 0 auto;inset:0;width:min(460px,100%);max-width:100%;height:100dvh;max-height:100dvh;padding:28px;box-shadow:-20px 0 80px #14273517}
.cart-drawer[open]{display:flex;flex-direction:column;animation:drawer-in .3s var(--ease)}
.drawer-head,.viewer-head{display:flex;justify-content:space-between;align-items:center;gap:20px}
.drawer-head h2{font-size:26px;font-weight:500}
.icon-button{width:44px;height:44px;font-size:29px;font-weight:300;border-radius:50%;background:#e5ebef;flex-shrink:0}
.cart-notice{font-size:11px;color:var(--muted);padding:20px 0;border-bottom:1px solid var(--line);line-height:1.8}
.cart-empty{padding:60px 0}
.cart-empty p{font-size:20px;margin-bottom:15px}
.cart-item{display:grid;grid-template-columns:130px 1fr;gap:25px;padding:32px 0;align-items:start}
.cart-thumb{background:#e6edf3;padding:15px;border-radius:10px}
.cart-thumb img{width:100%;height:120px;object-fit:contain}
.cart-item-info h3{font-size:22px;font-weight:500}
.cart-item-info p{font-size:11px;color:var(--muted);margin-top:5px}
.cart-item-info>span{display:block;font-size:12px;margin:16px 0}
.cart-item-info .quantity-control{display:flex;width:max-content}
.remove-item{margin-top:8px;color:var(--muted)}
.cart-bottom{margin-top:auto;padding-top:30px;display:grid;gap:12px}
.cart-bottom p,.storage-notice{font-size:11px;line-height:1.8;color:var(--muted)}
.storage-notice{padding:14px;background:#e6edf3;border-radius:8px}
.image-viewer{width:94vw;max-width:1500px;height:92dvh;max-height:92dvh;padding:20px 24px 24px;border-radius:16px;overflow:hidden}
.image-viewer[open]{display:flex;flex-direction:column}
.viewer-head{padding-bottom:16px;flex-shrink:0}
.viewer-head h2{font-size:14px;font-weight:500}
.image-viewer>img{flex:1;min-height:0;width:100%;height:100%;object-fit:contain}
.noscript-note{padding:20px var(--edge);font-size:12px;line-height:1.8;background:white}
@keyframes drawer-in{from{transform:translateX(100%)}to{transform:translateX(0)}}
@media(min-width:1700px){.hero-title{left:14vw}.hero-bottom{left:14vw}.hero-product{right:10%}}
@media(max-width:1000px){
  :root{--edge:5vw;--header:76px}
  .hero-title{left:7vw;top:25%}.hero-title h1{font-size:23vw}.hero-title p{margin-top:20px}
  .hero-product{left:34%;right:2%;top:12%;height:66%}.hero-bottom{left:7vw;bottom:8%}
  .section-heading p{margin-right:0}.detail-pair{gap:4vw}.base-figure{margin-top:130px}
  .detail-pair figcaption{display:block}.detail-pair figcaption span{display:block;margin-top:8px}
  .package-section{padding:100px 7vw;gap:8vw}.closing-section{padding:90px 7vw;gap:6vw}
  .purchase-layout{gap:5vw}.site-footer{flex-wrap:wrap}
}
@media(max-width:700px){
  :root{--header:72px;--edge:24px}
  .product-header{padding:0 16px}.brand,.brand img{width:72px;height:52px}.product-nav{gap:17px;font-size:11px}
  .cart-trigger{font-size:11px;padding:0 9px;gap:5px;height:40px}
  .hero-scene{min-height:650px}.hero-title{left:26px;top:6%;display:flex;align-items:center;gap:20px}
  .hero-title h1{font-size:94px;letter-spacing:-.06em}.hero-title p{margin:0;font-size:12px}.hero-title p span{font-size:11px}
  .hero-product{left:8%;right:8%;top:25%;height:50%}.hero-bottom{left:24px;right:24px;bottom:5%;display:block}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.button{padding:13px 17px;font-size:12px}
  .scroll-hint{justify-content:center;font-size:11px;margin-top:10px;gap:15px}.scroll-hint span{font-size:18px}
  .hero-word{font-size:22vw;right:5%;bottom:23%;opacity:.8}
  .scroll-story .opening{height:235svh}
  .art-scene{min-height:590px}.art-photo img{object-position:49% 40%}
  .art-copy{left:24px;bottom:17%;display:block}.art-copy h2{font-size:42px}.art-copy p{font-size:12px;margin-top:22px}
  .image-label{right:24px;bottom:5%;font-size:11px}
  .details-section{padding:80px 24px 100px}.section-heading{display:block;margin-bottom:48px}.section-heading h2{font-size:40px}.section-heading p{font-size:12px;margin-top:23px}
  .detail-pair{grid-template-columns:1fr;gap:60px}.edge-figure{margin-right:26px}.base-figure{margin-top:0;margin-left:38px}.base-figure .photo-frame{aspect-ratio:1.02}.detail-pair figcaption{padding-top:17px}.detail-pair figcaption strong{font-size:15px}
  .desk-scene{height:90svh;min-height:580px}.desk-copy{padding:52px 24px}.desk-copy h2{font-size:42px}.desk-copy p{font-size:12px;max-width:23ch;line-height:1.8}.desk-photo img{object-position:49% 50%}
  .package-section{padding:85px 24px;grid-template-columns:1fr;gap:50px}.package-photo{margin-right:40px}.package-photo .photo-frame{aspect-ratio:.9}.package-copy{padding-left:38px}.package-copy h2{font-size:40px}.package-copy p{font-size:13px;margin-top:22px}.package-copy small{margin-top:28px;max-width:none;font-size:10px}
  .closing-section{padding:65px 24px;grid-template-columns:1fr;gap:45px}.closing-section>img{height:300px;width:85%;margin:auto}.closing-copy{text-align:center}.closing-copy h2{font-size:40px}.closing-copy>p{font-size:12px;margin-top:16px}.closing-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:28px}.closing-copy small{font-size:10px}
  .site-footer{padding:32px 24px;gap:20px}.site-footer>a{width:100%}.site-footer nav{gap:22px}.site-footer nav a{font-size:11px}.site-footer small{width:100%}
  .purchase-main{padding:18px 24px 60px}.breadcrumbs{margin-bottom:16px;gap:12px;font-size:10px}.purchase-layout{grid-template-columns:1fr;gap:35px}.purchase-visual{position:static;padding:0}.purchase-image{height:300px;margin-bottom:5px}.purchase-visual .text-button{font-size:11px}
  .purchase-info h1{font-size:52px}.product-category{font-size:12px}.price-status{margin:24px 0 30px}.price-status strong{font-size:18px}
  .purchase-support{margin-top:65px;padding-top:35px;grid-template-columns:1fr;gap:20px}.purchase-support h2{font-size:23px}
  .cart-drawer{padding:22px}.cart-item{grid-template-columns:110px 1fr;gap:22px}.cart-thumb{padding:10px}.cart-bottom{padding-bottom:env(safe-area-inset-bottom)}
  .image-viewer{width:100%;height:100dvh;max-height:100dvh;max-width:100%;padding:16px;border-radius:0}
}
@media(max-width:360px){.product-nav{gap:10px}.product-header{padding:0 10px}.brand,.brand img{width:62px}.cart-trigger{padding:0 7px}.hero-title h1{font-size:82px}.hero-actions{gap:8px}.button{padding:13px 10px}}
@media(max-height:600px) and (min-width:701px){.hero-scene{height:650px}.art-scene{height:600px}}
/* Product motion is scrubbed by native scrolling, not page snapping. */
.scroll-story .opening{height:340svh}
.scroll-story .hero-product{transform-origin:50% 50%}
.scroll-story .details-section{height:270svh;padding:0;overflow:clip;background:#dce7ef}
.scroll-story .section-heading{position:absolute;top:40px;left:var(--edge);z-index:4;margin:0;pointer-events:none}
.scroll-story .section-heading h2{font-size:clamp(25px,3vw,44px)}
.scroll-story .detail-pair{position:sticky;top:var(--header);height:calc(100svh - var(--header));display:block;overflow:hidden;perspective:1400px}
.scroll-story .detail-pair figure{position:absolute;width:76%;height:76%;left:8%;top:16%;margin:0;will-change:transform}
.scroll-story .detail-pair .base-figure{left:20%;top:12%;width:73%;height:80%;z-index:2}
.scroll-story .detail-pair .photo-frame{height:100%;aspect-ratio:auto;box-shadow:0 24px 60px #20232930}
.scroll-story .detail-pair img{will-change:transform}
.scroll-story .detail-pair figcaption{position:absolute;left:24px;bottom:20px;padding:10px 16px;background:#eff4f8ed;border-radius:6px}
.scroll-story .detail-pair figcaption span{display:none}
@media(max-width:700px){
  .scroll-story .opening{height:310svh}
  .scroll-story .detail-pair figure{width:87%;height:62%;left:4%;top:23%}
  .scroll-story .detail-pair .base-figure{width:87%;height:64%;left:9%;top:21%}
  .scroll-story .detail-pair figcaption{left:14px;bottom:14px}
}
@media(max-height:600px){
  .scroll-story .hero-title{top:8%}.scroll-story .hero-title h1{font-size:clamp(65px,19vh,130px)}
  .scroll-story .hero-product{top:3%;height:74%}
  .scroll-story .hero-bottom{bottom:3%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}[data-parallax]{transform:none!important}}
@media(prefers-reduced-transparency:reduce){.product-header{background:var(--paper);backdrop-filter:none}dialog::backdrop{backdrop-filter:none;background:#202329e6}}
