/* =======================================================
KiraEdu Money Course Page
======================================================= */

:root{
    --money-gold:#d4af37;
    --money-gold-dark:#a87908;
    --money-gold-light:#f4d66b;
    --money-gold-soft:#fff7d6;


    --money-dark:#171813;
    --money-dark-soft:#23241e;

    --money-text:#0f172a;
    --money-muted:#64748b;

    --money-page:#f7f4eb;
    --money-surface:#ffffff;
    --money-surface-soft:#fffdf7;

    --money-border:#e7e1d3;
    --money-shadow:0 22px 60px rgba(15,23,42,.10);


    }

    /* =======================================================
    Page
    ======================================================= */

    .money-course-page{
    min-height:100vh;


    background:
        radial-gradient(
            circle at top left,
            rgba(212,175,55,.07),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #fffdf8,
            var(--money-page)
        );


    }

    /* =======================================================
    Hero
    ======================================================= */

    .money-course-hero{
    position:relative;
    overflow:hidden;


    padding:96px 28px;

    color:white;

    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(212,175,55,.26),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #11120f,
            #1c1d18 58%,
            #292a22
        );


    }

    .money-course-hero::after{
    content:"";


    position:absolute;
    right:-130px;
    bottom:-250px;

    width:520px;
    height:520px;

    border:1px solid rgba(212,175,55,.14);
    border-radius:50%;

    pointer-events:none;


    }

    .money-course-hero-inner{
    position:relative;
    z-index:2;


    width:min(100%,1280px);
    margin-inline:auto;

    display:grid;
    grid-template-columns:minmax(0,1.45fr) 390px;
    gap:70px;

    align-items:center;


    }

    .money-course-category,
    .money-section-label,
    .money-enrollment-kicker,
    .money-hero-card-label{
    display:inline-flex;


    font-size:11px;
    font-weight:900;
    letter-spacing:.11em;

    text-transform:uppercase;


    }

    .money-course-category{
    margin-bottom:20px;
    padding:9px 14px;


    border:1px solid rgba(212,175,55,.35);
    border-radius:999px;

    background:rgba(212,175,55,.12);
    color:#f5db72;


    }

    .money-course-hero-copy h1{
    max-width:850px;
    margin:0 0 22px;


    color:white;
    font-family:var(--font-heading);
    font-size:clamp(50px,6.7vw,82px);
    line-height:.94;
    letter-spacing:-.045em;


    }

    .money-course-hero-copy > p{
    max-width:760px;
    margin:0;


    color:#d8dde5;
    font-size:18px;
    line-height:1.75;


    }

    .money-course-highlights{
    display:flex;
    flex-wrap:wrap;
    gap:11px;


    margin-top:28px;


    }

    .money-course-highlights span{
    display:inline-flex;
    align-items:center;
    gap:8px;


    padding:10px 13px;
    border-radius:999px;

    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.11);

    color:#eef2f7;
    font-size:12px;
    font-weight:800;


    }

    .money-course-highlights i{
    color:#f4d66b;
    }

    .money-course-hero-actions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:22px;


    margin-top:34px;


    }

    .money-course-text-link{
    display:inline-flex;
    align-items:center;
    gap:8px;


    color:#f0d466;
    text-decoration:none;
    font-weight:800;


    }

    /* Hero side card */

    .money-hero-card{
    padding:34px;


    border-radius:28px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.13),
            rgba(255,255,255,.06)
        );

    border:1px solid rgba(212,175,55,.24);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.11),
        0 30px 70px rgba(0,0,0,.22);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);


    }

    .money-hero-card-label{
    color:#f4d66b;
    }

    .money-hero-card h2{
    margin:12px 0 15px;


    color:white;
    font-family:var(--font-heading);
    font-size:36px;
    line-height:1.02;


    }

    .money-hero-card > p{
    margin:0;


    color:#d5d9df;
    line-height:1.7;


    }

    .money-hero-card-points{
    display:grid;
    gap:12px;


    margin-top:25px;
    padding-top:23px;

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


    }

    .money-hero-card-points div{
    display:flex;
    align-items:center;
    gap:11px;


    color:#f1f5f9;
    font-size:13px;
    font-weight:750;


    }

    .money-hero-card-points i{
    width:24px;
    height:24px;


    display:grid;
    place-items:center;

    border-radius:50%;

    background:rgba(212,175,55,.16);
    color:#f4d66b;

    font-size:10px;


    }

    /* =======================================================
    Main Content Layout
    ======================================================= */

    .money-course-layout{
    width:min(calc(100% - 44px),1280px);
    margin-inline:auto;


    display:grid;
    grid-template-columns:minmax(0,1fr) 350px;
    gap:42px;

    padding:76px 0;
    align-items:start;


    }

    .money-course-content{
    display:grid;
    gap:28px;
    }

    .money-content-section{
    padding:42px;


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

    background:var(--money-surface);
    box-shadow:var(--money-shadow);


    }

    .money-section-label{
    margin-bottom:10px;
    color:var(--money-gold-dark);
    }

    .money-content-section > h2,
    .money-section-heading h2{
    margin:0 0 20px;


    color:var(--money-text);
    font-family:var(--font-heading);
    font-size:clamp(36px,4vw,52px);
    line-height:1;
    letter-spacing:-.035em;


    }

    .money-overview-copy{
    color:#475569;
    font-size:16px;
    line-height:1.85;
    }

    .money-overview-copy p:last-child{
    margin-bottom:0;
    }

    /* Outcomes */

    .money-outcomes-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
    }

    .money-outcome-card{
    display:flex;
    align-items:flex-start;
    gap:16px;


    padding:22px;

    border:1px solid var(--money-border);
    border-radius:19px;

    background:var(--money-surface-soft);


    }

    .money-outcome-icon{
    width:45px;
    height:45px;
    flex-shrink:0;


    display:grid;
    place-items:center;

    border-radius:15px;

    background:var(--money-gold-soft);
    color:var(--money-gold-dark);


    }

    .money-outcome-card h3{
    margin:1px 0 7px;


    color:var(--money-text);
    font-size:16px;


    }

    .money-outcome-card p{
    margin:0;


    color:var(--money-muted);
    font-size:13px;
    line-height:1.65;


    }

    /* =======================================================
    Sticky Enrollment Card
    ======================================================= */

    .money-enrollment-column{
    position:sticky;
    top:100px;
    }

    .money-enrollment-card{
    padding:30px;


    border-radius:27px;

    background:
        radial-gradient(
            circle at top right,
            rgba(212,175,55,.12),
            transparent 35%
        ),
        var(--money-surface);

    border:1px solid rgba(212,175,55,.28);
    box-shadow:var(--money-shadow);


    }

    .money-enrollment-kicker{
    color:var(--money-gold-dark);
    }

    .money-enrollment-card h2{
    margin:10px 0 13px;


    color:var(--money-text);
    font-family:var(--font-heading);
    font-size:34px;
    line-height:1.02;


    }

    .money-enrollment-card > p{
    margin:0 0 24px;


    color:var(--money-muted);
    line-height:1.65;


    }

    .money-signin-link{
    display:block;


    margin-top:13px;

    color:var(--money-gold-dark);
    text-align:center;
    text-decoration:none;
    font-size:12px;
    font-weight:800;


    }

    .money-program-details{
    display:grid;
    gap:0;


    margin-top:28px;
    padding-top:12px;

    border-top:1px solid var(--money-border);


    }

    .money-program-details > div{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;


    padding:14px 0;

    border-bottom:1px solid #f0ede5;


    }

    .money-program-details > div:last-child{
    border-bottom:0;
    }

    .money-program-details span{
    color:var(--money-muted);
    font-size:12px;
    font-weight:750;
    }

    .money-program-details strong{
    max-width:180px;


    color:var(--money-text);
    text-align:right;
    font-size:12px;

    overflow-wrap:anywhere;


    }
