:root{
  --ink:#001D21;
  --ink-soft:#3F5B5E;
  --paper:#F5F7F6;
  --paper-raised:#FFFFFF;
  --blue:#376A71;
  --blue-deep:#16525C;
  --blue-tint:#E7F0EF;
  --gold:#5D5AA8;
  --gold-tint:#EDECFF;
  --green:#194340;
  --green-tint:#E9F1EE;
  --danger:#B3261E;
  --danger-tint:#FBE9E7;
  --line:rgba(0,29,33,0.12);
  --line-strong:rgba(0,29,33,0.22);
  --radius:10px;
}
*{box-sizing:border-box;}
html,body{margin:0; padding:0;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
}
h1,h2,h3{font-family:'Fraunces',Georgia,serif; font-weight:500; letter-spacing:-0.01em; margin:0;}
p{margin:0;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer;}
.mono{font-family:'IBM Plex Mono',monospace;}
.wrap{max-width:1120px; margin:0 auto; padding:0 32px;}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:3px solid currentColor; outline-offset:2px; border-radius:4px;
}
@media (prefers-reduced-motion: reduce){ *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;} }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 22px; border-radius:8px; font-weight:500; font-size:14px;
  border:1px solid var(--ink); background:transparent; color:var(--ink);
  transition:transform .15s ease, background .15s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--blue-deep); color:#fff; border-color:var(--blue-deep);}
.btn-primary:hover{background:#0F3D45;}
.btn-ghost{border-color:var(--line-strong);}
.btn-ghost:hover{border-color:var(--ink);}
.btn-danger{background:var(--danger); color:#fff; border-color:var(--danger);}
.btn-sm{padding:9px 16px; font-size:13px;}
.btn-block{width:100%;}
.btn:disabled{opacity:0.5; cursor:not-allowed; transform:none;}

.field{margin-bottom:16px;}
.field label{display:block; font-size:13px; font-weight:500; margin-bottom:6px; color:var(--ink);}
.field input, .field select, .field textarea{
  width:100%; padding:0 14px; height:46px; border-radius:8px; border:1px solid var(--line-strong);
  font-family:inherit; font-size:14px; color:var(--ink); background:var(--paper-raised);
}
.field textarea{height:auto; padding:12px 14px; min-height:100px; resize:vertical;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--blue-deep);}

.card{background:var(--paper-raised); border:1px solid var(--line); border-radius:12px; padding:24px;}
.badge{display:inline-flex; align-items:center; gap:6px; font-size:11px; font-family:'IBM Plex Mono',monospace; padding:3px 10px; border-radius:20px;}
.badge-gold{background:#F4F1FF; color:#4A4880;}
.badge-silver{background:var(--blue-tint); color:var(--blue-deep);}
.badge-basic{background:var(--green-tint); color:#163832;}
.badge-pending{background:#FFF4E5; color:#8A5A00;}
.badge-rejected{background:var(--danger-tint); color:var(--danger);}

.alert{border-radius:8px; padding:12px 14px; font-size:13.5px; margin-bottom:16px;}
.alert-error{background:var(--danger-tint); color:var(--danger);}
.alert-success{background:var(--green-tint); color:#163832;}

/* Header / nav shared across app pages */
.site-header{position:sticky; top:0; z-index:50; background:rgba(245,247,246,0.94); backdrop-filter:blur(6px); border-bottom:1px solid var(--line);}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; height:72px; gap:16px;}
.logo{display:flex; align-items:center; gap:9px; font-family:'Fraunces',serif; font-size:19px; font-weight:600;}
.logo svg{width:26px; height:26px;}
.nav-links{display:flex; align-items:center; gap:26px;}
.nav-links a{font-size:14px; font-weight:500; color:var(--ink-soft);}
.nav-links a:hover{color:var(--ink);}
.menu-toggle{display:none; width:42px; height:42px; align-items:center; justify-content:center; background:transparent; border:1px solid var(--line-strong); border-radius:8px;}
.mobile-nav{display:none; flex-direction:column; background:var(--paper-raised); border-bottom:1px solid var(--line); padding:8px 0 14px;}
.mobile-nav.open{display:flex;}
.mobile-nav a{padding:14px 32px; font-size:15px; font-weight:500; color:var(--ink);}
.mobile-nav a:hover{background:var(--blue-tint);}

/* Tabs, reused for landing sections and business profile */
.tabs{display:flex; gap:6px; border-bottom:1px solid var(--line); margin-bottom:28px; overflow-x:auto;}
.tab-btn{padding:12px 18px; font-size:14px; font-weight:500; color:var(--ink-soft); border-bottom:2px solid transparent; white-space:nowrap; background:none; border-top:none; border-left:none; border-right:none;}
.tab-btn.active{color:var(--blue-deep); border-bottom-color:var(--blue-deep);}
.tab-btn:hover{color:var(--ink);}

footer.site-footer{background:var(--ink); color:rgba(245,247,246,0.7); padding:48px 0 28px; margin-top:64px;}
footer.site-footer a{color:rgba(245,247,246,0.75);}
footer.site-footer a:hover{color:#fff;}
.foot-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding-top:20px; border-top:1px solid rgba(245,247,246,0.12); margin-top:24px; font-size:12px; color:rgba(245,247,246,0.45); font-family:'IBM Plex Mono',monospace;}

@media (max-width:860px){
  .nav-links{display:none;}
  .menu-toggle{display:flex;}
  .wrap{padding:0 22px;}
}
@media (max-width:600px){
  .wrap{padding:0 18px;}
  h1{font-size:26px !important;}
  h2{font-size:22px !important;}
}