/* GEOLUME LP only. Keep all imported styles inside this page root. */
.wrapper:has(> .geolume-lp) { overflow: clip; }
.l-geolume.geolume-lp {

&{
  --bg:#000; --ink:#f5f5f7; --sub:#8e8e93; --dim:#5f5f64; --line:#26262a; --card:#111113;
  --champ:linear-gradient(100deg,#f5ecdc 0%,#dcc6a0 34%,#bfa073 66%,#efe3cb 100%);
  --gold:#d4bc93;
  --en:"Cinzel","Times New Roman",serif;
  --ja:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  --nav:100px;
}
*,*::before,*::after{box-sizing:border-box}

&{margin:0;background:var(--bg);color:var(--ink);font-family:var(--ja);font-size:17px;line-height:1.8;letter-spacing:.04em;-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

.gold{background:var(--champ);-webkit-background-clip:text;background-clip:text;color:transparent}
.en{font-family:var(--en);letter-spacing:.12em}
.wrap{width:min(1200px,100% - 48px);margin-inline:auto}
.c{text-align:center}
.eyebrow{font-family:var(--en);font-size:15px;letter-spacing:.32em;margin-bottom:18px}
.h1{font-weight:500;font-size:clamp(40px,6.4vw,92px);line-height:1.2;letter-spacing:.08em}
.h2{font-weight:500;font-size:clamp(30px,4.2vw,58px);line-height:1.35;letter-spacing:.08em}
.lead{margin-top:22px;font-size:clamp(15px,1.5vw,20px);color:var(--sub);letter-spacing:.06em}
.sec{position:relative;padding:clamp(96px,14vw,180px) 0;overflow:hidden;isolation:isolate}
.btn{display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 32px;border-radius:999px;font-size:16px;font-weight:500;letter-spacing:.12em;transition:transform .3s var(--ease),filter .3s}
.btn--gold{background:var(--champ);color:#15140f}
.btn--gold:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn--line{border:1px solid var(--gold);color:#f5ecdc;background:rgba(0,0,0,.38);backdrop-filter:blur(6px)}
.link{white-space:nowrap;color:var(--gold);font-size:17px;letter-spacing:.08em}
.link:hover{text-decoration:underline;text-underline-offset:6px}

/* neon light background */
.neon{position:absolute;inset:-6%;z-index:-1;background:var(--w) center/cover no-repeat;opacity:.78;will-change:transform;pointer-events:none}
.neon::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(0,0,0,0) 30%,rgba(0,0,0,.55) 100%)}
@media (max-width:760px){.neon{background-image:var(--t)}}

/* ===== hero ===== */
.hero .eyebrow{font-size:clamp(22px,2.2vw,32px);font-weight:600;letter-spacing:.42em;padding-left:.42em;margin-bottom:20px;filter:drop-shadow(0 0 14px rgba(220,198,160,.45)) drop-shadow(0 0 2px rgba(245,236,220,.35))}
.hero{position:relative;height:220vh}
.hero__stage{position:sticky;top:var(--nav);height:calc(100vh - var(--nav));overflow:hidden;display:flex;flex-direction:column;align-items:center}
.hero__head{padding-top:clamp(28px,6vh,72px);text-align:center;z-index:2}
.hero__links{display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:center;margin-top:18px}
.hero__media{position:absolute;left:50%;bottom:0;width:100vw;height:62vh;transform-origin:50% 100%;overflow:hidden;will-change:transform,border-radius}
.hero__media img{width:100%;height:100%;object-fit:cover}
.hero__media::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(transparent,rgba(0,0,0,.7))}
.hero__cap{position:absolute;left:0;right:0;bottom:7vh;text-align:center;font-family:var(--en);font-size:clamp(22px,3.6vw,52px);letter-spacing:.14em;z-index:3;text-shadow:0 2px 24px rgba(0,0,0,.4)}
@media (max-width:576px){.hero__media img{object-position: 60%;}}

/* ===== statement ===== */
.st{position:relative;overflow:hidden;isolation:isolate;padding:clamp(120px,18vw,240px) 0}
.st p{font-weight:500;font-size:clamp(26px,3.8vw,52px);line-height:1.55;letter-spacing:.06em;max-width:18em}
.st .ch{opacity:.16;transition:opacity .12s linear}

/* ===== 3D panel ===== */
.p3d{position:relative;height:640vh}
.p3d__stage{position:sticky;top:var(--nav);height:calc(100vh - var(--nav));overflow:hidden;isolation:isolate}
.p3d__stage .neon{opacity:.55}
#gl{position:absolute;inset:0;width:100%;height:100%;display:block}
.p3d__fallback{position:absolute;inset:12% 10%;background:url(../../images/geolume/cg-exploded.jpg) center/contain no-repeat;display:none}
&:not(.has-webgl) .p3d__fallback{display:block}
.p3d__head{position:absolute;top:clamp(20px,5vh,56px);left:0;right:0;text-align:center;z-index:3;pointer-events:none}
.p3d__head h2{transition:opacity .6s var(--ease),transform .6s var(--ease)}
.p3d__cap{position:absolute;left:0;right:0;bottom:clamp(24px,6vh,64px);text-align:center;z-index:3;pointer-events:none;min-height:64px}
.p3d__cap p{position:absolute;left:0;right:0;opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease);font-size:clamp(15px,1.5vw,19px);color:#d2d2d7;letter-spacing:.1em}
.p3d__cap p.on{opacity:1;transform:none}
.p3d__cap b{font-family:var(--en);font-weight:400;color:var(--gold);margin-right:14px;letter-spacing:.2em}
.p3d__big{position:absolute;left:clamp(16px,7vw,120px);top:50%;transform:translateY(-50%);font-family:var(--en);font-size:clamp(56px,10vw,150px);line-height:1;letter-spacing:.04em;z-index:3;opacity:0;transition:opacity .6s var(--ease);pointer-events:none}
.p3d__big small{font-size:.38em;letter-spacing:.1em}
.p3d__big.on{opacity:1}
.p3d__note{position:absolute;right:clamp(16px,7vw,120px);top:50%;transform:translateY(-50%);width:min(300px,30vw);font-size:15px;color:var(--sub);z-index:3;opacity:0;transition:opacity .6s var(--ease)}
.p3d__note b{color:var(--ink);font-weight:500}
.p3d__note.on{opacity:1}
.tag{position:absolute;left:0;top:0;z-index:4;display:flex;flex-direction:column;gap:2px;font-size:15px;white-space:nowrap;opacity:0;transition:opacity .5s;pointer-events:none}
.tag i{font-size:22px}
#leaders{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;opacity:0;transition:opacity .5s}
#leaders.on{opacity:1}
#leaders line{stroke:url(#lg);stroke-width:1}
#leaders circle{fill:#f5ecdc}
.tag i{font-style:normal;font-family:var(--en);color:var(--gold);letter-spacing:.14em}
.tag.on{opacity:1}
.p3d__bar{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);width:120px;height:2px;background:rgba(255,255,255,.12);z-index:3;border-radius:2px;overflow:hidden}
.p3d__bar i{display:block;height:100%;width:100%;background:var(--champ);transform-origin:0 50%;transform:scaleX(0)}

/* ===== on / off ===== */
.oo{position:relative;height:260vh}
.oo__stage{position:sticky;top:var(--nav);height:calc(100vh - var(--nav));overflow:hidden}
.oo__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.oo__img--on{clip-path:inset(0 0 0 100%)}
.oo__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.66),rgba(0,0,0,.08) 60%)}
.oo__wipe{position:absolute;top:0;bottom:0;left:100%;width:2px;background:linear-gradient(transparent,#fff,transparent);box-shadow:0 0 30px 6px rgba(150,200,255,.55);opacity:.9}
.oo__txt{position:absolute;left:clamp(20px,8vw,140px);top:50%;transform:translateY(-50%)}
.oo__k{position:relative;height:1.1em;font-family:var(--en);font-size:clamp(64px,10vw,150px);line-height:1}
.oo__k span,.oo__t span{position:absolute;left:0;top:0;white-space:nowrap;transition:opacity .5s var(--ease),transform .5s var(--ease)}
.oo__t{position:relative;height:1.6em;margin-top:22px;font-size:clamp(24px,3vw,44px);font-weight:500;letter-spacing:.1em}
.oo [data-s="on"]{opacity:0;transform:translateY(24px)}
.oo.is-on [data-s="off"]{opacity:0;transform:translateY(-24px)}
.oo.is-on [data-s="on"]{opacity:1;transform:none}
.oo__ttl{position:absolute;top:clamp(20px,5vh,48px);left:0;right:0;text-align:center}
@media (max-width:576px){.oo__img{object-position: 84%;}}

/* ===== structure ===== */
.str__big{position:relative;margin-top:64px;border-radius:28px;overflow:hidden;background:#eef0f3}
.str__big img{width:100%;aspect-ratio:16/9;object-fit:cover;transform:scale(1.15)}
.layers{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px}
.layers li{border-top:1px solid var(--line);padding-top:16px}
.layers b{display:block;font-family:var(--en);font-weight:400;font-size:26px}
.layers span{font-size:15px}
.cards2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:56px}
.card{background:var(--card);border-radius:28px;overflow:hidden}
.card__img{overflow:hidden;aspect-ratio:16/9}
.card__img img{width:100%;height:120%;object-fit:cover;will-change:transform}
.card__body{padding:32px 36px 36px}
.card__body h3{font-weight:500;font-size:24px;letter-spacing:.08em}
.card__body p{margin-top:10px;font-size:15px;color:var(--sub)}

/* ===== collection (horizontal) ===== */
.hz{position:relative}
.hz__stage{position:sticky;top:var(--nav);height:calc(100vh - var(--nav));overflow:hidden}
.hz__track{display:flex;height:100%;will-change:transform}
.col{position:relative;flex:0 0 100vw;height:100%;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:6vw;padding:0 max(24px,calc((100vw - 1200px)/2))}
.col__img{border-radius:28px;overflow:hidden;height:min(70vh,640px)}
.col__img img{width:100%;height:100%;object-fit:cover}
.col__no{font-family:var(--en);font-size:14px;letter-spacing:.3em;color:var(--sub)}
.col__name{margin-top:8px;font-family:var(--en);font-weight:400;font-size:clamp(48px,6vw,88px);line-height:1.1;letter-spacing:.06em}
.col__ja{margin-top:6px;color:var(--sub);font-size:15px}
.col__d{margin-top:22px;font-size:clamp(16px,1.5vw,20px);line-height:1.9}
.col__p{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);font-size:14px;color:var(--sub)}
.col__p b{font-family:var(--en);font-weight:400;font-size:26px;color:var(--ink);margin:0 6px}
.col__bg{position:absolute;right:3vw;bottom:-0.12em;font-family:var(--en);font-size:clamp(120px,19vw,300px);line-height:1;letter-spacing:.04em;opacity:.12;z-index:-1;pointer-events:none;white-space:nowrap}
.hz__head{position:absolute;top:clamp(20px,5vh,48px);left:0;right:0;text-align:center;z-index:2;pointer-events:none}
.hz__dots{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:2}
.hz__dots i{width:28px;height:2px;background:rgba(255,255,255,.2)}
.hz__dots i.on{background:var(--gold)}

/* gallery */
.gal__track{display:flex;gap:24px;align-items:center;height:100%;padding-left:100vw;will-change:transform}
.gal__item{flex:0 0 auto;width:min(46vw,640px)}
.gal__item img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:24px}
.gal__item h3{margin-top:18px;font-weight:500;font-size:20px;letter-spacing:.08em}
.gal__item p{font-size:14px;color:var(--sub)}
.gal .hz__stage{display:flex;flex-direction:column}
.gal .hz__head{position:relative;top:auto;padding-top:clamp(28px,6vh,64px)}
.gal__track{flex:1}

