/* =========================================================
   森ふゆこ 投資コミュニティ — landing stylesheet
   palette: indigo / violet primary, emerald secondary, amber accent
   ========================================================= */

/* ---------- tokens ---------- */
:root{
    --c-ind:#6366f1;
    --c-ind-d:#4f46e5;
    --c-ind-l:#818cf8;
    --c-vio:#764ba2;
    --c-vio-l:#8b5cf6;
    --g-main:linear-gradient(135deg,#667eea 0%,#764ba2 100%);
    --g-soft:linear-gradient(135deg,#818cf8 0%,#a78bfa 100%);

    --c-em:#10b981;
    --c-em-d:#059669;
    --c-em-l:#34d399;

    --c-am:#f59e0b;
    --c-am-l:#fbbf24;

    --n-0:#ffffff;
    --n-50:#f9fafb;
    --n-100:#f3f4f6;
    --n-200:#e5e7eb;
    --n-300:#d1d5db;
    --n-400:#9ca3af;
    --n-500:#6b7280;
    --n-600:#4b5563;
    --n-700:#374151;
    --n-800:#1f2937;
    --n-900:#111827;

    --t-1:#1f2937;
    --t-2:#6b7280;
    --t-3:#9ca3af;

    --bg-1:#ffffff;
    --bg-2:#f9fafb;

    --sh-1:0 1px 2px rgba(17,24,39,.06);
    --sh-2:0 6px 18px -6px rgba(79,70,229,.16),0 2px 6px rgba(17,24,39,.05);
    --sh-3:0 18px 40px -14px rgba(79,70,229,.28),0 6px 14px rgba(17,24,39,.06);
    --sh-4:0 34px 70px -22px rgba(79,70,229,.38);

    --r-s:.5rem;
    --r-m:.9rem;
    --r-l:1.35rem;
    --r-x:2rem;
    --r-pill:999px;

    --f-jp:'Zen Kaku Gothic New','Hiragino Kaku Gothic ProN','Yu Gothic',system-ui,sans-serif;
    --f-en:'Manrope',system-ui,sans-serif;

    --ease:cubic-bezier(.22,.85,.3,1);
    --shell:1180px;
}

/* ---------- reset ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
    font-family:var(--f-jp);
    font-size:16px;
    line-height:1.75;
    color:var(--t-1);
    background:var(--bg-1);
    overflow-x:hidden;
    padding-bottom:104px;
}
img{display:block;max-width:100%;height:auto}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4{line-height:1.32;font-weight:700;letter-spacing:.01em}
p{color:var(--t-2)}
b,strong{font-weight:700;color:var(--t-1)}
::selection{background:rgba(99,102,241,.22)}

.shell{width:100%;max-width:var(--shell);margin-inline:auto;padding-inline:24px}

/* ---------- icon system (inline SVG sprite) ---------- */
.ic-sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{
    width:1em;height:1em;
    display:inline-block;
    flex:none;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
    vertical-align:-.14em;
    overflow:visible;
}

/* ---------- reveal ---------- */
[data-rise]{
    opacity:0;
    transform:translate3d(0,26px,0);
    transition:opacity .7s var(--ease),transform .7s var(--ease);
    transition-delay:var(--d,0ms);
    will-change:opacity,transform;
}
[data-rise].is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
    [data-rise]{opacity:1;transform:none;transition:none}
    *{animation-duration:.001ms!important;animation-iteration-count:1!important}
}

/* ---------- reading bar ---------- */
.reading-bar{
    position:fixed;inset:0 0 auto 0;height:3px;z-index:1200;
    background:transparent;pointer-events:none;
}
.reading-bar span{
    display:block;height:100%;width:0;
    background:linear-gradient(90deg,var(--c-ind) 0%,var(--c-vio-l) 55%,var(--c-em) 100%);
    box-shadow:0 0 12px rgba(99,102,241,.7);
    transition:width .12s linear;
}

/* =========================================================
   header
   ========================================================= */
.topbar{
    position:fixed;top:0;left:0;right:0;z-index:1100;
    transition:background .35s var(--ease),box-shadow .35s var(--ease),backdrop-filter .35s;
}
.topbar__in{
    height:72px;
    display:flex;align-items:center;justify-content:space-between;gap:20px;
    transition:height .35s var(--ease);
}
.topbar.is-stuck{
    background:rgba(255,255,255,.82);
    -webkit-backdrop-filter:saturate(180%) blur(14px);
    backdrop-filter:saturate(180%) blur(14px);
    box-shadow:0 1px 0 rgba(17,24,39,.06),0 10px 30px -22px rgba(79,70,229,.5);
}
.topbar.is-stuck .topbar__in{height:62px}

.mark{display:inline-flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.02em}
.mark__glyph{
    width:36px;height:36px;border-radius:11px;
    display:grid;place-items:center;
    background:var(--g-main);color:#fff;font-size:19px;
    box-shadow:0 6px 16px -6px rgba(102,126,234,.9);
    position:relative;overflow:hidden;
}
.mark__glyph::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);
    transform:translateX(-120%);
    animation:sweep 4.5s var(--ease) infinite;
}
@keyframes sweep{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.mark__txt{font-size:15.5px}
.mark--light .mark__txt{color:#fff}

.menu{display:flex;align-items:center;gap:6px}
.menu a{
    position:relative;padding:8px 14px;border-radius:var(--r-pill);
    font-size:14.5px;font-weight:500;color:var(--t-2);
    transition:color .25s var(--ease),background .25s var(--ease);
}
.menu a::after{
    content:"";position:absolute;left:50%;bottom:3px;translate:-50% 0;
    width:0;height:2px;border-radius:2px;background:var(--g-main);
    transition:width .3s var(--ease);
}
.menu a:hover{color:var(--c-ind-d);background:rgba(99,102,241,.07)}
.menu a:hover::after{width:22px}

/* =========================================================
   hero
   ========================================================= */
.hero{
    position:relative;
    padding:150px 0 0;
    overflow:hidden;
    isolation:isolate;
    background:
        radial-gradient(1100px 620px at 78% 8%,rgba(129,140,248,.20),transparent 62%),
        radial-gradient(820px 520px at 8% 62%,rgba(167,139,250,.18),transparent 60%),
        linear-gradient(180deg,#fbfbff 0%,#f6f5ff 46%,#ffffff 100%);
}
.hero__aurora,.join__aurora{position:absolute;inset:0;z-index:-2;pointer-events:none}
.blob{
    position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;
    animation:float-blob 17s ease-in-out infinite;
}
.blob--a{width:440px;height:440px;top:-90px;right:-70px;background:radial-gradient(circle,#818cf8,transparent 68%)}
.blob--b{width:380px;height:380px;bottom:6%;left:-110px;background:radial-gradient(circle,#a78bfa,transparent 68%);animation-delay:-6s}
.blob--c{width:300px;height:300px;top:44%;right:32%;background:radial-gradient(circle,#34d399,transparent 70%);opacity:.28;animation-delay:-11s}
@keyframes float-blob{
    0%,100%{transform:translate3d(0,0,0) scale(1)}
    33%{transform:translate3d(28px,-34px,0) scale(1.08)}
    66%{transform:translate3d(-24px,22px,0) scale(.95)}
}
.hero__mesh{
    position:absolute;inset:0;z-index:-1;pointer-events:none;
    background-image:
        linear-gradient(rgba(99,102,241,.075) 1px,transparent 1px),
        linear-gradient(90deg,rgba(99,102,241,.075) 1px,transparent 1px);
    background-size:56px 56px;
    -webkit-mask-image:radial-gradient(ellipse 78% 62% at 50% 32%,#000 12%,transparent 76%);
    mask-image:radial-gradient(ellipse 78% 62% at 50% 32%,#000 12%,transparent 76%);
}

.hero__grid{
    display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center;
    padding-bottom:74px;
}

.pill{
    display:inline-flex;align-items:center;gap:8px;
    padding:7px 16px 7px 13px;border-radius:var(--r-pill);
    font-size:13px;font-weight:700;letter-spacing:.06em;
    color:var(--c-ind-d);
    background:rgba(255,255,255,.85);
    border:1px solid rgba(99,102,241,.28);
    box-shadow:0 8px 22px -14px rgba(79,70,229,.9);
    -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.pill .ic{font-size:15px;color:var(--c-am);animation:twinkle 2.6s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.86)}}

.hero__title{
    margin:22px 0 20px;
    font-size:clamp(2.1rem,4.6vw,3.6rem);
    font-weight:900;
    line-height:1.24;
    letter-spacing:-.01em;
}
.ink{
    font-style:normal;position:relative;display:inline-block;padding-inline:2px;
}
.ink::after{
    content:"";position:absolute;left:0;right:0;bottom:.08em;height:.32em;z-index:-1;
    background:linear-gradient(90deg,rgba(251,191,36,.55),rgba(52,211,153,.42));
    border-radius:4px;
    transform:scaleX(0);transform-origin:left;
    animation:underswipe 1s .55s var(--ease) forwards;
}
@keyframes underswipe{to{transform:scaleX(1)}}
.shine{
    background:linear-gradient(100deg,#4338ca 0%,#6d28d9 22%,#7c3aed 38%,#4f46e5 58%,#047857 100%);
    background-size:280% 100%;
    -webkit-background-clip:text;background-clip:text;
    color:transparent;
    animation:shine-run 7s linear infinite;
}
@keyframes shine-run{to{background-position:280% 0}}

.hero__lead{font-size:clamp(.95rem,1.45vw,1.06rem);line-height:1.95;color:var(--t-2)}
.hero__lead b{
    background:linear-gradient(transparent 62%,rgba(52,211,153,.32) 62%);
    padding-bottom:1px;
}

.figs{display:flex;align-items:stretch;gap:8px;margin:30px 0 26px;flex-wrap:wrap}
.fig{min-width:96px}
.fig__n{
    font-family:var(--f-en);font-weight:800;
    font-size:clamp(1.35rem,2.6vw,1.85rem);
    line-height:1.2;
    background:var(--g-main);-webkit-background-clip:text;background-clip:text;color:transparent;
    letter-spacing:-.01em;
}
.fig__k{font-size:12.5px;color:var(--t-3);letter-spacing:.03em}
.fig__sep{width:1px;background:linear-gradient(180deg,transparent,var(--n-200),transparent);margin-inline:10px}

.gifttag{
    display:inline-flex;align-items:center;gap:10px;
    padding:12px 20px;border-radius:var(--r-pill);
    font-size:14px;font-weight:700;color:var(--c-em-d);
    background:linear-gradient(135deg,rgba(16,185,129,.10),rgba(52,211,153,.05));
    border:1px dashed rgba(16,185,129,.45);
}
.gifttag .ic{font-size:17px}

/* hero art */
.hero__art{position:relative;display:grid;place-items:center;min-height:420px}
.orb{position:relative;width:min(360px,80vw);text-align:center;transform-style:preserve-3d}
.orb__ring{
    position:absolute;left:50%;top:-11px;translate:-50% 0;
    width:calc(min(300px,68vw) + 22px);aspect-ratio:1;border-radius:50%;
    background:conic-gradient(from 0deg,#6366f1,#a78bfa,#34d399,#fbbf24,#6366f1);
    filter:blur(2px);opacity:.85;
    animation:spin 9s linear infinite;
}
@keyframes spin{to{rotate:360deg}}
.orb__photo{
    position:relative;
    width:min(300px,68vw);aspect-ratio:1;margin:0 auto;
    border-radius:50%;overflow:hidden;
    border:7px solid #fff;
    box-shadow:var(--sh-4);
}
.orb__photo img{width:100%;height:100%;object-fit:cover}
.orb__name{
    position:relative;margin-top:-28px;padding:38px 24px 22px;
    background:rgba(255,255,255,.86);
    -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
    border:1px solid rgba(255,255,255,.9);
    border-radius:var(--r-x);
    box-shadow:var(--sh-3);
}
.orb__name h3{font-size:1.28rem;font-weight:900}
.orb__name p{font-size:13.5px;color:var(--t-2);margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.chips span{
    font-size:11.5px;font-weight:700;letter-spacing:.02em;
    padding:5px 12px;border-radius:var(--r-pill);
    color:var(--c-ind-d);
    background:linear-gradient(135deg,rgba(99,102,241,.12),rgba(167,139,250,.12));
    border:1px solid rgba(99,102,241,.2);
}

.drift{
    position:absolute;z-index:3;
    display:inline-flex;align-items:center;gap:8px;
    padding:10px 16px;border-radius:var(--r-pill);
    font-size:13px;font-weight:700;white-space:nowrap;
    background:rgba(255,255,255,.92);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    box-shadow:var(--sh-3);
    border:1px solid rgba(255,255,255,.9);
    animation:bob 6s ease-in-out infinite;
}
.drift .ic{font-size:16px}
.drift--1{top:6%;left:-4%;color:var(--c-em-d);animation-delay:-.4s}
.drift--2{top:46%;right:-6%;color:var(--c-ind-d);animation-delay:-2.4s}
.drift--3{bottom:7%;left:2%;color:var(--c-am);animation-delay:-4.2s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}

/* ticker */
.ticker{
    position:relative;
    margin-top:8px;
    padding:14px 0;
    background:var(--g-main);
    overflow:hidden;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
.ticker__row{
    display:flex;align-items:center;gap:26px;width:max-content;
    animation:slide-left 34s linear infinite;
}
.ticker__row span{
    font-family:var(--f-jp);font-size:13.5px;font-weight:700;letter-spacing:.1em;
    color:rgba(255,255,255,.95);white-space:nowrap;
}
.ticker__row i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5)}
@keyframes slide-left{to{transform:translateX(-50%)}}

/* =========================================================
   section shell
   ========================================================= */
.slab{padding:96px 0;position:relative}
.slab--tint{
    background:
        radial-gradient(720px 420px at 12% 0%,rgba(99,102,241,.08),transparent 60%),
        radial-gradient(680px 400px at 92% 100%,rgba(16,185,129,.07),transparent 60%),
        var(--bg-2);
}

.lead{text-align:center;max-width:660px;margin:0 auto 58px}
.kicker{
    display:inline-block;margin-bottom:12px;
    font-family:var(--f-en);font-size:11.5px;font-weight:800;letter-spacing:.28em;
    color:var(--c-ind);
}
.kicker::before{content:"";display:inline-block;width:26px;height:1.5px;background:var(--g-main);vertical-align:middle;margin-right:10px;border-radius:2px}
.lead h2{
    font-size:clamp(1.6rem,3.4vw,2.5rem);font-weight:900;letter-spacing:-.005em;
    margin-bottom:12px;
}
.lead p{font-size:15px}

/* =========================================================
   about
   ========================================================= */
.about__grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:64px;align-items:center}
.about__visual{position:relative}
.frame{
    position:relative;border-radius:var(--r-x);overflow:hidden;
    box-shadow:var(--sh-4);
    transform-style:preserve-3d;
    transition:transform .5s var(--ease);
}
.frame img{width:100%;height:100%;object-fit:cover}
.frame__glare{
    position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(125deg,rgba(255,255,255,.42) 0%,transparent 34%,transparent 66%,rgba(118,75,162,.16) 100%);
}
.stamp{
    position:absolute;z-index:4;
    display:inline-flex;align-items:center;gap:8px;
    padding:11px 17px;border-radius:var(--r-pill);
    font-size:12.5px;font-weight:800;white-space:nowrap;
    background:#fff;box-shadow:var(--sh-3);
    animation:bob 7s ease-in-out infinite;
}
.stamp .ic{font-size:16px}
.stamp--1{top:34%;right:-26px;color:var(--c-am)}
.stamp--2{bottom:30px;left:-26px;color:#e0245e;animation-delay:-3s}

.road{position:relative;padding-left:8px}
.road::before{
    content:"";position:absolute;left:29px;top:16px;bottom:16px;width:2px;
    background:linear-gradient(180deg,var(--c-ind),var(--c-vio-l),rgba(16,185,129,.6));
    border-radius:2px;
    transform:scaleY(var(--road,0));transform-origin:top;
    transition:transform 1.1s var(--ease);
}
.road__step{position:relative;display:flex;gap:22px;padding:0 0 34px 0}
.road__step:last-child{padding-bottom:0}
.road__dot{
    position:relative;z-index:2;flex:none;
    width:58px;height:58px;border-radius:19px;
    display:grid;place-items:center;font-size:22px;color:#fff;
    background:var(--g-main);
    box-shadow:0 14px 28px -14px rgba(79,70,229,.95);
    transition:transform .4s var(--ease),box-shadow .4s var(--ease);
}
.road__step:nth-child(2) .road__dot{background:linear-gradient(135deg,#8b5cf6,#a78bfa)}
.road__step:nth-child(3) .road__dot{background:linear-gradient(135deg,#10b981,#34d399);box-shadow:0 14px 28px -14px rgba(5,150,105,.9)}
.road__step:nth-child(4) .road__dot{background:linear-gradient(135deg,#f59e0b,#fbbf24);box-shadow:0 14px 28px -14px rgba(217,119,6,.9)}
.road__step:hover .road__dot{transform:translateY(-4px) rotate(-6deg)}
.road__body{
    flex:1;padding:16px 22px;border-radius:var(--r-l);
    background:#fff;border:1px solid var(--n-100);
    box-shadow:var(--sh-1);
    transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s var(--ease);
}
.road__step:hover .road__body{transform:translateX(6px);box-shadow:var(--sh-2);border-color:rgba(99,102,241,.28)}
.road__body h4{font-size:1.04rem;margin-bottom:2px}
.road__body p{font-size:14px;margin:0}

/* =========================================================
   benefits
   ========================================================= */
.deck{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.perk{
    position:relative;isolation:isolate;overflow:hidden;
    padding:34px 28px 30px;border-radius:var(--r-x);
    background:#fff;
    border:1px solid var(--n-100);
    box-shadow:var(--sh-1);
    transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease);
}
.perk::before{
    content:"";position:absolute;left:0;right:0;top:0;height:3px;
    background:var(--g-main);
    transform:scaleX(0);transform-origin:left;
    transition:transform .5s var(--ease);
}
.perk__glow{
    position:absolute;inset:-1px;z-index:-1;pointer-events:none;opacity:0;
    background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(99,102,241,.16),transparent 62%);
    transition:opacity .35s var(--ease);
}
.perk:hover{transform:translateY(-8px);box-shadow:var(--sh-3);border-color:rgba(99,102,241,.28)}
.perk:hover::before{transform:scaleX(1)}
.perk:hover .perk__glow{opacity:1}
.perk__ico{
    width:60px;height:60px;border-radius:20px;
    display:grid;place-items:center;margin-bottom:18px;
    font-size:26px;color:#fff;
    background:var(--g-main);
    box-shadow:0 14px 30px -16px rgba(79,70,229,1);
    transition:transform .45s var(--ease);
}
.perk:nth-child(2) .perk__ico{background:linear-gradient(135deg,#8b5cf6,#c084fc)}
.perk:nth-child(3) .perk__ico{background:linear-gradient(135deg,#10b981,#34d399)}
.perk:nth-child(4) .perk__ico{background:linear-gradient(135deg,#f59e0b,#fbbf24)}
.perk:nth-child(5) .perk__ico{background:linear-gradient(135deg,#4f46e5,#818cf8)}
.perk:nth-child(6) .perk__ico{background:linear-gradient(135deg,#059669,#6ee7b7)}
.perk:hover .perk__ico{transform:translateY(-3px) rotate(-7deg) scale(1.05)}
.perk h3{font-size:1.12rem;margin-bottom:10px}
.perk p{font-size:14px;line-height:1.8;margin-bottom:18px}
.perk__tag{
    display:inline-flex;align-items:center;gap:7px;
    padding:6px 14px;border-radius:var(--r-pill);
    font-size:12px;font-weight:800;color:var(--c-ind-d);
    background:rgba(99,102,241,.09);
    border:1px solid rgba(99,102,241,.18);
}
.perk__tag .ic{font-size:14px}

/* =========================================================
   themes
   ========================================================= */
.theme{
    display:grid;grid-template-columns:1fr 1.12fr;gap:56px;align-items:center;
    padding:44px 0;
}
.theme--flip .theme__text{order:2}
.theme--flip .theme__shot{order:1}
.theme__no{
    display:block;
    font-family:var(--f-en);font-size:3.4rem;font-weight:800;line-height:1;
    color:transparent;-webkit-text-stroke:1.5px rgba(99,102,241,.32);
    margin-bottom:6px;
}
.theme__ico{
    width:54px;height:54px;border-radius:17px;
    display:grid;place-items:center;margin-bottom:16px;
    font-size:24px;color:#fff;background:var(--g-main);
    box-shadow:0 14px 30px -16px rgba(79,70,229,1);
}
.theme:nth-of-type(2) .theme__ico{background:linear-gradient(135deg,#10b981,#34d399)}
.theme:nth-of-type(3) .theme__ico{background:linear-gradient(135deg,#f59e0b,#fbbf24)}
.theme__text h3{font-size:clamp(1.28rem,2.4vw,1.7rem);font-weight:900;margin-bottom:10px}
.theme__text > p{font-size:14.5px;line-height:1.9;margin-bottom:18px}
.ticks{display:grid;gap:10px}
.ticks li{
    display:flex;align-items:center;gap:10px;
    font-size:14.5px;font-weight:500;color:var(--t-1);
}
.ticks .ic{font-size:19px;color:var(--c-em);flex:none}
.theme__shot{
    position:relative;border-radius:var(--r-x);overflow:hidden;
    box-shadow:var(--sh-4);
    transition:transform .5s var(--ease);
}
.theme__shot::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(130deg,rgba(255,255,255,.16),transparent 42%);
    pointer-events:none;
}
.theme__shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.theme__shot:hover img{transform:scale(1.045)}

/* =========================================================
   voices
   ========================================================= */
.rail{position:relative}
.rail__track{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.voice{
    position:relative;overflow:hidden;
    padding:30px 28px;border-radius:var(--r-x);
    background:#fff;border:1px solid var(--n-100);
    box-shadow:var(--sh-1);
    transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease);
}
.voice::after{
    content:"";position:absolute;right:-34px;bottom:-34px;width:120px;height:120px;border-radius:50%;
    background:radial-gradient(circle,rgba(99,102,241,.10),transparent 68%);
}
.voice:hover{transform:translateY(-7px);box-shadow:var(--sh-3);border-color:rgba(99,102,241,.26)}
.voice__q{
    position:absolute;top:20px;right:22px;
    font-size:30px;color:rgba(99,102,241,.18);
}
.voice__who{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.voice__av{
    width:48px;height:48px;border-radius:50%;flex:none;
    display:grid;place-items:center;font-size:21px;color:#fff;
    background:var(--g-soft);
    box-shadow:0 10px 22px -12px rgba(99,102,241,1);
}
.voice__who h4{font-size:14.5px;font-weight:700}
.stars{display:flex;gap:2px;color:var(--c-am-l);font-size:13px}
.stars .ic{fill:currentColor;stroke-width:0}
.voice > p{font-size:13.8px;line-height:1.95;margin-bottom:18px}
.voice__win{
    display:inline-flex;align-items:center;gap:9px;
    padding:9px 16px;border-radius:var(--r-pill);
    font-size:12.5px;font-weight:800;color:var(--c-em-d);
    background:linear-gradient(135deg,rgba(16,185,129,.11),rgba(52,211,153,.05));
    border:1px solid rgba(16,185,129,.24);
}
.voice__win .ic{font-size:15px}

.rail__nav{display:none;align-items:center;justify-content:center;gap:16px;margin-top:26px}
.rail__btn{
    width:44px;height:44px;border-radius:50%;flex:none;
    display:grid;place-items:center;font-size:19px;color:#fff;
    background:var(--g-main);
    box-shadow:0 12px 24px -14px rgba(79,70,229,1);
    transition:transform .25s var(--ease),opacity .25s;
}
.rail__btn:active{transform:scale(.9)}
.rail__dots{display:flex;gap:8px}
.rail__dots button{
    width:8px;height:8px;border-radius:var(--r-pill);
    background:var(--n-300);transition:all .35s var(--ease);
}
.rail__dots button.is-on{width:26px;background:var(--g-main)}

/* =========================================================
   join
   ========================================================= */
.join{
    position:relative;overflow:hidden;isolation:isolate;
    padding:96px 0 100px;
    background:linear-gradient(150deg,#4f46e5 0%,#6d47b8 48%,#764ba2 100%);
    color:#fff;
}
.join::before{
    content:"";position:absolute;inset:0;z-index:-1;
    background-image:
        linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);
    background-size:48px 48px;
    -webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 40%,#000,transparent 78%);
    mask-image:radial-gradient(ellipse 70% 70% at 50% 40%,#000,transparent 78%);
}
.join .blob{opacity:.35;filter:blur(90px)}
.join .blob--a{background:radial-gradient(circle,#a78bfa,transparent 68%)}
.join .blob--b{background:radial-gradient(circle,#34d399,transparent 68%)}
.join__in{text-align:center;display:grid;justify-items:center}
.join__shot{
    width:min(760px,100%);border-radius:var(--r-x);overflow:hidden;
    box-shadow:0 40px 80px -30px rgba(0,0,0,.55);
    border:1px solid rgba(255,255,255,.22);
    margin-bottom:44px;
}
.join__head h2{font-size:clamp(1.6rem,3.6vw,2.5rem);font-weight:900;margin-bottom:12px;color:#fff}
.join__head p{color:rgba(255,255,255,.86);font-size:15px}

.grants{
    display:flex;flex-wrap:wrap;justify-content:center;gap:12px;
    margin:34px 0 26px;
}
.grants li{
    display:inline-flex;align-items:center;gap:9px;
    padding:11px 20px;border-radius:var(--r-pill);
    font-size:14px;font-weight:700;
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.24);
    -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
    transition:background .3s var(--ease),transform .3s var(--ease);
}
.grants li:hover{background:rgba(255,255,255,.22);transform:translateY(-3px)}
.grants .ic{font-size:17px;color:var(--c-em-l)}

.join__note{
    display:inline-flex;align-items:center;gap:9px;
    font-size:14px;font-weight:700;color:#fde68a;margin-bottom:30px;
}
.join__note .ic{font-size:17px}

.bigcta{
    position:relative;overflow:hidden;
    display:inline-flex;align-items:center;gap:12px;
    padding:19px 42px;border-radius:var(--r-pill);
    font-size:17px;font-weight:900;color:#fff;
    background:linear-gradient(135deg,#06c755,#10b981);
    box-shadow:0 20px 44px -16px rgba(6,199,85,.85);
    transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.bigcta img{border-radius:7px}
.bigcta .ic{font-size:19px;transition:transform .3s var(--ease)}
.bigcta::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.42) 50%,transparent 62%);
    transform:translateX(-130%);
    animation:sweep 3.4s var(--ease) infinite;
}
.bigcta:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 26px 54px -16px rgba(6,199,85,1)}
.bigcta:hover .ic{transform:translateX(5px)}

.figs--glass{
    margin:46px 0 0;justify-content:center;
    padding:22px 34px;border-radius:var(--r-x);
    background:rgba(255,255,255,.11);
    border:1px solid rgba(255,255,255,.2);
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
.figs--glass .fig{text-align:center}
.figs--glass .fig__n{background:none;-webkit-text-fill-color:#fff;color:#fff}
.figs--glass .fig__k{color:rgba(255,255,255,.72)}
.figs--glass .fig__sep{background:linear-gradient(180deg,transparent,rgba(255,255,255,.35),transparent);margin-inline:20px}

/* =========================================================
   footer
   ========================================================= */
.foot{background:#141b2b;color:rgba(255,255,255,.72);padding:60px 0 26px}
.foot__in{display:flex;flex-wrap:wrap;gap:36px;justify-content:space-between;align-items:flex-start}
.foot__brand p{font-size:13.5px;color:rgba(255,255,255,.6);margin-top:12px;max-width:340px}
.foot__side{display:grid;gap:20px;justify-items:flex-end}
.foot__links{display:flex;flex-wrap:wrap;gap:22px}
.foot__links a{font-size:13.5px;color:rgba(255,255,255,.7);transition:color .25s}
.foot__links a:hover{color:#a78bfa}
.foot__social{display:flex;gap:12px}
.foot__social a{
    width:40px;height:40px;border-radius:12px;
    display:grid;place-items:center;font-size:18px;color:#fff;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.1);
    transition:transform .3s var(--ease),background .3s var(--ease);
}
.foot__social a:hover{transform:translateY(-4px);background:var(--g-main)}
.foot__base{
    margin-top:38px;padding-top:22px;
    border-top:1px solid rgba(255,255,255,.09);
    text-align:center;
}
.foot__base p{font-size:12.5px;color:rgba(255,255,255,.45);margin:0}

/* =========================================================
   sticky dock
   ========================================================= */
.dock{
    position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:1150;
    padding-bottom:env(safe-area-inset-bottom);
    pointer-events:none;
}
.dock__btn{
    position:relative;pointer-events:auto;
    display:inline-flex;align-items:center;justify-content:center;gap:11px;
    width:min(340px,calc(100vw - 40px));
    padding:16px 26px;border-radius:var(--r-pill);
    font-size:15.5px;font-weight:900;color:#fff;letter-spacing:.01em;
    background:linear-gradient(135deg,#4f46e5 0%,#764ba2 100%);
    box-shadow:0 18px 40px -14px rgba(79,70,229,.95),0 0 0 1px rgba(255,255,255,.14) inset;
    transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.dock__btn:hover{transform:translateY(-3px);box-shadow:0 24px 52px -14px rgba(79,70,229,1)}
.dock__btn:active{transform:scale(.97)}
.dock__halo{
    position:absolute;inset:0;border-radius:inherit;z-index:-1;
    background:linear-gradient(135deg,#4f46e5,#764ba2);
    animation:halo 2.4s ease-out infinite;
}
@keyframes halo{
    0%{transform:scale(1);opacity:.55}
    70%{transform:scale(1.14);opacity:0}
    100%{opacity:0}
}
.dock__logo{border-radius:8px;flex:none}
.dock__go{font-size:18px;animation:nudge 1.7s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}

/* =========================================================
   responsive
   ========================================================= */
@media (max-width:1024px){
    .hero__grid{grid-template-columns:1fr;gap:40px;text-align:center;padding-bottom:60px}
    .hero__copy .figs{justify-content:center}
    .about__grid{grid-template-columns:1fr;gap:52px}
    .theme,.theme--flip{grid-template-columns:1fr;gap:28px}
    .theme--flip .theme__text{order:1}
    .theme--flip .theme__shot{order:2}
    .deck{grid-template-columns:repeat(2,1fr)}
    .rail__track{grid-template-columns:repeat(2,1fr)}
    .menu{display:none}
}

@media (max-width:768px){
    body{padding-bottom:96px}
    .shell{padding-inline:18px}
    .hero{padding-top:120px}
    .slab{padding:70px 0}
    .lead{margin-bottom:42px}

    .hero__art{min-height:auto}
    .drift--1{top:2%;left:-2%}
    .drift--2{top:40%;right:-2%}
    .drift--3{bottom:2%;left:0}
    .drift{font-size:11.5px;padding:8px 13px}

    .figs{gap:4px}
    .fig{min-width:82px}
    .fig__sep{margin-inline:4px}

    .stamp--1{top:14px;right:8px}
    .stamp--2{bottom:14px;left:8px}
    .stamp{font-size:11px;padding:9px 13px}

    .road{padding-left:0}
    .road::before{left:23px}
    .road__step{gap:16px;padding-bottom:26px}
    .road__dot{width:46px;height:46px;border-radius:15px;font-size:19px}
    .road__body{padding:14px 18px}

    .deck{grid-template-columns:1fr;gap:18px}
    .perk{padding:28px 24px}

    .theme{padding:26px 0}
    .theme__no{font-size:2.6rem}

    /* voices -> swipe rail */
    .rail{overflow:hidden}
    .rail__track{
        display:flex;grid-template-columns:none;gap:16px;
        transition:transform .5s var(--ease);
    }
    .voice{flex:0 0 100%}
    .rail__nav{display:flex}

    .join{padding:74px 0 80px}
    .join__shot{margin-bottom:32px}
    .grants li{font-size:13px;padding:9px 16px}
    .bigcta{padding:17px 30px;font-size:15.5px;width:100%;max-width:360px}
    .figs--glass{padding:18px 16px;width:100%}
    .figs--glass .fig__sep{margin-inline:8px}

    .foot__in{flex-direction:column;align-items:flex-start}
    .foot__side{justify-items:flex-start}
}

@media (max-width:420px){
    .dock{bottom:12px}
    .dock__btn{font-size:14px;padding:15px 18px;gap:8px}
    .hero__title{font-size:1.85rem}
    .mark__txt{font-size:13.5px}
}