/* =======================================================
Premium Session Product Cards
======================================================= */

.money-session-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:26px;
    }
    
    .money-session-card{
    --session-theme:#d4af37;
    --session-dark:#a87908;
    --session-light:#fff4cf;
    --session-border:rgba(212,175,55,.28);
    
    
    position:relative;
    overflow:hidden;
    
    min-width:0;
    height:100%;
    
    display:flex;
    flex-direction:column;
    
    border:1px solid var(--session-border);
    border-radius:26px;
    
    background:#ffffff;
    
    box-shadow:
        0 18px 48px rgba(15,23,42,.09);
    
    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
    
    
    }
    
    .money-session-card:hover{
    transform:translateY(-6px);
    
    
    border-color:var(--session-theme);
    
    box-shadow:
        0 30px 74px rgba(15,23,42,.15);
    
    
    }
    
    /* =======================================================
    Session Themes
    ======================================================= */
    
    .money-session-card.is-blue{
    --session-theme:#2563eb;
    --session-dark:#1d4ed8;
    --session-light:#eaf2ff;
    --session-border:rgba(37,99,235,.26);
    }
    
    .money-session-card.is-green{
    --session-theme:#16a34a;
    --session-dark:#15803d;
    --session-light:#ebfff2;
    --session-border:rgba(22,163,74,.26);
    }
    
    .money-session-card.is-red{
    --session-theme:#dc2626;
    --session-dark:#b91c1c;
    --session-light:#ffecec;
    --session-border:rgba(220,38,38,.26);
    }
    
    .money-session-card.is-orange{
    --session-theme:#ea580c;
    --session-dark:#c2410c;
    --session-light:#fff3eb;
    --session-border:rgba(234,88,12,.26);
    }
    
    .money-session-card.is-purple{
    --session-theme:#7c3aed;
    --session-dark:#6d28d9;
    --session-light:#f4ecff;
    --session-border:rgba(124,58,237,.26);
    }
    
    /* =======================================================
    Thin Cinematic Image Strip
    ======================================================= */
    
    .money-session-image{
    position:relative;
    overflow:hidden;
    
    
    height:132px;
    flex-shrink:0;
    
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    
    
    }
    
    .money-session-card.is-gold .money-session-image{
    background-image:url(
    "https://images.unsplash.com/photo-1524178232363-1fb2b075b655?auto=format&fit=crop&w=1000&q=80"
    );
    }
    
    .money-session-card.is-blue .money-session-image{
    background-image:url(
    "https://images.unsplash.com/photo-1522202176988-66273c2fd55f?auto=format&fit=crop&w=1000&q=80"
    );
    }
    
    .money-session-card.is-green .money-session-image{
    background-image:url(
    "https://images.unsplash.com/photo-1523240795612-9a054b0db644?auto=format&fit=crop&w=1000&q=80"
    );
    }
    
    .money-session-card.is-red .money-session-image{
    background-image:url(
    "https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?auto=format&fit=crop&w=1000&q=80"
    );
    }
    
    .money-session-card.is-orange .money-session-image{
    background-image:url(
    "https://images.unsplash.com/photo-1606326608606-aa0b62935f2b?auto=format&fit=crop&w=1000&q=80"
    );
    }
    
    .money-session-card.is-purple .money-session-image{
    background-image:url(
    "https://images.unsplash.com/photo-1590650046871-92c887180603?auto=format&fit=crop&w=1000&q=80"
    );
    }
    
    .money-session-image-overlay{
    position:absolute;
    inset:0;
    
    
    background:
        linear-gradient(
            90deg,
            rgba(15,23,42,.78),
            rgba(15,23,42,.34),
            rgba(15,23,42,.14)
        );
    
    
    }
    
    .money-session-image::after{
    content:"";
    
    
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    
    height:5px;
    
    background:linear-gradient(
        90deg,
        var(--session-light),
        var(--session-theme),
        var(--session-dark)
    );
    
    
    }
    
    .money-session-image-label{
    position:absolute;
    left:22px;
    bottom:20px;
    z-index:2;
    
    
    color:#ffffff;
    
    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;
    
    font-size:25px;
    font-style:italic;
    font-weight:700;
    line-height:1;
    
    text-shadow:
        0 3px 16px rgba(0,0,0,.38);
    
    
    }
    
    .money-session-image-icon{
    position:absolute;
    right:20px;
    top:18px;
    z-index:2;
    
    
    width:46px;
    height:46px;
    
    display:grid;
    place-items:center;
    
    border-radius:15px;
    
    background:rgba(255,255,255,.14);
    border:1px solid rgba(255,255,255,.24);
    
    color:#ffffff;
    font-size:18px;
    
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    
    
    }
    
    /* =======================================================
    Card Body
    ======================================================= */
    
    .money-session-card-body{
    padding:25px;
    margin: 20px;
    
    
    display:flex;
    flex:1;
    flex-direction:column;
    
    
    }
    
    .money-session-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    
    
    margin-bottom:16px;
    
    
    }
    
    .money-session-type{
    color:var(--session-dark);
    
    
    font-size:10px;
    font-weight:900;
    letter-spacing:.09em;
    
    text-transform:uppercase;
    
    
    }
    
    .money-session-status{
    display:inline-flex;
    align-items:center;
    
    
    padding:7px 11px;
    
    border-radius:999px;
    
    background:var(--session-light);
    border:1px solid var(--session-border);
    
    color:var(--session-dark);
    
    font-size:10px;
    font-weight:900;
    letter-spacing:.06em;
    
    text-transform:uppercase;
    
    
    }
    
    .money-session-copy h3{
    margin:0 0 11px;
    
    
    color:var(--money-text);
    font-family:var(--font-heading);
    font-size:30px;
    line-height:1.05;
    letter-spacing:-.025em;
    
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    
    min-height:2.1em;
    
    overflow:hidden;
    
    
    }
    
    .money-session-copy p{
    margin:0;
    
    
    color:var(--money-muted);
    font-size:13px;
    line-height:1.7;
    
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    
    min-height:3.4em;
    
    overflow:hidden;
     
    }
    
    /* =======================================================
    Session Details
    ======================================================= */
    
    .money-session-details{
    display:grid;
    gap:10px;
    
    
    margin-top:21px;
    padding:18px 0;
    
    border-top:1px solid var(--money-border);
    border-bottom:1px solid var(--money-border);
  
    
    }
    
    .money-session-details div{
    display:flex;
    align-items:flex-start;
    gap:11px;
    
    
    color:#475569;
    font-size:12px;
    line-height:1.5;
  
    
    }
    
    .money-session-details i{
    width:17px;
    margin-top:2px;
    
 
    color:var(--session-dark);
    text-align:center;
   
    
    }
    
    .money-session-details span{
    overflow-wrap:anywhere;
    }
    
    /* =======================================================
    Product Footer
    ======================================================= */
    
    .money-session-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    
   
    margin-top:auto;
    padding-top:21px;
    
    
    }
    
    .money-session-price span{
    display:block;
    
    
    color:var(--money-muted);
    font-size:10px;
    font-weight:850;
    letter-spacing:.04em;
    
    text-transform:uppercase;
   
    }
    
    .money-session-price strong{
    display:block;
    
  
    margin-top:2px;
    
    color:var(--money-text);
    font-size:27px;
    line-height:1;
   
    
    }
    
    .money-session-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    
  
    padding:13px 17px;
    border-radius:13px;
    
    background:linear-gradient(
        135deg,
        var(--money-gold-light),
        var(--money-gold),
        var(--money-gold-dark)
    );
    
    color:#171711;
    text-decoration:none;
    font-size:12px;
    font-weight:900;
    
    box-shadow:
        0 10px 24px rgba(212,175,55,.22);
    
    transition:
        transform .22s ease,
        box-shadow .22s ease;
   
    
    }
    
    .money-session-button:hover{
    transform:translateY(-2px);
   
    box-shadow:
        0 16px 34px rgba(212,175,55,.34);

    
    }
    
    /* =======================================================
    Session Card Responsive
    ======================================================= */
    
    @media(max-width:850px){
    
 
    .money-session-grid{
        grid-template-columns:1fr;
    }
    
    .money-session-image{
        height:150px;
    }
  
    
    }
    
    @media(max-width:620px){
    
  
    .money-session-card{
        border-radius:22px;
    }
    
    .money-session-image{
        height:125px;
    }
    
    .money-session-image-label{
        left:18px;
        bottom:18px;
    
        font-size:22px;
    }
    
    .money-session-card-body{
        padding:22px 19px;
    }
    
    .money-session-copy h3{
        min-height:auto;
        font-size:27px;
    }
    
    .money-session-footer{
        align-items:stretch;
        flex-direction:column;
    }
    
    .money-session-button{
        width:100%;
    }
  
    
    }
    

    /* =======================================================
    Trust Strip
    ======================================================= */

    .money-trust-section{
    padding:35px 24px 65px;
    }

    .money-trust-inner{
    width:min(100%,1280px);
    margin-inline:auto;


    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;


    }

    .money-trust-inner > div{
    display:flex;
    align-items:center;
    gap:15px;


    padding:22px;

    border:1px solid var(--money-border);
    border-radius:18px;

    background:white;


    }

    .money-trust-inner i{
    width:42px;
    height:42px;
    flex-shrink:0;


    display:grid;
    place-items:center;

    border-radius:14px;

    background:var(--money-gold-soft);
    color:var(--money-gold-dark);


    }

    .money-trust-inner span{
    color:var(--money-muted);
    font-size:12px;
    line-height:1.5;
    }

    .money-trust-inner strong{
    display:block;


    margin-bottom:2px;

    color:var(--money-text);
    font-size:13px;


    }
    .money-session-count{

        width:190px;
        flex-shrink:0;
    
        padding:24px;
    
        text-align:center;
    
        border-radius:24px;
        margin-bottom: 20px;
    
        background:
            linear-gradient(
                145deg,
                #ffffff,
                #fffaf0
            );
    
        border:1px solid rgba(212,175,55,.28);
    
        box-shadow:
            0 18px 45px rgba(15,23,42,.08);
    }
    
    .money-session-count small{
    
        display:block;
    
        margin-bottom:12px;
    
        color:#b8860b;
    
        font-size:11px;
    
        font-weight:900;
    
        letter-spacing:.12em;
    
        text-transform:uppercase;
    }
    
    .money-session-count .count-number{
    
        font-size:64px;
    
        font-weight:900;
    
        line-height:1;
    
        color:#d4af37;
    
        font-family:var(--font-heading);
    
        text-shadow:
            0 8px 18px rgba(212,175,55,.18);
    }
    
    .money-session-count p{
    
        margin:14px 0 0;
    
        color:#64748b;
    
        font-size:13px;
    
        font-weight:700;
    
        line-height:1.5;
    }

    .money-sessions-section{
        padding:56px 12px 65px;
    }
    /* =======================================================
    Responsive
    ======================================================= */

    @media(max-width:1050px){


    .money-course-hero-inner{
        grid-template-columns:minmax(0,1fr) 330px;
        gap:36px;
    }

    .money-course-layout{
        grid-template-columns:minmax(0,1fr) 310px;
        gap:26px;
    }


    }

    @media(max-width:850px){


    .money-course-hero{
        padding:72px 22px;
    }

    .money-course-hero-inner,
    .money-course-layout{
        grid-template-columns:1fr;
    }

    .money-hero-card{
        max-width:600px;
    }

    .money-enrollment-column{
        position:relative;
        top:auto;
    }

    .money-enrollment-card{
        max-width:none;
    }

    .money-session-grid{
        grid-template-columns:1fr;
    }

    .money-trust-inner{
        grid-template-columns:1fr;
    }


    }

    @media(max-width:620px){


    .money-course-layout{
        width:min(calc(100% - 24px),1280px);
        padding:48px 0;
    }

    .money-content-section{
        padding:27px 22px;
        border-radius:22px;
    }

    .money-outcomes-grid{
        grid-template-columns:1fr;
    }

    .money-section-heading{
        align-items:flex-start;
        flex-direction:column;
        gap:18px;
    }

  .money-session-count{

    width:190px;
    flex-shrink:0;

    padding:24px;

    text-align:center;

    border-radius:24px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #fffaf0
        );

    border:1px solid rgba(212,175,55,.28);

    box-shadow:
        0 18px 45px rgba(15,23,42,.08);
}

