.elementor-7 .elementor-element.elementor-element-5eebf46 .elementor-wrapper{--video-aspect-ratio:1.77777;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-1c20b4d *//*=========================================================
RISE & ROOTED DESIGN SYSTEM
Version 1.0
=========================================================*/

/* RESET */

*,
*::before,
*::after{
box-sizing:border-box;
margin:0;
padding:0;
}

html{

scroll-behavior:smooth;

}

body{

margin:0;

font-family:Inter,sans-serif;

background:#F8F5EF;

color:#2F3C36;

overflow-x:hidden;

}

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

VARIABLES

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

:root{

--green:#234739;

--green-dark:#1A342A;

--gold:#B7904F;

--cream:#F8F5EF;

--white:#FFFFFF;

--text:#4A4A4A;

--radius:22px;

--shadow:
0 18px 60px rgba(0,0,0,.08);

--transition:.35s ease;

--container:1280px;

--section-padding:130px;

}

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

CONTAINER

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

.rr-container{

width:min(92%,1280px);

margin:auto;

}

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

SECTION

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

.rr-section{

padding:var(--section-padding) 0;

position:relative;

}

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

GRID

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

.rr-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:90px;

align-items:center;

}

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

TYPOGRAPHY

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

h1,h2,h3{

font-family:"Cormorant Garamond",serif;

font-weight:500;

color:var(--green);

line-height:1.1;

}

h1{

font-size:clamp(3rem,5vw,5rem);

}

h2{

font-size:clamp(2.3rem,4vw,4rem);

}

h3{

font-size:clamp(1.8rem,3vw,2.4rem);

}

p{

font-family:Inter,sans-serif;

font-size:18px;

line-height:1.9;

color:var(--text);

}

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

SMALL TITLE

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

.rr-small-title{

display:flex;

align-items:center;

justify-content:center;

gap:18px;

margin-bottom:25px;

font-size:13px;

letter-spacing:3px;

text-transform:uppercase;

color:var(--gold);

font-family:Inter,sans-serif;

}

.rr-small-title span{

width:55px;

height:1px;

background:var(--gold);

}

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

BUTTONS

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

.rr-btn{

display:inline-flex;

align-items:center;

justify-content:center;

padding:18px 38px;

border-radius:999px;

text-decoration:none;

font-family:Inter,sans-serif;

transition:var(--transition);

cursor:pointer;

}

.rr-btn-primary{

background:var(--gold);

color:#fff;

}

.rr-btn-primary:hover{

background:var(--green);

transform:translateY(-3px);

}

.rr-btn-outline{

border:1px solid var(--green);

color:var(--green);

background:transparent;

}

.rr-btn-outline:hover{

background:var(--green);

color:#fff;

}

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

IMAGES

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

img{

display:block;

max-width:100%;

height:auto;

}

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

RESPONSIVE

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

@media(max-width:1024px){

.rr-grid{

grid-template-columns:1fr;

gap:60px;

}

}

