.elementor-877 .elementor-element.elementor-element-3eccf573:not(.elementor-motion-effects-element-type-background), .elementor-877 .elementor-element.elementor-element-3eccf573 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-secondary );}.elementor-877 .elementor-element.elementor-element-3eccf573 > .elementor-background-overlay{background-image:url("https://travelwithserendibislandtours.com/wp-content/uploads/2026/09/Untouched-tropical-beach-Sri-Lanka-Tours-On-The-Go-Tours-347511495547421_crop_flip_2250_1200_f2f2f2_center-center.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-877 .elementor-element.elementor-element-3eccf573{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:3% 0% 3% 0%;}.elementor-877 .elementor-element.elementor-element-45c52ea1 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:0em 0em 0em 0em;}.elementor-877 .elementor-element.elementor-element-45c52ea1 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-877 .elementor-element.elementor-element-5b1eafb4 > .elementor-container{max-width:720px;}.elementor-877 .elementor-element.elementor-element-5b1eafb4 > .elementor-background-overlay{opacity:1;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-877 .elementor-element.elementor-element-5b1eafb4{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:14% 0% 7% 0%;}.elementor-877 .elementor-element.elementor-element-311c6831 > .elementor-element-populated{padding:2em 2em 2em 2em;}.elementor-877 .elementor-element.elementor-element-4637f0ea{text-align:center;}.elementor-877 .elementor-element.elementor-element-4637f0ea .elementor-heading-title{font-size:60px;color:var( --e-global-color-cfa1f76 );}.elementor-877 .elementor-element.elementor-element-d852f81 .elementor-icon-list-icon i{color:var( --e-global-color-d49ac81 );transition:color 0.3s;}.elementor-877 .elementor-element.elementor-element-d852f81 .elementor-icon-list-icon svg{fill:var( --e-global-color-d49ac81 );transition:fill 0.3s;}.elementor-877 .elementor-element.elementor-element-d852f81{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-877 .elementor-element.elementor-element-d852f81 .elementor-icon-list-text{color:var( --e-global-color-cfa1f76 );transition:color 0.3s;}.elementor-877 .elementor-element.elementor-element-d852f81 .elementor-icon-list-item:hover .elementor-icon-list-text{color:var( --e-global-color-d49ac81 );}.elementor-877 .elementor-element.elementor-element-3c045104 > .elementor-container > .elementor-column > .elementor-widget-wrap{align-content:center;align-items:center;}.elementor-877 .elementor-element.elementor-element-3c045104{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:100px 0px 100px 0px;}.elementor-877 .elementor-element.elementor-element-3c045104 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-877 .elementor-element.elementor-element-49841b11 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:30px 30px 30px 30px;}.elementor-877 .elementor-element.elementor-element-8bf14bd .elementor-button{background-color:var( --e-global-color-secondary );fill:var( --e-global-color-text );color:var( --e-global-color-text );}.elementor-877 .elementor-element.elementor-element-8bf14bd .elementor-button:hover, .elementor-877 .elementor-element.elementor-element-8bf14bd .elementor-button:focus{background-color:var( --e-global-color-bb890b8 );color:var( --e-global-color-text );}.elementor-877 .elementor-element.elementor-element-8bf14bd .elementor-button:hover svg, .elementor-877 .elementor-element.elementor-element-8bf14bd .elementor-button:focus svg{fill:var( --e-global-color-text );}.elementor-877 .elementor-element.elementor-element-161e75dc > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:30px 30px 30px 30px;}.elementor-877 .elementor-element.elementor-element-5ffe8f89{--e-transform-rotateZ:2deg;background-image:url("https://travelwithserendibislandtours.com/wp-content/uploads/2026/09/bottom_bg.png");padding:0px 32px 56px 0px;background-position:bottom center;background-repeat:no-repeat;background-size:contain;}.elementor-877 .elementor-element.elementor-element-5ffe8f89 img{border-style:solid;border-width:14px 14px 42px 14px;border-color:var( --e-global-color-text );box-shadow:0px 30px 60px 0px rgba(0, 0, 0, 0.1);}.elementor-877 .elementor-element.elementor-element-2abcbe10{width:var( --container-widget-width, 250px );max-width:250px;--e-transform-rotateZ:-7deg;background-image:url("https://travelwithserendibislandtours.com/wp-content/uploads/2026/09/bottom_bg.png");padding:0px 0px 21px 0px;--container-widget-width:250px;--container-widget-flex-grow:0;bottom:-20px;background-position:bottom center;background-repeat:no-repeat;background-size:contain;}body:not(.rtl) .elementor-877 .elementor-element.elementor-element-2abcbe10{left:0px;}body.rtl .elementor-877 .elementor-element.elementor-element-2abcbe10{right:0px;}.elementor-877 .elementor-element.elementor-element-2abcbe10 img{width:100%;height:250px;object-fit:cover;object-position:center center;border-style:solid;border-width:10px 10px 35px 10px;border-color:var( --e-global-color-text );box-shadow:0px 30px 60px 0px rgba(0, 0, 0, 0.1);}.elementor-877 .elementor-element.elementor-element-6f0c868d > .elementor-background-overlay{background-color:transparent;background-image:radial-gradient(at bottom center, #F7F7F780 0%, #F7F7F7 100%);opacity:1;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-877 .elementor-element.elementor-element-6f0c868d{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:100px 0px 100px 0px;}.elementor-877 .elementor-element.elementor-element-7b89265e > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-877 .elementor-element.elementor-element-23c96f19 > .elementor-container{max-width:720px;}.elementor-877 .elementor-element.elementor-element-23c96f19{margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-877 .elementor-element.elementor-element-79c56eb0 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 30px 0px;}.elementor-877 .elementor-element.elementor-element-45beebf9{text-align:center;}.elementor-877 .elementor-element.elementor-element-45beebf9 .elementor-heading-title{font-size:48px;}.elementor-877 .elementor-element.elementor-element-416e47e0{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:30px 0px 0px 0px;text-align:center;}.elementor-877 .elementor-element.elementor-element-330d3e7e .e-gallery-item:hover .elementor-gallery-item__overlay, .elementor-877 .elementor-element.elementor-element-330d3e7e .e-gallery-item:focus .elementor-gallery-item__overlay{background-color:rgba(0,0,0,0.5);}.elementor-877 .elementor-element.elementor-element-330d3e7e{--image-border-color:var( --e-global-color-text );--image-border-width:10px;--image-transition-duration:800ms;--overlay-transition-duration:800ms;--content-text-align:center;--content-padding:20px;--content-transition-duration:800ms;--content-transition-delay:800ms;}.elementor-877 .elementor-element.elementor-element-17ae296a:not(.elementor-motion-effects-element-type-background), .elementor-877 .elementor-element.elementor-element-17ae296a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://travelwithserendibislandtours.com/wp-content/uploads/2026/09/site_0450_0020-1200-630-20151105154018.webp");background-position:top center;background-repeat:no-repeat;background-size:cover;}.elementor-877 .elementor-element.elementor-element-17ae296a > .elementor-background-overlay{background-color:transparent;background-image:linear-gradient(135deg, var( --e-global-color-044b931 ) 0%, var( --e-global-color-639e8dd ) 100%);opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-877 .elementor-element.elementor-element-17ae296a > .elementor-container{max-width:720px;}.elementor-877 .elementor-element.elementor-element-17ae296a{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:7em 0em 10em 0em;}.elementor-877 .elementor-element.elementor-element-b339314 > .elementor-element-populated{padding:2em 2em 2em 2em;}.elementor-877 .elementor-element.elementor-element-73d827e0{text-align:center;}.elementor-877 .elementor-element.elementor-element-73d827e0 .elementor-heading-title{color:var( --e-global-color-text );}.elementor-877 .elementor-element.elementor-element-4d523b8c{text-align:center;color:var( --e-global-color-text );}.elementor-877 .elementor-element.elementor-element-108dc7d9 .elementor-button{background-color:var( --e-global-color-secondary );fill:var( --e-global-color-text );color:var( --e-global-color-text );}.elementor-877 .elementor-element.elementor-element-108dc7d9 .elementor-button:hover, .elementor-877 .elementor-element.elementor-element-108dc7d9 .elementor-button:focus{background-color:var( --e-global-color-bb890b8 );color:var( --e-global-color-text );}.elementor-877 .elementor-element.elementor-element-108dc7d9 .elementor-button:hover svg, .elementor-877 .elementor-element.elementor-element-108dc7d9 .elementor-button:focus svg{fill:var( --e-global-color-text );}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-877 .elementor-element.elementor-element-3eccf573{padding:0em 0em 0em 0em;}.elementor-877 .elementor-element.elementor-element-5b1eafb4{padding:14em 0em 7em 0em;}.elementor-877 .elementor-element.elementor-element-3c045104{padding:3em 0em 3em 0em;}.elementor-877 .elementor-element.elementor-element-49841b11 > .elementor-element-populated{padding:2em 2em 2em 2em;}.elementor-877 .elementor-element.elementor-element-161e75dc > .elementor-element-populated{margin:0em 0em 0em 2em;--e-column-margin-right:0em;--e-column-margin-left:2em;padding:2em 2em 2em 2em;}body:not(.rtl) .elementor-877 .elementor-element.elementor-element-2abcbe10{left:-1px;}body.rtl .elementor-877 .elementor-element.elementor-element-2abcbe10{right:-1px;}.elementor-877 .elementor-element.elementor-element-2abcbe10{bottom:-40px;}.elementor-877 .elementor-element.elementor-element-6f0c868d{padding:1em 0em 3em 0em;}}@media(max-width:767px){.elementor-877 .elementor-element.elementor-element-3eccf573{padding:2em 0em 2em 0em;}.elementor-877 .elementor-element.elementor-element-5b1eafb4{padding:9em 0em 3em 0em;}.elementor-877 .elementor-element.elementor-element-4637f0ea .elementor-heading-title{font-size:30px;}.elementor-877 .elementor-element.elementor-element-3c045104{margin-top:0px;margin-bottom:0px;padding:50px 0px 50px 0px;}.elementor-877 .elementor-element.elementor-element-49841b11 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:10px 10px 10px 10px;}.elementor-877 .elementor-element.elementor-element-37299867{text-align:justify;}.elementor-877 .elementor-element.elementor-element-161e75dc > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:20px 20px 20px 20px;}.elementor-877 .elementor-element.elementor-element-5ffe8f89{padding:0px 0px 28px 0px;}.elementor-877 .elementor-element.elementor-element-2abcbe10{--container-widget-width:200px;--container-widget-flex-grow:0;width:var( --container-widget-width, 200px );max-width:200px;bottom:0px;}body:not(.rtl) .elementor-877 .elementor-element.elementor-element-2abcbe10{left:0px;}body.rtl .elementor-877 .elementor-element.elementor-element-2abcbe10{right:0px;}.elementor-877 .elementor-element.elementor-element-2abcbe10 img{height:200px;}.elementor-877 .elementor-element.elementor-element-6f0c868d{margin-top:0px;margin-bottom:0px;padding:50px 10px 050px 10px;}.elementor-877 .elementor-element.elementor-element-45beebf9{text-align:center;}.elementor-877 .elementor-element.elementor-element-416e47e0{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:justify;}.elementor-877 .elementor-element.elementor-element-17ae296a{padding:3em 0em 7em 0em;}}@media(max-width:1024px) and (min-width:768px){.elementor-877 .elementor-element.elementor-element-49841b11{width:100%;}.elementor-877 .elementor-element.elementor-element-161e75dc{width:100%;}}@media(min-width:1025px){.elementor-877 .elementor-element.elementor-element-17ae296a:not(.elementor-motion-effects-element-type-background), .elementor-877 .elementor-element.elementor-element-17ae296a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}/* Start custom CSS for section, class: .elementor-element-3eccf573 *//* =========================================================
   TRAVEL WITH SERENDIB - MODERN CONTACT HERO
   Add class: travel-contact-hero
   Padding & margin are NOT changed
========================================================= */

.travel-contact-hero{
    position: relative;
    overflow: hidden;
    isolation: isolate;

    /* Keep your current background image */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}


/* =========================================================
   PREMIUM BACKGROUND OVERLAY
========================================================= */

.travel-contact-hero::before{
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(3, 24, 48, 0.72) 0%,
            rgba(4, 37, 61, 0.52) 38%,
            rgba(7, 50, 67, 0.42) 65%,
            rgba(3, 26, 48, 0.62) 100%
        ),
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.12) 0%,
            rgba(0, 0, 0, 0.25) 100%
        );
}


