/*
Theme Name: TTB Group Travel
Theme URI: https://ttbgroup.org
Author: TTB Group
Description: Premium travel agency website for Tourist Travel Bureau, Doha Qatar.
Version: 1.7.0
License: Private
Text Domain: ttbgroup
*/

/* ─── TOKENS ─────────────────────────────────────────────────────── */
:root, [data-theme="light"] {
  --text-xs:   clamp(.75rem,  .7rem + .25vw,  .875rem);
  --text-sm:   clamp(.875rem, .8rem + .35vw,  1rem);
  --text-base: clamp(1rem,    .95rem + .25vw, 1.125rem);
  --text-lg:   clamp(1.125rem,1rem + .75vw,   1.5rem);
  --text-xl:   clamp(1.5rem,  1.2rem + 1.25vw,2.25rem);
  --text-2xl:  clamp(2.2rem,  1rem + 3.2vw,   4.8rem);
  --text-hero: clamp(3rem,    .5rem + 6.5vw,  7.5rem);

  --sp1:.25rem;--sp2:.5rem;--sp3:.75rem;--sp4:1rem;--sp5:1.25rem;
  --sp6:1.5rem;--sp8:2rem;--sp10:2.5rem;--sp12:3rem;--sp16:4rem;
  --sp20:5rem;--sp24:6rem;

  --bg:          #f5f1ea;
  --surface:     #faf8f4;
  --surface-2:   #f1ece3;
  --surface-off: #e8e0d5;
  --surface-dyn: #ddd4c5;
  --border:      rgba(36,32,24,.11);
  --divider:     rgba(36,32,24,.07);
  --text:        #1d1a14;
  --muted:       #6a6258;
  --faint:       #a39b91;
  --inverse:     #f9f5ee;
  --primary:     #0a5a61;
  --primary-h:   #07454b;
  --primary-hl:  #d5e4e2;
  --gold:        #b07828;
  --gold-hl:     #ede0c5;

  --r-sm:.375rem;--r-md:.6rem;--r-lg:1rem;--r-xl:1.5rem;--r-2xl:2rem;--r-full:9999px;
  --sh-sm:0 1px 3px rgba(29,26,20,.06);
  --sh-md:0 8px 32px rgba(29,26,20,.10);
  --sh-lg:0 20px 64px rgba(29,26,20,.14);
  --ease:180ms cubic-bezier(.16,1,.3,1);
  --w-narrow:680px;--w-default:1120px;--w-wide:1320px;
  --font-d:'Cormorant Garamond',Georgia,serif;
  --font-b:'Manrope',Arial,sans-serif;
}
[data-theme="dark"] {
  --bg:#171411;--surface:#201c18;--surface-2:#28241f;
  --surface-off:#302b25;--surface-dyn:#3a342d;
  --border:rgba(249,245,238,.11);--divider:rgba(249,245,238,.07);
  --text:#ede6db;--muted:#b0a89e;--faint:#857d74;--inverse:#1d1a14;
  --primary:#5ba8af;--primary-h:#82c4c9;--primary-hl:rgba(91,168,175,.15);
  --gold:#d4a856;--gold-hl:rgba(212,168,86,.15);
  --sh-sm:0 1px 3px rgba(0,0,0,.25);
  --sh-md:0 8px 32px rgba(0,0,0,.32);
  --sh-lg:0 20px 64px rgba(0,0,0,.42);
}

/* ─── RESET / BASE ─────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:none;text-size-adjust:none;scroll-padding-top:100px}
body{min-height:100vh;font-family:var(--font-b);font-size:var(--text-base);line-height:1.65;
  color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
img,picture,video,svg{display:block;max-width:100%;height:auto}
ul[role=list],ol[role=list]{list-style:none}
input,button,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--font-d);line-height:.95;letter-spacing:-.02em;text-wrap:balance}
p,li{text-wrap:pretty;max-width:68ch}
a{color:inherit;text-decoration:none}
button{cursor:pointer;border:none;background:none}
::selection{background:rgba(10,90,97,.2)}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:var(--r-sm)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ─── UTILITIES ────────────────────────────────────────────────── */
.wrap{width:min(calc(100% - var(--sp8)),var(--w-default));margin-inline:auto}
.wrap-wide{width:min(calc(100% - var(--sp8)),var(--w-wide));margin-inline:auto}
.kicker{font-family:var(--font-b);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;
  font-weight:800;color:var(--gold);display:block}
