/*
Theme Name: King Lakeside Jeep Safari
Theme URI: https://kinglakesidejeepsafarihabarana.com
Author: Pixel Pro Solution
Author URI: https://www.pixelpro.lk/
Description: A custom, premium, SEO-optimized WordPress theme for King Lakeside Jeep Safari Habarana.
Version: 2.0.0
Text Domain: jeepsafari
*/

/* ===== CSS Variables ===== */
:root {
    --color-primary: #ea580c;
    --color-primary-dark: #c2410c;
    --color-primary-light: #fff7ed;
    --color-dark: #18181b; 
    --color-dark-muted: #27272a;
    --color-light: #ffffff;
    --color-light-alt: #f9fafb; /* Very clean, soft light gray */
    --color-border: #e5e7eb; 
    --color-text: #4b5563; /* Softer text color */
    --color-text-muted: #6b7280;
    --font-heading: 'Outfit', sans-serif;
    --font-body: 'Outfit', sans-serif;
    --container-width: 1200px;
    --section-width-narrow: 800px;
    --section-width-default: 1000px;
    --section-width-wide: 1200px;
    --radius-sm: 12px; /* Primary radius */
    --radius-md: 16px; 
    --radius-lg: 24px;
    --space-section: 100px;
    --space-section-mobile: 60px;
    /* Layered shadows for premium feel */
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.02), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.03), 0 2px 4px rgba(0,0,0,0.04);
    --shadow-lg: 0 12px 32px rgba(0,0,0,0.05), 0 4px 12px rgba(0,0,0,0.04);
    --transition-fast: 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    --transition-normal: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

/* ===== Reset & Base ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);color:var(--color-text);background:var(--color-light);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--color-dark);line-height:1.2;margin-bottom:1rem;font-weight:700;letter-spacing:-0.01em}
h1{font-size:clamp(2.2rem,4.5vw,3.5rem); letter-spacing:-0.03em}
h2{font-size:clamp(1.8rem,3.5vw,2.5rem); letter-spacing:-0.02em}
h3{font-size:clamp(1.3rem,2.5vw,1.6rem)}
p{margin-bottom:1.25rem; font-weight:400; color:var(--color-text)}
a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}
a:hover{color:var(--color-primary-dark)}
img{max-width:100%;height:auto;display:block}
ul{list-style:none}

/* ===== Utilities ===== */
.container{width:100%;max-width:var(--container-width);margin:0 auto;padding:0 24px}
.container-narrow{max-width:var(--section-width-narrow);margin:0 auto}
.container-default{max-width:var(--section-width-default);margin:0 auto}
.container-wide{max-width:var(--section-width-wide);margin:0 auto}
.section{padding:var(--space-section) 0}
@media(max-width:768px){ .section{padding:var(--space-section-mobile) 0} }
.section-dark{background:var(--color-light-alt);color:var(--color-text)} /* Overriding old dark class */
.section-dark h1,.section-dark h2,.section-dark h3{color:var(--color-dark)}
.bg-alt{background:var(--color-light-alt)}
.bg-dark-section { background: var(--color-dark); color: rgba(255, 255, 255, 0.85); }
.bg-dark-section h1, .bg-dark-section h2, .bg-dark-section h3 { color: #fff; }
.bg-dark-section .section-intro-text { color: rgba(255, 255, 255, 0.7); }
.bg-dark-section .tour-card { background: var(--color-dark-muted); border-color: rgba(255, 255, 255, 0.1); }
.bg-dark-section .tour-card:hover { border-color: var(--color-primary); box-shadow: 0 12px 32px rgba(0,0,0,0.4), 0 4px 12px rgba(0,0,0,0.3); }
.bg-dark-section .tour-card-body h3 { color: #fff; }
.bg-dark-section .tour-card-body p { color: rgba(255, 255, 255, 0.7); }
.bg-dark-section .tour-meta { color: rgba(255, 255, 255, 0.6); }
.bg-dark-section .heritage-card { border-color: rgba(255, 255, 255, 0.1); }
.text-center{text-align:center}
.section-tag{display:inline-block;color:var(--color-primary);font-family:var(--font-heading);font-weight:700;text-transform:uppercase;letter-spacing:1.5px;font-size:0.85rem;margin-bottom:12px;background:var(--color-primary-light);padding:4px 12px;border-radius: 12px}

/* Clean, Smooth Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;border-radius: 50px; font-family:var(--font-heading);font-weight:600;font-size:0.95rem;cursor:pointer;transition:all var(--transition-normal);border:none;text-decoration:none}
.btn-primary{background:var(--color-primary);color:#fff!important;box-shadow:0 4px 15px rgba(234, 88, 12, 0.25)}
.btn-primary:hover{background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:0 8px 25px rgba(234, 88, 12, 0.35);color:#fff!important}
.btn-outline{background:transparent;border:2px solid var(--color-primary);color:var(--color-primary)!important; border-radius: 50px;}
.btn-outline:hover{background:var(--color-primary);color:#fff!important}
.btn-lg{padding:16px 36px;font-size:1rem}
.btn-sm{padding:8px 20px;font-size:0.9rem}

/* ===== Header ===== */
/* Made solid white always for logo visibility */
.site-header{position:fixed;top:0;left:0;width:100%;z-index:1000;background:var(--color-light);box-shadow:0 1px 3px rgba(0,0,0,0.05);transition:all var(--transition-normal)}
.site-header.is-sticky{box-shadow:0 4px 20px rgba(0,0,0,0.08)}
.header-inner{display:flex;justify-content:space-between;align-items:center;padding:15px 0;transition:padding var(--transition-normal)}
.is-sticky .header-inner{padding:10px 0}
.site-logo{max-width:180px;height:auto;display:block;transition:var(--transition-fast)}
.mobile-sidebar-header { display: none; }
.main-navigation{display:flex;align-items:center;justify-content:center;flex-grow:1}
.nav-menu{display:flex;gap:32px;margin:0}
.nav-menu li a{color:var(--color-dark);font-family:var(--font-heading);font-weight:600;font-size:0.95rem;transition:color var(--transition-fast);padding:8px 0;display:block}
.nav-menu li a:hover,
.nav-menu li.current-menu-item > a,
.nav-menu li.current-menu-ancestor > a {
    color: var(--color-primary);
}

/* Dropdown Menus */
.nav-menu li{position:relative}
.nav-menu .menu-item-has-children > a::after{content:'▾';font-size:0.8rem;margin-left:6px;vertical-align:middle;display:inline-block}
.nav-menu .sub-menu{position:absolute;top:100%;left:0;background:var(--color-light);min-width:220px;border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(10px);transition:all var(--transition-normal);padding:10px 0;z-index:100;border:1px solid var(--color-border);margin:0}
.nav-menu li:hover > .sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-menu .sub-menu li{display:block;width:100%}
.nav-menu .sub-menu li a{padding:10px 20px;font-size:0.95rem;color:var(--color-text);font-weight:500;border-bottom:1px solid var(--color-border)}
.nav-menu .sub-menu li a::after{display:none}
.nav-menu .sub-menu li:last-child a{border-bottom:none}
.nav-menu .sub-menu li a:hover,
.nav-menu .sub-menu li.current-menu-item > a {
    background:var(--color-light-alt);
    color:var(--color-primary);
    padding-left:24px;
}
.header-actions{display:flex;align-items:center;gap:20px}
.header-social{display:flex;gap:12px;align-items:center}
.hs-icon{color:var(--color-text);transition:color 0.6s;display:flex}
.hs-icon:hover{color:var(--color-primary)}
.header-cta{padding:10px 24px;font-size:0.9rem}

/* ===== Hero V2 — Cinematic Split Layout ===== */
.hero-v2{position:relative;width:100%;overflow:hidden;padding:120px 0 60px;min-height:100vh;display:flex;align-items:center}
.hero-v2-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1s ease;z-index:0;transform:scale(1.05)}
.hero-v2-bg.active{opacity:1;transform:scale(1);transition:opacity 1s ease,transform 8s ease-out}
.hero-v2-bg-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(8,10,14,0.82) 0%,rgba(8,10,14,0.65) 50%,rgba(8,10,14,0.45) 100%);z-index:1}
.hero-v2-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.15fr;gap:60px;align-items:center;max-width:var(--container-width);margin:0 auto;padding:0 24px;width:100%}