/* =========================================================
   SUBTLE MODERN GLOW
========================================================= */

.travel-contact-hero::after{
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 0;
    pointer-events: none;

    background: radial-gradient(
        circle,
        rgba(255, 196, 55, 0.12) 0%,
        rgba(255, 196, 55, 0.04) 38%,
        transparent 72%
    );

    filter: blur(10px);
}


/* Keep all section content above overlays */
.travel-contact-hero > *,
.travel-contact-hero .e-con-inner{
    position: relative;
    z-index: 2;
}


/* =========================================================
   MAIN TITLE
========================================================= */

.travel-contact-hero .elementor-heading-title{
    color: #ffffff !important;
    font-weight: 700 !important;
    letter-spacing: -1.5px;
    line-height: 1.08 !important;

    text-shadow:
        0 4px 18px rgba(0,0,0,0.28),
        0 1px 2px rgba(0,0,0,0.22);

    position: relative;
}


/* Gold accent under main heading */
.travel-contact-hero .elementor-widget-heading:first-of-type .elementor-heading-title::after{
    content: "";
    display: block;
    width: 58px;
    height: 3px;
    margin: 15px auto 0;

    background: linear-gradient(
        90deg,
        #d8a52d,
        #ffd66b,
        #d8a52d
    );

    border-radius: 20px;

    box-shadow:
        0 0 14px rgba(255, 201, 69, 0.45);
}


