/* ==========================================
   HOW IT WORKS SECTION
========================================== */

.how-it-works-section {
    position: relative;
    overflow: hidden;
 

    padding: 15px   0px;

    color: #222;
}


/* ==========================================
   MAIN HEADING
========================================== */

.how-main-heading {
    position: relative;
    z-index: 2;

    margin-bottom: 45px;
}


.how-small-heading {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-bottom: 30px;
}


.how-small-heading span {
    width: 45px;
    height: 1px;

    background: #c9aa78;
}


.how-small-heading em {
   

    font-size: 9px;
    font-style: normal;
    font-weight: 600;

    letter-spacing: 4px;

    color: #b08a4c;
}


.how-main-heading h2 {
    margin: 0;
 

    font-size: 40px;
    line-height: 1.18;

    font-weight: 400;

    color: #151515;
}


.how-main-heading h2 i {
    color: #28776e;

    font-style: italic;
    font-weight: 400;
}


/* ==========================================
   STEPS ROW
========================================== */

.how-steps-row {
    position: relative;
    z-index: 3;

    display: grid;

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

    gap: 0;

    width: 100%;
}


/* ==========================================
   INDIVIDUAL STEP
========================================== */

.how-step {
    position: relative;

    text-align: center;

    padding: 0 25px;

    cursor: pointer;
}


/* ==========================================
   TOP NUMBER AREA
========================================== */

