﻿/* ═══════════════════════════════════════════════════════
   AlbaWay — Ultra Design 2026
   Dark · Glassmorphism · Aurora · GSAP
═══════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}

:root{
  --blue:#003D82;--blue2:#0056b3;--red:#E41E20;--red2:#ff4444;
  --white:#fff;--bg:#020818;--text:#fff;--muted:rgba(255,255,255,.45);
  --glass:rgba(255,255,255,.06);--glass2:rgba(255,255,255,.1);
  --border:rgba(255,255,255,.08);--border2:rgba(255,255,255,.15);
  --success:#10b981;--warn:#f59e0b;--radius:20px;
}

html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--bg);color:var(--text);
  min-height:100vh;overflow-x:hidden;
  cursor:none;
}
a{text-decoration:none;color:inherit;touch-action:manipulation}
button{cursor:none;font-family:inherit;border:none;background:none;touch-action:manipulation}
input,select,textarea{font-family:inherit;cursor:none}

/* ── CURSOR ────────────────────────────────────────────── */
.cursor{
  width:10px;height:10px;border-radius:50%;
  background:var(--red);position:fixed;
  pointer-events:none;z-index:9999;
  transition:transform .15s ease,opacity .15s;
  mix-blend-mode:difference;top:0;left:0;
}
.cursor-trail{
  width:32px;height:32px;border-radius:50%;
  border:1.5px solid rgba(228,30,32,.5);
  position:fixed;pointer-events:none;z-index:9998;
  top:0;left:0;transition:all .06s linear;
}
body:not(:hover) .cursor,.cursor-trail{opacity:0}

/* ── AURORA ────────────────────────────────────────────── */
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.3}
.orb1{width:700px;height:700px;background:#003D82;top:-200px;left:-200px;animation:drift1 14s ease-in-out infinite alternate}
.orb2{width:600px;height:600px;background:#E41E20;top:25%;right:-150px;animation:drift2 16s ease-in-out infinite alternate}
.orb3{width:500px;height:500px;background:#7c3aed;bottom:-100px;left:25%;animation:drift3 18s ease-in-out infinite alternate}
.orb4{width:350px;height:350px;background:#0ea5e9;top:55%;left:5%;animation:drift1 12s ease-in-out infinite alternate-reverse}
@keyframes drift1{to{transform:translate(60px,50px) scale(1.12)}}
@keyframes drift2{to{transform:translate(-80px,60px) scale(1.08)}}
@keyframes drift3{to{transform:translate(50px,-60px) scale(1.15)}}

.noise{
  position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── HEADER — Floating Island ───────────────────────────── */
@property --rot{syntax:'<angle>';initial-value:0deg;inherits:false}

#header{
  position:fixed;
  top:12px;left:50%;transform:translateX(-50%);
  z-index:100;
  width:calc(100% - 32px);max-width:1200px;
  background:rgba(5,8,22,.82);
  backdrop-filter:blur(32px) saturate(180%);
  -webkit-backdrop-filter:blur(32px) saturate(180%);
  border:1px solid rgba(255,255,255,.09);
  border-radius:20px;
  overflow:hidden;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.05) inset,
    0 8px 48px rgba(0,0,0,.55),
    0 2px 0 rgba(255,255,255,.06) inset;
  transition:
    top .45s cubic-bezier(.4,0,.2,1),
    border-radius .45s cubic-bezier(.4,0,.2,1),
    background .3s,box-shadow .3s,
    transform .45s cubic-bezier(.4,0,.2,1);
}
/* spotlight rouge qui suit la souris */
#header::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(
    ellipse 340px 140% at var(--sx,-300px) 50%,
    rgba(228,30,32,.18) 0%,transparent 65%
  );
  opacity:var(--sop,0);transition:opacity .4s;
}
/* shimmer sweep au hover de la nav */
#header::after{
  content:'';
  position:absolute;top:0;left:-120%;width:70%;height:100%;z-index:0;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.05),transparent);
  pointer-events:none;transition:left .75s cubic-bezier(.4,0,.2,1);
}
#header:hover::after{left:140%}
/* collée en haut au scroll */
#header.scrolled{
  top:0;border-radius:0 0 20px 20px;
  background:rgba(3,5,16,.95);
  box-shadow:0 1px 0 rgba(255,255,255,.07),0 12px 40px rgba(0,0,0,.6);
}
/* cachée en scroll-bas */
#header.nav-hidden{transform:translateX(-50%) translateY(calc(-100% - 20px))}

.nav-inner{
  max-width:1200px;margin:auto;
  display:flex;align-items:center;gap:16px;
  padding:0 24px;height:62px;
  position:relative;z-index:1;
  transition:height .35s cubic-bezier(.4,0,.2,1);
}
#header.scrolled .nav-inner{height:52px}

/* ── LOGO ── */
.logo{display:flex;align-items:center;gap:10px;cursor:none;flex-shrink:0;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1)}
.logo:hover{transform:scale(1.06)}
.logo-img{
  height:36px;width:auto;object-fit:contain;border-radius:8px;
  filter:drop-shadow(0 3px 12px rgba(228,30,32,.45));
  transition:filter .35s,transform .35s;
}
.logo:hover .logo-img{
  filter:drop-shadow(0 5px 22px rgba(228,30,32,.8)) brightness(1.05);
  transform:scale(1.04);
}
.logo-flag{font-size:22px}
.logo-text{font-family:'Space Grotesk',sans-serif;font-size:1.1rem;
  background:linear-gradient(135deg,#fff 40%,rgba(255,255,255,.55));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  transition:filter .2s}
.logo-text strong{font-weight:800}
.logo:hover .logo-text{filter:brightness(1.2)}

/* ── NAV LINKS + PILL ── */
.nav-links{display:flex;align-items:center;gap:2px;margin-left:16px;position:relative}

/* pill flottante LERP – injectée par JS */
.nav-pill{
  position:absolute;top:0;left:0;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.13);
  border-radius:12px;
  pointer-events:none;z-index:0;
  opacity:0;transition:opacity .22s;
  will-change:transform,width,height;
  box-shadow:0 0 24px rgba(228,30,32,.1) inset;
  overflow:hidden;
}
.nav-pill::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.08) 50%,transparent 70%);
  background-size:200% 100%;
  animation:pillShimmer 2.6s ease-in-out infinite;
}
@keyframes pillShimmer{
  0%{background-position:200% 0}100%{background-position:-200% 0}
}