/* =========================================================
   SUBTITLE
========================================================= */

.travel-contact-hero .elementor-widget-text-editor,
.travel-contact-hero .elementor-widget-text-editor p{
    color: rgba(255,255,255,0.92) !important;
    font-weight: 400;
    letter-spacing: 0.2px;
    line-height: 1.6;
    text-shadow: 0 2px 10px rgba(0,0,0,0.28);
}


/* If subtitle is another heading widget */
.travel-contact-hero .elementor-widget-heading:not(:first-of-type) .elementor-heading-title{
    color: rgba(255,255,255,0.92) !important;
    font-weight: 400 !important;
    letter-spacing: 0.2px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.25);
}


/* =========================================================
   BREADCRUMB - MODERN GLASS STYLE
========================================================= */

.travel-contact-hero .breadcrumbs,
.travel-contact-hero .breadcrumb,
.travel-contact-hero .rank-math-breadcrumb,
.travel-contact-hero .yoast-breadcrumb{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    width: auto;
    max-width: 100%;

    padding: 9px 17px;
    margin-top: 4px;

    color: #ffffff;

    background: rgba(255,255,255,0.10);

    border: 1px solid rgba(255,255,255,0.18);
    border-radius: 50px;

    box-shadow:
        0 8px 28px rgba(0,0,0,0.13),
        inset 0 1px 0 rgba(255,255,255,0.12);

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}