.tag{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .85rem;border-radius:var(--r-full);
  font-size:var(--text-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  background:var(--primary-hl);color:var(--primary)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  min-height:52px;padding:.9rem 1.6rem;border-radius:var(--r-full);
  font-size:var(--text-sm);font-weight:700;transition:all var(--ease)}
.btn-primary{background:var(--primary);color:var(--inverse);box-shadow:var(--sh-sm)}
.btn-primary:hover{background:var(--primary-h);transform:translateY(-2px);box-shadow:var(--sh-md)}
.btn-primary:active{transform:translateY(0)}
.btn-outline{border:1.5px solid var(--border);background:var(--surface)}
.btn-outline:hover{border-color:var(--primary);color:var(--primary)}
.skip-link{position:absolute;left:1rem;top:-4rem;background:var(--primary);color:var(--inverse);
  padding:.7rem 1.2rem;border-radius:var(--r-md);z-index:999;font-size:var(--text-sm)}
.skip-link:focus{top:1rem}

/* ─── HEADER ───────────────────────────────────────────────────── */
.site-header{position:sticky;top:0;z-index:100;
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  background:color-mix(in srgb,var(--bg) 85%,transparent);
  border-bottom:1px solid var(--divider)}
.header-inner{display:flex;align-items:center;justify-content:space-between;
  min-height:80px;gap:var(--sp4)}
.brand{display:flex;align-items:center;gap:var(--sp3);flex-shrink:0}
.brand svg{width:44px;height:44px;color:var(--primary);flex-shrink:0}
.brand-text strong{display:block;font-family:var(--font-b);font-weight:800;
  font-size:var(--text-sm);letter-spacing:.18em;text-transform:uppercase;color:var(--text)}
.brand-text span{font-size:var(--text-xs);color:var(--muted)}
nav.main-nav{display:flex;align-items:center;gap:var(--sp6)}
nav.main-nav a{font-size:var(--text-sm);font-weight:600;color:var(--muted);
  padding:.4rem 0;border-bottom:2px solid transparent;transition:all var(--ease)}
nav.main-nav a:hover{color:var(--text);border-color:var(--primary)}
.hdr-actions{display:flex;align-items:center;gap:var(--sp3)}
.icon-btn{width:44px;height:44px;border-radius:var(--r-full);border:1px solid var(--border);
  background:var(--surface);display:inline-flex;align-items:center;justify-content:center;
  transition:all var(--ease)}
.icon-btn:hover{border-color:var(--primary);color:var(--primary)}
#mobileToggle{display:none}
.mobile-nav{display:none;position:absolute;left:var(--sp4);right:var(--sp4);top:calc(100% + .6rem);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);
  padding:var(--sp5);box-shadow:var(--sh-lg);flex-direction:column;gap:var(--sp4);z-index:200}
.mobile-nav.open{display:flex}
.mobile-nav a{font-size:var(--text-base);font-weight:600;color:var(--muted);padding:var(--sp2) 0;
  border-bottom:1px solid var(--divider)}
.mobile-nav a:last-child{border-bottom:0}

/* ─── HERO ─────────────────────────────────────────────────────── */
.hero{padding:clamp(var(--sp12),8vw,var(--sp24)) 0 0;position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.18}
[data-theme="dark"] .hero-bg img{opacity:.08}
.hero-inner{position:relative;z-index:1}
.hero-grid{display:grid;grid-template-columns:1fr .95fr;gap:var(--sp8);align-items:start}
.hero-heading{font-size:var(--text-hero);margin-top:var(--sp5);color:var(--text)}
.hero-sub{font-size:var(--text-lg);color:var(--muted);margin-top:var(--sp5);max-width:38ch}
.hero-ctas{display:flex;flex-wrap:wrap;gap:var(--sp3);margin-top:var(--sp8)}
.hero-trust{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp4);margin-top:var(--sp6)}
.trust-pill{display:flex;align-items:center;gap:.5rem;font-size:var(--text-xs);
  font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.trust-pill svg{color:var(--gold)}
.hero-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2xl);
  box-shadow:var(--sh-lg);overflow:hidden;position:sticky;top:100px}