.nav-links a{
  color:rgba(255,255,255,.5);font-size:.85rem;
  padding:7px 18px;border-radius:12px;
  transition:color .2s;
  position:relative;z-index:1;display:inline-block;
}
.nav-links a:hover{color:#fff}

/* bouton Publiko avec bordure tournante au hover */
.nav-publish{
  position:relative;isolation:isolate;
  background:linear-gradient(135deg,rgba(220,0,10,.92),rgba(180,0,0,.9)) !important;
  color:#fff !important;font-weight:700;
  box-shadow:0 0 22px rgba(228,30,32,.38),inset 0 1px 0 rgba(255,255,255,.2);
}
.nav-publish::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;z-index:-1;
  background:conic-gradient(from var(--rot),#E41E20 0%,#ff9944 25%,#ffdd00 40%,#E41E20 55%,#ff4444 80%,#E41E20 100%);
  opacity:0;transition:opacity .35s;
  animation:rotateBorder 3s linear infinite paused;
}
.nav-publish:hover::before{opacity:1;animation-play-state:running}
.nav-publish:hover{box-shadow:0 0 36px rgba(228,30,32,.6),inset 0 1px 0 rgba(255,255,255,.25) !important}
@keyframes rotateBorder{to{--rot:360deg}}

/* ── DROITE ── */
.nav-right{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0}
#user-menu{display:flex;align-items:center;gap:8px}
.btn-nav-ghost{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.65);padding:7px 18px;border-radius:12px;
  font-size:.84rem;font-weight:500;transition:background .2s,color .2s,transform .2s;
}
.btn-nav-ghost:hover{background:rgba(255,255,255,.11);color:#fff;transform:translateY(-1px)}
.btn-nav-red{
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;padding:7px 20px;border-radius:12px;
  font-size:.84rem;font-weight:700;
  box-shadow:0 4px 20px rgba(228,30,32,.42);
  transition:box-shadow .25s,transform .25s;
  position:relative;overflow:hidden;
}
.btn-nav-red::after{content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.18),transparent 60%);pointer-events:none}
.btn-nav-red:hover{box-shadow:0 6px 32px rgba(228,30,32,.65);transform:translateY(-2px)}