.step-top {
    position: relative;

    height: 55px;

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


/* Number */

.step-number {
    position: relative;
    z-index: 5;

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

    font-size: 50px;
    line-height: 1;
    font-weight: 400;

    color: #b18a4d;

    transition:
        color 0.35s ease,
        transform 0.35s ease;
}


/* ==========================================
   CONNECTOR
========================================== */

.step-connector {
    position: absolute;

    top: 50%;
    left: calc(50% + 43px);

    transform: translateY(-50%);

    display: flex;
    align-items: center;

    width: calc(100% - 55px);

    z-index: 2;
}


.connector-line {
    display: block;

    flex: 1;

    height: 1px;

    background: #cfb88f;
}


.connector-diamond {
    flex: 0 0 auto;

    margin: 0 10px;

    font-size: 7px;

    color: #ae8548;

    line-height: 1;
}


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

.step-content {
    margin-top: 20px;
}


.step-content h3 {
    margin: 0 0 17px;
 

    font-size: 16px;
    line-height: 1.4;

    font-weight: 600;

    letter-spacing: 2px;

    color: #252525;

    transition: color 0.35s ease;
}


.step-content p {
    max-width: 245px;

    margin: 0 auto;
 

    font-size: 16px;

    line-height: 1.75;

    font-weight: 400;

    color: #333;

    transition: color 0.35s ease;
}


/* ==========================================
   WHOLE BLOCK HOVER
========================================== */

.how-step:hover .step-number {
    color: #28776e;

    transform: scale(1.08);
}


.how-step:hover .step-content h3 {
    color: #28776e;
}


.how-step:hover .step-content p {
    color: #28776e;
}


/* ==========================================
   BOTTOM DECORATION
========================================== */

.how-bottom-decoration {
    position: relative;
    z-index: 3;

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

    gap: 14px;

    margin-top: 42px;
}


.how-bottom-decoration span {
    width: 46px;
    height: 1px;

    background: #d4c1a0;
}


.how-bottom-decoration b {
    font-size: 7px;

    font-weight: normal;

    color: #b18a4d;
}

/* ==========================================
   SIDE DECORATIVE IMAGES
========================================== */

.how-side-image {
    position: absolute;
    z-index: 1;
    pointer-events: none;
}

.how-side-image img {
    display: block;
    width: 100%;
    height: auto;
}


/* LEFT IMAGE */

.how-side-image-left {
    left: 0px;
    top: 75px;
    width: 300px;
}


/* RIGHT IMAGE */

.how-side-image-right {
    right: -23px;
    top: 20px;
    width: 320px;
}


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

@media (max-width: 991px) {

    .how-side-image-left {
        left: -35px;
        top: 160px;
        width: 300px;
        opacity: .6;
    }

    .how-side-image-right {
        right: -45px;
        top: 25px;
        width: 300px;
        opacity: .6;
    }

}


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

@media (max-width: 767px) {

    .how-side-image-left {
        left: -50px;
        top: 130px;
        width: 300px;
        opacity: .35;
    }

    .how-side-image-right {
        right: -50px;
        top: 585px;
        width: 300px;
        opacity: .55;
    }

}
  


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

@media (max-width: 991px) {

    .how-it-works-section {
     padding: 35px 15px 60px;
    }


    .how-main-heading h2 {
        font-size: 36px;
    }


    .how-steps-row {
        grid-template-columns: repeat(2, 1fr);

        row-gap: 50px;
    }


    .how-step {
        padding: 0 30px;
    }


    /* Hide connectors on tablet */

    .step-connector {
        display: none;
    }

 

}


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

@media (max-width: 767px) {

    .how-it-works-section {
              padding: 35px 15px 60px;
    }


    .how-main-heading {
        margin-bottom: 38px;
    }


    .how-small-heading {
        margin-bottom: 22px;
    }


    .how-small-heading span {
        width: 30px;
    }


    .how-small-heading em {
        font-size: 8px;

        letter-spacing: 3px;
    }


    .how-main-heading h2 {
        font-size: 30px;

        line-height: 1.2;
    }


    .how-steps-row {
        grid-template-columns: 1fr;

        row-gap: 45px;
    }


    .how-step {
        padding: 0 25px;
    }


    .step-top {
        height: 50px;
    }


    .step-number {
        font-size: 34px;
    }


    .step-content {
        margin-top: 17px;
    }


    .step-content h3 {
        font-size: 14px;

        letter-spacing: 1.7px;
    }


    .step-content p {
        max-width: 310px;

        font-size: 14px;

        line-height: 1.75;
    }


 

}


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

@media (max-width: 400px) {

    .how-main-heading h2 {
        font-size: 27px;
    }


    .how-step {
        padding: 0 15px;
    }


    .step-content p {
        font-size: 14px;
    }

}
 
 
 
 
 
 
 
 
 
 
 
                  /*gallery*/
 
        /* 5-Column Grid Layout for Dead-Center Positioning */
        .grid-container {
            margin-top: 2rem;
            display: grid;
            grid-template-columns: 1fr 1.3fr 1.3fr 1.3fr 1fr;
            grid-template-rows: minmax(220px, 260px) minmax(220px, 260px) minmax(180px, 220px);
            gap: 5px;
            width: 100%;
            background-color: #f9f6f0;
            /*padding: 8px;*/
        }

        /* Grid Item Setup */
        .grid-item {
            position: relative;
            overflow: hidden;
            background-color: #f9f6f0;
            width: 100%;
            height: 100%;
        }

        /* Specific Cell Spans to match screenshot */
        .item-wide-top {
            grid-column: 2 / span 2;
            grid-row: 1;
        }

        .item-tall-right {
            grid-column: 5;
            grid-row: 1 / span 2;
        }

        .item-tall-arch {
            grid-column: 2;
            grid-row: 2 / span 2;
        }

        /* DEAD-CENTER TEXT CARD (Row 2, Column 3) */
        .center-text-card {
            grid-column: 3;
            grid-row: 2;
            background-color: #f7f3ec;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            text-align: center;
            padding: 10px;
            z-index: 5;
        }

        .center-text-card h2 {
            font-family: 'Cormorant Garamond', serif;
            font-size: 21px;
            font-weight: 500;
            color: #1a1a1a;
            line-height: 1.2;
        }

        .center-text-card h2 .sub-title {
            font-style: italic;
            font-size: 1.4rem;
            display: block;
            margin-top: 4px;
        }

        .center-text-card h2 .brand-name {
            font-style: italic;
            font-size: 2.5rem;
            display: block;
            margin: 2px 0;
        }

        /* Image Smooth Crossfade Controls */
        .image-slide {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            opacity: 0;
            transition: opacity 1.2s ease-in-out;
        }

        .image-slide.active {
            opacity: 1;
        }

        /* Responsive Breakpoints */
        @media (max-width: 992px) {
            .grid-container {
                grid-template-columns: repeat(2, 1fr);
                grid-template-rows: auto;
            }

            .item-wide-top,
            .item-tall-right,
            .item-tall-arch {
                grid-column: span 1;
                grid-row: span 1;
            }

            .grid-item {
                height: 240px;
            }

            .center-text-card {
                grid-column: span 2;
                grid-row: auto;
                height: 200px;
            }
        }

        @media (max-width: 576px) {
            .grid-container {
                grid-template-columns: 1fr;
                gap: 6px;
            }

            .grid-item {
                height: 220px;
            }

            .center-text-card {
                grid-column: span 1;
                order: -1; /* Keeps text highlighted at top on mobile */
            }
        }
        
        
        
/* ================================
   ABOUT / FOUNDER SECTION
================================ */

.about-section {
    position: relative;
    padding: 80px 0 110px;
    overflow: hidden;
    /*background: #fcfbfa;*/
}


/* LEFT DECORATIVE IMAGE */

.left-image-overlay {
    position: absolute;
    width: 90%;
    height: 160%;
    left: 0;
    top: 0;

    background-image: url('images/Aboutbg.webp');

    background-size: cover;
    background-position: left center;

    opacity: .75;

    pointer-events: none;

    z-index: 1;

    mix-blend-mode: multiply;

    mask-image: radial-gradient(
        ellipse at left top,
        rgba(0,0,0,1) 40%,
        rgba(0,0,0,0) 80%
    );

    -webkit-mask-image: radial-gradient(
        ellipse at left top,
        rgba(0,0,0,1) 40%,
        rgba(0,0,0,0) 80%
    );
}


/* IMAGE */

.image-wrapper {
    position: relative;
    z-index: 2;
    width: 100%;
    overflow: hidden;
}

.bw-image {
    width: 100%;
    height: 550px;

    object-fit: cover;

    display: block;

    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    
    /* Retains crisp contrast and sharpness on high-DPI/Retina screens */
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    
    /* Subtle rendering tweak for modern browsers */
    transform: translateZ(0);
    backface-visibility: hidden;
}


/* CONTENT */

.about-content {
    position: relative;
    z-index: 2;
}


/* TITLE */

.about-title {
    font-family: "Cormorant Garamond", serif;

    font-size: 42px;

    font-weight: 500;

    letter-spacing: 2px;

    line-height: 1.2;

    color: #864e10;

    text-transform: uppercase;
}


/* DIVIDER */

.divider-line {
    width: 55px;
    height: 1px;

    background: #c7ac78;

    margin: 25px auto;
}


/* TEXT */

.lead-text,
.body-paragraph {

    font-family: "Cormorant Garamond", serif;

    color: #000;

    font-weight: 400;
}


.lead-text {

    font-size: 22px;

    line-height: 1.65;

    margin-bottom: 25px;
}


.body-paragraph {

    font-size: 19px;

    line-height: 1.7;

    margin-bottom: 25px;
}


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

@media (max-width: 991px) {

    .about-section {
        padding: 15px  20px;
    }

    .left-image-overlay {
        display: none;
    }

    .bw-image {
        height: 550px;
    }

    .about-title {
        font-size: 34px;
    }

    .lead-text {
        font-size: 20px;
    }

    .body-paragraph {
        font-size: 18px;
    }
}


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

@media (max-width: 575px) {

    .about-section {
        padding: 35px 15px 60px;
    }

    .bw-image {
        height: 450px;
    }

    .about-title {
        font-size: 29px;
        letter-spacing: 1px;
    }

    .lead-text {
        font-size: 19px;
        line-height: 1.55;
    }

    .body-paragraph {
        font-size: 17px;
        line-height: 1.65;
    }

} 


/* =========================================================
   WORDS OF LOVE + RECOGNITION
========================================================= */

.love-recognition-section {

    position: relative;

    overflow: hidden;

   padding: 25px 0 ;

   
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.love-main-container {

    width: 100%;

    /*max-width: 940px;*/

    margin: 0 auto;

    padding: 0 20px;
}


/* =========================================================
   WORDS OF LOVE TITLE
========================================================= */

.love-title {

    text-align: center;

    margin-bottom: 34px;
}


.love-title h2 {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 28px;

    font-weight: 500;

    letter-spacing: 8px;

    line-height: 1.1;

    color: #151310;
}


.love-title-line {

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 7px;

    height: 12px;
}


.love-title-line span {

    width: 35px;

    height: 1px;

    background: #bd8e4e;
}


.love-title-line b {

    font-size: 6px;

    color: #bd8e4e;

    font-weight: 400;
}


.love-title p {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 12px;

    line-height: 1.45;

    font-style: italic;

    color: #4b443c;
}


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

.love-testimonials {

    display: grid;

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

    gap: 10px;

    align-items: start;
}


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

.love-card {

    position: relative;

    min-width: 0;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.35),
            rgba(224,208,187,.18)
        ),
        #eee2d2;

    border: 1px solid
        rgba(157,125,88,.20);

    box-shadow:
        0 3px 8px
        rgba(74,52,31,.15);

    overflow: visible;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


/* EXACT CARD ANGLES */

.love-card-1 {

    transform: rotate(-2.8deg);

    margin-top: 5px;
}


.love-card-2 {

    transform: rotate(1.2deg);

    margin-top: 23px;
}


.love-card-3 {

    transform: rotate(-1deg);

    margin-top: 16px;
}


.love-card-4 {

    transform: rotate(2.7deg);

    margin-top: 14px;
}
.love-card-5 {

    transform: rotate(2.8deg);

    margin-top: 5px;
}


/* CARD HOVER */

.love-card:hover {

    transform:
        translateY(-6px)
        rotate(0deg);

    box-shadow:
        0 10px 20px
        rgba(74,52,31,.20);

    z-index: 10;
}


/* =========================================================
   MESSAGE AREA
========================================================= */

.love-message-area {

    position: relative;

    min-height: 188px;

    padding:
        20px
        10px
        10px;

    background:
        repeating-linear-gradient(
            0deg,
            rgba(120,90,60,.015) 0px,
            rgba(120,90,60,.015) 1px,
            transparent 1px,
            transparent 4px
        );
}


/* =========================================================
   WHATSAPP ICON
========================================================= */

/*.love-whatsapp-icon {*/

/*    position: absolute;*/

/*    right: 9px;*/

/*    top: 9px;*/

/*    width: 13px;*/

/*    height: 13px;*/

/*    border:*/
/*        1.5px solid*/
/*        #1bad3a;*/

/*    border-radius: 50%;*/
/*}*/


/*.love-whatsapp-icon:after {*/

/*    content: "";*/

/*    position: absolute;*/

/*    left: 1px;*/

/*    bottom: -3px;*/

/*    width: 4px;*/

/*    height: 4px;*/

/*    border-left:*/
/*        1.5px solid*/
/*        #1bad3a;*/

/*    transform: rotate(-25deg);*/
/*}*/


.love-whatsapp-icon {
    position: absolute;
    right: 5px;
    top:3px;

    width: 18px;
    height: 18px;

    object-fit: contain;
}








/* =========================================================
   MESSAGES
========================================================= */

.love-message {

    position: relative;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 8.5px;

    line-height: 1.42;

    color: #292722;

    box-shadow:
        0 1px 3px
        rgba(0,0,0,.06);
}


/* RECEIVED */

.love-message.received {

    width: 90%;

    margin:
        0 auto
        10px;

    padding:
        9px
        9px
        17px;

    background: #fffdf9;

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


.love-message.received:after {

    content: "";

    position: absolute;

    bottom: -6px;

    left: 0;

    border-top:
        7px solid
        #fffdf9;

    border-right:
        7px solid
        transparent;
}


/* SENT */

.love-message.sent {

    width: 73%;

    margin-left: auto;

    padding:
        8px
        8px
        17px;

    background: #e4f3a5;

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


.love-message.sent:after {

    content: "";

    position: absolute;

    right: 0;

    bottom: -5px;

    border-top:
        6px solid
        #e4f3a5;

    border-left:
        6px solid
        transparent;
}


/* TIME */

.love-message time {

    position: absolute;

    right: 6px;

    bottom: 4px;

    font-size: 6px;

    color: #777;
}


/* =========================================================
   PERSON DETAILS
========================================================= */

.love-person {

    text-align: center;

    min-height: 53px;

    padding:
        7px
        5px
        8px;

    border-top:
        1px solid
        rgba(158,128,91,.12);
}


.love-person h3 {

    margin:
        0
        0
        3px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.15;

    color: #352b23;
}


.love-person span {

    display: block;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 6.5px;

    font-weight: 600;

    letter-spacing: 1.5px;

    color: #302a24;
}


/* =========================================================
   MINI GOLD LINE
========================================================= */

.love-mini-line,
.recognition-mini-line {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 5px;

    margin-top: 5px;
}


.love-mini-line i,
.recognition-mini-line i {

    width: 23px;

    height: 1px;

    background: #c39a61;
}


.love-mini-line b,
.recognition-mini-line b {

    font-size: 5px;

    font-weight: 400;

    color: #b98242;
}


/* =========================================================
   RECOGNITION MAIN DIVIDER
========================================================= */

.recognition-main-divider {

    position: relative;

    display: flex;

    justify-content: center;

    align-items: center;

    height: 22px;

    margin:
        18px
        -20px
        0;

    border-top:
        1px solid
        rgba(179,142,96,.28);
}


.recognition-main-divider b {

    position: relative;

    top: -6px;

    font-size: 7px;

    font-weight: 400;

    color: #b88648;
}


/* =========================================================
   RECOGNITION TITLE
========================================================= */

.recognition-title {

    text-align: center;

    margin:
        -2px
        0
        11px;
}


.recognition-title p {

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 12px;

    font-style: italic;

    color: #4c453d;
}


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

.recognition-grid {

    display: grid;

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

    gap: 18px;

    align-items: start;
}


/* =========================================================
   RECOGNITION ITEM
========================================================= */

.recognition-item {

    position: relative;

    text-align: center;
}


/* INDIVIDUAL ANGLES */

.recognition-one {

    transform: rotate(-3deg);
}


.recognition-two {

    transform: rotate(.8deg);

    margin-top: 7px;
}


.recognition-three {

    transform: rotate(-1.2deg);

    margin-top: 4px;
}


.recognition-four {

    transform: rotate(1.8deg);

    margin-top: 8px;
}


.recognition-five {

    transform: rotate(3deg);
}


/* =========================================================
   POLAROID / PHOTO
========================================================= */

.recognition-photo {

    position: relative;

    padding: 5px;

    background: #fff;

    box-shadow:
        0 3px 8px
        rgba(70,48,28,.18);
}


.recognition-photo img {

    display: block;

    width: 100%;

    height: auto;

    object-fit: cover;
}


/* =========================================================
   PIN
========================================================= */

.photo-pin {

    position: absolute;

    z-index: 5;

    left: 50%;

    top: -7px;

    width: 12px;

    height: 12px;

    transform:
        translateX(-50%);

    border-radius: 50%;

    background: #bd8d4e;

    box-shadow:
        0 2px 3px
        rgba(0,0,0,.20);
}


/* =========================================================
   RECOGNITION CAPTION
========================================================= */

.recognition-caption {

    padding:
        7px
        4px
        4px;
}


.recognition-caption small {

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 6.5px;

    font-weight: 600;

    letter-spacing: 1.5px;

    color: #a86f39;
}


.recognition-caption p {

    margin:
        5px
        0
        0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 9px;

    line-height: 1.4;

    color: #302820;
}


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

.newspaper-card {

    position: relative;

    min-height: 173px;

    padding:
        8px
        8px
        7px;

    overflow: hidden;

    text-align: left;

    background:
        linear-gradient(
            rgba(255,255,255,.15),
            rgba(225,209,188,.25)
        ),
        #eee3d3;

    box-shadow:
        0 3px 8px
        rgba(70,48,28,.14);
}


.newspaper-heading {

    margin-bottom: 6px;

    text-align: center;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 7px;

    color: #27221e;
}


.newspaper-heading strong {

    font-size: 8px;

    font-weight: 700;
}


.newspaper-card h3 {

    margin:
        0
        0
        6px;

    width: 65%;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 10px;

    line-height: 1.2;

    font-weight: 700;

    color: #25211d;
}


.newspaper-card p {

    width: 65%;

    margin: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 6.5px;

    line-height: 1.4;

    color: #453b32;
}


.newspaper-card img {

    position: absolute;

    right: 6px;

    bottom: 7px;

    width: 34%;

    height: 67px;

    object-fit: cover;
}


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

@media (max-width: 991px) {

    .love-main-container {

        /*max-width: 750px;*/
    }


    .love-testimonials {

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

        gap: 25px 18px;
    }


    .love-card-1,
    .love-card-2,
    .love-card-3,
    .love-card-4 {

        margin-top: 0;
    }


    .love-message-area {

        min-height: 230px;
    }


    .recognition-grid {

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

        gap: 30px 20px;
    }


    .recognition-one,
    .recognition-two,
    .recognition-three,
    .recognition-four,
    .recognition-five {

        margin-top: 0;
    }

}


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

@media (max-width: 767px) {

    .love-recognition-section {
        padding: 35px 15px 60px;
    }


    .love-main-container {

        max-width: 420px;

        padding:
            0
            18px;
    }


    .love-title {

        margin-bottom: 35px;
    }


    .love-title h2 {

        font-size: 24px;

        letter-spacing: 5px;
    }


    .love-title p {

        font-size: 12px;
    }


    .love-title p br {

        display: none;
    }


    /* ONE CARD PER ROW */

    .love-testimonials {

        grid-template-columns: 2fr;

        gap: 30px;
    }


    .love-card-1 {

        transform: rotate(-1.8deg);

        margin-top: 0;
    }


    .love-card-2 {

        transform: rotate(1.5deg);

        margin-top: 0;
    }


    .love-card-3 {

        transform: rotate(-1.2deg);

        margin-top: 0;
    }


    .love-card-4 {

        transform: rotate(1.8deg);

        margin-top: 0;
    }
   .love-card-5 {

        transform: rotate(1.8deg);

        margin-top: 0;
    }

    .love-card:hover {

        transform:
            translateY(-5px)
            rotate(0deg);
    }


    .love-message-area {

        min-height: 270px;

        padding:
            28px
            20px
            15px;
    }


    .love-message {

        font-size: 11px;

        line-height: 1.55;
    }


    .love-message.received {

        padding:
            12px
            12px
            22px;
    }


    .love-message.sent {

        padding:
            10px
            10px
            22px;
    }


    .love-message time {

        font-size: 7px;
    }


    .love-person {

        min-height: 70px;

        padding-top: 10px;
    }


    .love-person h3 {

        font-size: 18px;
    }


    .love-person span {

        font-size: 8px;

        letter-spacing: 1.8px;
    }


    .love-mini-line i {

        width: 28px;
    }


    /* RECOGNITION */

    .recognition-main-divider {

        margin-top: 35px;
    }


    .recognition-title {

        margin-bottom: 25px;
    }


    .recognition-grid {

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

        gap:
            35px
            20px;
    }


    .recognition-one,
    .recognition-two,
    .recognition-three,
    .recognition-four,
    .recognition-five {

        margin-top: 0;
    }


    .recognition-photo img {

        height: auto;
    }


    .newspaper-card {

        min-height: 225px;
    }


    .newspaper-card h3 {

        font-size: 12px;
    }


    .newspaper-card p {

        font-size: 8px;
    }


    .newspaper-card img {

        height: 80px;
    }

}


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

@media (max-width: 480px) {

    .love-title h2 {

        font-size: 21px;

        letter-spacing: 4px;
    }


    .love-testimonials {

        padding:
            0
            8px;
    }


    .love-message-area {

        min-height: 250px;
    }


    /* Recognition one column */

    .recognition-grid {

        grid-template-columns: 1fr;

        max-width: 285px;

        margin: 0 auto;

        gap: 38px;
    }


    .recognition-photo img {

        height: auto;
    }


    .newspaper-card {

        min-height: 285px;
    }


    .newspaper-card h3 {

        font-size: 14px;
    }


    .newspaper-card p {

        font-size: 9px;
    }


    .newspaper-card img {

        height: 95px;
    }

}


        /* Main Section Container */
        .contact-wrapper {
            position: relative;
            min-height: calc(100vh - 120px);
            display: flex;
            align-items: center;
            padding: 40px 0;
              
        }

        /* Right Floral Image - Fixed position for Desktop, Hidden on Mobile */
        .floral-branch-img {
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            max-height: 85vh;
            width: auto;
            pointer-events: none;
            z-index: 1;
        }

        .contact-content {
            position: relative;
            z-index: 2;
        }

        .contact-title {
            font-family: 'Cormorant Garamond', serif;
            font-size: 3.5rem;
            letter-spacing: 2px;
            font-weight: 400;
            color:#332720;
            margin-bottom: 25px;
        }

        /* Diamond Divider Line */
        .divider-line {
            display: flex;
            align-items: center;
            max-width: 260px;
            margin-bottom: 40px;
        }

        .divider-line::before,
        .divider-line::after {
            content: '';
            flex: 1;
            border-bottom: 1px solid #c6a052;
            opacity: 0.6;
        }

        .divider-line i {
            color: #c6a052;
            padding: 0 10px;
            font-size: 0.6rem;
        }

        /* Info Items */
        .info-item {
            display: flex;
            align-items: center;
            margin-bottom: 30px;
        }

        .info-icon {
            font-size: 1.6rem;
            color:#332720;
            width: 45px;
        }

        .info-label {
            font-size: 0.75rem;
            letter-spacing: 2.5px;
            text-transform: uppercase;
            color: #7a6e65;
            margin-bottom: 2px;
        }

        .info-value {
            font-family: 'Cormorant Garamond', serif;
            font-size: 1.25rem;
            color:#332720;
            text-decoration: none;
        }

        .info-value:hover {
            color: #c6a052;
        }

        /* Social Icons */
        .social-links {
            margin-top: 40px;
            display: flex;
            gap: 15px;
        }

        .social-icon-btn {
            width: 42px;
            height: 42px;
            border-radius: 50%;
            border: 1px solid#332720;
            display: flex;
            align-items: center;
            justify-content: center;
            color:#332720;
            text-decoration: none;
            font-size: 1.1rem;
            transition: all 0.3s ease;
        }

        .social-icon-btn:hover {
            background-color:#332720;
            color: #fff;
        }

        
        .quote-divider::before,
        .quote-divider::after {
            content: '';
            flex: 1;
            border-bottom: 1px solid #c6a052;
            opacity: 0.6;
        }

        .quote-divider i {
            color: #c6a052;
            padding: 0 10px;
            font-size: 0.5rem;
        }
        
        /* =========================================
   SCRIPT QUOTE
========================================= */
/* ================= SCRIPT QUOTE ================= */

.quote-wrapper {
    text-align: left;
    padding-top: 210px;
    /*padding-left: 40px;*/
}

.script-quote {
     font-family: 'Brittany Signature', cursive !important; 
    /*font-family: 'Alex Brush', cursive;*/
    font-size: 40px;
    font-weight: 500;
    color:#332720;
    line-height:50px;
    text-align: left;
}

.quote-divider {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 160px;
    margin: 25px 0 0;
}

.quote-divider::before,
.quote-divider::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #c6a052;
    opacity: 0.6;
}

.quote-divider i {
    color: #c6a052;
    padding: 0 8px;
    font-size: 0.45rem;
}


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

@media (max-width: 991px) {

    .quote-wrapper {
        padding-top: 50px;
        /*padding-left: 15px;*/
        text-align: left;
    }

    .script-quote {
        font-size: 25px;
        text-align: left;
    }

    .quote-divider {
        margin-left: 0;
    }
         .contact-wrapper {
       padding: 35px 15px 60px;
        }

        .contact-title {
          font-size: 43px;
        
        }
        
    .floral-branch-img {
            position: absolute;
            right: 0;
            top: 53%;
            transform: translateY(-50%);
            max-height:100%;
            width: 42%;
            pointer-events: none;
            z-index: 1;
        }
    
}


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

@media (max-width: 576px) {

    .quote-wrapper {
        padding-top: 50px;
        /*padding-left: 15px;*/
        padding-bottom: 20px;
    }

    .script-quote {
        font-size: 25px;
        line-height: 50px;
    }

    .quote-divider {
        width: 130px;
        margin-top: 18px;
    }
         .contact-wrapper {
       padding: 35px 15px 60px;
        }
}