.hero-card-img{position:relative;height:240px;overflow:hidden}
.hero-card-img img{width:100%;height:100%;object-fit:cover}
.hero-card-img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,90,97,.6),transparent 50%)}
.hero-card-badge{position:absolute;bottom:var(--sp4);left:var(--sp4);
  background:rgba(255,255,255,.15);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);
  border-radius:var(--r-full);padding:.4rem .85rem;color:#fff;font-size:var(--text-xs);font-weight:700;
  letter-spacing:.1em;text-transform:uppercase}
.hero-card-body{padding:var(--sp6)}
.book-form{display:grid;gap:var(--sp4)}
.book-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp3)}
.field-group{display:grid;gap:.45rem}
.field-group label{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;color:var(--muted)}
.field-group input,.field-group select{width:100%;min-height:50px;border-radius:var(--r-md);
  border:1px solid var(--border);background:var(--bg);padding:0 var(--sp4);font-size:var(--text-sm)}
.field-group input:focus-visible,.field-group select:focus-visible{
  outline:2px solid var(--primary);outline-offset:2px}
.hero-wave{display:block;margin-top:var(--sp12)}

/* ─── DESTINATIONS ─────────────────────────────────────────────── */
.section-hdr{margin-bottom:var(--sp10)}
.section-hdr h2{font-size:var(--text-2xl);margin-top:var(--sp3);max-width:14ch}
.section-hdr p{color:var(--muted);margin-top:var(--sp4);max-width:44ch}
.dest-tabs{display:flex;gap:var(--sp3);flex-wrap:wrap;margin-bottom:var(--sp8)}
.dest-tab{padding:.55rem 1.15rem;border-radius:var(--r-full);font-size:var(--text-sm);font-weight:700;
  border:1px solid var(--border);background:var(--surface);transition:all var(--ease);cursor:pointer}
.dest-tab:hover,.dest-tab.active{background:var(--primary);color:var(--inverse);border-color:var(--primary)}
.dest-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;grid-template-rows:auto auto;gap:var(--sp4)}
.dest-card{border-radius:var(--r-xl);overflow:hidden;position:relative;box-shadow:var(--sh-sm);
  transition:transform var(--ease),box-shadow var(--ease);cursor:pointer}
.dest-card:hover{transform:translateY(-4px);box-shadow:var(--sh-md)}
.dest-card.featured{grid-row:1/3}
.dest-card img{width:100%;height:100%;object-fit:cover;display:block}
.dest-card.featured img{height:100%;min-height:460px}
.dest-card:not(.featured) img{height:196px}
.dest-overlay{position:absolute;inset:0;
  background:linear-gradient(to top,rgba(10,40,45,.75) 0%,transparent 55%);
  display:flex;flex-direction:column;justify-content:flex-end;padding:var(--sp5)}
.dest-overlay h3{font-size:var(--text-xl);color:#fff;line-height:1}
.dest-overlay p{font-size:var(--text-xs);color:rgba(255,255,255,.8);margin-top:.3rem;text-transform:uppercase;letter-spacing:.12em}
.dest-overlay-tag{position:absolute;top:var(--sp4);left:var(--sp4);
  background:rgba(255,255,255,.15);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);
  border-radius:var(--r-full);padding:.35rem .75rem;color:#fff;
  font-size:var(--text-xs);font-weight:700;letter-spacing:.08em}

/* ─── SERVICES ─────────────────────────────────────────────────── */
.services-bg{background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--primary-hl) 35%,transparent),transparent)}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp4)}
.srv-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);
  padding:var(--sp6);box-shadow:var(--sh-sm);transition:all var(--ease);display:grid;gap:var(--sp3)}
.srv-card:hover{box-shadow:var(--sh-md);transform:translateY(-3px)}
.srv-icon{width:52px;height:52px;border-radius:var(--r-lg);background:var(--primary-hl);
  display:flex;align-items:center;justify-content:center;color:var(--primary)}
.srv-icon svg{width:26px;height:26px}
.srv-card h3{font-size:var(--text-lg);margin-top:var(--sp2)}
.srv-card p{font-size:var(--text-sm);color:var(--muted)}
.srv-card ul{list-style:none;display:grid;gap:var(--sp2)}
.srv-card li{font-size:var(--text-sm);color:var(--muted);padding-left:1.1rem;position:relative}
.srv-card li::before{content:"→";position:absolute;left:0;color:var(--primary);font-size:.8rem}