.user-pill{
  display:flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  color:#fff;padding:6px 16px 6px 8px;border-radius:12px;
  font-size:.85rem;transition:background .2s;
}
.user-pill:hover{background:rgba(255,255,255,.1)}
.user-av{
  width:28px;height:28px;border-radius:50%;
  background:var(--red);color:#fff;display:inline-flex;
  align-items:center;justify-content:center;
  font-weight:800;font-size:.78rem;
}
.hamburger{display:none;color:#fff;font-size:1.3rem;margin-left:8px}

/* MOBILE NAV */
.mobile-nav{
  position:fixed;top:82px;left:8px;right:8px;z-index:99;
  background:rgba(3,6,20,.96);backdrop-filter:blur(24px);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  padding:16px;display:flex;flex-direction:column;gap:4px;
  box-shadow:0 8px 40px rgba(0,0,0,.5);
}
.mobile-nav a{
  color:rgba(255,255,255,.6);padding:12px 16px;
  border-radius:12px;font-size:.95rem;transition:all .2s;
}
.mobile-nav a:hover{background:var(--glass2);color:#fff}
.mobile-auth{display:flex;gap:10px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}
.mobile-auth button{
  flex:1;padding:11px;border-radius:12px;font-size:.9rem;
  background:var(--glass);border:1px solid var(--border2);color:#fff;
  transition:all .2s;
}
.mobile-auth button:hover{background:var(--glass2)}

/* ── HERO ──────────────────────────────────────────────── */
.hero{
  position:relative;z-index:2;
  min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:120px 24px 80px;text-align:center;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(228,30,32,.1);border:1px solid rgba(228,30,32,.25);
  padding:8px 18px;border-radius:100px;
  font-size:.78rem;color:#ff7b7b;font-weight:600;
  margin-bottom:28px;letter-spacing:.5px;
  animation:badgePulse 3s ease-in-out infinite;
}
.hero-dot{width:7px;height:7px;border-radius:50%;background:var(--red);animation:blink 1.5s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes badgePulse{0%,100%{box-shadow:0 0 0 0 rgba(228,30,32,.3)}50%{box-shadow:0 0 0 8px rgba(228,30,32,0)}}

.hero h1{
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(2.8rem,7vw,5.5rem);
  font-weight:800;line-height:1.05;letter-spacing:-2px;margin-bottom:20px;
}
.h1-white{display:block;color:#fff}
.h1-red{
  display:block;
  background:linear-gradient(135deg,var(--red),#ff6b6b,#ffd700);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hero-sub{
  font-size:1.1rem;color:var(--muted);
  max-width:520px;margin:0 auto 48px;line-height:1.75;
}

/* SEARCH CARD */
.search-card{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;padding:6px;
  display:flex;align-items:center;gap:2px;
  max-width:780px;width:100%;
  backdrop-filter:blur(20px);
  box-shadow:0 0 80px rgba(0,61,130,.25);
}
.sf{
  display:flex;align-items:center;gap:10px;
  flex:1;padding:14px 18px;border-radius:14px;transition:background .2s;
}
.sf:hover{background:rgba(255,255,255,.05)}
.sf-icon{font-size:1rem;opacity:.5}
.sf input,.sf select{
  background:none;border:none;outline:none;
  color:#fff;font-size:.95rem;width:100%;
  font-family:'Inter',sans-serif;
}
.sf input::placeholder{color:rgba(255,255,255,.3)}
.sf input[type=date]{color-scheme:dark}
.sd{width:1px;height:32px;background:rgba(255,255,255,.1);flex-shrink:0}
.search-go{
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;padding:14px 28px;border-radius:14px;
  font-weight:700;font-size:.95rem;
  box-shadow:0 4px 24px rgba(228,30,32,.4);
  transition:all .2s;flex-shrink:0;white-space:nowrap;
}
.search-go:hover{transform:scale(1.03);box-shadow:0 6px 32px rgba(228,30,32,.55)}

/* STATS */
.hero-stats{display:flex;gap:48px;margin-top:44px;justify-content:center;flex-wrap:wrap}
.hs{text-align:center}
.hs-num{
  font-family:'Space Grotesk',sans-serif;font-size:2rem;font-weight:800;
  background:linear-gradient(135deg,#fff,rgba(255,255,255,.6));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hs-lbl{font-size:.78rem;color:rgba(255,255,255,.35);margin-top:4px;text-transform:uppercase;letter-spacing:1px}

/* SCROLL HINT */
.scroll-hint{
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  color:rgba(255,255,255,.25);font-size:.72rem;letter-spacing:1px;text-transform:uppercase;
}
.scroll-bar{width:1px;height:40px;background:linear-gradient(to bottom,rgba(255,255,255,.3),transparent);animation:scrollPulse 2s ease-in-out infinite}
@keyframes scrollPulse{0%{opacity:1;transform:scaleY(1);transform-origin:top}100%{opacity:0;transform:scaleY(0);transform-origin:top}}

/* ── PAGE WRAPPER ──────────────────────────────────────── */
.page{position:relative;z-index:2;padding-top:86px}

/* SECTION */
.section-wrap{max-width:1200px;margin:0 auto;padding:80px 32px}
.section-tag{
  display:inline-block;
  background:rgba(228,30,32,.1);border:1px solid rgba(228,30,32,.2);
  color:#ff7b7b;font-size:.72rem;font-weight:700;
  text-transform:uppercase;letter-spacing:2px;
  padding:6px 16px;border-radius:100px;margin-bottom:16px;
}
.section-h{
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(1.8rem,3.5vw,2.8rem);font-weight:800;
  line-height:1.1;letter-spacing:-1px;margin-bottom:12px;
}
.section-sub{font-size:.95rem;color:var(--muted);line-height:1.7}
.section-header-row{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px}

/* ── TRIP CARD (homepage grid) ────────────────────────── */
.trips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}

.tc{
  background:var(--glass);border:1px solid var(--border);
  border-radius:var(--radius);overflow:hidden;
  backdrop-filter:blur(10px);
  transition:all .35s cubic-bezier(.4,0,.2,1);
  cursor:none;
}
.tc:hover{
  transform:translateY(-8px);
  background:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.14);
  box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.tc-img{width:100%;height:175px;position:relative;overflow:hidden}
.tc-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tc:hover .tc-img img{transform:scale(1.07)}
.tc-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,transparent 35%,rgba(2,8,24,.85))}
.tc-price{
  position:absolute;top:12px;right:12px;
  background:rgba(228,30,32,.9);backdrop-filter:blur(8px);
  color:#fff;font-weight:800;font-size:.95rem;
  padding:5px 14px;border-radius:100px;
}
.tc-countdown{
  position:absolute;bottom:10px;left:12px;
  backdrop-filter:blur(8px);
  color:#fff;font-weight:700;font-size:.78rem;
  padding:4px 11px;border-radius:100px;
  letter-spacing:.02em;transition:background .4s;
}
.cd-normal  { background:rgba(22,163,74,.85); }
.cd-soon    { background:rgba(202,138,4,.9);  }
.cd-urgent  { background:rgba(234,88,12,.9);  }
.cd-critical{ background:rgba(220,38,38,.95); animation:cd-pulse 1s ease-in-out infinite; }
@keyframes cd-pulse{0%,100%{opacity:1}50%{opacity:.6}}
.tp-women{background:rgba(167,139,250,.18)!important;border-color:rgba(167,139,250,.4)!important;color:#c4b5fd!important}
.drv-verified-mini{font-size:.7rem;margin-left:4px;vertical-align:middle}
.drv-verified-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.35);color:#4ade80;font-size:.78rem;font-weight:700;padding:4px 12px;border-radius:999px;margin:6px auto 0;letter-spacing:.02em}
.drv-badges-row{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:10px 0}
.drv-badge{display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.75);font-size:.73rem;font-weight:600;padding:4px 10px;border-radius:999px}

/* ── APP MOBILE SECTION ─────────────────────────────────────── */
.aw-app-section{position:relative;padding:80px 20px;overflow:hidden;background:linear-gradient(180deg,#0B0D12 0%,#11141C 100%)}
.aw-app-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(600px 400px at 85% 20%,rgba(218,41,28,.18),transparent 60%),radial-gradient(500px 500px at 15% 90%,rgba(60,90,220,.10),transparent 60%)}
.aw-app-wrap{max-width:1180px;margin:0 auto;position:relative;z-index:2;display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
@media(max-width:900px){.aw-app-wrap{grid-template-columns:1fr;gap:40px;text-align:center}.aw-app-section{padding:60px 18px}}
.aw-app-badge{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:#FF9C94;letter-spacing:.06em;background:rgba(218,41,28,.15);border:1px solid rgba(218,41,28,.35);padding:7px 14px;border-radius:999px;margin-bottom:18px;text-transform:uppercase}
.aw-app-badge i{width:8px;height:8px;border-radius:50%;background:#DA291C;animation:awPulse 1.4s ease infinite}
@keyframes awPulse{50%{opacity:.35;transform:scale(.75)}}
.aw-app-title{font-family:'Space Grotesk',system-ui,sans-serif;font-size:clamp(30px,4.5vw,46px);font-weight:800;letter-spacing:-.02em;color:#F2F3F7;line-height:1.1;margin-bottom:16px}
.aw-app-title span{color:#DA291C}
.aw-app-sub{font-size:16px;color:#9BA1B0;max-width:520px;margin-bottom:26px;line-height:1.6}
@media(max-width:900px){.aw-app-sub{margin-left:auto;margin-right:auto}}
.aw-app-features{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:30px;max-width:520px}
@media(max-width:900px){.aw-app-features{margin-left:auto;margin-right:auto}}
@media(max-width:480px){.aw-app-features{grid-template-columns:1fr}}
.aw-app-feat{display:flex;align-items:center;gap:11px;padding:12px 14px;text-align:left;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.10);border-radius:14px;backdrop-filter:blur(14px)}
.aw-app-feat .em{font-size:22px;line-height:1;flex:none}
.aw-app-feat b{font-size:13.5px;font-weight:600;color:#F2F3F7;display:block;line-height:1.2}
.aw-app-feat span{font-size:12px;color:#9BA1B0}
.aw-app-cta{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:900px){.aw-app-cta{justify-content:center}}
.aw-app-btn{display:inline-flex;align-items:center;gap:11px;text-decoration:none;padding:14px 22px;border-radius:15px;font-weight:600;font-size:15px;transition:transform .15s,box-shadow .15s;font-family:inherit}
.aw-app-btn.primary{background:linear-gradient(135deg,#E6362A,#B31A0F);color:#fff;box-shadow:0 8px 26px rgba(218,41,28,.36)}
.aw-app-btn.primary:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(218,41,28,.5)}
.aw-app-btn.ghost{background:rgba(255,255,255,.09);color:#F2F3F7;border:1px solid rgba(255,255,255,.15)}
.aw-app-btn.ghost:hover{background:rgba(255,255,255,.14)}
.aw-app-btn .ic{font-size:19px;line-height:1}
.aw-app-stores{display:flex;gap:14px;margin-top:20px;font-size:12.5px;color:#9BA1B0;flex-wrap:wrap}
@media(max-width:900px){.aw-app-stores{justify-content:center}}
.aw-app-stores span{display:inline-flex;align-items:center;gap:6px}
.aw-phone-wrap{position:relative;display:flex;justify-content:center;align-items:center;perspective:1000px}
.aw-phone{width:270px;height:540px;border-radius:44px;position:relative;background:linear-gradient(160deg,#1C202B,#0B0D12);border:2px solid rgba(255,255,255,.12);box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 0 6px #0f1116,inset 0 1px 0 rgba(255,255,255,.08);transform:rotate(-6deg);transition:transform .4s ease}
.aw-phone:hover{transform:rotate(-3deg) scale(1.02)}
.aw-phone::before{content:"";position:absolute;top:14px;left:50%;transform:translateX(-50%);width:100px;height:26px;background:#0B0D12;border-radius:14px;z-index:5}
.aw-phone-screen{position:absolute;inset:10px;border-radius:36px;overflow:hidden;background:linear-gradient(180deg,#0B0D12,#171A23);padding:40px 18px 18px;display:flex;flex-direction:column;gap:12px}
.aw-phone-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.aw-phone-brand{display:flex;align-items:center;gap:7px}
.aw-phone-brand .eagle-mini{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,#DA291C,#8E120B);font-size:13px}
.aw-phone-brand b{font-family:'Space Grotesk',sans-serif;font-size:14px;color:#F2F3F7}
.aw-phone-brand b span{color:#DA291C}
.aw-phone-hello{font-size:13px;color:#9BA1B0;margin-bottom:4px}
.aw-phone-hello b{color:#F2F3F7;display:block;font-size:16px;font-family:'Space Grotesk',sans-serif}
.aw-phone-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:12px}
.aw-phone-route{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.aw-phone-route .c{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:12.5px;color:#F2F3F7;white-space:nowrap}
.aw-phone-route .l{flex:1;height:2px;background:repeating-linear-gradient(90deg,#DA291C 0 5px,transparent 5px 10px);animation:awDash 1.6s linear infinite;background-size:200% 100%;position:relative}
@keyframes awDash{to{background-position:-20px 0}}
.aw-phone-route .l::before,.aw-phone-route .l::after{content:"";position:absolute;top:50%;width:6px;height:6px;border-radius:50%;transform:translateY(-50%)}
.aw-phone-route .l::before{left:-2px;background:#F2F3F7}
.aw-phone-route .l::after{right:-2px;background:#DA291C}
.aw-phone-meta{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.aw-phone-chip{font-size:9.5px;font-weight:500;color:#9BA1B0;padding:3px 7px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1)}
.aw-phone-foot{display:flex;justify-content:space-between;align-items:center}
.aw-phone-driver{display:flex;align-items:center;gap:6px}
.aw-phone-avatar{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,#2A2F3C,#171A23);border:1px solid rgba(255,255,255,.15);display:grid;place-items:center;font-size:9.5px;font-weight:600;color:#F2F3F7}
.aw-phone-driver .nm{font-size:10.5px;font-weight:600;color:#F2F3F7;line-height:1}
.aw-phone-driver .st{font-size:9px;color:#F5B942}
.aw-phone-price{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:13px;color:#DA291C}
.aw-phone-tabbar{position:absolute;bottom:16px;left:14px;right:14px;background:rgba(17,20,28,.9);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:7px;display:flex;justify-content:space-around;backdrop-filter:blur(10px)}
.aw-phone-tab{font-size:14px;padding:6px;opacity:.5}
.aw-phone-tab.on{opacity:1;filter:drop-shadow(0 0 6px rgba(218,41,28,.7))}
.aw-float{position:absolute;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(14px);border-radius:14px;padding:10px 13px;display:flex;align-items:center;gap:9px;font-size:12px;color:#F2F3F7;font-weight:500;box-shadow:0 8px 24px rgba(0,0,0,.35);animation:awFloat 4s ease-in-out infinite}
@keyframes awFloat{50%{transform:translateY(-8px)}}
.aw-float-1{top:12%;right:-6%;animation-delay:0s}
.aw-float-2{bottom:18%;left:-8%;animation-delay:1.5s}
.aw-float .em{font-size:16px}
.aw-float b{color:#3DDC84}
@media(max-width:900px){.aw-float-1,.aw-float-2{display:none}}
.tc-body{padding:18px}
.tc-route{
  font-family:'Space Grotesk',sans-serif;
  font-size:1.05rem;font-weight:700;margin-bottom:10px;
  display:flex;align-items:center;gap:8px;
}
.tc-arr{color:var(--muted);font-size:.8rem}
.tc-pills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.tp{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);
  color:rgba(255,255,255,.55);font-size:.72rem;
  padding:4px 10px;border-radius:100px;
}
.tc-footer{
  display:flex;align-items:center;gap:10px;
  padding-top:12px;border-top:1px solid var(--border);
}
.tc-av{
  width:32px;height:32px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.8rem;color:#fff;
}
.tc-dname{font-size:.85rem;font-weight:600}
.tc-drate{font-size:.72rem;color:var(--muted)}
.tc-btn{
  margin-left:auto;
  background:linear-gradient(135deg,rgba(228,30,32,.7),rgba(200,0,0,.7));
  color:#fff;padding:7px 16px;border-radius:10px;
  font-size:.78rem;font-weight:700;
  transition:all .2s;
}
.tc-btn:hover{background:linear-gradient(135deg,var(--red),var(--red2));transform:scale(1.05)}

/* ── TRIP LIST CARD (search results) ──────────────────── */
.trips-list{display:flex;flex-direction:column;gap:14px}
.tlc{
  background:var(--glass);border:1px solid var(--border);
  border-radius:16px;padding:20px 24px;
  display:grid;grid-template-columns:1fr auto auto;
  gap:16px;align-items:center;
  backdrop-filter:blur(10px);
  transition:all .25s;cursor:none;
}
.tlc:hover{
  background:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.14);
  transform:translateX(6px);
  box-shadow:0 8px 32px rgba(0,0,0,.4);
}
.tlc-route{font-family:'Space Grotesk',sans-serif;font-size:1.1rem;font-weight:700}
.tlc-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.tlc-driver{display:flex;align-items:center;gap:8px;margin-top:10px}
.tlc-price{font-family:'Space Grotesk',sans-serif;font-size:1.7rem;font-weight:800;color:#fff;text-align:right}
.tlc-psub{font-size:.75rem;color:var(--muted);text-align:right}
.tlc-btn{
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;padding:12px 24px;border-radius:12px;
  font-weight:700;font-size:.9rem;
  box-shadow:0 4px 18px rgba(228,30,32,.35);
  transition:all .2s;white-space:nowrap;
}
.tlc-btn:hover{box-shadow:0 6px 24px rgba(228,30,32,.5);transform:scale(1.03)}

/* ── BENTO (how it works) ──────────────────────────────── */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.bc{
  background:var(--glass);border:1px solid var(--border);
  border-radius:var(--radius);padding:28px;
  transition:all .3s;cursor:none;position:relative;overflow:hidden;
}
.bc::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.06) 0%,transparent 65%);
  opacity:0;transition:opacity .3s;
}
.bc:hover::before{opacity:1}
.bc:hover{border-color:rgba(255,255,255,.14);transform:translateY(-5px);box-shadow:0 20px 50px rgba(0,0,0,.4)}
.bc-num{
  font-family:'Space Grotesk',sans-serif;font-size:3.5rem;font-weight:900;
  color:rgba(255,255,255,.05);position:absolute;top:16px;right:20px;line-height:1;
}
.bc-icon{font-size:2.2rem;margin-bottom:16px}
.bc-title{font-size:1rem;font-weight:700;margin-bottom:6px}
.bc-desc{font-size:.85rem;color:var(--muted);line-height:1.7}
.bc-wide{grid-column:span 2}
.bc-accent{
  background:linear-gradient(135deg,rgba(0,61,130,.35),rgba(228,30,32,.15));
  border-color:rgba(228,30,32,.18);
}

/* ── DETAIL PAGE ───────────────────────────────────────── */
.detail-page{max-width:960px;margin:0 auto;padding:24px 24px 80px}
.detail-grid{display:grid;grid-template-columns:1fr 320px;gap:24px}
.detail-col{display:flex;flex-direction:column;gap:16px}
.glass-card{
  background:var(--glass);border:1px solid var(--border);
  border-radius:var(--radius);padding:24px;
  backdrop-filter:blur(12px);
}
.glass-card h3{
  font-size:.82rem;font-weight:700;color:rgba(255,255,255,.4);
  text-transform:uppercase;letter-spacing:1.5px;
  margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border);
}
.route-tl{display:flex;align-items:stretch;gap:16px}
.tl-line{width:20px;display:flex;flex-direction:column;align-items:center;padding-top:2px}
.tl-dot-top{width:13px;height:13px;border-radius:50%;border:2.5px solid var(--blue2);background:var(--bg);flex-shrink:0}
.tl-bar{width:2px;flex:1;background:var(--border);margin:4px 0;min-height:24px}
.tl-dot-bot{width:13px;height:13px;border-radius:50%;background:var(--red);flex-shrink:0}
.tl-labels{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.tl-city{font-family:'Space Grotesk',sans-serif;font-size:1.1rem;font-weight:700}
.tl-point{font-size:.82rem;color:var(--muted);margin-top:2px}
.tl-date-badge{
  background:rgba(255,255,255,.06);border-radius:8px;
  padding:6px 12px;font-size:.8rem;color:var(--muted);
  align-self:flex-start;margin:8px 0;
}
.notes-box{
  background:rgba(255,255,255,.04);border-radius:10px;
  padding:12px;font-size:.85rem;color:var(--muted);
  line-height:1.6;margin-top:14px;
}
.opts-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.opt-item{
  display:flex;align-items:center;gap:8px;
  padding:10px 12px;border-radius:10px;font-size:.85rem;
}
.opt-on{background:rgba(16,185,129,.1)}
.opt-off{background:rgba(255,255,255,.03);opacity:.45}

/* DRIVER CARD */
.driver-card-big{text-align:center}
.drv-av-big{
  width:64px;height:64px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:1.6rem;font-weight:800;color:#fff;margin-bottom:12px;
}
.drv-name{font-family:'Space Grotesk',sans-serif;font-size:1.15rem;font-weight:700;margin-bottom:4px}
.drv-rate{font-size:.85rem;color:var(--muted)}
.drv-stats{display:flex;justify-content:center;gap:24px;margin:14px 0;padding:14px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.drv-stat-v{font-family:'Space Grotesk',sans-serif;font-size:1.2rem;font-weight:800;color:var(--blue2)}
.drv-stat-l{font-size:.72rem;color:var(--muted);margin-top:2px}

/* BOOK PANEL */
.book-price-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.book-price-big{font-family:'Space Grotesk',sans-serif;font-size:2.2rem;font-weight:800}
.book-seats{font-size:.82rem;color:var(--muted);margin-bottom:14px}
.book-ta{
  width:100%;background:rgba(255,255,255,.05);
  border:1px solid var(--border2);border-radius:12px;
  padding:12px;color:#fff;font-size:.9rem;
  resize:vertical;min-height:80px;outline:none;
  transition:border-color .2s;margin-bottom:12px;
}
.book-ta:focus{border-color:rgba(228,30,32,.5)}
.btn-book{
  width:100%;padding:16px;
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;font-size:1rem;font-weight:700;border-radius:14px;
  box-shadow:0 4px 24px rgba(228,30,32,.4);
  transition:all .2s;
}
.btn-book:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(228,30,32,.55)}
.btn-book:disabled{opacity:.5;transform:none;cursor:not-allowed}
.book-status{
  text-align:center;padding:14px;border-radius:12px;
  font-size:.9rem;font-weight:600;
}
.book-status.ok{background:rgba(16,185,129,.15);border:1px solid rgba(16,185,129,.3);color:#34d399}
.book-status.err{background:rgba(228,30,32,.1);border:1px solid rgba(228,30,32,.2);color:#ff7b7b}

/* ── PUBLISH ───────────────────────────────────────────── */
.publish-wrap{max-width:760px;margin:0 auto;padding:24px 24px 80px}
.pub-title{
  font-family:'Space Grotesk',sans-serif;
  font-size:2rem;font-weight:800;margin-bottom:8px;
}
.pub-sub{color:var(--muted);margin-bottom:32px}
.form-label{font-size:.75rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;display:block}
.form-input,.form-select,.form-textarea{
  width:100%;background:rgba(255,255,255,.05);
  border:1px solid var(--border2);border-radius:12px;
  padding:12px 16px;color:#fff;font-size:.95rem;outline:none;
  transition:border-color .2s,background .2s;
}
.form-input:focus,.form-select:focus,.form-textarea:focus{
  border-color:rgba(228,30,32,.5);background:rgba(255,255,255,.08);
}
.form-input::placeholder,.form-textarea::placeholder{color:rgba(255,255,255,.25)}
.form-select option{background:#0f1729;color:#fff}
.form-textarea{resize:vertical;min-height:80px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-group{margin-bottom:20px}
.opt-toggle{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ot-item{
  display:flex;align-items:center;gap:10px;
  padding:12px 14px;border:1px solid var(--border2);
  border-radius:12px;cursor:none;transition:all .2s;
}
.ot-item.on{border-color:rgba(228,30,32,.4);background:rgba(228,30,32,.08)}
.seats-row{display:flex;gap:6px;flex-wrap:wrap}
.seat-btn{
  width:38px;height:38px;border-radius:10px;
  border:1px solid var(--border2);color:rgba(255,255,255,.6);
  font-size:.9rem;font-weight:600;transition:all .2s;
  display:flex;align-items:center;justify-content:center;
}
.seat-btn.on{background:var(--blue2);border-color:var(--blue2);color:#fff}
.btn-publish{
  width:100%;padding:18px;
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;font-size:1.05rem;font-weight:700;border-radius:16px;
  margin-top:8px;
  box-shadow:0 4px 28px rgba(228,30,32,.4);
  transition:all .2s;
}
.btn-publish:hover{transform:translateY(-2px);box-shadow:0 8px 36px rgba(228,30,32,.55)}

/* ── DASHBOARD ─────────────────────────────────────────── */
.dash-wrap{max-width:900px;margin:0 auto;padding:24px 24px 80px}
.dash-profile{
  display:flex;align-items:center;gap:20px;
  background:linear-gradient(135deg,rgba(0,61,130,.4),rgba(228,30,32,.15));
  border:1px solid var(--border2);border-radius:var(--radius);
  padding:28px;margin-bottom:28px;
  backdrop-filter:blur(12px);
}
.dash-av{
  width:64px;height:64px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:1.6rem;font-weight:800;color:#fff;flex-shrink:0;
}
.dash-name{font-family:'Space Grotesk',sans-serif;font-size:1.5rem;font-weight:800}
.dash-sub{font-size:.85rem;color:var(--muted);margin-top:4px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:24px}
.tab-btn{
  padding:11px 20px;font-size:.88rem;font-weight:600;color:var(--muted);
  border-bottom:3px solid transparent;margin-bottom:-1px;
  border-radius:8px 8px 0 0;transition:all .2s;
}
.tab-btn.on{color:#fff;border-bottom-color:var(--red)}
.tab-pane{display:none}.tab-pane.on{display:block}

.my-tc{
  background:var(--glass);border:1px solid var(--border);
  border-radius:16px;padding:20px;margin-bottom:14px;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:16px;backdrop-filter:blur(8px);
  transition:all .2s;
}
.my-tc:hover{background:rgba(255,255,255,.08)}
.my-tc-route{font-family:'Space Grotesk',sans-serif;font-size:1.05rem;font-weight:700;margin-bottom:6px}
.my-tc-actions{display:flex;gap:8px;flex-wrap:wrap}
.btn-manage{
  background:rgba(0,86,179,.4);border:1px solid rgba(0,86,179,.5);
  color:#fff;padding:8px 16px;border-radius:10px;font-size:.82rem;font-weight:600;transition:all .2s;
}
.btn-manage:hover{background:rgba(0,86,179,.6)}
.btn-cancel-t{
  background:rgba(228,30,32,.1);border:1px solid rgba(228,30,32,.25);
  color:#ff7b7b;padding:8px 16px;border-radius:10px;font-size:.82rem;transition:all .2s;
}
.btn-cancel-t:hover{background:rgba(228,30,32,.2)}

.bk-card{
  background:var(--glass);border:1px solid var(--border);
  border-radius:16px;padding:20px;margin-bottom:14px;
  backdrop-filter:blur(8px);transition:all .2s;
}
.bk-card:hover{background:rgba(255,255,255,.08)}
.bk-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.bk-route{font-family:'Space Grotesk',sans-serif;font-size:1.05rem;font-weight:700}

/* STATUS BADGES */
.badge{padding:5px 12px;border-radius:100px;font-size:.75rem;font-weight:700}
.badge-pending{background:rgba(245,158,11,.15);border:1px solid rgba(245,158,11,.3);color:#fbbf24}
.badge-accepted{background:rgba(16,185,129,.15);border:1px solid rgba(16,185,129,.3);color:#34d399}
.badge-refused{background:rgba(228,30,32,.1);border:1px solid rgba(228,30,32,.2);color:#ff7b7b}
.badge-cancelled{background:rgba(255,255,255,.06);border:1px solid var(--border2);color:var(--muted)}
.badge-active{background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.2);color:#34d399}

.req-card{
  background:var(--glass);border:1px solid var(--border);
  border-radius:14px;padding:16px;margin-bottom:10px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  backdrop-filter:blur(8px);
}
.req-av{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem;color:#fff;flex-shrink:0}
.btn-accept{background:rgba(16,185,129,.2);border:1px solid rgba(16,185,129,.3);color:#34d399;padding:8px 18px;border-radius:10px;font-weight:700;font-size:.85rem;transition:all .2s}
.btn-accept:hover{background:rgba(16,185,129,.35)}
.btn-refuse{background:rgba(228,30,32,.1);border:1px solid rgba(228,30,32,.2);color:#ff7b7b;padding:8px 18px;border-radius:10px;font-weight:700;font-size:.85rem;transition:all .2s}
.btn-refuse:hover{background:rgba(228,30,32,.2)}

/* ── MODAL ─────────────────────────────────────────────── */
.modal-overlay{
  position:fixed;inset:0;z-index:200;
  background:rgba(2,8,24,.8);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.modal-box{
  background:rgba(15,23,42,.95);border:1px solid var(--border2);
  border-radius:24px;padding:36px;max-width:440px;width:100%;
  box-shadow:0 32px 100px rgba(0,0,0,.6);
  animation:modalIn .25s cubic-bezier(.4,0,.2,1);
}
@keyframes modalIn{from{opacity:0;transform:scale(.94) translateY(16px)}to{opacity:1;transform:scale(1) translateY(0)}}
.modal-title{
  font-family:'Space Grotesk',sans-serif;
  font-size:1.5rem;font-weight:800;margin-bottom:24px;
}
.modal-close{float:right;color:var(--muted);font-size:1.3rem;line-height:1;margin-top:-4px}
.modal-close:hover{color:#fff}
.modal-submit{
  width:100%;padding:14px;
  background:linear-gradient(135deg,var(--blue),var(--blue2));
  color:#fff;font-size:.95rem;font-weight:700;border-radius:12px;margin-top:8px;
  box-shadow:0 4px 20px rgba(0,61,130,.4);transition:all .2s;
}
.modal-submit:hover{transform:translateY(-1px);box-shadow:0 6px 28px rgba(0,61,130,.55)}
.modal-switch{text-align:center;margin-top:16px;font-size:.875rem;color:var(--muted)}
.modal-switch a{color:#60a5fa;font-weight:600;cursor:none}
.modal-switch a:hover{color:#93c5fd}
.demo-box{
  background:rgba(0,61,130,.15);border:1px solid rgba(0,61,130,.3);
  border-radius:10px;padding:12px;margin-bottom:16px;
}
.demo-box p{font-size:.75rem;color:rgba(255,255,255,.4);margin-bottom:8px;text-transform:uppercase;letter-spacing:1px;font-weight:600}
.demo-btn{
  display:block;font-size:.8rem;color:#60a5fa;padding:4px 0;transition:color .15s;text-align:left;
}
.demo-btn:hover{color:#93c5fd}

/* ── TOAST ─────────────────────────────────────────────── */
.toast{
  position:fixed;bottom:24px;right:24px;z-index:300;
  padding:14px 22px;border-radius:14px;font-weight:600;font-size:.9rem;
  box-shadow:0 8px 32px rgba(0,0,0,.5);backdrop-filter:blur(12px);
  animation:toastIn .3s ease;max-width:360px;
}
@keyframes toastIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.toast.success{background:rgba(16,185,129,.2);border:1px solid rgba(16,185,129,.35);color:#34d399}
.toast.error{background:rgba(228,30,32,.15);border:1px solid rgba(228,30,32,.3);color:#ff7b7b}
.toast.info{background:rgba(0,61,130,.25);border:1px solid rgba(0,86,179,.4);color:#60a5fa}

/* ── NOTIF ─────────────────────────────────────────────── */
.notif-banner{
  position:fixed;top:72px;right:20px;z-index:150;
  background:rgba(15,23,42,.95);border-radius:14px;padding:16px 18px;
  box-shadow:0 8px 32px rgba(0,0,0,.5);max-width:320px;
  border-left:4px solid var(--blue);backdrop-filter:blur(12px);
  animation:notifIn .3s ease;
}
@keyframes notifIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
.notif-banner.new_request{border-left-color:var(--warn)}
.notif-banner.accepted{border-left-color:var(--success)}
.notif-banner.refused{border-left-color:var(--red)}
.notif-title{font-weight:700;font-size:.88rem;margin-bottom:4px}
.notif-body{font-size:.8rem;color:var(--muted);line-height:1.5}
.notif-close{float:right;color:var(--muted);font-size:1rem;margin-left:8px;line-height:1}

/* ── EMPTY ─────────────────────────────────────────────── */
.empty-state{text-align:center;padding:64px 24px}
.empty-icon{font-size:3.5rem;margin-bottom:16px}
.empty-state h3{font-size:1.2rem;font-weight:700;margin-bottom:8px}
.empty-state p{color:var(--muted);font-size:.9rem}

/* ── MISC ──────────────────────────────────────────────── */
.hidden{display:none!important}
.loading{text-align:center;padding:48px;color:var(--muted);font-size:.95rem}
.btn-see-all{
  background:var(--glass);border:1px solid var(--border2);
  color:rgba(255,255,255,.65);padding:9px 20px;border-radius:100px;
  font-size:.82rem;transition:all .2s;
}
.btn-see-all:hover{background:var(--glass2);color:#fff}
.back-link{
  display:inline-flex;align-items:center;gap:6px;
  color:var(--muted);font-size:.875rem;margin-bottom:20px;
  transition:color .2s;
}
.back-link:hover{color:#fff}

/* ── DESTINATION PHOTO CARDS ───────────────────────────── */
.dest-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:16px;max-width:900px;margin:0 auto;
}
.dest-card{
  position:relative;border-radius:20px;overflow:hidden;
  height:200px;cursor:none;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s;
  border:1px solid rgba(255,255,255,.07);
}
.dest-card:hover{
  transform:translateY(-6px) scale(1.02);
  box-shadow:0 24px 60px rgba(0,0,0,.55);
}
.dest-card img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s ease;display:block;
}
.dest-card:hover img{transform:scale(1.08)}
.dest-overlay{
  position:absolute;inset:0;
  background:linear-gradient(160deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.55) 55%,rgba(2,8,24,.92) 100%);
  padding:18px;display:flex;flex-direction:column;justify-content:flex-end;
}
.dest-price-badge{
  position:absolute;top:14px;right:14px;
  background:rgba(228,30,32,.85);backdrop-filter:blur(8px);
  color:#fff;padding:4px 12px;border-radius:100px;
  font-size:.75rem;font-weight:700;letter-spacing:.3px;
}
.dest-flag-row{font-size:1.4rem;margin-bottom:4px;line-height:1}
.dest-from{
  font-weight:700;font-size:.95rem;color:#fff;
  line-height:1.3;text-shadow:0 1px 8px rgba(0,0,0,.5);
}
.dest-arrow{
  font-size:.82rem;color:rgba(255,255,255,.55);margin-top:3px;
}
.dest-arrow span{color:rgba(255,255,255,.75)}

/* ── FOOTER ────────────────────────────────────────────── */
.footer{
  position:relative;z-index:2;
  border-top:1px solid var(--border);
  background:rgba(2,8,24,.8);backdrop-filter:blur(12px);
  margin-top:80px;padding:56px 32px 0;
}
.footer-inner{
  max-width:1000px;margin:auto;
  display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;padding-bottom:48px;
}
.footer-brand .logo-text{font-size:1.15rem}
.footer-brand p{font-size:.85rem;color:var(--muted);margin-top:8px}
.footer-links h4{color:rgba(255,255,255,.4);font-size:.72rem;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:14px;font-weight:700}
.footer-links a{display:block;color:rgba(255,255,255,.45);font-size:.85rem;margin-bottom:10px;transition:color .2s}
.footer-links a:hover{color:#fff}
.footer-bottom{border-top:1px solid var(--border);padding:20px 0;text-align:center;font-size:.78rem;color:rgba(255,255,255,.2)}

/* ── RESPONSIVE ────────────────────────────────────────── */
@media(max-width:900px){
  .search-card{flex-direction:column;gap:0;padding:12px}
  .sf{border-radius:10px}
  .sd{display:none}
  .search-go{border-radius:12px;width:100%;margin-top:4px}
  .detail-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .bento{grid-template-columns:1fr}
  .bc-wide{grid-column:span 1}
  .footer-inner{grid-template-columns:1fr;gap:28px}
  .nav-links{display:none}
  .hamburger{display:block}
  .tlc{grid-template-columns:1fr}
  .hero-stats{gap:24px}
  /* Nav flottante — marges réduites sur mobile */
  #header{width:calc(100% - 20px);top:8px}
  #header.scrolled{top:0;width:100%}
  #header.scrolled ~ #mobile-nav{top:52px;left:0;right:0;border-radius:0 0 16px 16px}
  .nav-inner{padding:0 16px;gap:10px}
}
/* ── LANGUAGE SWITCHER ─────────────────────────────────── */
.lang-sw{position:relative}
.lang-btn{
  display:flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.85);padding:6px 12px;border-radius:100px;
  font-size:.82rem;font-weight:600;transition:all .2s;
}
.lang-btn:hover{background:rgba(255,255,255,.12);color:#fff}
.lang-drop{
  position:absolute;top:calc(100% + 8px);right:0;
  background:#141929;border:1px solid rgba(255,255,255,.12);
  border-radius:12px;overflow:hidden;min-width:140px;
  box-shadow:0 12px 40px rgba(0,0,0,.6);z-index:500;
}
.lang-drop button{
  display:flex;align-items:center;gap:8px;
  width:100%;padding:10px 16px;font-size:.875rem;
  color:rgba(255,255,255,.8);transition:background .12s;text-align:left;
}
.lang-drop button:hover{background:rgba(228,30,32,.2);color:#fff}

/* ── TOUCH-FRIENDLY INTERACTIVE ELEMENTS ───────────────── */
.tc,.tlc,.bk-card,.my-tc,.bc,.req-card,
.btn-book,.btn-publish,.btn-see-all,.search-go,
.btn-nav-ghost,.btn-nav-red,.btn-accept,.btn-refuse,.btn-manage,.btn-cancel-t,
.tab-btn,.seat-btn,.ot-item,.lang-btn,.faq-q{
  touch-action:manipulation;
}

/* ── AUTOCOMPLETE ──────────────────────────────────────── */
.ac-wrap{position:relative}
.ac-drop{
  position:absolute;top:calc(100% + 4px);left:0;right:0;
  background:#141929;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;overflow:hidden;
  z-index:500;
  box-shadow:0 12px 40px rgba(0,0,0,.6);
  pointer-events:none;
}
.ac-item{
  padding:12px 16px;font-size:.9rem;
  cursor:pointer;transition:background .12s;
  display:flex;align-items:center;gap:8px;
  color:rgba(255,255,255,.85);
  user-select:none;-webkit-user-select:none;
  touch-action:manipulation;
  pointer-events:auto;
}
.ac-item:hover,.ac-item.ac-sel{
  background:rgba(228,30,32,.2);color:#fff;
}
.ac-item::before{content:'📍';font-size:.8rem;opacity:.6}

@media(max-width:580px){
  .hero h1{letter-spacing:-1px}
  .section-wrap{padding:60px 16px}
  .trips-grid{grid-template-columns:1fr}
  .opts-grid{grid-template-columns:1fr}
  .detail-page,.publish-wrap,.dash-wrap{padding:16px 16px 64px}
  .dest-grid{grid-template-columns:1fr;gap:12px}
  .dest-card{height:160px}
}
