/* ===================== GOOGLE FONT – POPPINS ===================== */ /* me ye add hona chahiye */ /* ===================== CSS VARIABLES (COLOR PALETTE) ===================== */ :root{ --primary:#CC6735; /* Burnt Saffron */ --primary-dark:#A84F2A; --primary-soft:#F2B89C; --green:#2F6F62; --green-soft:#DCEEE9; --blue:#2563EB; --blue-soft:#E8F0FE; --text-dark:#1F2937; --text-light:#6B7280; --border:#E5E7EB; --bg:#FFFFFF; --bg-soft:#FAFAFA; } /* ===================== BASE RESET ===================== */ *{ box-sizing:border-box; margin:0; padding:0; } body{ font-family:'Poppins', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; background:var(--bg); color:var(--text-dark); font-weight:400; } a{ color: #000; } section{ padding: 50px 0 50px 0; } /* ===================== LAYOUT SYSTEM ===================== */ .site-wrapper{ width:100%; overflow-x:hidden; } .section{ padding:70px 0; } /* ========================= GLOBAL CONTAINER SYSTEM ========================= */ .container{ width:100%; max-width:1200px; margin:0 auto; padding-left:20px; padding-right:20px; } @media (max-width:768px){ .container{ padding-left:16px; padding-right:16px; } section{ padding: 20px 0 20px 0; } } /* ===================== TYPOGRAPHY ===================== */ h1,h2,h3,h4,h5{ line-height:1.3; margin-bottom:15px; color:#111827; } h1{font-size:42px;font-weight:600;} h2{font-size:32px;font-weight:600;} h3{font-size:24px;font-weight:500;} h4{font-size:18px;font-weight:500;} h5{font-size:16px;font-weight:500;} p{ font-size:13px; /*line-height:25px;*/ color:#1C2011A3; font-weight: 500; } a{ text-decoration:none; color:inherit; } /* ===================== HEADER ===================== */ .jw-header{ background:#ffffff; border-bottom:1px solid var(--border); position:sticky; top:0; z-index:9999; overflow:visible; } .jw-container{ max-width:1200px; margin:auto; padding:20px 10px; display:flex; align-items:center; justify-content:space-between; } /* LOGO */ .jw-logo img{ height:46px; } @media (max-width: 768px){ .jw-logo{ margin-right:auto; } .jw-header-btn{ padding:5px 10px; font-size:12px; border-radius:5px; } p { font-size: 13px; line-height: 22px; color: #1C2011A3; font-weight: 500; } } /* ===================== NAVIGATION ===================== */ .jw-nav{ display:flex; align-items:center; gap:26px; position:relative; } .jw-link{ font-size:15px; font-weight:500; color:#111827; cursor:pointer; position:relative; } .jw-link:hover{ color:var(--primary); } /* ===================== CTA BADGE ===================== */ .jw-col{ padding:10px 18px; } .jw-head{ font-size:14px; font-weight:600; /*text-transform:uppercase;*/ letter-spacing:0.6px; color:#0f172a; margin-bottom:10px; padding-bottom:6px; border-bottom:2px solid #a84f2a; display:inline-block; } .jw-col a{ display:block; font-size:13px; color:#374151; padding:5px 0; text-decoration:none; transition:all 0.25s ease; } .jw-col a:hover{ color:#2563eb; padding-left:6px; } .jw-badge{ border:1px solid var(--primary); color:var(--primary-dark); padding:6px 16px; border-radius:30px; font-size:14px; font-weight:500; transition:.2s ease; } .jw-badge:hover{ background:var(--primary); color:#fff; } .jw-badge span{ background: #1f3a5f; color:#fff; padding:2px 6px; border-radius:6px; font-size:11px; margin-left:6px; /* â BLING EFFECT */ animation:blinkPulse 1.5s infinite; } @keyframes blinkPulse{ 0%{ opacity:1; transform:scale(1); box-shadow:0 0 0 rgba(47,111,98,0.6); } 50%{ opacity:0.7; transform:scale(1.15); box-shadow:0 0 12px rgba(47,111,98,0.9); } 100%{ opacity:1; transform:scale(1); box-shadow:0 0 0 rgba(47,111,98,0.6); } } /* ===================== ACTIONS ===================== */ .jw-actions{ display:flex; align-items:center; gap:18px; } .jw-call span{ font-size:12px; color:var(--text-light); } .jw-call strong{ display:block; font-size:14px; font-weight:500; } .jw-login{ background:var(--primary); color:#ffffff; padding:8px 18px; border-radius:20px; font-size:14px; font-weight:500; } .jw-login:hover{ background:var(--primary-dark); } /* ===================== MEGA MENU (DESKTOP) ===================== */ .jw-dropdown{ position:relative; } .jw-mega{ position:absolute; top:calc(100% + 12px); left:0; background:#FBE6D8; border-radius:18px; padding:26px 28px; display:grid; grid-auto-flow:column; /* 🔥 columns auto */ grid-auto-columns:max-content; /* 🔥 jitna content, utni width */ column-gap:28px; box-shadow: 0 24px 48px rgba(0,0,0,0.12), 0 10px 20px rgba(0,0,0,0.06); opacity:0; visibility:hidden; pointer-events:none; transition:.25s ease; z-index:99999; } .jw-mega::before{ content:""; position:absolute; top:-10px; left:40px; width:20px; height:20px; background:#FBE6D8; transform:rotate(45deg); box-shadow:-3px -3px 8px rgba(0,0,0,0.04); } .jw-mega.small{ width: 400px; } /* OPEN STATE */ .jw-dropdown.open > .jw-mega{ opacity:1; visibility:visible; pointer-events:auto; } .jw-col{ display:flex; flex-direction:column; gap:8px; padding-right:24px; } .jw-col:not(:last-child){ border-right:1px dashed #e5e7eb; } .jw-col a{ font-size:12px; color:#21262e; padding:3px 0px; border-radius:8px; transition:.2s ease; white-space:nowrap; /* 🥠text break nahi hoga */ } .jw-col a:hover{ background:rgba(255,255,255,0.6); color:#374151; padding-left:14px; } .jw-col:not(:last-child){ border-right:1px dashed var(--border); padding-right:24px; } /* ===================== HAMBURGER ===================== */ .jw-hamburger{ display:none; font-size:26px; cursor:pointer; color:#111827; } /* ===================== MOBILE MENU ===================== */ @media(max-width:1024px){ .jw-hamburger{ display:block; } .jw-nav{ position:fixed; top:70px; left:0; width:100%; height:calc(100vh - 70px); background:#ffffff; flex-direction:column; padding:20px; gap:14px; display:none; overflow-y:auto; z-index:9998; } .jw-nav.active{ display:flex; } .jw-mega{ position:static; width:100%; transform:none; box-shadow:none; padding:15px 0; display:none; opacity:1; visibility:visible; pointer-events:auto; flex-direction:column; } .jw-dropdown.open .jw-mega{ display:flex; } .jw-actions{ display:none; } } /* ===================== JUSTWRAVEL STYLE MOBILE MENU ===================== */ /* ===================== MOBILE MENU WRAPPER ===================== */ .jw-mobile{ position:fixed; inset:0; background:#f7f3f0; z-index:99999; overflow-y:auto; display:none; } .jw-mobile.active{ display:block; } /* ===================== TOP BAR ===================== */ .jw-mobile-topbar{ background:linear-gradient(135deg,#2563eb,#1e40af); padding:14px 16px; display:flex; justify-content:space-between; align-items:center; } .jw-mobile-brand{ display:flex; align-items:center; gap:10px; } .jw-mobile-brand img{ height:34px; background:#fff; padding:4px; border-radius:8px; } .jw-mobile-tagline strong{ display:block; font-size:14px; color:#fff; } .jw-mobile-tagline span{ font-size:11px; color:#c7d2fe; } .jw-mobile-actions{ display:flex; align-items:center; gap:14px; } .jw-icon{ font-size:18px; color:#fff; } .jw-close{ font-size:20px; color:#fff; cursor:pointer; } /* ===================== MAIN CARDS AREA ===================== */ .jw-mobile-cards{ padding:16px; } /* BIG DROPDOWN CARD */ .jw-action-card{ background:#ffffff; border-radius:16px; box-shadow:0 10px 28px rgba(0,0,0,0.08); margin-bottom:14px; overflow:hidden; } /* CARD HEADER ROW */ .jw-card-head{ display:flex; align-items:center; gap:12px; padding:16px 18px; cursor:pointer; } .jw-card-head h4{ flex:1; font-size:15px; font-weight:500; color:#1f2937; margin:0; } /* LEFT ICON */ .jw-card-head .jw-icon{ width:34px; height:34px; border-radius:10px; background:#fde7d9; display:flex; align-items:center; justify-content:center; font-size:18px; color:#1f2937; } .jw-card-head .jw-icon.pink{ background:#fde2e2; } /* ARROW */ .jw-arrow{ font-size:14px; color:#6b7280; transition:transform .3s ease; } /* DROPDOWN LIST */ .jw-card-drop{ max-height:0; overflow:hidden; background:#fafafa; padding:0 18px; transition:max-height .45s ease; } .jw-card-drop a{ display:block; padding:12px 0; font-size:14px; color:#374151; border-bottom:1px dashed #e5e7eb; } .jw-card-drop a:last-child{ border-bottom:none; } /* OPEN STATE */ .jw-action-card.active .jw-card-drop{ max-height:500px; } .jw-action-card.active .jw-arrow{ transform:rotate(180deg); } /* ===================== MINI GRID (NO DROPDOWN) ===================== */ .jw-mini-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:10px; } .jw-mini{ background:#ffffff; border-radius:16px; padding:18px 12px; text-align:center; box-shadow:0 8px 20px rgba(0,0,0,0.06); font-size:14px; color:#1f2937; display:flex; flex-direction:column; gap:6px; } .jw-mini span{ font-size:13px; } .jw-mini.call{ background:#cc6735; color:#ffffff; } /* NO DROPDOWN CARDS */ .jw-action-card.no-drop .jw-arrow{ display:none; } .jw-action-card.no-drop{ cursor:pointer; } /* CTA CARD */ .jw-action-card.highlight{ background:#cc6735; } .jw-action-card.highlight h4{ color:#fff; } .jw-action-card.highlight .jw-icon{ background:rgba(255,255,255,0.25); color:#fff; } .jw-icon i{ font-size:16px; color:#ffffff; /* tumhara brand color */ } .jw-icon2 i{ font-size:16px; color:#000000; /* tumhara brand color */ } .jw-arrow i{ font-size:13px; color:#6b7280; } .jw-mobile-tagline{ line-height: 16px; } .jw-action-card.active .jw-card-drop{ max-height: calc(100vh - 200px); overflow-y: auto; } /* HEADER BUTTON BEFORE MENU */ /* BUTTON */ .jw-header-btn{ display:flex; align-items:center; gap:6px; background:#cc6735; color:#fff; font-size:13px; font-weight:600; padding:6px 12px; border-radius:6px; text-decoration:none; } /* ICON WRAPPER */ .jw-header-btn .call-icon{ display:flex; align-items:center; justify-content:center; animation:ring 1.5s infinite; } /* ICON */ .jw-header-btn i{ font-size:13px; } /* RING ANIMATION */ @keyframes ring { 0% { transform: rotate(0); } 10% { transform: rotate(15deg); } 20% { transform: rotate(-15deg); } 30% { transform: rotate(10deg); } 40% { transform: rotate(-10deg); } 50% { transform: rotate(5deg); } 60% { transform: rotate(-5deg); } 100% { transform: rotate(0); } } /* Hover */ .jw-header-btn:hover{ background:#a84f2a; } /* ONLY MOBILE */ @media (min-width: 992px){ .jw-header-btn{ display:none; } } /* ========================= HERO SECTION – FINAL ========================= */ .hero-section{ position:relative; font-family:'Poppins',sans-serif; overflow:hidden; display:flex; align-items:center; } /* ===== MARQUEE ===== */ .hero-marquee{ position:absolute; top:0; left:0; width:100%; z-index:6; background:transparent; /* IMPORTANT */ } .marquee{ overflow:hidden; white-space:nowrap; padding:8px 0; background:transparent; } .marquee-track{ display:flex; gap:60px; width:max-content; animation:marqueeLoop 30s linear infinite; } .marquee-track span{ color:#fff; font-size:14px; font-weight:500; } .marquee-track i{ color:#f2b89c; margin-right:6px; } @keyframes marqueeLoop{ 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} } /* ===== IMAGE ===== */ .hero-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:1; } /* ===== OVERLAY ===== */ .hero-overlay{ position:absolute; inset:0; background:linear-gradient( 90deg, rgba(0,0,0,.6), rgba(0,0,0,.25), transparent ); z-index:2; } /* ===== DESKTOP CONTENT ===== */ .hero-content{ position:relative; z-index:4; color:#fff; padding:140px 20px; max-width:1200px; } .hero-title-desktop{ font-size:26px; font-weight:700; line-height:1.2; margin-bottom:18px; } .hero-sub{ font-size:16px; color:#e5e7eb; } .hero-sub span{color:#f2b89c;} .hero-usps{ list-style:none; margin:28px 0 28px; padding:0; display:grid; grid-template-columns:repeat(2,max-content); gap:10px 40px; } .hero-usps li{font-size:14px;} .hero-usps i{color:#f2b89c;margin-right:6px;} .hero-cta-wrap{ display:flex; gap:16px; flex-wrap:wrap; } .hero-cta{ padding:12px 0px; border-radius:30px; font-weight:600; text-decoration:none; } .hero-cta.primary{background:#cc6735;color:#fff; padding: 12px 18px;} .hero-cta.secondary{border:2px solid #fff;color:#fff; padding: 12px 18px;} /* ===== MOBILE H1 OVER IMAGE ===== */ .hero-title-mobile{ display:none; position:absolute; top: 120px; left: 16px; right:16px; z-index:5; } .hero-title-mobile h1{ font-size:18px; line-height:1.2; color:#fff; font-weight:700; } /* ================================================= 📱 MOBILE ONLY ================================================= */ @media(max-width:768px){ .hero-section{ flex-direction:column; align-items:stretch; } .hero-bg{ position:relative; height:240px; object-position: 80% center; } .hero-overlay{ height:240px; } .hero-title-mobile{ display:block; } .hero-title-desktop{ display:none; } .hero-content{ background:#fff3eb; color:#1f2937; padding:30px 16px; } .hero-sub{color:#4b5563;} .hero-usps{grid-template-columns:1fr;} .hero-cta{ width:100%; text-align:center; } .hero-cta.secondary{ border-color:#cc6735; color:#cc6735; } } /* ========================= IMAGE PACKAGE CARDS ========================= */ .packages-section{ background:#ffffff; font-family:'Poppins', sans-serif; } /* Section head */ .section-head{ margin-bottom:20px; } .readmore-block{ margin:20px 0; font-family:'Poppins',sans-serif; } .intro-text{ margin-bottom:6px; font-size:14px; color:#333; } /* Expand animation */ .expand-wrapper{ height:0; overflow:hidden; transition:height 0.6s ease; } .expand-inner{ padding-top:16px; } .readmore-btn{ background:none; border:none; color:#cc6735; font-size:14px; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:6px; } .readmore-btn i{ transition:0.3s; } .readmore-btn.active i{ transform:rotate(90deg); } /* Spiritual Box */ .dham-spiritual-box{ background:#f8fbff; border:1px solid #dbe7ff; border-radius:12px; padding:16px; margin:16px 0; } .group-packages{ padding: 0px; font-family:'Poppins', sans-serif; } /* HEADER */ .section-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-family:'Poppins', sans-serif; } .section-header h2{ font-size:24px; font-weight:600; } /* CONTROLS */ .slider-controls{ display:flex; align-items:center; gap:8px; } .nav-btn{ border:1px solid #ddd; background:#fff; width:34px; height:34px; border-radius:50%; cursor:pointer; font-size:18px; font-family:'Poppins', sans-serif; } .view-all{ color:red; font-size:14px; margin-left:8px; font-family:'Poppins', sans-serif; } /* CARD */ .tour-card{ width: 100%; background:#fff; border-radius:12px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; overflow:hidden; flex-shrink:0; scroll-snap-align:start; font-family:'Poppins', sans-serif; } /* IMAGE */ .tour-img{ position:relative; height:160px; background-size:cover; background-position:center; } /* BADGES */ .badge-left, .badge-right{ position:absolute; top:10px; font-size:11px; font-weight:600; padding:4px 8px; border-radius:6px; color:#fff; font-family:'Poppins', sans-serif; } .badge-left{ left:10px; background:#cc6633; } .badge-right{ right:10px; background:#ce1e04; } /* BODY */ .tour-body{ padding:12px; font-family:'Poppins', sans-serif; } .tour-title{ font-size:16px; font-weight:600; margin-bottom:6px; } .tour-para{ font-size:12px; margin-bottom:6px; line-height: 18px; font-weight: 400; } .months span{ display:inline-block; background:#f1f1f1; font-size:11px; padding:3px 8px; border-radius:6px; margin-bottom:6px; font-family:'Poppins', sans-serif; } .includes{ font-size:13px; font-weight:600; margin:8px 0 4px; } .include-icons i{ color:#cc6633; font-size:14px; margin-right:6px; } /* PRICE */ .price-note{ font-size:12px; color:#777; margin-top:6px; } .price-row{ display:flex; justify-content:space-between; align-items:center; margin:6px 0 10px; } .price{ font-size:18px; font-weight:700; } .dates{ font-size:12px; color:#555; } /* BUTTON */ .book-btn{ width:100%; background:#cc6633; color:#fff; border:none; padding:10px; border-radius:6px; font-size:14px; font-weight:600; cursor:pointer; font-family:'Poppins', sans-serif; } /* ACTIONS */ .card-actions{ display:flex; justify-content:space-between; font-size:12px; margin-top:8px; font-family:'Poppins', sans-serif; } .card-actions .whatsappp{ background: #26d566; color: #ffffff; padding: 2px 5px 0px 6px; border-radius: 5px; font-size: 16px; } .card-actions .callback{ text-decoration:underline; color:#333; display:flex; align-items:center; gap:4px; } .card-actions .callback:hover{ text-decoration:none; background: #fbecdd; padding: 5px; font-weight: 600; border-radius: 5px; } .card-actions .itinerary{ text-decoration:none; color:#333; display:flex; align-items:center; background: #fbecdd; padding: 5px; gap:4px; font-weight: 600; border-radius: 5px; } .card-actions .itinerary:hover{ text-decoration:none; color:#ffffff; padding: 5px; border-radius: 5px; display:flex; background: #6c757d; align-items:center; gap:4px; } .card-actions .callback i{ color:#25D366; } .packageSwiper{ padding: 20px 0 50px; } .packageSwiper .swiper-slide-active{ transform: scale(1.05); } .packageSwiper .swiper-button-next, .packageSwiper .swiper-button-prev{ color:#000; } .packageSwiper .swiper-pagination-bullet-active{ background:#000; } /* ---------- ICON ---------- */ .premium-icon{ width:64px; height:64px; margin:0 auto 16px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#FFFFFF; border:2px solid #1F3A5F; color:#1F3A5F; font-size:26px; box-shadow:0 10px 25px rgba(31,58,95,0.18); } /* ---------- SECTION ---------- */ .price-anchor-premium{ /*padding:50px 0;*/ } /* ---------- HEADING ---------- */ .anchor-head{ text-align:center; margin-bottom:55px; } .anchor-badge{ display:inline-block; background:#D26B36; color:#fff; padding:7px 16px; border-radius:20px; font-size:13px; margin-bottom:12px; } .anchor-head h2{ font-size:32px; font-weight:700; margin:12px 0; color:#1F2937; } .anchor-head p{ color:#4B5563; max-width:700px; margin:0 auto; font-size:15px; } /* ---------- CARDS GRID ---------- */ .anchor-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; } /* ---------- CARD BASE ---------- */ .anchor-card{ background:#fff5edb8; padding:34px 26px; border-radius:20px; text-align:center; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; } .anchor-card:hover{ box-shadow:0 20px 45px rgba(0,0,0,0.12); } .anchor-card:not(.featured){ opacity:0.92; } /* ---------- TEXT ---------- */ .anchor-card h3{ color:#D26B36; margin:14px 0 10px; font-size:16px; font-weight:700; } .anchor-card p{ font-size:14px; color:#374151; line-height:1.6; } /* ---------- LABELS ---------- */ .label{ font-size:12px; padding:6px 14px; border-radius:20px; background:#1f3a5f; color:#fff; margin-top:-6px; font-weight: 600; display:inline-block; margin-bottom:6px; } .highlight{ background:#D26B36; color:#fff; } .anchor-cta{ text-align:center; margin-top:25px; } /* ---------- FEATURED (CENTER CARD) ---------- */ .featured{ background:#d26b36; box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset; } .featured h3{ color: #fff; } .featured p{ color: #fff; } .featured .highlight { background: #fff; color: #1f3a5f; } /* ---------- CTA BUTTON ---------- */ .anchor-btn{ display:inline-block; margin-top:18px; padding:12px 26px; background:#d26b36; color:#fff; border-radius:30px; font-size:14px; font-weight:600; text-decoration:none; } .anchor-btn:hover{ background:#BF5F2F; } /* ---------- PREMIUM CARD ---------- */ .anchor-card.premium{ background:#fff9f3; } .anchor-card.premium .label{ background: #d26b36; color: #ffffff; } .anchor-card.premium h3{ color: #415777; } .anchor-card.premium p{ color: #374151; } /* ---------- NOTE ---------- */ .anchor-note{ text-align:center; font-size:14px; color:#6B7280; margin-top:36px; } /* ---------- MOBILE ---------- */ @media(max-width:768px){ .anchor-cards{ grid-template-columns:1fr; } .featured{ transform:none; } .anchor-head h2{ font-size:26px; } } @media(max-width:768px){ .anchor-card.featured{ transform:none; } } .anchor-card.featured p{ color:rgba(255,255,255,.9); } .expand-content{ max-height:0; overflow:hidden; transition:max-height .4s ease; } .expand-content.open{ max-height:500px; /* content ke hisaab se */ } .toggle-btn{ background:none; border:none; color:#d26b36; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:6px; } .expand-wrapper{ height:0; overflow:hidden; transition:height .45s ease; } .readmore-btn{ background:none; border:none; color:#d26b36; font-weight:600; cursor:pointer; display:flex; align-items:center; gap:6px; margin-top:10px; } .readmore-btn i{ transition:transform .3s ease; } .readmore-btn.active i{ transform:rotate(90deg); } /* ================= MINI STAT CARD ================= */ .mini-stat-wrapper{ margin-bottom:40px; } .mini-stat-card{ display:inline-flex; align-items:center; gap:12px; background:#fff; padding:12px 18px; border-radius:10px; box-shadow:0 10px 25px rgba(0,0,0,0.08); } .mini-stat-icon{ width:44px; height:44px; background:#eaf2ff; border-radius:8px; display:flex; align-items:center; justify-content:center; } .mini-stat-icon i{ font-size:22px; color:#2563eb; } .mini-stat-text strong{ display:block; font-size:18px; font-weight:700; color:#0f172a; } .mini-stat-text span{ font-size:13px; color:#64748b; } /* ================= MAIN STATS ================= */ .stats-section{ padding:20px 0; } .stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:50px; } .stat-item{ display:flex; align-items:center; gap:14px; } .stat-icon{ width:52px; height:52px; background:#f8f9fa; border-radius:12px; display:flex; align-items:center; justify-content:center; } .stat-icon i{ font-size:22px; color:#1f3a5f9e; } .stat-content h3{ font-size:24px; font-weight:700; margin:0; color:#0f172a; } .stat-content p{ font-size:14px; color:#475569; margin: 0; white-space: nowrap; /* 🔠line break roke */ } /* Mobile */ @media(max-width:768px){ .stats-grid{ grid-template-columns:repeat(2,1fr); gap:24px; } } .why-trust-flex{ display:flex; align-items:flex-start; } /* Left content */ .why-trust-content{ flex:1.1; } /* Right reviews */ .why-trust-reviews{ background:#fff; border-radius:16px; padding: 0px; } /* Mobile */ @media(max-width:768px){ .why-trust-flex{ flex-direction:column; } } /* ================= WHY CHOOSE US ================= */ .why-choose-us{ background:linear-gradient(180deg, #e3f7ff59 0%, #FFFFFF 70%); } /* Header */ .why-head{ margin-bottom:40px; } .why-pill{ background:#D26B36; color:#fff; padding:7px 18px; border-radius:20px; font-size:13px; display:inline-block; } .why-head h3{ margin:12px 0; color:#0F172A; } /* Layout */ .why-wrapper{ display:grid; grid-template-columns:1.4fr 1fr; gap:50px; } /* TRUST LOGOS */ .trust-logos{ margin-bottom:36px; } .trust-logos span{ font-size:14px; font-weight:600; display:block; margin-bottom:14px; } .logo-row{ display:flex; gap:66px; align-items:center; } .logo-row img{ height:80px; } /* STATS */ .stats-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; } .stat-item{ display:flex; gap:12px; align-items:center; } .stat-icon i{ font-size:22px; color:#D26B36; } .stat-content h3{ font-size:22px; color:#0F172A; } .stat-content p{ font-size:13px; color:#475569; } /* TRUST CARD */ .why-trust-card{ background:#fff; padding:26px; border-radius:22px; border:2px solid #1F3A5F; } .why-btn{ color:#16A34A; font-weight:600; text-decoration:none; } /* ================= MOBILE ONLY ================= */ @media(max-width:768px){ .why-wrapper{ grid-template-columns:1fr; } /* Logos mobile */ .trust-logos{ /*text-align:center;*/ } .logo-row{ /*justify-content:center;*/ gap:24px; } .logo-row img{ height:72px; } /* Stats mobile */ .stats-grid{ gap:12px; } .stat-item{ background:#fff; padding:12px 6px; border-radius:14px; text-align:center; flex-direction:column; box-shadow:0 6px 14px rgba(0,0,0,0.06); } .stat-icon i{ font-size:18px; } .stat-content h3{ font-size:18px; } .stat-content p{ font-size:12px; } } /* =============================== 📱 WHY TRUST CARD – MOBILE FIX ================================ */ @media (max-width: 768px){ .why-trust-flex{ display:flex; flex-direction:column; gap:24px; } /* LEFT CONTENT */ .why-trust-content{ text-align:left; } .why-trust-content h4{ font-size:18px; margin-bottom:12px; } .why-trust-content ul{ padding-left:18px; } .why-trust-content li{ font-size:14px; margin-bottom:8px; } /* RIGHT REVIEWS */ .why-trust-reviews{ /*width:100%;*/ display:flex; /*justify-content:center;*/ } /* Trustindex iframe/widget safe */ .why-trust-reviews iframe, .why-trust-reviews > div{ max-width:100% !important; } .why-btn{ margin-top:8px; display:inline-block; } } /* PILL */ .date-pill{ background:#D26B36; color:#fff; padding: 6px 18px 9px 18px; border-radius:20px; font-size:13px; } /* TABLE WRAPPER */ .table-wrapper{ border:1px solid #E5E7EB; border-radius:16px; overflow:hidden; background:#fff; } /* ROW (2 TEMPLES) */ .table-row{ display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid #E5E7EB; } .table-row:last-child{ border-bottom:none; } .table-row.stripe{ background:#F8FAFC; } /* TEMPLE ROW */ .temple-row{ display:grid; grid-template-columns:1.5fr 1fr; align-items:center; padding:12px 16px; border-right:1px solid #E5E7EB; } .temple-row:last-child{ border-right:none; } /* TEMPLE COL */ .temple-col{ display:flex; align-items:center; gap:10px; } .temple-col img{ width:80px; height:80px; border-radius:8px; object-fit:cover; } .temple-col strong{ display:block; font-size:14px; color:#0F172A; } .temple-col span{ font-size:12px; color:#64748b; } /* DATE COLUMN */ .date-col{ display:flex; flex-direction:column; gap:4px; font-size:13px; white-space:nowrap; } .open-date{ color:#0F172A; font-weight:500; } .close-date{ color:#475569; } .date-col span{ font-size:12px; color:#64748b; } /* MOBILE */ @media(max-width:768px){ .table-row{ grid-template-columns:1fr; } .temple-row{ grid-template-columns:1fr; gap:6px; border-right:none; border-bottom:1px solid #E5E7EB; } .temple-row:last-child{ border-bottom:none; } .date-col{ /*padding-left:46px;*/ } } /* =============================== TABS ================================ */ .dham-tabs{ display:flex; justify-content:center; gap:12px; margin-bottom:28px; flex-wrap:wrap; /* desktop */ } .tab-btn{ padding:10px 18px; border-radius:30px; border:1px solid #E5E7EB; background:#fff; font-weight:600; font-size:14px; cursor:pointer; white-space:nowrap; color:#000000; transition:all .25s ease; } .tab-btn:hover{ background:#f9fafb; } .tab-btn.active{ background:#D26B36; color:#fff; border-color:#D26B36; } /* =============================== CONTENT WRAPPER ================================ */ .dham-content-wrapper{ background:#ffffff; padding:24px; border-radius:18px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; } .dham-content{ display:none; gap:24px; align-items:flex-start; } .dham-content.active{ display:flex; } .dham-content img{ width:320px; border-radius:14px; flex-shrink:0; } .dham-content h3{ margin-bottom:8px; font-size:22px; color:#0F172A; } .dham-content p{ color:#475569; line-height:1.7; font-size:15px; } .ab-btn{ display:inline-block; margin-top:10px; color:#D26B36; font-weight:600; text-decoration:none; } /* =============================== 📱 MOBILE RESPONSIVE (TABS SCROLL) ================================ */ @media(max-width:768px){ /* Tabs ek hi line me + scroll */ .dham-tabs{ flex-wrap:nowrap; /* ek hi row */ overflow-x:auto; /* horizontal scroll */ justify-content:flex-start; gap:8px; padding-bottom:6px; -webkit-overflow-scrolling:touch; } /* scrollbar hide */ .dham-tabs::-webkit-scrollbar{ display:none; } /* smaller tabs */ .tab-btn{ flex-shrink:0; font-size:12px; padding:7px 12px; border-radius:20px; } /* content stack naturally */ .dham-content{ flex-direction:column; } .dham-content img{ width:100%; } .dham-content-wrapper{ padding:16px; } } .luxury-section{ /*padding:50px 0;*/ } .section-head{ margin-bottom:30px; } .section-pill{ display:inline-block; background:#D26B36; color:#fff; padding:6px 18px; border-radius:20px; font-size:13px; } .section-head h2{ margin-top:14px; } .section-head p{ color:#475569; } /* CARD */ .lux-card{ position:relative; display:block; height:200px; border-radius:18px; overflow:hidden; } .lux-card img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; } /* overlay */ .lux-overlay{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgb(0 0 0 / 38%) 75%); z-index:1; } .lux-card:hover img{ transform:scale(1.08); } /* text */ .lux-content{ position:absolute; bottom:18px; left:18px; z-index:2; color:#fff; } .lux-content h3{ font-size:28px; margin:0; } .lux-content span{ display:block; font-size:13px; letter-spacing:1.5px; text-transform:uppercase; margin-top:4px; } /* swiper */ .luxurySwiper{ position:relative; overflow:hidden; } /* NAV BUTTON BASE */ .lux-prev, .lux-next{ position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; background:#ffffff; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:10; box-shadow:0 6px 18px rgba(0,0,0,0.15); transition:all 0.3s ease; } /* POSITION */ .lux-prev{ left:-20px; } .lux-next{ right:-20px; } /* ICON STYLE */ .lux-prev i, .lux-next i{ font-size:16px; color:#0f172a; transition:color 0.3s ease; } /* HOVER EFFECT */ .lux-prev:hover, .lux-next:hover{ background:#0f172a; } .lux-prev:hover i, .lux-next:hover i{ color:#ffffff; } /* MOBILE FIX */ @media(max-width:768px){ .lux-prev{ left:5px; } .lux-next{ right:5px; } } .chardham-detail-section{ background:linear-gradient(180deg,#FFF7F2 0%, #FFFFFF 70%); } .chardham-services{ background:#ffffff; } /* LEFT */ .section-pill{ background:#ffedd5; color:#9a3412; padding:6px 14px; border-radius:20px; font-size:13px; font-weight:600; } .services-intro h2{ font-size:32px; font-weight:700; } .services-intro p{ font-size:15px; line-height:1.7; color:#555; } .service-points li{ margin-bottom:8px; font-size:14px; } .service-link{ color:#6d28d9; font-weight:600; text-decoration:none; } .service-link:hover{ text-decoration:underline; } /* RIGHT CARDS */ .service-card{ background:#fff; padding:24px; border-radius:18px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; transition:0.3s; } .service-card:hover{ transform:translateY(-4px); } .service-card h4{ font-size:17px; margin-bottom:10px; } .service-card p{ font-size:14px; color:#555; } /* ICON */ .icon{ width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:12px; margin-bottom:14px; font-size:22px; } .icon.taxi{ background:#fff7ed; } .icon.heli{ background:#eef2ff; } .icon.hotel{ background:#ecfeff; } .icon.camp{ background:#f0fdf4; } .bg-blue{ background: linear-gradient(180deg, #f7f9fc 0%, #ffffff 100%); } /* SECTION */ .testimonial-section { padding: 80px 0; background: linear-gradient(180deg, #f7f9fc 0%, #ffffff 100%); overflow: visible; } .testimonial-title { text-align: center; margin-bottom: 40px; } .testimonial-title h3 { font-size: 34px; font-weight: 700; } /* GRID */ .testimonial-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 25px; } /* CARD */ .testimonial-card { background: #fff; border-radius: 20px; padding: 35px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; position: relative; display: flex; flex-direction: column; height: 100%; } /*.testimonial-card::before {*/ /* content: "âœ";*/ /* position: absolute;*/ /* top: 10px;*/ /* right: 20px;*/ /* font-size: 120px;*/ /* color: rgba(4,104,255,0.08);*/ /* font-family: serif;*/ /*}*/ .testimonial-text { font-size: 13px; line-height: 1.5; color: #444; margin-bottom: 15px; flex-grow: 1; } /* USER */ .testimonial-user { display: flex; align-items: center; gap: 12px; margin-top: 10px; } .testimonial-user img { width: 38px; height: 38px; border-radius: 50%; } .stars { color: #f5a623; font-size: 14px; } /* MOBILE */ @media (max-width: 768px) { .testimonial-title h3 { font-size: 26px; } } /* FAQ SECTION */ .faq-section{ /* padding:80px 0; background:#fff; font-family: Arial, sans-serif;*/ } .faq-title{ text-align:center; margin-bottom:40px; } .faq-title h2{ font-size:32px; font-weight:700; } /* GRID */ .faq-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px 30px; } /* FAQ ITEM */ .faq-item{ background:#f7f7f7; border-radius:12px; padding: 8px 22px; cursor:pointer; transition:0.3s; } .faq-item:hover{ background:#f2f4f8; } /* QUESTION */ .faq-question{ display:flex; justify-content:space-between; align-items:center; font-size:15px; font-weight:600; } /* ICON */ .faq-icon{ font-size:20px; font-weight:700; transition:0.3s; } /* ANSWER */ .faq-answer{ max-height:0; overflow:hidden; transition:max-height 0.4s ease; } .faq-answer p{ font-size:14px; line-height:1.6; color:#555; margin-top:12px; } /* ACTIVE */ .faq-item.active .faq-answer{ max-height:400px; } .faq-item.active .faq-icon{ transform:rotate(45deg); } /* MOBILE */ @media(max-width:768px){ .faq-grid{ grid-template-columns:1fr; } .faq-title h2{ font-size:26px; } } .cyber-fraud-section{ /*padding:70px 0;*/ } .fraud-alert-box{ background:#fff; border-left:6px solid #e63946; border-radius:14px; padding:35px; box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; } .fraud-alert-box h3{ font-size:26px; font-weight:700; margin-bottom:15px; } .fraud-text{ font-size:15px; color:#444; margin-bottom:15px; } .fraud-points{ padding-left:18px; margin-bottom:20px; } .fraud-points li{ font-size:14px; line-height:1.7; margin-bottom:8px; } .fraud-points a{ color:#0468ff; font-weight:600; text-decoration:none; } .fraud-points a:hover{ text-decoration:underline; } .fraud-note{ background:#fff3f3; border:1px solid #ffd6d6; padding:12px 15px; border-radius:10px; font-size:14px; font-weight:600; color:#b42318; } /* MOBILE */ @media(max-width:768px){ .fraud-alert-box h3{ font-size:22px; } } /* ================================ FOOTER BASE ================================ */ .main-footer{ background:#f4f6f9; padding-top:50px; position:relative; overflow:hidden; font-family: 'Poppins', sans-serif; } /* ================================ TOP CTA ================================ */ .footer-cta{ text-align:center; padding-bottom:30px; } .footer-cta h4{ font-size:26px; font-weight:700; margin-bottom:10px; } .footer-cta p{ font-size:14px; color:#555; max-width:800px; margin:0 auto 12px; } .footer-cta .btn{ padding:8px 20px; font-size:14px; } /* ================================ WHITE FLOATING WRAPPER ================================ */ .footer-box-wrap{ position:relative; z-index:2; margin-bottom:-100px; /* 👈 FLOAT EFFECT */ } /* ================================ WHITE FOOTER BOX ================================ */ .footer-box{ background:#ffffff; border-radius:18px; padding:40px; box-shadow:0 12px 35px rgba(0,0,0,0.15); } /* ================================ FOOTER COLUMNS ================================ */ .footer-box h6{ font-size:15px; font-weight:700; margin-bottom:14px; color:#111; } .footer-box ul{ list-style:none; padding:0; margin:0; } .footer-box ul li{ margin-bottom:0px; } .footer-box ul li a{ font-size:13px; color:#555; font-weight: 500; text-decoration:none; transition:0.2s; } .footer-box ul li a:hover{ color:#0468ff; padding-left:3px; } /* ================================ PAY SECTION ================================ */ .pay-section{ padding-top:15px; } .pay-section h6{ font-size:14px; font-weight:700; margin-bottom:10px; } .pay-section .btn{ padding:6px 16px; font-size:13px; margin:0 5px; } /* ================================ DARK BOTTOM STRIP ================================ */ .footer-bottom{ background:#1f3a5f; color:#ccc; padding:140px 0 35px; /* 👈 TOP SPACE FOR FLOAT */ position:relative; z-index:1; text-align:center; } .footer-bottom p{ font-size:13px; margin-bottom:8px; color:#ccc; } /* ================================ SOCIAL ICONS ================================ */ .social-icons{ margin:12px 0; } .social-icons a{ display:inline-block; width:34px; height:34px; line-height:34px; border-radius:50%; border:1px solid #555; color:#fff; margin:0 6px; font-size:14px; text-align:center; text-decoration:none; transition:0.3s; } .social-icons a:hover{ background:#0468ff; border-color:#0468ff; } /* ================================ COPYRIGHT & DISCLAIMER ================================ */ .footer-bottom .copyright{ font-size:13px; margin-top:10px; color:#f8f9fa; } .footer-bottom .disclaimer{ font-size:12px; color:#f8f9fa; margin-top:10px; line-height:1.6; } /* ================================ RESPONSIVE FIXES ================================ */ @media(max-width:991px){ .footer-box{ padding:30px; } } @media(max-width:768px){ .footer-cta h4{ font-size:22px; } .footer-box-wrap{ margin-bottom:-70px; } .footer-bottom{ padding-top:110px; } .footer-box{ padding:25px; } } @media(max-width:576px){ .footer-box-wrap{ margin-bottom:-60px; } .footer-bottom{ padding-top:100px; } } .taxi{ background: #fff7ed; } .heli{ background: #eef2ff; } .hotel{ background: #ecfeff; } .camps{ background: #fff8e1; } .contact-line{ font-size:14px; color:#374151; } .contact-line i{ margin-right:6px; color:#f8f9fa; } .contact-line a{ color:inherit; text-decoration:none; color:#f8f9fa; } .contact-line a:hover{ color:#ffffff; text-decoration:none; } .contact-line .divider{ margin:0 10px; color:#9ca3af; } .link-tags{ display:flex; flex-wrap:wrap; gap:10px; } .link-tags .tag{ display:inline-block; padding:6px 12px; font-size:13px; background:#f3f4f6; color:#1f2937; border-radius:20px; text-decoration:none; transition:all 0.3s ease; border:1px solid #e5e7eb; } .link-tags .tag:hover{ background:#2563eb; color:#ffffff; border-color:#2563eb; } .top-searches{ /*padding:60px 0;*/ background:#fff; } .top-searches h2{ font-size:32px; font-weight:600; margin-bottom:30px; color:#1f2937; } .search-tags{ display:flex; flex-wrap:wrap; gap:14px; } .search-tags a{ display:inline-block; padding:10px 18px; border:1px solid #b8d1f7; border-radius:30px; font-size:14px; color:#212529; text-decoration:none; background:#f4f6f94d; transition:all 0.25s ease; white-space:nowrap; } .search-tags a:hover{ background:#fff3f3; color:#000; border-color:#ffd6d6; } /* MOBILE OPTIMIZATION */ @media(max-width:768px){ .top-searches h2{ font-size:24px; } .search-tags{ gap:10px; } .search-tags a{ font-size: 12px; padding: 6px 10px; } } .google-review-box{ position:relative; } .google-review-card{ position:relative; z-index:1; background:#fff; /*border:1px solid #e5e5e5;*/ border-radius:6px; padding:18px; text-align:center; /*box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;*/ } .google-review-card h4{ margin:0; font-size:18px; font-weight:600; } .google-stars{ color:#fbbc05; font-size:18px; margin:6px 0; } .google-based{ font-size:13px; color:#666; margin-bottom:10px; } .google-brand{ display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px; font-weight:500; color:#333; } .luxurytextSwiper{ overflow:hidden; padding-bottom:40px; } .locationSwiper{ overflow:hidden; padding-bottom:40px; } .luxurytextSwiper{ overflow:hidden; padding-bottom:40px; } .locationSwiper{ padding:10px 0 40px; } .location-card{ position:relative; border-radius:18px; overflow:hidden; } .location-card img{ width:100%; height:200px; object-fit:cover; } .location-card span{ position:absolute; bottom:15px; left:15px; color:#fff; font-size:20px; font-weight:600; text-shadow:0 3px 10px rgba(0,0,0,.6); } /* PAGINATION DOTS */ .swiper-pagination-bullet{ background:#ccc; opacity:1; } .swiper-pagination-bullet-active{ background:#000; } .popup-img{ width:100%; height:220px; object-fit:cover; border-radius:10px; cursor:pointer; transition:.3s; } .popup-img:hover{ transform:scale(1.05); } /* MODAL */ .img-modal{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.9); z-index:9999; justify-content:center; align-items:center; } .img-modal-content{ max-width:90%; max-height:90%; animation:zoom .3s ease; } @keyframes zoom{ from{transform:scale(.7)} to{transform:scale(1)} } .img-close{ position:absolute; top:20px; right:30px; font-size:40px; color:#fff; cursor:pointer; } .locationSwiper .swiper-wrapper{ transition-timing-function: linear !important; } .dham-spiritual-box{ background:#f8fbff; border:1px solid #dbe7ff; border-radius:16px; padding:26px 28px; margin:30px 0; font-family:'Poppins', sans-serif; } .dham-spiritual-box h4{ font-size:22px; font-weight:700; margin-bottom:18px; color:#1f3a5f; } .dham-spiritual-list{ list-style:none; padding:0; margin:0; } .dham-spiritual-list li{ background:#ffffff; border-left:4px solid #ff6a00; padding:8px 18px; border-radius:10px; margin-bottom:14px; font-size:14px; line-height:1.7; color:#333; } .dham-spiritual-list strong{ color:#1f3a5f; font-weight:700; } .price-table-wrap-left{ max-width:820px; /* choti width */ font-family:'Poppins', sans-serif; margin:30px 0; /* LEFT aligned */ } .price-table-wrap-left h4{ font-size:20px; font-weight:700; margin-bottom:14px; color:#1f3a5f; } /* Table */ .table-box{ overflow-x:auto; } .price-table{ width:100%; border-collapse:collapse; background:#f8f9fa69; border-radius:14px; overflow:hidden; font-size:14px; } .price-table thead{ background:#eef6ff; } .price-table th{ padding:12px; text-align:left; font-weight:600; color:#1f3a5f; } .price-table td{ padding:12px; font-size: 12px; border-top:1px solid #e6edf5; color:#333; } /* Price column highlight */ .price-table td:nth-child(3){ font-weight:700; color:#d26b36; } /* Mobile */ @media(max-width:600px){ .price-table{ font-size:13px; } .price-table th, .price-table td{ padding:10px; } } .simple-chardham-list{ padding-left:18px; margin:15px 0; font-size:14px; line-height:1.6; color:#333; } .simple-chardham-list li{ margin-bottom:6px; } .best-time-box{ max-width:720px; background:#f4fbff; border-radius:18px; padding:24px 26px; margin:30px 0; font-family:'Poppins', sans-serif; border: 1px solid #dbe7ff; } .best-time-box h4{ font-size:22px; font-weight:700; margin-bottom:16px; color:#1f3a5f; } /* Table */ .time-table{ width:100%; border-collapse:collapse; background:#ffffff; border-radius:14px; overflow:hidden; font-size:14px; } .time-table thead{ background:#eaf3ff; } .time-table th{ padding:12px; text-align:left; font-weight:600; color:#1f3a5f; } .time-table td{ padding:12px; border-top:1px solid #e6edf5; color:#333; } /* Crowd labels */ .time-table .high{ color:#e5533d; font-weight:600; } .time-table .moderate{ color:#ff9f1c; font-weight:600; } .time-table .low{ color:#2bb673; font-weight:600; } /* Mobile */ @media(max-width:600px){ .time-table{ font-size:13px; } .time-table th, .time-table td{ padding:10px; } } .section-divider{ width:100%; height:1px; background:linear-gradient(to right, transparent, #d26b36, transparent); margin:30px 0; } .left-gradient-divider{ width:100%; height:2px; border-radius:4px; margin:30px 0; background:linear-gradient( to right, #d26b36 0%, #d26b36 2%, rgba(210,107,54,0.4) 35%, rgba(210,107,54,0.1) 75%, transparent 100% ); } .chardham-faqs{ padding:40px 0; background:#f7f9ff; font-family:'Poppins',sans-serif; } .faq-header{ text-align:center; max-width:720px; margin:0 auto 30px; } .faq-pill{ display:inline-block; background:#eaf0ff; color:#1a3cff; padding:6px 16px; border-radius:20px; font-size:13px; font-weight:600; margin-bottom:12px; } .faq-header h2{ font-size:32px; color:#1f3a5f; margin-bottom:10px; } .faq-header p{ color:#555; font-size:15px; } .faq-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; /*max-width:1000px;*/ margin:0 auto; } .faq-card{ background:#fff; padding:16px 28px; border-radius:16px; /*box-shadow:0 10px 30px rgba(0,0,0,0.05);*/ } .faq-card h4{ font-size:16px; color:#1f3a5f; margin-bottom:8px; font-weight:600; } .faq-card p{ font-size:14px; line-height:1.7; color:#555; } .faq-footer{ max-width:800px; margin:20px auto 0; text-align:center; color:#444; font-size:15px; } @media(max-width:768px){ .faq-grid{ grid-template-columns:1fr; } } .simple-list{ font-size: 15px; color: #475569; font-weight: 600; } /* WRAPPER */ .quick-contact { position: fixed; right: 16px; bottom: 16px; z-index: 9999; font-family: Arial, sans-serif; } /* BOX */ .quick-contact-box { background: #fff7ef; border-radius: 14px; padding: 14px; width: 240px; box-shadow: 0 10px 28px rgba(0,0,0,0.18); position: relative; animation: slideUp 0.4s ease, pulseGlow 3s infinite; } /* CLOSE */ .quick-close { border-radius: 10px; padding: 3px 5px 0 5px; position: absolute; top: 10px; right: 10px; background: #fff; font-size: 10px; cursor: pointer; box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px; /* box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; */ color: #212529; } .quick-close:hover { color: #333; } /* ATTENTION DOT */ .attention-dot { position: absolute; top: -5px; right: -5px; width: 12px; height: 12px; background: #ff3b30; border-radius: 50%; animation: ping 1.6s infinite; } /* TEXT */ .quick-contact-text { font-size: 13px; color: #333; font-weight: 600; font-family: "Poppins", sans-serif; line-height: 1.45; margin-bottom: 12px; padding-right: 20px; } /* BUTTONS FLEX */ .quick-contact-actions { display: flex; gap: 8px; } .quick-btn { flex: 1; /* equal width */ padding: 9px 0; border-radius: 8px; font-size: 12px; font-weight: 600; text-decoration: none; text-align: center; } /* COLORS */ .quick-btn.whatsapp { background: #1f8f2e; color: #fff; } .quick-btn.call { border: 1.5px solid #436ad6; color: #436ad6; background: #fff; font-weight: 600; } /* ANIMATIONS */ @keyframes slideUp { from { transform: translateY(40px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } @keyframes pulseGlow { 0% { box-shadow: 0 0 0 0 rgba(255,140,26,0.35); } 70% { box-shadow: 0 0 0 10px rgba(255,140,26,0); } 100% { box-shadow: 0 0 0 0 rgba(255,140,26,0); } } @keyframes ping { 0% { transform: scale(1); opacity: 1; } 75% { transform: scale(1.7); opacity: 0; } 100% { opacity: 0; } } /* MOBILE HIDE */ @media (max-width: 768px) { .quick-contact { display: none; } } /* ================================ DESKTOP → HIDE FULL CTA ================================ */ @media (min-width: 769px) { .eual-mar { display: none !important; } } /* ================================ CTA MAIN BAR — DESKTOP NORMAL ================================ */ .sticky-chardham-cta { position: static; width: 100%; border-radius: 10px; display: flex; justify-content: space-between; align-items: center; gap: 25px; z-index: 9999; box-shadow: none; } .cta-buttons { display: flex; gap: 12px; white-space: nowrap; } .yatra-btn { padding: 8px 25px; border-radius: 10px; font-weight: 600; font-size: 15px; text-decoration: none; color: #fff; display: flex; align-items: center; gap: 6px; } .oranges{background: #cc6735;} .callback { background: #f2c230; color: #000; } .whatsapp { background: #1f8f2e; } .callnow { border: 2px solid #2F5BD3; color: #2F5BD3; } .yatra-btn:hover { opacity: 0.9; transform: translateY(-2px); transition: 0.2s; } /* ================================ MOBILE → STICKY CTA ================================ */ @media (max-width: 768px) { .sticky-chardham-cta { position: fixed !important; bottom: 0; left: 0; width: 100%; background: #fff9f4; box-shadow: 0 -5px 20px rgba(0,0,0,0.15); flex-direction: column; align-items: center !important; text-align: center !important; padding: 14px 20px 12px 20px; gap: 12px; } .cta-buttons { width: 100%; justify-content: center !important; gap: 10px; flex-wrap: wrap; } .yatra-btn { flex: none; padding: 8px 14px !important; font-size: 13px !important; border-radius: 6px; } } @media (max-width: 400px) { .yatra-btn { padding: 7px 10px !important; font-size: 12px !important; } } /* OVERLAY */ .popup-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: none; justify-content: center; align-items: center; z-index: 10000; } /* POPUP BOX */ .popup-box { background: #fff; width: 400px; max-width: 92%; border-radius: 18px; overflow: hidden; position: relative; animation: popupZoom 0.4s ease; } /* CLOSE */ .popup-close { position: absolute; top: 10px; right: 14px; font-size: 18px; cursor: pointer; color: #fff; z-index: 2; } /* IMAGE HEADER */ .popup-image { height: 100px; background: url('https://www.haridwarrishikeshtourism.com/assets/chardham-2026.webp') center/cover no-repeat; position: relative; } .popup-image-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.45); color: #fff; display: flex; flex-direction: column; justify-content: center; padding: 20px; } .popup-image-overlay h3 { margin: 0; font-size: 22px; font-weight: 700; } .popup-image-overlay p { margin: 4px 0 0; font-size: 13px; } /* CONTENT */ .popup-content { padding: 20px; } .popup-content h3 { margin: 0; font-size: 20px; } .popup-sub { font-size: 14px; color: #666; margin: 6px 0 14px; } /* FORM */ .popup-form input, .popup-form textarea { width: 100%; padding: 11px; margin-bottom: 12px; border-radius: 8px; border: 1px solid #ddd; font-size: 14px; } .popup-form button { width: 100%; background: linear-gradient(135deg, #ff8a00, #f47905); color: #fff; border: none; padding: 12px; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; } .popup-form small { display: block; margin-top: 10px; font-size: 11px; color: #777; text-align: center; } /* ANIMATION */ @keyframes popupZoom { from { transform: scale(0.85); opacity: 0; } to { transform: scale(1); opacity: 1; } } /* MOBILE */ @media(max-width: 480px){ .popup-image { height: 120px; } } /* Flex */ .why-trust-flex { display: flex; gap: 30px; align-items: center; } /* LEFT CONTENT */ .why-trust-content { flex: 1; text-align: center; } /* CENTER IMAGE */ .why-trust-content img { display: block; margin: 0 auto 8px; max-width: 120px; } /* Govt text */ .govt-text { font-size: 14px; font-weight: 600; color: #0a7a35; margin-bottom: 16px; } /* Button */ .why-btn { display: inline-block; padding: 6px 10px; border-radius: 30px; background: #d26b36; color: #fff; font-size: 12px; font-weight: 600; text-decoration: none; transition: all 0.3s ease; } .why-btn:hover { background: #084298; } /* RIGHT REVIEWS */ .why-trust-reviews { flex: 1; } .google-review-card { text-align: center; } .google-stars { color: #fbbc04; font-size: 20px; margin: 6px 0; } .google-based { font-size: 14px; color: #555; } .google-brand { display: flex; justify-content: center; align-items: center; gap: 6px; margin-top: 8px; } /* MOBILE */ @media (max-width: 768px) { .why-trust-flex { flex-direction: column; } } .image-list { display: flex; flex-wrap: wrap; gap: 10px; } .image-item { position: relative; display: inline-block; } .image-item img { position: absolute; top: 0; left: 0; transition: opacity 0.3s ease; object-fit: cover; } .image-item img.default-img { position: relative; /* Keep this one in flow to set container size */ } .image-item img.hover-img { opacity: 0; } .image-item:hover img.default-img { opacity: 0; } .image-item:hover img.hover-img { opacity: 1; } .carry-compact-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px 20px; list-style: none; padding: 0; margin: 0; } .carry-compact-list li { font-size: 13px; background: #fff7ef6e; padding: 10px 14px; border-radius: 10px; font-family: 'Poppins', sans-serif; font-weight: 600; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px; } .carry-note { margin-top: 16px; font-size: 13px; color: #666; }