/* =========================================================
   SRA ABOUT PAGE - REMOVE EXTRA TOP / BOTTOM SPACE
========================================================= */

html,
body{
    margin:0 !important;
    padding:0 !important;
}

.sra-about-page{
    margin:0 !important;
    padding:0 !important;
}

/* Astra / WordPress page wrapper */
.sra-about-page,
.sra-about-page > *{
    box-sizing:border-box;
}

/* Remove default spacing around page content */
.ast-page-builder-template .site-content,
.ast-page-builder-template .entry-content,
.page .entry-content{
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
}

/* Remove empty paragraph/block spacing */
.sra-about-page p:empty,
.sra-about-page br:first-child{
    display:none !important;
}

/* Last section should not create extra bottom gap */
.sra-about-page > *:last-child{
    margin-bottom:0 !important;
}


/* =========================================================
   SANATAN RATAN ACADEMY
   PREMIUM ABOUT US PAGE
   ========================================================= */

.sra-about-page{
    --sra-bg:#fffaf3;
    --sra-bg-soft:#f8ead8;
    --sra-white:#ffffff;
    --sra-gold:#b86a1d;
    --sra-gold-light:#d99132;
    --sra-brown:#3f2818;
    --sra-text:#59483a;
    --sra-muted:#806f60;
    --sra-border:rgba(184,106,29,.16);

    width:100%;
    overflow:hidden;
    color:var(--sra-text);
    background:var(--sra-bg);
}


/* =========================================================
   COMMON CONTAINER
   ========================================================= */

.sra-about-container{
    width:100%;
    max-width:1200px;
    margin:0 auto;
    padding:0 25px;
    box-sizing:border-box;
}


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

.sra-about-hero{
    position:relative;
    min-height:520px;

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

    text-align:center;

    padding:100px 25px;

    box-sizing:border-box;

    background:
        radial-gradient(
            circle at 20% 20%,
            rgba(217,145,50,.16),
            transparent 35%
        ),
        radial-gradient(
            circle at 80% 80%,
            rgba(184,106,29,.10),
            transparent 35%
        ),
        linear-gradient(
            180deg,
            #fffaf3 0%,
            #f8ead8 100%
        );
}


.sra-about-hero::before{
    content:"";

    position:absolute;

    width:420px;
    height:420px;

    top:-220px;
    right:-180px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(184,106,29,.10),
            transparent 70%
        );

    filter:blur(25px);

    pointer-events:none;
}


.sra-about-hero::after{
    content:"";

    position:absolute;

    width:360px;
    height:360px;

    bottom:-220px;
    left:-180px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(217,145,50,.10),
            transparent 70%
        );

    filter:blur(30px);

    pointer-events:none;
}


.sra-about-hero-inner{
    position:relative;
    z-index:2;

    width:100%;
    max-width:900px;
}


.sra-about-eyebrow{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    margin-bottom:20px;

    padding:8px 18px;

    border:1px solid rgba(184,106,29,.22);
    border-radius:50px;

    background:rgba(255,255,255,.65);

    color:var(--sra-gold);

    font-size:12px;
    font-weight:800;

    letter-spacing:2.5px;
}


.sra-about-hero h1{
    margin:0;

    color:var(--sra-brown);

    font-size:clamp(42px,6vw,76px);
    line-height:1.08;

    letter-spacing:-2px;

    font-weight:800;
}


.sra-about-hero h1 span{
    display:block;

    color:var(--sra-gold);
}


.sra-about-hero p{
    max-width:680px;

    margin:24px auto 0;

    color:var(--sra-muted);

    font-size:18px;
    line-height:1.7;
}


.sra-about-location{
    display:inline-flex;
    align-items:center;
    gap:8px;

    margin-top:28px;

    padding:10px 18px;

    border-radius:50px;

    background:rgba(255,255,255,.75);

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

    color:var(--sra-brown);

    font-size:14px;
    font-weight:700;
}


/* =========================================================
   INTRODUCTION
   ========================================================= */

.sra-about-intro{
    padding:110px 0;

    background:#fff;
}


.sra-about-intro-grid{
    display:grid;

    grid-template-columns:180px minmax(0,1fr);

    gap:70px;

    align-items:start;
}


.sra-about-section-label{
    position:relative;

    padding-top:8px;
}


.sra-about-section-label::after{
    content:"";

    position:absolute;

    left:0;
    bottom:-18px;

    width:45px;
    height:2px;

    background:var(--sra-gold);
}


