
@charset "utf-8"; @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;500;600;700;800;900&display=swap'); 
body {padding: 0; margin: 0; font-family: 'Nunito', sans-serif;}
a {text-decoration: none !important; } a:hover {text-decoration: none !important; } 
a:focus {outline: 0px auto -webkit-focus-ring-color !important; outline-offset: 0px !important; } 
.side-info__logo img {background-color: #fff;}
.carousel-control-prev-icon, .carousel-control-next-icon {width: 45px; background-color: #273445; height: 50px; }
.carousel-control-prev, .carousel-control-next {position: absolute; top: 0;  bottom: 0; z-index: 1; display: flex; align-items: center; justify-content: center; width: 40px; padding: 0; color: #fff; text-align: center; background: none; border: 0; opacity: 0.8; transition: opacity 0.15s ease; }
.carousel-caption {position: absolute; right: 5% !important; bottom: 80px; left: 0; left: 0% !important; z-index: 10; padding-top: 20px; padding-bottom: 10px; color: #fff; text-align: right; }
.carousel-control-prev, .carousel-control-next:focus{outline: none !important;}
/* Header CSS Start */
.header-section {background: #0759C9;padding: 10px 0 10px 0px;}
.header-section .header-widget ul {padding-left: 0;margin-bottom: 0;list-style: none;}
.header-section .header-widget ul li {font-size: 15px;padding-right: 30px;margin-right: 15px;color: #ffffff;float: left;}
.header-section .header-widget ul li::before {position: absolute;content: '';background: #ffffff;width: 4px;height: 23px;right: 0;top: 0px;}
.header-section .header-widget ul li i {margin-right: 5px;font-size: 18px;top: 1px;position: relative;}
.header-section .header-widget ul li a {color: #ffffff; font-weight:500;}
.header-section .header-widget ul :nth-child(2)::before {display: none;}
.header-section .header-social ul {padding-left: 0;margin-bottom: 0;}
.header-section .header-social ul li{ text-decoration:none; list-style:none; float: right;}
.header-section .header-social ul li a i {color: #056839;background: #ffffff;width: 25px;height: 25px;border-radius:5px;display: inline-block;text-align: center;line-height: 28px;margin-left: 5px;position: relative;z-index: 0;-webkit-transition: .5s;transition: .5s;}
.header-section .header-social ul li a i::after {position: absolute;content: '';width: 0;height: 0;background: #249846;top: 0;left: 0;border-radius: 5px;z-index: -1;-webkit-transition: .5s;transition: .5s;}
.header-section .header-social ul li a i:hover::after {width: 100%;height: 100%;}
.header-section .header-social ul li a i:hover {color: #ffffff;}



/* =========================================
   WELCOME SECTION
========================================= */
.welcome-section {position: relative; overflow: hidden; padding: 100px 0; background: #f7faff;}
.welcome-container {width: 90%; max-width: 1200px; margin: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center;}
.welcome-tag {display: inline-block; padding: 8px 18px; margin-bottom: 18px; border-radius: 30px; background: #e8f3ff; color: #0866c6; font-size: 13px; font-weight: 700; letter-spacing: 1.5px;}
.welcome-content h2 {margin: 0 0 22px; color: #172b4d; font-size: 46px; line-height: 1.15; font-weight: 800;}
.welcome-content h2 span {color: #0070da;}
.welcome-content p {color: #667085; font-size: 16px; line-height: 1.8; margin-bottom: 15px;}
.welcome-content .welcome-intro {font-size: 18px; color: #475467;}
.welcome-features {display: flex; gap: 30px; margin: 30px 0;}
.welcome-feature {display: flex; align-items: center; gap: 12px;}
.feature-icon {width: 48px; height: 48px; flex-shrink: 0; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: #0070da; color: #fff; font-size: 19px;}
.welcome-feature h4 {margin: 0 0 4px; color: #172b4d; font-size: 15px;}
.welcome-feature p {margin: 0; color: #7a869a; font-size: 12px; line-height: 1.3;}
.welcome-btn {display: inline-flex; align-items: center; gap: 12px; padding: 14px 25px; border-radius: 6px; background: #0070da; color: #fff; text-decoration: none; font-size: 14px; font-weight: 700; transition: all 0.3s ease;}
.welcome-btn i {transition: transform 0.3s ease;}
.welcome-btn:hover {background: #172b4d; color: #fff; transform: translateY(-2px);}
.welcome-btn:hover i {transform: translateX(5px);}
.welcome-visual {position: relative; min-height: 450px; display: flex; align-items: center; justify-content: center;}
/* Decorative Circles */
.visual-circle {position: absolute; border-radius: 50%;}
.circle-one {width: 380px; height: 380px; background: #e4f2ff;}
.circle-two {width: 280px; height: 280px; background: #d2eaff;}
.product-card-main {position: relative; z-index: 2; width: 310px; min-height: 330px; padding: 42px 35px; border-radius: 25px; background: #fff; box-shadow: 0 25px 70px rgba(24, 71, 112, 0.15); text-align: center;}
.product-card-icon {width: 75px; height: 75px; margin: 0 auto 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #0070da; color: #fff; font-size: 30px;}
.product-card-main > span {color: #0070da; font-size: 11px; font-weight: 800; letter-spacing: 2px;}
.product-card-main h3 {margin: 15px 0; color: #172b4d; font-size: 27px; line-height: 1.25;}
.product-line {width: 55px; height: 3px; margin: 18px auto; background: #0070da; border-radius: 5px;}
.product-card-main p {margin: 0; color: #7a869a; font-size: 12px; line-height: 1.6;}
.floating-card {position: absolute; z-index: 4; display: flex; align-items: center; gap: 12px; padding: 14px 18px; background: #fff; border-radius: 12px; box-shadow: 0 15px 40px rgba(24, 71, 112, 0.14);}
.floating-card i {width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 9px; background: #e8f3ff; color: #0070da;}
.floating-card strong {display: block; color: #172b4d; font-size: 13px;}
.floating-card small {display: block; margin-top: 3px; color: #8993a4; font-size: 10px;}
.floating-card-one {top: 55px; left: 10px;}
.floating-card-two {right: 0; bottom: 55px;}
@media (max-width: 991px) {
.welcome-container {    grid-template-columns: 1fr; gap: 50px; }
.welcome-content {    text-align: center; }
.welcome-features {    justify-content: center; }
.welcome-visual {    min-height: 430px; }
}
@media (max-width: 600px) {
.welcome-section {    padding: 70px 0; }
.welcome-content h2 {    font-size: 34px; }
.welcome-content .welcome-intro {    font-size: 16px; }
.welcome-features {    flex-direction: column; align-items: center; gap: 18px; }
.product-card-main {    width: 270px; min-height: 310px; }
.circle-one {    width: 320px; height: 320px; }
.circle-two {    width: 240px; height: 240px; }
.floating-card-one {    left: -5px; }
.floating-card-two {    right: -5px; }
}
/* =========================================
   WELCOME SECTION
========================================= */

/* =========================================
   PRODUCTS SECTION
========================================= */
.products-section {position: relative; padding: 100px 0; background: #ebebeb; overflow: hidden;}
.products-container {width: 90%; max-width: 1240px; margin: auto;}
.section-heading {max-width: 700px; margin: 0 auto 55px; text-align: center;}
.section-heading > span {display: inline-block; margin-bottom: 12px; color: #0070da; font-size: 13px; font-weight: 800; letter-spacing: 2px;}
.section-heading h2 {margin: 0 0 15px; color: #172b4d; font-size: 42px; line-height: 1.2; font-weight: 800;}
.section-heading h2 strong {color: #0070da;}
.section-heading p {margin: 0; color: #6b778c; font-size: 16px; line-height: 1.8;}
.products-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;}
.product-box {position: relative; background: #ffffff; border-radius: 16px; overflow: hidden; box-shadow: 0 8px 30px rgba(22, 50, 80, 0.07); transition: all 0.35s ease;}
.product-box:hover {transform: translateY(-10px); box-shadow: 0 20px 45px rgba(22, 50, 80, 0.15);}
.product-image {position: relative; height: 245px; overflow: hidden; background: #eef5fa;}
.product-image img {width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s ease;}
.product-box:hover .product-image img {transform: scale(1.08);}
.product-overlay {position: absolute; inset: 0; display: flex; justify-content: center; align-items: center; background: rgba(8, 120, 209, 0.65); opacity: 0; transition: all 0.3s ease;}
.product-box:hover .product-overlay {opacity: 1;}
.product-overlay a {width: 52px; height: 52px; display: flex; align-items: center; justify-content: center; background: #ffffff; color: #0070da; border-radius: 50%; text-decoration: none; font-size: 18px; transform: translateY(20px); transition: all 0.3s ease;}
.product-box:hover .product-overlay a {transform: translateY(0);}
.product-overlay a:hover {background: #172b4d; color: #ffffff;}
.product-content {position: relative; padding: 30px 28px 28px;}
.product-icon {position: absolute; right: 25px; top: -28px; width: 55px; height: 55px; display: flex; align-items: center; justify-content: center; background: #0070da; color: #ffffff; border-radius: 12px; font-size: 21px; box-shadow: 0 8px 20px rgba(8, 120, 209, 0.3);}
.product-content > span {color: #aab4c3; font-size: 12px; font-weight: 800; letter-spacing: 1px;}
.product-content h3 {margin: 7px 0 10px; color: #172b4d; font-size: 22px; font-weight: 750;}
.product-content p {min-height: 52px; margin: 0 0 20px; color: #78869a; font-size: 13px; line-height: 1.7;}
.product-link {display: inline-flex; align-items: center; gap: 9px; color: #0070da; text-decoration: none; font-size: 13px; font-weight: 700; transition: all 0.3s ease;}
.product-link i {transition: transform 0.3s ease;}
.product-link:hover {color: #172b4d;}
.product-link:hover i {transform: translateX(5px);}
.products-bottom {text-align: center; margin-top: 50px;}
.all-products-btn {display: inline-flex; align-items: center; gap: 12px; padding: 15px 28px; background: #172b4d; color: #ffffff; border-radius: 6px; text-decoration: none; font-size: 14px; font-weight: 700; transition: all 0.3s ease;}
.all-products-btn:hover {background: #0070da; color: #ffffff; transform: translateY(-3px);}
.all-products-btn i {transition: transform 0.3s ease;}
.all-products-btn:hover i {transform: translateX(5px);}
@media (max-width: 991px) { .products-grid {    grid-template-columns: repeat(2, 1fr); }
    .section-heading h2 {    font-size: 36px; }
}

@media (max-width: 600px) { .products-section {    padding: 70px 0; }
    .products-grid {    grid-template-columns: 1fr; }
    .section-heading {    margin-bottom: 40px; }
    .section-heading h2 {    font-size: 30px; }
    .section-heading p {    font-size: 14px; }
    .product-image {    height: 230px; }
}

 /* =========================================
    VISION MISSION GOALS
 ========================================= */
.vmg-section { position: relative; overflow: hidden; padding: 100px 0; background: #ffffff;}
.vmg-container { width: 90%; max-width: 1200px; margin: auto;}
.vmg-heading { max-width: 700px; margin: 0 auto 55px; text-align: center;}
.vmg-heading > span { display: inline-block; margin-bottom: 12px; color: #0070da; font-size: 13px; font-weight: 800; letter-spacing: 2px;}
.vmg-heading h2 { margin: 0 0 15px; color: #172b4d; font-size: 42px; line-height: 1.2; font-weight: 800;}
.vmg-heading h2 strong { color: #0070da;}
.vmg-heading p { margin: 0; color: #6b778c; font-size: 16px; line-height: 1.8;}
.vmg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px;}
.vmg-card { position: relative; overflow: hidden; padding: 42px 32px 35px; background: #f7faff; border: 1px solid #e5edf5; border-radius: 18px; transition: all 0.35s ease;}
.vmg-card:hover { transform: translateY(-10px); background: #ffffff; border-color: #cfe5f7; box-shadow: 0 20px 50px rgba(23, 43, 77, 0.12);}
.vmg-number { position: absolute; top: 20px; right: 25px; color: #dceaf6; font-size: 48px; font-weight: 900; line-height: 1;}
.vmg-icon { position: relative; z-index: 2; width: 68px; height: 68px; display: flex; align-items: center; justify-content: center; margin-bottom: 25px; border-radius: 16px; background: #0070da; color: #ffffff; font-size: 27px; box-shadow: 0 10px 25px rgba(8, 120, 209, 0.25); transition: all 0.3s ease;}
.vmg-card:hover .vmg-icon { transform: rotate(-5deg) scale(1.05);}
.vmg-card h3 { position: relative; z-index: 2; margin: 0 0 14px; color: #172b4d; font-size: 24px; font-weight: 800;}
.vmg-card p { position: relative; z-index: 2; min-height: 125px; margin: 0; color: #6b778c; font-size: 14px; line-height: 1.8;}
.vmg-line { width: 45px; height: 3px; margin: 22px 0 13px; background: #0070da; border-radius: 10px;}
.vmg-card > span { color: #8a98aa; font-size: 10px; font-weight: 800; letter-spacing: 1.5px;}
.vmg-card-active { background: #0070da; border-color: #0070da; transform: translateY(-8px);}
.vmg-card-active h3,
.vmg-card-active p { color: #ffffff;}
.vmg-card-active .vmg-number { color: rgba(255, 255, 255, 0.12);}
.vmg-card-active .vmg-icon { background: #ffffff; color: #0070da;}
.vmg-card-active .vmg-line { background: #ffffff;}
.vmg-card-active > span { color: rgba(255, 255, 255, 0.75);}
.vmg-card-active:hover { transform: translateY(-15px);}
.vmg-bottom { display: flex; align-items: center; gap: 20px; max-width: 800px; margin: 55px auto 0; padding: 22px 28px; background: #f7faff; border: 1px solid #e5edf5; border-radius: 14px;}
.vmg-bottom-icon { width: 55px; height: 55px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #e8f3ff; color: #0070da; font-size: 21px;}
.vmg-bottom h4 { margin: 0 0 5px; color: #172b4d; font-size: 17px; font-weight: 800;}
.vmg-bottom p { margin: 0; color: #6b778c; font-size: 13px; line-height: 1.6;}
@media (max-width: 991px) {
.vmg-grid {grid-template-columns: repeat(2, 1fr);}
.vmg-card-active {transform: none;}
.vmg-heading h2 {font-size: 36px;}
}
@media (max-width: 600px) {
.vmg-section {padding: 70px 0;}
.vmg-grid {grid-template-columns: 1fr;}
.vmg-heading {margin-bottom: 40px;}
.vmg-heading h2 {font-size: 30px;}
.vmg-heading p {font-size: 14px;}
.vmg-card-active {transform: none;}
.vmg-card-active:hover {transform: translateY(-10px);}
.vmg-card p {min-height: auto;}
.vmg-bottom {align-items: flex-start; padding: 20px;}
}

/* =========================================
   WHY CHOOSE US SECTION
========================================= */
.why-section { width: 100%; padding: 100px 0; background: #f7fbff; overflow: hidden;}
.why-container { width: 90%; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 80px;}
.why-content { width: 100%;}
.why-tag { display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: 2px; color: #0070da; margin-bottom: 15px; position: relative; padding-left: 42px;}
.why-tag::before { content: ""; position: absolute; left: 0; top: 50%; width: 30px; height: 2px; background: #0070da; transform: translateY(-50%);}
.why-content h2 { margin: 0; color: #152f49; font-size: 42px; line-height: 1.15; font-weight: 700;}
.why-content h2 span { color: #0070da;}
.why-intro { margin: 22px 0 30px; max-width: 570px; color: #687b8e; font-size: 15px; line-height: 1.8;}
.why-list { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 30px; margin-bottom: 32px;}
.why-item { display: flex; align-items: flex-start; gap: 14px;}
.why-icon { width: 48px; height: 48px; min-width: 48px; border-radius: 13px; background: #e8f4ff; color: #0070da; display: flex; align-items: center; justify-content: center; font-size: 18px; transition: all 0.3s ease;}
.why-item:hover .why-icon { background: #0070da; color: #fff; transform: translateY(-4px);}
.why-item h4 { margin: 2px 0 6px; color: #18344f; font-size: 16px; font-weight: 700;}
.why-item p { margin: 0; color: #778899; font-size: 12px; line-height: 1.6;}
.why-btn { display: inline-flex; align-items: center; gap: 12px; padding: 14px 24px; background: #0070da; color: #fff; border-radius: 8px; text-decoration: none; font-size: 14px; font-weight: 600; box-shadow: 0 10px 25px rgba(7, 86, 168, 0.20); transition: all 0.3s ease;}
.why-btn i { transition: transform 0.3s ease;}
.why-btn:hover { background: #063f7d; color: #fff; transform: translateY(-3px);}
.why-btn:hover i { transform: translateX(5px);}
.why-right-new { width: 100%; display: flex; justify-content: center; align-items: center;}
.solution-panel { width: 100%; max-width: 520px; background: #0070da; border-radius: 28px; padding: 35px; position: relative; overflow: hidden; box-shadow: 0 25px 60px rgba(0, 74, 150, 0.20);}
.solution-panel::before { content: ""; position: absolute; width: 220px; height: 220px; border: 35px solid rgba(255,255,255,0.06); border-radius: 50%; right: -90px; top: -90px;}
.solution-panel::after { content: ""; position: absolute; width: 160px; height: 160px; background: rgba(255,255,255,0.04); border-radius: 50%; left: -80px; bottom: -70px;}
.panel-header { display: flex; justify-content: space-between; align-items: flex-start; position: relative; z-index: 2; margin-bottom: 28px;}
.panel-header span { display: block; color: #9ed4ff; font-size: 12px; font-weight: 700; letter-spacing: 2px;}
.panel-header h3 { color: #fff; font-size: 30px; line-height: 1.15; margin: 8px 0 0; font-weight: 700;}
.quality-circle { width: 62px; height: 62px; min-width: 62px; border-radius: 50%; background: #fff; color: #0070da; display: flex; justify-content: center; align-items: center; font-size: 23px; box-shadow:0 10px 25px rgba(0,0,0,0.15);}
.solution-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; position: relative; z-index: 2;}
.solution-box { background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.12); border-radius: 18px; padding: 20px; transition: all 0.3s ease;}
.solution-box:hover { background: #fff; transform: translateY(-5px); box-shadow: 0 12px 25px rgba(0,0,0,0.10);}
.solution-icon { width: 43px; height: 43px; border-radius: 12px; background: #fff; color: #0070da; display: flex; align-items: center; justify-content: center; font-size: 18px; margin-bottom: 15px; transition: all 0.3s ease;}
.solution-box:hover .solution-icon { background: #eaf5ff;}
.solution-box h4 { color: #fff; font-size: 16px; margin: 0 0 5px; font-weight: 700;}
.solution-box p { color: #c9e5ff; font-size: 12px; margin: 0; line-height: 1.5;}
.solution-box:hover h4 { color: #0070da;}
.solution-box:hover p { color: #6b7d91;}
.panel-footer { background: #fff; border-radius: 16px; margin-top: 18px; padding: 15px 17px; display: flex; align-items: center; gap: 12px; position: relative; z-index: 2;}
.wfooter-icon { width: 42px; height: 42px; min-width: 42px; border-radius: 12px; background: #eaf5ff; color: #0070da; display: flex; justify-content: center; align-items: center;}
.wfooter-content { flex: 1;}
.panel-footer strong { display: block; color: #17324d; font-size: 14px; line-height: 1.3;}
.panel-footer p { margin: 3px 0 0; color: #718096; font-size: 11px; line-height: 1.4;}
.footer-arrow { color: #0070da; font-size: 14px; margin-left: auto;}
.solution-panel {transition: transform 0.4s ease;}
.solution-panel:hover { transform: translateY(-6px);}
@media (max-width: 991px) {
.why-section {padding: 80px 0;}
.why-container {grid-template-columns: 1fr; gap: 55px; max-width: 700px;}
.why-content h2 {font-size: 38px;}
.why-intro {max-width: 100%;}
.why-right-new {width: 100%;}
.solution-panel {max-width: 600px;}
}
@media (max-width: 600px) {
.why-section {padding: 65px 0;}
.why-container {width: 90%; gap: 40px;}
.why-content h2 {font-size: 30px;}
.why-intro {font-size: 14px; margin: 18px 0 25px;}
.why-list {grid-template-columns: 1fr; gap: 18px;}
.why-icon {width: 44px; height: 44px; min-width: 44px;}
.solution-panel {padding: 25px; border-radius: 22px;}
.panel-header h3 {font-size: 25px;}
.quality-circle {width: 52px; height: 52px; min-width: 52px; font-size: 19px;}
.solution-grid {gap: 10px;}
.solution-box {padding: 15px;}
.solution-icon {width: 38px; height: 38px; font-size: 16px; margin-bottom: 11px;}
.solution-box h4 {font-size: 14px;}
.solution-box p {font-size: 11px;}
.panel-footer {padding: 12px;}
.footer-icon {width: 38px; height: 38px; min-width: 38px;}
.panel-footer strong {font-size: 12px;}
.panel-footer p {font-size: 10px;}
}


/***********Whatsapp here**************/
.whatsapp_btn{position: fixed;bottom: 100px;right: 10px;width: 50px;height: 50px;z-index:100;}
.whatsapp_btn .icon_logo{position: relative;z-index:150;padding: 5px;}
.whatsapp_btn .icon_logo > a > img{width: 100%;}
.whatsapp_btn .circle_waves{border-radius: 50%;background-color: #3cc04e;width: 50px;height: 50px;position: absolute;opacity: 0;bottom: 1px;left: 0px;z-index:120;animation: waves 4s infinite cubic-bezier(.36, .11, .89, .32);}
@keyframes waves {from {transform: scale(.55, .55);opacity: .6;}
to {transform: scale(1.8, 1.8);opacity: 0;}}
/***********Whatsapp here**************/

/* =========================================
   PREMIUM FOOTER
========================================= */
.main-footer {position: relative; background: #071d35; color: #fff;}
.footer-cta-wrap {width: 90%; max-width: 1200px; margin: 0 auto; position: relative; top: -65px; margin-bottom: -20px;}
.footer-cta {min-height: 190px; padding: 38px 45px; border-radius: 24px; background: #0070da; display: flex; align-items: center; justify-content: space-between; gap: 30px; position: relative; overflow: hidden; box-shadow: 0 20px 50px rgba(0, 50, 100, 0.25);}
.footer-cta::before {content: ""; position: absolute; width: 240px; height: 240px; border: 45px solid rgba(255,255,255,0.06); border-radius: 50%; right: -80px; top: -120px;}
.footer-cta::after {content: ""; position: absolute; width: 140px; height: 140px; background: rgba(255,255,255,0.04); border-radius: 50%; left: 42%; bottom: -90px;}
.footer-cta-content {position: relative; z-index: 2;}
.footer-cta-tag {color: #a9dcff; font-size: 11px; font-weight: 700; letter-spacing: 2px;}
.footer-cta h2 {margin: 8px 0 10px; font-size: 30px; line-height: 1.2; font-weight: 700;}
.footer-cta h2 span {color: #c8ebff;}
.footer-cta p {margin: 0; max-width: 580px; color: #d8efff; font-size: 13px; line-height: 1.6;}
.footer-cta-btn {position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 12px; padding: 15px 24px; background: #fff; color: #0070da; border-radius: 8px; text-decoration: none; font-size: 13px; font-weight: 700; white-space: nowrap; transition: all 0.3s ease;}
.footer-cta-btn i {transition: transform 0.3s ease;}
.footer-cta-btn:hover {background: #eaf6ff; color: #0070da; transform: translateY(-3px);}
.footer-cta-btn:hover i {transform: translateX(5px);}
.footer-main {padding: 45px 0 55px;}
.footer-container {width: 90%; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.25fr; gap: 55px;}
.footer-logo img {width: 100%; height:auto; background-color: #fff; padding: 10px; border-radius: 15px; margin-bottom: 10px;}
.footer-about {max-width: 310px; color: #91a8bc; font-size: 13px; line-height: 1.8; margin: 0 0 22px;}
.footer-social {display: flex; gap: 9px;}
.footer-social a {width: 37px; height: 37px; border: 1px solid rgba(255,255,255,0.12); border-radius: 9px; color: #b8cddd; display: flex; align-items: center; justify-content: center; text-decoration: none; font-size: 14px; transition: all 0.3s ease;}
.footer-social a:hover {background: #0070da; border-color: #0070da; color: #fff; transform: translateY(-4px);}
.footer-column h3 {position: relative; color: #fff; font-size: 16px; margin: 4px 0 22px; padding-bottom: 12px;}
.footer-column h3::after {content: ""; position: absolute; left: 0; bottom: 0; width: 35px; height: 2px; background: #2aa8f5;}
.footer-column ul {list-style: none; margin: 0; padding: 0;}
.footer-column ul li {margin-bottom: 12px;}
.footer-column ul li a {display: inline-flex; align-items: center; gap: 9px; color: #91a8bc; text-decoration: none; font-size: 13px; transition: all 0.3s ease;}
.footer-column ul li a i {color: #0070da; font-size: 10px; transition: transform 0.3s ease;}
.footer-column ul li a:hover {color: #fff; transform: translateX(4px);}
.footer-column ul li a:hover i {transform: translateX(3px);}
.contact-item {display: flex; align-items: flex-start; gap: 13px; margin-bottom: 19px;}
.contact-icon {width: 37px; height: 37px; min-width: 37px; border-radius: 9px; background: rgba(42,168,245,0.10); color: #38b2f4; display: flex; align-items: center; justify-content: center; font-size: 13px;}
.contact-item span {display: block; color: #6f879c; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 3px;}
.contact-item p,
.contact-item a {color: #b6c8d7; font-size: 13px; line-height: 1.6; margin: 0; text-decoration: none;}
.contact-item a:hover {color: #fff;}
.footer-bottom {border-top: 1px solid rgba(255,255,255,0.08); background: #05182c;}
.footer-bottom-container {width: 90%; max-width: 1200px; min-height: 65px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px;}
.footer-bottom p {margin: 0; color: #71879b; font-size: 14px;}
.footer-bottom-links {display: flex; align-items: center; gap: 10px;}
.footer-bottom-links a {color: #8196a8; text-decoration: none; font-size: 11px; transition: color 0.3s ease;}
.footer-bottom-links a:hover {color: #fff;}
.footer-bottom-links span {color: #3d5265; font-size: 10px;}
.footer-design a {color: #38b2f4; text-decoration: none;}
@media (max-width: 991px) {
.footer-container {grid-template-columns: 1fr 1fr; gap: 45px 35px;}
.footer-company {grid-column: span 2;}
.footer-about {max-width: 600px;}
.footer-bottom-container {flex-wrap: wrap; justify-content: center; padding: 18px 0;}
}
@media (max-width: 600px) {
.main-footer {margin-top: 65px;}
.footer-cta-wrap {width: 90%; top: -45px; margin-bottom: -10px;}
.footer-cta {padding: 28px 24px; min-height: auto; flex-direction: column; align-items: flex-start; border-radius: 20px;}
.footer-cta h2 {font-size: 24px;}
.footer-cta p {font-size: 12px;}
.footer-cta-btn {width: 100%; justify-content: center;}
.footer-main {padding: 35px 0 40px;}
.footer-container {width: 90%; grid-template-columns: 1fr; gap: 35px;}
.footer-company {grid-column: auto;}
.footer-logo {font-size: 23px;}
.footer-about {max-width: 100%;}
.footer-column h3 {margin-bottom: 17px;}
.footer-bottom-container {width: 90%; flex-direction: column; text-align: center; gap: 10px; padding: 18px 0;}
}


/* =========================================
   TAPWELL INDIA
   PREMIUM DARK PAGE TITLE
   ========================================= */

.tw-page-title {position: relative; width: 100%; min-height: 320px; display: flex; align-items: center; overflow: hidden; background: #101820; color: #ffffff;}
.tw-page-title-inner {position: relative; z-index: 5; width: 90%; max-width: 1250px; margin: 0 auto;}
.tw-page-title-label {display: flex; align-items: center; gap: 13px; margin-bottom: 18px; color: #aeb8c1; font-size: 12px; font-weight: 700; letter-spacing: 3px;}
.tw-page-title-label span {width: 42px; height: 2px; background: #005cce; display: block;}
.tw-page-title h1 {margin: 0 0 22px; color: #ffffff; font-size: clamp(48px, 6vw, 76px); line-height: 1; font-weight: 800; letter-spacing: -2px;}
.tw-page-title h1 strong {color: #005cce;}
.tw-breadcrumb {display: flex; align-items: center; gap: 12px; font-size: 13px;}
.tw-breadcrumb a {color: #aeb8c1; text-decoration: none; transition: 0.3s ease;}
.tw-breadcrumb a:hover {color: #005cce;}
.tw-breadcrumb i {color: #005cce; font-style: normal;}
.tw-breadcrumb span {color: #ffffff; font-weight: 600;}
.tw-glow {position: absolute; border-radius: 50%; pointer-events: none; filter: blur(2px);}
.tw-glow-one {width: 400px; height: 400px; right: -150px; top: -150px; background: rgba(242, 138, 50, 0.09);}
.tw-glow-two {width: 250px; height: 250px; left: 45%; bottom: -220px; background: rgba(242, 138, 50, 0.06);}
.tw-outline-circle {position: absolute; width: 430px; height: 430px; right: -130px; top: -180px; border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 50%;}
.tw-outline-circle::before {content: ""; position: absolute; width: 310px; height: 310px; right: 55px; top: 55px; border: 1px solid rgba(242, 138, 50, 0.20); border-radius: 50%;}
.tw-outline-circle::after {content: ""; position: absolute; width: 160px; height: 160px; right: 130px; top: 130px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 50%;}
.tw-page-title::before {content: ""; position: absolute; right: 40px; bottom: 40px; width: 130px; height: 80px; opacity: 0.45; background-image:linear-gradient( rgba(255,255,255,0.12) 1px, transparent 1px ), linear-gradient( 90deg, rgba(255,255,255,0.12) 1px, transparent 1px ); background-size: 16px 16px;}
.tw-page-title-number {position: absolute; right: 42px; top: 50%; transform: translateY(-50%) rotate(90deg); color: rgba(255,255,255,0.35); font-size: 11px; font-weight: 700; letter-spacing: 5px;}
.tw-page-title-line {position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: linear-gradient( 90deg, #005cce 0%, #005cce 18%, rgba(242,138,50,0.25) 18%, rgba(242,138,50,0.25) 100% );}
@media (max-width: 991px) {
.tw-page-title {min-height: 290px;}
.tw-page-title-number {display: none;}
.tw-outline-circle {right: -190px;}
}
@media (max-width: 767px) {
.tw-page-title {min-height: 255px;}
.tw-page-title-inner {width: 88%;}
.tw-page-title-label {font-size: 10px; letter-spacing: 2px; gap: 9px;}
.tw-page-title-label span {width: 28px;}
.tw-page-title h1 {font-size: 46px; letter-spacing: -1px; margin-bottom: 18px;}
.tw-breadcrumb {font-size: 12px; gap: 8px;}
.tw-outline-circle {width: 290px; height: 290px; right: -170px; top: -100px;}
.tw-outline-circle::before {width: 210px; height: 210px; right: 40px; top: 40px;}
.tw-outline-circle::after {width: 110px; height: 110px; right: 90px; top: 90px;}
.tw-page-title::before {right: 15px; bottom: 20px; width: 90px; height: 55px; background-size: 11px 11px;}
}
@media (max-width: 480px) {
.tw-page-title {min-height: 235px;}
.tw-page-title h1 {font-size: 40px;}
.tw-glow-one {right: -220px;}
}


/* =========================================
   TAPWELL INDIA
   MODERN ENQUIRY SECTION
   ========================================= */
.tw-enquiry {position: relative; width: 100%; padding: 90px 0; overflow: hidden; background: #eef2f4;}
.tw-enquiry-wrap {position: relative; z-index: 5; width: 90%; max-width: 1250px; margin: 0 auto; display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 75px; align-items: center;}
.tw-enquiry-left {position: relative;}
.tw-enquiry-tag {display: flex; align-items: center; gap: 12px; margin-bottom: 22px; color: #687681; font-size: 11px; font-weight: 800; letter-spacing: 3px;}
.tw-enquiry-tag span {width: 38px; height: 2px; background: #0759c9;}
.tw-enquiry-left h2 {margin: 0 0 25px; color: #172b3a; font-size: clamp(42px, 5vw, 64px); line-height: 1.08; letter-spacing: -2px; font-weight: 800;}
.tw-enquiry-left h2 em {color: #0759c9; font-style: normal;}
.tw-enquiry-text {max-width: 520px; margin: 0 0 38px; color: #667681; font-size: 15px; line-height: 1.8;}
.tw-range-title {margin-bottom: 14px; color: #87939b; font-size: 10px; font-weight: 800; letter-spacing: 2.5px;}
.tw-product-list {display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #d4dce1;}
.tw-product {min-height: 54px; padding: 10px 12px; display: flex; align-items: center; gap: 13px; border-bottom: 1px solid #d4dce1; transition: all 0.3s ease; cursor: default;}
.tw-product:nth-child(odd) {border-right: 1px solid #d4dce1;}
.tw-product b {color: #0759c9; font-size: 10px; font-weight: 800;}
.tw-product span {flex: 1; color: #304452; font-size: 13px; font-weight: 600;}
.tw-product i {color: #a4adb3; font-size: 16px; font-style: normal; transition: all 0.3s ease;}
.tw-product:hover {padding-left: 19px; background: #f5f7f8;}
.tw-product:hover span {color: #172b3a;}
.tw-product:hover i {color: #0759c9; transform: translate(3px, -3px);}
.tw-enquiry-right {position: relative; padding: 40px; background: #ffffff; border: 1px solid #dde3e7; box-shadow:  0 20px 55px rgba(35, 52, 65, 0.10);}
.tw-form-top {display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 25px; margin-bottom: 28px; border-bottom: 1px solid #e5e9ec;}
.tw-form-top small {display: block; margin-bottom: 7px; color: #0759c9; font-size: 10px; font-weight: 800; letter-spacing: 2px;}
.tw-form-top h3 {margin: 0; color: #172b3a; font-size: 27px; font-weight: 800;}
.tw-form-top > span {color: #d7dde1; font-size: 32px; font-weight: 800; line-height: 1;}
.tw-input-row {display: grid; grid-template-columns: 1fr 1fr; gap: 18px;}
.tw-input-box {margin-bottom: 19px;}
.tw-input-box label {display: block; margin-bottom: 8px; color: #64727c; font-size: 9px; font-weight: 800; letter-spacing: 1.5px;}
.tw-input-box input,
.tw-input-box select,
.tw-input-box textarea {width: 100%; padding: 13px 14px; border: 1px solid #dce2e6; border-radius: 2px; outline: none; background: #f7f9fa; color: #243746;   font-size: 13px; transition: 0.3s ease;}
.tw-input-box input:focus,
.tw-input-box select:focus,
.tw-input-box textarea:focus {border-color: #0759c9; background: #ffffff; box-shadow: 0 0 0 3px rgba(228,124,40,0.08);}
.tw-input-box input::placeholder,
.tw-input-box textarea::placeholder {color: #a2abb1;}
.tw-input-box textarea {min-height: 105px; resize: vertical;}
.tw-enquiry-btn {width: 100%; min-height: 55px; margin-top: 3px; padding: 0 20px; border: 0; background: #0759c9; color: #ffffff; display: flex; align-items: center; justify-content: space-between; cursor: pointer;   font-size: 11px; font-weight: 800; letter-spacing: 1.5px; transition: 0.3s ease;}
.tw-enquiry-btn strong {font-size: 23px; font-weight: 400; transition: 0.3s ease;}
.tw-enquiry-btn:hover {background: #cf6817;}
.tw-enquiry-btn:hover strong {transform: translateX(7px);}
.tw-enquiry-dot-pattern {position: absolute; left: -20px; bottom: 30px; width: 160px; height: 110px; opacity: 0.35; background-image: radial-gradient( #0759c9 1px, transparent 1px ); background-size: 12px 12px;}
.tw-enquiry-circle {position: absolute; width: 500px; height: 500px; right: -270px; top: -170px; border: 1px solid rgba(228,124,40,0.14); border-radius: 50%;}
.tw-enquiry-circle::before {content: ""; position: absolute; width: 360px; height: 360px; right: 69px top: 69px; border: 1px solid rgba(23,43,58,0.07); border-radius: 50%;}
@media (max-width: 991px) {
.tw-enquiry-wrap {grid-template-columns: 1fr; max-width: 720px; gap: 55px;}}
@media (max-width: 767px) {
.tw-enquiry {padding: 65px 0;}
.tw-enquiry-wrap {width: 88%; gap: 40px;}
.tw-enquiry-left h2 {font-size: 42px; letter-spacing: -1px;}
.tw-enquiry-text {font-size: 14px;}
.tw-product-list {grid-template-columns: 1fr;}
.tw-product:nth-child(odd) {border-right: 0;}
.tw-enquiry-right {padding: 28px 22px;}
.tw-form-top h3 {font-size: 23px;}
.tw-input-row {grid-template-columns: 1fr; gap: 0;}
.tw-enquiry-circle {width: 300px; height: 300px; right: -190px; top: -100px;}}
@media (max-width: 480px) {
.tw-enquiry-left h2 {font-size: 37px;}
.tw-enquiry-right {padding: 25px 18px;}}


/* =========================================
   TAPWELL INDIA
   CONTACT US - NO FORM
   ========================================= */
.tw-contact {position: relative; width: 100%; padding: 90px 0; overflow: hidden; background: #eef2f4;}
.tw-contact-container {position: relative; z-index: 2; width: 90%; max-width: 1250px; margin: auto;}
.tw-contact-header {max-width: 720px; margin-bottom: 55px;}
.tw-contact-kicker {display: inline-flex; align-items: center; gap: 12px; margin-bottom: 18px; color: #0759c9; font-size: 11px; font-weight: 800; letter-spacing: 3px;}
.tw-contact-kicker::before {content: ""; width: 35px; height: 2px; background: #0759c9;}
.tw-contact-header h1 {margin: 0 0 20px; color: #172b3a; font-size: clamp(48px, 6vw, 76px); line-height: 1; letter-spacing: -3px; font-weight: 800;}
.tw-contact-header h1 strong {color: #0759c9;}
.tw-contact-header p {max-width: 600px; margin: 0; color: #6d7c86; font-size: 15px; line-height: 1.8;}
 .tw-contact-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-bottom: 90px;}
.tw-contact-card {position: relative; min-height: 290px; padding: 30px; background: #ffffff; border: 1px solid #dce3e7; overflow: hidden; transition: all 0.35s ease;}
.tw-contact-card:hover {transform: translateY(-7px); border-color: #0759c9; box-shadow: 0 18px 45px rgba(45,62,74,0.10);}
.tw-contact-card-number {position: absolute; top: 22px; right: 25px; color: #e6eaed; font-size: 32px; font-weight: 800;}
.tw-contact-icon {width: 48px; height: 48px; margin-bottom: 28px; display: flex; align-items: center; justify-content: center; background: #f3f5f6; border: 1px solid #e1e6e9; color: #0759c9; font-size: 20px; font-weight: 700;}
.tw-contact-card > span {display: block; margin-bottom: 8px; color: #8a969e; font-size: 9px; font-weight: 800; letter-spacing: 2px;}
.tw-contact-card h3 {margin: 0 0 12px; color: #233b4b; font-size: 19px; font-weight: 800; word-break: break-word;}
.tw-contact-card p {min-height: 42px; margin: 0 0 20px; color: #7a8891; font-size: 12px; line-height: 1.7;}
.tw-contact-card a {display: inline-flex; align-items: center; gap: 12px; color: #0759c9; text-decoration: none; font-size: 10px; font-weight: 800; letter-spacing: 1px;}
.tw-contact-card a b {font-size: 17px; font-weight: 400; transition: transform 0.3s ease;}
.tw-contact-card a:hover b {transform: translateX(5px);}
.tw-contact-products {margin-bottom: 75px;}
.tw-products-heading {display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 25px;}
.tw-products-heading > span {color: #89969e; font-size: 9px; font-weight: 800; letter-spacing: 2.5px;}
.tw-products-heading h2 {margin: 0; color: #172b3a; font-size: 30px; font-weight: 800;}
.tw-products-heading h2 strong {color: #0759c9;}
.tw-products-list {display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #cfd8dd; border-left: 1px solid #cfd8dd;}
.tw-product-box {position: relative; min-height: 125px; padding: 22px; display: flex; flex-direction: column; justify-content: space-between; background: rgba(255,255,255,0.35); border-right: 1px solid #cfd8dd; border-bottom: 1px solid #cfd8dd; transition: all 0.3s ease;}
.tw-product-box:hover {background: #ffffff; box-shadow: inset 4px 0 0 #0759c9;}
.tw-product-box small {color: #0759c9; font-size: 9px; font-weight: 800; letter-spacing: 1px;}
.tw-product-box h3 {margin: 10px 0 0; color: #304756; font-size: 16px; font-weight: 700;}
.tw-product-box i {position: absolute; right: 20px; bottom: 20px; color: #a3adb3; font-size: 20px; font-style: normal; transition: 0.3s ease;}
.tw-product-box:hover i {color: #0759c9; transform: translate(4px, -4px);}
.tw-contact-cta {min-height: 145px; padding: 30px 38px; display: flex; align-items: center; justify-content: space-between; gap: 30px; background: #dfe7eb; border: 1px solid #d2dce1;}
.tw-contact-cta span {display: block; margin-bottom: 8px; color: #89969e; font-size: 9px; font-weight: 800; letter-spacing: 2px;}
.tw-contact-cta h2 {margin: 0; color: #243b4b; font-size: 26px; font-weight: 800;}
.tw-contact-cta h2 strong {color: #0759c9;}
.tw-contact-cta > a {min-width: 200px; min-height: 52px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #0759c9; color: #ffffff; text-decoration: none; font-size: 10px; font-weight: 800; letter-spacing: 1px; transition: 0.3s ease;}
.tw-contact-cta > a b {font-size: 21px; font-weight: 400; transition: 0.3s ease;}
.tw-contact-cta > a:hover {background: #cf6819;}
.tw-contact-cta > a:hover b {transform: translateX(6px);}
@media (max-width: 991px) {
.tw-contact-grid {grid-template-columns: 1fr 1fr;}
.tw-contact-card:last-child {grid-column: 1 / -1;}
.tw-products-list {grid-template-columns: 1fr 1fr;}
}
@media (max-width: 767px) {
.tw-contact {padding: 65px 0;}
.tw-contact-container {width: 88%;}
.tw-contact-header {margin-bottom: 40px;}
.tw-contact-header h1 {font-size: 46px; letter-spacing: -1px;}
.tw-contact-header p {font-size: 14px;}
.tw-contact-grid {grid-template-columns: 1fr; margin-bottom: 60px;}
.tw-contact-card:last-child {grid-column: auto;}
.tw-products-heading {display: block;}
.tw-products-heading h2 {margin-top: 10px; font-size: 27px;}
.tw-products-list {grid-template-columns: 1fr;}
.tw-contact-cta {padding: 28px 22px; flex-direction: column; align-items: flex-start;}
.tw-contact-cta h2 {font-size: 23px;}
.tw-contact-cta > a {width: 100%;}
}
@media (max-width: 480px) {
.tw-contact-header h1 {font-size: 40px;}
.tw-contact-card {padding: 25px; min-height: 275px;}}
.product-section {padding: 75px 20px; background: #f5f8fc;}
.product-container {max-width: 1250px; margin: 0 auto;}
.product-heading {text-align: center; max-width: 700px; margin: 0 auto 45px;}
.product-subtitle {display: inline-block; color: #0764ce; font-size: 12px; font-weight: 700; letter-spacing: 2px; margin-bottom: 12px;}
.product-heading h2 {color: #111e2d; font-size: 38px; font-weight: 700; margin: 0 0 15px;}
.product-heading h2 span {color: #0867d5;}
.product-heading p {color: #667386; font-size: 15px; line-height: 1.8; margin: 0;}
.product-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 25px;}
.product-card {background: #fff; border: 1px solid #e7edf5; border-radius: 14px; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease;}
.product-card:hover {transform: translateY(-6px); box-shadow: 0 15px 35px rgba(14, 55, 105, 0.12); border-color: #d3e5fa;}
.product-image {height: 245px; padding: 22px; display: flex; align-items: center; justify-content: center; background: #fff; overflow: hidden;}
.product-image img {display: block; width: 100%; height: 100%; object-fit: contain; transition: transform 0.35s ease;}
.product-card:hover .product-image img {transform: scale(1.06);}
.product-info {padding: 20px 22px 24px; border-top: 1px solid #eef2f7;}
.product-number {display: block; color: #0870df; font-size: 10px; font-weight: 700; letter-spacing: 1.4px; margin-bottom: 8px;}
.product-info h3 {color: #172638; font-size: 17px; font-weight: 700; line-height: 1.5; margin: 0;}
.product-cta {margin-top: 55px; padding: 35px 40px; background: linear-gradient(115deg, #0754b8, #0878e7); border-radius: 16px; color: #fff; text-align: center;}
.product-cta h3 {font-size: 25px; margin: 0 0 12px;}
.product-cta p {color: #e4efff; font-size: 14px; line-height: 1.7; margin: 0 0 22px;}
.product-btn {display: inline-flex; align-items: center; gap: 12px; padding: 13px 25px; background: #fff; color: #075dc5; font-size: 14px; font-weight: 700; text-decoration: none; border-radius: 7px; transition: background 0.3s ease, color 0.3s ease;}
.product-btn:hover {background: #10243b; color: #fff;}
.mg-bt {margin-bottom: 20px;}
@media (max-width: 991px) {.product-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.product-heading h2 {font-size: 32px; }
.product-image {height: 225px; }
}
@media (max-width: 575px) {.product-section {padding: 45px 15px; }
.product-grid {grid-template-columns: 1fr; gap: 18px; }
.product-heading {margin-bottom: 30px; }
.product-heading h2 {font-size: 28px; }
.product-heading p {font-size: 14px; }
.product-image {height: 240px; }
.product-info {padding: 17px 20px 20px; }
.product-cta {padding: 28px 20px; margin-top: 35px; }
.product-cta h3 {font-size: 21px; line-height: 1.5; }
}


/* ==================================
   COMMON PRODUCT CATEGORY SECTION
================================== */
.product-section {padding: 75px 20px; background: #f5f8fc;}
.product-container {max-width: 1250px; margin: 0 auto;}
.product-heading {max-width: 720px; margin: 0 auto 45px; text-align: center;}
.product-subtitle {display: inline-block; margin-bottom: 12px; color: #0764ce; font-size: 12px; font-weight: 700; letter-spacing: 2px;}
.product-heading h2 {margin: 0 0 15px; color: #111e2d; font-size: 38px; font-weight: 700; line-height: 1.3;}
.product-heading h2 span {color: #0867d5;}
.product-heading p {margin: 0; color: #667386; font-size: 15px; line-height: 1.8;}
.product-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px;}
.product-card {display: block; overflow: hidden; color: inherit; text-decoration: none; background: #fff; border: 1px solid #e5ebf3; border-radius: 15px; transition: transform 0.3s ease,box-shadow 0.3s ease, border-color 0.3s ease;}
.product-card:hover {transform: translateY(-7px); border-color: #b9d9ff; box-shadow: 0 16px 38px rgba(14, 55, 105, 0.13);}
.product-image {position: relative; display: flex; align-items: center; justify-content: center; height: 280px; padding: 25px; overflow: hidden; background: #fff;}
.product-image img {display: block; width: 100%; height: 100%; object-fit: contain; transition: transform 0.4s ease;}
.product-card:hover .product-image img {transform: scale(1.06);}
.product-view {position: absolute; right: 15px; bottom: 15px; padding: 9px 14px; color: #fff; background: #0867d5; border-radius: 6px; font-size: 12px; font-weight: 600; opacity: 0; transform: translateY(8px); transition: opacity 0.3s ease, transform 0.3s ease;}
.product-card:hover .product-view {opacity: 1; transform: translateY(0);}
.product-info {padding: 24px; border-top: 1px solid #edf1f6;}
.product-number {display: block; margin-bottom: 9px; color: #0870df; font-size: 10px; font-weight: 700; letter-spacing: 1.5px;}
.product-info h3 {margin: 0 0 10px; color: #172638; font-size: 22px; font-weight: 700; line-height: 1.4; transition: color 0.3s ease;}
.product-card:hover .product-info h3 {color: #0867d5;}
.product-info p {margin: 0 0 20px; color: #69788b; font-size: 14px; line-height: 1.7;}
.product-link {display: inline-flex; align-items: center; gap: 10px; color: #0867d5; font-size: 13px; font-weight: 700;}
.product-link span {font-size: 18px; transition: transform 0.3s ease;}
.product-card:hover .product-link span {transform: translateX(5px);}
.product-cta {display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 55px; padding: 38px 42px; color: #fff; background: linear-gradient(115deg, #0754b8, #0878e7); border-radius: 16px;}
.product-cta-content {max-width: 760px;}
.product-cta-subtitle {display: block; margin-bottom: 10px; color: #c7e3ff; font-size: 11px; font-weight: 700; letter-spacing: 2px;}
.product-cta h3 {margin: 0 0 12px; font-size: 25px; line-height: 1.4;}
.product-cta p {margin: 0; color: #e4efff; font-size: 14px; line-height: 1.8;}
.product-btn {display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; gap: 12px; padding: 14px 24px; color: #075dc5; background: #fff; border-radius: 7px; font-size: 14px; font-weight: 700; text-decoration: none; transition: color 0.3s ease, background 0.3s ease;}
.product-btn:hover {color: #fff; background: #10243b;}
@media (max-width: 991px) {.product-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.product-heading h2 {font-size: 32px; }
.product-image {height: 250px; }
.product-cta {padding: 30px; }
}
@media (max-width: 575px) {.product-section {padding: 45px 15px; }
.product-heading {margin-bottom: 30px; }
.product-heading h2 {font-size: 28px; }
.product-heading p {font-size: 14px; }
.product-grid {grid-template-columns: 1fr; gap: 20px; }
.product-image {height: 250px; padding: 22px; }
.product-info {padding: 20px; }
.product-info h3 {font-size: 20px; }
.product-view {opacity: 1; transform: none; }
.product-cta {flex-direction: column; align-items: flex-start; gap: 22px; margin-top: 35px; padding: 28px 22px; }
.product-cta h3 {font-size: 21px; }
}
.product-upcoming-card {position: relative; display: flex; align-items: center; justify-content: space-between; gap: 35px; min-height: 390px; padding: 55px 65px; overflow: hidden; background: linear-gradient(120deg, #ffffff 35%, #eaf4ff 100%); border: 1px solid #dceafb; border-radius: 20px; box-shadow: 0 15px 45px rgba(13, 68, 130, 0.07);}
.product-upcoming-content {position: relative; z-index: 2; flex: 1; max-width: 650px;}
.product-upcoming-content h2 {margin: 0 0 20px; color: #14263c; font-size: 42px; font-weight: 800; line-height: 1.25;}
.product-upcoming-content h2 span {color: #0867d5;}
.product-upcoming-content p {max-width: 560px; margin: 0 0 24px; color: #68788d; font-size: 15px; line-height: 1.9;}
.product-upcoming-badge {display: inline-flex; align-items: center; gap: 9px; margin-bottom: 27px; padding: 10px 15px; color: #075fc5; background: #e4f1ff; border: 1px solid #cfe4ff; border-radius: 50px; font-size: 12px; font-weight: 700;}
.product-upcoming-dot {width: 8px; height: 8px; background: #0878e7; border-radius: 50%;}
.product-upcoming-content .product-btn {display: flex; width: fit-content; color: #fff; background: #0867d5;}
.product-upcoming-content .product-btn:hover {background: #10243b;}
.product-upcoming-visual {position: relative; display: flex; flex: 0 0 300px; align-items: center; justify-content: center; min-height: 280px;}
.product-upcoming-circle {display: flex; align-items: center; justify-content: center; width: 245px; height: 245px; background: linear-gradient(145deg, #d9ebff, #ffffff); border: 1px solid #c7e0ff; border-radius: 50%; box-shadow: 0 15px 45px rgba(8, 103, 213, 0.12);}
.product-upcoming-icon {display: flex; align-items: center; justify-content: center; width: 115px; height: 115px; color: #fff; background: linear-gradient(145deg, #0878e7, #064ca8); border-radius: 28px; box-shadow: 0 15px 30px rgba(8, 103, 213, 0.25); transform: rotate(-8deg);}
.product-upcoming-icon span {font-size: 75px; font-weight: 300; line-height: 1;}
.product-upcoming-label {position: absolute; right: 0; bottom: 10px; padding: 12px 20px; color: #075fc5; background: #fff; border: 1px solid #dceafb; border-radius: 7px; box-shadow: 0 8px 20px rgba(13, 68, 130, 0.08); font-size: 11px; font-weight: 800; letter-spacing: 2px;}
@media (max-width: 991px) {.product-upcoming-card {padding: 40px 35px; gap: 20px; }
.product-upcoming-content h2 {font-size: 34px; }
.product-upcoming-visual {flex-basis: 230px; }
.product-upcoming-circle {width: 200px; height: 200px; }
.product-upcoming-icon {width: 95px; height: 95px; }
.product-upcoming-icon span {font-size: 60px; }
}
@media (max-width: 575px) {.product-upcoming-card {flex-direction: column; align-items: flex-start; padding: 32px 23px; gap: 15px; }
.product-upcoming-content h2 {font-size: 30px; }
.product-upcoming-content p {font-size: 14px; }
.product-upcoming-visual {align-self: center; flex: auto; width: 100%; min-height: 230px; }
.product-upcoming-circle {width: 185px; height: 185px; }
.product-upcoming-icon {width: 85px; height: 85px; border-radius: 22px; }
.product-upcoming-icon span {font-size: 55px; }
.product-upcoming-label {right: 5px; bottom: 0; }
}


/* ==============================
   TAPWELL ABOUT SECTION
============================== */
.tapwell-about-section {--twa-navy: #172b4d; --twa-blue: #0070da; --twa-white: #ffffff; --twa-text: #536176; --twa-border: #e4eaf2; background: #ffffff; padding: 80px 0; color: var(--twa-navy); overflow: hidden;}
.tapwell-about-section * {box-sizing: border-box;}
.twa-container {width: 90%; max-width: 1240px; margin: 0 auto;}
.twa-intro {display: grid; grid-template-columns: 1.15fr 0.85fr; align-items: center; gap: 65px; margin-bottom: 80px;}
.twa-label {display: inline-block; color: var(--twa-blue); font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 17px;}
.twa-intro-content h2 {font-size: clamp(34px, 4vw, 51px); line-height: 1.14; font-weight: 800; letter-spacing: -1.5px; margin: 0 0 25px; color: var(--twa-navy);}
.twa-intro-content h2 span,
.twa-section-heading h3 span,
.twa-commitment-side h3 span {color: var(--twa-blue);}
.twa-intro-content p {font-size: 15px; line-height: 1.9; color: var(--twa-text); margin: 0 0 16px;}
.twa-intro-content p strong {color: var(--twa-navy); font-weight: 700;}
.twa-intro-visual {min-height: 390px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 25px; background: #ffffff; border: 1px solid var(--twa-border); border-radius: 4px;}
.twa-visual-top,
.twa-visual-bottom {display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 2;}
.twa-visual-top span {font-size: 13px; font-weight: 800; letter-spacing: 3px; color: var(--twa-navy);}
.twa-visual-top i {color: var(--twa-blue); font-size: 20px;}
.twa-water-art {width: 270px; height: 270px; max-width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center;}
.twa-ring {position: absolute; border: 1px solid rgba(0, 112, 218, 0.23); border-radius: 50%;}
.twa-ring-one {width: 100%; height: 100%;}
.twa-ring-two {width: 78%; height: 78%; border-color: rgba(23, 43, 77, 0.23);}
.twa-ring-three {width: 57%; height: 57%; border-color: rgba(0, 112, 218, 0.42);}
.twa-drop {width: 105px; height: 105px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--twa-navy); box-shadow: 0 15px 40px rgba(23, 43, 77, 0.18); position: relative; z-index: 1;}
.twa-drop i {font-size: 44px; color: var(--twa-white);}
.twa-water-line {position: absolute; height: 2px; background: var(--twa-blue); opacity: 0.75;}
.twa-line-one {width: 45px; top: 35%; right: -10px;}
.twa-line-two {width: 30px; bottom: 27%; left: -2px;}
.twa-visual-bottom {justify-content: flex-start; gap: 10px; font-size: 12px; font-weight: 700; color: var(--twa-navy); letter-spacing: 0.5px;}
.twa-bottom-dot {width: 8px; height: 8px; display: inline-block; background: var(--twa-blue); border-radius: 50%;}
.twa-section-heading {display: flex; align-items: center; gap: 30px; margin-bottom: 30px;}
.twa-section-heading .twa-label {margin-bottom: 8px;}
.twa-section-heading h3 {margin: 0; color: var(--twa-navy); font-size: 32px; line-height: 1.25; font-weight: 800; letter-spacing: -0.7px;}
.twa-heading-line {height: 1px; background: var(--twa-border); flex: 1; margin-top: 15px;}
.twa-products {margin-bottom: 75px;}
.twa-product-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px;}
.twa-product-card {min-height: 175px; position: relative; padding: 25px 24px; background: #ffffff; border: 1px solid var(--twa-border); transition: background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;}
.twa-product-card:hover {background: var(--twa-navy); border-color: var(--twa-navy); transform: translateY(-4px);}
.twa-product-number {position: absolute; top: 17px; right: 20px; color: #9aa9bc; font-size: 12px; font-weight: 700;}
.twa-product-icon {width: 47px; height: 47px; display: flex; align-items: center; justify-content: center; margin-bottom: 17px; background: #edf5ff; color: var(--twa-blue); font-size: 21px; transition: background 0.3s ease, color 0.3s ease;}
.twa-product-card h4 {margin: 0; padding-right: 15px; color: var(--twa-navy); font-size: 16px; line-height: 1.5; font-weight: 700; transition: color 0.3s ease;}
.twa-card-arrow {position: absolute; bottom: 24px; right: 23px; font-size: 13px; color: var(--twa-blue); opacity: 0; transform: translateX(-5px); transition: 0.3s ease;}
.twa-product-card:hover h4,
.twa-product-card:hover .twa-product-number {color: #ffffff;}
.twa-product-card:hover .twa-product-icon {background: var(--twa-blue); color: #ffffff;}
.twa-product-card:hover .twa-card-arrow {opacity: 1; transform: translateX(0);}
.twa-product-featured {background: var(--twa-navy); border-color: var(--twa-navy);}
.twa-product-featured h4,
.twa-product-featured .twa-product-number {color: #ffffff;}
.twa-product-featured .twa-product-icon {background: var(--twa-blue); color: #ffffff;}
.twa-product-featured .twa-card-arrow {opacity: 1; transform: none; color: #ffffff;}
.twa-commitment {display: grid; grid-template-columns: 0.75fr 1.25fr; margin-bottom: 75px; background: #f5f8fc; border: 1px solid var(--twa-border);}
.twa-commitment-side {position: relative; min-height: 250px; padding: 35px; overflow: hidden; background: var(--twa-navy);}
.twa-commitment-label {color: #a9d2ff; font-size: 11px; font-weight: 700; letter-spacing: 2px;}
.twa-commitment-side h3 {position: relative; z-index: 1; margin: 20px 0 0; color: #ffffff; font-size: 35px; line-height: 1.2; font-weight: 800;}
.twa-commitment-side h3 span {color: #62b0ff;}
.twa-commitment-symbol {position: absolute; right: 22px; bottom: 18px; color: rgba(255, 255, 255, 0.12); font-size: 90px;}
.twa-commitment-content {align-self: center; padding: 35px 40px; border-left: 4px solid var(--twa-blue);}
.twa-commitment-content p {margin: 0 0 16px; color: var(--twa-text); font-size: 15px; line-height: 1.9;}
.twa-commitment-content p:last-child {margin-bottom: 0;}
.twa-commitment-content strong {color: var(--twa-navy);}
.twa-why-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 35px; row-gap: 0;}
.twa-why-item {display: flex; align-items: flex-start; gap: 17px; padding: 23px 0; border-bottom: 1px solid var(--twa-border);}
.twa-check {flex: 0 0 34px; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; background: #edf5ff; color: var(--twa-blue); font-size: 13px;}
.twa-why-item h4 {margin: 0 0 7px; color: var(--twa-navy); font-size: 16px; font-weight: 700;}
.twa-why-item p {margin: 0; color: var(--twa-text); font-size: 14px; line-height: 1.8;}
@media (max-width: 991px) {.tapwell-about-section {padding: 60px 0; }
.twa-container {width: 92%; }
.twa-intro {grid-template-columns: 1fr 0.8fr; gap: 30px; }
.twa-intro-visual {min-height: 330px; }
.twa-water-art {width: 220px; height: 220px; }
.twa-drop {width: 85px; height: 85px; }
.twa-drop i {font-size: 35px; }
.twa-product-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); }
.twa-commitment {grid-template-columns: 0.8fr 1.2fr; }
.twa-commitment-side {padding: 28px; }
.twa-commitment-content {padding: 28px; }
}
@media (max-width: 767px) {.tapwell-about-section {padding: 45px 0; }
.twa-intro {grid-template-columns: 1fr; gap: 30px; margin-bottom: 55px; }
.twa-intro-content h2 {font-size: 36px; letter-spacing: -0.8px; }
.twa-intro-content p {font-size: 14px; line-height: 1.8; }
.twa-intro-visual {min-height: 310px; }
.twa-products {margin-bottom: 55px; }
.twa-section-heading {gap: 15px; }
.twa-section-heading h3 {font-size: 27px; }
.twa-product-grid {gap: 10px; }
.twa-product-card {min-height: 160px; padding: 20px 15px; }
.twa-product-card h4 {font-size: 14px; }
.twa-product-number {top: 12px; right: 13px; }
.twa-commitment {grid-template-columns: 1fr; margin-bottom: 55px; }
.twa-commitment-side {min-height: 190px; padding: 28px; }
.twa-commitment-side h3 {font-size: 31px; margin-top: 14px; }
.twa-commitment-content {padding: 25px; border-left: 0; border-top: 4px solid var(--twa-blue); }
.twa-commitment-content p {font-size: 14px; }
.twa-why-grid {grid-template-columns: 1fr; }
.twa-why-item {padding: 20px 0; }
}
@media (max-width: 420px) {.twa-product-grid {grid-template-columns: 1fr 1fr; }
.twa-product-card {min-height: 150px; padding: 18px 12px; }
.twa-product-icon {width: 40px; height: 40px; font-size: 18px; }
.twa-product-card h4 {font-size: 13px; }
.twa-card-arrow {right: 12px; bottom: 14px; }
.twa-intro-content h2 {font-size: 32px; }
}


/* TAPWELL DEALER PAGE */
.tw-dealer-page {--tw-navy: #172b4d; --tw-blue: #0070da; --tw-text: #5b687c; --tw-light: #f4f7fb; --tw-border: #e1e7ef; color: var(--tw-navy); background: #fff; overflow: hidden;}
.tw-dealer-page *,
.tw-dealer-page *::before,
.tw-dealer-page *::after {box-sizing: border-box;}
.tw-dealer-page .tw-wrap {width: 90%; max-width: 1240px; margin: 0 auto;}
.tw-dealer-page a {text-decoration: none;}
.tw-dealer-page .tw-eyebrow {display: inline-block; margin-bottom: 14px; color: var(--tw-blue); font-size: 11px; font-weight: 800; letter-spacing: 2px; line-height: 1.6;}
.tw-dealer-page h1,
.tw-dealer-page h2,
.tw-dealer-page h3,
.tw-dealer-page p {overflow-wrap: anywhere;}
.tw-dealer-page .tw-hero {position: relative; padding: 75px 0; background: var(--tw-light); border-bottom: 5px solid var(--tw-blue);}
.tw-dealer-page .tw-hero-grid {display: grid; grid-template-columns: 1.12fr .88fr; align-items: center; gap: 55px;}
.tw-dealer-page .tw-hero h1 {margin: 0 0 18px; font-size: clamp(38px, 4.5vw, 58px); line-height: 1.12; letter-spacing: -1.5px; font-weight: 800;}
.tw-dealer-page .tw-hero h1 span,
.tw-dealer-page .tw-heading h2 span,
.tw-dealer-page .tw-audience h2 span,
.tw-dealer-page .tw-form-info h2 span {color: var(--tw-blue);}
.tw-dealer-page .tw-hero h2 {margin: 0 0 20px; font-size: 21px; line-height: 1.5;}
.tw-dealer-page .tw-hero p {margin: 0 0 15px; color: var(--tw-text); font-size: 14px; line-height: 1.9;}
.tw-dealer-page .tw-hero p strong {color: var(--tw-navy);}
.tw-dealer-page .tw-btn {display: inline-flex; align-items: center; justify-content: center; gap: 13px; margin-top: 15px; padding: 15px 22px; min-height: 50px; background: var(--tw-blue); color: #fff; font-size: 13px; font-weight: 700; line-height: 1.5; transition: .25s ease;}
.tw-dealer-page .tw-btn:hover {background: var(--tw-navy); color: #fff;}
.tw-dealer-page .tw-hero-art {min-height: 390px; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 25px; overflow: hidden; background: var(--tw-navy);}
.tw-dealer-page .tw-art-brand,
.tw-dealer-page .tw-art-caption {position: relative; z-index: 2; align-self: flex-start; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: 3px;}
.tw-dealer-page .tw-art-caption {display: flex; align-items: center; gap: 10px; letter-spacing: .4px;}
.tw-dealer-page .tw-art-caption i {color: #78bdff;}
.tw-dealer-page .tw-art-rings {position: absolute; top: 50%; left: 50%; width: 265px; height: 265px; max-width: 85%; transform: translate(-50%, -50%); display: flex; align-items: center; justify-content: center; border: 1px solid rgba(120, 189, 255, .35); border-radius: 50%;}
.tw-dealer-page .tw-art-rings::before,
.tw-dealer-page .tw-art-rings::after {content: ""; position: absolute; border: 1px solid rgba(120, 189, 255, .3); border-radius: 50%;}
.tw-dealer-page .tw-art-rings::before {inset: 12%;}
.tw-dealer-page .tw-art-rings::after {inset: 25%;}
.tw-dealer-page .tw-art-rings > div {position: relative; z-index: 1; width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--tw-blue); box-shadow: 0 15px 40px rgba(0, 0, 0, .2);}
.tw-dealer-page .tw-art-rings i {color: #fff; font-size: 40px;}
.tw-dealer-page .tw-section {padding-top: 75px; padding-bottom: 80px;}
.tw-dealer-page .tw-heading {margin-bottom: 30px;}
.tw-dealer-page .tw-heading h2 {margin: 0; font-size: 34px; line-height: 1.3; font-weight: 800; letter-spacing: -.6px;}
.tw-dealer-page .tw-benefit-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--tw-border); border-left: 1px solid var(--tw-border);}
.tw-dealer-page .tw-benefit {min-height: 215px; padding: 27px 24px; border-right: 1px solid var(--tw-border); border-bottom: 1px solid var(--tw-border); transition: background .25s ease;}
.tw-dealer-page .tw-benefit:hover {background: var(--tw-light);}
.tw-dealer-page .tw-benefit > i {display: flex; align-items: center; justify-content: center; width: 47px; height: 47px; margin-bottom: 18px; background: #edf5ff; color: var(--tw-blue); font-size: 20px;}
.tw-dealer-page .tw-benefit h3 {margin: 0 0 10px; font-size: 17px; line-height: 1.5; font-weight: 800;}
.tw-dealer-page .tw-benefit p {margin: 0; color: var(--tw-text); font-size: 13px; line-height: 1.85;}
.tw-dealer-page .tw-audience {padding: 65px 0; background: var(--tw-light); border-top: 1px solid var(--tw-border); border-bottom: 1px solid var(--tw-border);}
.tw-dealer-page .tw-audience-grid {display: grid; grid-template-columns: .8fr 1.2fr; align-items: start; gap: 50px;}
.tw-dealer-page .tw-audience h2 {margin: 0 0 15px; font-size: 33px; line-height: 1.3; font-weight: 800;}
.tw-dealer-page .tw-audience p {margin: 0; color: var(--tw-text); font-size: 14px; line-height: 1.8;}
.tw-dealer-page .tw-audience-list {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;}
.tw-dealer-page .tw-audience-list > div {display: flex; align-items: center; gap: 10px; min-height: 47px; padding: 11px; background: #fff; border: 1px solid var(--tw-border); font-size: 12px; font-weight: 700; line-height: 1.5;}
.tw-dealer-page .tw-audience-list i {color: var(--tw-blue);}
.tw-dealer-page .tw-category-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px;}
.tw-dealer-page .tw-category {min-height: 205px; padding: 25px; border: 1px solid var(--tw-border); background: #fff; transition: .25s ease;}
.tw-dealer-page .tw-category:hover {border-color: var(--tw-blue); transform: translateY(-3px);}
.tw-dealer-page .tw-category > i {display: flex; align-items: center; justify-content: center; width: 47px; height: 47px; margin-bottom: 20px; background: var(--tw-navy); color: #fff; font-size: 20px;}
.tw-dealer-page .tw-category:hover > i {background: var(--tw-blue);}
.tw-dealer-page .tw-category h3 {margin: 0 0 10px; font-size: 18px; line-height: 1.5;}
.tw-dealer-page .tw-category p {margin: 0; color: var(--tw-text); font-size: 13px; line-height: 1.85;}
.tw-dealer-page .tw-cta {position: relative; padding: 60px 0; overflow: hidden; background: var(--tw-navy);}
.tw-dealer-page .tw-cta .tw-eyebrow {color: #8dc8ff;}
.tw-dealer-page .tw-cta h2 {margin: 0 0 15px; color: #fff; font-size: 38px; line-height: 1.3;}
.tw-dealer-page .tw-cta p {max-width: 800px; margin: 0; color: #d8e3f0; font-size: 14px; line-height: 1.9;}
.tw-dealer-page .tw-cta p strong {color: #fff;}
.tw-dealer-page .tw-btn-light {background: var(--tw-blue);}
.tw-dealer-page .tw-btn-light:hover {background: #fff; color: var(--tw-navy);}
.tw-dealer-page .tw-form-layout {display: grid; grid-template-columns: .78fr 1.22fr; align-items: start; gap: 50px;}
.tw-dealer-page .tw-form-info {padding-top: 15px;}
.tw-dealer-page .tw-form-info h2 {margin: 0 0 18px; font-size: 35px; line-height: 1.3; font-weight: 800;}
.tw-dealer-page .tw-form-info > p {color: var(--tw-text); font-size: 14px; line-height: 1.9;}
.tw-dealer-page .tw-form-info ul {display: grid; gap: 13px; margin: 25px 0; padding: 0; list-style: none;}
.tw-dealer-page .tw-form-info li {position: relative; padding-left: 23px; font-size: 13px; font-weight: 600; line-height: 1.7;}
.tw-dealer-page .tw-form-info li::before {content: "\f00c"; position: absolute; top: 2px; left: 0; color: var(--tw-blue); font-family: "Font Awesome 6 Free"; font-weight: 900;}
.tw-dealer-page .tw-brand-note {display: flex; align-items: center; gap: 14px; margin-top: 30px; padding: 20px; border-left: 4px solid var(--tw-blue); background: var(--tw-light);}
.tw-dealer-page .tw-brand-note > i {display: flex; align-items: center; justify-content: center; width: 43px; height: 43px; flex: 0 0 43px; background: var(--tw-navy); color: #fff; font-size: 19px;}
.tw-dealer-page .tw-brand-note div {display: flex; flex-direction: column; gap: 6px;}
.tw-dealer-page .tw-brand-note strong {font-size: 14px;}
.tw-dealer-page .tw-brand-note span {color: var(--tw-text); font-size: 12px;}
.tw-dealer-page .tw-form-card {min-width: 0; padding: 30px; border: 1px solid var(--tw-border); background: #fff; box-shadow: 0 12px 40px rgba(23, 43, 77, .07);}
.tw-dealer-page .tw-form-title {margin-bottom: 25px; padding-bottom: 20px; border-bottom: 1px solid var(--tw-border);}
.tw-dealer-page .tw-form-title .tw-eyebrow {margin-bottom: 7px;}
.tw-dealer-page .tw-form-title h3 {margin: 0; font-size: 24px; line-height: 1.4;}
.tw-dealer-page .tw-fields {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 15px;}
.tw-dealer-page .tw-field {display: flex; flex-direction: column; gap: 8px; min-width: 0; margin-bottom: 18px;}
.tw-dealer-page .tw-field label,
.tw-dealer-page .tw-products-field legend {display: block; color: var(--tw-navy); font-size: 12px; font-weight: 700; line-height: 1.6;}
.tw-dealer-page .tw-field label span {color: var(--tw-blue);}
.tw-dealer-page .tw-field input,
.tw-dealer-page .tw-field select,
.tw-dealer-page .tw-field textarea {display: block; width: 100%; min-width: 0; min-height: 47px; margin: 0; padding: 12px 13px; border: 1px solid #dce4ee; border-radius: 0; outline: none; background: #fff; color: var(--tw-navy);  font-size: 13px; line-height: 1.5; box-shadow: none;}
.tw-dealer-page .tw-field input:focus,
.tw-dealer-page .tw-field select:focus,
.tw-dealer-page .tw-field textarea:focus {border-color: var(--tw-blue); box-shadow: 0 0 0 3px rgba(0, 112, 218, .08);}
.tw-dealer-page .tw-field input::placeholder,
.tw-dealer-page .tw-field textarea::placeholder {color: #9aa7b8; opacity: 1;}
.tw-dealer-page .tw-field textarea {min-height: 110px; resize: vertical;}
.tw-dealer-page .tw-products-field {min-width: 0; margin: 0 0 22px; padding: 0; border: 0;}
.tw-dealer-page .tw-products-field legend {margin-bottom: 10px;}
.tw-dealer-page .tw-check-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px;}
.tw-dealer-page .tw-check-grid label {display: flex; align-items: center; gap: 9px; min-width: 0; min-height: 42px; padding: 10px; border: 1px solid var(--tw-border); color: var(--tw-text); font-size: 12px; font-weight: 600; line-height: 1.5; cursor: pointer;}
.tw-dealer-page .tw-check-grid input {width: 15px; height: 15px; flex: 0 0 15px; margin: 0; accent-color: var(--tw-blue);}
.tw-dealer-page .tw-captcha {margin: 0 0 22px; overflow-x: auto;}
.tw-dealer-page .tw-captcha .g-recaptcha {width: 304px; max-width: 100%; min-height: 78px;}
.tw-dealer-page .tw-submit {display: flex; align-items: center; justify-content: center; gap: 13px; width: 100%; min-height: 52px; padding: 14px 18px; border: 0; border-radius: 0; background: var(--tw-blue); color: #fff; font-size: 13px; font-weight: 800; cursor: pointer; transition: background .25s ease;}
.tw-dealer-page .tw-submit:hover {background: var(--tw-navy);}
@media (max-width: 1024px) {.tw-dealer-page .tw-hero-grid {gap: 30px; }
.tw-dealer-page .tw-form-layout {gap: 30px; }
.tw-dealer-page .tw-form-card {padding: 24px; }
}
@media (max-width: 767px) {.tw-dealer-page .tw-wrap {width: 92%; }
.tw-dealer-page .tw-hero {padding: 45px 0; }
.tw-dealer-page .tw-hero-grid, .tw-dealer-page .tw-audience-grid, .tw-dealer-page .tw-form-layout {grid-template-columns: 1fr; gap: 30px; }
.tw-dealer-page .tw-hero h1 {font-size: 37px; letter-spacing: -.8px; }
.tw-dealer-page .tw-hero h2 {font-size: 19px; }
.tw-dealer-page .tw-hero p {font-size: 13px; }
.tw-dealer-page .tw-hero-art {min-height: 300px; }
.tw-dealer-page .tw-section {padding-top: 50px; padding-bottom: 55px; }
.tw-dealer-page .tw-heading h2, .tw-dealer-page .tw-audience h2, .tw-dealer-page .tw-form-info h2 {font-size: 29px; }
.tw-dealer-page .tw-benefit-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tw-dealer-page .tw-benefit {min-height: 215px; padding: 20px 15px; }
.tw-dealer-page .tw-benefit h3 {font-size: 15px; }
.tw-dealer-page .tw-benefit p {font-size: 12px; }
.tw-dealer-page .tw-audience {padding: 45px 0; }
.tw-dealer-page .tw-category-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tw-dealer-page .tw-category {min-height: 200px; padding: 19px; }
.tw-dealer-page .tw-cta {padding: 45px 0; }
.tw-dealer-page .tw-cta h2 {font-size: 30px; }
.tw-dealer-page .tw-form-card {padding: 22px 17px; }
.tw-dealer-page .tw-fields {grid-template-columns: 1fr; gap: 0; }
}

@media (max-width: 480px) {.tw-dealer-page .tw-benefit-grid, .tw-dealer-page .tw-audience-list, .tw-dealer-page .tw-category-grid, .tw-dealer-page .tw-check-grid {grid-template-columns: 1fr; }
.tw-dealer-page .tw-benefit {min-height: auto; padding: 22px; }
.tw-dealer-page .tw-category {min-height: auto; }
.tw-dealer-page .tw-form-title h3 {font-size: 21px; }
.tw-dealer-page .tw-btn {width: 100%; padding: 14px; }
.tw-dealer-page .tw-captcha {transform-origin: left top; }
}


/* ==========================================
   TAPWELL QUALITY PAGE
========================================== */
.tw-quality-page {--twq-navy: #172b4d; --twq-blue: #0070da; --twq-light: #f3f7fc; --twq-text: #596579; --twq-border: #e1e8f1; width: 100%; overflow: hidden; background: #ffffff; color: var(--twq-navy);  }
.tw-quality-page *,
.tw-quality-page *::before,
.tw-quality-page *::after {box-sizing: border-box;}
.tw-quality-page h2,
.tw-quality-page h3,
.tw-quality-page p {margin-top: 0;}
.tw-quality-page h2 {margin-bottom: 18px; color: var(--twq-navy); font-size: clamp(28px, 3vw, 40px); line-height: 1.2; font-weight: 800; letter-spacing: -0.8px;}
.tw-quality-page h3 {color: var(--twq-navy); font-size: 19px; line-height: 1.4; font-weight: 750;}
.tw-quality-page p {color: var(--twq-text); font-size: 15px; line-height: 1.85;}
.twq-eyebrow {display: inline-block; margin-bottom: 16px; color: var(--twq-blue); font-size: 12px; font-weight: 800; letter-spacing: 2px;}
.twq-intro {display: grid; grid-template-columns: 1.1fr 0.9fr; align-items: stretch; gap: 65px; max-width: 1440px; margin: 0 auto; padding: 80px 6%;}
.twq-intro-content {align-self: center;}
.twq-intro-content h2 span {display: block; color: var(--twq-blue);}
.twq-intro-content p {margin-bottom: 15px;}
.twq-btn {display: inline-flex; align-items: center; justify-content: center; gap: 22px; margin-top: 16px; padding: 15px 22px; color: #ffffff !important; background: var(--twq-blue); border: 1px solid var(--twq-blue); border-radius: 4px; text-decoration: none !important; font-size: 14px; font-weight: 700; transition: 0.25s ease;}
.twq-btn span {font-size: 20px;}
.twq-btn:hover {color: #ffffff !important; background: var(--twq-navy); border-color: var(--twq-navy); transform: translateY(-2px);}
.twq-intro-visual {position: relative; display: flex; align-items: center; min-height: 370px; padding: 45px; overflow: hidden; background: var(--twq-navy); isolation: isolate;}
.twq-visual-circle {position: absolute; z-index: -1; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 50%;}
.twq-circle-one {top: -100px; right: -90px; width: 310px; height: 310px;}
.twq-circle-two {top: -55px; right: -45px; width: 220px; height: 220px;}
.twq-visual-content {position: relative; z-index: 2;}
.twq-visual-label {color: #8ec5ff; font-size: 11px; font-weight: 800; letter-spacing: 2px;}
.twq-water-icon {margin-top: 24px; color: #8ec5ff; font-size: 28px;}
.twq-intro-visual h3 {margin: 14px 0 22px; color: #ffffff; font-size: clamp(36px, 4vw, 51px); line-height: 1.12; letter-spacing: -1px;}
.twq-visual-line {width: 65px; height: 4px; margin-bottom: 18px; background: var(--twq-blue);}
.twq-visual-content p {margin-bottom: 0; color: #d4deed;}
.twq-visual-watermark {position: absolute; right: 12px; bottom: -42px; z-index: -1; color: rgba(255, 255, 255, 0.045); font-size: 190px; font-weight: 900; line-height: 1;}
.twq-commitment {padding: 78px 6%; background: var(--twq-light);}
.twq-section-heading {max-width: 700px; margin: 0 auto 38px;}
.twq-section-heading > p {max-width: 580px; margin-bottom: 0;}
.twq-feature-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1200px; margin: 0 auto; border-top: 1px solid var(--twq-border); border-left: 1px solid var(--twq-border);}
.twq-feature {position: relative; min-width: 0; padding: 30px 27px 32px; background: #ffffff; border-right: 1px solid var(--twq-border); border-bottom: 1px solid var(--twq-border); transition: background 0.25s ease;}
.twq-feature:hover {background: #fafdff;}
.twq-feature-number {position: absolute; top: 25px; right: 25px; color: #dce8f5; font-size: 29px; font-weight: 800;}
.twq-feature-icon {display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 22px; color: var(--twq-blue); background: #eaf4ff; border-radius: 4px; font-size: 25px;}
.twq-feature h3 {margin-bottom: 12px;}
.twq-feature p {margin-bottom: 0; font-size: 14px; line-height: 1.8;}
.twq-process {max-width: 1440px; margin: 0 auto; padding: 82px 10%;}
.twq-process-heading {display: flex; align-items: flex-end; justify-content: space-between; gap: 35px; margin-bottom: 32px;}
.twq-process-heading > div {flex: 1 1 55%;}
.twq-process-heading h2 {margin-bottom: 0;}
.twq-process-heading > p {flex: 1 1 40%; max-width: 420px; margin-bottom: 4px;}
.twq-process-list {border-top: 1px solid var(--twq-border);}
.twq-process-item {display: grid; grid-template-columns: 75px 1fr 35px; align-items: center; gap: 25px; padding: 25px 8px; border-bottom: 1px solid var(--twq-border); transition: padding 0.25s ease, background 0.25s ease;}
.twq-process-item:hover {padding-right: 16px; padding-left: 16px; background: #f8fbff;}
.twq-process-number {color: var(--twq-blue); font-size: 25px; font-weight: 800;}
.twq-process-text h3 {margin-bottom: 5px;}
.twq-process-text p {max-width: 700px; margin-bottom: 0; font-size: 14px;}
.twq-process-arrow {color: var(--twq-blue); font-size: 24px; text-align: right;}
.twq-products {padding: 75px 6%; background: var(--twq-light);}
.twq-products .twq-section-heading {max-width: 1200px; margin-right: auto; margin-left: auto;}
.twq-product-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 45px; max-width: 1200px; margin: 0 auto;}
.twq-product {display: grid; grid-template-columns: 32px 1fr 24px; align-items: center; gap: 15px; padding: 21px 0; border-bottom: 1px solid #d9e3ef; color: var(--twq-navy); font-size: 16px; font-weight: 700; transition: color 0.2s ease;}
.twq-product:hover {color: var(--twq-blue);}
.twq-product-icon {display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; color: var(--twq-blue); background: #ffffff; border: 1px solid #dbe9f8; border-radius: 50%;}
.twq-product-arrow {color: var(--twq-blue); font-size: 19px; text-align: right;}
.twq-cta {position: relative; padding: 85px 20px; overflow: hidden; background: #f3f7fc; isolation: isolate;}
.twq-cta *,
.twq-cta *::before,
.twq-cta *::after {box-sizing: border-box;}
.twq-cta-inner {position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 0.9fr; width: 100%; max-width: 1200px; margin: 0 auto; background: #ffffff; box-shadow: 0 20px 65px rgba(23, 43, 77, 0.09);}
.twq-cta-left {display: flex; flex-direction: column; justify-content: center; padding: 65px 55px;}
.twq-cta-eyebrow {display: flex; align-items: center; gap: 11px; margin-bottom: 24px; color: var(--twq-blue); font-size: 12px; font-weight: 800; letter-spacing: 2px;}
.twq-cta-dot {width: 9px; height: 9px; background: var(--twq-blue); border-radius: 50%; box-shadow: 0 0 0 5px rgba(0, 112, 218, 0.1);}
.twq-cta-left h2 {margin: 0 0 22px; color: var(--twq-navy); font-size: clamp(36px, 4vw, 52px); font-weight: 800; line-height: 1.12; letter-spacing: -1.5px;}
.twq-cta-left h2 span {display: block; color: var(--twq-blue);}
.twq-cta-line {width: 75px; height: 4px; margin-bottom: 23px; background: var(--twq-blue);}
.twq-cta-left > p {max-width: 470px; margin: 0 0 27px; color: #657187; font-size: 15px; line-height: 1.9;}
.twq-cta-points {display: flex; flex-direction: column; gap: 15px;}
.twq-cta-points > div {display: flex; align-items: center; gap: 12px; color: var(--twq-navy); font-size: 14px; font-weight: 650;}
.twq-cta-check {display: flex; align-items: center; justify-content: center; flex: 0 0 25px; width: 25px; height: 25px; color: var(--twq-blue); background: #eaf4ff; border-radius: 50%; font-size: 13px; font-weight: 800;}
.twq-cta-right {position: relative; display: flex; flex-direction: column; justify-content: center; padding: 55px 45px; overflow: hidden; background: var(--twq-navy); isolation: isolate;}
.twq-cta-right::before,
.twq-cta-right::after {position: absolute; z-index: -1; content: ""; border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 50%;}
.twq-cta-right::before {top: -140px; right: -135px; width: 360px; height: 360px;}
.twq-cta-right::after {top: -95px; right: -90px; width: 270px; height: 270px;}
.twq-cta-number {position: absolute; top: 27px; right: 30px; color: rgba(255, 255, 255, 0.55); font-size: 10px; font-weight: 700; letter-spacing: 1.5px;}
.twq-cta-icon {display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 25px; background: rgba(0, 112, 218, 0.2); border: 1px solid rgba(142, 197, 255, 0.35); border-radius: 12px;}
.twq-cta-icon svg {width: 37px; height: 37px; fill: none; stroke: #8ec5ff; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round;}
.twq-cta-small-title {display: block; margin-bottom: 15px; color: #8ec5ff; font-size: 10px; font-weight: 800; letter-spacing: 1.4px; line-height: 1.7;}
.twq-cta-right h3 {margin: 0 0 18px; color: #ffffff; font-size: clamp(25px, 2.6vw, 34px); font-weight: 800; line-height: 1.25; letter-spacing: -0.5px;}
.twq-cta-right h3 span {display: block; color: #8ec5ff;}
.twq-cta-right > p {margin: 0 0 25px; color: #d3ddeb; font-size: 14px; line-height: 1.85;}
.twq-cta-buttons {display: flex; align-items: center; flex-wrap: wrap; gap: 12px;}
.twq-cta-primary,
.twq-cta-secondary {display: inline-flex; align-items: center; justify-content: center; gap: 17px; min-height: 49px; padding: 13px 18px; border: 1px solid transparent; border-radius: 4px; font-size: 13px; font-weight: 750; text-decoration: none !important; transition: 0.25s ease;}
.twq-cta-primary {color: #ffffff !important; background: var(--twq-blue); border-color: var(--twq-blue);}
.twq-cta-primary span {font-size: 20px; line-height: 1;}
.twq-cta-primary:hover {color: var(--twq-navy) !important; background: #ffffff; border-color: #ffffff; transform: translateY(-2px);}
.twq-cta-secondary {color: #ffffff !important; background: transparent; border-color: rgba(255, 255, 255, 0.35);}
.twq-cta-secondary:hover {color: #ffffff !important; background: rgba(255, 255, 255, 0.1); border-color: #ffffff; transform: translateY(-2px);}
.twq-cta-footer {display: flex; align-items: center; gap: 12px; margin-top: 34px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, 0.13); color: #b8c8df; font-size: 10px; font-weight: 800; letter-spacing: 1.3px; line-height: 1.7;}
.twq-cta-footer-line {flex: 0 0 28px; width: 28px; height: 2px; background: var(--twq-blue);}
.twq-cta-decoration {position: absolute; z-index: -1; width: 300px; height: 300px; border: 1px solid rgba(0, 112, 218, 0.09); border-radius: 50%; pointer-events: none;}
.twq-cta-decoration-one {top: -170px; left: -120px;}
.twq-cta-decoration-two {right: -170px; bottom: -180px; width: 400px; height: 400px;}


/* ==========================================
   TABLET RESPONSIVE
========================================== */
@media (max-width: 991px) {
.twq-intro {gap: 35px; padding: 60px 5%; }
.twq-intro-visual {min-height: 320px; padding: 32px; }
.twq-feature-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); }
.twq-process {padding: 65px 6%; }
.twq-process-heading {display: block; }
.twq-process-heading > p {margin-top: 18px; }
.twq-cta {padding: 65px 25px; }
.twq-cta-inner {grid-template-columns: 1fr 0.95fr; }
.twq-cta-left {padding: 45px 30px; }
.twq-cta-right {padding: 55px 28px 35px; }
.twq-cta-left h2 {font-size: 38px; }
.twq-cta-right h3 {font-size: 27px; }
.twq-cta-buttons {align-items: stretch; flex-direction: column; }
.twq-cta-primary, .twq-cta-secondary {width: 100%; }}
@media (max-width: 767px) {
.twq-intro {grid-template-columns: 1fr; gap: 35px; padding: 50px 22px; }
.twq-intro-visual {min-height: 290px; }
.twq-commitment, .twq-products {padding: 55px 22px; }
.twq-feature-grid {grid-template-columns: 1fr; }
.twq-feature {padding: 25px 22px; }
.twq-process {padding: 55px 22px; }
.twq-process-item {grid-template-columns: 43px 1fr 20px; gap: 12px; padding: 23px 0; }
.twq-process-number {font-size: 21px; }
.twq-process-text h3 {font-size: 17px; }
.twq-process-text p {font-size: 13px; }
.twq-product-grid {grid-template-columns: 1fr; }
.twq-cta {padding: 45px 18px; }
.twq-cta-inner {grid-template-columns: 1fr; }
.twq-cta-left {padding: 40px 25px; }
.twq-cta-left h2 {font-size: 38px; }
.twq-cta-right {padding: 45px 25px 30px; }
.twq-cta-right h3 {font-size: 29px; }
.twq-cta-buttons {flex-direction: row; align-items: center; }
.twq-cta-primary,
.twq-cta-secondary {width: auto; }
}
@media (max-width: 420px) {
.twq-intro-visual {padding: 26px; }
.twq-intro-visual h3 {font-size: 36px; }
.twq-product {grid-template-columns: 30px 1fr 18px; gap: 10px; font-size: 14px; }
.twq-cta {padding: 30px 12px; }
.twq-cta-left {padding: 32px 20px; }
.twq-cta-left h2 {font-size: 33px; }
.twq-cta-right {padding: 48px 20px 25px; }
.twq-cta-right h3 {font-size: 26px; }
.twq-cta-number {top: 20px; right: 20px; font-size: 9px; }
.twq-cta-buttons {align-items: stretch; flex-direction: column; }
.twq-cta-primary, .twq-cta-secondary {width: 100%; }
.twq-cta-footer {font-size: 9px; letter-spacing: 1px; }
}

