/* ==========================================================================
   SafarEasy - Coming Soon | Premium Luxury Travel Experience
   ========================================================================== */

:root{
  --bg:#050505;
  --bg-secondary:#111111;
  --gold:#D4AF37;
  --gold-soft:rgba(212,175,55,0.35);
  --white:#ffffff;
  --ocean:#0B3D91;
  --sunset:#E8743B;
  --emerald:#2E7D5B;
  --font-display:'Playfair Display', serif;
  --font-body:'Poppins', sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}

*{margin:0;padding:0;box-sizing:border-box;}
html,body{background:var(--bg);color:var(--white);font-family:var(--font-body);overflow-x:hidden;}
img{max-width:100%;display:block;}
button{font-family:var(--font-body);border:none;cursor:pointer;background:none;}
a{color:inherit;text-decoration:none;}
.sr-only{position:absolute;left:-9999px;}

/* Custom cursor */
.cursor,.cursor-follower{position:fixed;top:0;left:0;pointer-events:none;border-radius:50%;z-index:9999;transform:translate(-50%,-50%);}
.cursor{width:8px;height:8px;background:var(--gold);}
.cursor-follower{width:32px;height:32px;border:1px solid var(--gold-soft);transition:width .2s var(--ease),height .2s var(--ease),border-color .2s;}

#grain{position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:.03;background:repeating-radial-gradient(circle,#fff 0,transparent 1px);}

/* Loader */
.loader{position:fixed;inset:0;background:var(--bg);z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;}
.loader-logo{font-family:var(--font-display);font-size:2.5rem;letter-spacing:2px;}
.loader-logo span{color:var(--gold);}
.loader-route{position:relative;width:280px;height:2px;background:rgba(255,255,255,.15);}
.route-line{position:absolute;left:0;top:0;height:100%;width:0%;background:var(--gold);}
.route-plane{position:absolute;top:-10px;left:0;font-size:1.2rem;transform:translateX(-50%);}
.loader-percent{font-family:var(--font-display);color:var(--gold);letter-spacing:1px;}

/* Section base */
section{position:relative;padding:160px 8vw;overflow:hidden;}
.section-title{font-family:var(--font-display);font-size:clamp(2.2rem,5vw,4.5rem);font-weight:600;line-height:1.1;}
.section-title em{color:var(--gold);font-style:italic;}
.section-title.center{text-align:center;margin-bottom:60px;}

/* Hero */
.hero{height:100vh;padding:0;display:flex;align-items:center;justify-content:center;}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,5,5,.4),rgba(5,5,5,.85));z-index:1;}
.clouds{position:absolute;inset:0;z-index:2;background:url('../images/clouds-overlay.png') repeat-x;opacity:.25;animation:driftClouds 60s linear infinite;}
@keyframes driftClouds{from{background-position-x:0;}to{background-position-x:-2000px;}}
.particles{position:absolute;inset:0;z-index:2;pointer-events:none;}
.plane-trail{position:absolute;top:20%;left:-5%;font-size:2rem;color:var(--gold);z-index:3;}
.hero-content{position:relative;z-index:4;text-align:center;max-width:900px;padding:0 20px;}
.eyebrow{color:var(--gold);letter-spacing:3px;text-transform:uppercase;font-size:.8rem;margin-bottom:24px;}
.hero-title{font-family:var(--font-display);font-size:clamp(2.8rem,7vw,6.5rem);line-height:1.05;margin-bottom:24px;}
.hero-sub{font-size:1.1rem;color:rgba(255,255,255,.8);margin-bottom:40px;}
.hero-cta{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;}
.btn{padding:16px 36px;border-radius:50px;font-size:.9rem;letter-spacing:1px;text-transform:uppercase;position:relative;overflow:hidden;transition:transform .3s var(--ease);}
.btn-primary{background:var(--gold);color:#050505;}
.btn-secondary{border:1px solid var(--gold-soft);color:var(--white);backdrop-filter:blur(6px);background:rgba(255,255,255,.03);}
.btn:hover{transform:translateY(-3px);}
.scroll-indicator{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);z-index:4;font-size:.75rem;letter-spacing:2px;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:10px;color:rgba(255,255,255,.6);}
.scroll-indicator span{width:1px;height:40px;background:linear-gradient(var(--gold),transparent);}

