/* =========================================================
   CLIFF VIEW AYURVEDA RETREAT
   TARIFF / STAY & RATES PAGE
========================================================= */


/* =========================================================
   HERO
========================================================= */

.tariff-hero{
    min-height:380px;
    display:flex;
    align-items:center;
    position:relative;
    background:
        url("../images/about-hero.jpg") center/cover no-repeat;
}

.tariff-hero-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(24,51,41,.9),
            rgba(24,51,41,.55)
        );
}

.tariff-hero-content{
    position:relative;
    z-index:2;
    max-width:760px;
    padding-top:20px;
}

.tariff-hero-content h1{
    font-family:var(--heading);
    font-size:52px;
    line-height:1.2;
    color:#fff;
    margin:20px 0;
}

.tariff-hero-content h1::after{
    content:"";
    display:block;
    width:80px;
    height:2px;
    background:var(--secondary);
    margin-top:20px;
}

.tariff-hero-content p{
    color:rgba(255,255,255,.82);
    line-height:1.8;
    max-width:650px;
}

.tariff-breadcrumb{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:0;
    color:rgba(255,255,255,.85);
}

.tariff-breadcrumb a{
    color:#fff;
    font-weight:600;
    text-decoration:none;
}

.tariff-breadcrumb a:hover{
    color:var(--secondary);
}

.tariff-breadcrumb i{
    font-size:11px;
    color:rgba(255,255,255,.55);
}