/* LEFT — Content Side */
.hero-v2-content{display:flex;flex-direction:column;justify-content:center}
.hero-v2-text-wrap{opacity:0;animation:heroFadeIn 0.9s ease 0.2s forwards}
.hero-v2-tag{display:inline-flex;align-items:center;gap:6px;background:rgba(234,88,12,0.15);color:var(--color-primary);padding:6px 16px;border-radius: 12px;font-family:var(--font-heading);font-weight:700;font-size:0.78rem;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:20px;border:1px solid rgba(234,88,12,0.25);width:fit-content;opacity:0;animation:heroSlideUp 0.6s ease 0.3s forwards}
.hero-v2-title{color:#fff;font-size:clamp(2rem,4.5vw,3.8rem);font-weight:800;line-height:1.08;margin-bottom:20px;letter-spacing:-0.03em;opacity:0;animation:heroSlideUp 0.7s ease 0.45s forwards}
.hero-v2-desc{color:rgba(255,255,255,0.65);font-size:clamp(0.95rem,1.3vw,1.1rem);line-height:1.7;margin-bottom:32px;max-width:520px;opacity:0;animation:heroSlideUp 0.7s ease 0.6s forwards}
.hero-v2-actions{display:flex;gap:14px;flex-wrap:wrap;opacity:0;animation:heroSlideUp 0.7s ease 0.75s forwards}
.btn-hero-v2{padding:14px 30px;font-size:0.95rem;border-radius:12px}
.btn-outline-hero{display:inline-flex;align-items:center;justify-content:center;padding:14px 28px;border-radius:12px;font-family:var(--font-heading);font-weight:600;font-size:0.95rem;cursor:pointer;transition:all var(--transition-normal);border:2px solid rgba(255,255,255,0.2);color:#fff;background:transparent;text-decoration:none}
.btn-outline-hero:hover{border-color:var(--color-primary);color:var(--color-primary);background:rgba(234,88,12,0.08)}

/* RIGHT — Media Side */
.hero-v2-media{position:relative;opacity:0;animation:heroScaleIn 0.9s ease 0.3s forwards}
.hero-v2-image-frame{position:relative;width:100%;aspect-ratio:4/3;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 25px 70px rgba(0,0,0,0.5),0 8px 20px rgba(0,0,0,0.3)}
.hero-v2-slide{position:absolute;inset:0;opacity:0;transition:opacity 0.7s ease,transform 0.7s ease;transform:scale(1.04)}
.hero-v2-slide.active{opacity:1;transform:scale(1)}
.hero-v2-slide img{width:100%;height:100%;object-fit:cover}
.hero-v2-counter{position:absolute;bottom:16px;right:16px;background:rgba(0,0,0,0.55);backdrop-filter:blur(8px);color:rgba(255,255,255,0.85);padding:6px 14px;border-radius: 12px;font-family:var(--font-heading);font-size:0.78rem;font-weight:600;letter-spacing:1px;border:1px solid rgba(255,255,255,0.1)}
#hv2-current{color:var(--color-primary);font-weight:700}

/* Thumbnail Strip */
.hero-v2-thumbs{display:flex;gap:10px;margin-top:16px}
.hv2-thumb{position:relative;flex:1;border:none;background:none;cursor:pointer;border-radius:10px;overflow:hidden;padding:0;opacity:0.5;transition:all var(--transition-normal);border:2px solid transparent;display:flex;flex-direction:column}
.hv2-thumb:hover{opacity:0.8}
.hv2-thumb.active{opacity:1;border-color:rgba(255,255,255,0.6)}
.hv2-thumb img{width:100%;height:65px;object-fit:cover;border-radius:8px;display:block}
.hv2-thumb-label{display:block;font-size:0.65rem;color:rgba(255,255,255,0.5);text-align:center;padding:5px 2px 3px;font-family:var(--font-heading);font-weight:600;letter-spacing:0.5px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color var(--transition-fast)}
.hv2-thumb.active .hv2-thumb-label{color:#fff}

/* TripAdvisor Badge */
.hero-v2-badge{position:absolute;bottom:30px;left:24px;display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,0.06);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:10px 18px;border-radius: 12px;border:1px solid rgba(255,255,255,0.1);color:#fff;font-size:0.82rem;font-weight:600;text-decoration:none;transition:all var(--transition-normal);z-index:5;opacity:0;animation:heroFadeIn 0.7s ease 1.2s forwards}
.hero-v2-badge:hover{background:rgba(255,255,255,0.12);border-color:rgba(245,158,11,0.4);color:#f59e0b;transform:translateY(-2px)}
.hero-v2-badge svg{flex-shrink:0}

/* Keyframes */
@keyframes heroFadeIn{from{opacity:0}to{opacity:1}}
@keyframes heroSlideUp{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}
@keyframes heroScaleIn{from{opacity:0;transform:scale(0.92) translateX(30px)}to{opacity:1;transform:scale(1) translateX(0)}}

/* Text change transition class */
.hero-v2-text-changing .hero-v2-tag,
.hero-v2-text-changing .hero-v2-title,
.hero-v2-text-changing .hero-v2-desc{opacity:0;transform:translateY(15px);transition:all 0.6s ease}
.hero-v2-text-visible .hero-v2-tag,
.hero-v2-text-visible .hero-v2-title,
.hero-v2-text-visible .hero-v2-desc{opacity:1;transform:translateY(0);transition:all 0.8s ease 0.1s}

/* ===== Hero V2 Responsive ===== */
@media(max-width:1200px){
    .hero-v2-inner{gap:40px}
    .hero-v2-title{font-size:clamp(1.8rem,4vw,3rem)}
}
@media(max-width:992px){
    .hero-v2{min-height:auto;padding:100px 0 50px}
    .hero-v2-inner{grid-template-columns:1fr;gap:35px}
    .hero-v2-content{order:2;text-align:center;align-items:center}
    .hero-v2-media{order:1}
    .hero-v2-text-wrap{display:flex;flex-direction:column;align-items:center}
    .hero-v2-desc{max-width:600px}
    .hero-v2-actions{justify-content:center}
    .hero-v2-badge{left:50%;transform:translateX(-50%);bottom:15px}
    .hero-v2-badge:hover{transform:translateX(-50%) translateY(-2px)}
}
@media(max-width:768px){
    .hero-v2{padding:90px 0 35px}
    .hero-v2-inner{gap:25px}
    .hero-v2-title{font-size:clamp(1.6rem,6.5vw,2.3rem);line-height:1.15}
    .hero-v2-desc{font-size:0.92rem;margin-bottom:24px}
    .hero-v2-image-frame{aspect-ratio:16/10;border-radius:var(--radius-md)}
    .btn-hero-v2,.btn-outline-hero{padding:12px 22px;font-size:0.88rem;border-radius:10px;width:100%;justify-content:center}
    .hero-v2-actions{flex-direction:column;gap:10px;width:100%;max-width:340px}
    .hv2-thumb img{height:40px}
    .hv2-thumb-label{font-size:0.58rem;padding:3px 2px 2px}
    .hero-v2-thumbs{gap:6px}
    .hero-v2-badge{font-size:0.75rem;padding:8px 14px;bottom:10px}
    .hero-v2-counter{padding:4px 10px;font-size:0.7rem;bottom:10px;right:10px}
}
@media(max-width:480px){
    .hero-v2{padding:85px 0 30px}
    .hero-v2-image-frame{aspect-ratio:3/2}
    .hero-v2-badge{display:none}
}

/* ===== Stats Bar ===== */
.stats-bar{position:relative;z-index:20;margin-top:-50px;padding:0 24px}
.stats-grid{background:rgba(255, 255, 255, 0.95);backdrop-filter:blur(10px);border-radius:var(--radius-md);border:1px solid var(--color-border);box-shadow:var(--shadow-lg);display:grid;grid-template-columns:repeat(4,1fr);max-width:1000px;margin:0 auto;overflow:hidden}
.stat-item{text-align:center;padding:28px 16px;border-right:1px solid #eee}
.stat-item:last-child{border:none}
.stat-num{font-family:var(--font-heading);font-size:2rem;font-weight:800;color:var(--color-primary);display:inline}
.stat-plus{font-family:var(--font-heading);font-size:1.5rem;font-weight:800;color:var(--color-primary)}
.stat-label{display:block;color:var(--color-text-muted);font-size:0.8rem;margin-top:4px}

/* ===== About ===== */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.about-images{position:relative}
.about-img-main{position:relative}
.about-img-main > div > img{width:100%;height:380px;object-fit:cover;border-radius:var(--radius-sm);box-shadow:var(--shadow-md)}
.about-img-float{position:absolute;bottom:-20px;right:-20px;width:170px;border-radius:var(--radius-sm);overflow:hidden;border:4px solid #fff;box-shadow:var(--shadow-md);z-index:2}
.about-img-float img{width:100%;height:130px;object-fit:cover}
.about-experience-badge{position:absolute;top:15px;left:-15px;background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);padding:16px;text-align:center;box-shadow:var(--shadow-md);z-index:2}
.exp-num{display:block;font-family:var(--font-heading);font-size:1.6rem;font-weight:800;line-height:1}
.exp-text{font-size:0.7rem;text-transform:uppercase;letter-spacing:1px;opacity:0.9}
.about-features{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.af-item{display:flex;align-items:center;gap:8px;font-weight:500;font-size:0.88rem;color:var(--color-text)}

/* ===== Tour Cards ===== */
.tour-cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tour-card{background:var(--color-light);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;transition:all 0.5s ease;display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}
.tour-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:var(--color-primary-light)}
.tour-card-img{position:relative;height:240px;overflow:hidden}
.tour-card-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.8s ease}
.tour-card:hover .tour-card-img img{transform:scale(1.1)}
.tour-price{position:absolute;top:12px;right:12px;background:var(--color-primary);color:#fff;padding:6px 14px;border-radius:var(--radius-sm);font-weight:700;font-size:0.95rem;box-shadow:var(--shadow-sm)}
.tour-price small{font-size:0.7rem;font-weight:400}
.tour-card-body{padding:24px;color:var(--color-text);flex-grow:1;display:flex;flex-direction:column}
.tour-card-body h3{color:var(--color-dark);margin-bottom:10px;font-size:1.1rem}
.tour-card-body p{color:var(--color-text-muted);font-size:0.9rem;margin-bottom:16px;line-height:1.6;flex-grow:1}
.tour-meta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px;font-size:0.8rem;color:var(--color-text-muted)}

/* ===== Village Grid - New Interactive UI ===== */
.village-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 40px; }
.village-card { position: relative; border-radius: var(--radius-lg); overflow: hidden; height: 340px; display: flex; align-items: flex-end; border: none; box-shadow: var(--shadow-md); transition: all 0.9s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.village-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.3); }
.village-card .vc-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s ease; }
.village-card:hover .vc-bg { transform: scale(1.1); }
.village-card .vc-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0) 100%); transition: all 0.9s ease; z-index: 1; }
.village-card:hover .vc-overlay { background: linear-gradient(0deg, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.7) 100%); }
.village-card .vc-content { position: relative; z-index: 2; padding: 30px; width: 100%; color: #fff; }
.village-card h4 { color: #fff; margin-bottom: 0; font-size: 1.25rem; transition: all 0.8s ease; transform: translateY(20px); text-align: left; }
.village-card:hover h4 { transform: translateY(0); margin-bottom: 12px; color: var(--color-primary); }
.village-card .vc-desc-wrap { max-height: 0; opacity: 0; overflow: hidden; transition: all 0.9s ease; transform: translateY(10px); text-align: left; }
.village-card:hover .vc-desc-wrap { max-height: 150px; opacity: 1; transform: translateY(0); }
.village-card p { color: rgba(255,255,255,0.85); font-size: 0.95rem; margin: 0; line-height: 1.6; }

/* ===== Why Choose Us ===== */
.why-split { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.why-image { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); height: 100%; min-height: 500px; }
.why-image img { width: 100%; height: 100%; object-fit: cover; }
.why-list { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 35px; }
.why-item { display: flex; flex-direction: column; gap: 16px; background: var(--color-light); padding: 25px; border-radius: var(--radius-md); border: 1px solid var(--color-border); box-shadow: var(--shadow-sm); transition: all 0.6s; }
.why-item:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); border-color: var(--color-primary); }
.why-icon-box { width: 54px; height: 54px; background: var(--color-primary-light); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; font-size: 1.3rem; flex-shrink: 0; color: var(--color-primary); transition: all 0.6s; }
.why-item:hover .why-icon-box { background: var(--color-primary); color: #fff; }
.why-item:hover .why-icon-box svg { stroke: #fff; }
.why-icon-box svg { width: 28px; height: 28px; stroke: var(--color-primary); transition: all 0.6s; }
.why-item h4 { margin-bottom: 8px; font-size: 1.05rem; color: var(--color-dark); }
.why-item p { color: var(--color-text-muted); font-size: 0.9rem; margin: 0; line-height: 1.6; }

/* ===== Heritage Grid ===== */
.heritage-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 40px; }
@media(min-width: 992px) { .heritage-grid { grid-template-columns: repeat(4, 1fr); } }
.heritage-card { position: relative; border-radius: var(--radius-lg); overflow: hidden; height: 380px; display: block; border: 1px solid rgba(255,255,255,0.05); box-shadow: 0 10px 30px rgba(0,0,0,0.3); transition: all 0.9s cubic-bezier(0.175, 0.885, 0.32, 1.275); background: #2a2a2a; }
.heritage-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s ease; opacity: 0.85; }
.heritage-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.5); border-color: var(--color-primary); }
.heritage-card:hover img { transform: scale(1.08); opacity: 1; }
.heritage-card-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,0.9) 100%); display: flex; flex-direction: column; justify-content: flex-end; padding: 30px; color: #fff; transition: all 0.8s ease; }
.heritage-card-overlay h4 { color: #fff; margin-bottom: 8px; font-size: 1.25rem; transform: translateY(10px); transition: transform 0.8s ease; }
.heritage-card-overlay p { color: rgba(255,255,255,0.7); font-size: 0.9rem; margin: 0 0 15px; opacity: 0; transform: translateY(20px); transition: all 0.8s ease; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.heritage-link { color: var(--color-primary); font-weight: 700; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 1px; opacity: 0; transform: translateY(20px); transition: all 0.8s ease 0.1s; display: inline-flex; align-items: center; gap: 5px; }
.heritage-card:hover .heritage-card-overlay { background: linear-gradient(180deg, rgba(234,88,12,0.2) 0%, rgba(0,0,0,0.95) 100%); }
.heritage-card:hover .heritage-card-overlay h4 { transform: translateY(0); }
.heritage-card:hover .heritage-card-overlay p, .heritage-card:hover .heritage-link { opacity: 1; transform: translateY(0); }
.heritage-link svg { width: 16px; height: 16px; transition: transform 0.6s; }
.heritage-card:hover .heritage-link svg { transform: translateX(4px); }
@media (max-width: 768px) {
    .heritage-card-overlay h4, .heritage-card-overlay p, .heritage-link { opacity: 1; transform: translateY(0); }
}

/* ===== Testimonials Slider ===== */
.testimonials-grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 24px;
    padding-top: 10px;
    padding-bottom: 20px;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
    scroll-behavior: smooth;
    cursor: grab;
}
.testimonials-grid::-webkit-scrollbar { display: none; } /* Hide scrollbar for Chrome, Safari and Opera */

.testimonial-card {
    flex: 0 0 calc(33.333% - 16px);
    scroll-snap-align: start;
    background: var(--color-light-alt);
    border-radius: var(--radius-sm);
    padding: 32px;
    border: 1px solid var(--color-border);
    transition: all var(--transition-normal);
    position: relative;
    user-select: none;
}
.testimonial-card:hover {
    background: var(--color-light);
    box-shadow: var(--shadow-sm);
    border-color: var(--color-primary);
    transform: translateY(-5px);
}
.tc-stars { margin-bottom: 16px; font-size: 0.9rem; display: flex; gap: 3px; align-items: center; }
.tc-stars svg { flex-shrink: 0; color: #eab308; fill: #eab308; }
.testimonial-card p { font-style: italic; color: var(--color-text); line-height: 1.7; font-size: 0.9rem; }
.tc-author { margin-top: 20px; font-size: 0.9rem; font-weight: 600; color: var(--color-dark); }
.tc-author span { color: var(--color-text-muted); font-weight: 400; font-size: 0.85rem; }

/* Testimonials Dots */
.testimonials-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 30px;
}
.t-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #cbd5e1;
    cursor: pointer;
    transition: all 0.6s;
}
.t-dot:hover { background: #94a3b8; }
.t-dot.active {
    background: var(--color-primary);
    width: 24px;
    border-radius: 10px;
}

@media(max-width: 992px) {
    .testimonial-card { flex: 0 0 calc(50% - 12px); }
}
@media(max-width: 768px) {
    .testimonials-grid {
        padding: 0;
        scroll-padding: 0;
        gap: 0;
    }
    .testimonial-card { 
        flex: 0 0 100%; 
        scroll-snap-align: center; 
    }
}

/* ===== CTA Section — Premium Redesign ===== */
.cta-section {
    position: relative;
    padding: 180px 0;
    overflow: hidden;
    text-align: center;
    background: var(--color-dark);
}
.cta-bg-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
@media(max-width:768px) { .cta-bg-video { object-position: center; } }

.cta-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(135deg, rgba(24,24,27,0.4) 0%, rgba(24,24,27,0.1) 50%, rgba(24,24,27,0.4) 100%),
        radial-gradient(ellipse at 50% 50%, rgba(234,88,12,0.15) 0%, transparent 70%);
}