/* ─── WHY TTB ──────────────────────────────────────────────────── */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp6);align-items:center}
.why-left img{width:100%;border-radius:var(--r-2xl);box-shadow:var(--sh-lg);
  aspect-ratio:4/3;object-fit:cover}
.why-right{display:grid;gap:var(--sp8)}
.why-item{display:grid;grid-template-columns:auto 1fr;gap:var(--sp4);align-items:start}
.why-num{font-family:var(--font-d);font-size:var(--text-xl);color:var(--primary-hl);
  font-weight:700;line-height:1;min-width:2.5rem}
.why-item h3{font-size:var(--text-lg);margin-bottom:.5rem}
.why-item p{font-size:var(--text-sm);color:var(--muted)}

/* ─── TESTIMONIALS ─────────────────────────────────────────────── */
.testi-section{background:linear-gradient(135deg,var(--primary) 0%,#0c4a52 100%);
  padding:clamp(var(--sp12),7vw,var(--sp20)) 0}
.testi-section .kicker{color:rgba(249,245,238,.6)}
.testi-section h2{color:var(--inverse);margin-top:var(--sp3)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp4);margin-top:var(--sp8)}
.testi-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-xl);padding:var(--sp6);backdrop-filter:blur(4px)}
.testi-stars{display:flex;gap:.3rem;color:var(--gold);margin-bottom:var(--sp3)}
.testi-quote{font-size:var(--text-base);color:rgba(249,245,238,.85);font-style:italic;line-height:1.7}
.testi-author{display:flex;align-items:center;gap:var(--sp3);margin-top:var(--sp4)}
.testi-avatar{width:42px;height:42px;border-radius:var(--r-full);overflow:hidden;
  background:rgba(255,255,255,.1);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.testi-avatar svg{width:24px;height:24px;color:rgba(255,255,255,.5)}
.testi-name{font-weight:700;font-size:var(--text-sm);color:var(--inverse)}
.testi-loc{font-size:var(--text-xs);color:rgba(249,245,238,.55);text-transform:uppercase;letter-spacing:.1em}

/* ─── SPECIAL OFFERS ──────────────────────────────────────────── */
.offers-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--sp4)}
.offer-main,.offer-stack{display:grid;gap:var(--sp4)}
.offer-card{border-radius:var(--r-xl);overflow:hidden;position:relative;box-shadow:var(--sh-sm);
  background:var(--surface);border:1px solid var(--border);transition:all var(--ease)}
.offer-card:hover{box-shadow:var(--sh-md);transform:translateY(-3px)}
.offer-img{height:220px;overflow:hidden}
.offer-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.offer-card:hover .offer-img img{transform:scale(1.04)}
.offer-body{padding:var(--sp5)}
.offer-body h3{font-size:var(--text-lg);margin-top:var(--sp2)}
.offer-body p{font-size:var(--text-sm);color:var(--muted);margin-top:.4rem}
.offer-footer{display:flex;justify-content:space-between;align-items:center;margin-top:var(--sp4)}
.offer-price strong{font-size:var(--text-lg);color:var(--primary)}
.offer-price span{font-size:var(--text-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.offer-stack .offer-card{display:grid;grid-template-columns:160px 1fr}
.offer-stack .offer-img{height:auto}
.offer-stack .offer-body{padding:var(--sp4)}

/* ─── CONTACT ───────────────────────────────────────────────────── */
.contact-shell{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--sp6)}
.contact-form-card{background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-2xl);padding:var(--sp8);box-shadow:var(--sh-md)}
.contact-form-card h2{font-size:var(--text-2xl)}
.contact-form-card p{color:var(--muted);margin-top:var(--sp3);max-width:36ch}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp4);margin-top:var(--sp6)}
.form-grid .full{grid-column:1/-1}
.fl{display:grid;gap:.45rem}
.fl label{font-size:var(--text-sm);font-weight:700;color:var(--text)}
.fl input,.fl select,.fl textarea{
  width:100%;min-height:52px;border-radius:var(--r-md);
  border:1px solid var(--border);background:var(--bg);
  padding:0.9rem var(--sp4);font-size:var(--text-sm)}
