/* Tech-It design system — replaces the Lovable/Tailwind export. */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');

:root{
  --ink:#14181c;
  --ink-soft:#3d444b;
  --muted:#68716b;
  --bg:#ffffff;
  --bg-alt:#f3f5f2;
  --surface:#ffffff;
  --border:#dde2dc;
  --border-strong:#c3cbc2;
  --header-bg:#0e120f;
  --header-border:#242a24;

  --accent:#0b6b52;
  --accent-dark:#084d3b;
  --accent-light:#e3f2ec;
  --accent-ink:#06392c;

  --warn:#a35b0a;
  --warn-bg:#fbf0df;
  --warn-border:#eccfa0;

  --danger:#b3261e;
  --danger-bg:#fbecea;
  --danger-border:#edc3c0;

  --info:#25588f;
  --info-bg:#eaf1fa;
  --info-border:#c6dbf0;

  --radius:10px;
  --radius-sm:6px;
  --shadow-sm:0 1px 2px rgba(18,22,18,.06);
  --shadow-md:0 8px 24px rgba(18,22,18,.09);

  --font-display:'Sora',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
html, body{ height:100%; }
body{
  font-family:var(--font-body);
  color:var(--ink-soft);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  overflow-x:hidden;
}

/* Sticky footer: header + footer keep their own height, .site-content
   grows to fill whatever is left so the footer never floats mid-page
   on short pages, and still sits after the content on long ones. */
.site-header, .site-footer{ flex-shrink:0; }
.site-content{ flex:1 0 auto; display:flex; flex-direction:column; width:100%; }
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  color:var(--ink);
  font-weight:700;
  letter-spacing:-0.01em;
  line-height:1.2;
}
a{ color:var(--accent); }
a:hover{ color:var(--accent-dark); }
a.text-decoration-none, .text-decoration-none{ text-decoration:none; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
::selection{ background:var(--accent-light); color:var(--accent-ink); }
code, .mono{ font-family:var(--font-mono); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- layout helpers ---------- */
.container{ max-width:1160px; }
.section{ padding:4.5rem 0; }
.section-alt{ background:var(--bg-alt); }
.section-head{ max-width:42rem; margin-bottom:2.75rem; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.eyebrow{
  font-family:var(--font-mono); font-size:.75rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); font-weight:600; margin-bottom:.6rem; display:block;
}
.section-head h2{ font-size:clamp(1.75rem,3.2vw,2.4rem); margin-bottom:.75rem; }
.section-head p{ color:var(--muted); font-size:1.05rem; }

/* ---------- buttons ---------- */
.btn{
  font-family:var(--font-body); font-weight:600; font-size:.92rem;
  border-radius:var(--radius-sm); padding:.62rem 1.2rem; border:1px solid transparent;
  transition:background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  box-shadow:none;
}
.btn:focus{ box-shadow:none; }
.btn-primary, .btn-success{ background:var(--accent); border-color:var(--accent); color:#fff; }
.btn-primary:hover, .btn-success:hover{ background:var(--accent-dark); border-color:var(--accent-dark); color:#fff; }
.btn-danger{ background:#fff; border-color:var(--danger-border); color:var(--danger); }
.btn-danger:hover{ background:var(--danger-bg); border-color:var(--danger); color:var(--danger); }
.btn-info{ background:#fff; border-color:var(--info-border); color:var(--info); }
.btn-info:hover{ background:var(--info-bg); border-color:var(--info); color:var(--info); }
.btn-warning{ background:var(--warn); border-color:var(--warn); color:#fff; }
.btn-warning:hover{ background:#8a4a08; border-color:#8a4a08; color:#fff; }
.btn-secondary{ background:#fff; border-color:var(--border-strong); color:var(--ink-soft); }
.btn-secondary:hover{ background:var(--bg-alt); border-color:var(--border-strong); color:var(--ink); }
.btn-outline-light{ background:transparent; border-color:rgba(255,255,255,.4); color:#fff; }
.btn-outline-light:hover{ background:rgba(255,255,255,.12); border-color:#fff; color:#fff; }
.btn-ghost{ background:transparent; border-color:transparent; color:var(--accent); padding:.5rem .6rem; }
.btn-ghost:hover{ background:var(--accent-light); }
.btn-lg{ padding:.85rem 1.7rem; font-size:1.02rem; }
.btn-sm{ padding:.4rem .75rem; font-size:.82rem; }
.btn-block{ width:100%; }
.btn .icon{ width:1em; height:1em; }

/* ---------- alerts / messages ---------- */
.alert{ border-radius:var(--radius-sm); border:1px solid; padding:.85rem 1.1rem; font-size:.92rem; }
.alert-success{ background:var(--accent-light); border-color:#bfe0d3; color:var(--accent-ink); }
.alert-danger{ background:var(--danger-bg); border-color:var(--danger-border); color:var(--danger); }
.alert-warning{ background:var(--warn-bg); border-color:var(--warn-border); color:var(--warn); }
.alert-info{ background:var(--info-bg); border-color:var(--info-border); color:var(--info); }
.toast-stack{ position:fixed; top:1rem; right:1rem; left:1rem; z-index:1200; display:flex; flex-direction:column; align-items:flex-end; gap:.5rem; }
.toast-stack .alert{ width:100%; max-width:22rem; box-shadow:var(--shadow-md); background-color:var(--surface); }
.btn-close{ filter:none; opacity:.55; }
.btn-close:hover{ opacity:1; }

/* ---------- forms ---------- */
label, .form-label{ font-weight:600; font-size:.86rem; color:var(--ink); margin-bottom:.35rem; }
.form-control, .form-select{
  font-family:var(--font-body); border:1px solid var(--border-strong); border-radius:var(--radius-sm);
  padding:.6rem .8rem; font-size:.94rem; color:var(--ink); background:#fff;
}
.form-control:focus, .form-select:focus{
  border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-light); outline:none;
}
.form-control[readonly]{ background:var(--bg-alt); color:var(--muted); }
.form-control::placeholder{ color:#9aa39c; }
.form-check-input{ border-color:var(--border-strong); }
.form-check-input:checked{ background-color:var(--accent); border-color:var(--accent); }
.asteriskField{ color:var(--danger); margin-left:.15rem; }
.invalid-feedback, ul.text-danger{ color:var(--danger); font-size:.83rem; }
.helptext{ color:var(--muted); font-size:.8rem; }
.field-note{ color:var(--muted); font-size:.82rem; margin-top:.35rem; }
.search-form{ display:flex; gap:.6rem; margin-bottom:1.2rem; max-width:24rem; }
.search-form .form-control{ flex:1; min-width:0; }

/* ---------- cards / tables ---------- */
.card{ border:1px solid var(--border); border-radius:var(--radius); box-shadow:none; }
.card-header{ background:var(--bg-alt); border-bottom:1px solid var(--border); font-family:var(--font-display); font-weight:700; color:var(--ink); padding:.9rem 1.15rem; font-size:1rem; }
.card-body{ padding:1.15rem; }

.table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--border); border-radius:var(--radius); }
table{ width:100%; min-width:max-content; border-collapse:collapse; font-size:.92rem; background:#fff; }
table thead th{
  text-align:left; background:var(--bg-alt); color:var(--muted); font-weight:600; font-size:.74rem;
  text-transform:uppercase; letter-spacing:.05em; padding:.7rem .9rem; border-bottom:1px solid var(--border);
  white-space:nowrap;
}
table td{ padding:.75rem .9rem; border-bottom:1px solid var(--border); vertical-align:middle; white-space:nowrap; }
table td.wrap{ white-space:normal; }
table tbody tr:last-child td{ border-bottom:none; }
table tbody tr:hover{ background:var(--bg-alt); }
.table-bordered td, .table-bordered th{ border:1px solid var(--border); }

.list-group-item{ border-color:var(--border); padding:.9rem 1rem; }
.list-group-item:first-child{ border-top-left-radius:var(--radius); border-top-right-radius:var(--radius); }
.list-group-item:last-child{ border-bottom-left-radius:var(--radius); border-bottom-right-radius:var(--radius); }

/* ---------- badges / pills ---------- */
.badge{ font-family:var(--font-mono); font-weight:600; font-size:.72rem; padding:.3rem .6rem; border-radius:999px; letter-spacing:.02em; }
.badge-active{ background:var(--accent-light); color:var(--accent-ink); }
.badge-pending{ background:var(--warn-bg); color:var(--warn); }
.badge-expired, .badge-failed{ background:var(--danger-bg); color:var(--danger); }
.badge-neutral{ background:var(--bg-alt); color:var(--muted); }
.pill{ display:inline-flex; align-items:center; gap:.3rem; background:var(--bg-alt); border:1px solid var(--border); color:var(--ink-soft); font-size:.76rem; font-weight:600; padding:.22rem .6rem; border-radius:999px; }

/* ---------- icon sprite ---------- */
.icon{ width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

/* ================= SITE HEADER ================= */
.site-header{ background:var(--header-bg); border-bottom:1px solid var(--header-border); position:sticky; top:0; z-index:80; }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; height:66px; }
.brand{ display:flex; align-items:center; gap:.55rem; text-decoration:none; }
.brand-mark{ width:32px; height:32px; border-radius:8px; background:var(--accent); display:flex; align-items:center; justify-content:center; }
.brand-mark .icon{ width:18px; height:18px; stroke:#fff; }
.brand-name{ font-family:var(--font-display); font-weight:800; font-size:1.28rem; color:#fff; letter-spacing:-0.01em; }
.nav-actions{ display:flex; align-items:center; gap:.75rem; }
.nav-link{ color:rgba(255,255,255,.75); font-weight:500; font-size:.92rem; text-decoration:none; padding:.4rem .2rem; }
.nav-link:hover{ color:#fff; }
.account-menu{ position:relative; }
.account-btn{
  width:38px; height:38px; border-radius:50%; background:var(--accent); color:#fff; border:none;
  font-family:var(--font-display); font-weight:700; font-size:.95rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.account-btn:hover{ background:var(--accent-dark); }
.dropdown-menu{ border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-md); padding:.4rem; margin-top:.5rem !important; }
.dropdown-item{ border-radius:var(--radius-sm); padding:.55rem .7rem; font-size:.88rem; display:flex; align-items:center; gap:.55rem; color:var(--ink-soft); }
.dropdown-item .icon{ width:16px; height:16px; color:var(--muted); }
.dropdown-item:hover, .dropdown-item:focus{ background:var(--accent-light); color:var(--accent-ink); }
.dropdown-item:hover .icon{ color:var(--accent-ink); }
.dropdown-divider{ margin:.4rem 0; border-color:var(--border); }

/* ================= HERO ================= */
.hero{ background:var(--header-bg); color:#fff; padding:4.5rem 0 5rem; }
.hero .container{ display:grid; grid-template-columns:1.15fr .85fr; gap:3.5rem; align-items:center; }
.hero h1{ color:#fff; font-size:clamp(2.2rem,4.4vw,3.3rem); text-wrap:balance; margin-bottom:1.1rem; }
.hero h1 em{ font-style:normal; color:#7fd9bd; }
.hero p.lede{ color:rgba(255,255,255,.75); font-size:1.12rem; max-width:34rem; margin-bottom:2rem; }
.hero-actions{ display:flex; gap:.9rem; flex-wrap:wrap; margin-bottom:2.5rem; }
.hero-facts{ display:flex; flex-direction:column; gap:.9rem; }
.hero-fact{ display:flex; align-items:center; gap:.7rem; color:rgba(255,255,255,.85); font-size:.94rem; }
.hero-fact .icon{ color:#7fd9bd; }
.hero-card{ background:#161c17; border:1px solid #263026; border-radius:var(--radius); padding:1.75rem; }
.hero-card h3{ color:#fff; font-size:1.05rem; margin-bottom:1rem; }
.hero-card-row{ display:flex; align-items:flex-start; gap:.7rem; padding:.6rem 0; border-bottom:1px solid #263026; }
.hero-card-row:last-child{ border-bottom:none; }
.hero-card-row .icon{ color:#7fd9bd; margin-top:.15rem; }
.hero-card-row strong{ color:#fff; display:block; font-size:.9rem; }
.hero-card-row span{ color:rgba(255,255,255,.6); font-size:.83rem; }

@media (max-width:900px){
  .hero .container{ grid-template-columns:1fr; }
}

/* ================= COURSE GRID ================= */
.course-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.5rem; }
.course-card{ border:1px solid var(--border); border-radius:var(--radius); background:#fff; padding:1.6rem; display:flex; flex-direction:column; transition:box-shadow .15s ease, border-color .15s ease; }
.course-card:hover{ box-shadow:var(--shadow-md); border-color:var(--border-strong); }
.course-card h3{ font-size:1.2rem; margin-bottom:.35rem; }
.course-card .tutor-line{ color:var(--muted); font-size:.87rem; margin-bottom:1.1rem; }
.course-card .price{ font-family:var(--font-mono); font-size:1.55rem; font-weight:600; color:var(--ink); margin-bottom:1.3rem; font-variant-numeric:tabular-nums; }
.course-card .price small{ font-family:var(--font-body); font-weight:500; font-size:.8rem; color:var(--muted); }
.course-card .btn{ margin-top:auto; }
.empty-note{ color:var(--muted); text-align:center; padding:2.5rem 0; grid-column:1/-1; }

/* ================= FEATURES ================= */
.feature-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.4rem; }
.feature-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:1.6rem; }
.feature-card .icon-wrap{ width:44px; height:44px; border-radius:10px; background:var(--accent-light); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; }
.feature-card .icon-wrap .icon{ color:var(--accent); }
.feature-card h3{ font-size:1.05rem; margin-bottom:.5rem; }
.feature-card p{ color:var(--muted); font-size:.92rem; margin:0; }

/* ================= TESTIMONIALS ================= */
.testimonial-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.5rem; }
.testimonial{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:1.6rem; display:flex; flex-direction:column; }
.testimonial .icon{ color:var(--border-strong); width:26px; height:26px; margin-bottom:.85rem; }
.testimonial p{ color:var(--ink-soft); font-size:.93rem; flex:1; margin-bottom:1.2rem; }
.testimonial-who{ display:flex; align-items:center; gap:.7rem; }
.testimonial-avatar{ width:36px; height:36px; border-radius:50%; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:.9rem; flex-shrink:0; }
.testimonial-who strong{ font-size:.88rem; color:var(--ink); }

/* ================= CTA BAND ================= */
.cta-band{ background:var(--accent); color:#fff; border-radius:var(--radius); padding:2.75rem; text-align:center; }
.cta-band h3{ color:#fff; font-size:1.6rem; margin-bottom:.6rem; }
.cta-band p{ color:rgba(255,255,255,.85); max-width:34rem; margin:0 auto 1.6rem; }
.social-row{ display:flex; justify-content:center; gap:.6rem; margin-top:1.6rem; }
.social-row a{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.14); display:flex; align-items:center; justify-content:center; color:#fff; }
.social-row a:hover{ background:rgba(255,255,255,.24); }

/* ================= CONTACT CARDS ================= */
.contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.2rem; }
.contact-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:1.4rem; text-align:center; }
.contact-card .icon-wrap{ width:40px; height:40px; border-radius:50%; background:var(--accent-light); display:flex; align-items:center; justify-content:center; margin:0 auto .8rem; }
.contact-card .icon-wrap .icon{ color:var(--accent); width:18px; height:18px; }
.contact-card h3{ font-size:.95rem; margin-bottom:.3rem; }
.contact-card .lead-line{ color:var(--accent); font-weight:600; font-size:.9rem; margin-bottom:.15rem; }
.contact-card .sub-line{ color:var(--muted); font-size:.8rem; }

/* ================= FOOTER ================= */
.site-footer{ background:var(--header-bg); color:rgba(255,255,255,.7); padding:3.5rem 0 2rem; }
.site-footer .brand-name{ color:#fff; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2.5rem; margin-bottom:2.5rem; }
.footer-grid p{ color:rgba(255,255,255,.55); font-size:.9rem; margin:1rem 0 1.2rem; max-width:26rem; }
.footer-contact{ display:flex; flex-direction:column; gap:.55rem; font-size:.86rem; }
.footer-contact div{ display:flex; align-items:flex-start; gap:.55rem; }
.footer-contact .icon{ width:16px; height:16px; margin-top:.15rem; color:#7fd9bd; }
.footer-col h3{ color:#fff; font-size:.86rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:1rem; }
.footer-col ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.6rem; font-size:.88rem; }
.footer-col a{ color:rgba(255,255,255,.65); text-decoration:none; }
.footer-col a:hover{ color:#fff; }
.footer-bottom{ border-top:1px solid var(--header-border); padding-top:1.6rem; text-align:center; font-size:.82rem; color:rgba(255,255,255,.45); }
@media (max-width:800px){ .footer-grid{ grid-template-columns:1fr; } }

/* ================= AUTH PAGES ================= */
.auth-shell{ flex:1; width:100%; display:flex; align-items:center; justify-content:center; padding:3.5rem 1rem; background:var(--bg-alt); }
.auth-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:2.2rem; width:100%; max-width:26rem; }
.auth-card h1{ font-size:1.5rem; margin-bottom:.3rem; }
.auth-card .auth-sub{ color:var(--muted); font-size:.9rem; margin-bottom:1.5rem; }
.auth-card .field{ margin-bottom:1.1rem; }
.auth-card .field label{ display:block; }
.auth-card form input{ width:100%; }
.auth-foot{ margin-top:1.3rem; text-align:center; font-size:.87rem; color:var(--muted); }
.auth-foot a{ font-weight:600; }
.auth-links{ display:flex; justify-content:space-between; margin-top:.8rem; font-size:.85rem; }

/* ================= PAGE HEADER (app pages) ================= */
.page-header{ display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:1.8rem; }
.page-header h1{ font-size:1.55rem; margin-bottom:.25rem; }
.page-header p{ color:var(--muted); margin:0; font-size:.92rem; }

/* ================= APP SHELL (dashboards) ================= */
.app-shell{ display:flex; align-items:flex-start; max-width:1160px; margin:0 auto; padding:2rem 1.5rem 4rem; gap:2.25rem; }
.app-sidebar{ width:230px; flex-shrink:0; position:sticky; top:90px; }
.app-sidebar-card{ background:var(--bg-alt); border:1px solid var(--border); border-radius:var(--radius); padding:.65rem; }
.app-sidebar nav{ display:flex; flex-direction:column; gap:.15rem; }
.app-sidebar a{ display:flex; align-items:center; gap:.6rem; padding:.6rem .7rem; border-radius:var(--radius-sm); color:var(--ink-soft); font-weight:500; font-size:.9rem; text-decoration:none; }
.app-sidebar a .icon{ width:17px; height:17px; color:var(--muted); }
.app-sidebar a:hover{ background:#fff; color:var(--ink); }
.app-sidebar a.active{ background:var(--accent); color:#fff; }
.app-sidebar a.active .icon{ color:#fff; }
.app-main{ flex:1; min-width:0; }
@media (max-width:860px){
  .app-shell{ flex-direction:column; padding:1.25rem 1rem 3rem; }
  .app-sidebar{ width:100%; position:static; }
  .app-sidebar nav{ flex-direction:row; overflow-x:auto; gap:.4rem; }
  .app-sidebar a{ white-space:nowrap; }
}

/* ================= WORK ITEM ROWS (assignments/meetings) ================= */
.work-list{ display:flex; flex-direction:column; gap:.7rem; }
.work-item{ display:flex; align-items:center; justify-content:space-between; gap:1rem; background:#fff; border:1px solid var(--border); border-radius:var(--radius-sm); padding:.9rem 1.1rem; flex-wrap:wrap; }
.work-item-main strong{ display:block; color:var(--ink); font-size:.95rem; margin-bottom:.15rem; }
.work-item-main span{ color:var(--muted); font-size:.82rem; }
.work-item-actions{ display:flex; gap:.5rem; flex-wrap:wrap; flex-shrink:0; }
.status-done{ color:var(--accent-ink); background:var(--accent-light); font-size:.78rem; font-weight:600; padding:.35rem .75rem; border-radius:999px; display:inline-flex; align-items:center; gap:.35rem; }
.status-done .icon{ width:14px; height:14px; }

.empty-state{ text-align:center; padding:2.5rem 1rem; color:var(--muted); background:var(--bg-alt); border:1px dashed var(--border-strong); border-radius:var(--radius); font-size:.9rem; }

/* ================= PROFILE ================= */
.profile-shell{ max-width:640px; margin:0 auto; padding:3rem 1.5rem 4rem; }
.profile-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:2rem; }
.profile-avatar-row{ display:flex; align-items:center; gap:1.2rem; margin-bottom:1.8rem; }
.avatar-circle{ width:72px; height:72px; border-radius:50%; object-fit:cover; background:var(--accent-light); display:flex; align-items:center; justify-content:center; }
.avatar-circle .icon{ width:30px; height:30px; color:var(--accent); }
.field-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field-grid .field.full{ grid-column:1/-1; }
@media (max-width:560px){ .field-grid{ grid-template-columns:1fr; } }
.readonly-row{ display:flex; justify-content:space-between; padding:.6rem 0; border-bottom:1px solid var(--border); font-size:.9rem; }
.readonly-row:last-child{ border-bottom:none; }
.readonly-row span:first-child{ color:var(--muted); }
.readonly-row span:last-child{ color:var(--ink); font-weight:600; }

/* ================= 404 / EMPTY PAGES ================= */
.status-page{ flex:1; width:100%; display:flex; align-items:center; justify-content:center; text-align:center; padding:4rem 1.5rem; }
.status-page .code{ font-family:var(--font-mono); font-size:1rem; color:var(--accent); font-weight:600; letter-spacing:.05em; margin-bottom:.6rem; }
.status-page h1{ font-size:2rem; margin-bottom:.7rem; }
.status-page p{ color:var(--muted); margin-bottom:1.6rem; max-width:28rem; }

/* ================= SUBSCRIPTION LOCKED ================= */
.locked-shell{ max-width:34rem; margin:0 auto; padding:4rem 1.5rem; text-align:center; }
.locked-icon{ width:56px; height:56px; border-radius:50%; background:var(--warn-bg); display:flex; align-items:center; justify-content:center; margin:0 auto 1.3rem; }
.locked-icon .icon{ color:var(--warn); width:26px; height:26px; }
.locked-list{ list-style:none; padding:0; margin:1.4rem 0; display:inline-flex; flex-direction:column; gap:.5rem; text-align:left; }
.locked-list li{ display:flex; align-items:center; gap:.6rem; color:var(--muted); font-size:.9rem; }
.locked-list .icon{ color:var(--danger); width:16px; height:16px; }