/* BinaSmart site-wide style, 7 Sep 2026 — an OVERRIDE sheet linked AFTER each page's own <style>.
   It re-themes the shared tokens and the components the older pages have in common (top bar, buttons,
   chips, cards, sheets) so every page matches the new home / Ride / Airport look without rewriting them.
   Families covered: A = property/cars/insurance (.top .in / .logo / .badge / .wa / .pc / .band / .promo),
   B = flights/travel/hospital/restaurant (.top > a / .hero / .bkbtn / .obtn / .sheet / .conf),
   G = guides (.logo.am / .phero / .gcard), N = server-rendered news + tenders (.topbar / .brand / .chip / .phero). */
:root{--em:#00C896;--em2:#009688;--brand:#009688;--brand2:#081120;--ink:#081120;--txt:#081120;--mut:#64748B;--bg:#F8FAFC;--card:#fff;--line:rgba(8,17,32,.08);--gold:#F59E0B;--blue:#0099FF;--grad:linear-gradient(135deg,#00C896,#009688)}
html{background:var(--bg)}
body{font-family:'Plus Jakarta Sans','Noto Sans Ethiopic',-apple-system,'Segoe UI',Roboto,system-ui,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
.sans{font-family:'Plus Jakarta Sans','Noto Sans Ethiopic',system-ui,sans-serif}
/* the teal play logo, added as <i class="lg"></i> inside the logo link */
.lg{display:inline-flex;width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#00C896,#009688) center/14px 14px no-repeat;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M7 4.5v15a1 1 0 0 0 1.5.86l12-7.5a1 1 0 0 0 0-1.72l-12-7.5A1 1 0 0 0 7 4.5z'/%3E%3C/svg%3E"),linear-gradient(135deg,#00C896,#009688);box-shadow:0 8px 18px -8px rgba(0,200,150,.9);vertical-align:middle;margin-right:8px;flex:none}
/* ---- family A: sticky glass bar ---- */
.top{position:sticky;top:0;z-index:50;background:transparent;border-bottom:0;backdrop-filter:none;padding:10px 12px 0}
.top .in{max-width:1080px;margin:0 auto;height:56px;padding:0 8px 0 10px;display:flex;align-items:center;gap:10px;border-radius:18px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border:1px solid rgba(255,255,255,.9);box-shadow:0 20px 50px -28px rgba(8,17,32,.35),inset 0 1px 0 rgba(255,255,255,.95)}
.logo{display:inline-flex;align-items:center;font-weight:800;font-size:17px;letter-spacing:-.3px;color:var(--ink)}
.logo .g,.logo b{color:#00C896}
.badge{font-size:12px;font-weight:800;color:var(--em2);background:rgba(0,200,150,.12);border-radius:999px;padding:6px 12px}
.wa{margin-left:auto;background:#25D366;color:#081120;font-weight:800;font-size:13px;padding:9px 14px;border-radius:12px}
.hero h1{letter-spacing:-.6px;font-weight:900}
.seg{background:rgba(8,17,32,.05);border-radius:14px;padding:5px}
.seg button{border-radius:11px;font-weight:800}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 6px 16px -8px rgba(8,17,32,.35)}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;font-weight:800;color:var(--ink);box-shadow:0 8px 20px -14px rgba(8,17,32,.35)}
.chip:hover,.chip.on{background:linear-gradient(135deg,#00C896,#009688);color:#fff;border-color:transparent}
.pc,.band,.empty,.card,.dept,.trip,.item,.gcard{border-radius:20px;border:1px solid var(--line);box-shadow:0 16px 36px -28px rgba(8,17,32,.3)}
.pc .ph{border-radius:0}
.pc .vf{background:#00C896;color:#081120}
.pc .price{color:var(--em2)}
.b1{background:linear-gradient(135deg,#00C896,#009688);color:#fff}
.b2{background:rgba(0,200,150,.12);color:var(--em2)}
.inp{border:1px solid var(--line);border-radius:14px}
.inp:focus{border-color:#00C896;box-shadow:0 0 0 3px rgba(0,200,150,.18)}
.btn,.bkbtn,.obtn,.cbtn,.tb-cta{background:linear-gradient(135deg,#00C896,#009688);color:#fff;border:0;border-radius:16px;font-weight:800;box-shadow:0 16px 30px -14px rgba(0,200,150,.8)}
.btn:disabled,.bkbtn:disabled{background:#cbd5e1;box-shadow:none;color:#fff}
.promo{border-radius:24px}
.promo.ins{background:linear-gradient(135deg,#00C896,#009688)}
.promo.ag,.promo.dk{background:linear-gradient(135deg,#0F172A,#0B3B31 70%,#00C896 160%)}
.foot{color:var(--mut);border-top-color:var(--line)}
/* ---- family B: flights / travel / hospital / restaurant ---- */
.top>a.logo{text-decoration:none;color:var(--ink);font-weight:800;font-size:17px}
.top>a.logo .g{color:#00C896}
body>.top:not(:has(.in)){position:sticky;top:10px;z-index:50;max-width:720px;margin:10px auto 0;height:56px;padding:0 8px 0 10px;display:flex;align-items:center;gap:10px;border-radius:18px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border:1px solid rgba(255,255,255,.9);box-shadow:0 20px 50px -28px rgba(8,17,32,.35),inset 0 1px 0 rgba(255,255,255,.95)}
body>.top:not(:has(.in))>span{font-size:11.5px;font-weight:800;color:var(--em2)!important;background:rgba(0,200,150,.12);padding:6px 10px;border-radius:999px}
.hero{border-radius:24px}
/* family-B heroes (bus, flights, hospital, restaurant) all take the site's dark-emerald gradient instead of their own colour */
.top:not(:has(.in))+.wrap .hero{background:linear-gradient(135deg,#0F172A,#0B3B31 70%,#00C896 160%);box-shadow:0 26px 60px -30px rgba(8,17,32,.6)}
.top:not(:has(.in))+.wrap .hero .am{color:#14D8B4}
.hero h1{font-weight:900}
.f,.cat,.tt{border-radius:999px;font-weight:800}
.f.on,.cat.on,.tt.on{background:linear-gradient(135deg,#00C896,#009688);color:#fff;border-color:transparent}
.seats.ok,.slots.ok{color:var(--em2)}
.sheet,.pane{background:rgba(248,250,252,.97);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.sheet{border-radius:26px 26px 0 0}
.tot{background:rgba(0,200,150,.1);border-radius:14px}
.tot b{color:var(--em2)}
.conf .code,.ticket .code,.card .code,.code{color:var(--em2);background:rgba(0,200,150,.1);border-color:#00C896}
.qty .add{background:linear-gradient(135deg,#00C896,#009688);color:#fff}
.cartbar{background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border-top:1px solid var(--line)}
/* ---- guides ---- */
.top .logo.am{font-family:'Plus Jakarta Sans','Noto Sans Ethiopic',system-ui,sans-serif}
.top a.back{font-weight:800;color:var(--em2);background:rgba(0,200,150,.12);border-radius:12px;padding:8px 12px}
.phero{background:linear-gradient(135deg,#0F172A,#0B3B31 70%,#00C896 160%);border-radius:26px}
.phero .kick{color:#14D8B4}
.gcard .go{color:var(--em2)}
/* ---- news + tenders shell ---- */
.topbar{background:transparent;border-bottom:0;padding:10px 12px 0}
.tb-in{height:56px;padding:0 8px 0 10px;border-radius:18px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border:1px solid rgba(255,255,255,.9);box-shadow:0 20px 50px -28px rgba(8,17,32,.35),inset 0 1px 0 rgba(255,255,255,.95)}
.brand{display:inline-flex;align-items:center;font-weight:800;font-size:17px;letter-spacing:-.3px}
.brand .g{color:#00C896}
.brand .zena{color:var(--em2);font-size:14px}
.tb-nav a.on{color:var(--ink);border-bottom-color:#00C896}
.masthead{border-bottom-color:var(--line)}
.masthead h1{font-family:'Plus Jakarta Sans','Noto Sans Ethiopic',system-ui,sans-serif;font-weight:900;letter-spacing:-.8px}
.chip.on,.chip:hover{background:linear-gradient(135deg,#00C896,#009688)}
.cta-band{background:linear-gradient(135deg,#0F172A,#0B3B31 70%,#00C896 160%);border-radius:26px}
.cat{color:var(--em2)}
.thumb,.art-hero,.hero-vis{border-radius:20px}

/* ---- round 2: landing pages with a brand line in the hero (for-business, for-cinemas, for-filmmakers, why-binasmart, drive-with-us) ---- */
body>.hero:has(.brand),body>header.hero:has(.brand){background:linear-gradient(135deg,#0F172A,#0B3B31 70%,#00C896 160%);color:#fff}
body>.hero:has(.brand) .brand,body>header.hero:has(.brand) .brand{display:flex;align-items:center;font-weight:800;letter-spacing:-.3px}
body>.hero:has(.brand) .brand b,body>header.hero:has(.brand) .brand b{color:#00C896}
body>.hero:has(.brand) .kick,body>header.hero:has(.brand) .kick{color:#14D8B4}
body>.hero:has(.brand) h1 span:not(.en),body>header.hero:has(.brand) h1 span:not(.en){color:#00C896}
.cta,a.cta{background:linear-gradient(135deg,#00C896,#009688);color:#fff;border-radius:16px;box-shadow:0 16px 30px -14px rgba(0,200,150,.8)}
.cta.ghost,a.cta.ghost{background:rgba(255,255,255,.12);color:#fff;box-shadow:none}
/* ai / support / privacy / terms and the guide articles: same header shape */
.top .logo{display:inline-flex;align-items:center;font-weight:800}
.top .logo b{color:#00C896}
/* owner login */
.brandp .logo{display:inline-flex;align-items:center}
.brandp .logo .g{color:#00C896}
/* article bodies */
.tag{border-radius:999px}
.kick{color:#14D8B4}