.sra-about-section-label span{
    display:block;

    color:var(--sra-gold);

    font-size:14px;
    font-weight:800;

    letter-spacing:2px;
}


.sra-about-section-label p{
    margin:8px 0 0;

    color:var(--sra-brown);

    font-size:12px;
    font-weight:800;

    letter-spacing:1.5px;
}


.sra-about-intro-content h2{
    max-width:850px;

    margin:0 0 28px;

    color:var(--sra-brown);

    font-size:clamp(34px,4vw,55px);
    line-height:1.15;

    letter-spacing:-1.5px;
}


.sra-about-intro-content h2 span{
    display:block;

    color:var(--sra-gold);
}


.sra-about-intro-content p{
    max-width:820px;

    margin:0 0 18px;

    color:var(--sra-muted);

    font-size:16px;
    line-height:1.9;
}


.sra-about-intro-content strong{
    color:var(--sra-brown);
}


/* =========================================================
   ACADEMIC FOCUS
   ========================================================= */

.sra-about-focus{
    padding:110px 0;

    background:
        linear-gradient(
            180deg,
            #fffaf3 0%,
            #f8ead8 100%
        );
}


.sra-about-heading{
    max-width:850px;

    margin-bottom:55px;
}


.sra-about-heading.centered{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}


.sra-about-kicker{
    display:inline-block;

    margin-bottom:16px;

    color:var(--sra-gold);

    font-size:12px;
    font-weight:800;

    letter-spacing:2px;
}


.sra-about-heading h2{
    margin:0;

    color:var(--sra-brown);

    font-size:clamp(34px,4vw,55px);
    line-height:1.15;

    letter-spacing:-1.5px;
}


.sra-about-heading h2 span{
    color:var(--sra-gold);
}


.sra-about-heading p{
    max-width:700px;

    margin:20px 0 0;

    color:var(--sra-muted);

    font-size:16px;
    line-height:1.8;
}


.sra-about-heading.centered p{
    margin-left:auto;
    margin-right:auto;
}


.sra-about-programs{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:18px;
}


.sra-about-program{
    position:relative;

    min-height:245px;

    padding:28px;

    box-sizing:border-box;

    border:1px solid var(--sra-border);
    border-radius:20px;

    background:rgba(255,255,255,.72);

    box-shadow:
        0 15px 40px rgba(63,40,24,.06);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


.sra-about-program:hover{
    transform:translateY(-7px);

    border-color:rgba(184,106,29,.35);

    box-shadow:
        0 22px 50px rgba(63,40,24,.11);
}


.sra-about-program.featured{
    background:
        linear-gradient(
            145deg,
            #b86a1d,
            #8f4d13
        );

    border-color:transparent;
}


.sra-about-program .program-number{
    display:block;

    margin-bottom:35px;

    color:var(--sra-gold);

    font-size:12px;
    font-weight:800;

    letter-spacing:2px;
}


.sra-about-program.featured .program-number{
    color:#ffe3b2;
}


.sra-about-program h3{
    margin:0 0 12px;

    color:var(--sra-brown);

    font-size:22px;
    line-height:1.25;
}


.sra-about-program.featured h3{
    color:#fff;
}


.sra-about-program p{
    margin:0;

    color:var(--sra-muted);

    font-size:14px;
    line-height:1.7;
}


.sra-about-program.featured p{
    color:rgba(255,255,255,.82);
}


/* =========================================================
   PHILOSOPHY
   ========================================================= */

.sra-about-philosophy{
    padding:110px 0;

    background:#fff;
}


.sra-about-philosophy-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr);

    gap:80px;

    align-items:center;
}


.sra-about-philosophy-left h2{
    margin:0;

    color:var(--sra-brown);

    font-size:clamp(34px,4vw,54px);
    line-height:1.15;

    letter-spacing:-1.5px;
}


.sra-about-philosophy-left h2 span{
    display:block;

    color:var(--sra-gold);
}


.sra-about-philosophy-right{
    padding-left:35px;

    border-left:2px solid rgba(184,106,29,.20);
}


.sra-about-philosophy-right p{
    margin:0 0 20px;

    color:var(--sra-muted);

    font-size:16px;
    line-height:1.9;
}


.sra-about-values{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:18px;

    margin-top:75px;
}


.sra-about-value{
    padding:28px 24px;

    border-top:2px solid rgba(184,106,29,.22);

    background:#fffaf3;

    border-radius:0 0 16px 16px;
}