.cta-section::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle at top right, rgba(234,88,12,0.2) 0%, transparent 70%);
    z-index: 2;
    pointer-events: none;
}
.cta-section::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 250px;
    height: 250px;
    background: radial-gradient(circle at bottom left, rgba(234,88,12,0.2) 0%, transparent 70%);
    z-index: 2;
    pointer-events: none;
}

.cta-inner {
    position: relative;
    z-index: 3;
    color: #fff;
    max-width: 750px;
    margin: 0 auto;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-md);
    padding: 70px 40px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
}

.cta-inner h2 {
    color: #fff;
    font-size: clamp(1.7rem, 3.5vw, 2.4rem);
    margin-bottom: 12px;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.cta-inner p {
    color: rgba(255, 255, 255, 0.85);
    font-size: 1rem;
    max-width: 550px;
    margin: 0 auto 25px;
    line-height: 1.6;
}

@media(max-width:768px) {
    .cta-section { padding: 100px 0; }
    .cta-inner { padding: 45px 25px; margin: 0 auto; width: calc(100% - 30px); border-radius: var(--radius-md); }
    .cta-inner h2 { font-size: clamp(1.5rem, 5vw, 1.8rem); margin-bottom: 10px; }
    .cta-inner p { font-size: 0.9rem; margin-bottom: 20px; }
}

/* ===== Footer ===== */
.footer-top{background:var(--color-dark);color:#fff;padding:70px 0 50px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:40px}
.footer-logo{max-width:180px;margin-bottom:20px;background-color:#fff;padding:10px 15px;border-radius:8px;}
.footer-about p{color:rgba(255,255,255,0.65);font-size:0.9rem}
.footer-social{display:flex;gap:10px;margin-top:20px}
.social-icon{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.7);transition:all 0.6s}
.social-icon:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff!important}
.widget-title{color:#fff;font-size:1.15rem;margin-bottom:20px;position:relative;padding-bottom:12px}
.widget-title::after{content:'';position:absolute;bottom:0;left:0;width:40px;height:3px;background:var(--color-primary);border-radius: 12px}
.footer-links li{margin-bottom:10px}
.footer-links li a{color:rgba(255,255,255,0.65);font-size:0.9rem;transition:all 0.9s}
.footer-links li a:hover{color:var(--color-primary);padding-left:5px}
.footer-contact-list{list-style:none}
.footer-contact-list li{display:flex;gap:12px;margin-bottom:18px;color:rgba(255,255,255,0.65);font-size:0.9rem}
.footer-contact-list li a{color:rgba(255,255,255,0.65)}
.footer-contact-list li a:hover{color:var(--color-primary)}
.fc-icon{font-size:1.2rem;color:var(--color-primary);display:flex;align-items:center;flex-shrink:0}
.fc-icon svg{width:20px;height:20px;stroke:var(--color-primary)}
.footer-bottom{background:#050505;padding:20px 0}
.footer-bottom-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}
.footer-bottom p{color:rgba(255,255,255,0.5);font-size:0.85rem;margin:0}
.footer-bottom-links{display:flex;gap:20px}
.footer-bottom-links a{color:rgba(255,255,255,0.5);font-size:0.85rem}
.footer-bottom-links a:hover{color:var(--color-primary)}

/* ===== Responsive ===== */
@media(max-width:1200px){
}
@media(max-width:992px){
    .stats-grid{grid-template-columns:repeat(2,1fr)}
    .stat-item:nth-child(2){border-right:none}
    .about-grid,.why-split{grid-template-columns:1fr;gap:35px}
    .about-img-float{right:15px;bottom:-15px}
    .about-experience-badge{left:15px}
    .tour-cards-grid{grid-template-columns:repeat(2,1fr)}
    .village-grid{grid-template-columns:repeat(2,1fr)}
    .heritage-grid{grid-template-columns:repeat(2,1fr)}
    .testimonials-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
    .section{padding:50px 0}
    .stats-grid{grid-template-columns:repeat(2,1fr)}
    .stat-item{padding:20px 10px}
    .tour-cards-grid,.village-grid,.heritage-grid{grid-template-columns:1fr;gap:20px}
    .tour-card-img{height:auto;aspect-ratio:16/10}
    .heritage-card{height:auto;aspect-ratio:4/3}
    .heritage-card-overlay{padding:20px}
    .village-card h4 { transform: translateY(0); margin-bottom: 12px; }
    .village-card .vc-desc-wrap { max-height: 150px; opacity: 1; transform: translateY(0); }
    .village-card .vc-overlay { background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 100%); }
    .about-img-main img{height:auto;aspect-ratio:4/3;border-radius:var(--radius-sm)}
    .about-img-float{width:130px;right:10px;bottom:-15px}
    .about-img-float img{height:auto;aspect-ratio:1/1}
    .about-experience-badge{padding:12px;left:10px;top:10px}
    .exp-num{font-size:1.3rem}
    .exp-text{font-size:0.65rem}
    .why-image img{height:auto;aspect-ratio:4/3;border-radius:var(--radius-sm)}
    .about-features{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr;gap:35px}
    .hide-on-mobile { display: none !important; }
    .footer-widget {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .footer-social {
        justify-content: center;
    }
    .widget-title::after {
        left: 50%;
        transform: translateX(-50%);
    }
    .footer-contact-list li {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 8px;
    }
    .footer-bottom {
        padding: 20px 15px 90px;
    }
    .footer-bottom-inner{flex-direction:column;text-align:center}
    .site-logo{max-width:140px}
    .header-social{display:none}
}
@media(max-width:480px){
    .stats-grid{grid-template-columns:1fr}
    .stat-item{border-right:none;border-bottom:1px solid #eee}
    .stat-item:last-child{border-bottom:none}
    .about-grid{gap:25px}
    .why-split{gap:25px}
}
@media(max-width:576px){
    .header-cta{display:none}
    .why-list { grid-template-columns: 1fr; gap: 16px; }
}


/* ===== Page Hero (Inner Pages) — Premium Redesign ===== */
.page-hero {
    position: relative;
    min-height: 520px;
    height: 70vh;
    display: flex;
    align-items: center;
    padding-top: 90px;
    padding-bottom: 40px;
    overflow: hidden;
    background: var(--color-dark);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), 0 100%);
}

/* Ken Burns background animation */
.page-hero-bg {
    position: absolute;
    inset: -20px;
    background-size: cover;
    background-position: center;
    animation: pageHeroKenBurns 25s ease-in-out infinite alternate;
    will-change: transform;
    z-index: 0;
}
@keyframes pageHeroKenBurns {
    0%   { transform: scale(1) translate(0, 0); }
    100% { transform: scale(1.12) translate(-1.5%, -1%); }
}

/* Multi-layered overlay for depth */
.page-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(135deg, rgba(24,24,27,0.88) 0%, rgba(24,24,27,0.6) 40%, rgba(24,24,27,0.45) 100%),
        radial-gradient(ellipse at 20% 50%, rgba(234,88,12,0.12) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 80%, rgba(234,88,12,0.06) 0%, transparent 50%);
}

