@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=DM+Sans:opsz,wght@9..40,400;9..40,500&display=swap');

/* ── RESET & BASE ──────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html   { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; }
body   { font-family: 'DM Sans', sans-serif; background: #0a0a0b; color: #fff; min-height: 100vh; overflow-x: hidden; }
h1,h2,h3,h4,h5 { font-family: 'Syne', sans-serif; font-weight: 700; line-height: 1.15; letter-spacing: -.02em; }
button { font-family: 'DM Sans', sans-serif; cursor: pointer; border: none; outline: none; }
input, textarea, select { font-family: 'DM Sans', sans-serif; outline: none; }
a { color: inherit; text-decoration: none; }
::-webkit-scrollbar { width: 3px; height: 3px; }
::-webkit-scrollbar-track { background: #111114; }
::-webkit-scrollbar-thumb { background: #2e2e36; border-radius: 3px; }

/* ── TOKENS ────────────────────────────────────────────── */
:root {
  --g900: #18181c; --g800: #222228; --g700: #2e2e36;
  --g600: #3d3d47; --g500: #565664; --g400: #7c7c8e; --g300: #a8a8b8;
  --b600: #1e4d9e; --b500: #2563eb; --b400: #3b82f6; --b300: #60a5fa;
  --nav: 58px;
}

/* ── KEYFRAMES ─────────────────────────────────────────── */
@keyframes fadeUp  { from { opacity:0; transform:translateY(20px) } to { opacity:1; transform:translateY(0) } }
@keyframes fadeIn  { from { opacity:0; transform:translateY(6px)  } to { opacity:1; transform:translateY(0) } }
@keyframes scaleIn { from { opacity:0; transform:scale(.93)       } to { opacity:1; transform:scale(1)     } }
@keyframes spin    { to   { transform: rotate(360deg) } }
@keyframes pulse   { 0%,100% { opacity:1 } 50% { opacity:.4 } }
@keyframes dotB    { 0%,60%,100% { transform:translateY(0); opacity:.4 } 30% { transform:translateY(-7px); opacity:1 } }
@keyframes orbF    { 0%,100% { transform:translateY(0) } 50% { transform:translateY(-20px) } }
@keyframes barRise { from { transform:scaleY(0); transform-origin:bottom } to { transform:scaleY(1) } }
@keyframes typB    { 0%,60%,100% { transform:translateY(0) } 30% { transform:translateY(-5px) } }