/* Breadcrumb links */
.travel-contact-hero .breadcrumbs a,
.travel-contact-hero .breadcrumb a,
.travel-contact-hero .rank-math-breadcrumb a,
.travel-contact-hero .yoast-breadcrumb a{
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 500;

    transition:
        color 0.3s ease,
        opacity 0.3s ease;
}


/* Breadcrumb hover */
.travel-contact-hero .breadcrumbs a:hover,
.travel-contact-hero .breadcrumb a:hover,
.travel-contact-hero .rank-math-breadcrumb a:hover,
.travel-contact-hero .yoast-breadcrumb a:hover{
    color: #ffd15a !important;
}


/* Current breadcrumb */
.travel-contact-hero .breadcrumbs span,
.travel-contact-hero .breadcrumb span,
.travel-contact-hero .rank-math-breadcrumb span,
.travel-contact-hero .yoast-breadcrumb span{
    color: rgba(255,255,255,0.92);
}


/* =========================================================
   BREADCRUMB ICON / SEPARATOR
========================================================= */

.travel-contact-hero .breadcrumbs i,
.travel-contact-hero .breadcrumb i{
    color: #ffc83d !important;

    filter:
        drop-shadow(0 0 6px rgba(255,200,61,0.35));
}


/* If breadcrumb separator is text */
.travel-contact-hero .separator,
.travel-contact-hero .breadcrumb-separator{
    color: #ffc83d !important;
}


