/*
==============================================================================
 CTM PATH™ Guided Journey™

 File        : css/welcome.css
 Version     : 1.4

 Page:
 PAGE 01 — WELCOME™

 Purpose:
 Welcome experience under global CTM PATH™ header.

 Status:
 🔒 GLOBAL HEADER ALIGNED

==============================================================================
*/





/* ==========================================================================
   PAGE FOUNDATION
========================================================================== */


.welcome-page {


    min-height:

        100vh;


    background:

        var(--ctm-background);


    color:

        var(--ctm-ivory);


    padding:

        50px 20px 90px;


}







.welcome-container {


    max-width:

        980px;


    margin:

        0 auto;


    text-align:

        center;


}









/* ==========================================================================
   HERO SECTION
========================================================================== */


.welcome-hero {


    padding:

        25px 0 20px;


}







.welcome-eyebrow {


    color:

        var(--ctm-gold);


    font-size:

        12px;


    letter-spacing:

        5px;


    text-transform:

        uppercase;


    margin-bottom:

        30px;


}







.welcome-title {


    color:

        var(--ctm-ivory);


    font-size:

        clamp(

            42px,

            6vw,

            64px

        );


    line-height:

        1.35;


    font-weight:

        700;


    margin:

        0 auto 25px;


}







.welcome-subtitle {


    color:

        var(--ctm-teal-light);


    font-size:

        clamp(

            20px,

            3vw,

            26px

        );


    letter-spacing:

        3px;


    margin-bottom:

        40px;


}







.welcome-description {


    max-width:

        760px;


    margin:

        auto;


    color:

        var(--ctm-text);


    font-size:

        18px;


    line-height:

        2;


}







.welcome-description p {


    margin:

        18px 0;


}









/* ==========================================================================
   PREMIUM DIVIDER
========================================================================== */


.welcome-divider {


    color:

        var(--ctm-gold);


    font-size:

        20px;


    letter-spacing:

        6px;


    margin:

        60px auto;


}









/* ==========================================================================
   DISCOVERY SECTION
========================================================================== */


.discovery-section {


    margin-top:

        20px;


}







.discovery-title {


    color:

        var(--ctm-gold);


    font-size:

        26px;


    line-height:

        1.5;


    margin-bottom:

        45px;


}







.discovery-grid {


    display:

        grid;


    grid-template-columns:

        repeat(

            2,

            1fr

        );


    gap:

        30px;


}









/* ==========================================================================
   DISCOVERY CARDS
========================================================================== */


.discovery-card {


    background:

        var(--ctm-card);


    border:

        1px solid var(--ctm-border);


    border-radius:

        22px;


    padding:

        38px 30px;


    box-shadow:

        0 25px 60px rgba(

            0,

            0,

            0,

            .30

        );


    transition:

        all .35s ease;


}







.discovery-card:hover {


    transform:

        translateY(-8px);


    border-color:

        var(--ctm-gold);


}







.discovery-symbol {


    color:

        var(--ctm-teal-light);


    font-size:

        42px;


    margin-bottom:

        20px;


}







.discovery-card h3 {


    color:

        var(--ctm-ivory);


    font-size:

        20px;


    line-height:

        1.6;


    margin-bottom:

        15px;


}







.discovery-card p {


    color:

        var(--ctm-text);


    font-size:

        16px;


    line-height:

        1.8;


}









/* ==========================================================================
   CTA SECTION
========================================================================== */


.welcome-action {


    margin-top:

        85px;


}







.welcome-action h2 {


    color:

        var(--ctm-ivory);


    font-size:

        30px;


    line-height:

        1.5;


}







.welcome-action p {


    color:

        var(--ctm-text);


    margin:

        20px 0 35px;


}







.welcome-button {


    min-width:

        320px;


    padding:

        20px 55px;


    background:

        var(--ctm-teal);


    color:

        #FFFFFF;


    border:

        none;


    border-radius:

        50px;


    font-size:

        18px;


    font-weight:

        700;


    cursor:

        pointer;


    box-shadow:

        0 15px 40px rgba(

            20,

            184,

            166,

            .25

        );


    transition:

        all .35s ease;


}







.welcome-button:hover {


    background:

        var(--ctm-teal-light);


    transform:

        translateY(-5px);


}









/* ==========================================================================
   MOBILE
========================================================================== */


@media(max-width:768px){



    .welcome-page {


        padding:

            35px 15px 60px;


    }





    .welcome-title {


        font-size:

            38px;


    }





    .discovery-grid {


        grid-template-columns:

            1fr;


    }





    .welcome-button {


        width:

            100%;


        min-width:

            auto;


    }



}