/* ========================================================================== Space Lanka Travels — Glassmorphism Theme (Green & Blue) Applied via on the Tours listing page and every individual tour detail page. Layers on top of style.css — does not touch any other page. ========================================================================== */ body.tour-glass{ --g-green:#18E0A8; --g-green-dark:#0F9E77; --g-blue:#2E9AFF; --g-blue-dark:#1665C4; --g-ink:#06120F; --glass-bg:rgba(255,255,255,.08); --glass-bg-2:rgba(255,255,255,.13); --glass-border:rgba(255,255,255,.22); --glass-line:rgba(255,255,255,.14); --text-hi:#F3FFFC; --text-lo:rgba(243,255,252,.72); --text-lo2:rgba(243,255,252,.52); background: radial-gradient(1100px 620px at 8% -8%, rgba(46,154,255,.35), transparent 60%), radial-gradient(900px 700px at 96% 8%, rgba(24,224,168,.30), transparent 55%), radial-gradient(1200px 800px at 50% 100%, rgba(22,101,196,.28), transparent 60%), linear-gradient(160deg, #052821 0%, #063a4a 48%, #041c33 100%); background-attachment:fixed; color:var(--text-hi); } body.tour-glass section{background:transparent;} body.tour-glass .section-cream2{background:transparent;} /* ---------- Headings / text ---------- */ body.tour-glass h1, body.tour-glass h2, body.tour-glass h3, body.tour-glass h4{color:var(--text-hi);} body.tour-glass p{color:var(--text-lo);} body.tour-glass .eyebrow{color:var(--g-green);} body.tour-glass .eyebrow::before{background:linear-gradient(90deg,var(--g-green),var(--g-blue));} /* ---------- Header / nav ---------- */ body.tour-glass .site-header.solid{ background:rgba(6,30,26,.55); backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%); box-shadow:0 1px 0 rgba(255,255,255,.08); } body.tour-glass .brand-text strong{color:var(--text-hi);} body.tour-glass .brand-text span{color:var(--g-green);} body.tour-glass .nav-links a{color:var(--text-hi);} body.tour-glass .nav-links a::after{background:linear-gradient(90deg,var(--g-green),var(--g-blue));} body.tour-glass .nav-toggle span{background:var(--text-hi);} @media (max-width:760px){ body.tour-glass .nav-links{background:rgba(5,28,25,.97);backdrop-filter:blur(20px);} body.tour-glass .nav-links a{color:var(--text-hi)!important;} } /* ---------- Page hero ---------- */ body.tour-glass .page-hero::before{ background:linear-gradient(180deg, rgba(5,30,26,.72), rgba(6,40,60,.68)); } body.tour-glass .breadcrumb{color:var(--text-lo);} body.tour-glass .breadcrumb a{color:var(--g-green);} /* ---------- Generic glass panel helper ---------- */ body.tour-glass .glass-panel{ background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:22px; backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%); box-shadow:0 12px 40px rgba(2,20,20,.35), inset 0 1px 0 rgba(255,255,255,.12); } /* ---------- Tour detail blocks ---------- */ body.tour-glass .tour-block{ background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:26px; padding:40px 40px 8px; backdrop-filter:blur(22px) saturate(160%); -webkit-backdrop-filter:blur(22px) saturate(160%); box-shadow:0 12px 40px rgba(2,20,20,.35), inset 0 1px 0 rgba(255,255,255,.12); } body.tour-glass .tour-block:last-child{padding-bottom:40px;} body.tour-glass .tour-quickfacts{border-top-color:var(--glass-line);border-bottom-color:var(--glass-line);} body.tour-glass .tour-quickfacts span{color:var(--text-lo2);} body.tour-glass .highlight-pills span{ background:rgba(255,255,255,.10);color:var(--text-hi);border:1px solid var(--glass-border); } body.tour-glass .highlight-pills i{color:var(--g-green);} /* Itinerary */ body.tour-glass .itinerary::before{background:linear-gradient(180deg,var(--g-green),var(--g-blue));opacity:.5;} body.tour-glass .itin-num{ background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d; } body.tour-glass .itin-card{ background:var(--glass-bg-2);border:1px solid var(--glass-border); box-shadow:0 10px 30px rgba(2,20,20,.3); } body.tour-glass .itin-card p{color:var(--text-lo);} body.tour-glass .itin-tags span{background:rgba(255,255,255,.10);color:var(--text-hi);} body.tour-glass .itin-meta{border-top-color:var(--glass-line);color:var(--text-lo2);} body.tour-glass .itin-meta strong{color:var(--text-hi);} /* Inclusions */ body.tour-glass .incl-list li{color:var(--text-hi);} body.tour-glass .incl-list.yes i{color:var(--g-green);} body.tour-glass .incl-list.no i{color:var(--text-lo2);} body.tour-glass .incl-list.no li{color:var(--text-lo);} /* Accordion / FAQ */ body.tour-glass .acc-item{border-bottom-color:var(--glass-line);} body.tour-glass .acc-item button{color:var(--text-hi);} body.tour-glass .acc-item i{color:var(--g-green);} body.tour-glass .acc-content p{color:var(--text-lo);} /* Gallery + map */ body.tour-glass .tour-gallery a{border:1px solid var(--glass-border);} body.tour-glass .tour-map{border:1px solid var(--glass-border);filter:saturate(1.05);} /* Related strip */ body.tour-glass .related-strip a{ color:var(--text-hi);border-color:var(--glass-border);background:rgba(255,255,255,.06); } body.tour-glass .related-strip a:hover{ background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d;border-color:transparent; } /* ---------- Sticky booking card ---------- */ body.tour-glass .booking-card{ background:linear-gradient(165deg, rgba(255,255,255,.14), rgba(255,255,255,.06)); border:1px solid var(--glass-border); backdrop-filter:blur(24px) saturate(170%); -webkit-backdrop-filter:blur(24px) saturate(170%); box-shadow:0 20px 60px rgba(2,20,20,.4), inset 0 1px 0 rgba(255,255,255,.15); } body.tour-glass .bk-from{color:var(--g-green);} body.tour-glass .bk-price{color:var(--text-hi);} body.tour-glass .bk-price span{color:var(--text-lo2);} body.tour-glass .bk-facts{border-top-color:var(--glass-line);border-bottom-color:var(--glass-line);} body.tour-glass .bk-facts li span:first-child{color:var(--text-lo2);} body.tour-glass .bk-facts li span:last-child{color:var(--text-hi);} body.tour-glass .bk-note{color:var(--text-lo2);} body.tour-glass p.bk-note-inline{color:var(--text-lo2);} body.tour-glass .booking-card > p{color:var(--text-lo2);} /* ---------- Buttons ---------- */ body.tour-glass .btn-primary, body.tour-glass .booking-card .btn-whatsapp, body.tour-glass .cta-banner .btn-whatsapp{ background:linear-gradient(135deg,var(--g-green),var(--g-blue)); color:#06231d;border-color:transparent; } body.tour-glass .btn-primary:hover, body.tour-glass .booking-card .btn-whatsapp:hover, body.tour-glass .cta-banner .btn-whatsapp:hover{ filter:brightness(1.08);transform:translateY(-2px); box-shadow:0 14px 30px rgba(24,224,168,.35); } body.tour-glass .btn-outline{ background:rgba(255,255,255,.05);border-color:var(--glass-border);color:var(--text-hi); } body.tour-glass .btn-outline:hover{background:rgba(255,255,255,.14);color:var(--text-hi);} body.tour-glass .btn-outline-light{border-color:rgba(255,255,255,.5);color:var(--text-hi);} body.tour-glass .btn-outline-light:hover{background:rgba(255,255,255,.14);color:var(--text-hi);} /* ---------- CTA banner ---------- */ body.tour-glass .cta-banner{ background:linear-gradient(135deg, rgba(24,224,168,.22), rgba(46,154,255,.22)); border:1px solid var(--glass-border); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); } body.tour-glass .cta-banner::after{display:none;} body.tour-glass .cta-banner h2{color:var(--text-hi);} /* ---------- Tours listing: tabs + ticket cards ---------- */ body.tour-glass .tab-btn{ background:rgba(255,255,255,.07);border:1px solid var(--glass-border);color:var(--text-hi); } body.tour-glass .tab-btn.active,body.tour-glass .tab-btn:hover{ background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d;border-color:transparent; } body.tour-glass .ticket{ background:var(--glass-bg); border:1px solid var(--glass-border); backdrop-filter:blur(20px) saturate(160%); -webkit-backdrop-filter:blur(20px) saturate(160%); box-shadow:0 14px 40px rgba(2,20,20,.3); position:relative; } body.tour-glass .ticket:hover{box-shadow:0 26px 60px rgba(2,20,20,.42);} body.tour-glass .ticket-tag{ background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d; } body.tour-glass .ticket-route{color:var(--g-green);} body.tour-glass .ticket-body p{color:var(--text-lo);} body.tour-glass .ticket-perf::before,body.tour-glass .ticket-perf::after{ background:radial-gradient(circle,transparent 0,transparent 8px, var(--g-ink) 9px); } body.tour-glass .ticket-price strong{color:var(--text-hi);} body.tour-glass .ticket-price span{color:var(--text-lo2);} body.tour-glass .ticket-link{color:var(--g-green);} body.tour-glass .ticket-link:hover{color:var(--g-blue);} /* "Contain box" — whole card is clickable via a stretched link */ body.tour-glass .ticket-boxlink{ position:absolute;inset:0;z-index:1;border-radius:inherit; } body.tour-glass .ticket-boxlink span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);} body.tour-glass .ticket-link{position:relative;z-index:2;} /* ---------- Footer accent line ---------- */ body.tour-glass .site-footer{ position:relative;background:rgba(3,18,16,.9);backdrop-filter:blur(10px); } body.tour-glass .site-footer::before{ content:"";position:absolute;top:0;left:0;right:0;height:2px; background:linear-gradient(90deg,var(--g-green),var(--g-blue)); } /* ---------- Floating decorative blobs ---------- */ body.tour-glass::before{ content:"";position:fixed;inset:0;z-index:-1;pointer-events:none; background: radial-gradient(600px 400px at 12% 18%, rgba(24,224,168,.10), transparent 60%), radial-gradient(700px 500px at 88% 78%, rgba(46,154,255,.12), transparent 60%); } @media (max-width:760px){ body.tour-glass .tour-block{padding:26px 22px 6px;border-radius:20px;} } /* ========================================================================== Site-wide glass coverage — homepage, about, blog, contact, 404 ========================================================================== */ /* Big homepage hero */ body.tour-glass .hero::before{ background:linear-gradient(0deg, rgba(4,24,22,.88) 0%, rgba(6,40,50,.5) 46%, rgba(6,40,50,.28) 100%); } body.tour-glass .hero-sub{color:var(--text-lo);} body.tour-glass .hero-stats{border-top-color:var(--glass-line);} body.tour-glass .hero-stats div{border-right-color:var(--glass-line);} body.tour-glass .hero-stats strong{color:var(--g-green);} body.tour-glass .hero-stats span{color:var(--text-lo2);} body.tour-glass .hero h1 em{color:var(--g-green);} body.tour-glass .section-head p{color:var(--text-lo);} body.tour-glass .section-ink{background:rgba(255,255,255,.05);} body.tour-glass .section-ink p{color:var(--text-lo);} /* Feature cards */ body.tour-glass .feature-card{ background:var(--glass-bg);border:1px solid var(--glass-border); backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%); box-shadow:0 12px 30px rgba(2,20,20,.3); } body.tour-glass .feature-card .icn{ background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d; } body.tour-glass .feature-card p{color:var(--text-lo);} /* About split */ body.tour-glass .split-media .stat-chip{ background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d; box-shadow:0 20px 40px rgba(24,224,168,.3); } body.tour-glass .check-list li{color:var(--text-hi);} body.tour-glass .check-list i{color:var(--g-green);} /* Gallery grid (about page) */ body.tour-glass .gallery-grid a{border:1px solid var(--glass-border);} /* Testimonials */ body.tour-glass .testi-card{ background:var(--glass-bg);border:1px solid var(--glass-border); backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%); box-shadow:0 12px 30px rgba(2,20,20,.3); } body.tour-glass .testi-card .stars{color:var(--g-green);} body.tour-glass .testi-card p{color:var(--text-hi);} body.tour-glass .testi-avatar{background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d;} body.tour-glass .testi-who span{color:var(--text-lo2);} /* Blog cards + post body */ body.tour-glass .blog-card{ background:var(--glass-bg);border:1px solid var(--glass-border); backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%); box-shadow:0 12px 30px rgba(2,20,20,.3); } body.tour-glass .blog-meta{color:var(--g-green);} body.tour-glass .blog-body p{color:var(--text-lo);} body.tour-glass .blog-readmore{color:var(--g-green);} body.tour-glass .blog-readmore:hover{color:var(--g-blue);} body.tour-glass .post-body{ background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:26px; padding:44px 48px;backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%); box-shadow:0 12px 40px rgba(2,20,20,.35); } body.tour-glass .post-body p{color:var(--text-lo);} body.tour-glass .post-body ul li{color:var(--text-hi);} body.tour-glass .post-body ul li i{color:var(--g-green);} body.tour-glass .post-meta-bar{color:var(--text-lo2);} @media (max-width:760px){ body.tour-glass .post-body{padding:26px 22px;border-radius:20px;} } /* Contact page */ body.tour-glass .contact-card{ background:var(--glass-bg-2);border:1px solid var(--glass-border); box-shadow:0 10px 30px rgba(2,20,20,.28); } body.tour-glass .contact-card .icn{background:linear-gradient(135deg,var(--g-green),var(--g-blue));color:#06231d;} body.tour-glass .contact-card span, body.tour-glass .contact-card a{color:var(--text-lo);} body.tour-glass .form-field label{color:var(--text-hi);} body.tour-glass .form-field input, body.tour-glass .form-field select, body.tour-glass .form-field textarea{ background:rgba(255,255,255,.08);border:1px solid var(--glass-border);color:var(--text-hi); } body.tour-glass .form-field input::placeholder, body.tour-glass .form-field textarea::placeholder{color:var(--text-lo2);} body.tour-glass .form-field input:focus, body.tour-glass .form-field select:focus, body.tour-glass .form-field textarea:focus{outline-color:var(--g-green);} body.tour-glass .map-embed{border:1px solid var(--glass-border);} /* 404 page (direct paragraph inside .wrap, not nested component text) */ body.tour-glass .wrap > p{color:var(--text-lo);}