/* Decorative corner accent */
.page-hero::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 350px;
    height: 350px;
    background: radial-gradient(circle at top right, rgba(234,88,12,0.10) 0%, transparent 70%);
    z-index: 2;
    pointer-events: none;
}
.page-hero::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 250px;
    height: 250px;
    background: radial-gradient(circle at bottom left, rgba(234,88,12,0.08) 0%, transparent 70%);
    z-index: 2;
    pointer-events: none;
}

/* Content area */
.page-hero-content {
    position: relative;
    z-index: 3;
    color: #fff;
    max-width: 720px;
}

/* Breadcrumb navigation */
.page-hero-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    font-size: 0.82rem;
    font-weight: 500;
    letter-spacing: 0.3px;
    opacity: 0;
    animation: phFadeSlideUp 0.6s ease 0.1s forwards;
}
.page-hero-breadcrumb a {
    color: rgba(255,255,255,0.55);
    text-decoration: none;
    transition: color var(--transition-fast);
}
.page-hero-breadcrumb a:hover { color: var(--color-primary); }
.page-hero-breadcrumb .breadcrumb-sep {
    color: rgba(255,255,255,0.3);
    font-size: 0.7rem;
}
.page-hero-breadcrumb .breadcrumb-current {
    color: var(--color-primary);
    font-weight: 600;
}

/* Hero badge - glassmorphism with glow */
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(234,88,12,0.12);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(234,88,12,0.25);
    padding: 8px 20px;
    border-radius: 12px;
    color: #fff;
    font-family: var(--font-heading);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    margin-bottom: 18px;
    box-shadow: 0 4px 20px rgba(234,88,12,0.15);
    opacity: 0;
    animation: phFadeSlideUp 0.6s ease 0.25s forwards;
}
.hero-badge svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--color-primary);
}

/* Title */
.page-hero-content h1 {
    color: #fff;
    font-size: clamp(1.9rem, 4.5vw, 3rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    margin-bottom: 16px;
    opacity: 0;
    animation: phFadeSlideUp 0.7s ease 0.4s forwards;
}

/* Description */
.page-hero-content p {
    color: rgba(255,255,255,0.7);
    font-size: clamp(0.95rem, 1.2vw, 1.1rem);
    line-height: 1.75;
    max-width: 600px;
    opacity: 0;
    animation: phFadeSlideUp 0.7s ease 0.55s forwards;
}

/* Decorative line accent under the content */
.page-hero-content::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--color-primary), transparent);
    border-radius: 12px;
    margin-top: 24px;
    opacity: 0;
    animation: phFadeSlideUp 0.5s ease 0.7s forwards;
}

/* Scroll indicator */
.page-hero-scroll {
    position: absolute;
    bottom: 60px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    opacity: 0;
    animation: phFadeIn 0.8s ease 1s forwards;
}
.page-hero-scroll-dot {
    width: 2px;
    height: 20px;
    border-radius: 12px;
    background: linear-gradient(180deg, var(--color-primary), transparent);
    animation: phScrollPulse 2s ease-in-out infinite;
}

/* Floating particles */
.page-hero-particle {
    position: absolute;
    border-radius: 50%;
    background: rgba(234,88,12,0.15);
    z-index: 2;
    pointer-events: none;
}
.page-hero-particle-1 {
    width: 6px; height: 6px;
    top: 25%; right: 15%;
    animation: phFloat 6s ease-in-out infinite;
}
.page-hero-particle-2 {
    width: 4px; height: 4px;
    top: 60%; right: 25%;
    animation: phFloat 8s ease-in-out 1s infinite;
}
.page-hero-particle-3 {
    width: 8px; height: 8px;
    top: 40%; right: 10%;
    animation: phFloat 7s ease-in-out 2s infinite;
    opacity: 0.6;
}

/* Animations */
@keyframes phFadeSlideUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes phFadeIn {
    from { opacity: 0; }
    to   { opacity: 0.6; }
}
@keyframes phScrollPulse {
    0%, 100% { opacity: 0.3; transform: scaleY(1); }
    50%      { opacity: 1; transform: scaleY(1.5); }
}
/* Multi-layered overlay for depth */
.page-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(135deg, rgba(24,24,27,0.88) 0%, rgba(24,24,27,0.6) 40%, rgba(24,24,27,0.45) 100%),
        radial-gradient(ellipse at 20% 50%, rgba(234,88,12,0.12) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 80%, rgba(234,88,12,0.06) 0%, transparent 50%);
}

/* Decorative corner accent */
.page-hero::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 350px;
    height: 350px;
    background: radial-gradient(circle at top right, rgba(234,88,12,0.10) 0%, transparent 70%);
    z-index: 2;
    pointer-events: none;
}
.page-hero::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 250px;
    height: 250px;
    background: radial-gradient(circle at bottom left, rgba(234,88,12,0.08) 0%, transparent 70%);
    z-index: 2;
    pointer-events: none;
}

/* Content area */
.page-hero-content {
    position: relative;
    z-index: 3;
    color: #fff;
    max-width: 720px;
}

/* Breadcrumb navigation */
.page-hero-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    font-size: 0.82rem;
    font-weight: 500;
    letter-spacing: 0.3px;
    opacity: 0;
    animation: phFadeSlideUp 0.6s ease 0.1s forwards;
}
.page-hero-breadcrumb a {
    color: rgba(255,255,255,0.55);
    text-decoration: none;
    transition: color var(--transition-fast);
}
.page-hero-breadcrumb a:hover { color: var(--color-primary); }
.page-hero-breadcrumb .breadcrumb-sep {
    color: rgba(255,255,255,0.3);
    font-size: 0.7rem;
}
.page-hero-breadcrumb .breadcrumb-current {
    color: var(--color-primary);
    font-weight: 600;
}

/* Hero badge - glassmorphism with glow */
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(234,88,12,0.12);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(234,88,12,0.25);
    padding: 8px 20px;
    border-radius: 12px;
    color: #fff;
    font-family: var(--font-heading);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    margin-bottom: 18px;
    box-shadow: 0 4px 20px rgba(234,88,12,0.15);
    opacity: 0;
    animation: phFadeSlideUp 0.6s ease 0.25s forwards;
}
.hero-badge svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--color-primary);
}

/* Title */
.page-hero-content h1 {
    color: #fff;
    font-size: clamp(1.9rem, 4.5vw, 3rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    margin-bottom: 16px;
    opacity: 0;
    animation: phFadeSlideUp 0.7s ease 0.4s forwards;
}

/* Description */
.page-hero-content p {
    color: rgba(255,255,255,0.7);
    font-size: clamp(0.95rem, 1.2vw, 1.1rem);
    line-height: 1.75;
    max-width: 600px;
    opacity: 0;
    animation: phFadeSlideUp 0.7s ease 0.55s forwards;
}

/* Decorative line accent under the content */
.page-hero-content::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--color-primary), transparent);
    border-radius: 12px;
    margin-top: 24px;
    opacity: 0;
    animation: phFadeSlideUp 0.5s ease 0.7s forwards;
}

/* Scroll indicator */
.page-hero-scroll {
    position: absolute;
    bottom: 60px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    opacity: 0;
    animation: phFadeIn 0.8s ease 1s forwards;
}
.page-hero-scroll-dot {
    width: 2px;
    height: 20px;
    border-radius: 12px;
    background: linear-gradient(180deg, var(--color-primary), transparent);
    animation: phScrollPulse 2s ease-in-out infinite;
}