/* ── UTILITIES ─────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:10px 20px; border-radius:10px; font-size:.88rem; font-weight:500; cursor:pointer; transition:all .2s; border:none; white-space:nowrap; }
.btn-primary   { background:#2563eb; color:#fff; }
.btn-primary:hover { background:#3b82f6; box-shadow:0 0 20px rgba(37,99,235,.35); transform:translateY(-1px); }
.btn-secondary { background:#222228; color:#a8a8b8; border:1px solid #2e2e36; }
.btn-secondary:hover { background:#2e2e36; color:#fff; }
.btn-ghost  { background:transparent; color:#7c7c8e; border:1px solid #222228; }
.btn-ghost:hover { background:#222228; color:#fff; }
.btn-sm  { padding:6px 14px; font-size:.8rem; }
.btn-lg  { padding:13px 26px; font-size:.95rem; }
.btn-full{ width:100%; justify-content:center; }
.btn:disabled { opacity:.5; cursor:not-allowed; transform:none !important; box-shadow:none !important; }

.input { width:100%; padding:11px 14px; background:#222228; border:1px solid #2e2e36; border-radius:10px; color:#fff; font-size:.88rem; transition:all .15s; }
.input::placeholder { color:#565664; }
.input:focus { border-color:#2563eb; background:#18181c; box-shadow:0 0 0 3px rgba(37,99,235,.12); }

.badge { display:inline-flex; align-items:center; padding:3px 9px; border-radius:9999px; font-size:.68rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.badge-blue   { background:rgba(37,99,235,.12); border:1px solid rgba(37,99,235,.25); color:#60a5fa; }
.badge-green  { background:rgba(16,185,129,.1);  border:1px solid rgba(16,185,129,.2);  color:#34d399; }
.badge-yellow { background:rgba(245,158,11,.1);  border:1px solid rgba(245,158,11,.2);  color:#fbbf24; }
.badge-grey   { background:#222228; border:1px solid #2e2e36; color:#a8a8b8; }
.badge-red    { background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.2); color:#fca5a5; }

.avatar { border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-family:'Syne',sans-serif; font-weight:800; color:#fff; background:#1e4d9e; flex-shrink:0; line-height:1; }

.prog-bar  { height:6px; background:#222228; border-radius:3px; overflow:hidden; }
.prog-fill { height:100%; background:#2563eb; border-radius:3px; transition:width 1s ease; }

.card { background:#18181c; border:1px solid #222228; border-radius:15px; }
.spinner { display:inline-block; width:20px; height:20px; border:2px solid #2e2e36; border-top-color:#2563eb; border-radius:50%; animation:spin .7s linear infinite; }

/* Chat bubbles */
.row   { display:flex; align-items:flex-end; gap:6px; margin-bottom:2px; animation:fadeIn .22s ease; }
.row.me{ flex-direction:row-reverse; }
.bbl   { max-width:78%; padding:9px 13px; font-size:.87rem; line-height:1.5; display:flex; flex-direction:column; gap:3px; border-radius:17px; }
.bbl.me  { background:#2563eb; color:#fff; border-bottom-right-radius:4px; }
.bbl.them{ background:#222228; color:#e8e8f0; border-bottom-left-radius:4px; }
.btime   { font-size:.62rem; opacity:.55; white-space:nowrap; align-self:flex-end; }

/* ── TOAST ─────────────────────────────────────────────── */
#toast { position:fixed; bottom:24px; right:24px; z-index:9000; padding:12px 18px; border-radius:12px; font-size:.88rem; font-weight:500; box-shadow:0 8px 24px rgba(0,0,0,.5); animation:fadeIn .3s ease; display:none; max-width:320px; }
#toast.show     { display:block; }
#toast.success  { background:rgba(16,185,129,.12); border:1px solid rgba(16,185,129,.2); color:#34d399; }
#toast.error    { background:rgba(239,68,68,.1);   border:1px solid rgba(239,68,68,.2);  color:#fca5a5; }
#toast.info     { background:rgba(37,99,235,.12);  border:1px solid rgba(37,99,235,.25); color:#60a5fa; }

/* ── AUTH ──────────────────────────────────────────────── */
#auth-overlay { position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:16px; background:#0a0a0b; overflow:auto; }
#auth-overlay.show { display:flex; }
.auth-orb { position:absolute; border-radius:50%; filter:blur(100px); pointer-events:none; }
.auth-modal { position:relative; z-index:1; width:100%; max-width:400px; background:#18181c; border:1px solid #222228; border-radius:22px; padding:28px; box-shadow:0 24px 80px rgba(0,0,0,.8); animation:scaleIn .3s ease; }
.auth-tabs  { display:flex; gap:4px; background:#222228; border-radius:10px; padding:4px; margin-bottom:22px; }
.auth-tab   { flex:1; padding:8px; border-radius:7px; font-size:.82rem; font-weight:500; background:transparent; color:#565664; border:none; cursor:pointer; transition:all .15s; }
.auth-tab.active { background:#3d3d47; color:#fff; }
.auth-form  { display:flex; flex-direction:column; gap:13px; }
.f-group    { display:flex; flex-direction:column; gap:6px; }
.f-label    { font-size:.78rem; font-weight:500; color:#a8a8b8; }
.f-wrap     { position:relative; }
.f-wrap .input { padding-left:38px; }
.f-icon     { position:absolute; left:12px; top:50%; transform:translateY(-50%); font-size:14px; pointer-events:none; }
.auth-err   { padding:10px 13px; background:rgba(239,68,68,.08); border:1px solid rgba(239,68,68,.18); border-radius:9px; font-size:.8rem; color:#fca5a5; }
.demo-hints { background:#111114; border-radius:10px; padding:12px 14px; border:1px dashed #2e2e36; }
.demo-row   { display:flex; align-items:center; justify-content:space-between; padding:6px 8px; border-radius:7px; cursor:pointer; transition:background .12s; }
.demo-row:hover { background:#222228; }

/* ── NAVBAR ────────────────────────────────────────────── */
#navbar { position:fixed; top:0; left:0; right:0; z-index:500; height:var(--nav); transition:background .25s, border .25s; }
#navbar.scrolled { background:rgba(10,10,11,.93); backdrop-filter:blur(16px); border-bottom:1px solid #222228; }
.nav-inner { max-width:1200px; margin:0 auto; padding:0 16px; height:100%; display:flex; align-items:center; gap:6px; }
.nav-brand { display:flex; align-items:center; gap:8px; background:none; border:none; cursor:pointer; margin-right:8px; }
.nav-logo  { width:30px; height:30px; background:#2563eb; border-radius:8px; display:flex; align-items:center; justify-content:center; font-family:'Syne',sans-serif; font-size:.9rem; font-weight:800; color:#fff; }
.nav-name  { font-family:'Syne',sans-serif; font-size:1.1rem; font-weight:800; letter-spacing:-.03em; }
.nav-links { display:flex; align-items:center; gap:2px; flex:1; }
.nav-link  { padding:7px 11px; border-radius:9px; font-size:.83rem; font-weight:500; color:#a8a8b8; background:none; border:none; cursor:pointer; transition:all .15s; }
.nav-link:hover, .nav-link.active { background:#222228; color:#fff; }
.nav-link.project { color:#60a5fa; background:rgba(37,99,235,.08); border:1px solid rgba(37,99,235,.18); margin-left:4px; }
.nav-actions { display:flex; align-items:center; gap:4px; margin-left:auto; }
.nav-icn { position:relative; width:36px; height:36px; display:flex; align-items:center; justify-content:center; background:#222228; border:1px solid #222228; border-radius:9px; color:#7c7c8e; cursor:pointer; font-size:16px; transition:all .15s; }
.nav-icn:hover, .nav-icn.active { background:rgba(37,99,235,.12); color:#60a5fa; border-color:rgba(37,99,235,.28); }
.nav-dot { position:absolute; top:7px; right:7px; width:7px; height:7px; background:#2563eb; border-radius:50%; border:1.5px solid #0a0a0b; }
.nav-dd  { position:relative; }
.dd-menu { position:absolute; top:calc(100% + 8px); right:0; background:#18181c; border:1px solid #2e2e36; border-radius:12px; padding:6px; box-shadow:0 12px 40px rgba(0,0,0,.6); z-index:600; min-width:140px; display:none; animation:scaleIn .18s ease; }
.dd-menu.open { display:block; }
.dd-item { display:flex; align-items:center; gap:8px; width:100%; padding:8px 10px; border-radius:8px; font-size:.83rem; font-weight:500; color:#a8a8b8; background:none; border:none; cursor:pointer; transition:all .12s; text-align:left; }
.dd-item:hover { background:#222228; color:#fff; }
.dd-item.danger:hover { background:rgba(239,68,68,.08); color:#fca5a5; }
.nav-user { display:flex; align-items:center; gap:6px; height:36px; padding:2px 8px 2px 3px; background:#222228; border:1px solid #222228; border-radius:9999px; cursor:pointer; }
.nav-user-info { padding:4px 10px 10px; border-bottom:1px solid #222228; margin-bottom:4px; display:flex; align-items:center; gap:10px; }
.mobile-menu { display:none; background:#18181c; border-top:1px solid #222228; padding:8px 16px 14px; flex-direction:column; gap:4px; animation:fadeIn .2s ease; }
.mobile-menu.open { display:flex; }
.mob-link { padding:11px 14px; border-radius:9px; font-size:.93rem; font-weight:500; color:#a8a8b8; background:none; border:none; cursor:pointer; text-align:left; transition:all .12s; }
.mob-link:hover { background:#222228; color:#fff; }

/* ── PAGES ─────────────────────────────────────────────── */
.page { display:none; }
.page.show { display:block; }
#app { padding-top:var(--nav); }

/* ── HOME ──────────────────────────────────────────────── */
.grid-bg { position:fixed; inset:0; z-index:-1; background-image:linear-gradient(#18181c 1px,transparent 1px),linear-gradient(90deg,#18181c 1px,transparent 1px); background-size:44px 44px; opacity:.2; mask-image:radial-gradient(ellipse at 50% 30%,black 20%,transparent 72%); pointer-events:none; }
.hero    { min-height:calc(100vh - var(--nav)); display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:40px; max-width:1200px; margin:0 auto; padding:60px 20px; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; padding:5px 13px; background:rgba(37,99,235,.1); border:1px solid rgba(37,99,235,.22); border-radius:9999px; font-size:.76rem; font-weight:500; color:#60a5fa; width:fit-content; }
.hero-dot   { width:7px; height:7px; background:#22c55e; border-radius:50%; animation:pulse 2s infinite; }
.hero-h1    { font-size:clamp(2rem,4.5vw,3.4rem); font-weight:800; line-height:1.1; }
.hero-h1 .blue { background:linear-gradient(135deg,#3b82f6,#60a5fa); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.hero-sub   { font-size:.97rem; color:#a8a8b8; line-height:1.7; max-width:440px; }
.hero-btns  { display:flex; gap:12px; flex-wrap:wrap; }
.hero-stats { display:flex; gap:28px; flex-wrap:wrap; }
.h-stat-n   { font-family:'Syne',sans-serif; font-size:1.25rem; font-weight:800; }
.h-stat-l   { font-size:.72rem; color:#565664; }
.sec  { padding:96px 0; }
.sec-bg { background:linear-gradient(180deg,transparent,rgba(18,18,24,.4) 50%,transparent); }
.sec-inner { max-width:1200px; margin:0 auto; padding:0 20px; }
.sec-hdr   { text-align:center; margin-bottom:44px; display:flex; flex-direction:column; align-items:center; gap:11px; }
.sec-title { font-size:clamp(1.7rem,3.5vw,2.5rem); font-weight:800; }
.sec-sub   { font-size:.92rem; color:#a8a8b8; max-width:400px; }

/* Services */
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.svc-card { padding:22px; background:#18181c; border:1px solid #222228; border-radius:15px; transition:all .25s; }
.svc-card:hover { border-color:rgba(37,99,235,.3); background:#222228; transform:translateY(-2px); }
.svc-ico { font-size:1.5rem; margin-bottom:12px; }
.svc-t   { font-size:1rem; font-weight:700; margin-bottom:8px; }
.svc-d   { font-size:.82rem; color:#a8a8b8; line-height:1.65; margin-bottom:13px; }
.svc-tags{ display:flex; gap:5px; flex-wrap:wrap; }
.svc-tag { padding:2px 8px; background:#222228; border:1px solid #2e2e36; border-radius:9999px; font-size:.68rem; color:#7c7c8e; }

/* Portfolio */
.pf-filters { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:36px; }
.pf-fbtn { padding:6px 15px; border-radius:9999px; font-size:.8rem; font-weight:500; background:#222228; border:1px solid #2e2e36; color:#a8a8b8; cursor:pointer; transition:all .15s; }
.pf-fbtn.on, .pf-fbtn:hover { background:#2563eb; border-color:#2563eb; color:#fff; }
.pf-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.pf-card { background:#18181c; border:1px solid #222228; border-radius:15px; overflow:hidden; transition:all .25s; }
.pf-card:hover { border-color:#2e2e36; transform:translateY(-3px); box-shadow:0 16px 40px rgba(0,0,0,.4); }
.pf-thumb { height:150px; position:relative; overflow:hidden; }
.pf-body  { padding:15px; }
.pf-title { font-size:.95rem; font-weight:700; margin:7px 0 4px; }
.pf-desc  { font-size:.8rem; color:#7c7c8e; margin-bottom:10px; line-height:1.5; }
.pf-tags  { display:flex; gap:5px; flex-wrap:wrap; }
.pf-tag   { padding:2px 7px; background:rgba(37,99,235,.08); border:1px solid rgba(37,99,235,.12); border-radius:9999px; font-size:.66rem; color:#60a5fa; }

/* Reviews */
.rv-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; }
.rv-card { padding:22px; background:#18181c; border:1px solid #222228; border-radius:15px; transition:all .22s; }
.rv-card:hover { background:#222228; border-color:#2e2e36; }
.rv-stars { display:flex; gap:2px; margin-bottom:12px; color:#3b82f6; font-size:13px; }
.rv-text  { font-size:.87rem; color:#a8a8b8; line-height:1.65; margin-bottom:16px; font-style:italic; }
.rv-auth  { display:flex; align-items:center; gap:10px; }
.rv-name  { font-size:.86rem; font-weight:600; }
.rv-role  { font-size:.73rem; color:#565664; }

/* Footer */
#footer  { border-top:1px solid #222228; padding:72px 0 0; }
.ft-grid { display:grid; grid-template-columns:1.4fr 2fr; gap:60px; padding-bottom:56px; }
.ft-lnks { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.ft-lt   { font-size:.72rem; font-weight:700; color:#565664; text-transform:uppercase; letter-spacing:.07em; margin-bottom:12px; }
.ft-l    { display:block; font-size:.82rem; color:#7c7c8e; padding:3px 0; cursor:pointer; }
.ft-l:hover { color:#a8a8b8; }
.ft-bottom { display:flex; justify-content:space-between; padding:16px 0; border-top:1px solid #222228; font-size:.72rem; color:#3d3d47; }

/* ── CHAT ──────────────────────────────────────────────── */
#chat-pg { display:flex; flex-direction:column; height:calc(100dvh - var(--nav)); max-width:720px; margin:0 auto; }
.chat-hdr{ display:flex; align-items:center; gap:10px; padding:11px 15px; background:#18181c; border-bottom:1px solid #222228; flex-shrink:0; position:sticky; top:var(--nav); z-index:10; }
.chat-msgs{ flex:1; overflow-y:auto; padding:18px 15px; display:flex; flex-direction:column; gap:2px; background:#111114; }
.chat-welcome { display:flex; flex-direction:column; align-items:center; gap:12px; padding:36px 20px; text-align:center; }
.chat-quick-bar { padding:10px 14px; background:#18181c; border-top:1px solid #222228; flex-shrink:0; }
.quick-grid  { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:7px; }
.quick-btn   { display:flex; align-items:center; gap:8px; padding:9px 11px; background:#222228; border:1px solid #2e2e36; border-radius:9px; font-size:.8rem; font-weight:500; color:#a8a8b8; cursor:pointer; transition:all .15s; text-align:left; }
.quick-btn:hover { background:#2e2e36; color:#fff; }
.chat-bar    { padding:11px 14px; background:#18181c; border-top:1px solid #222228; flex-shrink:0; padding-bottom:max(11px,env(safe-area-inset-bottom)); }
.chat-row    { display:flex; align-items:center; gap:8px; }
.chat-in     { flex:1; padding:10px 16px; background:#222228; border:1px solid #2e2e36; border-radius:9999px; color:#fff; font-size:.88rem; transition:border-color .15s; }
.chat-in:focus { border-color:#2563eb; }
.chat-send   { width:40px; height:40px; display:flex; align-items:center; justify-content:center; background:#222228; border:1px solid #2e2e36; border-radius:50%; color:#565664; cursor:pointer; font-size:16px; transition:all .2s; flex-shrink:0; }
.chat-send.on{ background:#2563eb; border-color:#2563eb; color:#fff; box-shadow:0 0 16px rgba(37,99,235,.35); }
.online-dot  { position:absolute; bottom:1px; right:1px; width:9px; height:9px; background:#22c55e; border-radius:50%; border:2px solid #18181c; }

/* ── DASHBOARD ─────────────────────────────────────────── */
#dash-pg { max-width:900px; margin:0 auto; padding-bottom:40px; }
.dash-hdr{ background:#18181c; border-bottom:1px solid #222228; padding:18px 20px; }
.dash-tabs{ display:flex; background:#18181c; border-bottom:1px solid #222228; overflow-x:auto; scrollbar-width:none; }
.dash-tabs::-webkit-scrollbar { display:none; }
.dash-tab { display:flex; align-items:center; gap:6px; padding:13px 16px; font-size:.82rem; font-weight:500; color:#565664; background:none; border:none; border-bottom:2px solid transparent; cursor:pointer; white-space:nowrap; transition:all .15s; }
.dash-tab.on { color:#60a5fa; border-bottom-color:#2563eb; }
.dash-body{ padding:22px 20px; }
.stage-row { display:flex; align-items:center; gap:12px; padding:12px 15px; background:#18181c; border:1px solid #222228; border-radius:12px; margin-bottom:8px; }
.stage-ico { width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:13px; }
.stage-ico.done   { background:rgba(16,185,129,.1); color:#34d399; }
.stage-ico.active { background:rgba(37,99,235,.1);  color:#60a5fa; }
.stage-ico.pending{ background:#222228; color:#565664; }
.file-row  { display:flex; align-items:center; gap:12px; padding:12px 14px; background:#18181c; border:1px solid #222228; border-radius:12px; margin-bottom:7px; transition:background .15s; }
.file-row:hover { background:#222228; }
.file-ico  { width:36px; height:36px; background:rgba(37,99,235,.1); border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; }
.pay-row   { display:flex; align-items:center; justify-content:space-between; padding:13px 15px; background:#18181c; border:1px solid #222228; border-radius:12px; margin-bottom:8px; gap:12px; }
.upd-row   { display:flex; gap:14px; padding-bottom:18px; }
.upd-dot   { width:12px; height:12px; background:#2563eb; border-radius:50%; flex-shrink:0; box-shadow:0 0 8px rgba(37,99,235,.4); margin-top:4px; }
.drop-zone { display:flex; flex-direction:column; align-items:center; gap:9px; padding:26px; background:#18181c; border:2px dashed #2e2e36; border-radius:14px; cursor:pointer; transition:all .2s; margin-bottom:18px; }
.drop-zone:hover, .drop-zone.drag { border-color:#2563eb; background:rgba(37,99,235,.03); }

/* ── ADMIN ─────────────────────────────────────────────── */
#admin-pg { display:none; flex:1; min-height:100vh; background:#0a0a0b; }
#admin-pg.show { display:flex; }
.adm-side { width:218px; background:#111114; border-right:1px solid #222228; display:flex; flex-direction:column; transition:width .25s; flex-shrink:0; overflow:hidden; }
.adm-side.col { width:54px; }
.adm-main { flex:1; display:flex; flex-direction:column; min-width:0; overflow:hidden; }
.adm-top  { display:flex; align-items:center; gap:12px; padding:0 18px; height:54px; background:#111114; border-bottom:1px solid #222228; flex-shrink:0; }
.adm-body { flex:1; overflow-y:auto; padding:20px 18px; }
.adm-navbtn { display:flex; align-items:center; gap:9px; padding:8px 9px; border-radius:9px; font-size:.82rem; font-weight:500; color:#565664; background:none; border:none; cursor:pointer; transition:all .13s; white-space:nowrap; overflow:hidden; width:100%; text-align:left; }
.adm-navbtn:hover { background:#222228; color:#a8a8b8; }
.adm-navbtn.on    { background:rgba(37,99,235,.1); color:#60a5fa; }
.adm-navbtn.danger:hover { background:rgba(239,68,68,.08); color:#fca5a5; }
.adm-stat { padding:16px; background:#18181c; border:1px solid #222228; border-radius:13px; border-left:3px solid #2563eb; }
.adm-table { width:100%; border-collapse:collapse; font-size:.83rem; }
.adm-table th { padding:10px 14px; text-align:left; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#565664; border-bottom:1px solid #222228; background:#111114; }
.adm-table td { padding:11px 14px; border-bottom:1px solid #222228; color:#a8a8b8; }
.adm-table tr:hover td { background:#222228; }
.ticket  { padding:11px 13px; border-bottom:1px solid #222228; cursor:pointer; transition:background .12s; border-left:2px solid transparent; }
.ticket:hover { background:#222228; }
.ticket.on    { background:rgba(37,99,235,.07); border-left-color:#2563eb; }

/* ── RESPONSIVE ────────────────────────────────────────── */
@media (max-width: 1024px) {
  .svc-grid { grid-template-columns:repeat(2,1fr); }
  .pf-grid  { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 768px) {
  .hide-m { display:none !important; }
  .show-m { display:flex !important; }
  .hero  { grid-template-columns:1fr !important; padding:36px 16px 56px !important; text-align:center; min-height:auto !important; }
  .hero-badge { margin:0 auto; }
  .hero-btns, .hero-stats { justify-content:center; }
  .hero-sub { max-width:100%; }
  .svc-grid, .pf-grid { grid-template-columns:1fr !important; }
  .rv-grid  { grid-template-columns:1fr !important; }
  .ft-grid  { grid-template-columns:1fr !important; gap:32px !important; }
  .ft-bottom{ flex-direction:column; gap:6px; text-align:center; }
  .sec   { padding:60px 0 !important; }
  .sec-inner { padding:0 14px; }
  .adm-side  { position:fixed; z-index:200; height:100vh; }
  .adm-side.col { width:0; }
  .dash-hdr  { padding:14px; }
  .dash-body { padding:14px; }
  .tickets-lay { grid-template-columns:1fr !important; }
}
@media (min-width: 769px) { .show-m { display:none !important; } }

.nav-logo-img {
    width: 200px;
    height: 200px;
    object-fit: contain;
    display: block;
    filter: drop-shadow(0 0 12px rgba(37, 99, 235, 0.35));
}

.nav-brand {
    display: flex;
    align-items: center;
    gap: 10px;
}