.fl textarea{min-height:120px;resize:vertical;padding-top:.9rem}
.fl input:focus-visible,.fl select:focus-visible,.fl textarea:focus-visible{
  outline:2px solid var(--primary);outline-offset:2px}
.contact-info-stack{display:grid;gap:var(--sp4);align-content:start}
.info-block{background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-xl);padding:var(--sp6);box-shadow:var(--sh-sm)}
.info-block h3{font-size:var(--text-lg);margin-bottom:var(--sp4)}
.info-list{list-style:none;display:grid;gap:var(--sp4)}
.info-list li{display:flex;gap:var(--sp3);align-items:flex-start}
.info-list .ico{width:40px;height:40px;flex-shrink:0;border-radius:var(--r-md);
  background:var(--primary-hl);color:var(--primary);display:flex;align-items:center;justify-content:center}
.info-list .ico svg{width:18px;height:18px}
.info-list strong{display:block;font-size:var(--text-sm);font-weight:700}
.info-list span{font-size:var(--text-sm);color:var(--muted)}
.map-placeholder{border-radius:var(--r-xl);overflow:hidden;position:relative}
.map-placeholder iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:var(--r-xl)}

/* ─── FOOTER ────────────────────────────────────────────────────── */
footer{background:var(--surface-2);border-top:1px solid var(--border);
  padding:clamp(var(--sp10),6vw,var(--sp16)) 0 var(--sp8)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--sp8)}
.footer-brand svg{width:42px;height:42px;color:var(--primary)}
.footer-brand h2{font-size:var(--text-xl);margin-top:var(--sp3)}
.footer-brand p{font-size:var(--text-sm);color:var(--muted);margin-top:var(--sp3);max-width:28ch}
.footer-col h4{font-family:var(--font-b);font-size:var(--text-sm);font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--sp4)}
.footer-col ul{list-style:none;display:grid;gap:var(--sp3)}
.footer-col li a{font-size:var(--text-sm);color:var(--muted);transition:color var(--ease)}
.footer-col li a:hover{color:var(--primary)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;
  gap:var(--sp4);margin-top:var(--sp10);padding-top:var(--sp6);border-top:1px solid var(--divider)}
.footer-bottom p{font-size:var(--text-xs);color:var(--faint)}
.social-row{display:flex;gap:var(--sp3)}
.social-row a{width:38px;height:38px;border-radius:var(--r-full);border:1px solid var(--border);
  background:var(--surface);display:flex;align-items:center;justify-content:center;
  color:var(--muted);transition:all var(--ease)}
.social-row a:hover{background:var(--primary);border-color:var(--primary);color:var(--inverse)}

/* ─── SCROLL REVEALS ─────────────────────────────────────────────── */
.fade{opacity:1}
@supports(animation-timeline:view()){
  .fade{opacity:0;animation:rv linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
  @keyframes rv{to{opacity:1}}
}

/* ─── SECTION SPACING ───────────────────────────────────────────── */
section{padding:clamp(var(--sp12),7vw,var(--sp20)) 0}

/* ─── RESPONSIVE ─────────────────────────────────────────────────── */
@media(max-width:1080px){
  .dest-grid{grid-template-columns:1fr 1fr}
  .dest-card.featured{grid-row:unset}
  .dest-card.featured img{min-height:260px}
  .services-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
  .hero-grid,.why-grid,.contact-shell,.offers-grid{grid-template-columns:1fr}
  .hero-card{position:static}
  #mobileToggle{display:inline-flex}
  nav.main-nav{display:none}
  .hdr-actions .btn{display:none}
  .testi-grid{grid-template-columns:1fr 1fr}
  .offer-stack .offer-card{grid-template-columns:1fr}
  .offer-stack .offer-img{height:180px}
}
@media(max-width:600px){
  .dest-grid{grid-template-columns:1fr}
  .services-grid{grid-template-columns:1fr}
  .testi-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:1}
  .book-row{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;align-items:flex-start}
}
  