/* =========================================================
   VERY SUBTLE TOP + BOTTOM EDGE
========================================================= */

.travel-contact-hero{
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.08),
        inset 0 -1px 0 rgba(255,255,255,0.08);
}


/* =========================================================
   DESKTOP
========================================================= */

@media (min-width: 1025px){

    .travel-contact-hero .elementor-heading-title{
        font-size: clamp(46px, 4vw, 64px);
    }

    .travel-contact-hero .elementor-widget-text-editor,
    .travel-contact-hero .elementor-widget-text-editor p{
        font-size: 20px;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px){

    .travel-contact-hero{
        background-position: center center !important;
    }

    .travel-contact-hero .elementor-heading-title{
        letter-spacing: -1px;
    }

    .travel-contact-hero::after{
        width: 420px;
        height: 420px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px){

    .travel-contact-hero{
        background-position: center center !important;
    }

    .travel-contact-hero::before{
        background:
            linear-gradient(
                180deg,
                rgba(3, 26, 48, 0.62) 0%,
                rgba(4, 35, 56, 0.48) 45%,
                rgba(2, 23, 42, 0.72) 100%
            );
    }

    .travel-contact-hero::after{
        width: 300px;
        height: 300px;
    }

    .travel-contact-hero .elementor-heading-title{
        font-size: clamp(34px, 10vw, 44px);
        letter-spacing: -0.7px;
        line-height: 1.12 !important;
    }

    .travel-contact-hero .elementor-widget-heading:first-of-type .elementor-heading-title::after{
        width: 46px;
        height: 3px;
        margin-top: 12px;
    }

    .travel-contact-hero .elementor-widget-text-editor,
    .travel-contact-hero .elementor-widget-text-editor p{
        font-size: 16px;
        line-height: 1.6;
    }

    .travel-contact-hero .breadcrumbs,
    .travel-contact-hero .breadcrumb,
    .travel-contact-hero .rank-math-breadcrumb,
    .travel-contact-hero .yoast-breadcrumb{
        padding: 8px 14px;
        gap: 7px;
        font-size: 14px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px){

    .travel-contact-hero .elementor-heading-title{
        font-size: 34px;
    }

    .travel-contact-hero .elementor-widget-text-editor,
    .travel-contact-hero .elementor-widget-text-editor p{
        font-size: 15px;
    }

    .travel-contact-hero .breadcrumbs,
    .travel-contact-hero .breadcrumb,
    .travel-contact-hero .rank-math-breadcrumb,
    .travel-contact-hero .yoast-breadcrumb{
        font-size: 13px;
        padding: 7px 12px;
    }
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-6f0c868d *//* =========================================================
   TRAVEL WITH SERENDIB
   TRAVEL EXPERIENCE / GALLERY SECTION

   Existing section padding & margin are NOT changed
========================================================= */

.serendib-experience-section{
    position: relative;
    overflow: hidden;
    isolation: isolate;

    background:
        radial-gradient(
            circle at 8% 20%,
            rgba(8,126,83,0.055),
            transparent 30%
        ),
        radial-gradient(
            circle at 92% 80%,
            rgba(239,178,57,0.075),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fbfdfc 50%,
            #f7faf9 100%
        ) !important;
}


/* =========================================================
   DECORATIVE BACKGROUND
========================================================= */

.serendib-experience-section::before{
    content: "";
    position: absolute;

    width: 420px;
    height: 420px;

    left: -210px;
    top: -210px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(8,126,83,0.09),
            transparent 70%
        );

    pointer-events: none;
    z-index: 0;
}


.serendib-experience-section::after{
    content: "";
    position: absolute;

    width: 360px;
    height: 360px;

    right: -180px;
    bottom: -190px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(239,178,57,0.11),
            transparent 72%
        );

    pointer-events: none;
    z-index: 0;
}


.serendib-experience-section > *,
.serendib-experience-section .e-con-inner{
    position: relative;
    z-index: 2;
}


/* =========================================================
   HEADING AREA
========================================================= */

.serendib-experience-head{
    text-align: center !important;
}


.serendib-experience-head
.elementor-widget-heading{
    text-align: center !important;
}


.serendib-experience-head
.elementor-heading-title{
    color: #193761 !important;

    font-weight: 700 !important;

    line-height: 1.15 !important;

    letter-spacing: -1.2px;

    text-align: center !important;

    position: relative;
}


/* Green + gold underline */
.serendib-experience-head
.elementor-heading-title::after{
    content: "";

    display: block;

    width: 72px;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #087e55 0%,
            #087e55 65%,
            #efb33c 65%,
            #efb33c 100%
        );

    border-radius: 30px;

    margin-left: auto;
    margin-right: auto;

    box-shadow:
        0 3px 10px rgba(8,126,83,0.15);
}


/* =========================================================
   DESCRIPTION TEXT
========================================================= */

.serendib-experience-head
.elementor-widget-text-editor,
.serendib-experience-head
.elementor-widget-text-editor p{
    color: #596578 !important;

    font-size: 16px;

    line-height: 1.75;

    font-weight: 400;

    text-align: center !important;
}


.serendib-experience-head strong{
    color: #193761 !important;

    font-weight: 700;
}


/* =========================================================
   IMAGE GALLERY
========================================================= */

.serendib-experience-gallery{
    position: relative;

    z-index: 3;
}


/* =========================================================
   EACH IMAGE CARD
========================================================= */

.serendib-experience-item{
    position: relative;

    overflow: hidden;

    isolation: isolate;

    border-radius: 18px;

    background: #ffffff;

    border:
        1px solid rgba(17,55,94,0.08);

    box-shadow:
        0 14px 36px rgba(16,46,76,0.09),
        0 3px 10px rgba(16,46,76,0.04);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


/* Top accent */
.serendib-experience-item::before{
    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width: 0;
    height: 3px;

    transform: translateX(-50%);

    background:
        linear-gradient(
            90deg,
            #087e55,
            #efb33c,
            #087e55
        );

    border-radius:
        0 0 20px 20px;

    transition:
        width .4s ease;

    z-index: 4;
}


/* Soft corner glow */
.serendib-experience-item::after{
    content: "";

    position: absolute;

    width: 130px;
    height: 130px;

    right: -70px;
    bottom: -70px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(239,178,57,0.14),
            rgba(8,126,83,0.05) 45%,
            transparent 72%
        );

    z-index: 2;

    pointer-events: none;
}


/* =========================================================
   IMAGE
========================================================= */

.serendib-experience-item
.elementor-widget-image{
    overflow: hidden;

    border-radius: inherit;
}


.serendib-experience-item
.elementor-widget-image img{
    display: block;

    width: 100%;

    transition:
        transform .65s ease,
        filter .5s ease;
}


/* Soft image overlay */
.serendib-experience-item
.elementor-widget-image::after{
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 55%,
            rgba(4,31,45,0.20) 100%
        );

    pointer-events: none;

    transition:
        background .4s ease;
}