/* Vision */
.vision{background:var(--bg-secondary);min-height:100vh;display:flex;align-items:center;}
.vision-pin{max-width:900px;position:relative;z-index:2;}
.vision-text{font-size:1.1rem;color:rgba(255,255,255,.75);margin-top:30px;max-width:640px;}
.world-map{position:absolute;right:-10%;top:50%;width:500px;height:500px;background:url('../images/world-map.svg') no-repeat center/contain;opacity:.15;transform:translateY(-50%);}

/* Destinations */
.dest-track{display:flex;gap:24px;overflow-x:hidden;padding-top:20px;}
.dest-card{position:relative;min-width:320px;height:420px;border-radius:20px;overflow:hidden;flex-shrink:0;box-shadow:0 20px 60px rgba(0,0,0,.5);}
.dest-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
.dest-card:hover img{transform:scale(1.1);}
.dest-card::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.9));}
.dest-card:hover{box-shadow:0 20px 80px var(--gold-soft);}
.dest-info{position:absolute;bottom:24px;left:24px;z-index:2;}
.dest-info h3{font-family:var(--font-display);font-size:1.5rem;}
.dest-info p{font-size:.85rem;color:rgba(255,255,255,.7);}

/* Experiences */
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.exp-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:50px 30px;text-align:center;backdrop-filter:blur(10px);transition:border-color .3s,transform .3s var(--ease);}
.exp-card:hover{border-color:var(--gold);transform:translateY(-8px);}
.exp-icon{font-size:2.5rem;display:block;margin-bottom:20px;}
.exp-card h3{font-family:var(--font-display);font-size:1.3rem;}

/* Why us */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;text-align:center;}
.why-icon{font-size:2.2rem;display:block;margin-bottom:16px;}
.why-item h3{font-family:var(--font-display);margin-bottom:10px;}
.why-item p{color:rgba(255,255,255,.6);font-size:.9rem;}

/* Timeline */
.timeline-track{display:flex;gap:60px;padding-top:40px;position:relative;}
.timeline-track::before{content:'';position:absolute;top:20px;left:0;right:0;height:1px;background:rgba(212,175,55,.3);}
.tl-step{flex:1;text-align:center;position:relative;}
.tl-num{display:block;font-family:var(--font-display);font-size:1.8rem;color:var(--gold);margin-bottom:14px;}

/* Features */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.feature-card{background:rgba(212,175,55,.05);border:1px solid var(--gold-soft);border-radius:14px;padding:40px 20px;text-align:center;font-family:var(--font-display);font-size:1.1rem;}

/* Newsletter */
.newsletter{background:var(--bg-secondary);text-align:center;}
.newsletter-glass{max-width:600px;margin:0 auto;padding:60px 40px;border-radius:24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(16px);position:relative;z-index:2;}
.newsletter-form{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap;justify-content:center;}
.newsletter-form input{flex:1;min-width:220px;padding:16px 20px;border-radius:50px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:#fff;}
.form-message{margin-top:16px;color:var(--gold);font-size:.85rem;min-height:20px;}

/* Countdown */
.countdown{text-align:center;}
.countdown-grid{display:flex;gap:30px;justify-content:center;margin-top:30px;}
.cd-item{background:rgba(255,255,255,.03);border:1px solid rgba(212,175,55,.3);border-radius:16px;padding:24px 30px;min-width:100px;}
.cd-item span{display:block;font-family:var(--font-display);font-size:2.2rem;color:var(--gold);}
.cd-item small{text-transform:uppercase;letter-spacing:1px;font-size:.7rem;color:rgba(255,255,255,.6);}

/* Social */
.social-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.social-item{overflow:hidden;border-radius:12px;aspect-ratio:1;}
.social-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease);}
.social-item:hover img{transform:scale(1.15);}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.contact-info p{margin-bottom:16px;font-size:1rem;}
.contact-map iframe{width:100%;height:300px;border:0;border-radius:16px;filter:grayscale(.3) invert(.9);}

/* Footer */
.footer{padding:60px 8vw;text-align:center;border-top:1px solid rgba(255,255,255,.08);}
.footer-logo{font-family:var(--font-display);font-size:1.5rem;margin-bottom:10px;}
.footer-logo span{color:var(--gold);}
.footer p{color:rgba(255,255,255,.5);font-size:.85rem;}