/* ─── WHATSAPP BUTTON ─────────────────────────────────────────── */
.wa-btn {
  position: fixed; bottom: var(--sp6); right: var(--sp6); z-index: 999;
  display: flex; align-items: center; gap: var(--sp3);
  background: #25D366; color: #fff;
  border-radius: var(--r-full); box-shadow: 0 8px 32px rgba(37,211,102,.45);
  padding: .85rem 1.4rem .85rem 1.1rem;
  font-size: var(--text-sm); font-weight: 700;
  transition: all .22s cubic-bezier(.16,1,.3,1);
  text-decoration: none; cursor: pointer;
  animation: wa-pop .6s cubic-bezier(.16,1,.3,1) 1.2s both;
  border: none;
}
.wa-btn:hover {
  background: #1ebc5b; transform: translateY(-3px) scale(1.03);
  box-shadow: 0 14px 40px rgba(37,211,102,.55);
}
.wa-btn:active { transform: translateY(0) scale(.98); }
.wa-btn svg { flex-shrink: 0; width: 26px; height: 26px; }
.wa-label { max-width: 0; overflow: hidden; white-space: nowrap;
  transition: max-width .35s cubic-bezier(.16,1,.3,1), opacity .25s ease; opacity: 0; }
.wa-btn:hover .wa-label { max-width: 200px; opacity: 1; }
.wa-pulse {
  position: absolute; top: -5px; right: -5px;
  width: 15px; height: 15px; background: #ff4757;
  border-radius: var(--r-full); border: 2px solid #25D366;
}
.wa-pulse::after {
  content: ''; position: absolute; inset: -3px;
  border-radius: var(--r-full); background: rgba(255,71,87,.4);
  animation: pulse-ring 1.8s ease-out infinite;
}
@keyframes pulse-ring { 0%{transform:scale(1);opacity:.8} 100%{transform:scale(2.4);opacity:0} }
@keyframes wa-pop { from{opacity:0;transform:scale(.6) translateY(20px)} to{opacity:1;transform:scale(1) translateY(0)} }
.wa-popup {
  position: fixed; bottom: calc(var(--sp6) + 82px); right: var(--sp6); z-index: 998;
  width: 320px; background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--r-2xl); box-shadow: var(--sh-lg); overflow: hidden;
  transform: scale(.88) translateY(16px); transform-origin: bottom right;
  opacity: 0; pointer-events: none;
  transition: all .3s cubic-bezier(.16,1,.3,1);
}
.wa-popup.open { transform: scale(1) translateY(0); opacity: 1; pointer-events: all; }
.wa-popup-header {
  background: #075e54; color: #fff;
  padding: var(--sp4) var(--sp5); display: flex; align-items: center; gap: var(--sp3);
}
.wa-popup-avatar {
  width: 46px; height: 46px; border-radius: var(--r-full);
  background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; flex-shrink: 0;
}
.wa-popup-header strong { display: block; font-size: var(--text-sm); font-weight: 800; }
.wa-popup-header span { font-size: var(--text-xs); color: rgba(255,255,255,.75); }
.wa-popup-close {
  margin-left: auto; background: none; border: none; color: rgba(255,255,255,.8);
  cursor: pointer; padding: .3rem; line-height: 1; border-radius: var(--r-sm);
}
.wa-popup-close:hover { background: rgba(255,255,255,.15); }
.wa-chat-body {
  padding: var(--sp5); background: #e5ddd5; display: flex; flex-direction: column; gap: var(--sp3); min-height: 160px;
}
[data-theme="dark"] .wa-chat-body { background: #1c1c1c; }
.wa-bubble {
  background: #fff; border-radius: 0 var(--r-lg) var(--r-lg) var(--r-lg);
  padding: var(--sp3) var(--sp4); font-size: var(--text-sm); color: #1d1a14;
  box-shadow: 0 1px 3px rgba(0,0,0,.1); max-width: 90%; line-height: 1.5;
  opacity: 0; animation: bubble-in .4s cubic-bezier(.16,1,.3,1) both;
}
.wa-bubble.d1 { animation-delay: .2s; }
.wa-bubble.d2 { animation-delay: .8s; }
.wa-bubble.d3 { animation-delay: 1.4s; }
[data-theme="dark"] .wa-bubble { background: #2a2a2a; color: #ede6db; }
.wa-time { font-size: 10px; color: #999; margin-top: .3rem; text-align: right; }
@keyframes bubble-in { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
.wa-popup-footer { padding: var(--sp4) var(--sp5); border-top: 1px solid var(--divider); }
.wa-start-btn {
  display: flex; align-items: center; justify-content: center; gap: var(--sp2);
  width: 100%; min-height: 52px; background: #25D366; color: #fff;
  border-radius: var(--r-full); font-size: var(--text-sm); font-weight: 700;
  text-decoration: none; border: none; cursor: pointer;
  transition: all var(--ease);
}
.wa-start-btn:hover { background: #1ebc5b; transform: translateY(-1px); }
@media(max-width:400px){.wa-popup{width:calc(100vw - var(--sp8));right:var(--sp4)}.wa-btn{right:var(--sp4);bottom:var(--sp4)}}


/* ─── POPULAR FLIGHTS ─────────────────────────────────────── */
.flights-section{padding:clamp(var(--sp12),6vw,var(--sp24)) 0;background:var(--surface)}
.section-header{text-align:center;margin-bottom:var(--sp10)}
.section-label{font-size:var(--text-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);margin-bottom:var(--sp3)}
.section-sub{color:var(--muted);font-size:var(--text-sm);margin-top:var(--sp2)}

.flight-search-bar{margin-bottom:var(--sp8)}
.flt-search-inner{display:flex;align-items:center;gap:var(--sp3);background:var(--surface-2);border:1.5px solid var(--border);border-radius:var(--r-full);padding:var(--sp3) var(--sp5);max-width:540px;margin:0 auto;transition:border-color var(--ease),box-shadow var(--ease)}
.flt-search-inner:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px oklch(from var(--primary) l c h / 0.12)}
.flt-search-inner svg{color:var(--muted);flex-shrink:0}
.flt-search-inner input{flex:1;border:none;background:none;outline:none;font-size:var(--text-sm);color:var(--text)}
.flt-search-inner input::placeholder{color:var(--muted)}

.flights-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:var(--sp6)}
.flight-card{background:var(--surface-2);border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--border);transition:transform var(--ease),box-shadow var(--ease);display:flex;flex-direction:column}
.flight-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.flight-card.hidden{display:none}
.flight-card-img{position:relative;overflow:hidden;height:180px}
.flight-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.flight-card:hover .flight-card-img img{transform:scale(1.06)}
.flight-badge{position:absolute;top:var(--sp3);left:var(--sp3);background:var(--primary);color:#fff;font-size:var(--text-xs);font-weight:700;padding:.25rem .75rem;border-radius:var(--r-full);letter-spacing:.04em}
.flight-badge--gold{background:linear-gradient(135deg,#b8922a,#d4a843)}

.flight-card-body{padding:var(--sp5);display:flex;flex-direction:column;gap:var(--sp3);flex:1}
.flight-route{display:flex;align-items:center;gap:var(--sp3);justify-content:space-between}
.route-from,.route-to{display:flex;flex-direction:column;align-items:center;gap:2px}
.route-from strong,.route-to strong{font-size:var(--text-lg);font-weight:800;font-family:var(--font-display);letter-spacing:.04em;color:var(--primary)}
.route-from small,.route-to small{font-size:var(--text-xs);color:var(--muted)}
.route-line{flex:1;color:var(--muted)}

.flight-meta{display:flex;gap:var(--sp4);font-size:var(--text-xs);color:var(--muted)}
.flight-price{display:flex;align-items:baseline;gap:var(--sp2)}
.price-from{font-size:var(--text-xs);color:var(--muted)}
.price-amount{font-size:var(--text-xl);font-weight:800;color:var(--primary);font-family:var(--font-display)}
.price-note{font-size:var(--text-xs);color:var(--muted)}
.flight-airlines{font-size:var(--text-xs);color:var(--muted);border-top:1px solid var(--divider);padding-top:var(--sp2)}
.btn-flight{display:flex;align-items:center;justify-content:center;gap:var(--sp2);background:var(--primary);color:#fff;border-radius:var(--r-full);padding:var(--sp3) var(--sp5);font-size:var(--text-sm);font-weight:700;text-decoration:none;transition:all var(--ease);margin-top:auto}
.btn-flight:hover{background:var(--primary-hover);transform:translateY(-1px)}

.flights-cta{text-align:center;margin-top:var(--sp10);display:flex;flex-direction:column;align-items:center;gap:var(--sp4)}
.flights-cta p{color:var(--muted);font-size:var(--text-base)}