/* Floating particles */
.page-hero-particle {
    position: absolute;
    border-radius: 50%;
    background: rgba(234,88,12,0.15);
    z-index: 2;
    pointer-events: none;
}
.page-hero-particle-1 {
    width: 6px; height: 6px;
    top: 25%; right: 15%;
    animation: phFloat 6s ease-in-out infinite;
}
.page-hero-particle-2 {
    width: 4px; height: 4px;
    top: 60%; right: 25%;
    animation: phFloat 8s ease-in-out 1s infinite;
}
.page-hero-particle-3 {
    width: 8px; height: 8px;
    top: 40%; right: 10%;
    animation: phFloat 7s ease-in-out 2s infinite;
    opacity: 0.6;
}

/* Animations */
@keyframes phFadeSlideUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes phFadeIn {
    from { opacity: 0; }
    to   { opacity: 0.6; }
}
@keyframes phScrollPulse {
    0%, 100% { opacity: 0.3; transform: scaleY(1); }
    50%      { opacity: 1; transform: scaleY(1.5); }
}
@keyframes phFloat {
    0%, 100% { transform: translateY(0) translateX(0); opacity: 0.4; }
    50%      { transform: translateY(-15px) translateX(8px); opacity: 0.8; }
}

/* ===== Page Hero Responsive ===== */
@media(max-width:992px) {
    .page-hero { min-height: 460px; height: 60vh; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 25px), 0 100%); }
    .page-hero::before { width: 200px; height: 200px; }
    .page-hero::after { width: 150px; height: 150px; }
}
@media(max-width:768px) {
    .page-hero { min-height: 400px; height: 55vh; padding-top: 80px; padding-bottom: 35px; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 0 100%); }
    .page-hero-content h1 { font-size: clamp(1.5rem, 6vw, 2rem); }
    .page-hero-content p { font-size: 0.92rem; }
    .page-hero-scroll { bottom: 40px; }
    .page-hero-particle { display: none; }
    .page-hero-breadcrumb { font-size: 0.75rem; }
}
@media(max-width:480px) {
    .page-hero { min-height: 350px; height: 50vh; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 15px), 0 100%); }
    .page-hero-content::after { margin-top: 18px; }
    .page-hero-scroll { display: none; }
}

/* ===== Park / Destination Blocks ===== */
.park-block{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;margin-bottom:60px;padding-bottom:60px;border-bottom:1px solid var(--color-border)}
.park-block:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.park-block-reverse{direction:rtl}
.park-block-reverse>*{direction:ltr}
.park-images{border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow-md)}
.park-images img{width:100%;height:350px;object-fit:cover;transition:transform 0.6s ease}
.park-block:hover .park-images img{transform:scale(1.05)}
.park-content h3{font-size:1.6rem;margin-bottom:15px;color:var(--color-dark)}
.park-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0;padding:20px;background:var(--color-light-alt);border-radius:var(--radius-sm)}
.park-info-item{font-size:0.9rem;color:var(--color-text)}

/* ===== Village Detail Cards ===== */
.village-detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.village-detail-card{display:flex;background:var(--color-light);border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--color-border);transition:all var(--transition-normal)}
.village-detail-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-primary)}
.vd-img{width:220px;flex-shrink:0;overflow:hidden}
.vd-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.9s}
.village-detail-card:hover .vd-img img{transform:scale(1.1)}
.vd-content{padding:25px;display:flex;flex-direction:column;justify-content:center}
.vd-content h4{margin-bottom:10px}
.vd-content p{font-size:0.9rem;color:var(--color-text-muted);margin-bottom:15px}

/* ===== Specialty Tours ===== */
.specialty-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}
.specialty-card{background:#fff;border-radius:var(--radius-lg);overflow:hidden;border:1px solid #eee;transition:all 0.6s}
.specialty-card:hover{box-shadow:var(--shadow-lg);border-color:var(--color-primary)}
.sp-img img{width:100%;height:250px;object-fit:cover}
.sp-body{padding:30px}
.sp-body h3{margin-bottom:10px}
.sp-body p{color:var(--color-text-muted);font-size:0.95rem;margin-bottom:20px}

/* ===== Service Compare (Heritage) ===== */
.service-compare{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:900px;margin:0 auto}
.sc-card{background:#fff;border-radius:var(--radius-lg);padding:40px;border:1px solid #eee;text-align:center;transition:all 0.6s;position:relative}
.sc-card:hover{box-shadow:var(--shadow-md)}
.sc-card-featured{border-color:var(--color-primary);box-shadow:var(--shadow-md)}
.sc-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--color-primary);color:#fff;padding:5px 20px;border-radius: 12px;font-size:0.8rem;font-weight:700}
.sc-icon{font-size:3rem;margin-bottom:15px;display:flex;align-items:center;justify-content:center;color:var(--color-primary)}
.sc-icon svg{width:48px;height:48px;stroke:var(--color-primary)}
.sc-card h3{margin-bottom:10px}
.sc-card p{color:var(--color-text-muted);font-size:0.95rem;margin-bottom:20px}
.sc-list{text-align:left;margin-bottom:25px}
.sc-list li{padding:8px 0;font-size:0.9rem;border-bottom:1px solid #f5f5f5}

/* ===== Contact Page ===== */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.contact-cards{display:flex;flex-direction:column;gap:15px;margin-top:25px}
.c-card{display:flex;align-items:center;gap:15px;padding:18px;background:#fff;border-radius:var(--radius-sm);border:1px solid #eee;transition:all 0.6s;text-decoration:none;color:var(--color-text)}
.c-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-sm)}
.c-icon{width:48px;height:48px;background:var(--color-primary-light);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;color:var(--color-primary)}
.c-icon svg{width:28px;height:28px;stroke:var(--color-primary)}
.c-card h4{margin:0 0 3px;font-size:0.95rem}
.c-card p{margin:0;font-size:0.85rem;color:var(--color-text-muted)}
.contact-form-wrap{background:#fff;border-radius:var(--radius-lg);padding:40px;border:1px solid #eee;box-shadow:var(--shadow-sm)}
.contact-form-wrap h3{margin-bottom:25px}
.form-group{margin-bottom:18px}
.form-group label{display:block;font-weight:600;font-size:0.9rem;margin-bottom:6px;color:var(--color-dark)}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 16px;border:1px solid #ddd;border-radius:var(--radius-sm);font-family:var(--font-body);font-size:0.95rem;transition:border-color 0.6s;background:#fff}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(234,88,12,0.1)}
.map-section{width:100%}

/* ===== Inner Pages Responsive ===== */
@media(max-width:992px){
    .park-block{grid-template-columns:1fr}
    .park-block-reverse{direction:ltr}
    .village-detail-grid,.specialty-grid,.service-compare,.contact-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
    .village-detail-card{flex-direction:column}
    .vd-img{width:100%;height:200px}
}

/* ===== Floating WhatsApp & Scroll to Top ===== */
.whatsapp-float {
    position: fixed !important;
    bottom: 100px !important;
    right: 30px !important;
    width: 60px;
    height: 60px;
    background-color: #25d366;
    color: #fff;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 25px rgba(37,211,102,0.35);
    z-index: 1000;
    transition: all 0.6s ease;
}
.whatsapp-float:hover {
    transform: translateY(-4px) scale(1.05);
    box-shadow: 0 15px 35px rgba(37,211,102,0.45);
}

.scroll-to-top {
    position: fixed !important;
    bottom: 30px !important;
    right: 30px !important;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--color-light);
    border: none;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.scroll-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.scroll-to-top:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(234,88,12,0.3);
    background: var(--color-primary);
}
.scroll-to-top:hover .stt-icon {
    color: #fff;
    transform: translateY(-2px);
}
.scroll-to-top:hover .progress-ring__circle {
    stroke: rgba(255,255,255,0.4);
}
.progress-ring {
    position: absolute;
    top: 0;
    left: 0;
    transform: rotate(-90deg);
    pointer-events: none;
}
.progress-ring__circle {
    transition: stroke-dashoffset 0.15s ease, stroke 0.6s ease;
}
.stt-icon {
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.6s ease;
}

@media(max-width:768px) {
    .whatsapp-float {
        bottom: 90px !important;
        right: 20px !important;
        width: 52px;
        height: 52px;
    }
    .scroll-to-top {
        bottom: 20px !important;
        right: 20px !important;
        width: 44px;
        height: 44px;
    }
    .progress-ring {
        width: 44px;
        height: 44px;
    }
    .progress-ring__circle {
        r: 18;
        cx: 22;
        cy: 22;
    }
}

/* ===== BLOG STYLES ===== */

/* Blog Layout: Main + Sidebar */
.blog-layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 40px;
    align-items: start;
}

/* Blog Grid */
.blog-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}
.blog-grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

/* Blog Card */
.blog-card {
    background: #fff;
    border-radius: var(--radius-sm);
    overflow: hidden;
    border: 1px solid #eee;
    transition: transform 0.6s, box-shadow 0.6s;
}
.blog-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}
.blog-card-img {
    display: block;
    aspect-ratio: 16/10;
    overflow: hidden;
    position: relative;
}
.blog-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.9s;
}
.blog-card:hover .blog-card-img img { transform: scale(1.05); }
.blog-card-cat {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--color-primary);
    color: #fff;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.blog-card-body { padding: 20px; }
.blog-card-meta {
    display: flex;
    gap: 15px;
    margin-bottom: 10px;
    font-size: 0.78rem;
    color: var(--color-text-muted);
}
.blog-card-title { font-size: 1.05rem; margin-bottom: 8px; line-height: 1.4; }
.blog-card-title a { color: var(--color-dark); text-decoration: none; transition: color 0.6s; }
.blog-card-title a:hover { color: var(--color-primary); }
.blog-card-excerpt { font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.6; margin-bottom: 12px; }
.blog-card-link {
    font-size: 0.83rem;
    font-weight: 600;
    color: var(--color-primary);
    text-decoration: none;
    transition: gap 0.6s;
    display: inline-flex;
    align-items: center;
}
.blog-card-link:hover { text-decoration: underline; }