/* ===== numbers ===== */
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:72px}
.num{background:rgba(17,17,19,.78);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.06);border-radius:28px;padding:40px 36px;transform:translateY(40px);opacity:0;transition:transform 1s var(--ease),opacity 1s var(--ease)}
.num.in{transform:none;opacity:1}
.num dt{font-size:15px;color:#c7c7cc}
.num dd{margin-top:18px;font-family:var(--en);font-size:clamp(56px,6vw,84px);line-height:1;letter-spacing:.02em}
.num dd small{font-size:.36em;margin-left:6px;letter-spacing:.1em}
.num p{margin-top:14px;font-size:14px;color:var(--sub)}
.qrow{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:56px}
.qrow li{border-top:1px solid var(--line);padding-top:22px}
.qrow svg{width:30px;height:30px;color:var(--gold)}
.qrow b{display:block;margin-top:12px;font-weight:500}
.qrow p{font-size:13px;color:var(--sub);line-height:1.7}
.note{margin-top:32px;font-size:12px;color:var(--dim)}

/* ===== cast ===== */
.dev{perspective:1600px;margin-top:72px}
.dev__body{width:min(1000px,100%);margin:0 auto;transform-origin:50% 100%;will-change:transform}
.dev__screen{background:#1b1b1d;border:1px solid #3a3a3d;border-radius:20px;padding:14px}
.dev__screen img{width:100%;aspect-ratio:16/9;object-fit:contain;background:#f5f5f7;border-radius:8px}
.dev__base{height:16px;margin:0 -5%;border-radius:0 0 18px 18px;background:linear-gradient(#4a4a4d,#1a1a1c)}
.cast__row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:56px}
.panel{background:rgba(17,17,19,.82);border:1px solid rgba(255,255,255,.06);border-radius:28px;padding:36px}
.stb{display:flex;flex-direction:column;align-items:center;text-align:center}
.stb img{width:min(320px,80%);filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
.stb b{margin-top:18px;font-weight:500;font-size:19px}
.stb p{font-size:14px;color:var(--sub)}
.feat li{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);font-size:16px}
.feat li:last-child{border:0}
.feat svg{width:24px;height:24px;color:var(--gold);flex:none}
.feat span{margin-left:auto;font-size:11px;color:var(--gold);border:1px solid var(--gold);border-radius:999px;padding:1px 10px}

/* ===== price ===== */
.prices{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:72px}
.price{display:flex;flex-direction:column}
.price .k{font-family:var(--en);color:var(--gold);letter-spacing:.2em;font-size:14px}
.price h3{margin-top:6px;font-weight:500;font-size:24px;letter-spacing:.06em}
.price ul{margin-top:24px}
.price li{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0;border-top:1px solid var(--line);font-size:15px;color:#d2d2d7}
.price li b{font-family:var(--en);font-weight:400;font-size:22px;color:var(--ink);letter-spacing:.04em}
.price li b small{font-family:var(--ja);font-size:12px;color:var(--sub);margin-left:3px;letter-spacing:0}
.price .n{margin-top:auto;padding-top:20px;font-size:12px;color:var(--dim)}

/* ===== cta ===== */
.cta{position:relative;height:100vh;min-height:620px;overflow:hidden;display:grid;place-items:center;text-align:center}
.cta__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.25);will-change:transform}
.cta::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at center,rgba(0,0,0,.5),rgba(0,0,0,.2) 70%)}
.cta__in{position:relative;z-index:2;padding:0 20px}
.cta .lead{color:#e5e5ea}
.cta__btns{display:flex;justify-content:center;gap:16px;margin-top:40px;flex-wrap:wrap}

/* ===== footer ===== */
.ft{background:#0d0d0e;padding:40px 0 48px;font-size:12px;color:var(--sub);line-height:1.9}
.ft__row{display:flex;justify-content:space-between;gap:16px;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}


/* reveal */
.rv{opacity:0;transform:translateY(32px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}

/* ===== responsive ===== */
@media (max-width:1024px){.layers,.qrow{grid-template-columns:1fr 1fr}.nums{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  &{font-size:15px}
  .ln__r a:not(.ln__b){display:none}
  .hero__media{height:52vh}
  .p3d__big{left:20px;top:auto;bottom:120px;transform:none}
  .p3d__note{display:none}
  .p3d__head h2{font-size:21px;letter-spacing:.02em}
  .hero .h1{font-size:34px;letter-spacing:.04em}
  .col__bg{display:none}
  .oo__txt{left:20px}
  .hz__head .h2{font-size:24px}
  .tag{font-size:12px}.tag i{font-size:16px}
  .col{grid-template-columns:1fr;gap:24px;align-content:center;padding:0 20px}
  .col__img{height:42vh}
  .col__d{font-size:15px}
  .gal__item{width:76vw}
  .cards2,.cast__row,.prices,.nums{grid-template-columns:1fr}
  .layers{grid-template-columns:1fr 1fr;gap:12px}
  .qrow{grid-template-columns:1fr 1fr;gap:28px 16px}
  .panel{padding:24px}
  .card__body{padding:24px}
  .ft__row{flex-direction:column}
  .cta__btns .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  
  .rv,.num{opacity:1;transform:none;transition:none}
}


  & { padding-top: var(--nav); font-weight: 400; }
  & section[id] { scroll-margin-top: var(--nav); }
  @media (max-width: 768px) { & { --nav: 54px; } }
  /* Static layout remains readable if JS/WebGL is unavailable or motion is reduced. */
  &:not(.has-motion) {
    .rv, .num { opacity: 1; transform: none; }
    .hero, .p3d, .oo, .hz { height: auto; }
    .hero__stage, .p3d__stage, .oo__stage, .hz__stage { position: relative; top: auto; height: auto; }
    .hero__head { padding: 48px 24px 32px; }
    .hero__media { position: relative; left: auto; width: 100%; height: 60vh; transform: none; }
    .hero__cap { bottom: 4vh; }
    .p3d__stage { min-height: 80vh; }
    .oo__stage { min-height: 80vh; }
    .oo__img--on { clip-path: inset(0 0 0 50%); }
    .oo__txt { top: auto; bottom: 30px; transform: none; }
    .oo__k { min-width: 4em; }
    .hz__track, .gal__track { display: grid; height: auto; padding: 0; gap: 48px; }
    .hz__head { position: relative; top: auto; padding: 48px 24px; }
    .col { min-width: 0; padding-block: 24px; }
    .col__img { height: min(60vh, 600px); }
    .gal__track { width: min(1200px, 100% - 48px); margin-inline: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gal__item { width: 100%; }
    .hz__dots, .p3d__bar { display: none; }
    @media (max-width: 760px) { .gal__track { grid-template-columns: 1fr; } }
  }
  /* Tall copy must fit below the shared WP header on small/landscape screens. */
  @media (max-width: 760px) {
    .col { gap: 12px; padding-top: 100px; padding-bottom: 44px; }
    .col__img { height: min(30vh, 260px); }
    .col__name { font-size: 38px; }
    .col__d { margin-top: 10px; font-size: 14px; }
    .col__p { margin-top: 12px; padding-top: 10px; }
    .hero__head { padding-inline: 20px; }
  }
}