/*
|--------------------------------------------------------------------------
| RIV // PUBLIC LANDING V1
|--------------------------------------------------------------------------
*/
:root{
    --bg:#08090d;
    --panel:#111218;
    --text:#f6f4f7;
    --muted:#96929d;
    --accent:#ff3ea5;
    --line:rgba(255,255,255,.075);
    --line-accent:rgba(255,62,165,.28);
    --accent-soft:rgba(255,62,165,.075);
    --ease:cubic-bezier(.2,.8,.2,1);
}
*,
*::before,
*::after{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{
    min-height:100vh;
    margin:0;
    overflow-x:hidden;
    color:var(--text);
    background:
        radial-gradient(circle at 76% 12%,rgba(255,62,165,.055),transparent 29%),
        linear-gradient(180deg,#090a0f 0%,#07080c 100%);
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.landing-ambient{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.ambient-grid{
    position:absolute;
    inset:0;
    opacity:.16;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
    background-size:64px 64px;
    mask-image:linear-gradient(to bottom,black,transparent 85%);
}
.ambient-glow{position:absolute;width:560px;height:560px;border-radius:50%;filter:blur(110px)}
.glow-one{top:-290px;right:-120px;background:rgba(255,62,165,.09)}
.glow-two{bottom:-360px;left:-200px;background:rgba(145,88,255,.05)}
.landing-shell{
    position:relative;
    z-index:1;
    width:min(1240px,calc(100% - 48px));
    min-height:100vh;
    display:flex;
    flex-direction:column;
    margin:0 auto;
}
.landing-top{
    min-height:120px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}
.landing-brand{text-decoration:none}
.landing-brand strong{
    display:block;
    color:var(--text);
    font-size:40px;
    line-height:.84;
    font-weight:1000;
    letter-spacing:-.07em;
}
.landing-brand span{
    display:block;
    margin-top:9px;
    color:var(--accent);
    font-size:10px;
    line-height:1;
    font-weight:950;
    letter-spacing:.08em;
}
.landing-beta-pill{
    min-height:34px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 12px;
    border:1px solid var(--line-accent);
    border-radius:999px;
    color:var(--text);
    background:var(--accent-soft);
    font-size:9px;
    font-weight:950;
    letter-spacing:.06em;
}
.landing-beta-pill i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--accent);
    box-shadow:0 0 14px rgba(255,62,165,.8);
}
.landing-hero{
    flex:1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:clamp(60px,9vh,120px) 0 clamp(70px,10vh,140px);
}
.landing-kicker{
    color:var(--text);
    font-size:11px;
    font-weight:1000;
    letter-spacing:.09em;
}
.landing-kicker span{color:var(--accent)}
.landing-hero h1{
    max-width:980px;
    margin:13px 0 0;
    color:var(--text);
    font-size:clamp(64px,9.4vw,142px);
    line-height:.82;
    font-weight:1000;
    letter-spacing:-.072em;
}
.landing-hero h1 span{color:var(--accent)}
.landing-lead{
    max-width:650px;
    margin:34px 0 0;
    color:var(--muted);
    font-size:15px;
    line-height:1.65;
    font-weight:650;
}
.landing-actions{
    display:flex;
    align-items:center;
    gap:18px;
    margin-top:34px;
}
.landing-primary{
    --mouse-x:50%;
    --mouse-y:50%;
    position:relative;
    min-height:54px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    overflow:hidden;
    padding:0 20px;
    border:1px solid var(--accent);
    border-radius:12px;
    color:#fff;
    background:var(--accent);
    text-decoration:none;
    font-size:11px;
    font-weight:1000;
    letter-spacing:.06em;
    box-shadow:0 15px 45px rgba(255,62,165,.12);
    transition:transform .2s var(--ease),box-shadow .2s var(--ease);
}
.landing-primary::before{
    content:"";
    position:absolute;
    width:170px;
    height:170px;
    left:var(--mouse-x);
    top:var(--mouse-y);
    border-radius:50%;
    background:radial-gradient(circle,rgba(255,255,255,.22),transparent 64%);
    opacity:0;
    transform:translate(-50%,-50%);
    transition:opacity .2s var(--ease);
}
.landing-primary:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 55px rgba(255,62,165,.22);
}
.landing-primary:hover::before{opacity:1}
.landing-primary span,.landing-primary svg{position:relative;z-index:1}
.landing-primary svg{
    width:18px;
    height:18px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
    transition:transform .2s var(--ease);
}
.landing-primary:hover svg{transform:translateX(4px)}
.landing-access-note{
    color:var(--muted);
    font-size:9px;
    line-height:1.5;
    font-weight:850;
    letter-spacing:.035em;
}
.landing-access-note b{color:var(--accent);font-weight:950}
.landing-system{padding-bottom:28px}
.system-line{
    height:1px;
    margin-bottom:18px;
    background:linear-gradient(90deg,var(--accent),var(--line) 35%,transparent);
}
.system-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}
.system-grid article{
    min-height:134px;
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:13px;
    padding:18px;
    border:1px solid var(--line);
    border-radius:14px;
    background:linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,.004));
}
.system-number{color:var(--accent);font-size:9px;font-weight:1000;letter-spacing:.05em}
.system-grid article strong{
    display:block;
    color:var(--text);
    font-size:11px;
    font-weight:1000;
    letter-spacing:.05em;
}
.system-grid article p{
    margin:8px 0 0;
    color:var(--muted);
    font-size:10px;
    line-height:1.55;
    font-weight:650;
}
.landing-footer{
    min-height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border-top:1px solid var(--line);
    color:var(--muted);
    font-size:8px;
    font-weight:850;
    letter-spacing:.06em;
}
.landing-footer b{color:var(--accent)}
@media(max-width:800px){
    .landing-shell{width:min(100% - 30px,1240px)}
    .landing-top{min-height:96px}
    .landing-brand strong{font-size:34px}
    .landing-hero{padding:70px 0 86px}
    .landing-hero h1{font-size:clamp(56px,18vw,96px)}
    .landing-lead{margin-top:26px;font-size:13px}
    .landing-actions{align-items:flex-start;flex-direction:column}
    .system-grid{grid-template-columns:1fr}
}
@media(max-width:480px){
    .landing-beta-pill{padding:0 9px;font-size:8px}
    .landing-hero h1{font-size:clamp(49px,17vw,76px)}
    .landing-primary{width:100%}
    .landing-footer{
        align-items:flex-start;
        flex-direction:column;
        justify-content:center;
        padding:18px 0;
    }
}