/* Blog Sidebar */
.blog-sidebar { position: sticky; top: 100px; }
.sidebar-widget {
    background: #fff;
    border: 1px solid #eee;
    border-radius: var(--radius-sm);
    padding: 25px;
    margin-bottom: 20px;
}
.sidebar-widget-title {
    font-size: 0.9rem;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--color-primary);
    color: var(--color-dark);
}
.sidebar-cat-list { list-style: none; padding: 0; margin: 0; }
.sidebar-cat-list li { margin-bottom: 0; }
.sidebar-cat-list li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    font-size: 0.85rem;
    color: var(--color-text);
    text-decoration: none;
    border-bottom: 1px solid #f5f5f5;
    transition: color 0.6s;
}
.sidebar-cat-list li a:hover { color: var(--color-primary); }
.cat-count {
    background: var(--color-light-alt);
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.72rem;
    color: var(--color-text-muted);
}

/* Sidebar Popular Posts */
.sidebar-post-item {
    display: flex;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #f5f5f5;
    text-decoration: none;
    transition: opacity 0.6s;
}
.sidebar-post-item:hover { opacity: 0.8; }
.sp-thumb { width: 60px; height: 60px; border-radius: 12px; overflow: hidden; flex-shrink: 0; }
.sp-thumb img { width: 100%; height: 100%; object-fit: cover; }
.sp-info h5 { font-size: 0.82rem; margin-bottom: 4px; color: var(--color-dark); line-height: 1.3; }
.sp-info span { font-size: 0.72rem; color: var(--color-text-muted); }

/* Sidebar CTA */
.sidebar-cta {
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
    color: #fff;
    text-align: center;
    border: none;
}

/* Single Post Specifics */
.post-tags {
    margin-top: 40px;
    padding-top: 25px;
    border-top: 1px solid #eee;
}
.post-tag {
    display: inline-block;
    background: var(--color-light-alt);
    color: var(--color-text-muted);
    font-size: 0.8rem;
    padding: 4px 12px;
    border-radius: 12px;
    margin-right: 8px;
    margin-bottom: 8px;
    transition: all 0.6s;
}
.post-tag:hover {
    background: var(--color-primary);
    color: #fff;
}

.author-box {
    margin-top: 40px;
    padding: 30px;
    background: var(--color-light-alt);
    border-radius: var(--radius-sm);
    display: flex;
    gap: 20px;
    align-items: center;
}
.author-avatar {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.post-nav {
    margin-top: 40px;
    display: flex;
    gap: 20px;
    justify-content: space-between;
}
.post-nav-item {
    flex: 1;
    padding: 20px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: var(--radius-sm);
    text-decoration: none;
    transition: transform 0.6s, box-shadow 0.6s;
}
.post-nav-item:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-sm);
}

.blog-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 80px 20px;
    background: #fff;
    border-radius: var(--radius-sm);
    border: 1px dashed #ddd;
}

/* Single Post Content */
.post-content-wrapper {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 50px;
    align-items: start;
}
.post-hero {
    position: relative;
    height: 70vh;
    min-height: 520px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
}
.post-hero-meta {
    display: flex;
    gap: 20px;
    margin-top: 15px;
    font-size: 0.85rem;
    color: rgba(255,255,255,0.8);
}
.post-content {
    font-size: 1.05rem;
    line-height: 1.8;
    color: var(--color-text);
}
.post-content h2 {
    font-size: 1.6rem;
    margin-top: 40px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--color-light-alt);
}
.post-content h3 { font-size: 1.3rem; margin-top: 30px; margin-bottom: 12px; }
.post-content p { margin-bottom: 20px; }
.post-content img { max-width: 100%; height: auto; border-radius: var(--radius-sm); margin: 20px 0; }
.post-content ul, .post-content ol { padding-left: 25px; margin-bottom: 20px; }
.post-content li { margin-bottom: 8px; }
.post-content blockquote {
    border-left: 4px solid var(--color-primary);
    padding: 15px 25px;
    margin: 25px 0;
    background: var(--color-light-alt);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    font-style: italic;
    color: var(--color-text-muted);
}

/* Post Tags */
.post-tag {
    display: inline-block;
    padding: 4px 14px;
    background: var(--color-light-alt);
    border-radius: 12px;
    font-size: 0.78rem;
    color: var(--color-text-muted);
    text-decoration: none;
    margin: 3px;
    transition: all 0.6s;
}
.post-tag:hover { background: var(--color-primary); color: #fff; }

/* Post Navigation */
.post-nav-item {
    padding: 15px 20px;
    background: var(--color-light-alt);
    border-radius: var(--radius-sm);
    text-decoration: none;
    transition: background 0.6s;
}
.post-nav-item:hover { background: #eee; }

/* Share Buttons */
.share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    transition: transform 0.6s, opacity 0.6s;
}
.share-btn:hover { transform: scale(1.1); opacity: 0.9; }

/* Blog Pagination */
.blog-pagination { text-align: center; }
.blog-pagination .nav-links { display: flex; justify-content: center; gap: 5px; flex-wrap: wrap; }
.blog-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #ddd;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    color: var(--color-text);
    text-decoration: none;
    transition: all 0.6s;
}
.blog-pagination .page-numbers:hover,
.blog-pagination .page-numbers.current {
    background: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
}

/* Blog Responsive */
@media(max-width: 992px) {
    .blog-layout { grid-template-columns: 1fr; }
    .post-content-wrapper { grid-template-columns: 1fr; }
    .blog-sidebar { position: static; }
}
@media(max-width: 768px) {
    .blog-grid { grid-template-columns: 1fr; }
    .blog-grid-3 { grid-template-columns: 1fr; }
    .post-hero { height: 55vh; min-height: 400px; }
    .post-hero-meta { flex-wrap: wrap; gap: 10px; }
}

/* ===== About Page Enhanced Styles ===== */

/* About Story Grid */
.about-story-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.about-story-grid-reverse { direction: rtl; }
.about-story-grid-reverse > * { direction: ltr; }
.about-story-text h2 { margin-bottom: 20px; }
.about-story-text p { color: var(--color-text); font-size: 1rem; line-height: 1.8; }

/* Enhanced Image Frame */
.about-story-img-wrap { position: relative; }
.about-story-img-frame { position: relative; border-radius: var(--radius-sm); overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,0.15); }
.about-story-img-frame img { width: 100%; height: 450px; object-fit: cover; display: block; transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1); }
.about-story-img-wrap:hover .about-story-img-frame img { transform: scale(1.05); }
.about-img-accent { position: absolute; top: -12px; right: -12px; width: 100%; height: 100%; border: 3px solid var(--color-primary); border-radius: var(--radius-sm); z-index: -1; transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); }
.about-story-img-wrap:hover .about-img-accent { top: -16px; right: -16px; }
.about-img-accent-alt { top: -12px; right: auto; left: -12px; }
.about-story-img-wrap:hover .about-img-accent-alt { top: -16px; right: auto; left: -16px; }

/* Floating Experience Badge */
.about-story-badge { position: absolute; bottom: -20px; left: -20px; background: var(--color-primary); color: #fff; padding: 20px 25px; border-radius: var(--radius-sm); box-shadow: 0 10px 30px rgba(234, 88, 12, 0.4); z-index: 2; text-align: center; animation: float 4s ease-in-out infinite; }
.about-badge-num { display: block; font-family: var(--font-heading); font-size: 2.2rem; font-weight: 700; line-height: 1; }
.about-badge-text { display: block; font-size: 0.8rem; font-weight: 500; margin-top: 4px; opacity: 0.9; line-height: 1.3; }

/* About Stats Section */
.about-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; text-align: center; padding: 20px 0; }
.about-stat { padding: 10px; }
.about-stat-num { display: block; font-family: var(--font-heading); font-size: 2.8rem; font-weight: 700; color: var(--color-primary); line-height: 1; margin-bottom: 10px; }
.about-stat-label { display: block; font-size: 1rem; color: rgba(255,255,255,0.7); letter-spacing: 0.5px; }

/* About Feature Cards */
.about-feature-card { background: var(--color-light); border-radius: var(--radius-sm); padding: 35px 25px; text-align: center; border: 1px solid var(--color-border); transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); box-shadow: var(--shadow-sm); position: relative; overflow: hidden; }
.about-feature-card::before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background: var(--color-primary); transform: scaleX(0); transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1); }
.about-feature-card:hover { transform: translateY(-8px); box-shadow: var(--shadow-lg); border-color: var(--color-primary); }
.about-feature-card:hover::before { transform: scaleX(1); }
.about-fc-icon { width: 70px; height: 70px; background: var(--color-primary-light); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; color: var(--color-primary); transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); }
.about-feature-card:hover .about-fc-icon { background: var(--color-primary); color: #fff; transform: scale(1.1); }
.about-feature-card:hover .about-fc-icon svg { stroke: #fff; }
.about-fc-icon svg { transition: stroke 0.5s; }
.about-feature-card h4 { margin-bottom: 12px; font-size: 1.05rem; color: var(--color-dark); }
.about-feature-card p { color: var(--color-text-muted); font-size: 0.9rem; line-height: 1.7; margin: 0; }

/* Features Grid */
.features-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 40px; }

/* Mission List */
.mission-list { list-style: none; margin-top: 24px; }
.mission-list li { margin-bottom: 16px; padding-left: 34px; position: relative; color: var(--color-text); font-size: 1rem; line-height: 1.7; }
.mission-list li::before { content: '✓'; position: absolute; left: 0; top: 1px; color: #fff; font-weight: bold; font-size: 0.75rem; width: 22px; height: 22px; background: var(--color-primary); border-radius: 50%; display: flex; align-items: center; justify-content: center; }

/* Legacy card compat */
.info-card { background: var(--color-light-alt); border-radius: var(--radius-sm); padding: 25px; transition: all var(--transition-normal); border: 1px solid var(--color-border); }
.info-card:hover { box-shadow: var(--shadow-sm); border-color: var(--color-primary); }

/* General Cards */
.feature-card { background: var(--color-light); border-radius: var(--radius-md); padding: 30px; border: 1px solid var(--color-border); transition: all var(--transition-normal); box-shadow: var(--shadow-sm); position: relative; overflow: hidden; }
.feature-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); border-color: var(--color-primary-light); }
.team-card { background: var(--color-light-alt); border-radius: var(--radius-sm); overflow: hidden; transition: all var(--transition-normal); border: 1px solid var(--color-border); }
.team-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.team-img { width: 100%; height: 280px; object-fit: cover; }
.team-info { padding: 25px; text-align: center; }
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }

@media(max-width: 992px) {
    .about-story-grid { grid-template-columns: 1fr; gap: 50px; }
    .about-story-grid-reverse { direction: ltr; }
    .features-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .about-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; }
    .team-grid { grid-template-columns: repeat(2, 1fr); }
}
@media(max-width: 768px) {
    .features-grid-4 { grid-template-columns: 1fr; }
    .about-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
    .about-stat-num { font-size: 2rem; }
    .about-story-img-frame img { height: 320px; }
    .about-img-accent { display: none; }
    .about-story-badge { bottom: -20px; left: auto; right: 20px; transform: none; padding: 15px 20px; }
    .about-story-img-wrap { margin-bottom: 30px; }
    .team-grid { grid-template-columns: 1fr; }
    .includes-grid, .tips-grid { grid-template-columns: 1fr; }
}


/* Includes / Tips Grids */
.includes-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 40px; }
.tips-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 40px; }
.icon-card { display: flex; align-items: flex-start; gap: 15px; background: var(--color-light-alt); padding: 25px; border-radius: var(--radius-md); transition: all 0.4s ease; border: 1px solid var(--color-border); }
.icon-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); background: #fff; border-color: var(--color-primary-light); }
.icon-card-centered { text-align: center; padding: 35px 25px; background: var(--color-light-alt); border-radius: var(--radius-md); transition: all 0.4s ease; border: 1px solid var(--color-border); }
.icon-card-centered:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); background: #fff; border-color: var(--color-primary-light); }

/* Dark Section Support for Icon Cards */
.bg-dark-section .icon-card,
.bg-dark-section .icon-card-centered {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.1);
}
.bg-dark-section .icon-card:hover,
.bg-dark-section .icon-card-centered:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--color-primary);
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.bg-dark-section .icon-card h4,
.bg-dark-section .icon-card-centered h4 {
    color: #fff !important;
}
.bg-dark-section .icon-card p,
.bg-dark-section .icon-card-centered p {
    color: rgba(255, 255, 255, 0.7) !important;
}

@media(max-width: 992px) {
    .includes-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Season Timeline */
.season-timeline { display: flex; gap: 30px; margin-top: 30px; }
.season-item { flex: 1; background: #fff; padding: 30px; border-radius: var(--radius-sm); border: 1px solid var(--color-border); position: relative; box-shadow: var(--shadow-sm); }
.season-badge { position: absolute; top: -12px; left: 20px; background: var(--color-primary); color: #fff; padding: 4px 12px; border-radius: 12px; font-size: 0.8rem; font-weight: bold; }
@media(max-width: 768px) { .season-timeline { flex-direction: column; } }

/* Section Intros */
.section-intro { margin-bottom: 50px; }
.section-intro-text { max-width: 650px; margin: 0 auto; color: var(--color-text-muted); font-size: 1.05rem; line-height: 1.6; }

/* ===== FAQ Components ===== */
.faq-item-wrap { background: #fff; border-radius: var(--radius-sm); margin-bottom: 12px; border: 1px solid var(--color-border); overflow: hidden; transition: all 0.6s; }
.faq-question { width: 100%; padding: 20px 24px; display: flex; justify-content: space-between; align-items: center; background: none; border: none; cursor: pointer; font-family: var(--font-heading); font-size: 1rem; font-weight: 600; color: var(--color-dark); text-align: left; gap: 15px; transition: color 0.6s; }
.faq-question:hover { color: var(--color-primary); }
.faq-chevron { flex-shrink: 0; transition: transform 0.6s; }
.faq-answer-wrap { max-height: 0; overflow: hidden; transition: max-height 0.8s ease, padding 0.6s ease; }
.faq-answer-content { padding: 0 24px 20px; margin: 0; color: var(--color-text-muted); font-size: 0.95rem; line-height: 1.7; }
.faq-open { border-color: var(--color-primary) !important; box-shadow: var(--shadow-sm); }
.faq-open .faq-chevron { transform: rotate(180deg); color: var(--color-primary); }
.faq-open .faq-answer-wrap { max-height: 500px !important; }

/* ===== Gallery Components ===== */
.gallery-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 40px; }
.gallery-tab { padding: 10px 24px; border: 2px solid var(--color-border); border-radius: 12px; background: none; cursor: pointer; font-family: var(--font-body); font-size: 0.9rem; font-weight: 500; color: var(--color-text-muted); transition: all 0.6s; }
.gallery-tab:hover, .gallery-tab.active { border-color: var(--color-primary); color: var(--color-primary); background: rgba(234, 88, 12, 0.05); }

.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.gallery-item { position: relative; border-radius: var(--radius-sm); overflow: hidden; aspect-ratio: 4/3; cursor: pointer; transition: transform 0.6s, opacity 0.8s; }
.gallery-item.hidden { display: none; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.9s; }
.gallery-item:hover img { transform: scale(1.08); }
.gallery-overlay { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px; background: linear-gradient(transparent, rgba(0,0,0,0.8)); color: #fff; transform: translateY(100%); transition: transform 0.8s; }
.gallery-item:hover .gallery-overlay { transform: translateY(0); }
.gallery-category { display: inline-block; background: var(--color-primary); color: #fff; padding: 3px 10px; border-radius: 12px; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; margin-bottom: 6px; }
.gallery-overlay p { margin: 0; font-size: 0.85rem; opacity: 0.9; }

@media(max-width: 768px) {
    .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}
@media(max-width: 480px) {
    .gallery-grid { grid-template-columns: 1fr; }
}

/* Lightbox */
.gallery-lightbox{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,0.92);display:none;align-items:center;justify-content:center;opacity:0;transition:opacity 0.6s;backdrop-filter:blur(5px)}
.gallery-lightbox.active{display:flex;opacity:1}
.gallery-lightbox img{max-width:90vw;max-height:85vh;object-fit:contain;border-radius:var(--radius-sm);box-shadow:0 20px 60px rgba(0,0,0,0.5)}
.gallery-lightbox .lb-caption{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);color:#fff;font-size:0.9rem;text-align:center;max-width:600px;opacity:0.85}
.gallery-lightbox .lb-close{position:absolute;top:25px;right:30px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.25);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.5rem;transition:all 0.6s;backdrop-filter:blur(8px)}
.gallery-lightbox .lb-close:hover{background:var(--color-primary);border-color:var(--color-primary)}

/* ===== Premium Safari/Tour Blocks ===== */
.premium-tour-block {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 70px;
    align-items: center;
    margin-bottom: 90px;
    padding: 0;
}
.premium-tour-block:last-child {
    margin-bottom: 0;
}
.premium-tour-block.reverse {
    /* Swap column widths */
    grid-template-columns: 1fr 1.1fr;
}
.premium-tour-block.reverse .premium-gallery {
    order: 2;
}
.premium-tour-block.reverse .premium-tour-content {
    order: 1;
    padding-right: 40px; /* Add spacing when content is on the left */
}
.premium-gallery {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    grid-template-rows: 220px 220px;
    gap: 16px;
    width: 100%;
}
.pg-img {
    position: relative;
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}
.pg-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s ease;
}
.pg-img:hover img {
    transform: scale(1.08);
}
.pg-main-img {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.pg-sub-img-1 {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    width: 100%;
    height: 100%;
    z-index: 1;
    border: none;
}
.pg-sub-img-2 {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 1;
    box-shadow: var(--shadow-sm);
}

/* Reversing for alternate blocks */
.premium-tour-block.reverse .premium-gallery {
    grid-template-columns: 1fr 1.5fr;
}
.premium-tour-block.reverse .premium-gallery .pg-main-img {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
}
.premium-tour-block.reverse .premium-gallery .pg-sub-img-1 {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
}
.premium-tour-block.reverse .premium-gallery .pg-sub-img-2 {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
}
.premium-tour-content {
    padding: 10px 0;
}
.premium-tour-content h3 {
    font-size: clamp(1.75rem, 3vw, 2.2rem);
    margin-bottom: 20px;
}
.premium-tour-block.reverse .premium-tour-content {
    text-align: right;
}
.premium-tour-content p {
    color: var(--color-text);
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 20px;
}
.tour-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 25px;
    padding-top: 25px;
    border-top: 1px solid var(--color-border);
}
.tour-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: rgba(234, 88, 12, 0.08);
    color: var(--color-primary);
    border-radius: 50px;
    font-size: 0.8rem;
    font-weight: 500;
    transition: all 0.3s ease;
}
.tour-tag:hover {
    background: var(--color-primary);
    color: #fff;
}
.tour-tag svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

@media(max-width: 992px) {
    .premium-tour-block {
        grid-template-columns: 1fr;
        gap: 40px;
        margin-bottom: 70px;
    }
    .premium-tour-block.reverse {
        grid-template-columns: 1fr;
    }
    .premium-tour-block.reverse .premium-gallery {
        order: unset;
    }
    .premium-tour-block.reverse .premium-tour-content {
        order: unset;
        text-align: left;
        padding-right: 0;
    }
    .premium-gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 200px 200px;
        height: auto;
        max-width: 100%;
        margin: 0;
    }
    .pg-main-img { 
        grid-column: 1 / 3;
        grid-row: 1 / 2;
        width: 100%; height: 100%; 
    }
    .pg-sub-img-1 { 
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        width: 100%; height: 100%; 
    }
    .pg-sub-img-2 { 
        display: block; 
        grid-column: 2 / 3;
        grid-row: 2 / 3;
        width: 100%; height: 100%; 
    }
    .premium-tour-block.reverse .premium-gallery {
        grid-template-columns: 1fr 1fr;
    }
    .premium-tour-block.reverse .premium-gallery .pg-main-img {
        grid-column: 1 / 3;
        grid-row: 1 / 2;
    }
    .premium-tour-block.reverse .premium-gallery .pg-sub-img-1 {
        grid-column: 1 / 2;
        grid-row: 2 / 3;
    }
    .premium-tour-block.reverse .premium-gallery .pg-sub-img-2 {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
    }
}
@media(max-width: 576px) {
    .premium-gallery { grid-template-rows: 180px 180px; gap: 10px; }
    .pg-main-img { height: auto; }
    .pg-sub-img-1 { height: auto; border-width: 4px; }
    .premium-info-grid { grid-template-columns: 1fr; gap: 12px; }
}

