/* =========================================================
   WELCOME — page-scoped CSS
   Scope: body.mbp-welcome-page
   Canon:
   - free-flow layout like homepage
   - no rigid cards
   - stronger typography and section hierarchy
========================================================= */

body.mbp-welcome-page{
    --mbp-welcome-shell: 980px;
    --mbp-welcome-hero-col: 860px;
    --mbp-welcome-text-col: 760px;
    --mbp-welcome-board-col: 700px;

    --mbp-welcome-gold: rgba(230, 195, 105, 0.98);
    --mbp-welcome-gold-soft: rgba(230, 195, 105, 0.84);
    --mbp-welcome-ivory: rgba(245, 239, 226, 0.95);
    --mbp-welcome-text: rgba(235, 238, 246, 0.86);
    --mbp-welcome-text-soft: rgba(235, 238, 246, 0.74);

    --mbp-welcome-world: rgba(230, 195, 105, 0.92);
    --mbp-welcome-activate: rgba(155, 123, 255, 0.90);
    --mbp-welcome-portal: rgba(191, 62, 47, 0.92);
}

body.mbp-welcome-page main.mbp-main > .wrap{
    max-width: 1340px;
}

/* ---------------------------------------------------------
   PAGE SHELL
--------------------------------------------------------- */

body.mbp-welcome-page .mbp-welcome-page-shell{
    max-width: var(--mbp-welcome-shell);
    margin: 0 auto;
    padding: 84px 24px 40px;
}

/* ---------------------------------------------------------
   HERO
--------------------------------------------------------- */

body.mbp-welcome-page .mbp-welcome-hero{
    max-width: var(--mbp-welcome-hero-col);
    margin: 0 auto 72px;
    text-align: center;
}

body.mbp-welcome-page .mbp-welcome-page-title{
    margin: 0;
    font-family: "Cinzel", serif;
    font-size: clamp(2.8rem, 4.8vw, 4.8rem);
    line-height: 0.96;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--mbp-welcome-gold);
    text-shadow:
        0 0 12px rgba(210, 165, 60, 0.08),
        0 0 28px rgba(210, 165, 60, 0.08);
}

body.mbp-welcome-page .mbp-welcome-page-subtitle{
    max-width: 760px;
    margin: 18px auto 0;
    font-family: "Cinzel", serif;
    font-size: clamp(1.1rem, 1.8vw, 1.7rem);
    line-height: 1.1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mbp-welcome-gold-soft);
}

/* ---------------------------------------------------------
   SECTIONS
--------------------------------------------------------- */

body.mbp-welcome-page .mbp-welcome-section{
    max-width: 100%;
    margin: 0 auto 78px;
}

body.mbp-welcome-page .mbp-welcome-section:last-child{
    margin-bottom: 24px;
}

body.mbp-welcome-page .mbp-welcome-section-inner{
    max-width: var(--mbp-welcome-text-col);
    margin: 0 auto;
    text-align: center;
}

/* ---------------------------------------------------------
   SECTION TITLES
--------------------------------------------------------- */

body.mbp-welcome-page .mbp-welcome-section-title{
    margin: 0 0 24px;
    font-family: "Cinzel", serif;
    font-size: clamp(1.7rem, 2.8vw, 2.8rem);
    line-height: 1.04;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    text-align: center;
    text-shadow: 0 0 10px rgba(0,0,0,0.22);
}

body.mbp-welcome-page .mbp-welcome-section-world .mbp-welcome-section-title{
    color: var(--mbp-welcome-world);
}

body.mbp-welcome-page .mbp-welcome-section-activate .mbp-welcome-section-title{
    color: var(--mbp-welcome-activate);
}

body.mbp-welcome-page .mbp-welcome-section-portal .mbp-welcome-section-title{
    color: var(--mbp-welcome-portal);
}

/* ---------------------------------------------------------
   COPY
--------------------------------------------------------- */

body.mbp-welcome-page .mbp-welcome-copy{
    max-width: var(--mbp-welcome-text-col);
    margin: 0 auto;
}

body.mbp-welcome-page .mbp-welcome-copy p{
    margin: 0 0 18px;
    color: var(--mbp-welcome-text);
    font-size: 1rem;
    line-height: 1.82;
    text-align: center;
}

body.mbp-welcome-page .mbp-welcome-copy p:last-child{
    margin-bottom: 0;
}

