:root {
    --off-white: #F0FFFF;
    --white-off: #dedede;
    --dark: /*#464646*/#136b36;
    --light: #fbda1e;
    --charcoal: rgb(54, 69, 79);
    --accent: rgb(69,25,17);
    --home: rgb(51,51,51);
    --goa: rgb(27,70,86);
    --ladakh: rgb(69,25,17);
    --mussoorie: rgb(48,60,37);
    --manali: rgb(30,43,84);
    --am-hotel: rgb(173,181,142);
    --am-brand: rgb(87,75,67);
    --am-dots: #d2ae74;
}
@font-face { font-family: 'Merienda'; src: url('fonts/Merienda.woff'); font-display: swap; }
@font-face { font-family: 'Merienda'; src: url('fonts/Melodrama-Medium.woff'); src: url('fonts/Melodrama-Medium.woff'); font-display: swap; }
@font-face { font-family: 'Merienda - Eduardo Tunni'; src: url('fonts/Montserrat.woff'); font-display: swap; }
* {
    scroll-behavior: smooth;
}
body { padding: 0; margin: 0; letter-spacing: 0.4px; }
::-webkit-scrollbar { display: none; }
main {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
a { font-size: 0.9rem; text-decoration: none; color: light-dark(#121212, #fAFAFA);
    &.underline { text-decoration: underline; text-underline-offset: 4px; }
}
button, .button { padding: 8px 24px; text-transform: uppercase; }
.round-btn { border-radius: 999px; }
.outline-btn { display: block; border: 1px solid; border-radius: 9999px; padding: 16px 24px; font-size: clamp(.625rem,calc(.17361vw + 8.88889px),.75rem); min-width: 232px; color: #000; }
.outline-btn:hover { background-color: #000; color: #fff; }
.outline-dark-btn { display: block; border: 1px solid; border-radius: 9999px; padding: 16px 24px; font-size: clamp(.625rem,calc(.17361vw + 8.88889px),.75rem); color: var(--dark); }
.outline-dark-btn:hover { background-color: var(--dark); color: var(--light); }
.cover { overflow: clip; }
.cover video { animation: hero-fade-out linear; animation-timeline: view(); animation-range: exit; }
img { max-width: 100%; max-height: 100%; }
img.rounded { border-radius: 4px; }
.half-width { max-width: 50%; }
.site__header__logo img { max-width: 150px; height: auto; }
/** Footer Styles **/
footer {
    padding-top: 0px;
    h3 { margin: 1em 2em; font-weight: 300}
    a { line-height: 2; }
    a { color: var(--dark); }
.dfvv{ color:#fff; text-align:center;}
}
.copy { font-size: 0.9em; }
.pos__relative { position: relative; }
.rhgModal { display:none; position: fixed; top: 0px; max-height: 100vh; overflow: auto; width: -webkit-fill-available; z-index:5; }
.popup:hover { box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px; }
.popup, #dynamic-gallery, .tagFilter, .teampopup, .scrll, .close { cursor: pointer }
.scrll { position: absolute; top: 32%; transform: translateY(-32%); z-index: 2; padding: .6rem 1rem .72rem; border-radius: 50%; color: var(--off-white); background-color: rgba(18,18,18,1); transition: .4s all ease-out;
    &.rght { right: 20px; }
    &.lft { left: 20px; }
    &:hover { font-size: clamp(.725rem,calc(.27361vw + 8.88889px),1.24rem); }
}
.bxshdw { box-shadow: rgba(255, 255, 255, 0.35) 0px 5px 15px; }
.accordion { background-color: var(--light); color: #444; cursor: pointer; padding: 18px 0; width: 100%; text-align: left; border: none; outline: none; transition: 0.2s ease-out; }
.accordion:after { content:'+';float: right;}
.active:after { content:'-';float: right;}
.fl-right { float: right; }
.panel { padding: 0; background-color: white; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; }
/** Layouts **/
[popover]::backdrop {
    background-color: rgba(18,18,18,0.9);
}
row { display: flex; }
row::-webkit-scrollbar { display: none; }
.ovrflw { overflow: hidden; cursor: move; }
row.gap-1 { gap: 1rem; }
row.gap-2 { gap: 2rem; }
row.gap-3 { gap: 3rem; }
row.gap-4 { gap: 4rem; }
row.gap-5 { gap: 5rem; }
row.wrapper { flex-wrap: wrap; }
.col-stretch { align-content: stretch; }
.al-center { align-content: center; }
.row { display: inline-flex; gap: 2rem; }
.align-c { align-items: center; }
.spread-content { justify-content: space-around; }
.space-content { justify-content: space-between; }
.dbase { align-items: baseline; }
.centered { justify-content: center; }
.vr-mid { vertical-align: middle; }
.text-center { text-align: center; }
.item>* { margin: 1rem; text-align: center; text-transform: uppercase; }
.t-display { display: table; width: 100%; }
.t-display>.cell { display: table-cell; padding: 0px 2rem;}

/** Typography **/
body, ul, li, a, p { font-family: "Poppins", sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: "Montserrat", serif; }
h2 { font-size: 1.8rem; }
.brand-name { font-family: Montserrat; }
p { line-height: 1.6;}
a.under { text-decoration: underline; text-underline-offset: 4px; }
ul { list-style: none;
    &.inline>li { display: inline; padding: 0 .5rem; }
}
input, button, textarea, select { font: inherit; }
input[type=submit] { cursor: pointer; }
.title { align-content: baseline; align-items: flex-end; margin-bottom: 1rem; }
.title h2, .title h1 { font-size: 3rem; font-weight: 500; margin-block-end: 0; }
.after-title span svg { max-width: 45px; height: 45px; }
blockquote { font-size: 2em; line-height: 1.5; }
.small { font-size: .8rem; font-weight: 300; }
.upcase { text-transform: uppercase; }

/** Colors **/
.light { color: var(--light); fill: var(--light);}
.dark { color: light-dark(var(--dark), var(--light)); }
.dark1 { color:#d91d24;font-size: 20px; }
.light-bg { background-color: #EEE; color: var(--dark); }
.dark-bg { background-color: var(--dark); color: var(--off-white); }
.dark-bgb { background-color: #d91d24; color: var(--off-white); }
.dark-bgblack { background-color:#000000eb; color: var(--off-white); }
.dark-bga { background-color: rgba(0,0,0,0.6); color: var(--off-white); }
.gradient-bg { background: linear-gradient(180deg, rgba(18,18,18,.9) 0%, rgba(18,18,18,1) 100%); }
.off-white-bg { background-color: var(--off-white); }
.off-white { color: var(--off-white); }
.bg-offwhite { background-color: var(--white-off); }

/** Form Styles **/
#site-form {
    .form-group {
        position: relative;
    }

    .form-group input {
        width: 100%;
        padding: 10px 0;
        font-size: 16px;
        margin-bottom: 30px;
        border: none;
        border-bottom: 1px solid #121212;
        outline: none;
        background: transparent;
    }
    .form-group label {
        position: absolute;
        top:0;
        left: 0;
        padding: 10px 0;
        font-size: 16px;
        pointer-events: none;
        transition: .5s;
    }

    .form-group input:focus ~ label,
    .form-group input:valid ~ label,
    textarea:focus-visible ~ label {
        top: -20px;
        left: 0;
        font-size: 12px;
    }

    form a {
        position: relative;
        display: inline-block;
        padding: 10px 20px;
        font-size: 16px;
        text-decoration: none;
        text-transform: uppercase;
        overflow: hidden;
        transition: .5s;
        margin-top: 40px;
        letter-spacing: 4px
    }

    textarea { min-height: 120px; width: 100%; border: none; border-bottom: 1px solid #121212; }
    textarea:focus-visible { outline: none; }
	
	

	
	
}
#whatsapp { position: fixed;z-index: 6; bottom: 24px; right: 24px;padding: 0.3rem;border-radius: 10%; }
.grecaptcha-badge { visibility: hidden !important; }

/** Desktop Only Styles **/
@media screen and (min-width: 780px) {
    .dt-hidden { display: none; }

    #booking_bar { position: sticky; top:0; background-color: var(--light); z-index: 4; }
    div#quickbook-widget .MbsSearchWidget { max-width: 100vw !important; }

    main { padding: 0 3.2rem; overflow: hidden; }
    .col { flex: 1; }
    .col-2 { flex: 2; }
    .h-width { max-width: 50%; margin: 0 auto; }
    .wide { max-width: 76vw; margin: 0 auto; }
    .boxed { max-width: 72vw; min-height: 25vh; margin: 0 auto; border-radius: 4px; }
    .boxed>* { max-width: 40ch; font-size: 1.2rem; }
    .spacer { min-height: 20vh; }
    .mb-carousel:after { content: ''; }
    .dk-centered { justify-content: center; }

    /** Paddings & Margins **/
    .p-1 {padding: 1rem; }
    .p-2 {padding: 2rem; }
    .p-3 {padding: 3rem; }
    .p-4 {padding: 4rem; }
    .p-5 {padding: 5rem; }
    .py-1 { padding: 1rem 0; }
    .py-2 { padding: 2rem 0; }
    .py-3 { padding: 3rem 0; }
    .py-4 { padding: 4rem 0; }
    .py-5 { padding: 5rem 0; }
    .px-1 { padding: 0 1rem; }
    .px-2 { padding: 0 2rem; }
    .px-3 { padding: 0 3rem; }
    .px-4 { padding: 0 4rem; }
    .px-5 { padding: 0 5rem; }
    .py-5 { padding: 5rem 0; }
    .pt-1 { padding-top: 1rem; }
    .pt-4 { padding-top: 4rem; }
    .pt-5 { padding-top: 5rem; }
    .pb-1 { padding-bottom: 1rem; }
    .pb-2 { padding-bottom: 2rem; }
    .pb-3 { padding-bottom: 3rem; }
    .pb-4 { padding-bottom: 4rem; }
    .pb-5 { padding-bottom: 5rem; }
	.p-7 {padding: 6rem; }
	 .p-8 {padding: 1rem;}
    .m-0 { margin: 0rem; }
    .m-1 { margin: 1rem; }
    .m-2 { margin: 2rem; }
    .m-3 { margin: 3rem; }
    .m-4 { margin: 4rem; }
    .m-5 { margin: 5rem; }
    .mt-1 { margin: 1rem 0 0 0; }
    .mt-2 { margin: 2rem 0 0 0; }
    .mt-3 { margin: 3rem 0 0 0; }
    .mt-4 { margin: 4rem 0 0 0; }
    .mt-5 { margin: 5rem 0 0 0; }
    .my-1 { margin: 1rem 0; }
    .my-2 { margin: 2rem 0; }
    .my-3 { margin: 3rem 0; }
    .my-4 { margin: 4rem 0; }
    .my-5 { margin: 5rem 0; }
    .mx-1 { margin: 0 1rem; }
    .mx-2 { margin: 0 2rem; }
    .mx-3 { margin: 0 3rem; }
    .mx-4 { margin: 0 4rem; }
    #hotel__gallery {
        img { width: 50%; height: 100%; max-height: 50vw; }
    }
    .gallery__modal>.container {
        position: relative;
        .scrll { top: 50%; }
    }
}

/** Mobile Only Styles **/
@media screen and (max-width: 780px) {
    main>*:not(:first-child) { padding: 0 1rem; }
    row, .row { flex-wrap: wrap;}
    .mb-centered { justify-content: center; }
    .wide { max-width: 90vw; margin: 0 auto; }
    .mb-hidden { display: none;}
    .mgap-1 { gap: 1rem; }
    .mp-1 {padding: 1rem; }
    .mp-2 {padding: 2rem; }
    .mp-3 {padding: 3rem; }
    .mp-4 {padding: 4rem; }
    .mp-5 {padding: 5rem; }
    .mpy-1 {padding: 1rem 0; }
    .mpy-2 {padding: 2rem 0; }
    .mpy-3 {padding: 3rem 0; }
    .mpy-4 {padding: 4rem 0; }
    .mpy-5 {padding: 5rem 0; }
    .mpx-1 {padding: 0 1rem; }
    .mpx-2 {padding: 0 2rem; }
    .mpx-3 {padding: 0 3rem; }
    .mpx-4 {padding: 0 4rem; }
    .mpx-5 {padding: 0 5rem; }
    .m-0 { margin: 0rem; }
    .m-rtl { flex-direction: column-reverse;}
.ab{ float:left;}
.cd{ float:right;}
    h2 { font-size: 1.2rem; }
    .mb-carousel {
        >* { width: 100%; }
        .flickity-page-dots .dot { background-color: transparent; }
    }
    .mb-carousel:after { content: 'flickity'; display: none; /* hide :after */ }
    .scrll { display: none; }

    #hotel__gallery {
        padding-top: 200px;
        img { width: 90%; max-height: 100%; }
    }
    #whatsapp { bottom: 72px; right: 40px; }
}

/** Animations **/
@media (min-width: 780px) and (prefers-reduced-motion: no-preference) {
    .chat_widget_icon {
        scale: 0.1;
        translate: 100% 0;
        rotate: -90deg;
        animation: transformer 2s ease-in forwards;
        animation-delay: 2s;
    }

    @keyframes transformer {
        to {
            scale: 1;
            opacity: 1;
            translate: 0;
            rotate: 0deg;
        }
    }

    .scroll-watcher {
        height: 4px;
        position: fixed;
        top:0;
        z-index: 1000;
        background-color: red;
        width: 100%;
        scale: 0 1;
        transform-origin: left;
        animation: scroll-watcher linear;
        animation-timeline: scroll();
    }

    .img-fade-in {
        animation: img-fade-in linear forwards;
        animation-timeline: view();
        animation-range: entry;
        scale: 0.75;
    }

    .on-top {
        opacity: 0;
        animation: 3s on-top;
        animation-timeline: view(200px 90%);
    }

    .entry-rtl {
        animation: revealing;
        animation-timeline: view(block);
        animation-range: cover 0% cover 50%;
        margin: 0px;
      }
      @keyframes revealing {
        from {
          color: gray;
          margin-left: 100vw;
          filter: blur(50px);
          opacity: 0.5;
        }
        to {
          margin: 0px;
          filter: blur(0px);
          opacity: 1;
        }
      }

    @keyframes scroll-watcher {
        to { scale: 1 1; }
    }

    @keyframes hero-fade-out {
        to { scale: 2; }
    }

    @keyframes img-fade-in {
        to { scale: 1; }
    }

    @keyframes on-top {
        to { opacity: 1; }
    }
}

.ttl{font-size: 28px;
    font-weight: 500; text-align:center;}	
	
	.dding {
        background-size: cover;
		background-image:url(../images/hotels/dining.jpg);}
		.container_overlay {
        height: 100%;
        width: 100%;
        background: rgba(0, 0, 0, 0.4);
    }
	
	.lakeding {
        background-size: cover;
		background-image:url(../images/hotels/lakedininig.jpg);}
		.container_overlay {
        height: 100%;
        width: 100%;
        background: rgba(0, 0, 0, 0.4);
    }
	
.lddng {
        background-size: cover;
		background-image:url(../images/hotels/lddng.jpg);}
		.container_overlay {
        height: 100%;
        width: 100%;
        background: rgba(0, 0, 0, 0.4);
    }
.pd{ padding:15px; background-color: #fbfafa;}
.brudtii{ font-size:35px;}

.floating-buttons {
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  z-index: 1000;
}

.floating-buttons a.whatsapp {
  background: #25D366;
}
.floating-buttons a {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 24px;
  text-decoration: none;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.floating-buttons a.call {
  background: #007bff;
}
.floating-buttons i {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 24px;
  text-decoration: none;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.mrgleft {
  margin-right: 30px;
  float: left;
}
.ttxcntr{ text-align:center;}
.tck{ margin-right:5px;}
.hddng{ background-image:url(../images/hotels/hdining.jpg); background-repeat:no-repeat; background-size:cover; min-height:550px;}
.hrestroo{ background-image:url(../images/hotels/hresto.jpg); background-repeat:no-repeat; background-size:cover; min-height:550px;}
.wht{ color:#fff;}
.mnlddng{ background-image:url(../images/hotels/mnldnng.jpg); background-repeat:no-repeat; background-size:cover; min-height:550px;}
.mnlrestroo{ background-image:url(../images/hotels/mnlkresto.jpg); background-repeat:no-repeat; background-size:cover; min-height:550px;}
.kddng{ background-image:url(../images/hotels/kddngpic.jpg); background-repeat:no-repeat; background-size:cover; min-height:550px;}
.kdresto{ background-image:url(../images/hotels/kdrestropic.jpg); background-repeat:no-repeat; background-size:cover; min-height:550px;}