:root {
         --burgundy: #4A0C2C;
        --cream: #f5e6d3;
        --gold: #d47a41;
        --pink: rgb(236, 104, 214);
    }

    body {
        margin: 0;
        background: #ffffff;
        font-family: 'sans-serif';
        color: #3a2c2a;
    }

    /* Main wrapper */
    .invite-wrapper {
        width: min(850px, 90%);
        margin: auto;
        position: relative;
        padding-top: 100px; /* Space for fixed nav */
    }

    /* Script Heading */
    .script-heading {
        font-family: 'Allura', cursive;
        font-size: 34px;
        color: var(--pink);
        margin-bottom: 20px;
        text-align: left;
    }

    /* Center Logo Section */
    .center-logo {
        text-align: center;
        margin-bottom: 35px;
    }

    .logo {
        width: 100%;
        max-width: 400px;
        height: auto;
        display: block;
        margin: 0 auto;
    }

    .mission {
        font-family: 'sans-serif';
        font-size: 20px;
        font-weight: bolder;
        color: var(--burgundy);
        margin-top: 10px;
        text-align: center;
    }

    /* Typography */
    .section-title {
        font-family: 'Playfair Display', serif;
        font-size: 24px;
        margin-bottom: 18px;
        color: var(--burgundy);
        text-align: center;
    }

    p, .key-para, .key-title {
        font-family: 'sans-serif';
        font-size: 18px;
        line-height: 1.6;
        color: #3a2c2a;
        text-align: left;
    }

    .key-title {
        font-size: 18px;
        font-weight: bold;
        margin: 35px 0 15px;
        color: var(--burgundy);
    }

    .key-para {
        margin-bottom: 20px;

    }

    .key-para strong {
        color: var(--burgundy);
    }

    ul.key-para {
        padding-left: 20px;
    }

    ul.key-para li {
        margin-bottom: 12px;
        font-size: 18px;
       
    }

    .highlight-list{
         line-height: 1.58;
         font-size: 18px;
    }

    .warm-regards {
        font-family: 'Allura', cursive;
        font-size: 32px;
        color: #b67879;
        margin: 40px 0 10px;
    }

    .bottom-stroke {
        width: 180px;
        height: auto;
        margin: 40px auto 0;
        display: block;
    }

    /* Hide logo on screens below 900px */
@media (max-width: 900px) {
    .logo ,.mission{
        display: none !important;
    }
}


    /* ====================== NAVIGATION ====================== */
    /*  */