.money-session-count small{

    display:block;

    margin-bottom:12px;

    color:#b8860b;

    font-size:11px;

    font-weight:900;

    letter-spacing:.12em;

    text-transform:uppercase;
}

.money-session-count .count-number{

    font-size:64px;

    font-weight:900;

    line-height:1;

    color:#d4af37;

    font-family:var(--font-heading);

    text-shadow:
        0 8px 18px rgba(212,175,55,.18);
}

.money-session-count p{

    margin:14px 0 0;

    color:#64748b;

    font-size:13px;

    font-weight:700;

    line-height:1.5;
}

    .money-sessions-section{
        padding:56px 12px 65px;
    }

    .money-session-card{
        padding:23px 20px;
        margin-bottom: 25px;
    }

    .money-session-footer{
        align-items:stretch;
        flex-direction:column;
    }

    .money-session-button{
        width:100%;
    }

    .money-course-highlights{
        align-items:flex-start;
        flex-direction:column;
    }


    }

    @media(max-width:420px){


    .money-course-hero{
        padding:62px 16px;
    }

    .money-course-hero-copy h1{
        font-size:43px;
    }

    .money-hero-card{
        padding:25px 22px;
    }

    .money-enrollment-card{
        padding:25px 21px;
    }

    .money-program-details > div{
        align-items:flex-start;
        flex-direction:column;
        gap:5px;
    }

    .money-program-details strong{
        max-width:none;
        text-align:left;
    }


    }

    /* =======================================================
    Reduced Motion
    ======================================================= */

    @media(prefers-reduced-motion:reduce){


    .money-session-card,
    .money-session-button{
        transition:none !important;
    }

    .money-session-card:hover{
        transform:none;
    }


    }