/* basically. group: the holding house */
.g-body{background:#16120E}
.g-body main{background:var(--canvas)}
.g-house{position:relative;min-height:100svh;padding:96px 0 40px;overflow:hidden;color:#F7F0E4;background:
  radial-gradient(60% 55% at 50% 58%,rgba(241,177,46,.20),rgba(241,177,46,0) 70%),
  radial-gradient(90% 60% at 50% 110%,rgba(184,64,42,.22),rgba(184,64,42,0) 70%),
  linear-gradient(180deg,#120F0B 0%,#1F1913 55%,#16120E 100%);isolation:isolate}
.g-glow{position:absolute;left:50%;top:-10%;width:min(900px,120vw);height:80%;transform:translateX(-50%);background:conic-gradient(from 180deg at 50% 0%,transparent 160deg,rgba(255,226,170,.10) 175deg,rgba(255,226,170,.16) 180deg,rgba(255,226,170,.10) 185deg,transparent 200deg);filter:blur(18px);pointer-events:none;z-index:-1;animation:gbeam 9s var(--ease-io) infinite alternate}
@keyframes gbeam{to{opacity:.6;transform:translateX(-50%) scaleX(1.15)}}
.g-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
.g-head{position:relative;z-index:3;text-align:center;padding:0 var(--gutter)}
.g-kick{color:#F1C24B}
.g-head h1{font-family:var(--display);font-weight:900;font-size:clamp(34px,4.4vw,64px);letter-spacing:-.045em;line-height:.98;margin:14px auto 0;max-width:22ch;text-wrap:balance}
.g-head h1 em{font-style:normal;font-weight:500;color:#F1C24B}

/* stage */
.g-stage{position:relative;z-index:2;height:clamp(520px,64svh,720px);margin-top:8px;perspective:1300px;perspective-origin:50% 30%;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.g-stage.drag{cursor:grabbing}
.g-stage:focus-visible{outline:2px solid #F1C24B;outline-offset:-6px;border-radius:24px}
.g-hub{position:absolute;left:50%;top:4%;transform:translateX(-50%);z-index:400;text-decoration:none;color:#F7F0E4;animation:gbob 6s var(--ease-io) infinite alternate}
@keyframes gbob{to{transform:translate(-50%,-8px)}}
.g-hub-in{display:grid;justify-items:center;gap:4px;padding:16px 28px 14px;border-radius:999px;background:linear-gradient(180deg,rgba(255,248,236,.16),rgba(255,248,236,.05));border:1px solid rgba(255,236,200,.28);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 0 0 1px rgba(0,0,0,.2),0 20px 60px rgba(0,0,0,.45),0 0 80px rgba(241,177,46,.18),inset 0 1px 0 rgba(255,255,255,.18);transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out)}
.g-hub:hover .g-hub-in,.g-hub:focus-visible .g-hub-in{transform:scale(1.05);box-shadow:0 0 0 1px rgba(241,194,75,.6),0 24px 70px rgba(0,0,0,.5),0 0 110px rgba(241,177,46,.32),inset 0 1px 0 rgba(255,255,255,.2)}
.g-hub:focus-visible{outline:none}
.g-hub-logo{font-family:var(--display);font-weight:900;font-size:clamp(28px,3vw,40px);letter-spacing:-.055em;line-height:1}
.g-hub-logo span{font-weight:500}.g-hub-logo i{font-style:normal;color:#E0654B}
.g-hub .mono{font-size:10px;color:rgba(247,240,228,.7)}

.g-orbit{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.g-orbit .g-card{pointer-events:auto}
.g-card{--cw:min(clamp(200px,22vw,300px),34svh);all:unset;box-sizing:border-box;position:absolute;left:50%;top:25%;width:var(--cw);aspect-ratio:3/4;margin-left:calc(var(--cw) / -2);border-radius:26px;cursor:pointer;transform-style:preserve-3d;will-change:transform,filter;-webkit-tap-highlight-color:transparent}
.g-media{position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:#2A231C;box-shadow:0 40px 80px -20px rgba(0,0,0,.75),0 0 0 1px rgba(255,236,200,.14)}
.g-media img,.g-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-out),opacity .6s}
.g-card[data-i="1"] .g-media img,.g-card[data-i="1"] .g-media video{object-position:50% 50%}
.g-media video{opacity:0}
.g-media video.on{opacity:1}
.g-card.front .g-media img{transform:scale(1.05)}
.g-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,13,8,0) 45%,rgba(18,13,8,.82) 100%),linear-gradient(115deg,rgba(255,255,255,.16),rgba(255,255,255,0) 38%);pointer-events:none}
.g-cap{position:absolute;left:18px;right:18px;bottom:16px;display:grid;gap:2px;color:#F7F0E4;z-index:2;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.g-cap b{font-family:var(--display);font-size:clamp(26px,2.4vw,34px);letter-spacing:-.04em;line-height:1.05}
.g-cap>span:last-child{font-size:14px;opacity:.82}
.g-tag{justify-self:start;display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:rgba(18,13,8,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,236,200,.22);border-radius:999px;padding:5px 10px 5px 8px;margin-bottom:6px}
.g-tag i{width:7px;height:7px;border-radius:50%;background:#6FCF7A;box-shadow:0 0 0 0 rgba(111,207,122,.6);animation:gping 2s infinite}
.g-card[data-tone="sign"] .g-tag i{background:#F1C24B;box-shadow:0 0 0 0 rgba(241,194,75,.6)}
.g-card[data-tone="open"] .g-tag i{background:#E0654B;box-shadow:0 0 0 0 rgba(224,101,75,.6)}
@keyframes gping{70%{box-shadow:0 0 0 8px rgba(0,0,0,0)}100%{box-shadow:0 0 0 0 rgba(0,0,0,0)}}
.g-refl{position:absolute;left:0;right:0;top:100%;height:42%;margin-top:10px;border-radius:26px;overflow:hidden;transform:scaleY(-1);opacity:.32;-webkit-mask-image:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,0) 70%);mask-image:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,0) 70%);pointer-events:none;filter:blur(1.5px)}
.g-refl img{position:absolute;left:0;bottom:0;width:100%;height:238%;object-fit:cover}
.g-card:focus-visible .g-media{box-shadow:0 0 0 3px #F1C24B,0 40px 80px -20px rgba(0,0,0,.75)}
.g-card.front .g-media{box-shadow:0 50px 100px -24px rgba(0,0,0,.85),0 0 0 1px rgba(255,236,200,.3),0 0 90px rgba(241,177,46,.22)}

/* the open slot: blank label you can almost write on */
.g-slot .g-media{outline:1.5px dashed rgba(241,194,75,.0);outline-offset:6px;transition:outline-color .5s}
.g-slot.front .g-media{outline-color:rgba(241,194,75,.65);animation:gslot 2.4s var(--ease-io) infinite alternate}
@keyframes gslot{to{outline-offset:11px}}
.g-label{position:absolute;left:29.5%;width:42%;top:50.5%;height:18%;display:grid;place-items:center;z-index:1}
.g-type{font-family:var(--display);font-weight:800;font-size:clamp(14px,1.5vw,21px);letter-spacing:-.03em;color:#2B241D;opacity:.82;white-space:nowrap;border-right:2px solid rgba(43,36,29,.7);padding-right:2px;animation:gcaret 1s steps(1) infinite}
@keyframes gcaret{50%{border-color:transparent}}

.g-ctrl{position:absolute;left:50%;bottom:0;transform:translateX(-50%);display:flex;align-items:center;gap:14px;z-index:500}
.g-arrow{all:unset;box-sizing:border-box;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;cursor:pointer;border:1px solid rgba(255,236,200,.3);background:rgba(255,248,236,.06);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .3s,transform .35s var(--ease-out)}
.g-arrow:hover{background:rgba(255,248,236,.16);transform:scale(1.06)}
.g-arrow:focus-visible{outline:2px solid #F1C24B;outline-offset:3px}
.g-arrow svg{width:20px;height:20px;fill:none;stroke:#F7F0E4;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.g-dots{display:flex;gap:6px}
.g-dots button{all:unset;cursor:pointer;width:28px;height:44px;display:grid;place-items:center}
.g-dots button::before{content:"";width:8px;height:8px;border-radius:9px;background:rgba(247,240,228,.35);transition:width .45s var(--ease-out),background .3s}
.g-dots button[aria-selected="true"]::before{width:24px;background:#F1C24B}
.g-dots button:focus-visible::before{outline:2px solid #F1C24B;outline-offset:3px}

/* info under the stage */
.g-info{position:relative;z-index:3;max-width:640px;margin:26px auto 0;padding:0 var(--gutter);text-align:center;min-height:178px}
.g-info .mono{color:#F1C24B;font-size:11px;display:block;white-space:normal}
.g-info h2{font-family:var(--display);font-weight:900;font-size:clamp(30px,3.2vw,44px);letter-spacing:-.04em;margin:8px 0 8px;line-height:1}
.g-info p{margin:0 auto;color:rgba(247,240,228,.78);max-width:52ch;font-size:16px}
.g-info .g-acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.g-info>*{animation:ginfo .7s var(--ease-out) both}
.g-info>*:nth-child(2){animation-delay:.05s}.g-info>*:nth-child(3){animation-delay:.1s}.g-info>*:nth-child(4){animation-delay:.15s}
@keyframes ginfo{from{opacity:0;transform:translateY(10px)}}
.g-hint{position:relative;z-index:3;text-align:center;color:rgba(247,240,228,.45);font-size:10.5px;margin:18px 0 0}

/* lower sections */
.g-sec-head{max-width:760px;margin-bottom:36px}
.g-sec-head .mono{color:var(--accent)}
.g-sec-head h2{font-family:var(--display);font-weight:900;font-size:clamp(32px,4vw,56px);letter-spacing:-.04em;line-height:1;margin:12px 0 0;text-wrap:balance}
.g-sec-head .lede{margin-top:16px;color:var(--text-secondary);max-width:58ch}
.g-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.g-steps li{background:var(--panel);border:1px solid var(--line);border-radius:28px;padding:28px}
.g-steps .mono{color:var(--accent)}
.g-steps h3{font-family:var(--display);font-size:30px;letter-spacing:-.035em;margin:14px 0 8px}
.g-steps p{margin:0;color:var(--text-secondary)}
.g-join{background:var(--ink);color:#F7F0E4;padding:clamp(56px,8vw,110px) 0}
.g-join-in{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end}
.g-join .mono{color:#F1C24B}
.g-join h2{font-family:var(--display);font-weight:900;font-size:clamp(32px,4.4vw,62px);letter-spacing:-.045em;line-height:1;margin:12px 0 16px;text-wrap:balance}
.g-join p{color:rgba(247,240,228,.75);max-width:52ch;margin:0}
.g-join-cta{display:grid;gap:10px;justify-items:start}
.g-mail{color:rgba(247,240,228,.8);font-weight:700;text-decoration:none;min-height:36px;display:inline-flex;align-items:center}
.g-mail:hover{color:#F1C24B}

/* dialog */
.g-dlg{border:0;padding:0;background:transparent;max-width:min(760px,calc(100vw - 24px));width:100%;max-height:calc(100svh - 24px);color:var(--ink)}
.g-dlg::backdrop{background:rgba(12,9,6,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.g-dlg[open]{animation:gdlg .5s var(--ease-out)}
@keyframes gdlg{from{opacity:0;transform:translateY(24px) scale(.98)}}
.g-form{position:relative;background:var(--panel);border-radius:30px;padding:clamp(22px,4vw,40px);overflow:auto;max-height:calc(100svh - 24px)}
.g-form .mono{color:var(--accent)}
.g-form h2{font-family:var(--display);font-weight:900;font-size:clamp(28px,3.4vw,42px);letter-spacing:-.04em;margin:8px 0 22px;line-height:1}
.g-x{all:unset;position:sticky;top:0;float:right;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:26px;cursor:pointer;background:var(--canvas);margin:-8px -8px 0 0;z-index:2}
.g-x:focus-visible{outline:2px solid var(--accent)}
.g-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;clear:both}
.g-fields label{display:grid;gap:6px;font-size:14px;font-weight:700}
.g-fields .full{grid-column:1/-1}
.g-fields .opt{font-weight:400;color:var(--text-secondary)}
.g-fields input,.g-fields select,.g-fields textarea{font:inherit;font-weight:400;font-size:16px;color:var(--ink);background:#fff;border:1.5px solid var(--line-strong);border-radius:14px;padding:12px 14px;min-height:48px;width:100%;box-sizing:border-box}
.g-fields textarea{resize:vertical}
.g-fields :is(input,select,textarea):focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(184,64,42,.2)}
.g-fields [aria-invalid="true"]{border-color:var(--accent);background:#FFF4F1}
.g-err{color:var(--accent);font-weight:700;margin:12px 0 0;min-height:1em}
.g-form-foot{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:12px}
.g-form-foot .note{margin:0;font-size:13px;color:var(--text-secondary);max-width:40ch}
.g-ok{display:none}
.g-form.sent .g-fields,.g-form.sent .g-form-foot,.g-form.sent .g-err,.g-form.sent h2{display:none}
.g-form.sent .g-ok{display:grid;gap:10px;justify-items:start;padding:10px 0}
.g-ok b{font-family:var(--display);font-size:32px;letter-spacing:-.035em}
.g-ok span{color:var(--text-secondary);max-width:52ch}

@media (max-width:900px){
  .g-steps{grid-template-columns:1fr}
  .g-join-in{grid-template-columns:1fr}
}
@media (max-width:640px){
  .g-house{padding-top:88px}
  .g-stage{height:clamp(470px,64svh,560px)}
  .g-card{--cw:min(56vw,38svh);top:24%}
  .g-hub-in{padding:12px 20px 10px}
  .g-fields{grid-template-columns:1fr}
  .g-info{min-height:210px}
}
@media (prefers-reduced-motion:reduce){
  .g-glow,.g-hub,.g-tag i,.g-slot.front .g-media,.g-type{animation:none}
  .g-info>*{animation:none}
  .g-card.front .g-media img{transform:none}
}
.om{font-family:var(--body);font-weight:700;letter-spacing:0}