
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@import url('../dist/bootstrap/css/bootstrap.min.css');
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playwrite+US+Trad:wght@100..400&family=Sansita+Swashed:wght@300..900&display=swap');

:root { 
    --primary-font:"Inter", sans-serif;
    --secondary-font:"IBM Plex Sans", sans-serif;
    --gray: #333333;
    --light-gray: #f5f3f3;
    --blue: #0a4871;
    --orange: #ef7f1a;
}
body { color: var(--gray); font-family: var(--primary-font); font-weight: 400; line-height: normal; overflow-x: hidden; position: relative; }
a { color: var(--bs-blue); }
a, a:hover { text-decoration: none; }
a:focus { outline: none; }
*:focus { outline: none; }
button:active, button:focus, .btn:active, .btn:focus { box-shadow: none !important; outline: none !important; }
.img-responsive, .navbar-brand > img { display: inline-block; }
img { display: inline-block; height: auto; max-width: 100%; }
h1, h2, h3, h4, h5 { color: var(--bs-white); font-family: var(--primary-font); font-weight: 700; }
h6 { color: var(--bs-white); font-family: var(--primary-font); font-weight: 700; }
h1 { font-size: 71px; }
h2 { font-size: 35px; }
p, li { color: var(--gray); font: 500 16px/1.5 var(--primary-font); overflow-wrap: break-word; word-wrap: break-word; }
.clearfix { clear: both; margin: 0px; padding: 0px; }
.blink { -webkit-animation: blink-1 6s infinite both;animation: blink-1 6s infinite both;}

@-webkit-keyframes blink-1 {
  0%,
  50%,
  100% {
    opacity: 1;
  }
  25%,
  75% {
    opacity: 0;
  }
}
@keyframes blink-1 {
  0%,
  50%,
  100% {
    opacity: 1;
  }
  25%,
  75% {
    opacity: 0;
  }
}


p a {font-weight: bold;}

.header { background:#fff; height: 105px; left: 0; right: 0; top: 0; z-index: 9; 
  margin: 0 30px 0 30px;
  position: relative;
  border-radius: 0 0 40px 40px;}


  

  .navbar-brand img {
  border-radius: 30px;
}