/* =========================================================
   IMAGE CARD HOVER
========================================================= */

.serendib-experience-item:hover{
    transform: translateY(-8px);

    border-color:
        rgba(8,126,83,0.17);

    box-shadow:
        0 24px 50px rgba(16,46,76,0.15),
        0 7px 18px rgba(16,46,76,0.07);
}


.serendib-experience-item:hover::before{
    width: 65%;
}


.serendib-experience-item:hover
.elementor-widget-image img{
    transform: scale(1.07);

    filter:
        saturate(1.06)
        contrast(1.03);
}


/* =========================================================
   OPTIONAL IMAGE TITLE
========================================================= */

.serendib-experience-item
.elementor-heading-title{
    color: #193761 !important;

    font-weight: 700 !important;

    text-align: center !important;

    line-height: 1.3 !important;

    transition:
        color .3s ease;
}


.serendib-experience-item:hover
.elementor-heading-title{
    color: #087e55 !important;
}


/* =========================================================
   OPTIONAL BUTTON
========================================================= */

.serendib-experience-btn{
    width: 100%;

    text-align: center !important;
}


.serendib-experience-btn
.elementor-button-wrapper{
    width: 100%;

    display: flex !important;

    align-items: center;
    justify-content: center !important;

    text-align: center !important;
}