/* Responsive */
@media (max-width:1024px){
  .exp-grid,.why-grid,.feature-grid,.social-gallery{grid-template-columns:repeat(2,1fr);}
  .contact-grid{grid-template-columns:1fr;}
  .world-map{display:none;}
}
@media (max-width:640px){
  section{padding:100px 6vw;}
  .exp-grid,.why-grid,.feature-grid,.social-gallery{grid-template-columns:1fr;}
  .timeline-track{flex-direction:column;gap:30px;}
  .timeline-track::before{display:none;}
  .countdown-grid{flex-wrap:wrap;}
  .cursor,.cursor-follower{display:none;}
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important;}
}


/* Media-light mode: only hero keeps external video/poster assets */
.world-map{
  background:
    radial-gradient(circle at 50% 50%, rgba(212,175,55,.14), transparent 55%),
    linear-gradient(135deg, rgba(11,61,145,.16), rgba(232,116,59,.08));
  border:1px solid rgba(212,175,55,.12);
  border-radius:50%;
  box-shadow:0 0 80px rgba(212,175,55,.08) inset;
  overflow:hidden;
}
.world-map .map-grid{
  position:absolute; inset:14%; border-radius:50%;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.08) 0 1px, transparent 1px 42px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, transparent 1px 42px);
  opacity:.35;
}
.dest-media{width:100%;height:100%;position:relative;transition:transform .6s var(--ease);}
.dest-media::before,.dest-media::after{content:'';position:absolute;inset:0;}
.dest-media::before{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.12));}
.dest-media::after{mix-blend-mode:screen;opacity:.95;}
.dest-card:hover .dest-media{transform:scale(1.08);}
.dest-mountains::after{background:linear-gradient(180deg, rgba(180,210,255,.18), rgba(10,14,28,.9)), radial-gradient(circle at 50% 18%, rgba(255,245,220,.25), transparent 20%), linear-gradient(160deg, transparent 0 42%, rgba(240,248,255,.85) 42% 48%, transparent 48% 56%, rgba(210,225,235,.7) 56% 65%, transparent 65%), linear-gradient(20deg, #0e1726, #1b2d3f 55%, #31495f);}
.dest-beaches::after{background:linear-gradient(180deg, rgba(255,183,94,.18), rgba(2,20,34,.55)), linear-gradient(180deg, #5fc8ff 0 42%, #17a4d8 42% 64%, #f0d7a1 64% 77%, #243447 77% 100%);}
.dest-wildlife::after{background:linear-gradient(180deg, rgba(255,190,110,.14), rgba(9,16,10,.72)), radial-gradient(circle at 70% 30%, rgba(255,214,140,.18), transparent 18%), linear-gradient(180deg, #708f57 0 38%, #4d6c3d 38% 68%, #2b2215 68% 100%);}
.dest-international::after{background:linear-gradient(180deg, rgba(80,120,255,.16), rgba(5,8,18,.82)), linear-gradient(180deg, #0d1b3c 0 58%, #090d16 58% 100%), repeating-linear-gradient(90deg, transparent 0 22px, rgba(255,215,120,.28) 22px 26px, transparent 26px 50px);}
.dest-spiritual::after{background:linear-gradient(180deg, rgba(255,170,90,.2), rgba(20,10,6,.78)), radial-gradient(circle at 50% 28%, rgba(255,235,180,.22), transparent 16%), linear-gradient(180deg, #6a3f2a 0 26%, #a56b3f 26% 32%, #402216 32% 100%);}
.dest-luxury::after{background:linear-gradient(180deg, rgba(212,175,55,.18), rgba(4,10,16,.8)), linear-gradient(180deg, #7ad1db 0 38%, #1d5f68 38% 62%, #0e1720 62% 100%), linear-gradient(90deg, transparent 0 58%, rgba(255,255,255,.12) 58% 66%, transparent 66% 100%);}
.social-shell{display:flex;align-items:flex-end;justify-content:flex-start;padding:24px;background:linear-gradient(180deg, rgba(212,175,55,.06), rgba(255,255,255,.02)), radial-gradient(circle at top right, rgba(11,61,145,.22), transparent 35%), rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.08);position:relative;}
.social-shell span{font-family:var(--font-display);font-size:1.3rem;position:relative;z-index:2;}
.social-shell::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, transparent, rgba(255,255,255,.08));opacity:.5;}
.social-shell:hover{box-shadow:0 20px 60px rgba(212,175,55,.12);}
.social-item img{display:none;}
