/* ============================================================
   NextGen Tutors — Preloader, Page Transitions & Interior Pages
   ============================================================ */

/* ===================== PRELOADER (spiral) ===================== */
.preloader {
  position: fixed; inset: 0; z-index: 9999;
  background: radial-gradient(60% 70% at 50% 45%, #0b2e54 0%, #061528 70%, #03101f 100%);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.preloader.is-hiding { pointer-events: none; }
#spiral-canvas { position: absolute; inset: 0; }
.preloader__stage {
  position: absolute; inset: 0; z-index: 2;
  display: flex; align-items: center; justify-content: center;
  perspective: 1100px;
}
.pre-logo-wrap { position: relative; display: flex; align-items: center; justify-content: center; }
.pre-logo {
  width: 200px; height: 200px; display: block;
  opacity: 0; transform-origin: center center;
  will-change: transform, opacity, filter;
}
.pre-logo.is-glowing { animation: preGlow 2.4s ease-in-out infinite; }
@keyframes preGlow {
  0%, 100% { filter: drop-shadow(0 0 14px rgba(0,140,255,0.45)) drop-shadow(0 0 26px rgba(174,206,97,0.25)); }
  50% { filter: drop-shadow(0 0 26px rgba(0,184,255,0.7)) drop-shadow(0 0 44px rgba(174,206,97,0.5)); }
}
.pre-flash {
  position: absolute; width: 46vmax; height: 46vmax; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.95) 0%, rgba(174,206,97,0.45) 38%, rgba(0,140,255,0.18) 60%, transparent 72%);
  opacity: 0; pointer-events: none; mix-blend-mode: screen;
}
.pre-skip {
  position: fixed; bottom: 28px; right: 30px; z-index: 4;
  color: rgba(255,255,255,0.5); font-family: var(--font-sans);
  font-size: 10.5px; font-weight: 800; letter-spacing: 0.22em; text-transform: uppercase;
  padding: 10px 16px; border: 1px solid rgba(255,255,255,0.16); border-radius: var(--r-pill);
  transition: color .3s, border-color .3s, background .3s;
}
.pre-skip:hover { color: #fff; border-color: var(--lime); background: rgba(255,255,255,0.06); }
/* lock scroll while preloader active */
body.preloading { overflow: hidden; height: 100vh; }

/* ===================== PAGE TRANSITION (strip wipe) ===================== */
.page-transition {
  position: fixed; inset: 0; z-index: 9000; display: flex;
  pointer-events: none;
}
.pt-strip { flex: 1; background: var(--navy); transform: scaleY(0); transform-origin: bottom; will-change: transform; }
.pt-strip:nth-child(odd) { background: var(--navy); }
.pt-strip:nth-child(even) { background: var(--blue); }
.page-transition__logo {
  position: fixed; inset: 0; z-index: 9001; display: flex; align-items: center; justify-content: center;
  pointer-events: none; opacity: 0;
}
.page-transition__logo .logo__name { color: #fff; font-size: 30px; }
.page-transition__logo .logo__name span { color: var(--lime); }
/* Instant cover for pages arriving via a transition (prevents content flash) */
html.pt-incoming::before { content: ""; position: fixed; inset: 0; z-index: 8998; background: var(--navy); }

/* ===================== PAGE HEADER (interior hero banner) ===================== */
.pagehead {
  position: relative; background: var(--navy); color: #fff; overflow: hidden;
  padding: calc(var(--nav-h) + 56px) 0 64px;
}
.pagehead__bg { position: absolute; inset: 0; }
.pagehead__mesh {
  position: absolute; inset: -20%;
  background:
    radial-gradient(40% 60% at 80% 20%, rgba(174,206,97,0.22), transparent 60%),
    radial-gradient(45% 60% at 15% 90%, rgba(26,85,148,0.6), transparent 60%);
  filter: blur(20px);
}
.pagehead__grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse 70% 80% at 60% 30%, #000 30%, transparent 75%);
}
.pagehead__inner { position: relative; z-index: 2; max-width: 760px; }
.pagehead__crumb { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.12em; color: rgba(255,255,255,0.5); margin-bottom: 20px; }
.pagehead__crumb a:hover { color: var(--lime); }
.pagehead__crumb svg { width: 13px; height: 13px; }
.pagehead__eyebrow { color: var(--lime); margin-bottom: 14px; }
.pagehead__title { font-family: var(--font-serif); font-weight: 900; text-transform: uppercase; font-size: clamp(36px, 5.5vw, 64px); line-height: 0.98; letter-spacing: -0.02em; }
.pagehead__title .accent { color: var(--lime); font-style: italic; }
.pagehead__sub { margin-top: 20px; font-size: 17px; line-height: 1.6; color: rgba(255,255,255,0.74); font-weight: 500; max-width: 560px; }
.pagehead__stats { display: flex; gap: 36px; margin-top: 30px; flex-wrap: wrap; }
.pagehead__stat .n { font-family: var(--font-serif); font-weight: 900; font-style: italic; font-size: 28px; color: var(--lime); }
.pagehead__stat .l { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.1em; color: rgba(255,255,255,0.55); margin-top: 5px; }

/* page body wrapper offset (pages without dark header) */
.page-offset { padding-top: var(--nav-h); }

/* ===================== TUTOR DIRECTORY ===================== */
.directory { display: grid; grid-template-columns: 280px 1fr; gap: 32px; align-items: start; }
@media (max-width: 880px) { .directory { grid-template-columns: 1fr; } }

.filters {
  background: var(--white); border: 2px solid var(--slate-200); border-bottom-width: 8px;
  border-radius: var(--r-xl); padding: 26px; position: sticky; top: 96px;
}
@media (max-width: 880px) { .filters { position: static; } }
.filters__h { font-family: var(--font-serif); font-weight: 900; text-transform: uppercase; font-size: 17px; color: var(--navy); margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.filters__h svg { width: 18px; height: 18px; color: var(--lime-deep); }
.filter-group { padding: 20px 0; border-bottom: 1px solid var(--slate-100); }
.filter-group:last-of-type { border-bottom: none; }
.filter-group__label { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--slate-400); margin-bottom: 12px; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.fchip {
  font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em;
  padding: 7px 12px; border-radius: var(--r-pill); background: var(--slate-50);
  border: 1.5px solid var(--slate-200); color: var(--slate-600); transition: all .2s;
}
.fchip:hover { border-color: var(--lime); color: var(--navy); }
.fchip.is-active { background: var(--navy); color: #fff; border-color: var(--navy); }
.filter-range { width: 100%; accent-color: var(--lime-deep); height: 4px; }
.filter-range-val { font-family: var(--font-serif); font-weight: 900; font-style: italic; font-size: 18px; color: var(--navy); margin-top: 8px; }

.dir-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 22px; gap: 14px; flex-wrap: wrap; }
.dir-count { font-weight: 800; font-size: 13px; color: var(--slate-500); }
.dir-count b { color: var(--navy); font-family: var(--font-serif); font-style: italic; }
.dir-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
@media (max-width: 1180px) and (min-width: 881px) { .dir-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .dir-grid { grid-template-columns: 1fr; } }
.dir-grid .tutor-card3d { position: static; width: auto; height: auto; margin: 0; }
.dir-empty { grid-column: 1 / -1; text-align: center; padding: 60px 20px; color: var(--slate-400); font-weight: 700; }

/* ===================== ABOUT ===================== */
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
@media (max-width: 820px) { .about-grid { grid-template-columns: 1fr; gap: 30px; } }
.about-img { border-radius: var(--r-2xl); overflow: hidden; border: 6px solid #fff; box-shadow: var(--sh-xl); aspect-ratio: 5/4; }
.about-img img { width: 100%; height: 100%; object-fit: cover; }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 760px) { .values-grid { grid-template-columns: 1fr; } }
.value-card { background: var(--white); border: 2px solid var(--slate-200); border-bottom-width: 8px; border-radius: var(--r-xl); padding: 30px; transition: transform .35s var(--ease-spring), box-shadow .35s, border-color .35s; }
.value-card:hover { transform: translateY(-8px); box-shadow: var(--sh-lg); border-bottom-color: var(--lime); }
.value-card__e { font-size: 32px; display: block; margin-bottom: 16px; }
.value-card__t { font-family: var(--font-serif); font-weight: 900; text-transform: uppercase; font-size: 18px; color: var(--navy); margin-bottom: 10px; }
.value-card__d { font-size: 13.5px; line-height: 1.6; color: var(--slate-500); font-weight: 500; }

.timeline { position: relative; max-width: 760px; margin: 0 auto; padding-left: 28px; }
.timeline::before { content: ""; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 2px; background: var(--slate-200); }
.tl-item { position: relative; padding: 0 0 36px 30px; }
.tl-item::before { content: ""; position: absolute; left: -28px; top: 4px; width: 16px; height: 16px; border-radius: 50%; background: var(--lime); border: 3px solid var(--white); box-shadow: 0 0 0 2px var(--lime); }
.tl-year { font-family: var(--font-serif); font-weight: 900; font-style: italic; font-size: 22px; color: var(--navy); }
.tl-t { font-weight: 900; font-size: 14px; text-transform: uppercase; color: var(--navy); margin: 4px 0 6px; }
.tl-d { font-size: 13.5px; line-height: 1.6; color: var(--slate-500); font-weight: 500; }

/* ===================== CONTACT ===================== */
.contact-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: start; }
@media (max-width: 880px) { .contact-grid { grid-template-columns: 1fr; gap: 28px; } }
.contact-card { background: var(--navy); color: #fff; border-radius: var(--r-2xl); border-bottom: 10px solid #04162c; padding: 40px; position: relative; overflow: hidden; }
.contact-card__glow { position: absolute; inset: 0; background: radial-gradient(60% 60% at 90% 90%, rgba(174,206,97,0.16), transparent 60%); pointer-events: none; }
.contact-method { display: flex; gap: 16px; align-items: flex-start; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,0.08); position: relative; z-index: 1; }
.contact-method:last-child { border-bottom: none; }
.contact-method__ico { width: 48px; height: 48px; border-radius: var(--r-md); background: rgba(174,206,97,0.14); color: var(--lime); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.contact-method__ico svg { width: 22px; height: 22px; }
.contact-method__t { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255,255,255,0.5); }
.contact-method__v { font-family: var(--font-serif); font-weight: 900; font-size: 17px; color: #fff; margin-top: 4px; }

.form-card { background: var(--white); border: 2px solid var(--slate-200); border-bottom-width: 8px; border-radius: var(--r-2xl); padding: 40px; }
.field { margin-bottom: 20px; }
.field label { display: block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--slate-500); margin-bottom: 8px; }
.field input, .field select, .field textarea {
  width: 100%; font-family: var(--font-sans); font-weight: 600; font-size: 14px;
  padding: 14px 16px; border-radius: var(--r-sm); border: 2px solid var(--slate-200);
  background: var(--slate-50); color: var(--slate-800); transition: border-color .2s, background .2s;
}
.field textarea { resize: vertical; min-height: 130px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--lime); background: #fff; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 520px) { .field-row { grid-template-columns: 1fr; } }
.form-success { display: none; align-items: center; gap: 10px; background: var(--lime-soft); border: 1.5px solid var(--lime); color: var(--navy); padding: 14px 18px; border-radius: var(--r-md); font-weight: 800; font-size: 13px; margin-top: 16px; }
.form-success.show { display: flex; }

/* ===================== FAQ ===================== */
.faq { max-width: 820px; margin: 0 auto; }
.faq-item { background: var(--white); border: 2px solid var(--slate-200); border-radius: var(--r-lg); margin-bottom: 14px; overflow: hidden; transition: border-color .25s, box-shadow .25s; }
.faq-item.is-open { border-color: var(--lime); box-shadow: var(--sh-md); }
.faq-q { width: 100%; text-align: left; padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 16px; font-family: var(--font-serif); font-weight: 900; font-size: 16px; color: var(--navy); }
.faq-q__ico { width: 30px; height: 30px; border-radius: 50%; background: var(--slate-100); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: transform .3s, background .3s; }
.faq-item.is-open .faq-q__ico { transform: rotate(45deg); background: var(--lime); }
.faq-q__ico svg { width: 16px; height: 16px; }
.faq-a { max-height: 0; overflow: hidden; transition: max-height .4s var(--ease-expo); }
.faq-a__inner { padding: 0 26px 24px; font-size: 14px; line-height: 1.7; color: var(--slate-500); font-weight: 500; }

/* ===================== PRICING CALCULATOR ===================== */
.calc {
  background: var(--navy); border-radius: var(--r-2xl); border-bottom: 12px solid #04162c;
  padding: 44px; color: #fff; position: relative; overflow: hidden;
}
.calc__inner { position: relative; z-index: 1; display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 36px; align-items: start; }
@media (max-width: 880px) { .calc { padding: 30px; } .calc__inner { grid-template-columns: 1fr; gap: 26px; } }
.calc__panel { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: var(--r-xl); padding: 26px; }
.calc-field { margin-bottom: 20px; }
.calc-field__label { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255,255,255,0.7); margin-bottom: 10px; display: block; }
.seg { display: grid; gap: 6px; background: #050f1f; padding: 6px; border-radius: var(--r-md); border: 1px solid rgba(255,255,255,0.06); }
.seg--3 { grid-template-columns: repeat(3, 1fr); }
.seg--2 { grid-template-columns: repeat(2, 1fr); }
.seg button { padding: 11px 6px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.03em; border-radius: var(--r-sm); color: rgba(255,255,255,0.6); transition: all .2s; }
.seg button.is-active { background: var(--blue); color: var(--lime); }
.calc-range { width: 100%; accent-color: var(--lime); height: 5px; }
.calc-range-labels { display: flex; justify-content: space-between; font-size: 9.5px; font-weight: 800; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-top: 6px; }
.calc-out { background: #050f1f; border: 2px solid rgba(174,206,97,0.3); border-radius: var(--r-xl); padding: 28px; display: flex; flex-direction: column; gap: 18px; }
.calc-out__row { display: flex; justify-content: space-between; align-items: baseline; }
.calc-out__label { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(255,255,255,0.5); }
.calc-out__big { font-family: var(--font-serif); font-weight: 900; font-style: italic; font-size: 44px; color: var(--lime); line-height: 1; }
.calc-out__big .r { font-size: 22px; }
.calc-out__total { font-family: var(--font-serif); font-weight: 900; font-style: italic; font-size: 30px; color: #fff; }
.calc-save { background: rgba(174,206,97,0.12); border: 1px solid rgba(174,206,97,0.35); border-radius: var(--r-md); padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; }
.calc-save .l { font-size: 10px; font-weight: 900; text-transform: uppercase; color: var(--lime); }
.calc-save .v { font-family: var(--font-serif); font-weight: 900; font-style: italic; color: #fff; }

/* ===================== STUDENT DASHBOARD ===================== */
.dash-head { position: relative; background: var(--navy); color: #fff; overflow: hidden; padding: calc(var(--nav-h) + 36px) 0 40px; }
.dash-head__bg { position: absolute; inset: 0; }
.dash-head__inner { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.dash-hello__eyebrow { color: var(--lime); }
.dash-hello h1 { font-family: var(--font-serif); font-weight: 900; text-transform: uppercase; font-size: clamp(28px, 4vw, 44px); margin: 10px 0 6px; }
.dash-hello p { color: rgba(255,255,255,0.65); font-size: 14px; font-weight: 500; }
.dash-avatar { display: flex; align-items: center; gap: 14px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: var(--r-lg); padding: 12px 18px; }
.dash-avatar img { width: 52px; height: 52px; border-radius: 50%; border: 2px solid var(--lime); object-fit: cover; }
.dash-avatar__n { font-family: var(--font-serif); font-weight: 900; font-size: 16px; }
.dash-avatar__r { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--lime); margin-top: 3px; }

.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: -36px; position: relative; z-index: 10; }
@media (max-width: 860px) { .kpi-grid { grid-template-columns: repeat(2, 1fr); } }
.kpi-card { background: #fff; border: 2px solid var(--slate-200); border-bottom-width: 8px; border-radius: var(--r-lg); padding: 22px; display: flex; gap: 14px; align-items: center; box-shadow: var(--sh-md); transition: transform .35s var(--ease-spring), box-shadow .35s; }
.kpi-card:hover { transform: translateY(-6px); box-shadow: var(--sh-lg); }
.kpi-ico { width: 50px; height: 50px; border-radius: var(--r-md); display: flex; align-items: center; justify-content: center; font-size: 24px; flex-shrink: 0; }
.kpi-val { font-family: var(--font-serif); font-weight: 900; font-style: italic; font-size: 28px; color: var(--navy); line-height: 1; }
.kpi-lbl { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: var(--slate-400); margin-top: 6px; }

.dash-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 24px; margin-top: 40px; align-items: start; }
@media (max-width: 940px) { .dash-grid { grid-template-columns: 1fr; } }
.dash-col { display: flex; flex-direction: column; gap: 24px; }
.panel { background: #fff; border: 2px solid var(--slate-200); border-bottom-width: 8px; border-radius: var(--r-xl); padding: 28px; }
.panel__h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid var(--slate-100); }
.panel__h h2 { font-family: var(--font-serif); font-weight: 900; text-transform: uppercase; font-size: 18px; color: var(--navy); }

.next-session { background: var(--navy); border-radius: var(--r-lg); border-bottom: 6px solid #04162c; padding: 24px; color: #fff; display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: center; position: relative; overflow: hidden; }
@media (max-width: 560px) { .next-session { grid-template-columns: 1fr; } }
.next-session__glow { position: absolute; inset: 0; background: radial-gradient(60% 80% at 90% 50%, rgba(174,206,97,0.16), transparent 60%); }
.ns-tutor { display: flex; align-items: center; gap: 14px; position: relative; z-index: 1; }
.ns-tutor img { width: 56px; height: 56px; border-radius: var(--r-md); border: 2px solid var(--lime); object-fit: cover; }
.ns-name { font-family: var(--font-serif); font-weight: 900; font-size: 18px; }
.ns-meta { font-size: 12px; color: rgba(255,255,255,0.7); font-weight: 600; margin-top: 4px; display: flex; gap: 14px; flex-wrap: wrap; }
.ns-meta span { display: inline-flex; align-items: center; gap: 5px; }
.ns-meta svg { width: 13px; height: 13px; color: var(--lime); }
.ns-reminders { margin-top: 10px; display: inline-flex; align-items: center; gap: 8px; background: rgba(174,206,97,0.12); border: 1px solid rgba(174,206,97,0.3); border-radius: var(--r-pill); padding: 5px 12px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: var(--lime); position: relative; z-index: 1; }
.ns-reminders svg { width: 12px; height: 12px; }

.session-row { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--slate-100); }
.session-row:last-child { border-bottom: none; }
.session-row img { width: 46px; height: 46px; border-radius: var(--r-md); object-fit: cover; }
.session-row__t { font-family: var(--font-serif); font-weight: 900; font-size: 15px; color: var(--navy); }
.session-row__m { font-size: 12px; color: var(--slate-500); font-weight: 600; margin-top: 3px; }
.session-status { font-size: 9.5px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; padding: 5px 10px; border-radius: var(--r-pill); }
.session-status--done { background: var(--lime-soft); color: var(--navy); }
.session-status--rated { background: #fef3c7; color: #92400e; }

.badge-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.badge { text-align: center; padding: 16px 8px; border-radius: var(--r-md); border: 2px solid var(--slate-200); background: var(--slate-50); transition: transform .3s var(--ease-spring), border-color .3s; }
.badge.is-earned { border-color: var(--lime); background: var(--lime-soft); }
.badge.is-locked { opacity: 0.5; filter: grayscale(0.7); }
.badge:hover { transform: translateY(-4px); }
.badge__e { font-size: 28px; display: block; margin-bottom: 8px; }
.badge__n { font-size: 10.5px; font-weight: 900; text-transform: uppercase; color: var(--navy); letter-spacing: 0.02em; }

.referral { background: linear-gradient(160deg, #0e3a66, var(--navy)); border-radius: var(--r-lg); border-bottom: 6px solid #04162c; padding: 24px; color: #fff; }
.referral__h { font-family: var(--font-serif); font-weight: 900; text-transform: uppercase; font-size: 18px; color: var(--lime); }
.referral__d { font-size: 13px; color: rgba(255,255,255,0.7); margin: 8px 0 16px; line-height: 1.5; font-weight: 500; }
.referral__group { display: flex; gap: 8px; }
.referral__input { flex: 1; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15); border-radius: var(--r-sm); padding: 11px 14px; color: #fff; font-family: var(--font-mono, monospace); font-size: 12px; }
.referral__stats { font-size: 12px; color: rgba(255,255,255,0.6); margin-top: 14px; font-weight: 600; }
.referral__stats b { color: var(--lime); }

.dash-table { width: 100%; border-collapse: collapse; }
.dash-table th { text-align: left; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: var(--slate-400); padding: 10px 12px; border-bottom: 2px solid var(--slate-100); }
.dash-table td { padding: 14px 12px; border-bottom: 1px solid var(--slate-100); font-size: 13px; font-weight: 600; color: var(--slate-700); }
.dash-table tr:last-child td { border-bottom: none; }
.dash-table .amt { font-family: var(--font-serif); font-weight: 900; color: var(--navy); }
.pay-pill { font-size: 9.5px; font-weight: 900; text-transform: uppercase; padding: 4px 9px; border-radius: var(--r-pill); }
.pay-pill--paid { background: var(--lime-soft); color: var(--navy); }
.pay-pill--pending { background: #fef3c7; color: #92400e; }
.inv-link { color: var(--blue); font-weight: 800; font-size: 12px; display: inline-flex; align-items: center; gap: 4px; }
.inv-link:hover { color: var(--navy); }