.sra-about-value > span{
    color:var(--sra-gold);

    font-size:12px;
    font-weight:800;

    letter-spacing:2px;
}


.sra-about-value h3{
    margin:20px 0 10px;

    color:var(--sra-brown);

    font-size:19px;
}


.sra-about-value p{
    margin:0;

    color:var(--sra-muted);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   MENTORS
   ========================================================= */

.sra-about-mentors{
    padding:110px 0;

    background:
        linear-gradient(
            180deg,
            #fffaf3 0%,
            #f8ead8 100%
        );
}


.sra-about-mentor-grid{
    display:grid;

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

    gap:25px;

    max-width:900px;

    margin:0 auto;
}


.sra-about-mentor-card{
    position:relative;

    padding:30px;

    border:1px solid var(--sra-border);
    border-radius:24px;

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

    box-shadow:
        0 20px 50px rgba(63,40,24,.07);

    overflow:hidden;
}


.sra-about-mentor-card::after{
    content:"";

    position:absolute;

    width:170px;
    height:170px;

    right:-80px;
    top:-80px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(217,145,50,.13),
            transparent 70%
        );

    pointer-events:none;
}


.mentor-top{
    display:flex;

    justify-content:space-between;
    align-items:center;

    color:var(--sra-gold);

    font-size:11px;
    font-weight:800;

    letter-spacing:2px;
}


.mentor-placeholder{
    width:100px;
    height:100px;

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

    margin:35px auto 25px;

    border-radius:50%;

    background:
        linear-gradient(
            145deg,
            #b86a1d,
            #8f4d13
        );

    color:#fff;

    font-size:28px;
    font-weight:800;

    box-shadow:
        0 15px 35px rgba(184,106,29,.25);
}


.sra-about-mentor-card h3{
    margin:0 0 10px;

    text-align:center;

    color:var(--sra-brown);

    font-size:23px;
}


.sra-about-mentor-card p{
    max-width:500px;

    margin:0 auto;

    text-align:center;

    color:var(--sra-muted);

    font-size:14px;
    line-height:1.8;
}


/* =========================================================
   APPROACH
   ========================================================= */

.sra-about-approach{
    padding:110px 0;

    background:#fff;
}


.sra-about-approach-header{
    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,420px);

    gap:70px;

    align-items:end;

    margin-bottom:60px;
}


.sra-about-approach-header h2{
    margin:0;

    color:var(--sra-brown);

    font-size:clamp(34px,4vw,53px);
    line-height:1.15;

    letter-spacing:-1.5px;
}


.sra-about-approach-header h2 span{
    display:block;

    color:var(--sra-gold);
}


.sra-about-approach-header > p{
    margin:0;

    color:var(--sra-muted);

    font-size:15px;
    line-height:1.85;
}


.sra-about-process{
    display:grid;

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

    gap:0;

    border-top:1px solid var(--sra-border);
    border-left:1px solid var(--sra-border);
}


.sra-process-item{
    min-height:220px;

    padding:30px;

    box-sizing:border-box;

    border-right:1px solid var(--sra-border);
    border-bottom:1px solid var(--sra-border);

    background:#fff;

    transition:
        background .3s ease,
        transform .3s ease;
}


.sra-process-item:hover{
    background:#fffaf3;

    transform:translateY(-3px);
}


.sra-process-item > span{
    color:var(--sra-gold);

    font-size:12px;
    font-weight:800;

    letter-spacing:2px;
}


.sra-process-item h3{
    margin:35px 0 12px;

    color:var(--sra-brown);

    font-size:20px;
}


.sra-process-item p{
    margin:0;

    color:var(--sra-muted);

    font-size:14px;
    line-height:1.7;
}


/* =========================================================
   STUDENTS
   ========================================================= */

.sra-about-students{
    padding:105px 0;

    background:
        linear-gradient(
            135deg,
            #3f2818 0%,
            #5a351c 100%
        );

    color:#fff;
}


.sra-about-students-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(0,1fr);

    gap:80px;

    align-items:center;
}


.sra-about-students h2{
    margin:0;

    color:#fff;

    font-size:clamp(34px,4vw,54px);
    line-height:1.15;

    letter-spacing:-1.5px;
}


.sra-about-students h2 span{
    display:block;

    color:#e5a34b;
}


.sra-about-students-content p{
    margin:0 0 20px;

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

    font-size:15px;
    line-height:1.9;
}


/* =========================================================
   QUOTE
   ========================================================= */

