html, body, div, span, applet, object, iframe, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
    box-sizing: border-box;
    font-family: 'BT Beau Sans';
    font-size: 16px;
    line-height: 1.5;
    overflow-x: hidden;
}

blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.object-fit-cover{
    object-fit: cover;
}

strong {
    font-weight: bolder;
}
.service-main-content h1, .service-main-content h2, .service-main-content h3, .service-main-content h4, .service-main-content h5, .service-main-content h6 {
    background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    /* Text styles/20/20_Semi Bold */
    font-family: "BT Beau Sans";
    font-style: normal;
    font-weight: bold;
    line-height: 1.5; /* 150% */
}
.list-services {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 16px;
    row-gap: 32px;
}
.service {
    z-index: 1;
}
.service .post-thumbnail {
    aspect-ratio: 1.35 !important;
    border-radius: 20px;
}
.service .service-content {
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(2, 149, 119, 0.29) -57.95%, rgba(13, 110, 83, 0.95) 106.46%), #d3d3d37a 50% / cover no-repeat;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    transition: width 0.1s ease-out, height 0.1s ease-out;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px 35px;
    overflow: hidden;
    color: #FFF;
    text-align: justify;
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 20px; /* 142.857% */
    z-index: 2;
}
.service:hover .service-content {
    width: 100%;
    height: 100%;
}
.service .post-title {
    background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    /* Text styles/20/20_Semi Bold */
    font-family: "BT Beau Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5;
}
.service .title-wrapper {
    padding: 5px 15px;
    width: 70%;
    border-radius: 20px;
    border: 1px solid var(--3, #009A7B);
    background: var(--mode-base-00, #FFF);
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    text-align: center;
}
.title-wrapper:hover {
    border-radius: 20px;
    background: var(--1, linear-gradient(254deg, #00CBA2 2.04%, #04C89A 8.77%, #0CC592 16.31%, #13C189 24.71%, #1ABE81 33.65%, #12B980 43.54%, #09B37E 53.59%, #00AE7D 63.27%, #00A581 73.03%, #009C83 82.56%, #009284 92.53%, #008982 105.68%));
}
.title-wrapper:hover .post-title {
    background: #fff;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
ul.page-numbers {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: center;
}
 ul.page-numbers a.page-numbers:not(.next):not(.prev) {
    display: flex;
    width: 32px;
    height: 32px;
    justify-content: center;
    align-items: center;
    color: #FFF;
    text-align: center;

    /* Text styles/14/14_Semi Bold */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.4;
    border-radius: 16px;
    background: #ECFDE9;
}
ul.page-numbers a.page-numbers span.my-custom-class {
    background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
ul.page-numbers span.page-numbers.current {
    background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
    display: flex;
    width: 32px;
    height: 32px;
    justify-content: center;
    align-items: center;
    color: #FFF;
    text-align: center;

    /* Text styles/14/14_Semi Bold */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.4;
    border-radius: 16px;
}
.title-page {
    font-family: 'SVN-Aptima';
    font-size: 48px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 120.833% */
    background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.form-wrapper {
    padding: 32px 16px;
    background: url('../images/form-bg.png');
    background-size: cover;
    border-radius: 20px;
}
.form-title {
    color: var(--Primary-800, #006661);
    text-align: center;
    font-family: 'BT Beau Sans';
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
}
.form-wrapper label { 
    /* Text styles/14/14_Semi Bold */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5;
    background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
 
}
.form-wrapper input, .form-wrapper textarea {
    padding: 12px;
    border-radius: 8px;
    border: 0.5px solid var(--mode-base-400, #A1A1AA);
    background: #FFF;
    color: #333;

    /* Text styles/14/14_Regular */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 20px; /* 142.857% */
}
.form-wrapper input::placeholder, .form-wrapper textarea::placeholder {
    color: var(--mode-base-400, #A1A1AA);

    /* Text styles/14/14_Regular */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 20px; /* 142.857% */
}
.btn-submit {
    width: 230px;
    color: #FFF;
    text-align: center;
    font-family: "BT Beau Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.5; /* 150% */
    border-radius: 40px;
    background: #008982;
    height: 42px;
    border: 1px solid #008982;
    transition: all .1s ease;
}
.position-sticky {
    position: sticky;
    position: -webkit-sticky;
    left: 0;
    top: 100px;
}
.btn-submit:hover {
    background: #fff;
    color: #008982;
}
.btn-submit:hover svg path {
    fill: #008982;
}
.btn-submit svg {
    animation: phone-vr-circle-fill 1s infinite ease-in-out;
}
@-webkit-keyframes phone-vr-circle-fill {
    0% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }

    10% {
        -webkit-transform: rotate(-15deg) scale(1) skew(1deg)
    }

    20% {
        -webkit-transform: rotate(15deg) scale(1) skew(1deg)
    }

    30% {
        -webkit-transform: rotate(-15deg) scale(1) skew(1deg)
    }

    40% {
        -webkit-transform: rotate(15deg) scale(1) skew(1deg)
    }

    50% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }

    100% {
        -webkit-transform: rotate(0) scale(1) skew(1deg)
    }
}
.related-service {
    background: url('../images/related-bg.png');
    background-size: cover;
}
.related-title {
    color: #FDE285; 
    background: unset;

    /* H3 */
    font-family: 'SVN-Aptima';
    font-size: 48px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2;
    background-clip: unset;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
}
.section-title {
    font-family: 'SVN-Aptima';
    font-size: 62px;
    font-style: normal;
    font-weight: 400;
    line-height: 76px; /* 122.581% */
    text-transform: uppercase;
    background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
}
.post-second {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    align-items: center;
}
.post-second .post-thumb {
    aspect-ratio: 1.5;
    border-radius: 6px;
}
.category-post {
    color: #008436;
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 1.4; /* 142.857% */
    border-radius: 20px;
    background: rgba(228, 252, 224, 0.70);
    width: 100%;
    padding: 4px 10px;
    width: fit-content;
    gap: 8px;
}
.post-second .post-title{
    color: #000;

    /* Text styles/14/14_Semi Bold */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 1.4; /* 142.857% */
}
.post-second .post-title a {
    color: #000;
}
.post-excerpt {
    color: #000;

    /* Text styles/14/14_Semi Bold */
    font-family: "BT Beau Sans";
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 1.4; /* 142.857% */
}
.post-first .post-thumbnail {
    aspect-ratio: 2;
    border-radius: 20px;
}
.post-first .post-content {
    width: calc(50% - 48px);
    position: absolute;
    bottom: 16px;
    left: 16px;
    padding: 16px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.95);
}
.post-first .post-title a {
    color: #008436;

    /* Text styles/18/18_Bold */
    font-family: "BT Beau Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.4; /* 144.444% */
    text-decoration-line: underline;
}
.btn-readmore {
    border-radius: 20px;
    border: 1px solid var(--3, #009A7B);
    padding: 8px;
    color: #008436;
    text-align: center;

    /* Text styles/14/14_Regular */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 1.4; /* 142.857% */
    width: fit-content;
}
.post-third .post-thumb {
    aspect-ratio: 1.5;
    border-radius: 20px;
}
.post-third .post-title  a{
    color: #000;

    /* Text styles/18/18_Bold */
    font-family: "BT Beau Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.4; /* 144.444% */
}
.detail-icon {
    color: #676767;

    /* Text styles/14/14_Regular */
    font-family: "BT Beau Sans";
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 1.4; /* 142.857% */
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 4px;
}
.swiper-button {
    width: 32px;
    height: 32px;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}
.btn-next {
    right: 16px;
}
.btn-prev {
    left: 16px;
}
.single-post .post-third  {
    border-radius: 20px;
}
.single-post-title{
    text-align: center;

/* H3 */
font-family: SVN-Aptima;
font-size: 48px;
font-style: normal;
font-weight: 400;
line-height:1.2; /* 120.833% */
background: var(--3, linear-gradient(180deg, #009A7B 0%, #0F644A 100%));
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}