.serendib-experience-btn
.elementor-button{
    position: relative;

    overflow: hidden;

    display: inline-flex !important;

    align-items: center;
    justify-content: center;

    background:
        linear-gradient(
            135deg,
            #123b69 0%,
            #087e55 100%
        ) !important;

    color: #ffffff !important;

    border:
        1px solid rgba(255,255,255,0.14);

    border-radius: 50px !important;

    font-weight: 600 !important;

    letter-spacing: 0.2px;

    box-shadow:
        0 10px 24px rgba(15,52,87,0.18);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}


/* Button shine */
.serendib-experience-btn
.elementor-button::before{
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 75%;
    height: 100%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,0.24),
            transparent
        );

    transform: skewX(-22deg);

    transition: left .6s ease;
}


.serendib-experience-btn
.elementor-button:hover::before{
    left: 130%;
}


.serendib-experience-btn
.elementor-button:hover{
    transform: translateY(-3px);

    background:
        linear-gradient(
            135deg,
            #087e55,
            #123f70
        ) !important;

    box-shadow:
        0 15px 32px rgba(15,52,87,0.25);
}


.serendib-experience-btn
.elementor-button-text{
    position: relative;

    z-index: 2;

    color: #ffffff !important;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1024px){

    .serendib-experience-head
    .elementor-heading-title{
        font-size: 40px;
    }


    .serendib-experience-item{
        border-radius: 16px;
    }

}


/* =========================================================
   MOBILE
   EVERYTHING CENTERED
========================================================= */

@media (max-width: 767px){

    /* ==========================================
       COMPLETE SECTION
    ========================================== */

    .serendib-experience-section{
        text-align: center !important;
    }


    /* ==========================================
       HEADING CENTER
    ========================================== */

    .serendib-experience-head{
        width: 100%;

        text-align: center !important;
    }


    .serendib-experience-head
    .elementor-widget-heading{
        text-align: center !important;
    }


    .serendib-experience-head
    .elementor-heading-title{
        font-size: clamp(30px, 9vw, 39px);

        line-height: 1.16 !important;

        letter-spacing: -0.6px;

        text-align: center !important;
    }


    .serendib-experience-head
    .elementor-heading-title::after{
        width: 58px;

        margin-left: auto !important;
        margin-right: auto !important;
    }


    /* ==========================================
       TEXT CENTER
    ========================================== */

    .serendib-experience-head
    .elementor-widget-text-editor,
    .serendib-experience-head
    .elementor-widget-text-editor p{
        font-size: 15px;

        line-height: 1.7;

        text-align: center !important;
    }


    /* ==========================================
       GALLERY CENTER
    ========================================== */

    .serendib-experience-gallery{
        text-align: center !important;
    }


    .serendib-experience-item{
        text-align: center !important;

        border-radius: 15px;
    }


    .serendib-experience-item
    .elementor-widget-image{
        text-align: center !important;
    }


    .serendib-experience-item
    .elementor-widget-image img{
        width: 100%;
    }


    .serendib-experience-item
    .elementor-heading-title{
        text-align: center !important;
    }


    /* Smaller movement on mobile */
    .serendib-experience-item:hover{
        transform: translateY(-4px);
    }


    /* ==========================================
       BUTTON CENTER
    ========================================== */

    .serendib-experience-btn{
        width: 100%;

        text-align: center !important;
    }


    .serendib-experience-btn
    .elementor-button-wrapper{
        width: 100%;

        display: flex !important;

        justify-content: center !important;

        text-align: center !important;
    }


    .serendib-experience-btn
    .elementor-button{
        display: inline-flex !important;

        align-items: center;
        justify-content: center;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px){

    .serendib-experience-head
    .elementor-heading-title{
        font-size: 30px !important;

        line-height: 1.16 !important;
    }


    .serendib-experience-head
    .elementor-widget-text-editor,
    .serendib-experience-head
    .elementor-widget-text-editor p{
        font-size: 14px;

        line-height: 1.65;

        text-align: center !important;
    }


    .serendib-experience-item{
        border-radius: 14px;
    }


    .serendib-experience-btn,
    .serendib-experience-btn
    .elementor-button-wrapper{
        text-align: center !important;

        justify-content: center !important;
    }

}/* End custom CSS */