/* =========================================================
   STICKY DOWNLOAD PDF BUTTON
========================================================= */
.tariff-sticky-download{
    position:fixed;
    /* Sits above the site's floating WhatsApp + scroll-to-top
       buttons (bottom:30px / bottom:100px) so nothing overlaps */
    right:30px;
    bottom:185px;
    z-index:998;
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px 26px;
    border:none;
    border-radius:60px;
    background:linear-gradient(135deg, var(--secondary), #a9803f);
    color:#fff;
    font-family:var(--body);
    font-size:15px;
    font-weight:600;
    letter-spacing:.3px;
    cursor:pointer;
    box-shadow:0 12px 30px rgba(24,51,41,.28);
    overflow:visible;
    opacity:0;
    visibility:hidden;
    transform:translateY(30px) scale(.9);
    transition:opacity .4s ease, transform .4s ease, visibility .4s, box-shadow .3s ease, background .3s ease;
}

.tariff-sticky-download.is-visible{
    opacity:1;
    visibility:visible;
    transform:translateY(0) scale(1);
    animation:tariffDownloadBounceIn .6s ease;
}

.tariff-sticky-download:hover{
    background:linear-gradient(135deg, #a9803f, var(--secondary));
    box-shadow:0 16px 36px rgba(24,51,41,.4);
    transform:translateY(-4px) scale(1.04);
}

.tariff-sticky-download-icon{
    font-size:18px;
    position:relative;
    z-index:2;
}

.tariff-sticky-download-text{
    position:relative;
    z-index:2;
    white-space:nowrap;
}

.tariff-sticky-download:disabled,
.tariff-sticky-download.is-loading{
    opacity:.85;
    cursor:not-allowed;
    transform:translateY(0) scale(1);
}

/* ---------- Soft pulsing ring ---------- */
.tariff-sticky-download-pulse{
    position:absolute;
    inset:0;
    border-radius:60px;
    background:var(--secondary);
    opacity:.55;
    z-index:0;
    animation:tariffDownloadPulse 2.4s ease-out infinite;
}

.tariff-sticky-download.is-loading .tariff-sticky-download-pulse{
    animation:none;
    opacity:0;
}

@keyframes tariffDownloadPulse{
    0%{ transform:scale(1); opacity:.55; }
    70%{ transform:scale(1.35); opacity:0; }
    100%{ transform:scale(1.35); opacity:0; }
}

@keyframes tariffDownloadBounceIn{
    0%{ opacity:0; transform:translateY(30px) scale(.85); }
    60%{ opacity:1; transform:translateY(-6px) scale(1.05); }
    100%{ opacity:1; transform:translateY(0) scale(1); }
}

/* ---------- Shimmer sweep across the pill ---------- */
.tariff-sticky-download-shine{
    position:absolute;
    inset:0;
    z-index:1;
    border-radius:60px;
    overflow:hidden;
    pointer-events:none;
}
.tariff-sticky-download-shine::before{
    content:"";
    position:absolute;
    top:0;
    left:-60%;
    width:40%;
    height:100%;
    background:linear-gradient(115deg, transparent, rgba(255,255,255,.55), transparent);
    animation:tariffDownloadShine 3.2s ease-in-out infinite;
}
@keyframes tariffDownloadShine{
    0%{ left:-60%; }
    35%{ left:120%; }
    100%{ left:120%; }
}

/* ---------- Fluttering butterflies (Ayurveda / nature touch) ---------- */
.tariff-butterfly{
    position:absolute;
    z-index:3;
    pointer-events:none;
    filter:drop-shadow(0 2px 4px rgba(0,0,0,.15));
}
.tariff-butterfly-wings{
    display:block;
    transform-origin:center;
    animation:tariffButterflyFlap .42s ease-in-out infinite alternate;
}
.tariff-butterfly-1{
    top:-16px;
    left:8px;
    animation:tariffButterflyFloat1 4.2s ease-in-out infinite;
}
.tariff-butterfly-2{
    bottom:-12px;
    right:26px;
    animation:tariffButterflyFloat2 5s ease-in-out infinite;
    animation-delay:.6s;
}
.tariff-sticky-download.is-loading .tariff-butterfly,
.tariff-sticky-download.is-loading .tariff-leaf{
    opacity:0;
    transition:opacity .3s ease;
}

@keyframes tariffButterflyFlap{
    from{ transform:scaleX(1); }
    to{ transform:scaleX(.45); }
}
@keyframes tariffButterflyFloat1{
    0%{ transform:translate(0,0) rotate(0deg); }
    25%{ transform:translate(10px,-10px) rotate(10deg); }
    50%{ transform:translate(-4px,-18px) rotate(-6deg); }
    75%{ transform:translate(-10px,-6px) rotate(6deg); }
    100%{ transform:translate(0,0) rotate(0deg); }
}
@keyframes tariffButterflyFloat2{
    0%{ transform:translate(0,0) rotate(0deg); }
    30%{ transform:translate(-12px,8px) rotate(-8deg); }
    60%{ transform:translate(6px,16px) rotate(8deg); }
    100%{ transform:translate(0,0) rotate(0deg); }
}

/* ---------- Drifting Ayurveda leaf ---------- */
.tariff-leaf{
    position:absolute;
    top:-20px;
    left:50%;
    z-index:3;
    color:var(--secondary);
    font-size:13px;
    pointer-events:none;
    opacity:.9;
    animation:tariffLeafDrift 3.6s ease-in-out infinite;
}
@keyframes tariffLeafDrift{
    0%{ transform:translate(-50%,0) rotate(0deg); opacity:.9; }
    50%{ transform:translate(-30%,-14px) rotate(35deg); opacity:.6; }
    100%{ transform:translate(-50%,0) rotate(0deg); opacity:.9; }
}

@media (max-width:576px){
    .tariff-sticky-download{
        right:16px;
        bottom:170px;
        padding:14px 18px;
    }
    .tariff-sticky-download-text{
        display:none;
    }
    .tariff-butterfly-2,
    .tariff-leaf{
        display:none;
    }
}


/* =========================================================
   INTRO
========================================================= */

.tariff-intro{
    background:var(--bg);
    padding:80px 0 50px;
}

.tariff-intro-content{
    max-width:800px;
    margin:auto;
}

.tariff-intro-content h2{
    font-family:var(--heading);
    font-size:48px;
    color:var(--primary-dark);
    margin:20px 0;
}

.tariff-intro-content p{
    line-height:1.8;
}


/* =========================================================
   SEASON
========================================================= */

.tariff-season{
    background:#fff;
}

.season-card{
    position:relative;
    display:flex;
    align-items:center;
    gap:25px;
    height:100%;
    padding:30px;
    border-radius:24px;
    overflow:hidden;
    border:1px solid transparent;
    transition:var(--transition);
}

.season-card::after{
    content:"";
    position:absolute;
    top:-40px;
    right:-40px;
    width:120px;
    height:120px;
    border-radius:50%;
    background:rgba(255,255,255,.35);
    transition:transform .5s ease;
}

.season-card:hover{
    transform:translateY(-6px);
    box-shadow:var(--shadow);
}

.season-card:hover::after{
    transform:scale(1.3);
}

.low-season{
    background:linear-gradient(135deg,#eef5ef 0%,#e2f0e6 100%);
}

.low-season:hover{
    border-color:rgba(47,106,82,.25);
}

.high-season{
    background:linear-gradient(135deg,#f8f0df 0%,#f4e6c8 100%);
}

.high-season:hover{
    border-color:rgba(201,166,107,.4);
}

.season-icon{
    position:relative;
    z-index:1;
    width:58px;
    height:58px;
    flex:0 0 58px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--primary);
    color:#fff;
    box-shadow:0 8px 18px rgba(47,106,82,.3);
    transition:transform .4s ease;
}

.season-card:hover .season-icon{
    transform:rotate(-12deg) scale(1.08);
}

.high-season .season-icon{
    background:var(--secondary);
    box-shadow:0 8px 18px rgba(201,166,107,.35);
}

.season-content{
    position:relative;
    z-index:1;
}

.season-content span{
    color:var(--secondary);
    letter-spacing:3px;
    font-size:14px;
    font-weight:600;
}

.season-content h3{
    color:var(--primary-dark);
    font-family:var(--heading);
    font-size:21px;
    margin:8px 0 0;
}


/* =========================================================
   PACKAGE PRICES
========================================================= */

.package-prices{
    background:var(--bg);
}

.tariff-table-wrapper{
    width:100%;
    overflow-x:auto;
    border-radius:24px;
    box-shadow:0 20px 45px rgba(24,51,41,.12);
    background:#fff;
    border:1px solid rgba(24,51,41,.06);
}

.tariff-table{
    width:100%;
    border-collapse:collapse;
    min-width:900px;
    overflow:hidden;
}

.tariff-table thead{
    background:linear-gradient(180deg,#EEF6F1,#E7F0EA);
    color:var(--primary-dark);
}

.tariff-table th{
    padding:20px 15px;
    text-align:center;
    font-weight:600;
    border-right:1px solid rgba(24,51,41,.1);
    position:sticky;
    top:0;
}

.tariff-table tbody tr{
    transition:background .25s ease;
}

.tariff-table tbody tr:hover{
    background:#f1f7f2 !important;
}

.tariff-table tbody tr:hover td.price{
    color:var(--primary);
}

.tariff-table th small{
    display:block;
    color:rgba(24,51,41,.65);
    margin-top:8px;
    line-height:1.5;
    font-weight:400;
}

.tariff-table tbody tr:nth-child(odd){
    background:#fff;
}

.tariff-table tbody tr:nth-child(even){
    background:#f8f6f1;
}

.tariff-table td{
    padding:18px 15px;
    text-align:center;
    border-bottom:1px solid #ececec;
}

.tariff-table td.price{
    color:var(--primary-dark);
    font-weight:600;
}

.tariff-table td.night-value{
    color:var(--primary);
    font-family:var(--heading);
    font-size:21px;
    font-weight:600;
}

.mobile-tariff-cards{
    display:none;
}


/* =========================================================
   ADDITIONAL NIGHTS
========================================================= */

.additional-nights{
    background:#fff;
}

.additional-note{
    display:flex;
    align-items:center;
    gap:15px;
    max-width:900px;
    margin:0 auto 35px;
    padding:20px 25px;
    background:#f8f0df;
    border-left:4px solid var(--secondary);
    border-radius:10px;
}

.additional-note i{
    color:var(--secondary);
    font-size:21px;
}

.additional-note p{
    margin:0;
    line-height:1.7;
}

.additional-card{
    background:#fff;
    border-radius:24px;
    box-shadow:var(--shadow);
    margin-bottom:30px;
    overflow:hidden;
    border:1px solid #eee;
    transition:var(--transition);
}

.additional-card:hover{
    box-shadow:0 20px 45px rgba(24,51,41,.14);
    transform:translateY(-4px);
}

.additional-card h3{
    position:relative;
    font-family:var(--heading);
    font-size:26px;
    color:var(--primary-dark);
    padding:25px 30px 25px 45px;
    margin:0;
    background:linear-gradient(90deg,#f8f6f1,#f1efe8);
}

.additional-card h3::before{
    content:"";
    position:absolute;
    left:22px;
    top:50%;
    transform:translateY(-50%);
    width:5px;
    height:60%;
    border-radius:4px;
    background:var(--secondary);
}

.additional-row:hover{
    background:#faf9f5;
}

.additional-table{
    width:100%;
}

.additional-heading,
.additional-row{
    display:grid;
    grid-template-columns:1.2fr repeat(4,1fr);
    align-items:center;
}

.additional-heading{
    background:#E7F0EA;
    color:var(--primary-dark);
    font-weight:600;
}

.additional-heading span,
.additional-row span,
.additional-row strong{
    padding:18px 15px;
    text-align:center;
}

.additional-row{
    border-bottom:1px solid #ececec;
}

.additional-row:last-child{
    border-bottom:0;
}

.additional-row strong{
    color:var(--primary-dark);
}


/* =========================================================
   FULL HOUSE
========================================================= */

.full-house{
    background:#E7F0EA;
    color:var(--primary-dark);
}

.full-house-content{
    text-align:center;
    max-width:1000px;
    margin:auto;
}

.full-house h2{
    font-family:var(--heading);
    font-size:52px;
    color:var(--primary-dark);
    margin:20px 0;
}

.full-house-intro{
    color:#3C4A42;
    line-height:1.8;
    margin-bottom:40px;
}

.full-house-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:25px;
}

.full-house-card{
    position:relative;
    padding:35px;
    background:rgba(24,51,41,.05);
    border:1px solid rgba(24,51,41,.12);
    border-radius:24px;
    overflow:hidden;
    transition:var(--transition);
}

.full-house-card::before{
    content:"\f236";
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    position:absolute;
    right:14px;
    top:10px;
    font-size:46px;
    color:rgba(24,51,41,.06);
}

.full-house-card:hover{
    transform:translateY(-7px);
    background:rgba(24,51,41,.09);
    box-shadow:0 18px 40px rgba(24,51,41,.12);
}

.full-house-card > span{
    color:#9C7A3D;
    letter-spacing:2px;
    font-size:14px;
    font-weight:600;
}

.full-house-card h3{
    font-family:var(--heading);
    font-size:26px;
    margin:15px 0 5px;
    color:var(--primary-dark);
}

.full-house-card p{
    color:#3C4A42;
    margin-bottom:25px;
}

.full-house-card strong{
    display:inline-flex;
    flex-direction:column;
    margin:0 12px;
    color:#9C7A3D;
    font-size:21px;
}

.full-house-card strong small{
    color:#3C4A42;
    font-size:14px;
    font-weight:400;
    margin-top:5px;
}

.full-house-note{
    margin-top:35px;
    color:#3C4A42;
    font-style:italic;
    line-height:1.8;
}


/* =========================================================
   TERMS
========================================================= */

.terms-section{
    background:var(--bg);
}

.terms-card{
    max-width:1000px;
    margin:auto;
    background:#fff;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 20px 45px rgba(24,51,41,.1);
    transition:var(--transition);
}

.terms-card:hover{
    box-shadow:0 25px 55px rgba(24,51,41,.16);
}

.terms-highlight > div{
    transition:background .3s ease;
}

.terms-highlight > div:hover{
    background:rgba(255,255,255,.4);
}

.terms-highlight{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    background:#E7F0EA;
}

.terms-highlight > div{
    padding:30px;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:8px;
    color:var(--primary-dark);
}

.terms-highlight > div + div{
    border-left:1px solid rgba(24,51,41,.15);
}

.terms-highlight i{
    color:#9C7A3D;
    font-size:21px;
    margin-bottom:5px;
}

.terms-highlight span{
    color:#3C4A42;
}

.terms-highlight strong{
    font-family:var(--heading);
    font-size:21px;
}

.terms-content{
    padding:35px;
}

.terms-content p{
    line-height:1.9;
    margin:0;
}


/* =========================================================
   POLICY
========================================================= */

.policy-section{
    background:#fff;
}

.policy-card,
.loyalty-card{
    height:100%;
    padding:40px;
    border-radius:24px;
    box-shadow:var(--shadow);
    transition:var(--transition);
}

.policy-card:hover,
.loyalty-card:hover{
    box-shadow:0 22px 48px rgba(24,51,41,.14);
    transform:translateY(-4px);
}

.policy-card{
    background:var(--bg);
    border-top:4px solid var(--primary);
}

.loyalty-card{
    background:linear-gradient(160deg,#E7F0EA,#eef5ef);
    color:var(--primary-dark);
    border-top:4px solid var(--secondary);
}

.policy-card h2,
.loyalty-card h2{
    font-family:var(--heading);
    font-size:36px;
    line-height:1.25;
    color:var(--primary-dark);
    margin:20px 0;
}

.loyalty-card h2{
    color:var(--primary-dark);
}

.policy-card p,
.loyalty-card p{
    line-height:1.8;
    margin-bottom:25px;
}

.loyalty-card p{
    color:#3C4A42;
}

.policy-card h3{
    font-size:17px;
    color:var(--primary-dark);
    margin:25px 0 15px;
}

.cancellation-list{
    margin:0;
    padding:0;
    list-style:none;
}

.cancellation-list li{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:15px 0;
    border-bottom:1px solid #ddd;
}

.cancellation-list li:last-child{
    border-bottom:0;
}

.cancellation-list strong{
    color:var(--primary);
    text-align:right;
}

.policy-note{
    display:flex;
    gap:15px;
    align-items:flex-start;
    margin-top:25px;
    padding:18px;
    background:#fff;
    border-left:3px solid var(--secondary);
}

.policy-note i{
    color:var(--secondary);
    margin-top:4px;
}

.policy-note p{
    margin:0;
}

.loyalty-percent{
    font-family:var(--heading);
    font-size:52px;
    color:var(--secondary);
    margin:10px 0 15px;
}

.loyalty-card ul{
    margin:0;
    padding-left:20px;
}

.loyalty-card li{
    margin-bottom:12px;
    color:#3C4A42;
    line-height:1.7;
}


/* =========================================================
   LEGAL
========================================================= */

.legal-section{
    padding:70px 0;
    background:var(--bg);
}

.legal-box{
    max-width:1000px;
    margin:auto;
    padding:30px;
    border-radius:20px;
    background:#fff;
    border-left:4px solid var(--secondary);
    box-shadow:var(--shadow);
}

.legal-box p{
    line-height:1.8;
    margin-bottom:15px;
}

.legal-box p:last-child{
    margin-bottom:0;
}


/* =========================================================
   INCLUDED SERVICES
========================================================= */

.included-section{
    background:#fff;
}

.included-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.included-item{
    position:relative;
    padding:35px 25px;
    background:var(--bg);
    border-radius:24px;
    text-align:center;
    transition:var(--transition);
    overflow:hidden;
    border:1px solid transparent;
}

.included-item:hover{
    transform:translateY(-8px);
    box-shadow:var(--shadow);
    border-color:rgba(47,106,82,.15);
    background:#fff;
}

.included-item:hover > i{
    transform:scale(1.1) rotate(-8deg);
}

.included-number{
    position:absolute;
    top:15px;
    right:20px;
    color:rgba(47,106,82,.12);
    font-family:var(--heading);
    font-size:21px;
}

.included-item > i{
    width:60px;
    height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:10px auto 25px;
    border-radius:50%;
    background:var(--primary);
    color:#fff;
    transition:transform .4s ease;
}

.included-item p{
    line-height:1.8;
    margin:0;
}


/* =========================================================
   CTA
========================================================= */

.tariff-cta{
    position:relative;
    min-height:450px;
    display:flex;
    align-items:center;
    background:
        linear-gradient(
            rgba(24,51,41,.84),
            rgba(24,51,41,.84)
        ),
        url("../images/about-cta.jpg") center/cover no-repeat;
}

.tariff-cta-overlay{
    position:absolute;
    inset:0;
}

.tariff-cta-content{
    position:relative;
    z-index:2;
    max-width:800px;
    margin:auto;
}

.tariff-cta-content h2{
    font-family:var(--heading);
    font-size:48px;
    line-height:1.2;
    color:#fff;
    margin:20px 0;
}

.tariff-cta-content h2 span{
    color:var(--secondary);
}

.tariff-cta-content p{
    color:rgba(255,255,255,.75);
    line-height:1.8;
    margin-bottom:30px;
}

.tariff-cta-content .theme-btn i{
    margin-left:10px;
}