/* =======================================================
   Additional Mobile UI Fixes (Overriding Previous Rules) 
   ======================================================= */
@media (max-width: 992px) {
    /* Fix Footer UI for Accordion */
    .footer-grid { grid-template-columns: 1fr; gap: 20px; }
    .hide-on-mobile { display: none !important; }
    .footer-widget {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .footer-social { justify-content: center; }
    .widget-title { margin-bottom: 12px; }
    .widget-title::after { left: 50%; transform: translateX(-50%); }
    .footer-contact-list li {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 8px;
    }
    .footer-bottom { padding: 20px 15px 90px; }
    .footer-bottom-inner { flex-direction: column; text-align: center; }
    .site-logo { max-width: 140px; }
    .header-social { display: none; }
    
    /* Mobile Footer Accordion */
    .footer-collapsible .footer-collapse-content {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.4s ease, opacity 0.4s ease;
        opacity: 0;
        margin-top: 0;
    }
    .footer-collapsible.is-open .footer-collapse-content {
        max-height: 500px;
        opacity: 1;
        margin-top: 15px;
    }
    .footer-toggle-title {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }
    .footer-chevron { transition: transform 0.4s ease; }
    .footer-collapsible.is-open .footer-chevron { transform: rotate(180deg); }

    /* Village Grid Card Content (Always visible on mobile) */
    .village-card h4 { transform: translateY(0); margin-bottom: 12px; color: var(--color-primary); }
    .village-card .vc-desc-wrap { max-height: 150px; opacity: 1; transform: translateY(0); }
    .village-card .vc-overlay { background: linear-gradient(0deg, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.7) 100%); }
}

@media (max-width: 768px) {
    /* Fix why-image height being too tall */
    .why-image { min-height: 350px; }
    .why-image img { height: 100%; aspect-ratio: unset; border-radius: var(--radius-sm); }
    
    /* Fix about feature cards spacing */
    .about-feature-card { padding: 25px 20px; }
    
    /* Fix icon cards padding */
    .icon-card, .icon-card-centered { padding: 20px 15px; }
    
    /* Fix CTA block padding */
    .cta-inner { padding: 35px 20px; width: calc(100% - 20px); }
    
    /* Fix premium tour tags squashing */
    .tour-tags { gap: 6px; margin-top: 20px; padding-top: 20px; }
    .tour-tag { font-size: 0.75rem; padding: 4px 10px; }
    
    /* Fix FAQ accordion padding */
    .faq-question { padding: 15px 20px; font-size: 0.95rem; }
    .faq-answer-content { padding: 0 20px 15px; font-size: 0.9rem; }

    /* Fix Home page Tour Cards padding */
    .tour-card-body { padding: 20px 15px; }
}
@media (max-width: 768px) { .hero-v2 { padding-bottom: 80px !important; } } @media (max-width: 992px) { .about-story-img-wrap { margin-bottom: 30px !important; } .about-story-badge { bottom: -20px !important; left: auto !important; right: 20px !important; transform: none !important; padding: 15px 20px !important; } } @media (max-width: 480px) { .stats-grid { grid-template-columns: repeat(2, 1fr) !important; } .stat-item { border-right: 1px solid #eee !important; border-bottom: 1px solid #eee !important; } .stat-item:nth-child(2n) { border-right: none !important; } .stat-item:nth-child(3), .stat-item:nth-child(4) { border-bottom: none !important; } }
@media (max-width: 768px) { .about-images { margin-bottom: 25px !important; } }

/* PREMIUM ABOUT IMAGES REDESIGN */
.about-images { position: relative; padding-right: 25px; padding-bottom: 25px; margin-bottom: 0 !important; }
.about-img-main { position: relative; z-index: 1; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
.about-img-main img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; border-radius: 20px; }
.about-img-float { position: absolute !important; bottom: 0 !important; right: 0 !important; width: 45% !important; max-width: 220px !important; border-radius: 16px !important; overflow: hidden !important; border: 8px solid #fff !important; box-shadow: 0 15px 40px rgba(0,0,0,0.15) !important; z-index: 2 !important; }
.about-img-float img { width: 100% !important; height: 100% !important; aspect-ratio: 1/1 !important; object-fit: cover !important; }

@media (max-width: 768px) {
    .about-images { padding-right: 15px; padding-bottom: 15px; margin-bottom: 30px !important; }
    .about-img-main { border-radius: 16px; }
    .about-img-main img { border-radius: 16px; }
    .about-img-float { border-radius: 12px !important; border-width: 6px !important; width: 50% !important; }
}


/* === CRITICAL: Tips/Includes grid mobile override (fixes cascade order issue) === */
@media (max-width: 768px) {
    .tips-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
    .includes-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
    .info-card { padding: 20px !important; }
}


/* === MOBILE FLOATING BUTTONS  FINAL FIX === */
@media (max-width: 768px) {
    .whatsapp-float {
        bottom: 80px !important;
        right: 16px !important;
        width: 48px !important;
        height: 48px !important;
        border-radius: 14px !important;
        z-index: 999 !important;
    }
    .whatsapp-float svg {
        width: 24px !important;
        height: 24px !important;
    }
    .scroll-to-top {
        bottom: 20px !important;
        right: 16px !important;
        width: 42px !important;
        height: 42px !important;
        z-index: 999 !important;
    }
    .scroll-to-top .progress-ring {
        width: 42px !important;
        height: 42px !important;
    }
    
    .scroll-to-top .stt-icon svg {
        width: 16px !important;
        height: 16px !important;
    }
}


/* === MOBILE INTERACTIVE CARDS FIX (Revert to Desktop Hover Behavior) === */
@media (max-width: 992px) {
    /* Revert Village Card to interactive (hidden until hover) */
    .village-card h4 { transform: translateY(20px) !important; margin-bottom: 0 !important; color: #fff !important; }
    .village-card .vc-desc-wrap { max-height: 0 !important; opacity: 0 !important; transform: translateY(10px) !important; }
    .village-card .vc-overlay { background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0) 100%) !important; }

    /* Village Card Hover/Active (Mobile Tap) */
    .village-card:hover h4, .village-card:active h4 { transform: translateY(0) !important; margin-bottom: 12px !important; color: var(--color-primary) !important; }
    .village-card:hover .vc-desc-wrap, .village-card:active .vc-desc-wrap { max-height: 150px !important; opacity: 1 !important; transform: translateY(0) !important; }
    .village-card:hover .vc-overlay, .village-card:active .vc-overlay { background: linear-gradient(0deg, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.7) 100%) !important; }

    /* Revert Heritage Card */
    .heritage-card-overlay h4 { transform: translateY(10px) !important; }
    .heritage-card-overlay p, .heritage-link { opacity: 0 !important; transform: translateY(20px) !important; }
    .heritage-card .heritage-card-overlay { background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,0.9) 100%) !important; }

    /* Heritage Card Hover/Active */
    .heritage-card:hover .heritage-card-overlay, .heritage-card:active .heritage-card-overlay { background: linear-gradient(180deg, rgba(234,88,12,0.2) 0%, rgba(0,0,0,0.95) 100%) !important; }
    .heritage-card:hover .heritage-card-overlay h4, .heritage-card:active .heritage-card-overlay h4 { transform: translateY(0) !important; }
    .heritage-card:hover .heritage-card-overlay p, .heritage-card:hover .heritage-link,
    .heritage-card:active .heritage-card-overlay p, .heritage-card:active .heritage-link { opacity: 1 !important; transform: translateY(0) !important; }
}


/* Fix horizontal overflow on desktop testimonials */
@media (min-width: 993px) {
    .testimonials-grid {
        overflow-x: auto !important;
    }
}


/* === Disable Testimonial Card Hover Jump on Mobile === */
@media (max-width: 992px) {
    .testimonial-card:hover, .testimonial-card:active {
        transform: none !important;
    }
}


/* YouTube Background Video */
.cta-section { position: relative; overflow: hidden; }
.youtube-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw !important;
    height: 56.25vw !important; /* 16:9 Aspect Ratio */
    min-height: 100vh !important;
    min-width: 177.77vh !important; /* 16:9 Aspect Ratio */
    max-width: none !important;
    max-height: none !important;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 0;
    border: 0;
}


/* Prevent vertical scroll trapping on testimonials grid */
.testimonials-grid {
    overflow-y: hidden !important;
    overscroll-behavior-y: auto;
}



/* Hide Scroll-to-Top Progress Ring on Mobile */
@media (max-width: 992px) {
    .scroll-to-top .progress-ring {
        display: none !important;
    }
}


/* ========== HOME PAGE IMAGE CAROUSEL ========== */
.home-carousel-section {
    position: relative;
    padding: 0;
    background: var(--color-light-alt);
    overflow: hidden;
}

.carousel-track-wrapper {
    overflow: hidden;
    padding: 40px 0 0 0;
}

.home-carousel-section {
    margin-bottom: 0;
}

.carousel-track {
    display: flex;
    gap: 16px;
    will-change: transform;
}

.carousel-slide {
    flex: 0 0 calc((100% - 48px) / 4);
    min-width: 0;
}

.carousel-img-wrap {
    position: relative;
    width: 100%;
    padding-bottom: 70%;
    border-radius: 0;
    overflow: hidden;
    background: transparent;
}

.carousel-img-wrap img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease, filter 0.5s ease;
}

.carousel-slide:hover .carousel-img-wrap img {
    transform: scale(1.08);
    filter: brightness(1.1);
}

/* ===== IMAGE CAROUSEL RESPONSIVE ===== */
@media (max-width: 1024px) {
    .carousel-slide {
        flex: 0 0 calc((100% - 32px) / 3);
    }
    .carousel-track-wrapper {
        padding: 30px 0;
    }
}

@media (max-width: 768px) {
    .carousel-slide {
        flex: 0 0 calc((100% - 16px) / 2);
    }
    .carousel-track-wrapper {
        padding: 24px 0;
    }
}

@media (max-width: 480px) {
    .carousel-slide {
        flex: 0 0 85%;
    }
    .carousel-track-wrapper {
        padding: 20px 0;
    }
    .carousel-img-wrap {
        padding-bottom: 65%;
    }
}
