/* ═══════════════════════════════════════════════════════
   Albaway — Ultra Design 2026
   Dark · Glassmorphism · Aurora · GSAP
═══════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

: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}
button{cursor:none;font-family:inherit;border:none;background:none}
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 ────────────────────────────────────────────── */
#header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(2,8,24,.7);backdrop-filter:blur(24px);
  border-bottom:1px solid var(--border);
}
.nav-inner{
  max-width:1200px;margin:auto;
  display:flex;align-items:center;gap:24px;
  padding:0 32px;height:64px;
}
.logo{display:flex;align-items:center;gap:8px;cursor:none}
.logo-flag{font-size:22px}
.logo-text{font-family:'Space Grotesk',sans-serif;font-size:1.15rem;color:rgba(255,255,255,.7)}
.logo-text strong{color:#fff;font-weight:800}

.nav-links{display:flex;align-items:center;gap:8px;margin-left:auto}
.nav-links a{
  color:rgba(255,255,255,.55);font-size:.875rem;
  padding:7px 16px;border-radius:100px;
  transition:all .2s;
}
.nav-links a:hover{color:#fff;background:var(--glass2)}
.nav-publish{
  background:linear-gradient(135deg,rgba(228,30,32,.8),rgba(200,0,0,.8)) !important;
  color:#fff !important;font-weight:600;
  box-shadow:0 0 20px rgba(228,30,32,.3);
}
.nav-publish:hover{box-shadow:0 0 30px rgba(228,30,32,.5) !important}

.nav-right{display:flex;align-items:center;gap:10px}
.btn-nav-ghost{
  background:var(--glass);border:1px solid var(--border2);
  color:rgba(255,255,255,.75);padding:7px 18px;border-radius:100px;
  font-size:.85rem;transition:all .2s;
}
.btn-nav-ghost:hover{background:var(--glass2);color:#fff}
.btn-nav-red{
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;padding:7px 18px;border-radius:100px;
  font-size:.85rem;font-weight:600;
  box-shadow:0 0 18px rgba(228,30,32,.35);
  transition:all .2s;
}
.btn-nav-red:hover{box-shadow:0 0 28px rgba(228,30,32,.55);transform:translateY(-1px)}

.user-pill{
  display:flex;align-items:center;gap:8px;
  background:var(--glass);border:1px solid var(--border2);
  color:#fff;padding:6px 16px 6px 8px;border-radius:100px;
  font-size:.85rem;transition:all .2s;
}
.user-pill:hover{background:var(--glass2)}
.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:64px;left:0;right:0;z-index:99;
  background:rgba(2,8,24,.95);backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  padding:16px;display:flex;flex-direction:column;gap:4px;
}
.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:64px}

/* 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-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}

/* ── 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}
}
@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}
}