.sra-about-quote{
    padding:110px 0;

    background:#fffaf3;
}


.sra-about-quote-box{
    position:relative;

    max-width:900px;

    margin:0 auto;

    padding:70px 60px;

    box-sizing:border-box;

    text-align:center;

    border:1px solid var(--sra-border);
    border-radius:28px;

    background:#fff;

    box-shadow:
        0 25px 70px rgba(63,40,24,.08);
}


.quote-mark{
    position:absolute;

    top:20px;
    left:35px;

    color:rgba(184,106,29,.13);

    font-family:Georgia,serif;

    font-size:100px;

    line-height:1;
}


.sanskrit-line{
    margin:0;

    color:var(--sra-brown);

    font-size:26px;
    font-weight:700;
}


.quote-english{
    margin:15px 0 0;

    color:var(--sra-gold);

    font-size:18px;
    font-weight:700;
}


.quote-line{
    width:55px;
    height:2px;

    margin:25px auto;

    background:var(--sra-gold);
}


.quote-description{
    max-width:650px;

    margin:0 auto;

    color:var(--sra-muted);

    font-size:15px;
    line-height:1.8;
}


/* =========================================================
   COMMITMENT
   ========================================================= */

.sra-about-commitment{
    padding:110px 0;

    background:#fff;
}


.sra-about-commitment-grid{
    display:grid;

    grid-template-columns:150px minmax(0,1fr);

    gap:70px;
}


.commitment-number{
    color:rgba(184,106,29,.18);

    font-size:80px;
    font-weight:800;

    line-height:1;
}


.sra-about-commitment h2{
    margin:0 0 25px;

    color:var(--sra-brown);

    font-size:clamp(35px,4vw,55px);
    line-height:1.15;

    letter-spacing:-1.5px;
}


.sra-about-commitment h2 span{
    display:block;

    color:var(--sra-gold);
}


.sra-about-commitment p{
    max-width:850px;

    margin:0 0 17px;

    color:var(--sra-muted);

    font-size:15px;
    line-height:1.9;
}


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

.sra-about-final{
    position:relative;

    padding:120px 25px;

    text-align:center;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(217,145,50,.22),
            transparent 45%
        ),
        linear-gradient(
            135deg,
            #3f2818,
            #68401f
        );
}


.sra-about-final::before{
    content:"";

    position:absolute;

    width:450px;
    height:450px;

    top:-300px;
    left:50%;

    transform:translateX(-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,210,140,.13),
            transparent 70%
        );

    filter:blur(20px);
}


.sra-about-final-inner{
    position:relative;
    z-index:2;

    max-width:850px;

    margin:0 auto;
}


.sra-about-final-inner > span{
    color:#e5a34b;

    font-size:12px;
    font-weight:800;

    letter-spacing:3px;
}


.sra-about-final h2{
    margin:20px 0 18px;

    color:#fff;

    font-size:clamp(36px,5vw,65px);
    line-height:1.12;

    letter-spacing:-1.5px;
}


.sra-about-final h2 strong{
    color:#e5a34b;
}