.header .navbar-brand { max-width: 160px; }
.smaller { background: #fff; padding-bottom: 0.5rem; position: fixed; z-index: 999; height: 85px; }
.smaller .navbar-brand { max-width:160px; }
.navbar-expand-lg .navbar-nav a.nav-link:hover {color: #ef7f1a;}
.navbar-expand-lg .navbar-nav a.nav-link { color:#070; font-size: 16px; font-weight: 500; font-family: var(--primary-font);padding-right:15px;
        padding-left: 15px;}
.navbar-nav .nav-link:hover { color: var(--orange); }
.navbar-nav .nav-link.active { color: var(--orange); }
.navbar-nav .nav-link.show { color: var(--orange); }
.navbar-nav .position-static {position:relative !important;}

.green-btn.btn {background: green;color: #fff;font-size: 14px;}
.green-btn.btn:hover {background: rgb(6, 164, 6);transition: 2ms ease-in-out; color: #fff;font-size: 14px;}

.orng-btn.btn {border: 2px solid #CB5637;color: #CB5637;font-size: 14px;margin-left: 8px;}

.dropdown-toggle::after{opacity:0;opacity:0;font-size:0;border:0}
.py-banner{padding:0% 0; }
.py-banner .owl-carousel button.owl-dot {background-color: #898888;border-radius: 50px;margin:0 5px;width: 12px;height: 12px;}
 .py-banner .owl-carousel button.owl-dot.active {background-color: #fff;}
 .py-banner .owl-dots {position: absolute;bottom: 30px;display: inline-block;width:100%;left:0;}

.dropdown-item {color: var(--bs-white);}
.dropdown .dropdown-menu { background-color: #125683; display: none; }
.dropdown:hover>.dropdown-menu, .dropend:hover>.dropdown-menu { display: block; margin-top: .1em; margin-left: .1em; }
.dropend:hover>.dropdown-menu { position: absolute; top: 0; left: 100%; }
.dropdown-item { border-bottom: 1px solid rgba(255, 255, 255, 0.25); font-size: 14px; font-weight:500; }
.dropdown-item:focus { background-color: #f8f9fa; color: #212529; }

a.nav-link {transition:transform 4s ease-in;}
a.nav-link:hover .drop {transform: rotate(-180deg);display: inline-block;}

.btn-primary{background-color:#ef7f1a;border-radius:12px;border:inherit;color:#fff;font:700 14px 'Raleway',sans-serif;line-height:24px;min-width:163px;min-height:36px;text-transform:uppercase;padding:9px 0;}
.btn-primary:hover,.btn-primary:focus{background-color:#ef7f1a;}
.banner{clear:both;position:relative;width:100%;line-height: 0;}
.banner .overlay{height:100%;width:100%;z-index:2;display: flex;align-items: center;}
.banner .overlay::after {content: "";width:100%; height: 100%;position: absolute; top:0px; left:0;}
.banner h1{font-size:24px;font-family:'Raleway',sans-serif;text-transform:none; color:#fff;border-bottom: 1px solid;
  display: flex;padding-bottom: 12px;padding-top: 12px;margin-bottom: 12px;}
.banner h4 {font-size: 16px; color: #fff;}


.intro-right p,.row.intro-para p{line-height:30px; margin-bottom: 8px;}
.our-company{margin-top:60px}
.blu-para{color:#137742; font-weight: bold;}
.intro-para{padding:7px 0 40px 0}
.intro-right h2{color:#0e8d43;font-family:"DM Serif Display",serif;font-style:italic;font-weight:400;margin-bottom:10px}
.intro-right h2 span{color:#0e8d43;font-size:32px}
.blue-strip-ico{background:#1d1a56;padding:40px 0 70px}
.blue-strip-ico ul{margin:0;padding:0;display:flex;column-gap:30px;justify-content:center}
.blue-strip-ico ul li{list-style:none;color:#fff;font-size:14px}
.blue-strip-ico ul li span{display:flex;justify-content:center;max-width:155px;text-align:center}
.why-wrp{max-width:1040px;margin:0 auto}
.row.why-wrp h3{font-weight:500;margin-bottom:40px}
.our-commite h2{color:#e25b48;font-size:28px;font-weight:500;margin-bottom:30px}
.our-commite{margin:40px auto}
.ul-line{position:relative}
.ul-line::after{position:absolute;content:"";width:1px;height:100%;background-color:#6989C86E}
.commt-wrap{display:flex;column-gap:1.99%}
.commt-man{border-radius:12px;width:30%;padding:12px;box-shadow:0 0 5px #00000029}
.commt-man img{border-radius:6px}
.commt-txt h6,.commt-txt span{color:#0358a3;font-weight:500}
.commt-txt{text-align:center;margin:18px auto}
.venue-hyy{background:url(../images/green.png) 0 -3px/100% no-repeat;padding-left:19px;margin-bottom:12px}
.hotl-right img{width:97%}.hd-htl{display:flex;align-items:center;column-gap:20px;margin-bottom:20px}
.hd-htl h2{margin:0;font-weight:500;font-size:28px}
.col.hotl-left h3,.hotl-left h5{font-weight:500;font-size:18px}
.col.hotl-left h3{color:#dce317}
.htl-btn.btn{background:#b74424;color:#fff;width:137px;height:42px;padding-top:7px;margin-top:30px}
.hotl-left{display:flex;align-items:center;justify-content:center}
.hotl-wrp{max-width:500px}
.kela-img,.kerala-left{position:relative}

.kerala-left h3 span,.venue-btn{color:#cb5637}
.kerala-hyy{background:url(../images/bg-kerala.png) right center no-repeat;padding-left:4px;margin-bottom:0;padding-top:120px}
.kerala-left h3{color:#008000;font-family:"Playwrite US Trad",cursive;margin-bottom:20px;border-bottom:1px solid;display:inline-block;padding-bottom:12px}
.kerala-left h4{font-family:"Sansita Swashed",system-ui;color:#0358a3;font-weight:500;font-size:20px}
.kerala-left h4 span{color:#137742}
.kerala-left{padding-left:32px}
.kerala-right{display:flex;justify-content:end}
.kerala-left ul li{list-style:none;padding-left:20px;font-size:14px;background:url(../images/kerla-bllt.png) left center no-repeat;margin-bottom:11px}
.kerala-left::after{position:absolute;border-radius:0 12px 12px 0;content:"";left:-5px;top:50%;width:40px;height:80px;background-color:#0358a3;margin-top:-100px;padding-left:40px}
.kerla-itm{position:absolute;display:flex;bottom:-80px;right:-20px;width:100%}
.kitm{width:18%;text-align:center}
.kerala{padding-bottom:140px}
.venue-btn{border:2px solid #cb5637;font-size:14px;width:150px;margin-top:14px}


.banner p {color: #fff;font-size: 16px;font-weight: 600;margin-top: 30px;}
.text-banner h3 {
    color: #fff;
}
.bnnr-btn.btn {background: #cb5637;color: #fff;}
.banner .slide-item {position: relative;}
.banner .text-banner {position: absolute;border-radius: 20px 20px 110px 20px;padding:30px 20px;top: 22%;left: 4%;width:36%;text-align: left; background-color:#116b37a3;background-size: cover;}

.banner h1 span{font-size:31px}
.banner h2{font-size:23px;font-weight:200;margin-top:50%;text-transform:uppercase}
.banner .btn-light{z-index:2;position:relative;border: none;background:transparent;display:inline-flex;color:var(--bs-white);font-family:var(--primary-font);font-size:14px;font-weight:700;line-height:32px;text-align:left;text-indent:20px;text-transform:uppercase;width:auto;}
.curve img {width:100%;}
.banner video{height:100%;object-fit:fill;width:100vw}
.kerala-right {position: relative;}
.kera-btn,.rut-pic-txt{color:#fff}
.kera-mg{margin-left:6px}

.count-bnr{width:500px;background:#fff;display:flex;justify-content:space-between;box-shadow:1px 3px 11px -1px #c5cacb4d;position:absolute;right:0;bottom:-38px;z-index:5;
  border-radius:20px;padding:15px 0 15px 15px;height:80px}


.sub-bnr-right .count-bnr{width:500px;background:#fff;display:flex;justify-content:space-between;box-shadow:1px 3px 11px -1px #c5cacb4d;
  border-radius:20px;padding:15px 0 15px 15px;height:80px; position: initial;}
.sub-bnr-right {position:absolute;right:0;bottom:-38px;z-index:5;}
.sub-bnr-right .banner-badge {margin-bottom: 12px;width: 275px;margin: 0 auto 16px auto;}
  
.row.d-flex.commite-cont {
    justify-content: center;
}
  
  .blu-tim,.subbanner{position:relative}
  .cont{display:flex;width:290px;justify-content:space-between}
  .blu-tim{bottom:36px}
  .contm{display:grid;gap:1px;margin:0 12px;line-height:initial}
  .contm span.top-tm{color:#b74424;font-size:23px;text-align: center;}
  .sub-bnr-text{position:absolute;top:50%;background:#0e2d4ba3;padding:46px 33px;border-radius:20px;left:10%}
  .sub-bnr-text h1{padding:0;margin:0;border:none}
  .box-cont{display:flex;column-gap:25px;margin-bottom:30px;border-radius:19px;box-shadow:1px 3px 11px -1px #a4a4a49e;padding:22px 30px;max-width:450px;
    align-items:center}
    .boxttext h4{color:#093d7c;font-weight:500;font-size:18px}
    .boxttext a{color:#137742;font-weight:500;font-size:16px}
    .boxttext p{font-size:13px;margin:26px 0 0}
.contact-form h2{color:#093d7c;font-size:26px}

.subpage-content h3{ color:#0e8d43; }

.contm span {  color: #302B63;}

.kera-btn{background:#0358a3;position:absolute;right:17%;z-index:5;width:130px;text-decoration: underline;
  height:130px;border-radius:100%;padding:40px 12px 35px;text-align:center;font-size:20px;margin-bottom:20px}
  .event-list li{background:url(../images/date.png) left top no-repeat;padding-left:44px;list-style:none}
  .event-list ul{padding:0;margin:0}
  .event-hyy{justify-content:space-between}
  .event-left{border:1px solid #dcdcdc;border-radius:20px;width:48%;box-shadow:0 0 9px 2px #ececec;padding:30px}
  .event-left h3 span{color:#3f369e;font-weight:500;display:block;font-size:20px}
  .event-left h3{color:#cb5637;font-weight:600;font-size:26px;margin-bottom:28px}
  .event-wwrp{display:flex;justify-content:space-between}
  .social-list li span{font-size:14px;color:#212529;display:block}
  .social-list li{font-size:16px;color:#0358a3;margin-bottom:12%}
  .event-list.progrmm li:last-child,.social-list li:last-child{margin:0}
  .event-list.progrmm li span{display:block;font-weight:600}
  .event-list.progrmm li{font-weight:300;margin-bottom:4%}
  .route-btm{background:#2e878f;border-radius:40px;padding:30px;margin-top:50px;margin-top: 50px;
  border-bottom: 10px solid aliceblue;}
  .rut-wr{display:flex;column-gap:30px;margin-bottom:30px}
  .rut-pic{width:60px;flex-shrink:0}
  .rut-pic-txt span{color:#ffd9ad;font-size:18px;font-weight:500}
.route-text{display:flex;align-items:center}
.route-left iframe {
    overflow: hidden;
    border-radius: 20px;
}
.owl-carousel .owl-item .banner-badge img{width:auto}

.address p,footer a{font-size:14px;color:#fff}
.address,.copy-rght{margin-top:20px}
.address p{margin:0}
.row.top-part span.small{color:#fff;font-size:18px;margin-bottom:-12px;display:block;  margin-top: 10px;}
footer a{margin-bottom:-6px;display:block}
.copy-rght{color:#fff;padding:20px 0;font-size:13px;text-align:center;border-top:1px solid #5c5da9}

footer {background:#34337f url(../images/footr-bg.jpg) center top no-repeat;list-style:none;padding-top: 50px;position: relative; }


.contact-wrap{padding-top:6%}.contact-form{max-width:500px;padding:12px 0}
.contact-title{color:#0b478b;font-size:24px;font-weight:700;line-height:1.3;margin-bottom:6px}
.contact-description{color:#5c5f63;font-size:15px;line-height:1.7;margin-bottom:24px}
.form-label{font-size:16px;font-weight:700;color:#111827;margin-bottom:8px}
.form-control{height:40px;border:1px solid #c8c8c8;border-radius:5px;font-size:16px;color:#333;padding:8px 10px;box-shadow:none}
.form-control::placeholder{color:#687078;opacity:1}
.form-control:focus{border-color:#9b9b9b;box-shadow:none}
textarea.form-control{height:120px;resize:vertical}
.form-group{margin-bottom:17px}
.captcha-box{width:302px;height:78px;border:1px solid #d6d6d6;background:#fafafa;display:flex;align-items:center;padding:10px 12px;margin-top:4px;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.captcha-checkbox{width:28px;height:28px;border:2px solid #555;background:#fff;margin-right:12px;flex-shrink:0}
.captcha-text{font-size:14px;color:#333;flex-grow:1}
.captcha-brand{width:48px;text-align:center;font-size:10px;color:#666;line-height:1.2}
.captcha-logo{width:32px;height:32px;margin:0 auto 2px;position:relative}
.captcha-logo::before{content:"";position:absolute;width:0;height:0;border-left:13px solid transparent;border-right:13px solid transparent;border-bottom:13px solid #4285f4;top:2px;left:3px}
.captcha-logo::after{content:"";position:absolute;width:18px;height:18px;border:6px solid #bbb;border-top-color:#4285f4;border-radius:50%;top:8px;left:6px}
.submit-btn{display:block;min-width:117px;height:44px;border:0;border-radius:24px;background:#ff6422;color:#fff;font-size:16px;font-weight:700;margin:16px auto 0;padding:0 28px;
  transition:background .2s,transform .2s}
  .submit-btn:hover{background:#e95718;color:#fff}
  .submit-btn:active{transform:scale(.98)}
  .contct-bnr .sub-bnr-text{background:#0779079E;max-width:450px;border-radius:20px 20px 110px;width: 100%;}
  .banner .contct-bnr p{color:#d7dd20;font-size:18px;font-weight:600;margin-top:0;width:80%;text-align:left}


.row.tour-top{background:#EAF3F0;border-radius:26px;padding:20px;margin-top: 30px;}
.tour-box{display:flex;column-gap:32px;align-items:center}
.tour-plcwrp h3{color:#1d1b59;font-weight:500}
.tour-plcwrp h4{color:#dd412b;font-size:17px;font-weight:500}
.tour-plcwrp{display:flex;align-items:center}
.tour-plcwrp li{list-style:none;padding-left:34px;color:#0a4e2a;font-size:14px;margin-bottom:10px;background:url(../images/tick.png) left 3px no-repeat}
.tour-plcwrp ul{margin:0;padding:0}
.tor-time h5{color:#000;font-weight:500}
.tour-plc{margin:50px 0}
.tor-time h6{color:green;font-weight:500}
.tour-top-text p{color:#02432f;font-size:14px}
.bg-grey {background: #f4f4f4;padding: 3px 0;}
h4.end-gr {color:#137742;font-weight: 600;}

.msg-vb {color: #0358a3;text-align: center;font-size: 20px;font-weight: 600;margin-top: 20px;}

.pesd-nm {color: #0358A3;display: block;}
.book-ctr,.tour-nme,.tourplc-eml{display:flex}
.tour-last{background:#eaf3f0;padding:20px;border-radius:40px;margin-bottom:40px}
.tourplc-last h6{color:#1b2f6f;max-width:200px}
.book-ctr{align-items:center;height:100%}
.book-ctrf h4{color:#1b2d72;font-weight:500;border-bottom:1px solid #bcd0c9}
.glbl{width:50%;font-size:14px}
.glbl a{color:#0358a3}.book-ctrf{width:100%}
.glbl span{display:block;margin-bottom:8px}
.tourplc-eml{align-items:center}

.gap {
  padding-left: 53px;
}
.gapc {
  padding-left: 71px;
}
.gapv {
  padding-left: 60px;
}

 .table-wrapper {
    max-width: 1100px;
    margin: 0 auto;
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(15, 76, 129, 0.15);
  }

  .table-wrapper table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
  }
  .pres-img {width: 100%;display: block;text-align: center;}

  .table-wrapper thead th {
    background: linear-gradient(135deg, #1878b8, #0e5c92);
    color: #ffffff;
    text-align: center;
    padding: 20px 16px;
    font-weight: 600;
    letter-spacing: 0.3px;
    line-height: 1.5;
  }

 .table-wrapper thead th:first-child {
    text-align: left;
    border-top-left-radius: 16px;
  }

  .table-wrapper thead th:last-child {
    border-top-right-radius: 16px;
  }

  .table-wrapper thead sup {
    font-size: 11px;
  }

  .table-wrapper tbody td {
    padding: 18px 16px;
    text-align: center;
    color: #1f2a37;
    border-bottom: 1px solid #eef1f5;
    transition: background 0.2s ease;
  }

  .table-wrapper tbody td:first-child {
    text-align: left;
    font-weight: 600;
    color: #0e5c92;
  }

  .table-wrapper tbody tr:nth-child(even) {
    background: #f7fafd;
  }

  .table-wrapper tbody tr:hover td {
    background: #e8f3fb;
  }

  .table-wrapper tbody tr:last-child td {
    border-bottom: none;
  }

  .table-wrapper tbody tr:last-child td:first-child {
    border-bottom-left-radius: 16px;
  }

  .table-wrapper tbody tr:last-child td:last-child {
    border-bottom-right-radius: 16px;
  }

  .table-wrapper .amount {
    font-weight: 600;
    color: #14532d;
  }

  .table-wrapper .rupee {
    font-weight: 400;
    color: #6b7280;
    margin-right: 2px;
  }


/*0000000000000000 21aug2026 start 000000000000000*/

.commite-cont h2 {
  color: green;
  margin: 60px 0 0px 0;
  font-size: 29px;
  font-weight: 600;
}

.commite-cont h3 {
color: rgb(13, 98, 160);
  font-size: 17px;
}

.picframe {
  position: relative;
  overflow: hidden;
}

.picframe a {
  font-size: 15px;
  font-weight: bold;
  background: linear-gradient(to right, #ea0562d9, #3c227bd9);
    background-clip: border-box;
  color: transparent;
  background-clip: text;
  display: inline-block;
}


.tour-listwrp .tour-plc {
  margin: 25px 0;
  background: #f2f2f2;
  padding: 20px;
  border-radius: 20px;
}

/* Keeps submenu hidden by default */
.dropdown-submenu .submenu {
  display: none;
}

/* Forces structural display visibility during interaction states */
.dropdown-submenu:hover > .submenu {
  display: block;
}


/* places-to-visit */
/******* place ********/
.tab {min-width:200px;font-weight:800;background: #FBF3FB !important;border-radius: 12px;padding:20px 40px;color:#AA28BE;font-size: 16px;border:none;display:flex;}
.tab .small {font-size: 12px;display:block;line-height:0;margin-bottom:5px;}
.sub-block {justify-content: center;position: relative;top: 2px;}
.tab-text {padding-top: 9px;text-align: left;text-transform: uppercase;margin-left: 5px;}
.tab-wrap { margin: 0 5px;}
.tab-wrap.active {border-bottom: 2px solid #AA28BE;padding-bottom: 15px;}
.place-dsbn {align-items: center;}
.place-dsbn img {width: 100%;}
.sub-place-cont .place-dsbn h2 {font-size: 24px;color:#C03284;position: relative;width:100%;width: 100%;
    padding-bottom: 20px;margin-bottom: 20px;}
.sub-place-cont .place-dsbn h2::after {content: ""; position:absolute;width:117px; height:2px; background:#CCCCCC !important;bottom: 0;
    margin-left: 50%;
    left: -48px; }
.sub-place-cont .place-dsbn p {font-size: 14px !important; line-height: 24px !important;font-weight: 500;}
.sub-place-cont {display:inline-block; margin:0 auto;width:100%;border-top:2px solid #E6BEEC !important;}
.bg-color-plce {background: #6153B5 !important;padding:0;}
.sub-place-cont .bg-color-plce .place-dsbn h2, .sub-place-cont .bg-color-plce .place-dsbn p {color: #FDF5FA !important;}
.sub-place-cont .bg-color-plce .place-dsbn ul li {color: #FDF5FA !important;}
.sub-place-cont .container {padding: 60px 0;}





@media (max-width:480px) {

div.subbanr-wrp .count-bnr {position: initial;}
}


@media (max-width:769px) {
.row-wrpp-mob.day-columres{flex-direction:column-reverse}
#place-to-visit p {padding:0 16px; color: #FDF5FA}
}


@media (max-width:992px) {
/*0000000000000000 21aug2026 start 000000000000000*/

  .commite-cont h2 {margin: 40px 0 20px 0;font-size: 24px;font-weight: 600;}

   .tour-listwrp .tourplc-pic {
    margin-top: 25px;
    padding: 0;
  }
.row.tour-plc.revers {
  flex-direction: column-reverse;
}

.submenu-arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}
.submenu-arrow.rotate-90 {
  transform: rotate(90deg);
}
.dropdown-menu.show {
  display: block !important;
  position: relative !important;
  transform: translate3d(0px, -4px, 0px) !important;
}

.dropdown .dropdown-menu {  
  padding-right: 12px;
}

/*0000000000000000 21aug2026 end 000000000000000*/

.contact-box,.glbl,.tourplc-eml,.tourplc-last.tour-top,.tourplc-logo{width:100%}
.tour-last,.tour-nme{display:block}
.tourplc-last.tour-top h6{width:100%;max-width:none}
.book-ctr{text-align:center;justify-content:center}
.glbl{font-size:14px;margin-bottom:20px}
.box-cont{max-width:none}

.form-wrp {width: 100%;}  
.contact-form {max-width: none;}

.subbanr-wrp .count-bnr {position: absolute;}
.contactr-wrp {flex-direction: column-reverse;}
.contact-form h2 {font-size: 24px;}
.contact-form {margin-bottom: 30px;}
.box-cont {padding: 14px;}
.boxttext h4 {font-size: 17px;}
.banner .contct-bnr p {font-size: 16px;margin-top: 0;width: 90%;}
.row-wrpp-mob.day-columres{flex-direction:inherit}
.contct-bnr .sub-bnr-text{width:80%;padding:21px 20px}
.tour-box{display:block}
.tor-time{margin-bottom:22px}

.row.tour-top{padding:12px;margin:20px 3px 0}
.tour-plc{margin:26px 0}
.tour-plcwrp{padding:0}
.tour-plcwrp p{font-size:15px}
.mobile-menu .menu-mobile{margin:0;background:green;padding-top:20px;padding-bottom:20px;padding-left:20px}
.hdr-one-txt h3{font-size:16px;font-weight:500; color: #fff;}
.appoin-btn{padding:20px 5px 15px 20px; background:#fff;}
.btn:active{border:none}
.offcanvas-body{padding-left:0;padding-right:0; padding-top: 0; background: #008000 !important; }


.hedr-sec.menu-mobile li a{color:#fff;padding:0 0 6px;font-size:14px;background-color: transparent;}
.menu-mobile a{color:#ff0;font-size:14px;font-weight:500}

.tourplc-pic {margin-top: 14px;}
.menu-mobile {margin: 40px 0;}
.commt-txt h6,.commt-txt span{color:#0358a3;font-weight:500;font-size:14px}
.commt-txt h6{margin:0}
.our-commite{margin:20px auto}
.blue-strip-ico ul li,.commt-man,.our-commite h2{margin-bottom:20px}
.commt-man{width:48%}
.commt-wrap{display:flex;column-gap:12px;flex-wrap:wrap}
.blue-strip-ico ul{flex-wrap:inherit}
.our-commite h2{color:#e25b48;font-size:19px;font-weight:500}
.blue-strip-ico{padding:40px 0 30px}
.ul-line{display:none}

.green-btn.btn {background: green;color: #fff;font-size: 14px; width: 46%;}

.orng-btn.btn {border: 2px solid #CB5637;color: #CB5637;width: 46%; font-size: 14px;margin-left: 8px;}




.intro-right h2{font-size:22px}
.intro-right h2 span{font-size:25px}
.intro-right p,.row.intro-para p{line-height:23px;margin-bottom:8px;font-size:14px}
.contm span.top-tm{font-size:19px}
.desktop-vw{display:none!important}
.navbar-brand img{width:90px}
.header{left:0;margin:0;position:fixed;height:70px;border-radius:0; box-shadow: 3px 0px 5px 4px #6c757d6e;}
.banner .text-banner {
    border-radius: 20px 20px 110px;
    padding: 18px 20px;
    top: auto;
    left: 12px;
    width: 88%;
    margin-top: -50%;
    position: inherit;
  }
.count-bnr {
    max-width: 500px;
    right: 0;
    background: #fff;
    bottom: -40px;
    width: auto;
    position: absolute;
  }
.banner-badge{width:50%}


.banner h1{font-size:16px}
.banner h4{font-size:13px}
.event-hyy,.venue-hyy{display:block}
.venue-hyy{background:url(../images/green.png) 0 0/cover no-repeat;padding-top:30px;padding-bottom:26px}
.hd-htl h2{font-size:20px}
.col.hotl-left h3,.hotl-left h5{font-weight:500;font-size:14px}
.col.hotl-right,.route-textwrp{margin-top:20px}

.event-left{width:100%;margin-bottom:17px;padding:20px}
.event-pic,.kerla-itm{display:none}

.event-list.progrmm li,.rut-pic-txt,.rut-pic-txt span{font-size:14px}
.event-left h3 span,.kera-btn,.kerala-left h4{font-size:16px}
.event-left h3{color:#cb5637;font-weight:600;font-size:22px}
.kerala-hyy{padding-top:40px}
.kela-img{margin-top:30px}
.kera-btn{width:110px;height:110px;padding:31px 12px 35px;margin-bottom:20px}
.kerala{padding-bottom:0}
footer .contact-left{width:100%}
.address{margin-bottom:30px}
footer{background:url(../images/footr-bg.jpg) center top no-repeat #25245d;list-style:none}
.kerala-left h3{font-size:23px}


/* places-to-visit */

.d-flex.sub-block {display: block;}
.d-flex.sub-block.tab-button {display:flex;}

}




@media (min-width:993px) {

.mobile-vw {display: none !important;}

.navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    top: 35px;
  }

}

@media screen and (min-width: 1000px) and (max-width: 1200px) {
.sub-bnr-text {padding: 11px 33px;}
 .navbar-expand-lg .navbar-nav a.nav-link{font-size:13px;padding-right:6px;padding-left:6px}
 .navbar-brand img{border-radius:30px;width:91px}
 .header{margin:0 10px}
 .orng-btn.btn{padding:6px 2px;font-size:12px}
 .banner .text-banner,.banner-badge{width:50%}
 .banner h1{font-size:18px;padding-bottom:12px;margin-bottom:12px;margin-top:6px}
 .banner h4{font-size:15px}
 .banner .text-banner{padding:18px 20px 20px;margin-top:-70px}
 .banner p{margin-top:10px}

.intro-right p,.row.intro-para p{line-height:25px;margin-bottom:8px;font-size:14px}
.col.hotl-left h3,.hotl-left h5{font-weight:500;font-size:14px}
.htl-btn.btn{margin-top:10px}
.hd-htl h2{font-size:23px}
.event-list.progrmm li{font-weight:300;margin-bottom:4%;font-size:13px}
.social-list li{font-size:13px}
.kela-img{height:370px}
.kerla-itm{right:50%;justify-content:space-between;max-width:600px;margin-right:-306px}
.kitm span,.rut-pic-txt{font-size:14px}
.kerala{padding-bottom:2%}
.rut-pic-txt span{font-size:15px}





  /* Your CSS rules here */
}

@media (max-width: 580px){
  .navbar-brand-mob img{width:120px}
}

@media screen and (min-width: 1200px) and (max-width: 1390px) {
  .navbar-expand-lg .navbar-nav a.nav-link {
  font-size: 14px;
  padding-right: 8px;background: transparent;
  padding-left: 8px;
}

.banner .text-banner {  
  top: 43%;
  left: 7%;
  width: 48%;
  margin-top: -8%;
}

.banner-badge{
  width: 43%;
}

.banner h4{
  font-size: 16px;
}

}

@media (min-width:1391px) {

  .banner .text-banner {
  width: 39%;
    margin-top:0;top: 30%;
}


}

@media (min-width:1280px) {



}

/* 28 aug 2026 00000000000000000000000000*/
.section .eyebrow,.tag-pill{text-transform:uppercase;font-weight:600}
.card,.info-list li,.panel li{position:relative}
.card h4,.fact .k,.group-head h3,.section .eyebrow,.tag-pill{font-weight:600}
.card,.fact,.panel{box-shadow:0 12px 28px rgba(15,23,42,.08)}
.section-tint{background:#f5f7f8;padding-top:44px;padding-bottom:44px}
.panel li{padding-left:26px;font-size:.95rem;color:#fff}
.panel h3{color:#fff;font-size:1.15rem;margin-bottom:14px}
.abstract-wrp .section{padding:60px 0}
.panel ul{list-style:none;display:flex;flex-direction:column;gap:12px;padding-left:0}
.panel li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;border-radius:50%;background:#fff}
.panel .note{margin-top:18px;font-size:.85rem;color:#fff;border-top:1px solid #fff;padding-top:14px}.fact{background:#fff;border:1px solid #e0e4e6;width:24%;border-radius:14px;padding:22px 20px}
.fact .k{color:#0358a3;font-size:.95rem;margin-bottom:6px}
.fact .v{color:#616775;font-size:14px;line-height:26px}


.fact .v strong{color:#101a32}
.fact-wrp{justify-content:space-between}
.section .eyebrow{letter-spacing:.18em;font-size:1rem;color:green;margin-bottom:10px}
.section.reveal.in h2{font-size:clamp(1.5rem,3.4vw,2.05rem);font-weight:700;margin-bottom:6px;color:#000}.rule{width:64px;height:4px;background:var(--accent);border-radius:3px;margin:16px 0}
.cat-group{margin-top:10px}
.group-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:6px}
.group-head h3{font-size:1.35rem;color:#000}
.tag-competitive,.tag-open{background:#0358a3;color:#fff}


.tag-pill{font-size:.72rem;letter-spacing:.06em;padding:4px 11px;border-radius:999px}
.section.reveal.in .btn{display:inline-block;background:green;color:#fff;border-radius:12px;padding:.7rem 1rem;font-weight:700}
.group-note{color:green;font-size:.95rem;max-width:820px;margin:8px 0 24px;padding-left:16px;border-left:3px solid #a7a7a7}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid #eef2f7;border-radius:14px;padding:24px 22px;transition:transform .2s,box-shadow .2s}
.card h4{font-size:1.08rem;color:var(--brand-dark);margin-bottom:8px}
.card p{color:#4a595f;font-size:.94rem}

.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.chip{font-size:.74rem;font-weight:500;color:#083c53;background:#eef4f6;border:1px solid #d6e5ea;border-radius:999px;padding:4px 11px}
.cat-group+.cat-group{margin-top:46px}
.reveal h2{color:#000}
.info-list{list-style:none;counter-reset:n;padding-left:0}
.info-list li{padding:12px 0 12px 44px;border-bottom:1px solid var(--line);color:#3d4b51;font-size:.98rem}
.info-list li::before{counter-increment:n;content:counter(n);position:absolute;left:0;top:12px;width:28px;height:28px;border-radius:8px;background:#0358a3;color:#fff;font-family:Poppins,sans-serif;
  font-weight:600;font-size:.85rem;display:flex;align-items:center;justify-content:center}
  .info-list li strong{color:#0c1323}
  .panel{background:#0358a3;color:#e9f2f5;border-radius:14px;padding:30px 28px}
.two-col{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:start}

.cta-band {
  color: #3d4b51;
  text-align: center;
  padding: 64px 0;
  position: relative;
  overflow: hidden;
}
.card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 4px;
  width: 100%;
  background: #0358a3;
  border-radius: 14px 14px 0 0;
}
.cta-band h2 {
  color: #000000;
  font-size: clamp(1.6rem,3.6vw,2.3rem);
  position: relative;
}

.cta-band p {
  max-width: 640px;
  margin: 14px auto 0;font-weight: 400;
  font-size: 15px;
  color: #3d4b51;
  position: relative;
}

.cta-band .btn-submit {
  display: inline-block;
  margin-top: 30px;
  background:#da601e;
  color: #ffffff;

  font-weight: 600;
  font-size: 1.05rem;
  padding: 16px 46px;
  border-radius: 10px;
  position: relative;
  box-shadow: 0 12px 26px rgba(200,160,78,.32);
  transition: transform .2s ease,background .2s ease;
}
.cta-sub a {
  color: #3d4b51;
  text-decoration: underline;
}


.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 34px rgba(10,55,75,.14);
}


.custom-pricing-table {
  font-size: 0.9rem;
  border-collapse: collapse;
}

/* Master Header Styling with Requested Hex Code */
.custom-pricing-table thead th {
  background-color: #093d7c !important;
  color: #ffffff !important;
  font-weight: 600;
  border: 1px solid rgba(255, 255, 255, 0.2);
  vertical-align: middle;
  padding: 12px 8px;
  width:250px;
}

/* Sub-Header Slab Identifiers Bar Layout */
.custom-pricing-table thead .slab-row th {
  background-color: #072e5d !important; /* Slightly darker shade for hierarchy split */
  font-size: 0.85rem;
  padding: 6px 4px;
}

/* Enforcing Zebra Stripes (Odd: White, Even: Light Grey) */
.custom-pricing-table tbody tr:nth-child(odd) {
  --bs-table-bg: #ffffff;
}

.custom-pricing-table tbody tr:nth-child(even) {
  --bs-table-bg: #f8f9fa; /* Clean Bootstrap-standard neutral light grey */
}

/* Secondary formatting tweaks for GST breakdown sub-rows */
.custom-pricing-table.table-striped > tbody > tr:nth-of-type(2n+1) > * {
  color: #8f8989;
  background:white;
}

.table>:not(caption)>*>* {
    background-color: #d3d3d3;
}

.custom-pricing-table .gst-row td {
  font-size: 0.82rem;
  color: #2f3032;
  font-weight: 500;
}

/* Highlight Column variation modifier option (Optional styling element matching source image) */
.custom-pricing-table thead th.header-highlight {
  background-color: #0c4fa1 !important;
}

/* Subtle separator focus treatment for international currency units block */
.custom-pricing-table .usd-section td {
  border-top: 2px dashed #093d7c;
  border-bottom: 2px dashed #093d7c;
}

.section__head h2, h3, h4 {
  color: #1C73AF;
}
.section__head h2 {
  font: 800 1.8rem/1 Inter;
  margin: 0;
}
.orgbtn {
    display: inline-block;
  background: #e9661f;
  color: #fff;
  border-radius: 12px;
  padding: .7rem 1rem;
  font-weight: 700;
}



.list-check{padding-left:0;list-style:none;margin-bottom: 0;}
.list-check li::before{content:'✔️';color:var(--primary-orange);margin-right:.5rem}
.light-bg{background:#f2fbff}
.registr-wrp .section{padding:3rem 0}
.registr-wrp #payment h3,.registr-wrp #payment h4{font-size:22px;font-weight:500}

#guidelines h3, #fees-includes h3 {font-size: 22px;}
.list-numbered a {color: #139321;}


@media (max-width:480px) {

div.subbanr-wrp .count-bnr {position: initial;}

}


@media (max-width:769px) {
.row-wrpp-mob.day-columres{flex-direction:column-reverse}

}


@media (max-width:992px) {
/* 28 aug 2026 00000000000000000000000000*/
.registr-wrp .section {
  padding: 1.5rem 0;
}
.sub-bnr-text {
  top: 29%;
  padding: 32px 33px;
}
.list-check li {
  margin-bottom: 12px;
  font-size: 14px;
}
  .reveal h2 {font-size: 26px;}
  .fact {width: 49%;margin-bottom: 9px;}
 .two-col {grid-template-columns: 1fr;gap: 8px;}

.abstract-wrp .section-tint {padding: 30px 12px;}

.cards {display: grid;padding: 12px;grid-template-columns: repeat(2,1fr);gap: 10px;}
.rule {margin: 3px 0;}
.dropdown .dropdown-menu {background-color: #196819;padding-left: 12px;}

/* 28 aug 2026 end 00000000000000000000000000*/

.submenu-arrow {
  display: inline-block;
  transition: transform 0.2s ease;
}
.submenu-arrow.rotate-90 {
  transform: rotate(90deg);
}
.dropdown-menu.show {
  display: block !important;
  position: relative !important;
  transform: translate3d(0px, -4px, 0px) !important;
}

.dropdown .dropdown-menu {  
  padding-right: 12px;
}
}

@media (max-width: 496px) {

     .count-bnr { position: inherit; }

}

.partners-card {
    width: 100%;
    background: #f6f6f6;
    border-radius: 18px;
    padding:28px 31px 28px 32px;
    display: flex;
    align-items: center;margin: 50px 0;
    gap: 0px;
    overflow: hidden;
  }

  .partners-title {
    flex: 0 0 auto;
    font-weight:600;
    font-size: 22px;
    line-height: 1.2;
    color: var(--text-dark);
    white-space: nowrap;
    padding-right: 24px;
  }

  .scroller {
    position: relative;
    flex: 1 1 auto;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(
      to right,
      transparent 0,
      #000 var(--fade-w),
      #000 calc(100% - var(--fade-w)),
      transparent 100%
    );
    mask-image: linear-gradient(
      to right,
      transparent 0,
      #000 var(--fade-w),
      #000 calc(100% - var(--fade-w)),
      transparent 100%
    );
  }

  .scroller-track {
    display: flex;
    align-items: center;
    width: max-content;
    animation: scroll 22s linear infinite;
  }

  .scroller:hover .scroller-track {
    animation-play-state: paused;
  }

  @keyframes scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }

  .logo-item {
    display: flex;
    align-items: center;
    gap:0px;
    padding: 0 3px;
    flex: 0 0 auto;
    opacity: 0.9;
  }

  .logo-item svg { flex: 0 0 auto; display: block; }

  .logo-item .logo-text {
    font-weight: 700;
    font-size: 17px;
    white-space: nowrap;
    letter-spacing: -0.2px;
  }

  .logo-item .logo-sub {
    display: flex;
    flex-direction: column;
    line-height: 1.05;
  }

  .logo-item .logo-sub .top {
    font-weight: 700;
    font-size: 15px;
  }
  .logo-item .logo-sub .bottom {
    font-weight: 700;
    font-size: 15px;
    text-transform: lowercase;
    letter-spacing: 0.5px;
  }

  @media (max-width: 640px) {
    .partners-card {
      padding: 22px 0 22px 20px;
      gap: 18px;
      border-radius: 14px;
    }
    .partners-title { font-size: 17px; padding-right: 12px; }
    .logo-item { padding: 0 22px; }
    .logo-item .logo-text, .logo-item .logo-sub .top, .logo-item .logo-sub .bottom { font-size: 13px; }
    .logo-item svg { transform: scale(0.85); }
  }

  @media (max-width:992px) {
    .partners-card {display: block;margin: 20px 0;}
  }



  /* ---==============AL3=================css==Starts here */

      /* =======odyssey-quote==== css starts here*/
      .odyssey-quote {
        position: relative !important;
      
        display: flex !important;
        align-items: center;
        justify-content: center;
      
        width: 100%;
        height: 50px;
        min-height: 50px;
      
        margin: 0 !important;
        padding: 0 !important;
      
        box-sizing: border-box;
      
        background:
          linear-gradient(
            90deg,
            #06151e 0%,
            #0a202a 45%,
            #0c2730 50%,
            #0a202a 55%,
            #06151e 100%
          );
      
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      
        overflow: hidden;
      
        isolation: isolate;
      
        z-index: 1;
      
        opacity: 1;
      
        transition:
          height 0.45s ease,
          min-height 0.45s ease,
          opacity 0.35s ease,
          transform 0.45s ease;
      }
      
      
      .odyssey-quote__glow {
        position: absolute;
      
        width: 520px;
        height: 220px;
      
        top: 50%;
        left: 50%;
      
        transform:
          translate(-50%, -50%);
      
        background:
          radial-gradient(
            ellipse,
            rgba(56, 216, 208, 0.13) 0%,
            rgba(56, 216, 208, 0.07) 28%,
            rgba(56, 216, 208, 0.025) 55%,
            transparent 75%
          );
      
        pointer-events: none;
      
        z-index: -1;
      
        animation:
          odysseyGlow 6s ease-in-out infinite;
      }
      
      
      .odyssey-quote__container {
        position: relative;
      
        width: 100%;
        max-width: 1380px;
      
        height: 64px;
        min-height: 64px;
      
        margin: 0 auto;
      
        padding: 0 70px;
      
        display: flex;
        align-items: center;
        justify-content: center;
      
        box-sizing: border-box;
      }
      
      
      .odyssey-quote__content {
        width: auto;
        max-width: calc(100% - 80px);
      
        display: flex;
        align-items: center;
        justify-content: center;
      
        min-width: 0;
      }
      
      
      .odyssey-quote__mark {
        flex: 0 0 auto;
      
        margin-right: 10px;
        margin-top: -5px;
      
        font-family:
        Georgia,
        "Times New Roman",
        serif;
      
        font-size: 42px;
      
        line-height: 1;
      
        font-weight: 400;
      
        color: #55d8d1;
      
        user-select: none;
      
        opacity: 0;
      
        animation:
          quoteMarkReveal 0.8s
          cubic-bezier(0.22, 1, 0.36, 1)
          0.15s forwards;
      }
      
      
      .odyssey-quote__main {
        display: flex;
      
        align-items: center;
        justify-content: center;
      
        flex-wrap: wrap;
      
        gap: 10px;
      
        min-width: 0;
      
        text-align: center;
      
        font-size: 14px;
      
        line-height: 1.4;
      
        letter-spacing: 0.02em;
      }
      
      
      .odyssey-quote__title {
        flex: 0 0 auto;
      
        color: #ffffff;
      
        font-size: 14px;
      
        font-weight: 650;
      
        letter-spacing: 0.035em;
      
        white-space: nowrap;
      
        opacity: 0;
      
        transform: translateY(10px);
      
        animation:
          quoteTitleReveal 0.8s
          cubic-bezier(0.22, 1, 0.36, 1)
          0.25s forwards;
      }
      
      
      .odyssey-quote__dash {
        flex: 0 0 auto;
      
        color: rgba(255, 255, 255, 0.3);
      
        opacity: 0;
      
        animation:
          quoteDashReveal 0.6s
          ease
          0.55s forwards;
      }
      
      
      
      .odyssey-quote__phrase {
        color: #ffffff;
      
        font-size: 14px;
      
        font-weight: 650;
      
        letter-spacing: 0.025em;
      
        white-space: nowrap;
      
        opacity: 0;
      
        transform: translateY(10px);
      
        animation:
          quotePhraseReveal 0.8s
          cubic-bezier(0.22, 1, 0.36, 1)
          0.65s forwards;
      }
      
      
      .odyssey-quote__phrase span {
        position: relative;
      
        color: #ffffff;
      
        font-weight: 500;
      
        transition:
          color 0.3s ease,
          text-shadow 0.3s ease;
      }
      
      
      .odyssey-quote__phrase b {
        margin: 0 4px;
      
        color: #55d8d1;
      
        font-weight: 700;
      
        transition:
          text-shadow 0.3s ease;
      }
      
      
      
      .odyssey-quote__main:hover
      .odyssey-quote__phrase span {
        color: #ffffff;
      
        text-shadow:
          0 0 12px rgba(85, 216, 209, 0.35);
      }
      
      
      .odyssey-quote__main:hover
      .odyssey-quote__phrase b {
        text-shadow:
          0 0 12px rgba(85, 216, 209, 0.55);
      }
      
      
      
      .odyssey-quote__phrase span::after {
        content: "";
      
        position: absolute;
      
        left: 0;
        bottom: -3px;
      
        width: 100%;
        height: 1px;
      
        background:
          linear-gradient(
            90deg,
            transparent,
            #55d8d1,
            transparent
          );
      
        transform:
          scaleX(0);
      
        transform-origin: center;
      
        opacity: 0;
      
        transition:
          transform 0.35s ease,
          opacity 0.35s ease;
      }
      
      
      .odyssey-quote__main:hover
      .odyssey-quote__phrase span::after {
        transform: scaleX(1);
      
        opacity: 0.6;
      }
      
      
      
      .odyssey-quote__close {
        position: absolute;
      
        top: 50%;
        right: 24px;
      
        width: 30px;
        height: 30px;
      
        padding: 0;
        margin: 0;
      
        transform:
          translateY(-50%);
      
        display: flex;
        align-items: center;
        justify-content: center;
      
        border:
          1px solid rgba(255, 255, 255, 0.12);
      
        border-radius: 50%;
      
        background:
          rgba(255, 255, 255, 0.045);
      
        cursor: pointer;
      
        appearance: none;
      
        z-index: 5;
      
        transition:
          background 0.3s ease,
          border-color 0.3s ease,
          transform 0.35s ease,
          box-shadow 0.3s ease;
      }
      
      
      .odyssey-quote__close:hover {
        background:
          rgba(85, 216, 209, 0.12);
      
        border-color:
          rgba(85, 216, 209, 0.4);
      
        transform:
          translateY(-50%)
          rotate(90deg);
      
        box-shadow:
          0 0 18px rgba(85, 216, 209, 0.12);
      }
      
      
      .odyssey-quote__close:focus-visible {
        outline:
          2px solid #55d8d1;
      
        outline-offset: 3px;
      }
      
      
      .odyssey-quote__close span {
        position: absolute;
      
        width: 11px;
        height: 1px;
      
        background:
          rgba(255, 255, 255, 0.78);
      
        border-radius: 10px;
      }
      
      
      .odyssey-quote__close span:first-child {
        transform: rotate(45deg);
      }
      
      
      .odyssey-quote__close span:last-child {
        transform: rotate(-45deg);
      }
      
      
      .odyssey-quote__progress {
        position: absolute;
      
        bottom: 0;
        left: 50%;
      
        width: 90px;
        height: 2px;
      
        transform:
          translateX(-50%);
      
        background:
          linear-gradient(
            90deg,
            transparent,
            rgba(85, 216, 209, 0.9),
            transparent
          );
      
        opacity: 0.65;
      
        animation:
          odysseyProgress 4s
          ease-in-out
          infinite;
      }
      
      
      
      .odyssey-quote.is-hidden {
        height: 0 !important;
      
        min-height: 0 !important;
      
        opacity: 0;
      
        transform:
          translateY(-12px);
      
        border-bottom-color:
          transparent;
      
        pointer-events: none;
      }
      
      
      @keyframes quoteMarkReveal {
      
        0% {
          opacity: 0;
      
          transform:
            translateX(-14px)
            scale(0.8);
        }
      
        100% {
          opacity: 1;
      
          transform:
            translateX(0)
            scale(1);
        }
      }
      
      
      @keyframes quoteTitleReveal {
      
        0% {
          opacity: 0;
      
          transform:
            translateY(10px);
        }
      
        100% {
          opacity: 1;
      
          transform:
            translateY(0);
        }
      }
      
      
      @keyframes quoteDashReveal {
      
        0% {
          opacity: 0;
        }
      
        100% {
          opacity: 1;
        }
      }
      
      
      @keyframes quotePhraseReveal {
      
        0% {
          opacity: 0;
      
          transform:
            translateY(10px);
        }
      
        100% {
          opacity: 1;
      
          transform:
            translateY(0);
        }
      }
      
      
      
      @keyframes odysseyGlow {
      
        0%,
        100% {
          opacity: 0.55;
      
          transform:
            translate(-50%, -50%)
            scale(0.92);
        }
      
        50% {
          opacity: 1;
      
          transform:
            translate(-50%, -50%)
            scale(1.08);
        }
      }
      
      
      
      @keyframes odysseyProgress {
      
        0% {
          opacity: 0.2;
      
          transform:
            translateX(-50%)
            scaleX(0.6);
        }
      
        50% {
          opacity: 0.85;
      
          transform:
            translateX(-50%)
            scaleX(1);
        }
      
        100% {
          opacity: 0.2;
      
          transform:
            translateX(-50%)
            scaleX(0.6);
        }
      }
      
      
      
      @media (max-width: 1200px) {
      
        .odyssey-quote__container {
          padding-left: 60px;
          padding-right: 60px;
        }
      
        .odyssey-quote__content {
          max-width: calc(100% - 60px);
        }
      
      }
      
      
      
      @media (max-width: 992px) {
      
        .odyssey-quote {
          height: 60px;
          min-height: 60px;
        }
      
        .odyssey-quote__container {
          height: 60px;
          min-height: 60px;
      
          padding-left: 50px;
          padding-right: 50px;
        }
      
        .odyssey-quote__mark {
          font-size: 36px;
      
          margin-right: 8px;
        }
      
        .odyssey-quote__main {
          gap: 8px;
        }
      
        .odyssey-quote__title {
          font-size: 13px;
        }
      
        .odyssey-quote__phrase {
          font-size: 12px;
        }
      
        .odyssey-quote__close {
          right: 18px;
      
          width: 28px;
          height: 28px;
        }
      
      }
      
      
      @media (max-width: 768px) {
      
        .odyssey-quote {
          height: auto;
          min-height: 62px;
        }
      
        .odyssey-quote__container {
          width: 100%;
      
          height: auto;
          min-height: 62px;
      
          padding:
            8px 48px 8px 35px;
      
          display: flex;
      
          align-items: center;
          justify-content: center;
        }
      
        .odyssey-quote__content {
          width: auto;
      
          max-width: 100%;
      
          justify-content: center;
        }
      
        .odyssey-quote__main {
          justify-content: center;
      
          text-align: center;
      
          gap: 3px 7px;
        }
      
        .odyssey-quote__mark {
          font-size: 30px;
      
          margin-right: 5px;
        }
      
        .odyssey-quote__title {
          width: 100%;
      
          font-size: 12px;
      
          white-space: normal;
        }
      
        .odyssey-quote__dash {
          display: none;
        }
      
        .odyssey-quote__phrase {
          display: block;
      
          width: 100%;
      
          font-size: 11px;
      
          white-space: normal;
        }
      
        .odyssey-quote__close {
          right: 15px;
      
          width: 26px;
          height: 26px;
        }
      
      }
      
      
      @media (max-width: 480px) {
      
        .odyssey-quote {
          min-height: 58px;
        }
      
        .odyssey-quote__container {
          min-height: 58px;
      
          padding:
            7px 42px 7px 28px;
        }
      
        .odyssey-quote__mark {
          font-size: 26px;
      
          margin-right: 4px;
        }
      
        .odyssey-quote__title {
          font-size: 11px;
        }
      
        .odyssey-quote__phrase {
          font-size: 10.5px;
        }
      
        .odyssey-quote__close {
          right: 10px;
      
          width: 24px;
          height: 24px;
        }
      
      }
      
      
      
      @media (max-width: 360px) {
      
        .odyssey-quote {
          min-height: 56px;
        }
      
        .odyssey-quote__container {
          min-height: 56px;
      
          padding:
            6px 38px 6px 23px;
        }
      
        .odyssey-quote__mark {
          font-size: 23px;
        }
      
        .odyssey-quote__title {
          font-size: 10.5px;
        }
      
        .odyssey-quote__phrase {
          font-size: 10px;
        }
      
        .odyssey-quote__close {
          right: 8px;
      
          width: 23px;
          height: 23px;
        }
      
      }
      
      
      
      @media (prefers-reduced-motion: reduce) {
      
        .odyssey-quote,
        .odyssey-quote__phrase span,
        .odyssey-quote__close {
          transition: none;
        }
      
        .odyssey-quote__glow,
        .odyssey-quote__progress,
        .odyssey-quote__mark,
        .odyssey-quote__title,
        .odyssey-quote__dash,
        .odyssey-quote__phrase {
          /* animation: both; */
      
          opacity: 1;
      
          transform: none;
        }
      
      } 
      /* =======odyssey-quote==== css end here*/

      /* ========route section=======css starts here */
 

:host {
  display: block;
  width: 100%;
}


.route-section {
  position: relative;

  width: 100%;

  padding: 100px 0;

  overflow: hidden;

  background:
    radial-gradient(
      circle at 5% 15%,
      rgba(25, 100, 126, 0.08),
      transparent 30%
    ),
    radial-gradient(
      circle at 95% 85%,
      rgba(14, 134, 143, 0.07),
      transparent 30%
    ),
    #f7fafc;
}



.route-section::before {
  content: "";

  position: absolute;

  width: 520px;
  height: 520px;

  top: -300px;
  right: -230px;

  border-radius: 50%;

  border: 1px solid rgba(25, 100, 126, 0.06);

  pointer-events: none;
}

.route-section::after {
  content: "";

  position: absolute;

  width: 400px;
  height: 400px;

  left: -220px;
  bottom: -260px;

  border-radius: 50%;

  border: 1px solid rgba(14, 134, 143, 0.06);

  pointer-events: none;
}



.route-container {
  position: relative;

  z-index: 2;

  width: 100%;
  max-width: 1320px;

  margin: 0 auto;

  padding: 0 24px;

  box-sizing: border-box;
}



.route-heading {
  max-width: 720px;

  margin: 0 auto 55px;

  text-align: center;
}



.route-eyebrow {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 9px;

  margin-bottom: 14px;

  font-size: 10px;

  line-height: 1;

  font-weight: 800;

  letter-spacing: 2.6px;

  text-transform: uppercase;

  color: #19647e;
}

.route-eyebrow::before,
.route-eyebrow::after {
  content: "";

  width: 25px;
  height: 1px;

  background: #19647e;

  opacity: 0.55;
}


.route-heading h2 {
  margin: 0;

  font-size: clamp(36px, 4vw, 52px);

  line-height: 1.08;

  font-weight: 500;

  letter-spacing: -1.8px;

  color: #102a43;
}

.route-heading h2 strong {
  font-weight: 800;

  background:
    linear-gradient(
      135deg,
      #19647e 0%,
      #0e868f 100%
    );

  -webkit-background-clip: text;
  background-clip: text;

  -webkit-text-fill-color: transparent;
}



.route-heading p {
  max-width: 540px;

  margin: 17px auto 0;

  font-size: 14px;

  line-height: 1.75;

  color: #71818c;
}



.route-layout {
  display: grid;

  grid-template-columns:
    minmax(0, 0.95fr)
    minmax(0, 1.05fr);

  gap: 45px;

  align-items: stretch;
}



.route-map {
  position: relative;

  width: 100%;

  min-height: 500px;

  overflow: hidden;

  border-radius: 30px;

  background: #e8eef1;

  border: 1px solid rgba(25, 100, 126, 0.12);

  box-shadow:
    0 25px 65px rgba(20, 55, 75, 0.10),
    0 8px 25px rgba(20, 55, 75, 0.04);

  isolation: isolate;
}



.route-map iframe {
  position: absolute;

  inset: 0;

  width: 100%;
  height: 100%;

  display: block;

  margin: 0;
  padding: 0;

  border: 0;

  background: #e8eef1;
}



.route-map::after {
  content: "";

  position: absolute;

  z-index: 2;

  top: 0;
  left: 0;
  right: 0;

  height: 160px;

  pointer-events: none;

  background:
    linear-gradient(
      to bottom,
      rgba(5, 31, 43, 0.30),
      rgba(5, 31, 43, 0)
    );
}



.route-map-overlay {
  position: absolute;

  z-index: 5;

  top: 20px;
  left: 20px;

  display: flex;

  align-items: center;

  gap: 12px;

  max-width: calc(100% - 40px);

  padding: 12px 16px;

  box-sizing: border-box;

  border-radius: 17px;

  background:
    rgba(255, 255, 255, 0.94);

  border: 1px solid rgba(255, 255, 255, 0.96);

  box-shadow:
    0 14px 38px rgba(20, 55, 70, 0.17);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}



.route-location-icon {
  position: relative;

  width: 39px;
  height: 39px;

  flex: 0 0 39px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 12px;

  background:
    linear-gradient(
      135deg,
      #19647e,
      #0e868f
    );

  box-shadow:
    0 8px 20px rgba(14, 134, 143, 0.25);
}



.route-location-icon::before {
  content: "";

  position: absolute;

  width: 15px;
  height: 15px;

  border-radius: 50%;

  border: 2px solid #fff;
}



.route-location-icon span {
  position: relative;

  z-index: 2;

  width: 5px;
  height: 5px;

  border-radius: 50%;

  background: #fff;
}



.route-location-content {
  min-width: 0;
}

.route-location-content strong {
  display: block;

  margin: 0;

  font-size: 12px;

  line-height: 1.35;

  font-weight: 800;

  color: #173b4d;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;
}

.route-location-content span {
  display: block;

  margin-top: 3px;

  font-size: 10px;

  line-height: 1.3;

  color: #82919a;
}



.route-directions {
  position: absolute;

  z-index: 6;

  right: 20px;
  bottom: 20px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 9px;

  padding: 9px 9px 9px 18px;

  border-radius: 50px;

  text-decoration: none;

  color: #fff;

  background:
    linear-gradient(
      135deg,
      #19647e 0%,
      #0e868f 100%
    );

  box-shadow:
    0 13px 32px rgba(15, 72, 87, 0.30);

  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.route-directions span {
  font-size: 11px;

  line-height: 1;

  font-weight: 700;

  white-space: nowrap;
}

.route-directions i {
  width: 28px;
  height: 28px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  font-size: 13px;

  font-style: normal;

  line-height: 1;

  background:
    rgba(255, 255, 255, 0.17);
}

.route-directions:hover {
  transform: translateY(-3px);

  box-shadow:
    0 18px 42px rgba(15, 72, 87, 0.38);
}




.route-details {
  display: flex;

  flex-direction: column;

  gap: 15px;

  width: 100%;

  min-width: 0;
}



.route-card {
  position: relative;

  display: grid;

  grid-template-columns:
    78px
    minmax(0, 1fr)
    35px;

  align-items: center;

  gap: 18px;

  width: 100%;

  padding: 15px 20px;

  box-sizing: border-box;

  border-radius: 21px;

  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.98),
      rgba(250, 253, 254, 0.95)
    );

  border: 1px solid #e3edf0;

  box-shadow:
    0 9px 30px rgba(25, 62, 80, 0.05);

  overflow: hidden;

  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.35s ease,
    border-color 0.35s ease;
}




.route-card::before {
  content: "";

  position: absolute;

  left: 0;

  top: 20px;
  bottom: 20px;

  width: 3px;

  border-radius: 0 5px 5px 0;

  background:
    linear-gradient(
      180deg,
      #19647e,
      #0e868f
    );

  opacity: 0;

  transform: scaleY(0.6);

  transition:
    opacity 0.3s ease,
    transform 0.3s ease;
}

.route-card:hover::before {
  opacity: 1;

  transform: scaleY(1);
}




.route-card:hover {
  transform: translateY(-4px);

  border-color:
    rgba(25, 100, 126, 0.18);

  box-shadow:
    0 20px 48px rgba(25, 75, 95, 0.10),
    0 5px 15px rgba(25, 75, 95, 0.035);
}




.route-icon {
  width: 78px;

  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;

  gap: 8px;

  padding: 9px 6px;

  box-sizing: border-box;

  border-radius: 17px;

  background:
    linear-gradient(
      145deg,
      #e8f6f7,
      #f5f9fa
    );

  border: 1px solid #dceff1;

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}



.route-icon img {
  display: block;

  width: 75px;
  height:55px;

  object-fit: cover;

  border-radius: 5px;

  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.route-card:hover .route-icon img {
  transform: translateY(-2px) scale(1.08);
}




.route-distance {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  min-width: 48px;

  padding: 4px 7px;

  box-sizing: border-box;

  border-radius: 50px;

  background: #fff;

  border: 1px solid #dceff1;

  font-size: 8px;

  line-height: 1;

  font-weight: 800;

  letter-spacing: 0.65px;

  white-space: nowrap;

  color: #19647e;

  box-shadow:
    0 3px 8px rgba(20, 70, 85, 0.06);
}




.route-card-content {
  min-width: 0;
}



.route-card-top {
  display: flex;

  align-items: center;

  gap: 9px;

  margin-bottom: 7px;
}

.route-number {
  font-size: 9px;

  line-height: 1;

  font-weight: 800;

  letter-spacing: 1px;

  color: #0e868f;
}

.route-label {
  position: relative;

  padding-left: 9px;

  font-size: 8px;

  line-height: 1;

  font-weight: 800;

  letter-spacing: 1.7px;

  color: #9aaab4;
}

.route-label::before {
  content: "";

  position: absolute;

  left: 0;

  top: 50%;

  width: 3px;
  height: 3px;

  border-radius: 50%;

  background: #b9c7cd;

  transform: translateY(-50%);
}



.route-card h3 {
  margin: 0;

  font-size: 17px;

  line-height: 1.4;

  font-weight: 750;

  letter-spacing: -0.2px;

  color: #183b4d;
}

.route-highlight {
  font-weight: 600;

  color: #718792;
}



.route-description {
  margin: 8px 0 0;

  font-size: 12px;

  line-height: 1.65;

  color: #788993;
}



.route-stations {
  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  margin-top: 11px;
}

.route-station {
  display: flex;

  align-items: center;

  gap: 7px;

  padding: 7px 10px;

  border-radius: 10px;

  background: #f5f9fa;

  border: 1px solid #e8f0f2;
}



.route-check {
  width: 17px;
  height: 17px;

  flex: 0 0 17px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #e4f5f5;

  font-size: 8px;

  line-height: 1;

  font-weight: 800;

  color: #0e868f;
}



.route-station strong {
  display: block;

  font-size: 10px;

  line-height: 1.3;

  font-weight: 750;

  color: #536c79;
}



.route-station small {
  display: block;

  margin-top: 2px;

  font-size: 8px;

  line-height: 1.3;

  color: #8a9aa3;
}




.route-arrow {
  width: 35px;
  height: 35px;

  flex: 0 0 35px;

  display: flex;

  align-items: center;
  justify-content: center;

  margin-left: auto;

  border-radius: 50%;

  background: #f1f7f8;

  color: #19647e;

  transition:
    background 0.3s ease,
    color 0.3s ease,
    transform 0.3s ease;
}

.route-arrow span {
  display: block;

  font-size: 15px;

  line-height: 1;
}

.route-card:hover .route-arrow {
  background:
    linear-gradient(
      135deg,
      #19647e,
      #0e868f
    );

  color: #fff;

  transform:
    translate(2px, -2px);
}



@media (max-width: 1200px) {

  .route-section {
    padding: 85px 0;
  }

  .route-container {
    padding: 0 22px;
  }

  .route-layout {
    gap: 30px;
  }

  .route-map {
    min-height: 530px;
  }

  .route-card {
    grid-template-columns:
      70px
      minmax(0, 1fr)
      34px;

    gap: 15px;

    padding: 18px;
  }

  .route-icon {
    width: 70px;
  }
}



@media (max-width: 992px) {

  .route-section {
    padding: 75px 0;
  }

  .route-heading {
    margin-bottom: 42px;
  }

  .route-layout {
    grid-template-columns: 1fr;

    gap: 28px;
  }

  .route-map {
    min-height: 450px;
  }

  .route-details {
    max-width: 900px;

    margin: 0 auto;
  }
}



@media (max-width: 768px) {

  .route-section {
    padding: 60px 0;
  }

  .route-container {
    padding: 0 18px;
  }

  .route-heading {
    margin-bottom: 35px;
  }

  .route-heading h2 {
    font-size: 38px;

    letter-spacing: -1.3px;
  }

  .route-heading p {
    font-size: 13px;
  }



  .route-map {
    min-height: 400px;

    border-radius: 24px;
  }



  .route-map-overlay {
    top: 15px;
    left: 15px;

    max-width: calc(100% - 30px);

    padding: 10px 13px;

    border-radius: 14px;
  }

  .route-location-icon {
    width: 34px;
    height: 34px;

    flex-basis: 34px;

    border-radius: 10px;
  }

  .route-location-content strong {
    font-size: 11px;
  }

  .route-location-content span {
    font-size: 9px;
  }



  .route-directions {
    right: 15px;
    bottom: 15px;

    padding: 9px 9px 9px 15px;
  }



  .route-card {
    grid-template-columns:
      62px
      minmax(0, 1fr)
      31px;

    gap: 13px;

    padding: 16px;
  }

  .route-icon {
    width: 62px;

    padding: 8px 5px;

    gap: 6px;

    border-radius: 14px;
  }

  .route-icon img {
    width: 26px;
    height: 26px;
  }

  .route-distance {
    min-width: 42px;

    padding: 4px 5px;

    font-size: 7px;
  }

  .route-card h3 {
    font-size: 15px;
  }

  .route-description {
    font-size: 11px;
  }

  .route-arrow {
    width: 31px;
    height: 31px;

    flex-basis: 31px;
  }
}



@media (max-width: 576px) {

  .route-section {
    padding: 50px 0;
  }

  .route-container {
    padding: 0 14px;
  }


  .route-heading {
    margin-bottom: 30px;
  }

  .route-eyebrow {
    gap: 7px;

    font-size: 8px;

    letter-spacing: 2px;
  }

  .route-eyebrow::before,
  .route-eyebrow::after {
    width: 18px;
  }

  .route-heading h2 {
    font-size: 31px;

    letter-spacing: -1.1px;
  }

  .route-heading p {
    margin-top: 11px;

    font-size: 12px;

    line-height: 1.65;
  }


  .route-map {
    min-height: 330px;

    border-radius: 20px;
  }

  .route-map::after {
    height: 105px;
  }


  .route-map-overlay {
    top: 10px;
    left: 10px;

    max-width: calc(100% - 20px);

    gap: 9px;

    padding: 9px 11px;

    border-radius: 12px;
  }

  .route-location-icon {
    width: 30px;
    height: 30px;

    flex-basis: 30px;

    border-radius: 9px;
  }

  .route-location-icon::before {
    width: 12px;
    height: 12px;

    border-width: 1.5px;
  }

  .route-location-content strong {
    font-size: 10px;
  }

  .route-location-content span {
    font-size: 8px;
  }



  .route-directions {
    right: 10px;
    bottom: 10px;

    gap: 7px;

    padding: 8px 8px 8px 13px;
  }

  .route-directions span {
    font-size: 9px;
  }

  .route-directions i {
    width: 23px;
    height: 23px;

    font-size: 11px;
  }



  .route-details {
    gap: 10px;
  }

  .route-card {
    grid-template-columns:
      55px
      minmax(0, 1fr)
      28px;

    gap: 11px;

    padding: 14px 12px;

    border-radius: 16px;
  }

  .route-icon {
    width: 55px;

    padding: 7px 4px;

    gap: 5px;

    border-radius: 12px;
  }

  .route-icon img {
    width: 23px;
    height: 23px;
  }

  .route-distance {
    min-width: 38px;

    padding: 3px 4px;

    font-size: 6.5px;

    letter-spacing: 0.5px;
  }



  .route-card-top {
    gap: 7px;

    margin-bottom: 4px;
  }

  .route-number {
    font-size: 7px;
  }

  .route-label {
    padding-left: 7px;

    font-size: 6.5px;

    letter-spacing: 1.2px;
  }



  .route-card h3 {
    font-size: 12.5px;

    line-height: 1.35;
  }



  .route-description {
    margin-top: 6px;

    font-size: 9.5px;

    line-height: 1.55;
  }



  .route-stations {
    gap: 5px;

    margin-top: 8px;
  }

  .route-station {
    gap: 5px;

    padding: 5px 7px;

    border-radius: 8px;
  }

  .route-check {
    width: 14px;
    height: 14px;

    flex-basis: 14px;

    font-size: 7px;
  }

  .route-station strong {
    font-size: 8.5px;
  }

  .route-station small {
    font-size: 7px;
  }



  .route-arrow {
    width: 28px;
    height: 28px;

    flex-basis: 28px;
  }

  .route-arrow span {
    font-size: 11px;
  }
}



@media (max-width: 430px) {

  .route-section {
    padding: 42px 0;
  }

  .route-container {
    padding: 0 11px;
  }



  .route-map {
    min-height: 290px;

    border-radius: 18px;
  }



  .route-card {
    grid-template-columns:
      50px
      minmax(0, 1fr)
      26px;

    gap: 9px;

    padding: 12px 10px;

    border-radius: 14px;
  }

  .route-icon {
    width: 50px;

    padding: 6px 4px;

    border-radius: 10px;
  }

  .route-icon img {
    width: 21px;
    height: 21px;
  }

  .route-distance {
    min-width: 35px;

    padding: 3px 4px;

    font-size: 6px;
  }

  .route-card h3 {
    font-size: 11.5px;
  }

  .route-description {
    font-size: 8.5px;
  }

  .route-arrow {
    width: 26px;
    height: 26px;

    flex-basis: 26px;
  }

  .route-station {
    width: 100%;

    box-sizing: border-box;
  }
}



@media (max-width: 380px) {

  .route-section {
    padding: 38px 0;
  }

  .route-container {
    padding: 0 9px;
  }

  .route-heading h2 {
    font-size: 28px;
  }

  .route-heading p {
    font-size: 11px;
  }



  .route-map {
    min-height: 260px;

    border-radius: 16px;
  }



  .route-map-overlay {
    top: 8px;
    left: 8px;

    gap: 7px;

    padding: 8px 9px;

    border-radius: 10px;
  }

  .route-location-icon {
    width: 27px;
    height: 27px;

    flex-basis: 27px;

    border-radius: 8px;
  }

  .route-location-content strong {
    font-size: 9px;
  }

  .route-location-content span {
    font-size: 7px;
  }



  .route-directions {
    right: 8px;
    bottom: 8px;

    padding: 7px 7px 7px 11px;
  }

  .route-directions span {
    font-size: 8px;
  }

  .route-directions i {
    width: 21px;
    height: 21px;

    font-size: 10px;
  }



  .route-card {
    grid-template-columns:
      46px
      minmax(0, 1fr)
      24px;

    gap: 8px;

    padding: 11px 8px;
  }

  .route-icon {
    width: 46px;

    padding: 6px 3px;
  }

  .route-icon img {
    width: 19px;
    height: 19px;
  }

  .route-distance {
    min-width: 32px;

    padding: 3px;

    font-size: 5.5px;
  }

  .route-card h3 {
    font-size: 11px;
  }

  .route-description {
    font-size: 8px;

    line-height: 1.5;
  }

  .route-arrow {
    width: 24px;
    height: 24px;

    flex-basis: 24px;
  }

  .route-arrow span {
    font-size: 10px;
  }
}



@media (hover: none) {

  .route-card:hover {
    transform: none;
  }

  .route-card:hover .route-icon img {
    transform: none;
  }

  .route-card:hover .route-arrow {
    transform: none;
  }

  .route-card:hover::before {
    opacity: 0;
  }

  .route-directions:hover {
    transform: none;
  }
}



@media (prefers-reduced-motion: reduce) {

  .route-card,
  .route-icon img,
  .route-arrow,
  .route-directions,
  .route-card::before {
    transition: none !important;
  }

  .route-card:hover,
  .route-card:hover .route-icon img,
  .route-card:hover .route-arrow,
  .route-directions:hover {
    transform: none !important;
  }
}  

      /* ========route section =======css end here */
      








  
      /* ======back2top==== css starts here===== */
  

.backtop {
  position: fixed;

  right: 28px;
  bottom: 28px;

  width: 62px;
  height: 62px;

  padding: 6px;

  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: 18px;

  background: rgba(255, 255, 255, .82);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  box-shadow:
      0 15px 40px rgba(18, 43, 67, .13),
      0 3px 12px rgba(18, 43, 67, .07);

  display: flex;
  align-items: center;

  cursor: pointer;

  color: #175baa;

  opacity: 0;
  visibility: hidden;

  transform: translateY(20px);

  transition:
      opacity .35s ease,
      visibility .35s ease,
      transform .45s cubic-bezier(.16, 1, .3, 1),
      width .45s cubic-bezier(.16, 1, .3, 1),
      border-radius .35s ease,
      box-shadow .35s ease;

  z-index: 9999;

  overflow: hidden;
}



.backtop.is-visible {
  opacity: 1;
  visibility: visible;

  transform: translateY(0);
}



.backtop__icon-wrap {
  position: relative;

  flex: 0 0 50px;

  width: 50px;
  height: 50px;

  display: flex;
  align-items: center;
  justify-content: center;

  z-index: 2;
}



.backtop__icon {
  width: 30px;
  height: 30px;

  border-radius: 11px;

  background:
      linear-gradient(
          135deg,
          #175baa 0%,
          #0e868f 100%
      );

  display: flex;
  align-items: center;
  justify-content: center;

  color: #fff;

  transition:
      transform .4s cubic-bezier(.16, 1, .3, 1),
      border-radius .3s ease;
}


.backtop__icon svg {
  width: 17px;
  height: 17px;

  fill: none;

  stroke: currentColor;
  stroke-width: 1.8;

  stroke-linecap: round;
  stroke-linejoin: round;

  transition: transform .35s ease;
}



.backtop__ring {
  position: absolute;

  inset: 0;

  width: 50px;
  height: 50px;

  transform: rotate(-90deg);

  pointer-events: none;
}


.backtop__ring-bg,
.backtop__ring-progress {
  fill: none;
}


.backtop__ring-bg {
  stroke: rgba(23, 91, 170, .10);

  stroke-width: 2;
}


.backtop__ring-progress {
  stroke: #175baa;

  stroke-width: 2.5;

  stroke-linecap: round;

  stroke-dasharray: 289;

  stroke-dashoffset: 289;

  transition:
      stroke-dashoffset .12s linear;
}



.backtop__content {
  min-width: 0;

  width: 0;

  opacity: 0;

  display: flex;
  flex-direction: column;

  overflow: hidden;

  white-space: nowrap;

  margin-left: 0;

  transition:
      width .4s cubic-bezier(.16, 1, .3, 1),
      margin-left .35s ease,
      opacity .25s ease;
}


.backtop__label {
  font-size: 12px;
  line-height: 1.2;

  font-weight: 700;

  color: #15283b;
}


.backtop__percent {
  margin-top: 3px;

  font-family:
      Inter,
      Arial,
      sans-serif;

  font-size: 10px;
  line-height: 1;

  font-weight: 600;

  color: #75879a;
}




@media (min-width: 601px) {

  .backtop:hover {

      width: 172px;

      border-radius: 18px;

      box-shadow:
          0 20px 50px rgba(18, 43, 67, .18),
          0 5px 15px rgba(18, 43, 67, .08);
  }


  .backtop:hover .backtop__icon {
      transform: translateY(-1px);
  }


  .backtop:hover .backtop__icon svg {
      transform: translateY(-2px);
  }


  .backtop:hover .backtop__content {

      width: 95px;

      margin-left: 9px;

      opacity: 1;
  }
}




.backtop::after {
  content: "";

  position: absolute;

  top: -80%;
  left: -100%;

  width: 55%;
  height: 260%;

  background:
      linear-gradient(
          90deg,
          transparent,
          rgba(255, 255, 255, .55),
          transparent
      );

  transform: rotate(25deg);

  transition: left .7s ease;

  pointer-events: none;

  z-index: 5;
}


.backtop:hover::after {
  left: 150%;
}




.backtop:active {
  transform:
      translateY(2px)
      scale(.97);
}




.backtop:focus-visible {
  outline: 3px solid rgba(23, 91, 170, .2);

  outline-offset: 4px;
}




@media (max-width: 992px) {

  .backtop {

      right: 22px;
      bottom: 22px;

      width: 58px;
      height: 58px;
  }


  .backtop__icon-wrap {

      flex-basis: 46px;

      width: 46px;
      height: 46px;
  }


  .backtop__icon {

      width: 30px;
      height: 30px;
  }


  .backtop__ring {

      width: 46px;
      height: 46px;
  }
}




@media (max-width: 600px) {

  .backtop {

      right: 16px;
      bottom: 16px;

      width: 52px;
      height: 52px;

      padding: 5px;

      border-radius: 16px;
  }


  .backtop__icon-wrap {

      flex-basis: 42px;

      width: 42px;
      height: 42px;
  }


  .backtop__icon {

      width: 32px;
      height: 32px;

      border-radius: 10px;
  }


  .backtop__icon svg {

      width: 16px;
      height: 16px;
  }


  .backtop__ring {

      width: 42px;
      height: 42px;
  }




  .backtop:hover {

      width: 52px;

      border-radius: 16px;
  }


  .backtop:hover .backtop__content {

      width: 0;

      margin-left: 0;

      opacity: 0;
  }


  .backtop:hover .backtop__icon {

      transform: none;
  }


  .backtop:hover .backtop__icon svg {

      transform: none;
  }
}




@media (max-width: 380px) {

  .backtop {

      right: 12px;
      bottom: 12px;

      width: 48px;
      height: 48px;

      border-radius: 14px;
  }


  .backtop__icon-wrap {

      flex-basis: 38px;

      width: 38px;
      height: 38px;
  }


  .backtop__icon {

      width: 29px;
      height: 29px;

      border-radius: 9px;
  }


  .backtop__ring {

      width: 38px;
      height: 38px;
  }
}



@media (prefers-reduced-motion: reduce) {

  .backtop,
  .backtop *,
  .backtop::after {

      transition: none !important;
  }
}
            
      /* ======back2top=== css here here===== */

    /* ---==============AL3=================css==end here */