@media(max-width:768px){

:root{

--section-padding:75px;

}

.rr-container{

width:92%;

}

p{

font-size:17px;

line-height:1.8;

}

.rr-small-title{

letter-spacing:2px;

gap:12px;

}

.rr-small-title span{

width:35px;

}

.rr-btn{

width:100%;

padding:18px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-185b4cc *//*======================================
HERO
======================================*/

.rr-hero{

    min-height:90vh;

    display:flex;

    align-items:center;

    background:var(--cream);

    overflow:hidden;

}

.rr-hero-content{

    max-width:620px;

}

.rr-hero-content p{

    max-width:560px;

    margin:35px 0 45px;

}

.rr-buttons{

    display:flex;

    gap:20px;

    flex-wrap:wrap;

}

.rr-hero-image{

    display:flex;

    justify-content:center;

    align-items:center;

}

.rr-hero-image img{

    width:100%;

    max-width:560px;

    height:auto;

    filter:drop-shadow(0 30px 60px rgba(0,0,0,.15));

    transition:transform .4s ease;

}

.rr-hero-image img:hover{

    transform:translateY(-8px);

}

/*======================================
RESPONSIVE
======================================*/

@media (max-width:1024px){

    .rr-hero{

        min-height:auto;

        text-align:center;

    }

    .rr-hero-content{

        max-width:100%;

        margin:0 auto;

    }

    .rr-hero-content p{

        margin:25px auto 40px;

    }

    .rr-buttons{

        justify-content:center;

    }

    .rr-hero-image{

        order:-1;

        margin-bottom:30px;

    }

}

@media (max-width:768px){

    .rr-hero{

        padding-top:30px;

    }

    .rr-hero-image img{

        max-width:320px;

    }

    .rr-buttons{

        flex-direction:column;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ec1d4f8 *//*======================================
ABOUT
======================================*/

.rr-about{

    background:#FFFDF8;

}

.rr-about-image{

    display:flex;
    justify-content:center;
    align-items:center;

}

.rr-about-image img{

    width:100%;
    max-width:520px;
    height:auto;

    transition:transform .35s ease;

}

.rr-about-image img:hover{

    transform:translateY(-8px);

}

.rr-about-content{

    max-width:620px;

}

.rr-about-content p{

    margin:35px 0 40px;

}

.rr-text-link{

    display:inline-block;

    color:var(--green);

    text-decoration:none;

    font-size:14px;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

    transition:all .3s ease;

}

.rr-text-link:hover{

    color:var(--gold);

    letter-spacing:3px;

}

/*======================================
RESPONSIVE
======================================*/

@media (max-width:1024px){

    .rr-about{

        text-align:center;

    }

    .rr-about-content{

        max-width:100%;
        margin:0 auto;

    }

    .rr-about-content p{

        margin:25px auto 35px;

    }

    .rr-about-image{

        margin-bottom:20px;

    }

}

@media (max-width:768px){

    .rr-about-image img{

        max-width:340px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-70aa7bd *//*======================================
R&R FRAMEWORK
======================================*/

.rr-framework{

    background:var(--cream);

}

.rr-section-heading{

    max-width:760px;
    margin:0 auto 80px;
    text-align:center;

}

.rr-section-heading p{

    margin-top:25px;

}

.rr-framework-grid{

    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:35px;
    position:relative;

}

/* Connecting Line */

.rr-framework-grid::before{

    content:"";

    position:absolute;

    top:42px;
    left:12%;
    right:12%;

    height:1px;

    background:#D8CCB7;

    z-index:0;

}

.rr-step{

    position:relative;

    z-index:1;

    text-align:center;

}

.rr-icon{

    width:85px;
    height:85px;

    margin:0 auto 25px;

    border-radius:50%;

    background:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:42px;

    box-shadow:0 10px 30px rgba(0,0,0,.05);

    transition:.35s ease;

}

.rr-step:hover .rr-icon{

    transform:translateY(-8px);

    background:var(--green);

}

.rr-step:hover .rr-icon{

    color:#fff;

}

.rr-step h3{

    margin-bottom:18px;

}

.rr-step p{

    margin-bottom:25px;

}

.rr-step .rr-text-link{

    font-size:12px;

}

/*======================================
RESPONSIVE
======================================*/

@media (max-width:1024px){

    .rr-framework-grid{

        grid-template-columns:repeat(2,1fr);

        gap:60px 40px;

    }

    .rr-framework-grid::before{

        display:none;

    }

}

@media (max-width:768px){

    .rr-framework-grid{

        grid-template-columns:1fr;

        gap:55px;

    }

    .rr-section-heading{

        margin-bottom:60px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-348ed58 *//*==================================================
    RISE & ROOTED INSTITUTE
    FROM THE JOURNAL
==================================================*/

.rr-journal{
    background:#FFFDF9;
}

.rr-journal .rr-container{
    display:grid;
    grid-template-columns:320px 1.5fr 1fr;
    gap:50px;
    align-items:start;
}

/*==================================================
LEFT INTRO
==================================================*/

.journal-intro{
    position:sticky;
    top:110px;
}

.journal-intro h2{
    margin:20px 0 30px;
}

.journal-intro p{
    margin-bottom:40px;
}

.journal-intro a{
    display:inline-flex;
    align-items:center;
    gap:10px;

    color:var(--green);
    text-decoration:none;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:13px;

    transition:.35s;
}

.journal-intro a:hover{
    color:var(--gold);
    gap:16px;
}

/*==================================================
FEATURED ARTICLE
==================================================*/

.featured-article{

    position:relative;

    overflow:hidden;

    border-radius:18px;

    box-shadow:0 35px 70px rgba(0,0,0,.08);

}

.featured-article img{

    width:100%;
    height:700px;

    object-fit:cover;

    display:block;

    transition:transform 1s ease;

}

.featured-article:hover img{

    transform:scale(1.05);

}

/* Gradient Overlay */

.featured-article::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.72) 0%,
        rgba(0,0,0,.48) 35%,
        rgba(0,0,0,.12) 62%,
        rgba(0,0,0,0) 100%
    );

    z-index:1;

    transition:.4s;

}

.featured-article:hover::before{

    background:linear-gradient(
        to top,
        rgba(0,0,0,.78) 0%,
        rgba(0,0,0,.55) 40%,
        rgba(0,0,0,.12) 70%,
        rgba(0,0,0,0) 100%
    );

}

/*==================================================
CONTENT
==================================================*/

.overlay{

    position:absolute;

    left:0;
    right:0;
    bottom:0;

    z-index:2;

    padding:55px;

    color:#fff;

}

.overlay span{

    display:inline-block;

    margin-bottom:18px;

    color:#E5C486;

    text-transform:uppercase;

    letter-spacing:3px;

    font-size:12px;

    font-weight:600;

}

.overlay h3{

    color:#fff !important;

    font-family:'Cormorant Garamond',serif;

    font-size:56px;

    line-height:1.08;

    font-weight:400;

    max-width:620px;

    margin:0 0 28px;

    text-shadow:
        0 3px 10px rgba(0,0,0,.45);

}

.overlay a{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:#fff;

    text-decoration:none;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:12px;

    font-weight:600;

    transition:.35s;

}

.overlay a:hover{

    color:#E5C486;

    gap:14px;

}

/*==================================================
RIGHT ARTICLES
==================================================*/

.journal-list{

    display:flex;

    flex-direction:column;

    gap:38px;

}

.small-post{

    display:flex;

    gap:22px;

    align-items:center;

    text-decoration:none;

}

.small-post img{

    width:155px;

    height:155px;

    object-fit:cover;

    flex-shrink:0;

    border-radius:10px;

    transition:.45s;

}

.small-post:hover img{

    transform:scale(1.05);

}

.small-post span{

    display:block;

    margin-bottom:10px;

    color:var(--gold);

    font-size:11px;

    text-transform:uppercase;

    letter-spacing:2px;

}

.small-post h4{

    margin:0 0 20px;

}

.small-post a{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:var(--green);

    text-decoration:none;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:12px;

    transition:.3s;

}

.small-post a:hover{

    color:var(--gold);

    gap:14px;

}

/*==================================================
RESPONSIVE
==================================================*/

@media (max-width:1200px){

    .rr-journal .rr-container{

        grid-template-columns:1fr;

        gap:60px;

    }

    .journal-intro{

        position:relative;

        top:0;

    }

    .featured-article img{

        height:620px;

    }

}

@media (max-width:768px){

    .rr-journal{

        padding:90px 0;

    }

    .featured-article{

        border-radius:12px;

    }

    .featured-article img{

        height:460px;

    }

    .overlay{

        padding:30px 25px;

    }

    .overlay h3{

        font-size:34px;

        max-width:100%;

    }

    .journal-list{

        gap:30px;

    }

    .small-post{

        flex-direction:column;

        align-items:flex-start;

    }

    .small-post img{

        width:100%;

        height:240px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-926ce78 *//*======================================
WAYS TO LEARN
======================================*/

.rr-learn{

    background:#fff;

}

.rr-learn-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:45px;

    margin-top:80px;

}

.rr-large{

    grid-column:1 / -1;
    min-height:620px;

}

.rr-wide{

    grid-column:1 / -1;
    min-height:520px;

}

.rr-learn-card{

    position:relative;

    display:block;

    overflow:hidden;

    text-decoration:none;

    min-height:500px;

    border-radius:18px;

}

.rr-learn-card img{

    width:100%;
    height:100%;
    object-fit:cover;

    transition:transform .8s ease;

}

.rr-learn-card:hover img{

    transform:scale(1.05);

}

/*======================================
CONTENT PANEL
======================================*/

.rr-learn-overlay{

    position:absolute;

    left:35px;

    right:35px;

    bottom:35px;

    background:#FBF8F3;

    padding:35px;

    box-shadow:0 20px 50px rgba(0,0,0,.08);

    transition:.35s ease;

}

.rr-learn-card:hover .rr-learn-overlay{

    transform:translateY(-8px);

}

.rr-learn-overlay span{

    display:block;

    margin-bottom:15px;

    color:var(--gold);

    font-size:12px;

    letter-spacing:2px;

    text-transform:uppercase;

    font-weight:600;

}

.rr-learn-overlay h3{

    margin-bottom:15px;

    color:var(--green);

}

.rr-learn-overlay p{

    margin-bottom:18px;

}

.rr-learn-overlay::after{

    content:"Explore →";

    color:var(--green);

    font-size:12px;

    font-weight:600;

    letter-spacing:2px;

    text-transform:uppercase;

    transition:.3s;

}

.rr-learn-card:hover .rr-learn-overlay::after{

    color:var(--gold);

}

/*======================================
RESPONSIVE
======================================*/

@media(max-width:1024px){

    .rr-learn-grid{

        grid-template-columns:1fr;

        gap:40px;

    }

    .rr-large,
    .rr-wide{

        grid-column:auto;

        min-height:500px;

    }

}

@media(max-width:768px){

    .rr-learn-grid{

        margin-top:60px;

    }

    .rr-learn-card{

        min-height:360px;

    }

    .rr-large,
    .rr-wide{

        min-height:400px;

    }

    .rr-learn-overlay{

        left:20px;
        right:20px;
        bottom:20px;

        padding:22px;

    }

    .rr-learn-overlay h3{

        font-size:32px;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8d50cf1 *//*======================================
WHY RISE & ROOTED
======================================*/

.rr-difference{

    background:#fff;

}

.rr-features{

    max-width:1050px;

    margin:80px auto 0;

}

.rr-feature{

    display:grid;

    grid-template-columns:1fr auto;

    align-items:center;

    gap:40px;

    padding:45px 0;

    border-bottom:1px solid #E8E1D5;

    transition:.35s ease;

}

.rr-feature:first-child{

    border-top:1px solid #E8E1D5;

}

.rr-feature:hover{

    padding-left:15px;

}

.rr-text h3{

    margin-bottom:15px;

}

.rr-text p{

    max-width:620px;

}

.rr-icon{

    width:90px;

    height:90px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:40px;

    background:#F8F5EF;

    border:1px solid #ECE3D3;

    transition:all .35s ease;

    flex-shrink:0;

}

.rr-feature:hover .rr-icon{

    background:var(--green);

    color:#fff;

    transform:translateY(-5px);

}

.rr-feature:hover h3{

    color:var(--gold);

}

/*======================================
RESPONSIVE
======================================*/

@media(max-width:768px){

    .rr-features{

        margin-top:60px;

    }

    .rr-feature{

        grid-template-columns:1fr;

        text-align:center;

        gap:25px;

        padding:40px 0;

    }

    .rr-feature:hover{

        padding-left:0;

    }

    .rr-icon{

        order:-1;

        margin:0 auto;

        width:75px;

        height:75px;

        font-size:34px;

    }

    .rr-text p{

        margin:0 auto;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ca19242 *//*=========================================
SUCCESS STORIES
=========================================*/

.rr-success-stories{
    padding:120px 0;
    background:#F9F7F2;
}

.rr-success-heading{
    text-align:center;
    max-width:760px;
    margin:0 auto 70px;
}

.rr-success-heading h2{
    font-size:56px;
    color:#234739;
    margin-bottom:20px;
}

.rr-success-heading p{
    font-size:18px;
    color:#666;
    line-height:1.9;
}

/*======================
GRID
======================*/

.rr-story-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:35px;

}

/*======================
CARD
======================*/

.rr-story-card{

    display:block;

    background:#fff;

    border-radius:30px;

    overflow:hidden;

    box-shadow:0 18px 45px rgba(0,0,0,.08);

    transition:.4s ease;

    border:1px solid rgba(183,144,79,.18);

}

.rr-story-card:hover{

    transform:translateY(-10px);

    box-shadow:0 35px 80px rgba(0,0,0,.12);

}

.rr-story-card img{

    width:100%;

    display:block;

    transition:.5s;

}

.rr-story-card:hover img{

    transform:scale(1.03);

}

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

.rr-success-cta{

    margin-top:90px;

    background:#234739;

    border-radius:30px;

    text-align:center;

    padding:70px;

    color:#fff;

    position:relative;

    overflow:hidden;

}

.rr-success-cta::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    radial-gradient(circle at top right,

    rgba(255,255,255,.08),

    transparent 45%);

}

.rr-success-cta>*{

    position:relative;

    z-index:2;

}

.rr-success-cta h3{

    color:#fff;

    font-size:42px;

    margin-bottom:18px;

}

.rr-success-cta p{

    color:rgba(255,255,255,.85);

    font-size:18px;

    margin-bottom:35px;

}

.rr-success-cta .rr-btn-primary{

    display:inline-block;

    padding:16px 42px;

    background:#B7904F;

    color:#fff;

    text-decoration:none;

    border-radius:50px;

    transition:.3s;

}

.rr-success-cta .rr-btn-primary:hover{

    background:#D3AA63;

    transform:translateY(-3px);

}

/*======================
RESPONSIVE
======================*/

@media(max-width:991px){

.rr-story-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.rr-success-stories{

padding:80px 0;

}

.rr-success-heading h2{

font-size:38px;

}

.rr-story-grid{

grid-template-columns:1fr;

gap:25px;

}

.rr-success-cta{

padding:45px 25px;

}

.rr-success-cta h3{

font-size:32px;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-86a195b *//*======================================
FINAL CALL TO ACTION
======================================*/

.rr-final-cta{

    position:relative;

    padding:170px 0;

    background:url("YOUR-IMAGE-HERE.jpg") center center/cover no-repeat;

    overflow:hidden;

}

.rr-cta-overlay{

    position:absolute;

    inset:0;

    background:rgba(35,71,57,.72);

}

.rr-cta-content{

    position:relative;

    z-index:2;

    max-width:820px;

    margin:auto;

    text-align:center;

}

.rr-final-cta h2{

    font-family:'Cormorant Garamond',serif;

    font-size:68px;

    font-weight:500;

    line-height:1.1;

    color:#fff;

    margin-bottom:35px;

}

.rr-final-cta p{

    font-family:Inter,sans-serif;

    font-size:20px;

    line-height:2;

    color:rgba(255,255,255,.88);

    max-width:720px;

    margin:0 auto 55px;

}

.rr-final-cta .rr-small-title{

    color:#D7C18B;

    margin-bottom:28px;

}

.rr-final-cta .rr-small-title span{

    background:rgba(215,193,139,.45);

}

.rr-cta-buttons{

    display:flex;

    justify-content:center;

    gap:25px;

    flex-wrap:wrap;

}

.rr-btn-primary{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 40px;

    background:#B7904F;

    color:#fff;

    text-decoration:none;

    font-family:Inter,sans-serif;

    border-radius:50px;

    transition:.35s;

}

.rr-btn-primary:hover{

    background:#fff;

    color:#234739;

    transform:translateY(-4px);

}

.rr-btn-secondary{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 40px;

    border:1px solid rgba(255,255,255,.5);

    color:#fff;

    text-decoration:none;

    font-family:Inter,sans-serif;

    border-radius:50px;

    transition:.35s;

}

.rr-btn-secondary:hover{

    background:#fff;

    color:#234739;

}

/*======================================
Responsive
======================================*/

@media(max-width:991px){

.rr-final-cta{

padding:130px 0;

}

.rr-final-cta h2{

font-size:52px;

}

}

@media(max-width:767px){

.rr-final-cta{

padding:90px 0;

}

.rr-final-cta h2{

font-size:38px;

}

.rr-final-cta p{

font-size:17px;

line-height:1.8;

}

.rr-cta-buttons{

flex-direction:column;

}

.rr-btn-primary,
.rr-btn-secondary{

width:100%;

}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-660beb6 *//*======================================
FOOTER
======================================*/

.rr-footer{

    background:var(--green);

    color:#fff;

    text-align:center;

    padding:90px 0 40px;

}

.footer-logo{

    margin-bottom:30px;

}

.footer-logo img{

    width:170px;

    max-width:100%;

    margin:0 auto;

}

.footer-description{

    max-width:650px;

    margin:0 auto 45px;

    color:rgba(255,255,255,.78);

}

.footer-nav{

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:35px;

    margin-bottom:45px;

}

.footer-nav a{

    color:#fff;

    text-decoration:none;

    font-size:15px;

    transition:.3s ease;

}

.footer-nav a:hover{

    color:var(--gold);

}

.footer-social{

    display:flex;

    justify-content:center;

    gap:25px;

    margin-bottom:40px;

}

.footer-social a{

    color:var(--gold);

    text-decoration:none;

    transition:.3s ease;

}

.footer-social a:hover{

    color:#fff;

}

.footer-bottom{

    border-top:1px solid rgba(255,255,255,.15);

    padding-top:25px;

    font-size:14px;

    color:rgba(255,255,255,.55);

}

/*======================================
RESPONSIVE
======================================*/

@media(max-width:768px){

    .rr-footer{

        padding:70px 0 35px;

    }

    .footer-description{

        margin-bottom:35px;

    }

    .footer-nav{

        flex-direction:column;

        gap:18px;

        margin-bottom:35px;

    }

    .footer-social{

        gap:20px;

        flex-wrap:wrap;

        margin-bottom:30px;

    }

    .footer-bottom{

        font-size:13px;

        line-height:1.8;

    }

}/* End custom CSS */