.sra-about-final p{
    margin:0;

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

    font-size:16px;
    line-height:1.7;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:992px){

    .sra-about-hero{
        min-height:470px;
        padding:90px 25px;
    }

    .sra-about-intro-grid{
        grid-template-columns:140px minmax(0,1fr);
        gap:45px;
    }

    .sra-about-programs{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sra-about-philosophy-grid{
        gap:45px;
    }

    .sra-about-values{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sra-about-approach-header{
        grid-template-columns:
            minmax(0,1fr)
            minmax(0,350px);

        gap:40px;
    }

    .sra-about-process{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sra-about-students-grid{
        gap:45px;
    }

    .sra-about-commitment-grid{
        grid-template-columns:100px minmax(0,1fr);
        gap:45px;
    }

}


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

@media (max-width:576px){

    .sra-about-container{
        padding:0 17px;
    }


    /* HERO */

    .sra-about-hero{
        min-height:470px;

        padding:75px 18px;
    }

    .sra-about-eyebrow{
        font-size:10px;
        letter-spacing:1.8px;
        padding:7px 14px;
    }

    .sra-about-hero h1{
        font-size:40px;
        letter-spacing:-1.2px;
    }

    .sra-about-hero h1 span{
        margin-top:5px;
    }

    .sra-about-hero p{
        margin-top:20px;

        font-size:15px;
        line-height:1.65;
    }

    .sra-about-location{
        margin-top:22px;

        font-size:13px;
    }


    /* COMMON SECTIONS */

    .sra-about-intro,
    .sra-about-focus,
    .sra-about-philosophy,
    .sra-about-mentors,
    .sra-about-approach,
    .sra-about-quote,
    .sra-about-commitment{
        padding:75px 0;
    }


    /* INTRO */

    .sra-about-intro-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

    .sra-about-section-label{
        padding-top:0;
    }

    .sra-about-section-label::after{
        bottom:-13px;
    }

    .sra-about-intro-content h2{
        font-size:34px;
        letter-spacing:-.8px;
    }

    .sra-about-intro-content p{
        font-size:14px;
        line-height:1.8;
    }


    /* HEADINGS */

    .sra-about-heading{
        margin-bottom:38px;
    }

    .sra-about-heading h2{
        font-size:34px;
        letter-spacing:-.8px;
    }

    .sra-about-heading p{
        font-size:14px;
        line-height:1.75;
    }


    /* PROGRAMS */

    .sra-about-programs{
        grid-template-columns:1fr;
        gap:14px;
    }

    .sra-about-program{
        min-height:0;
        padding:24px;
    }

    .sra-about-program .program-number{
        margin-bottom:25px;
    }


    /* PHILOSOPHY */

    .sra-about-philosophy-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

    .sra-about-philosophy-left h2{
        font-size:34px;
    }

    .sra-about-philosophy-right{
        padding-left:20px;
    }

    .sra-about-philosophy-right p{
        font-size:14px;
        line-height:1.8;
    }

    .sra-about-values{
        grid-template-columns:1fr;
        gap:12px;

        margin-top:45px;
    }

    .sra-about-value{
        padding:23px 20px;
    }


    /* MENTORS */

    .sra-about-mentor-grid{
        grid-template-columns:1fr;
        gap:16px;
    }

    .sra-about-mentor-card{
        padding:25px 20px;
    }

    .mentor-placeholder{
        width:88px;
        height:88px;

        margin:28px auto 22px;
    }


    /* APPROACH */

    .sra-about-approach-header{
        grid-template-columns:1fr;
        gap:25px;

        margin-bottom:40px;
    }

    .sra-about-approach-header h2{
        font-size:34px;
    }

    .sra-about-approach-header > p{
        font-size:14px;
        line-height:1.8;
    }

    .sra-about-process{
        grid-template-columns:1fr;
    }

    .sra-process-item{
        min-height:0;

        padding:25px 22px;
    }

    .sra-process-item h3{
        margin-top:25px;
    }


    /* STUDENTS */

    .sra-about-students{
        padding:75px 0;
    }

    .sra-about-students-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

    .sra-about-students h2{
        font-size:34px;
    }

    .sra-about-students-content p{
        font-size:14px;
        line-height:1.8;
    }


    /* QUOTE */

    .sra-about-quote-box{
        padding:55px 22px 40px;

        border-radius:22px;
    }

    .quote-mark{
        left:18px;
        top:12px;

        font-size:75px;
    }

    .sanskrit-line{
        font-size:20px;
        line-height:1.5;
    }

    .quote-english{
        font-size:16px;
    }

    .quote-description{
        font-size:14px;
        line-height:1.75;
    }


    /* COMMITMENT */

    .sra-about-commitment-grid{
        grid-template-columns:1fr;
        gap:20px;
    }

    .commitment-number{
        font-size:55px;
    }

    .sra-about-commitment h2{
        font-size:34px;
    }

    .sra-about-commitment p{
        font-size:14px;
        line-height:1.8;
    }


    /* FINAL */

    .sra-about-final{
        padding:85px 20px;
    }

    .sra-about-final-inner > span{
        font-size:10px;
        letter-spacing:2px;
    }

    .sra-about-final h2{
        font-size:37px;
        letter-spacing:-.8px;
    }

    .sra-about-final p{
        font-size:14px;
    }

}


/* =========================================================
   EXTRA SMALL
   ========================================================= */

@media (max-width:380px){

    .sra-about-hero h1{
        font-size:35px;
    }

    .sra-about-hero{
        min-height:440px;
    }

    .sra-about-heading h2,
    .sra-about-intro-content h2,
    .sra-about-philosophy-left h2,
    .sra-about-approach-header h2,
    .sra-about-students h2,
    .sra-about-commitment h2{
        font-size:31px;
    }

    .sra-about-final h2{
        font-size:33px;
    }

}