body.mbp-welcome-page .mbp-welcome-copy a{
    color: var(--mbp-welcome-gold);
    text-decoration: none;
    border-bottom: 1px solid rgba(230, 195, 105, 0.28);
    transition:
        color .25s ease,
        border-color .25s ease,
        text-shadow .25s ease;
}

body.mbp-welcome-page .mbp-welcome-copy a:hover{
    color: rgba(255, 236, 181, 0.98);
    border-color: rgba(230, 195, 105, 0.55);
    text-shadow: 0 0 10px rgba(230, 195, 105, 0.22);
}

/* ---------------------------------------------------------
   BOARD IMAGE
--------------------------------------------------------- */

body.mbp-welcome-page .mbp-welcome-board{
    max-width: var(--mbp-welcome-board-col);
    margin: 34px auto 34px;
}

body.mbp-welcome-page .mbp-welcome-board img{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow:
        0 24px 52px rgba(0,0,0,.46),
        0 0 0 1px rgba(255,255,255,.03);
}

/* ---------------------------------------------------------
   ACTIONS
--------------------------------------------------------- */

body.mbp-welcome-page .mbp-welcome-actions{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 28px;
}

/* ---------------------------------------------------------
   LEGACY SAFETY
--------------------------------------------------------- */

body.mbp-welcome-page .hero,
body.mbp-welcome-page .panel,
body.mbp-welcome-page .mbp-welcome-card{
    all: unset;
}

/* Re-enable layout basics after reset for legacy wrappers if present */
body.mbp-welcome-page .mbp-welcome-hero,
body.mbp-welcome-page .mbp-welcome-section,
body.mbp-welcome-page .mbp-welcome-section-inner,
body.mbp-welcome-page .mbp-welcome-board,
body.mbp-welcome-page .mbp-welcome-actions{
    display: block;
}

body.mbp-welcome-page .mbp-welcome-actions{
    display: flex;
}

/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media (max-width: 980px){
    body.mbp-welcome-page .mbp-welcome-page-shell{
        padding-top: 68px;
        padding-left: 18px;
        padding-right: 18px;
    }

    body.mbp-welcome-page .mbp-welcome-hero{
        margin-bottom: 58px;
    }

    body.mbp-welcome-page .mbp-welcome-section{
        margin-bottom: 64px;
    }

    body.mbp-welcome-page .mbp-welcome-copy p{
        font-size: 0.96rem;
        line-height: 1.76;
    }

    body.mbp-welcome-page .mbp-welcome-board{
        max-width: 620px;
        margin-top: 30px;
        margin-bottom: 30px;
    }
}

@media (max-width: 720px){
    body.mbp-welcome-page .mbp-welcome-page-shell{
        padding-top: 56px;
    }

    body.mbp-welcome-page .mbp-welcome-page-subtitle{
        margin-top: 14px;
        font-size: 1.18rem;
        letter-spacing: 0.08em;
    }

    body.mbp-welcome-page .mbp-welcome-section-title{
        margin-bottom: 20px;
        font-size: 1.55rem;
        letter-spacing: 0.08em;
    }

    body.mbp-welcome-page .mbp-welcome-copy p{
        font-size: 0.92rem;
        line-height: 1.72;
    }
}

@media (max-width: 560px){
    body.mbp-welcome-page .mbp-welcome-page-shell{
        padding-top: 46px;
        padding-left: 14px;
        padding-right: 14px;
    }

    body.mbp-welcome-page .mbp-welcome-hero{
        margin-bottom: 46px;
    }

    body.mbp-welcome-page .mbp-welcome-section{
        margin-bottom: 50px;
    }

    body.mbp-welcome-page .mbp-welcome-page-title{
        font-size: 2.2rem;
    }

    body.mbp-welcome-page .mbp-welcome-page-subtitle{
        font-size: 1rem;
    }

    body.mbp-welcome-page .mbp-welcome-section-title{
        font-size: 1.34rem;
    }

    body.mbp-welcome-page .mbp-welcome-copy p{
        font-size: 0.88rem;
        line-height: 1.68;
    }

    body.mbp-welcome-page .mbp-welcome-board{
        margin-top: 24px;
        margin-bottom: 24px;
    }

    body.mbp-welcome-page .mbp-welcome-actions{
        gap: 10px;
    }
}