/* =========================================================================
   ResumeForge AI — clean "sky" identity
   Palette:  white #ffffff  mist #f2f7fc  sky #9674E3  sky-deep #6F41D8
             ink #111113 (brand black)  line #e2e2e5  signal #1f7a4d (success only)
   Type:     Montserrat (brand face, matches the logo); mono -> IBM Plex Mono
   Goal:     high contrast, large tap targets, comfortable for all ages.
   ========================================================================= */

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

:root {
  /* Palette aligned to the AIR3 badge: black AIR3 wordmark on white, with the
     purple ring as the interactive/brand accent. Text stays ink-black to match
     the logo; purple carries hovers, active states and highlights. */
  --white:   #ffffff;
  --mist:    #f6f6f7;   /* app background */
  --mist-2:  #ececee;
  --brand:      #9674E3;   /* AIR3 ring purple — primary brand accent */
  --brand-deep: #6F41D8;   /* deeper purple for hover / emphasis / on-white text */
  --brand-soft: #F1EDFB;   /* light purple tint for fills/backgrounds */
  --sky:     #9674E3;   /* accent = brand purple (was near-black) */
  --sky-deep:#6F41D8;   /* hover / emphasis = deeper purple */
  --sky-soft:#F1EDFB;   /* tint fills = light purple */
  --ink:     #111113;   /* text (matches black AIR3 wordmark) */
  --ink-2:   #35363a;
  --body:    #4a4b50;
  --line:    #e2e2e5;   /* hairline borders */
  --signal:  #1f7a4d;   /* success only (kept for correct/incorrect states) */
  --danger:  #b3261e;
  --muted:   #8a8b91;
  --accent:  #9674E3;   /* interactive accent = brand purple (was orange) */
  --radius:  12px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
  background: var(--white);
  color: var(--ink);
  line-height: 1.6;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}

/* ---- Typography ---- */
h1,h2,h3 { font-family:'Montserrat', system-ui, -apple-system, sans-serif; font-weight:600; line-height:1.2; margin:0; color:var(--ink); letter-spacing:-0.01em; }
.mono { font-family:'IBM Plex Mono', monospace; }
.eyebrow {
  font-family:'IBM Plex Mono', monospace; font-size:12px; letter-spacing:2px;
  text-transform:uppercase; color:var(--sky-deep); font-weight:500;
}

a { color:var(--sky-deep); text-decoration:none; font-weight:500; }
a:hover { text-decoration:underline; }

/* ---- Layout ---- */
.container { max-width:1160px; margin:0 auto; padding:0 20px; }

/* ---- Top nav ---- */
.nav {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 20px; border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:40; backdrop-filter:blur(8px);
  background:rgba(255,255,255,.9);
}
.brand { display:flex; align-items:center; gap:10px; font-family:'Montserrat'; font-weight:700; font-size:19px; color:var(--ink); }
.brand .mark {
  width:30px; height:30px; border-radius:8px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--sky),var(--sky-deep));
  color:#fff; font-weight:700; font-family:'IBM Plex Mono';
}
.nav .right { display:flex; align-items:center; gap:14px; font-size:15px; }
.nav .right a { color:var(--body); }
.pill {
  font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1px; text-transform:uppercase;
  padding:5px 11px; border-radius:20px; border:1px solid var(--line); color:var(--muted); background:var(--white);
}
.pill.tier-professional { color:var(--sky-deep); border-color:var(--sky); background:var(--sky-soft); }
.pill.tier-pro_max { color:var(--signal); border-color:var(--signal); background:#e4f6f0; }

/* ---- Buttons ---- */
.btn {
  font-family:'Montserrat'; font-weight:600; font-size:15px;
  padding:13px 22px; border-radius:var(--radius); border:1.5px solid transparent;
  cursor:pointer; transition:.15s ease; display:inline-flex; align-items:center; gap:8px;
}
.btn-primary { background:var(--sky); color:#fff; box-shadow:none; }
.btn-primary:hover { background:var(--sky-deep); box-shadow:none; }
.btn-ghost { background:var(--white); border-color:var(--line); color:var(--ink); }
.btn-ghost:hover { border-color:var(--sky); color:var(--sky-deep); }
.btn-block { width:100%; justify-content:center; }
.btn:disabled { opacity:.5; cursor:not-allowed; box-shadow:none; }
.btn-sm { padding:9px 15px; font-size:14px; }
.btn:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible,
select:focus-visible { outline:3px solid var(--sky-soft); outline-offset:2px; }

/* ---- Cards / panels ---- */
.panel {
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:24px; box-shadow:0 1px 3px rgba(20,40,61,.04);
}
.panel + .panel { margin-top:16px; }

/* ---- Hero ---- */
.hero { padding:76px 0 48px; position:relative; text-align:center; }
.hero .eyebrow { display:block; }
.hero h1 { font-size:clamp(36px, 6vw, 62px); letter-spacing:-1px; }
.hero .accent-word { color:var(--sky-deep); }
.hero p.lead { font-size:19px; color:var(--body); max-width:600px; margin:20px auto 30px; }
.hero .cta-row { display:flex; gap:14px; flex-wrap:wrap; justify-content:center; }
.hero .blueprint-tag {
  font-family:'IBM Plex Mono'; font-size:13px; color:var(--muted);
  margin-top:30px;
}

/* ---- Tier grid ---- */
.tiers { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:12px; }
.tier {
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px; display:flex; flex-direction:column; position:relative; overflow:hidden;
  box-shadow:0 1px 3px rgba(20,40,61,.04);
}
.tier.featured { border-color:var(--sky); border-width:2px; box-shadow:0 8px 28px rgba(150,116,227,.16); }
.tier.featured::before {
  content:'MOST POPULAR'; position:absolute; top:16px; right:-32px; transform:rotate(45deg);
  background:var(--sky); color:#fff; font-family:'IBM Plex Mono'; font-size:9px;
  letter-spacing:1px; padding:4px 42px;
}
.tier .t-name { font-family:'Montserrat'; font-weight:700; font-size:21px; }
.tier .t-price { font-size:36px; font-family:'Montserrat'; font-weight:700; margin:10px 0 2px; color:var(--ink); }
.tier .t-price small { font-size:15px; color:var(--muted); font-weight:500; }
.tier ul { list-style:none; padding:0; margin:18px 0 22px; flex:1; }
.tier li { font-size:15px; padding:8px 0; border-bottom:1px solid var(--line); color:var(--body); }
.tier li::before { content:'\2713  '; color:var(--sky); font-weight:700; }
.tier li.off { color:var(--muted); }
.tier li.off::before { content:'\2013  '; color:var(--muted); }

/* ---- Forms ---- */
label.field { display:block; margin:16px 0 6px; font-size:14px; color:var(--ink); font-weight:600; }
input[type=text], input[type=email], input[type=tel], input[type=url], textarea, select {
  width:100%; background:var(--white); border:1.5px solid var(--line); border-radius:10px;
  color:var(--ink); font-family:'Montserrat'; font-size:15px; padding:12px 13px; transition:.15s;
}
input::placeholder, textarea::placeholder { color:#93a2b5; }
input:focus, textarea:focus, select:focus { outline:none; border-color:var(--sky); box-shadow:0 0 0 3px var(--sky-soft); }
textarea { resize:vertical; min-height:110px; }
.otp-input {
  letter-spacing:14px; font-family:'IBM Plex Mono'; font-size:26px; text-align:center;
}
.hint { font-size:13px; color:var(--muted); margin-top:6px; }

/* ---- Modal ---- */
.modal-backdrop {
  position:fixed; inset:0; background:rgba(20,40,61,.42); backdrop-filter:blur(3px);
  display:none; align-items:center; justify-content:center; z-index:60; padding:20px;
}
.modal-backdrop.show { display:flex; }
.modal {
  background:var(--white); border:1px solid var(--line); border-radius:16px;
  padding:30px; width:100%; max-width:440px; animation:pop .18s ease; box-shadow:0 20px 60px rgba(20,40,61,.25);
}
@keyframes pop { from{transform:scale(.96);opacity:0} to{transform:scale(1);opacity:1} }
.modal h3 { font-size:23px; margin-bottom:4px; }
.modal .close { float:right; cursor:pointer; color:var(--muted); font-size:24px; line-height:1; }

/* ---- Builder layout ---- */
.builder { display:grid; grid-template-columns:340px 1fr; gap:22px; padding:26px 0; align-items:start; }
.builder .sidebar { position:sticky; top:82px; }
.section-block { border-top:1px solid var(--line); padding-top:16px; margin-top:16px; }
.section-block:first-child { border-top:0; margin-top:0; padding-top:0; }
.row-flex { display:flex; gap:8px; }
.row-flex > * { flex:1; }
.chip {
  display:inline-flex; align-items:center; gap:6px; background:var(--sky-soft);
  border:1px solid var(--sky); border-radius:20px; padding:6px 12px; font-size:14px; margin:3px; color:var(--sky-deep);
}
.chip button { background:none; border:0; color:var(--sky-deep); cursor:pointer; font-size:15px; }

/* ---- Guest export banner ---- */
.export-note {
  display:flex; align-items:center; gap:10px; background:var(--sky-soft);
  border:1px solid var(--sky); border-radius:10px; padding:12px 14px; margin-top:14px;
  font-size:14px; color:var(--sky-deep);
}
.export-note b { color:var(--ink); }

/* ---- ATS score dial ---- */
.ats { display:flex; align-items:center; gap:18px; }
.dial {
  --v:0; width:88px; height:88px; border-radius:50%; flex:none;
  background:conic-gradient(var(--signal) calc(var(--v)*1%), var(--line) 0);
  display:grid; place-items:center; position:relative;
}
.dial::before { content:''; position:absolute; inset:8px; border-radius:50%; background:var(--white); }
.dial span { position:relative; font-family:'Montserrat'; font-weight:700; font-size:26px; color:var(--ink); }
.kw { font-family:'IBM Plex Mono'; font-size:13px; padding:4px 9px; border-radius:6px; margin:2px; display:inline-block; }
.kw.match { background:#e4f6f0; color:var(--signal); }
.kw.miss  { background:#fbe6e3; color:var(--danger); }

/* ---- Preview ---- */
.preview-doc {
  background:#fff; color:#1a1a1a; border-radius:8px; padding:34px 40px;
  font-family:Georgia, serif; box-shadow:0 8px 30px rgba(20,40,61,.12); border:1px solid var(--line);
  position:relative;
}
.preview-doc.guarded::after {
  content:'PREVIEW'; position:absolute; inset:0; pointer-events:none;
  display:grid; place-items:center; font-family:'Montserrat';
  font-size:64px; font-weight:700; color:rgba(150,116,227,.07);
  transform:rotate(-24deg); letter-spacing:8px; z-index:1;
}
.preview-doc h1 { font-family:Georgia, serif; font-size:24px; }
.preview-doc .p-role { font-style:italic; color:#444; font-size:14px; }
.preview-doc .p-meta { font-size:12px; color:#333; margin-top:2px; }
.preview-doc hr { border:0; border-top:2px solid #1a1a1a; margin:12px 0; }
.preview-doc h2 { font-family:Georgia, serif; font-size:13px; text-transform:uppercase;
  letter-spacing:1.5px; border-bottom:1px solid #bbb; margin:16px 0 6px; }
.preview-doc .p-item { margin-bottom:8px; }
.preview-doc .p-top { display:flex; justify-content:space-between; font-size:13px; font-weight:bold; }
.preview-doc ul { margin:3px 0; padding-left:18px; }
.preview-doc li { font-size:12.5px; }

/* blur overlay when tab loses focus (deters screenshots of finished doc) */
.blur-shield {
  position:fixed; inset:0; background:rgba(242,247,252,.86); backdrop-filter:blur(14px);
  z-index:110; display:none; align-items:center; justify-content:center; text-align:center; padding:24px;
}
.blur-shield.show { display:flex; }
.blur-shield .msg { max-width:360px; }
.blur-shield h3 { font-size:22px; margin-bottom:8px; }
.blur-shield p { color:var(--body); }

/* ---- No-select region ---- */
.noselect {
  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;
  -webkit-touch-callout:none;
}
.noselect input, .noselect textarea, .noselect select {
  -webkit-user-select:text; -moz-user-select:text; -ms-user-select:text; user-select:text;
}

/* ---- Toast ---- */
.toast {
  position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px);
  background:var(--white); border:1px solid var(--line); border-left:4px solid var(--sky);
  border-radius:10px; padding:13px 20px; font-size:15px; opacity:0; pointer-events:none;
  transition:.25s; z-index:120; max-width:90vw; box-shadow:0 8px 28px rgba(20,40,61,.18); color:var(--ink);
}
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
.toast.ok { border-left-color:var(--signal); }
.toast.err { border-left-color:var(--danger); }

/* ---- Utility ---- */
.muted { color:var(--muted); }
.center { text-align:center; }
.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}
.flex-between{display:flex;justify-content:space-between;align-items:center}
.hide{display:none !important;}
footer.site { border-top:1px solid var(--line); padding:28px 0; color:var(--muted); font-size:14px; margin-top:40px; background:var(--white); }

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .tiers { grid-template-columns:1fr; }
  .builder { grid-template-columns:1fr; }
  .builder .sidebar { position:static; }
}
@media (max-width: 560px) {
  .hero { padding:52px 0 34px; }
  .nav .right .hide-sm { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  * { animation:none !important; transition:none !important; }
}

/* ===== Consent (DPDP + GDPR) ===== */
.consent-backdrop {
  position:fixed; inset:0; background:rgba(20,40,61,.28); z-index:130;
  display:none;
}
.consent-backdrop.show { display:block; }
.consent {
  position:fixed; left:50%; bottom:22px; transform:translateX(-50%);
  width:min(680px, calc(100% - 32px)); z-index:131;
  background:var(--white); border:1px solid var(--line); border-radius:16px;
  box-shadow:0 18px 50px rgba(20,40,61,.25); padding:22px 24px;
}
.consent h3 { font-size:19px; margin:0 0 6px; }
.consent p { font-size:14px; color:var(--body); margin:0; }
.consent-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; justify-content:flex-end; }
.consent-prefs { margin-top:16px; border-top:1px solid var(--line); padding-top:8px; }
.consent-row {
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px 0; border-bottom:1px solid var(--line);
}
.consent-row:last-of-type { border-bottom:0; }
.consent-row span { display:flex; flex-direction:column; }
.consent-row b { font-size:14px; color:var(--ink); }
.consent-row small { font-size:12.5px; color:var(--muted); margin-top:2px; }
.consent-row input[type=checkbox] { width:22px; height:22px; accent-color:var(--sky); flex:none; }
@media (max-width:560px) {
  .consent-actions { justify-content:stretch; }
  .consent-actions .btn { flex:1; }
}

/* ===== Content pages (About / Terms / Privacy) ===== */
.page { max-width:1160px; margin:0 auto; padding:40px 20px 20px; }
.page > * { max-width:760px; }
.page h1 { font-size:clamp(30px,5vw,44px); letter-spacing:-.5px; margin-bottom:6px; }
.page .updated { font-family:'IBM Plex Mono'; font-size:12px; color:var(--muted); letter-spacing:1px; text-transform:uppercase; margin-bottom:28px; }
.page h2 { font-size:22px; margin:30px 0 10px; color:var(--ink); }
.page h3 { font-size:17px; margin:20px 0 6px; color:var(--ink); }
.page p, .page li { font-size:16px; color:var(--body); line-height:1.7; }
.page ul { padding-left:22px; margin:8px 0; }
.page li { margin-bottom:6px; }
.page a { color:var(--sky-deep); }
.page .lead-p { font-size:18px; color:var(--ink-2); }
.page .callout {
  background:var(--sky-soft); border:1px solid var(--sky); border-radius:12px;
  padding:16px 18px; margin:20px 0; font-size:15px; color:var(--ink);
}
.page table.rights { width:100%; border-collapse:collapse; margin:14px 0; }
.page table.rights td { border:1px solid var(--line); padding:10px 12px; font-size:14.5px; vertical-align:top; }
.page table.rights td:first-child { font-weight:600; color:var(--ink); width:34%; }

/* footer links row */
footer.site .foot-links { display:flex; gap:18px; flex-wrap:wrap; }
footer.site .foot-links a { color:var(--body); font-size:14px; }
footer.site .foot-links a:hover { color:var(--sky-deep); }

/* clickable brand */
a.brand { text-decoration:none; }
a.brand:hover { text-decoration:none; }

/* ===== Guided stepper ===== */
.stepbar { position:sticky; top:60px; z-index:30; background:var(--mist); border-bottom:1px solid var(--line); padding:12px 0 0; }
.stepbar-inner { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.stepbar-progress { height:4px; background:var(--line); border-radius:4px; margin-top:12px; overflow:hidden; }
.stepbar-fill { height:100%; background:linear-gradient(90deg,var(--sky),var(--sky-deep)); width:16%; transition:width .3s ease; border-radius:4px; }

.step-head { margin-bottom:18px; }
.step-title { font-size:26px; margin:6px 0 6px; }
.step-hint { font-size:15px; color:var(--body); margin:0; }

/* left step list */
.steplist { list-style:none; counter-reset:s; margin:12px 0 0; padding:0; }
.steplist li {
  counter-increment:s; display:flex; align-items:center; gap:12px;
  padding:10px 0; font-size:14px; color:var(--muted); cursor:pointer; border-bottom:1px solid var(--line);
}
.steplist li:last-child { border-bottom:0; }
.steplist li::before {
  content:counter(s); width:26px; height:26px; flex:none; border-radius:50%;
  display:grid; place-items:center; font-family:'IBM Plex Mono'; font-size:13px;
  background:var(--white); border:1.5px solid var(--line); color:var(--muted);
}
.steplist li.active { color:var(--ink); font-weight:600; }
.steplist li.active::before { background:var(--sky); border-color:var(--sky); color:#fff; }
.steplist li.done::before { background:var(--signal); border-color:var(--signal); color:#fff; content:'✓'; }

/* step nav */
.step-nav { display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; justify-content:space-between; margin-top:16px; gap:12px; width:100%; }
.step-nav .btn { flex:0 0 auto; white-space:nowrap; }
.step-dots { display:flex; gap:7px; flex:1 1 auto; justify-content:center; }
.step-dots i { width:9px; height:9px; border-radius:50%; background:var(--line); display:block; }
.step-dots i.on { background:var(--sky); }
#btnBack:disabled { opacity:.35; }

/* pro tool cards */
.pro-card { background:var(--mist); border:1px solid var(--line); border-radius:12px; padding:18px; }

@media (max-width: 900px) {
  .stepbar { top:56px; }
  .sidebar #resumesPanel { display:none; }
}

/* ===== Saved resumes list ===== */
.resume-row { display:flex; align-items:stretch; gap:6px; border-bottom:1px solid var(--line); }
.resume-row:last-child { border-bottom:0; }
.resume-row-active { background:var(--sky-soft); border-radius:8px; }
.resume-open {
  flex:1 1 auto; text-align:left; background:none; border:0; cursor:pointer;
  padding:10px 8px; display:flex; flex-direction:column; gap:2px; border-radius:8px;
}
.resume-open:hover { background:var(--mist-2); }
.resume-title { font-size:14px; color:var(--ink); font-weight:600; }
.resume-date { font-size:11px; color:var(--muted); font-family:'IBM Plex Mono'; }
.resume-del {
  flex:0 0 auto; background:none; border:0; color:var(--muted); cursor:pointer;
  padding:0 8px; font-size:14px; border-radius:8px;
}
.resume-del:hover { color:var(--danger); background:#fbe6e3; }

#resumesPanel.flash { animation:flashPanel 1.2s ease; }
@keyframes flashPanel {
  0%, 100% { box-shadow:0 1px 3px rgba(20,40,61,.04); }
  30%      { box-shadow:0 0 0 3px var(--sky); }
}

/* ===== Welcome modal ===== */
.wl-backdrop {
  position:fixed; inset:0; z-index:150; display:flex; align-items:center; justify-content:center;
  background:rgba(20,40,61,.45); backdrop-filter:blur(4px); padding:18px;
}
.wl-backdrop[hidden] { display:none; }
.wl-card {
  background:#fff; width:100%; max-width:440px; border-radius:22px; padding:28px 26px 20px;
  box-shadow:0 24px 70px rgba(20,40,61,.3); animation:wlPop .25s ease; max-height:92vh; overflow:auto;
}
@keyframes wlPop { from{opacity:0;transform:translateY(10px) scale(.98)} to{opacity:1;transform:none} }
.wl-badge {
  display:inline-flex; align-items:center; gap:8px; background:var(--sky-soft); color:var(--sky-deep);
  font-family:'Montserrat'; font-weight:600; font-size:14px; padding:7px 14px; border-radius:20px;
}
.wl-dot { width:9px; height:9px; border-radius:50%; background:var(--sky); }
.wl-dots { display:flex; gap:6px; margin:18px 0 8px; }
.wl-dots i { width:8px; height:8px; border-radius:20px; background:var(--line); transition:.3s; }
.wl-dots i.on { background:var(--sky); width:22px; }
.wl-slide { padding:14px 0 4px; }
.wl-icon {
  width:64px; height:64px; border-radius:16px; background:var(--sky-soft);
  display:grid; place-items:center; font-size:32px; margin-bottom:16px;
}
.wl-card h2 { font-size:26px; line-height:1.2; margin:0 0 10px; }
.wl-card p { font-size:16px; color:var(--body); margin:0; line-height:1.6; }
.wl-list { list-style:none; padding:0; margin:8px 0 0; }
.wl-list li { font-size:15px; color:var(--body); padding:9px 0 9px 26px; position:relative; line-height:1.5; }
.wl-list li::before { content:'✓'; position:absolute; left:0; top:9px; color:var(--sky); font-weight:700; }
.wl-list b { color:var(--ink); }
.wl-wa {
  display:flex; align-items:center; justify-content:center; gap:10px; margin-top:18px;
  border:1.5px solid var(--line); border-radius:12px; padding:13px; font-weight:600;
  color:var(--ink); font-family:'Montserrat'; text-decoration:none;
}
.wl-wa:hover { border-color:#25D366; text-decoration:none; }
.wl-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:22px; }
.wl-actions .btn-primary { flex:1; justify-content:center; }
.wl-legal { text-align:center; font-size:12px; color:var(--muted); margin-top:14px; }
.wl-legal a { color:var(--muted); text-decoration:underline; }

/* ===== Spotlight tour ===== */
.tut-layer { position:fixed; inset:0; z-index:160; }
.tut-layer[hidden] { display:none; }
/* the greyed overlay is drawn with a giant box-shadow from the hole */
.tut-hole {
  position:absolute; border-radius:12px; box-shadow:0 0 0 9999px rgba(20,40,61,.62);
  transition:left .35s ease, top .35s ease, width .35s ease, height .35s ease;
  pointer-events:none;
}
.tut-pop {
  position:absolute; background:#fff; border-radius:16px; padding:18px 20px; width:min(340px, calc(100vw - 24px));
  box-shadow:0 16px 44px rgba(20,40,61,.28); transition:top .35s ease, left .35s ease;
}
.tut-step { font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--sky-deep); }
.tut-pop h3 { font-size:19px; margin:4px 0 6px; }
.tut-pop p { font-size:15px; color:var(--body); margin:0 0 14px; line-height:1.55; }
.tut-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; }

/* ===== Mobile bottom nav ===== */
.mnav { display:none; }
@media (max-width: 820px) {
  .mnav {
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:120;
    background:rgba(255,255,255,.96); backdrop-filter:blur(10px);
    border-top:1px solid var(--line); padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    justify-content:space-around; align-items:flex-end;
  }
  .mnav-item {
    flex:1; background:none; border:0; cursor:pointer; display:flex; flex-direction:column;
    align-items:center; gap:3px; padding:6px 2px; color:var(--muted); font-size:11px;
    text-decoration:none; font-family:'Montserrat'; -webkit-tap-highlight-color:transparent;
  }
  .mnav-item svg { width:23px; height:23px; }
  .mnav-item.active { color:var(--sky-deep); }
  .mnav-item:active { transform:scale(.94); }
  .mnav-fab {
    color:#fff;
  }
  .mnav-fab svg {
    background:linear-gradient(135deg,var(--sky),var(--sky-deep)); color:#fff;
    width:46px; height:46px; border-radius:50%; padding:11px; margin-top:-20px;
    box-shadow:0 6px 16px rgba(150,116,227,.4); box-sizing:border-box;
  }
  .mnav-fab span { color:var(--sky-deep); font-weight:600; }
  /* 3-feature nav: even thirds, FAB centred */
  .mnav-3 { justify-content:space-between; padding-left:18px; padding-right:18px; }
  .mnav-3 .mnav-item { flex:1 1 0; }
  /* keep content clear of the bar */
  body { padding-bottom:74px; }
  footer.site { margin-bottom:64px; }
}

/* ===== Template format picker ===== */
.fmt-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.fmt-card {
  background:var(--white); border:1.5px solid var(--line); border-radius:12px; padding:12px 10px;
  cursor:pointer; text-align:center; display:flex; flex-direction:column; align-items:center; gap:4px;
  transition:.15s; font-family:'Montserrat';
}
.fmt-card:hover { border-color:var(--sky); }
.fmt-card.active { border-color:var(--sky); background:var(--sky-soft); box-shadow:0 0 0 3px var(--sky-soft); }
.fmt-card b { font-size:14px; color:var(--ink); }
.fmt-card small { font-size:11px; color:var(--muted); line-height:1.3; }
.fmt-prev { width:100%; height:54px; border-radius:6px; border:1px solid var(--line); background:#fff; position:relative; overflow:hidden; }
.fmt-prev.fmt-classic::before { content:''; position:absolute; left:8px; right:8px; top:8px; height:6px; background:#1a1a1a; border-radius:2px; }
.fmt-prev.fmt-classic::after { content:''; position:absolute; left:8px; right:20px; top:20px; height:3px; background:#ccc; box-shadow:0 7px #ccc,0 14px #ccc,0 21px #ccc; }
.fmt-prev.fmt-modern::before { content:''; position:absolute; left:0; right:0; top:0; height:16px; background:linear-gradient(90deg,var(--sky),var(--sky-deep)); }
.fmt-prev.fmt-modern::after { content:''; position:absolute; left:8px; right:20px; top:24px; height:3px; background:#ccc; box-shadow:0 7px #ccc,0 14px #ccc; }
.fmt-prev.fmt-designer::before { content:''; position:absolute; right:8px; top:8px; width:16px; height:16px; border-radius:50%; background:var(--sky-soft); border:1px solid var(--sky); }
.fmt-prev.fmt-designer::after { content:''; position:absolute; left:8px; top:10px; width:40%; height:5px; background:#1a1a1a; border-radius:2px; box-shadow:0 10px #ccc,0 18px #ccc; }

/* JD upload thumbnails */
.jd-thumbs { display:flex; gap:8px; flex-wrap:wrap; }
.jd-thumbs img { width:60px; height:60px; object-fit:cover; border-radius:8px; border:1px solid var(--line); }

/* Preview format variants */
.preview-doc.fmt-modern h1 { color:var(--sky-deep); }
.preview-doc.fmt-modern .p-accent { height:6px; background:linear-gradient(90deg,var(--sky),var(--sky-deep)); border-radius:3px; margin-bottom:12px; }
.preview-doc.fmt-designer { font-family:'Montserrat', sans-serif; }
.preview-doc.fmt-designer h1 { font-family:'Montserrat', system-ui, sans-serif; }

/* Watermark for free/guest downloads: made by www.AIResume.build */
.preview-doc.guarded::after {
  content:'made by www.AIResume.build'; position:absolute; inset:0; pointer-events:none;
  display:grid; place-items:center; font-family:'Montserrat';
  font-size:22px; font-weight:700; color:rgba(150,116,227,.10);
  transform:rotate(-24deg); letter-spacing:2px; z-index:1;
}

/* ===== Daily dashboard ===== */
.daily-streak { background:linear-gradient(135deg,#fff2d6,#ffe0b3); border:1px solid #f0c36d;
  border-radius:20px; padding:8px 16px; font-size:15px; color:#7a5a00; }
.daily-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.daily-stat { background:var(--white); border:1px solid var(--line); border-radius:14px; padding:16px; text-align:center; }
.ds-emoji { font-size:22px; }
.ds-val { font-family:'Montserrat'; font-weight:700; font-size:26px; color:var(--ink); margin-top:2px; }
.ds-key { font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; }

.daily-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.daily-card { background:var(--white); border:1px solid var(--line); border-radius:16px; padding:20px;
  display:flex; flex-direction:column; gap:10px; box-shadow:0 1px 3px rgba(20,40,61,.04); }
.dc-head { display:flex; align-items:center; gap:10px; }
.dc-emoji { font-size:24px; }
.dc-head h3 { font-size:17px; margin:0; }
.dc-sub { font-size:13px; color:var(--muted); margin:0; flex:1; }
.dc-score { font-family:'Montserrat'; font-weight:700; font-size:32px; color:var(--sky-deep); }
.dc-action { font-size:14px; color:var(--body); margin:0; min-height:38px; }
.dc-state { min-height:8px; }
.dc-done { color:var(--signal); font-size:13px; font-weight:600; }
.dc-soon { opacity:.72; background:var(--mist); border-style:dashed; }
.dc-leaders { display:flex; flex-direction:column; gap:4px; }
.lb-row { display:flex; align-items:center; gap:8px; font-size:13px; padding:3px 0; border-bottom:1px solid var(--line); }
.lb-row:last-child { border-bottom:0; }
.lb-rank { width:26px; }
.lb-name { flex:1; color:var(--ink); }
.lb-pts { font-weight:600; color:var(--sky-deep); }

/* aptitude modal */
.apt-q { border-bottom:1px solid var(--line); padding:12px 0; }
.apt-cat { font-family:'IBM Plex Mono'; font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--sky-deep); }
.apt-text { font-size:15px; font-weight:600; margin:4px 0 8px; }
.apt-opts { display:flex; flex-direction:column; gap:6px; }
.apt-opt { display:flex; align-items:center; gap:8px; font-size:14px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; cursor:pointer; }
.apt-opt:hover { border-color:var(--sky); background:var(--sky-soft); }
.apt-score { font-size:20px; text-align:center; margin-bottom:12px; }
.apt-rv { padding:8px 10px; border-radius:8px; margin-bottom:6px; font-size:13px; }
.apt-rv.ok { background:#e4f6f0; color:var(--signal); }
.apt-rv.no { background:#fbe6e3; color:var(--danger); }
.apt-exp { color:var(--body); font-size:12.5px; margin-top:4px; }

/* skill modal */
.skill-task { border-bottom:1px solid var(--line); padding:12px 0; }
.skill-badge { display:inline-block; background:var(--sky-soft); color:var(--sky-deep); font-size:11px;
  font-family:'IBM Plex Mono'; padding:3px 10px; border-radius:12px; margin-bottom:6px; }
.skill-prompt { font-size:14px; color:var(--ink); }
.skill-check { display:flex; align-items:center; gap:8px; font-size:13px; margin-top:8px; color:var(--body); }
.skill-sol { background:#0f1e2e; color:#d7e3f0; padding:12px; border-radius:8px; font-size:12.5px; overflow-x:auto; margin-top:8px; white-space:pre-wrap; }

@media (max-width: 900px) {
  .daily-stats { grid-template-columns:repeat(2,1fr); }
  .daily-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 560px) {
  .daily-grid { grid-template-columns:1fr; }
}

/* ===== Dashboard feeds / jobs / readiness / Jia ===== */
.dc-tip { font-size:12.5px; color:#7a5a00; background:#fff7e6; border-radius:8px; padding:8px 10px; margin:0; }
.dc-jobs { display:flex; flex-direction:column; gap:6px; }
.dc-role { font-size:13px; color:var(--muted); margin-bottom:4px; }
.job-board { font-size:13px; padding:7px 10px; border:1px solid var(--line); border-radius:8px; color:var(--sky-deep); text-decoration:none; }
.job-board:hover { background:var(--sky-soft); border-color:var(--sky); }
.dc-recs { display:flex; flex-direction:column; gap:3px; }
.dc-recs .rec { font-size:12.5px; color:var(--body); }
.dc-feed-mini { font-size:13px; color:var(--body); min-height:40px; }

.feed-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.feed-card { background:var(--white); border:1px solid var(--line); border-radius:16px; padding:20px; }
.feed-body { margin-top:10px; display:flex; flex-direction:column; gap:10px; }
.feed-item { border-bottom:1px solid var(--line); padding-bottom:8px; font-size:13.5px; }
.feed-item:last-child { border-bottom:0; }
.feed-item b { color:var(--ink); }
.feed-item > div { color:var(--body); margin-top:2px; }
.feed-action { color:var(--sky-deep); font-size:12px; margin-top:4px; display:inline-block; text-decoration:none; }
.feed-q { font-size:12.5px; color:var(--body); margin-top:4px; }
.coach-line { font-size:13px; margin:5px 0; color:var(--body); }

/* Jia chat */
.jia-chat { max-height:340px; overflow-y:auto; display:flex; flex-direction:column; gap:12px; padding:8px 0; }
.jia-msg { display:flex; gap:8px; font-size:14px; }
.jia-msg.jia > div { background:var(--sky-soft); border-radius:12px 12px 12px 4px; padding:10px 12px; color:var(--ink); }
.jia-msg.me { justify-content:flex-end; }
.jia-msg.me > div { background:var(--ink); color:#fff; border-radius:12px 12px 4px 12px; padding:10px 12px; max-width:80%; }
.jia-avatar { font-size:20px; }
.jia-name { font-size:11px; color:var(--sky-deep); font-weight:600; margin-bottom:3px; }
.jia-final { background:var(--mist); border-radius:12px; padding:16px; margin-top:8px; }
.jia-score { font-family:'Montserrat'; font-weight:700; font-size:22px; color:var(--sky-deep); }
.feed-card h4 { font-size:14px; margin:12px 0 4px; }

@media (max-width: 760px) { .feed-row { grid-template-columns:1fr; } }

/* field selector on dashboard */
.field-select { padding:8px 12px; border:1px solid var(--line); border-radius:10px; font-family:'Montserrat'; font-size:14px; background:#fff; color:var(--ink); cursor:pointer; }
.field-select:focus { outline:none; border-color:var(--sky); }

/* home daily-companion grid */
.home-feed-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.hf-card { background:var(--white); border:1px solid var(--line); border-radius:16px; padding:22px; text-align:left; }
.hf-emoji { font-size:28px; }
.hf-card h3 { font-size:17px; margin:8px 0 6px; }
.hf-card p { font-size:13.5px; color:var(--body); margin:0; line-height:1.5; }
@media (max-width:820px){ .home-feed-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .home-feed-grid { grid-template-columns:1fr; } }

/* ===== Vertical feed (TikTok/Snapchat-style) ===== */
.vfeed {
  position:relative; height:min(560px, 72vh); border-radius:22px; overflow:hidden;
  background:#0f1e2e; box-shadow:0 12px 40px rgba(20,40,61,.18); outline:none;
  max-width:440px; margin:0 auto;
}
.vfeed-track { height:100%; will-change:transform; }
.vfeed-card {
  height:100%; display:flex; align-items:center; justify-content:center; padding:32px;
  color:#fff; position:relative;
}
.vf-inner { max-width:340px; text-align:left; width:100%; }
.vf-tag {
  display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:1px;
  text-transform:uppercase; background:rgba(255,255,255,.18); padding:5px 12px; border-radius:20px; margin-bottom:16px;
}
.vf-title { font-family:'Montserrat', system-ui, sans-serif; font-weight:700; font-size:26px; line-height:1.2; margin-bottom:12px; }
.vf-body { font-size:16px; line-height:1.55; opacity:.95; }
.vf-meta { font-size:13px; opacity:.8; margin-top:12px; font-style:italic; }
.vf-cta {
  display:inline-block; margin-top:22px; background:#fff; color:#14283d; font-weight:600;
  padding:11px 20px; border-radius:12px; text-decoration:none; border:0; cursor:pointer;
  font-family:'Montserrat', system-ui, sans-serif; font-size:15px;
}
.vf-cta:hover { transform:translateY(-1px); }
.vf-cta-note { margin-top:20px; font-size:14px; opacity:.9; font-weight:600; }
.vf-loading { background:linear-gradient(160deg,#9674E3,#6F41D8); }
.vf-emoji { font-size:44px; margin-bottom:12px; }

.vfeed-nav {
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.vfeed-arrow {
  width:40px; height:40px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(255,255,255,.22); color:#fff; font-size:18px; backdrop-filter:blur(4px);
}
.vfeed-arrow:hover { background:rgba(255,255,255,.35); }
.vfeed-arrow:disabled { opacity:.3; cursor:default; }
.vfeed-dots { display:flex; flex-direction:column; gap:6px; margin:6px 0; }
.vfeed-dots i { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.4); display:block; transition:.2s; }
.vfeed-dots i.on { background:#fff; height:16px; border-radius:6px; }

@media (max-width:520px){
  .vfeed { height:76vh; max-width:100%; border-radius:16px; }
  .vf-title { font-size:23px; }
}

/* ===== Student social network home ===== */
.sn-wrap {
  display:grid; grid-template-columns:260px 1fr 300px; gap:20px; align-items:start;
  padding:22px 0 40px;
}
.sn-card {
  background:var(--white); border:1px solid var(--line); border-radius:16px; padding:16px;
  box-shadow:0 1px 3px rgba(20,40,61,.04); margin-bottom:16px;
}
.sn-left, .sn-right { position:sticky; top:84px; }
.sn-card-h { font-family:'Montserrat'; font-weight:600; font-size:14px; color:var(--ink); margin-bottom:12px; }
.sn-hint { font-size:12px; color:var(--muted); margin:8px 0 0; }

/* profile card */
.sn-profile { padding:0; overflow:hidden; text-align:center; }
.sn-cover { height:56px; background:linear-gradient(120deg,var(--sky),var(--sky-deep)); }
.sn-avatar {
  width:64px; height:64px; border-radius:50%; background:var(--sky-soft); color:var(--sky-deep);
  display:grid; place-items:center; font-size:28px; font-weight:700; margin:-32px auto 8px;
  border:4px solid #fff; font-family:'Montserrat';
}
.sn-avatar.sm { width:40px; height:40px; font-size:18px; margin:0; border:0; flex:0 0 auto; }
.sn-me { padding:0 16px; }
.sn-name { font-family:'Montserrat'; font-weight:700; font-size:18px; }
.sn-sub { font-size:12px; color:var(--muted); margin:2px 0 12px; word-break:break-word; }
.sn-profile .btn { margin:0 16px 16px; width:calc(100% - 32px); }
.sn-me-stats { display:flex; justify-content:space-around; border-top:1px solid var(--line); }

.sn-quick { display:flex; flex-direction:column; gap:2px; }
.sn-quick-link { padding:10px 8px; border-radius:8px; font-size:14px; color:var(--ink); text-decoration:none; }
.sn-quick-link:hover { background:var(--mist); }

/* center feed */
.sn-composer { display:flex; align-items:center; gap:10px; cursor:pointer; }
.sn-composer-in { flex:1; background:var(--mist); border-radius:20px; padding:11px 16px; color:var(--muted); font-size:14px; }
.sn-tabs { display:flex; gap:6px; margin-bottom:16px; overflow-x:auto; }
.sn-tab {
  background:none; border:0; padding:8px 14px; border-radius:20px; cursor:pointer;
  font-family:'Montserrat'; font-size:14px; color:var(--muted); white-space:nowrap;
}
.sn-tab.active { background:var(--sky-soft); color:var(--sky-deep); font-weight:600; }
.sn-tab:hover { background:var(--mist); }

.sn-post { padding:18px; }
.sn-post-h { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.sn-src { width:40px; height:40px; border-radius:12px; display:grid; place-items:center; font-size:20px; color:#fff; }
.sn-src-name { font-weight:600; font-size:14px; color:var(--ink); }
.sn-src-sub { font-size:11.5px; color:var(--muted); }
.sn-post-title { font-family:'Montserrat'; font-weight:700; font-size:19px; line-height:1.3; margin-bottom:8px; color:var(--ink); }
.sn-post-body { font-size:15px; line-height:1.55; color:var(--body); }
.sn-post-meta { font-size:13px; color:var(--muted); font-style:italic; margin-top:8px; }
.sn-post-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; flex-wrap:wrap; }
.sn-act { background:var(--sky); color:#fff; padding:8px 16px; border-radius:10px; text-decoration:none; font-size:14px; font-weight:600; border:0; cursor:pointer; font-family:'Montserrat'; }
.sn-act:hover { background:var(--sky-deep); }
.sn-act-note { font-size:13px; color:var(--sky-deep); font-weight:600; }
.sn-react { display:flex; gap:6px; }
.sn-react-btn { background:none; border:0; cursor:pointer; font-size:13px; color:var(--muted); padding:6px 8px; border-radius:8px; }
.sn-react-btn:hover { background:var(--mist); }
.sn-react-btn.on { color:var(--sky-deep); }
.sn-join { border:1.5px dashed var(--sky); background:var(--sky-soft); }
.sn-join .sn-post-title em { color:var(--sky-deep); font-style:italic; }
.sn-skeleton { height:150px; background:linear-gradient(90deg,var(--mist),#eef4fb,var(--mist)); background-size:200% 100%; animation:snShimmer 1.3s infinite; border:0; }
@keyframes snShimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* right rail */
.sn-live-stats { display:flex; flex-direction:column; gap:10px; }
.sn-live-row { display:flex; align-items:center; gap:8px; font-size:13px; }
.sn-live-row b { font-family:'Montserrat'; font-size:16px; color:var(--ink); }
.sn-live-k { color:var(--muted); }
.sn-leaders { display:flex; flex-direction:column; gap:6px; }
.sn-leader { display:flex; align-items:center; gap:8px; font-size:13.5px; padding:4px 0; }
.sn-rank { width:24px; }
.sn-lname { flex:1; color:var(--ink); }
.sn-lpts { font-weight:600; color:var(--sky-deep); }
.sn-more { display:inline-block; margin-top:10px; font-size:12.5px; color:var(--sky-deep); text-decoration:none; }
.sn-cta { text-align:center; background:linear-gradient(160deg,#f4f9fe,#e9f3fc); }
.sn-cta-emoji { font-size:32px; }
.sn-cta-title { font-family:'Montserrat'; font-weight:700; font-size:17px; margin:6px 0; }
.sn-cta-body { font-size:13px; color:var(--body); margin:0 0 12px; }

@media (max-width: 980px) {
  .sn-wrap { grid-template-columns:1fr; }
  .sn-left, .sn-right { position:static; }
  .sn-right { order:3; }
  .sn-left { order:1; }
  .sn-center { order:2; }
  /* on mobile show the essentials: profile join + feed; move some rail cards */
  .sn-quick { display:none; }
}

/* ===== ChatGPT-style home (Compass) ===== */
.cx-wrap {
  display:grid; grid-template-columns:260px 1fr; gap:0;
  height:calc(100vh - 64px); /* below nav */ min-height:520px;
  background:var(--white);
}
/* sidebar */
.cx-side {
  background:#f7f8fa; border-right:1px solid var(--line); padding:16px 12px;
  display:flex; flex-direction:column; gap:18px; overflow-y:auto;
}
.cx-new {
  display:flex; align-items:center; gap:8px; width:100%; padding:11px 14px;
  background:#fff; border:1px solid var(--line); border-radius:12px; cursor:pointer;
  font-family:'Montserrat'; font-size:14px; font-weight:600; color:var(--ink);
}
.cx-new:hover { background:var(--mist); }
.cx-side-group { display:flex; flex-direction:column; gap:4px; }
.cx-side-h { font-size:11px; text-transform:uppercase; letter-spacing:1px; color:var(--muted); margin-bottom:4px; padding:0 6px; }
.cx-side-link { padding:9px 10px; border-radius:9px; font-size:14px; color:var(--ink); text-decoration:none; }
.cx-side-link:hover { background:var(--mist); }
.cx-stats { display:flex; flex-direction:column; gap:6px; padding:0 6px; }
.cx-stat { font-size:13px; color:var(--body); }
.cx-stat b { color:var(--ink); font-family:'Montserrat'; }
.cx-stat-k { color:var(--muted); font-size:12px; }
.cx-side-foot { margin-top:auto; }

/* main chat column */
.cx-main { display:flex; flex-direction:column; position:relative; min-width:0; }
.cx-thread { flex:1; overflow-y:auto; padding:24px 0 12px; }

/* welcome / empty state */
.cx-welcome { max-width:640px; margin:6vh auto 0; text-align:center; padding:0 20px; }
.cx-logo {
  width:60px; height:60px; border-radius:50%; background:linear-gradient(135deg,var(--sky),var(--sky-deep));
  display:grid; place-items:center; font-size:30px; margin:0 auto 16px;
}
.cx-welcome h1 { font-family:'Montserrat'; font-size:30px; margin:0 0 8px; }
.cx-welcome p { color:var(--body); font-size:16px; line-height:1.5; margin:0 auto 24px; max-width:520px; }
.cx-starters { display:grid; grid-template-columns:1fr 1fr; gap:10px; max-width:520px; margin:0 auto; }
.cx-starter {
  background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px; cursor:pointer;
  text-align:left; font-family:'Montserrat'; font-size:14px; color:var(--ink); transition:.15s;
}
.cx-starter:hover { border-color:var(--sky); background:var(--sky-soft); }

/* messages */
.cx-msg { display:flex; gap:14px; max-width:760px; margin:0 auto 22px; padding:0 20px; }
.cx-ava {
  flex:0 0 auto; width:32px; height:32px; border-radius:8px; display:grid; place-items:center;
  font-size:17px; background:var(--mist);
}
.cx-msg.bot .cx-ava { background:linear-gradient(135deg,var(--sky),var(--sky-deep)); }
.cx-bubble { font-size:15.5px; line-height:1.6; color:var(--ink); padding-top:4px; min-width:0; }
.cx-msg.user .cx-bubble { color:var(--ink); }

.cx-typing { display:inline-flex; gap:4px; padding:6px 0; }
.cx-typing i { width:7px; height:7px; border-radius:50%; background:var(--muted); animation:cxb 1s infinite; }
.cx-typing i:nth-child(2){ animation-delay:.15s } .cx-typing i:nth-child(3){ animation-delay:.3s }
@keyframes cxb { 0%,60%,100%{opacity:.3;transform:translateY(0)} 30%{opacity:1;transform:translateY(-3px)} }

/* action chips under a bot message */
.cx-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.cx-chip {
  background:var(--sky-soft); color:var(--sky-deep); border:1px solid transparent; border-radius:20px;
  padding:7px 14px; font-size:13px; font-weight:600; cursor:pointer; font-family:'Montserrat';
}
.cx-chip:hover { border-color:var(--sky); }

/* feed cards inside chat */
.cx-feed { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:6px; }
.cx-feed-card { border:1px solid var(--line); border-radius:12px; padding:12px; background:#fff; }
.cx-feed-tag { font-size:11px; font-family:'IBM Plex Mono'; text-transform:uppercase; letter-spacing:.5px; color:var(--sky-deep); }
.cx-feed-title { font-weight:700; font-size:14px; margin:4px 0; }
.cx-feed-body { font-size:12.5px; color:var(--body); }
.cx-feed-card a { font-size:12px; color:var(--sky-deep); text-decoration:none; display:inline-block; margin-top:6px; }
.cx-feed-more { margin-top:10px; font-size:13px; } .cx-feed-more a { color:var(--sky-deep); text-decoration:none; }

/* input bar */
.cx-inputbar { padding:10px 20px 16px; background:linear-gradient(to top, var(--white) 60%, transparent); }
.cx-input {
  max-width:760px; margin:0 auto; display:flex; align-items:flex-end; gap:8px;
  background:#fff; border:1px solid var(--line); border-radius:24px; padding:8px 8px 8px 18px;
  box-shadow:0 2px 12px rgba(20,40,61,.06);
}
.cx-input textarea {
  flex:1; border:0; outline:0; resize:none; font-family:'Montserrat'; font-size:15.5px; line-height:1.5;
  max-height:160px; padding:8px 0; background:transparent; color:var(--ink);
}
.cx-send {
  flex:0 0 auto; width:36px; height:36px; border-radius:50%; border:0; cursor:pointer;
  background:var(--ink); color:#fff; font-size:17px;
}
.cx-send:hover { background:var(--sky-deep); }
.cx-disclaimer { max-width:760px; margin:8px auto 0; text-align:center; font-size:11.5px; color:var(--muted); }

@media (max-width: 860px) {
  .cx-wrap { grid-template-columns:1fr; height:calc(100vh - 60px); }
  .cx-side { display:none; }
  .cx-starters { grid-template-columns:1fr; }
  .cx-feed { grid-template-columns:1fr; }
}

/* pricing page (ChatGPT-clean) */
.price-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.price-card { background:var(--white); border:1px solid var(--line); border-radius:16px; padding:24px; position:relative; }
.price-card.featured { border-color:var(--sky); box-shadow:0 0 0 1px var(--sky); }
.price-badge { position:absolute; top:-11px; left:24px; background:var(--sky); color:#fff; font-size:11px; padding:4px 10px; border-radius:12px; font-weight:600; }
.price-card h3 { font-size:18px; }
.price-card .price { font-size:30px; font-weight:600; margin:10px 0 16px; color:var(--ink); }
.price-card .price span { font-size:13px; color:var(--muted); font-weight:400; margin-left:4px; }
.price-card ul { list-style:none; padding:0; margin:0 0 20px; display:flex; flex-direction:column; gap:8px; }
.price-card li { font-size:14px; color:var(--body); padding-left:22px; position:relative; }
.price-card li::before { content:'✓'; position:absolute; left:0; color:var(--sky); font-weight:700; }
@media (max-width:820px){ .price-grid { grid-template-columns:1fr; } }

/* ===== Chat resume intake (attachments, build result) ===== */
.cx-attachments { max-width:760px; margin:0 auto 8px; display:flex; flex-wrap:wrap; gap:6px; }
.cx-att-chip { background:var(--sky-soft); color:var(--sky-deep); font-size:12px; padding:5px 10px; border-radius:14px; }
.cx-build-hint { width:100%; font-size:13px; color:var(--muted); margin-top:4px; }
.cx-build-hint button { background:none; border:0; color:var(--sky-deep); font-weight:600; cursor:pointer; font-size:13px; }

.cx-attach { position:relative; flex:0 0 auto; }
.cx-attach-btn { width:34px; height:34px; border-radius:50%; border:1px solid var(--line); background:#fff; cursor:pointer; font-size:19px; color:var(--muted); line-height:1; }
.cx-attach-btn:hover { border-color:var(--sky); color:var(--sky-deep); }
.cx-attach-menu { position:absolute; bottom:44px; left:0; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 28px rgba(20,40,61,.14); padding:6px; display:none; flex-direction:column; gap:2px; min-width:230px; z-index:20; }
.cx-attach-menu.open { display:flex; }
.cx-attach-menu button { background:none; border:0; text-align:left; padding:9px 12px; border-radius:8px; cursor:pointer; font-size:14px; font-family:'Montserrat'; color:var(--ink); }
.cx-attach-menu button:hover { background:var(--mist); }

.cx-ats { background:var(--sky-soft); border-radius:10px; padding:10px 12px; margin:10px 0; font-size:13.5px; }
.cx-ats-score b { color:var(--sky-deep); }
.cx-ats-miss { color:var(--body); margin-top:4px; }
.cx-ats-none { background:var(--mist); color:var(--muted); }

.cx-resume-prev { border:1px solid var(--line); border-radius:12px; padding:16px; margin:10px 0; background:#fff; }
.cx-rp-name { font-weight:700; font-size:17px; }
.cx-rp-meta { font-size:12px; color:var(--muted); margin:2px 0 8px; }
.cx-rp-sec { margin-top:8px; font-size:13px; }
.cx-rp-sec b { display:block; font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--sky-deep); }
.cx-rp-sec p { margin:2px 0 0; color:var(--body); }
.cx-resume-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
.cx-act { background:var(--sky); color:#fff; border:0; border-radius:10px; padding:9px 16px; font-size:14px; font-weight:600; cursor:pointer; text-decoration:none; font-family:'Montserrat'; }
.cx-act:hover { background:var(--sky-deep); }
.cx-act.ghost { background:#fff; border:1px solid var(--line); color:var(--ink); }
.cx-signup-note { font-size:12.5px; color:var(--muted); margin-top:8px; }

/* ===== AI Career OS assessment (mobile-first) ===== */
.co-wrap { max-width:680px; margin:0 auto; padding:20px 16px 40px; }
.co-screen { animation:coFade .25s ease; }
@keyframes coFade { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }
.co-badge { display:inline-block; background:var(--sky-soft); color:var(--sky-deep); font-size:12px;
  font-weight:600; padding:5px 12px; border-radius:20px; margin-bottom:12px; }
.co-hero h1 { font-size:30px; margin-bottom:10px; }
.co-lead { font-size:16px; color:var(--body); line-height:1.55; }
.co-modules { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:22px 0; }
.co-mod { background:var(--white); border:1px solid var(--line); border-radius:14px; padding:14px; text-align:center; }
.co-mod span { font-size:24px; display:block; }
.co-mod b { display:block; font-size:14px; margin-top:4px; }
.co-mod small { color:var(--muted); font-size:12px; }
.co-start { font-size:16px; padding:15px; }
.co-fine { font-size:12.5px; color:var(--muted); text-align:center; margin-top:10px; }

/* quiz */
.co-progress { height:6px; background:var(--mist); border-radius:4px; overflow:hidden; margin-bottom:14px; }
.co-progress-bar { height:100%; background:var(--sky); width:0; transition:width .3s ease; }
.co-qmeta { font-size:12.5px; color:var(--muted); margin-bottom:14px; }
.co-qcard { background:var(--white); border:1px solid var(--line); border-radius:18px; padding:24px 20px; }
.co-question { font-size:21px; line-height:1.35; margin-bottom:8px; }
.co-help { font-size:13px; color:var(--sky-deep); background:var(--sky-soft); padding:8px 12px; border-radius:10px; margin:8px 0 0; }
.co-scale { display:flex; flex-direction:column; gap:8px; margin-top:20px; }
.co-opt {
  display:flex; align-items:center; gap:12px; width:100%; padding:15px 16px; cursor:pointer;
  background:#fff; border:1.5px solid var(--line); border-radius:14px; text-align:left;
  font-family:'Montserrat'; font-size:15px; color:var(--ink); transition:.12s;
}
.co-opt b { width:26px; height:26px; border-radius:50%; background:var(--mist); display:grid;
  place-items:center; font-size:13px; flex:0 0 auto; }
.co-opt:hover, .co-opt.on { border-color:var(--sky); background:var(--sky-soft); }
.co-opt.on b { background:var(--sky); color:#fff; }
.co-back { background:none; border:0; color:var(--muted); font-size:14px; cursor:pointer; margin-top:16px; padding:8px 0; font-family:'Montserrat'; }

/* results */
.co-scores { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
.co-score-card { background:var(--white); border:1px solid var(--line); border-radius:16px; padding:18px; text-align:center; }
.co-dial {
  width:96px; height:96px; border-radius:50%; margin:0 auto 10px; display:grid; place-items:center;
  background:conic-gradient(var(--sky) 0deg, var(--mist) 0deg); position:relative;
}
.co-dial::before { content:''; position:absolute; inset:9px; background:#fff; border-radius:50%; }
.co-dial span { position:relative; font-size:26px; font-weight:700; color:var(--ink); }
.co-score-label { font-size:14px; font-weight:600; }
.co-bench { font-size:11.5px; color:var(--muted); margin-top:2px; min-height:14px; }

.co-card { background:var(--white); border:1px solid var(--line); border-radius:16px; padding:20px; margin-bottom:14px; }
.co-card h3 { font-size:17px; margin-bottom:12px; }
.co-match { border:1px solid var(--line); border-radius:12px; padding:14px; margin-bottom:10px; }
.co-match.top { border-color:var(--sky); background:var(--sky-soft); }
.co-match-h { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.co-match-pct { font-size:13px; font-weight:700; color:var(--sky-deep); }
.co-match p { font-size:13.5px; color:var(--body); margin:6px 0 0; }
.co-risk { font-size:12px; color:var(--muted); margin-top:6px; }
.co-resume-block { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.co-resume-score { font-size:34px; font-weight:700; color:var(--sky-deep); }
.co-resume-score small { font-size:15px; color:var(--muted); font-weight:400; }
.co-muted { color:var(--muted); font-size:14px; margin:0; }
.co-pct { font-size:13px; color:var(--sky-deep); font-weight:600; float:right; }
.co-skills { display:flex; flex-wrap:wrap; gap:8px; }
.co-skill-target { width:100%; font-size:13px; color:var(--muted); margin-bottom:4px; }
.co-skill { font-size:13px; padding:7px 12px; border-radius:18px; }
.co-skill.have { background:var(--sky-soft); color:var(--sky-deep); }
.co-skill.need { background:#fff4e5; color:#a86a00; }
.co-skill.locked { background:var(--mist); color:var(--muted); }

/* unlock / paywall */
.co-unlock { background:linear-gradient(160deg,var(--sky-soft),#fff); border:1.5px solid var(--sky);
  border-radius:18px; padding:24px 20px; text-align:center; }
.co-unlock-emoji { font-size:32px; }
.co-unlock h3 { margin:8px 0 14px; font-size:20px; }
.co-unlock-list { list-style:none; padding:0; margin:0 0 18px; text-align:left; display:flex; flex-direction:column; gap:8px; }
.co-unlock-list li { font-size:14px; color:var(--body); padding-left:24px; position:relative; }
.co-unlock-list li::before { content:'✓'; position:absolute; left:0; color:var(--sky); font-weight:700; }

/* report */
.co-report-head h2 { font-size:24px; margin:4px 0 8px; }
.co-list { padding-left:20px; margin:0; display:flex; flex-direction:column; gap:6px; font-size:14px; color:var(--body); }
.co-roadmap { display:flex; flex-direction:column; gap:12px; }
.co-week { display:flex; gap:12px; }
.co-week-n { flex:0 0 62px; font-size:12px; font-weight:700; color:var(--sky-deep); background:var(--sky-soft);
  border-radius:10px; height:fit-content; padding:7px 0; text-align:center; }
.co-week-body b { font-size:15px; }
.co-week-body ul { margin:4px 0 0; padding-left:18px; font-size:13.5px; color:var(--body); }
.co-salary { display:flex; flex-direction:column; gap:10px; }
.co-salary > div { display:flex; justify-content:space-between; align-items:center; padding:12px 14px;
  background:var(--mist); border-radius:12px; }
.co-salary span { font-size:13.5px; color:var(--body); }
.co-salary b { font-size:17px; color:var(--ink); }
.co-salary-note { font-size:12px; color:var(--muted); margin:10px 0 0; line-height:1.5; }

/* certificate */
.co-cert { text-align:center; margin-top:8px; }
.co-cert-inner { background:#fff; border:2px solid var(--sky); border-radius:18px; padding:30px 20px; margin-bottom:12px; }
.co-cert-badge { font-size:40px; }
.co-cert-title { font-size:13px; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); margin-top:8px; }
.co-cert-name { font-size:26px; font-weight:700; margin:6px 0; }
.co-cert-meta { font-size:13.5px; color:var(--body); }
.co-cert-foot { font-size:12px; color:var(--muted); margin-top:14px; }

@media (min-width:700px){
  .co-modules { grid-template-columns:repeat(4,1fr); }
  .co-scale { display:grid; grid-template-columns:1fr 1fr; }
}

/* app-style bottom nav: keep content clear of it + prominent center action */
@media (max-width: 820px) {
  body.has-mnav, body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .mnav-fab {
    background:var(--sky); color:#fff !important; border-radius:16px;
    margin:0 4px; padding:8px 6px !important; transform:translateY(-8px);
    box-shadow:0 4px 14px rgba(17,17,19,.28);
  }
  .mnav-fab svg { stroke:#fff; }
  .mnav-fab span { font-weight:600; }
  .mnav-item.active, .mnav-item:active { color:var(--sky-deep); }
  /* chat page: input bar must sit above the nav */
  .cx-inputbar { padding-bottom: calc(16px + 72px + env(safe-area-inset-bottom)); }
  .cx-wrap { height:auto; min-height:calc(100vh - 60px); }
}

/* brand logo in nav */
.brand-logo { height:30px; width:auto; display:block; }
@media (max-width:560px){ .brand-logo { height:26px; } }

/* ===== Welcome: employability promise + resume upload ===== */
.cx-mark { width:54px; height:54px; object-fit:contain; margin:0 auto 18px; display:block; }
.cx-welcome h1 { font-size:34px; font-weight:700; letter-spacing:-0.02em; margin-bottom:12px; }
.cx-sub { font-size:16.5px; color:var(--body); line-height:1.55; max-width:520px; margin:0 auto 26px; }

.cx-upload {
  display:flex; align-items:center; gap:14px; width:100%; max-width:460px; margin:0 auto;
  background:var(--sky); color:#fff; border:0; border-radius:16px; padding:18px 20px;
  cursor:pointer; text-align:left; font-family:'Montserrat'; transition:.15s;
}
.cx-upload:hover { background:var(--sky-deep); transform:translateY(-1px); }
.cx-upload-icon { font-size:26px; flex:0 0 auto; }
.cx-upload-text { flex:1; display:flex; flex-direction:column; gap:2px; }
.cx-upload-text b { font-size:16px; font-weight:600; }
.cx-upload-text small { font-size:12.5px; opacity:.75; }
.cx-upload-arrow { font-size:20px; opacity:.8; }

.cx-or { text-align:center; color:var(--muted); font-size:13px; margin:18px 0; position:relative; }
.cx-or::before, .cx-or::after {
  content:''; position:absolute; top:50%; width:70px; height:1px; background:var(--line);
}
.cx-or::before { left:calc(50% - 100px); } .cx-or::after { right:calc(50% - 100px); }

.cx-promise {
  display:flex; justify-content:center; gap:10px; flex-wrap:wrap; margin-top:32px;
  padding-top:22px; border-top:1px solid var(--line); max-width:560px; margin-left:auto; margin-right:auto;
}
.cx-promise div { display:flex; align-items:center; gap:7px; font-size:13px; color:var(--body); }
.cx-promise b {
  width:20px; height:20px; border-radius:50%; background:var(--ink); color:#fff;
  display:grid; place-items:center; font-size:11px; font-weight:600; flex:0 0 auto;
}
@media (max-width:560px){
  .cx-welcome h1 { font-size:27px; }
  .cx-sub { font-size:15px; }
  .cx-promise { flex-direction:column; align-items:flex-start; padding-left:8px; }
}
.brand-sub { font-size:13px; color:var(--muted); font-weight:500; margin-left:8px; letter-spacing:.5px; }

/* ===== Career OS funnel ===== */
.co-steps { display:flex; flex-direction:column; gap:12px; margin:22px 0; text-align:left; }
.co-step { display:flex; gap:14px; align-items:flex-start; background:var(--white); border:1px solid var(--line); border-radius:14px; padding:16px; }
.co-step-n { flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:var(--ink); color:#fff; display:grid; place-items:center; font-weight:600; font-size:14px; }
.co-step b { display:block; font-size:15px; }
.co-step small { color:var(--muted); font-size:13px; }

/* contact + OTP */
.co-contact h2 { font-size:20px; margin-bottom:6px; }
.co-help2 { font-size:13.5px; color:var(--muted); margin-bottom:16px; }
.co-label { display:block; font-size:13px; font-weight:600; margin:12px 0 5px; }
.co-input { width:100%; padding:13px 14px; border:1.5px solid var(--line); border-radius:12px; font-family:'Montserrat'; font-size:15px; }
.co-input:focus { outline:none; border-color:var(--ink); }
.co-otp { letter-spacing:6px; text-align:center; font-size:20px; }
.co-otp-box { margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.co-dev-note { background:#fff8e6; color:#8a6d00; font-size:12.5px; padding:8px 10px; border-radius:8px; margin:8px 0; }
.co-contact .btn { margin-top:14px; }

/* gated / blurred report */
.co-gated-head { text-align:center; margin-bottom:18px; }
.co-blur-wrap { position:relative; border-radius:18px; overflow:hidden; border:1px solid var(--line); }
.co-blur { padding:22px; }
.co-teaser-row { display:flex; gap:10px; margin-bottom:16px; }
.co-teaser-card { flex:1; background:var(--mist); border-radius:12px; padding:14px; text-align:center; }
.co-teaser-label { font-size:11.5px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); }
.co-teaser-val { font-size:26px; font-weight:700; margin-top:4px; }
.co-teaser-why { font-size:14px; color:var(--body); margin-bottom:16px; line-height:1.5; }
.co-teaser-salary, .co-teaser-roadmap { margin-bottom:14px; }
.co-blurred { filter:blur(6px); user-select:none; pointer-events:none; font-size:15px; margin-top:6px; color:var(--ink); }
.co-unlock-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:20px;
  background:linear-gradient(to bottom, rgba(255,255,255,.35), rgba(255,255,255,.92) 55%); }
.co-unlock-card { background:#fff; border:1.5px solid var(--ink); border-radius:18px; padding:26px 22px; text-align:center; max-width:340px; box-shadow:0 12px 40px rgba(0,0,0,.14); }
.co-unlock-emoji { font-size:30px; }
.co-price { font-size:34px; font-weight:800; margin:8px 0; }
.co-price span { font-size:13px; font-weight:400; color:var(--muted); margin-left:6px; }
.co-next { text-align:center; margin-top:8px; }
.co-next .co-price { margin:6px 0 12px; }

/* success + report extras */
.co-success-banner { background:var(--signal); color:#fff; border-radius:12px; padding:12px 16px; font-weight:600; font-size:14px; margin-bottom:16px; text-align:center; }

/* courses */
.co-courses { display:flex; flex-direction:column; gap:8px; }
.co-course { display:flex; justify-content:space-between; align-items:center; padding:13px 15px; border:1px solid var(--line); border-radius:12px; text-decoration:none; color:var(--ink); font-size:14.5px; }
.co-course:hover { border-color:var(--ink); background:var(--mist); }
.co-course-go { font-size:13px; color:var(--muted); }

/* ===== Inline phone verify (builder step 1) ===== */
.phone-verify { display:flex; gap:8px; align-items:center; margin-top:8px; }
.pv-btn {
  border:1px solid var(--sky); background:var(--sky); color:#fff;
  border-radius:10px; padding:9px 16px; font-family:'Montserrat'; font-size:13px; font-weight:600;
  cursor:pointer; white-space:nowrap;
}
.pv-btn:hover { background:var(--sky-deep); }
.pv-btn:disabled { opacity:.6; cursor:default; }
.pv-ok { display:flex; align-items:center; color:var(--signal); font-size:14px; font-weight:600; }
.pv-otp { display:flex; gap:8px; margin-top:8px; align-items:center; flex-wrap:wrap; }
.pv-otp-input { flex:1; min-width:120px; letter-spacing:3px; text-align:center; }
.pv-note { width:100%; font-size:12px; color:var(--muted); }
.pv-nudge { animation:pvShake .5s; }
@keyframes pvShake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }

/* ===== 4-menu hub landing ===== */
.hub { max-width:900px; margin:0 auto; padding:32px 20px 48px; }
.hub-hero { text-align:center; margin-bottom:34px; }
.hub-mark { width:52px; height:52px; object-fit:contain; margin-bottom:16px; }
/* ===== Animated AIR3 hero logo ===== */
.hub-logo {
  display:inline-block; line-height:0; margin-bottom:16px; text-decoration:none;
  position:relative; border-radius:50%;
}
.hub-logo::before {  /* soft purple glow echoing the ring, gently pulsing */
  content:""; position:absolute; inset:-8%; border-radius:50%; z-index:0;
  background:radial-gradient(circle, rgba(150,116,227,.34) 0%, rgba(150,116,227,0) 68%);
  animation:air3Glow 3.6s ease-in-out infinite;
}
.hub-logo-img {
  position:relative; z-index:1;
  width:172px; max-width:52vw; height:auto; display:block; border-radius:50%;
  transform-origin:center;
  animation:air3In .7s cubic-bezier(.2,.7,.2,1) both, air3Float 5.5s ease-in-out 0.7s infinite;
  will-change:transform, opacity;
}
.hub-logo:hover .hub-logo-img { animation-play-state:paused; transform:translateY(-3px) scale(1.02); transition:transform .2s ease; }
@media (max-width:480px){ .hub-logo-img { width:140px; } }

@keyframes air3In {
  from { opacity:0; transform:scale(.82) translateY(6px); }
  to   { opacity:1; transform:scale(1) translateY(0); }
}
@keyframes air3Float {
  0%,100% { transform:translateY(0); }
  50%     { transform:translateY(-6px); }
}
@keyframes air3Glow {
  0%,100% { opacity:.55; transform:scale(1); }
  50%     { opacity:1;   transform:scale(1.05); }
}
@media (prefers-reduced-motion: reduce){
  .hub-logo-img { animation:air3In .01s both; }
  .hub-logo::before { animation:none; opacity:.5; }
}
.hub-hero h1 { font-size:34px; font-weight:700; letter-spacing:-0.02em; margin-bottom:10px; }
.hub-hero p { font-size:16.5px; color:var(--body); max-width:560px; margin:0 auto; line-height:1.55; }
.hub-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.hub-grid-3 { grid-template-columns:1fr 1fr 1fr; }
.hub-card {
  position:relative; display:block; background:var(--white); border:1px solid var(--line);
  border-radius:18px; padding:26px 24px 22px; text-decoration:none; color:var(--ink);
  transition:.16s; overflow:hidden;
}
.hub-card:hover { border-color:var(--accent); transform:translateY(-2px); box-shadow:0 10px 30px rgba(0,0,0,.06); }
/* Never underline the card text on hover (the card is an <a>); use an orange
   accent on the title and CTA instead for a clear, readable hover state. */
.hub-card, .hub-card:hover { text-decoration:none; }
.hub-card:hover h2, .hub-card:hover .hub-go { color:var(--accent); }
.hub-card:hover .hub-go { text-decoration:none; }
.hub-num {
  position:absolute; top:20px; right:22px; width:30px; height:30px; border-radius:50%;
  background:var(--mist); color:var(--muted); display:grid; place-items:center; font-weight:700; font-size:14px;
}
.hub-icon { font-size:32px; margin-bottom:12px; }
.hub-card h2 { font-size:21px; margin-bottom:8px; }
.hub-card p { font-size:14.5px; color:var(--body); line-height:1.5; margin:0 0 18px; }
.hub-meta { display:flex; align-items:center; justify-content:space-between; }
.hub-price { font-size:20px; font-weight:800; }
.hub-price.hub-free { color:var(--signal); }
.hub-go { font-size:14px; font-weight:600; color:var(--ink); }
.hub-fine { text-align:center; color:var(--muted); font-size:13px; margin-top:24px; }

@media (max-width:680px){
  .hub-grid, .hub-grid-3 { grid-template-columns:1fr; }
  .hub-hero h1 { font-size:27px; }
}
/* Tablet: keep 3-up readable by tightening card padding a touch */
@media (min-width:681px) and (max-width:900px){
  .hub-grid-3 { gap:12px; }
  .hub-grid-3 .hub-card { padding:18px; }
  .hub-grid-3 .hub-card h2 { font-size:18px; }
}

/* Menu 2: resume score fixes/sections */
.rs-fixes { display:flex; flex-direction:column; gap:12px; }
.rs-fix { border-left:3px solid var(--ink); padding:4px 0 4px 14px; }
.rs-fix-area { font-size:12px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); font-weight:600; }
.rs-fix-issue { font-size:14px; color:var(--body); margin:2px 0; }
.rs-fix-do { font-size:14px; font-weight:600; }
.rs-sections { display:flex; flex-direction:column; gap:8px; }
.rs-section { display:flex; justify-content:space-between; gap:12px; padding:10px 12px; border-radius:10px; background:var(--mist); font-size:13.5px; }
.rs-section b { flex:0 0 auto; }
.rs-section span { color:var(--body); text-align:right; }
.rs-good { border-left:3px solid var(--signal); }
.rs-weak { border-left:3px solid #d08700; }
.rs-missing { border-left:3px solid var(--danger); }

/* ===== Menu 3: learn feed ===== */
.learn-tabs { display:flex; gap:8px; margin:20px 0 16px; }
.learn-tab { border:1px solid var(--line); background:#fff; border-radius:20px; padding:8px 18px; font-family:'Montserrat'; font-size:14px; font-weight:600; cursor:pointer; color:var(--muted); }
.learn-tab.active { background:var(--ink); color:#fff; border-color:var(--ink); }
.learn-list { display:flex; flex-direction:column; gap:12px; }
.learn-card { display:block; background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; text-decoration:none; color:var(--ink); transition:.15s; }
.learn-card:hover { border-color:var(--ink); transform:translateY(-1px); }
.learn-card-top { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.learn-card-top b { font-size:16px; }
.learn-price { font-size:13px; font-weight:700; color:var(--signal); white-space:nowrap; }
.learn-provider { font-size:13px; color:var(--muted); margin-top:2px; }
.learn-desc { font-size:14px; color:var(--body); margin-top:8px; line-height:1.5; }
.learn-meta { display:flex; gap:14px; margin-top:10px; font-size:12.5px; color:var(--muted); align-items:center; }
.learn-go { margin-left:auto; font-weight:600; color:var(--ink); }

/* ===== Menu 4: support ===== */
.sup-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px; margin-bottom:16px; }
.sup-card h3 { font-size:17px; margin-bottom:14px; }
.sup-thread { display:flex; flex-direction:column; gap:10px; min-height:120px; max-height:380px; overflow-y:auto; margin-bottom:14px; }
.sup-msg { max-width:85%; padding:11px 14px; border-radius:14px; font-size:14.5px; line-height:1.5; }
.sup-user { align-self:flex-end; background:var(--ink); color:#fff; border-bottom-right-radius:4px; }
.sup-bot { align-self:flex-start; background:var(--mist); color:var(--ink); border-bottom-left-radius:4px; }
.sup-input { display:flex; gap:8px; }
.sup-input input { flex:1; }
.sup-form { display:flex; flex-direction:column; gap:10px; }

/* ===== Global auth popup ===== */
.auth-pop { position:fixed; inset:0; z-index:2000; display:none; align-items:center; justify-content:center; padding:20px; }
.auth-pop.show { display:flex; }
.auth-pop-backdrop { position:absolute; inset:0; background:rgba(17,17,19,.5); backdrop-filter:blur(3px); }
.auth-pop-card { position:relative; background:#fff; border-radius:20px; padding:30px 26px 24px; width:100%; max-width:400px;
  box-shadow:0 24px 70px rgba(0,0,0,.28); animation:authIn .2s ease; }
@keyframes authIn { from{opacity:0;transform:translateY(10px) scale(.98)} to{opacity:1;transform:none} }
.auth-pop-x { position:absolute; top:14px; right:16px; background:none; border:0; font-size:26px; line-height:1;
  color:var(--muted); cursor:pointer; padding:4px; }
.auth-pop-card h3 { font-size:22px; margin-bottom:6px; }
.auth-pop-sub { font-size:14px; color:var(--body); margin-bottom:18px; line-height:1.5; }
.auth-pop-sub a { color:var(--ink); font-weight:600; }
.auth-lbl { display:block; font-size:13px; font-weight:600; margin:12px 0 6px; }
.auth-inp { width:100%; padding:13px 14px; border:1.5px solid var(--line); border-radius:12px;
  font-family:'Montserrat'; font-size:15px; }
.auth-inp:focus { outline:none; border-color:var(--ink); box-shadow:0 0 0 3px var(--sky-soft); }
.auth-otp { letter-spacing:8px; text-align:center; font-size:22px; }
.auth-pop-card .btn { margin-top:16px; }
.auth-link { background:none; border:0; color:var(--muted); font-size:13px; cursor:pointer;
  font-family:'Montserrat'; margin-top:10px; width:100%; }
.auth-dev { background:#fff8e6; color:#8a6d00; font-size:12.5px; padding:8px 10px; border-radius:8px; margin-top:10px; }
.auth-err { color:var(--danger); font-size:13px; margin-top:12px; text-align:center; min-height:16px; }

/* ===== Admin: tabs, metrics, tables ===== */
.adm-tabs { display:flex; gap:4px; flex-wrap:wrap; border-bottom:1px solid var(--line); margin-bottom:20px; }
.adm-tab { background:none; border:0; border-bottom:2px solid transparent; padding:10px 16px;
  font-family:'Montserrat'; font-size:14px; font-weight:600; color:var(--muted); cursor:pointer; }
.adm-tab:hover { color:var(--ink); }
.adm-tab.active { color:var(--ink); border-bottom-color:var(--ink); }
.adm-metrics { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; }
.adm-metric { background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.adm-metric-v { font-size:24px; font-weight:800; letter-spacing:-.02em; }
.adm-metric-k { font-size:12px; color:var(--muted); margin-top:2px; }
.adm-bars { display:flex; align-items:flex-end; gap:4px; height:120px; padding:8px 0; overflow-x:auto; }
.adm-bar { flex:1; min-width:16px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.adm-bar span { width:70%; background:var(--ink); border-radius:3px 3px 0 0; min-height:2px; }
.adm-bar small { font-size:9px; color:var(--muted); margin-top:4px; white-space:nowrap; transform:rotate(-45deg); transform-origin:center; }
.adm-table { width:100%; border-collapse:collapse; font-size:13px; }
.adm-table th { text-align:left; padding:8px 10px; border-bottom:2px solid var(--line); font-size:11px;
  text-transform:uppercase; letter-spacing:.4px; color:var(--muted); }
.adm-table td { padding:9px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
.adm-table tr:hover td { background:var(--mist); }
.seg-block { background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; margin-bottom:16px; }
.seg-h { font-weight:700; font-size:15px; margin-bottom:4px; display:flex; align-items:center; gap:8px; }

/* ===== Nav: logged-in user chip ===== */
.nav-user { display:inline-flex; align-items:center; gap:8px; text-decoration:none; color:var(--ink);
  font-weight:600; font-size:14px; padding:4px 10px 4px 4px; border:1px solid var(--line); border-radius:20px; }
.nav-user:hover { border-color:var(--ink); }
.nav-user-dot { width:28px; height:28px; border-radius:50%; background:var(--ink); color:#fff;
  display:grid; place-items:center; font-size:13px; font-weight:700; }

/* ===== 404 page ===== */
.nf-wrap { max-width:600px; margin:0 auto; padding:60px 20px 80px; text-align:center; }
.nf-code { font-size:96px; font-weight:800; letter-spacing:-.04em; line-height:1; color:var(--ink); }
.nf-title { font-size:28px; font-weight:700; margin:12px 0 14px; }
.nf-lead { font-size:16.5px; color:var(--body); line-height:1.6; margin-bottom:10px; }
.nf-sub { font-size:14.5px; color:var(--muted); margin-bottom:28px; }
.nf-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:32px; }
.nf-links { font-size:14px; color:var(--muted); display:flex; gap:14px; justify-content:center; flex-wrap:wrap; align-items:center; }
.nf-links span { font-weight:600; }
.nf-links a { color:var(--ink); text-decoration:none; font-weight:600; }
.nf-links a:hover { text-decoration:underline; }
@media (max-width:560px){ .nf-code { font-size:72px; } .nf-title { font-size:23px; } }

/* ===== Report PDF download card ===== */
.co-download { background:#fff; border:1px solid var(--line); }
.co-dl-row { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.co-dl-sub { font-size:13px; color:var(--signal); margin-top:2px; }

/* ===== Enriched report sections ===== */
.co-dial.alt2 { background: linear-gradient(135deg,#1f7a4d,#111113); }

/* Strengths profile bars */
.co-profile { display:flex; flex-direction:column; gap:10px; margin-top:6px; }
.co-prof-row { display:grid; grid-template-columns:150px 1fr 34px; align-items:center; gap:10px; }
.co-prof-label { font-size:13px; color:var(--body); }
.co-prof-bar { height:9px; background:var(--mist); border-radius:6px; overflow:hidden; }
.co-prof-bar i { display:block; height:100%; background:linear-gradient(90deg,#111113,#3a3a40); border-radius:6px; }
.co-prof-val { font-size:13px; font-weight:700; text-align:right; }

/* Top career matches */
.co-matches { display:flex; flex-direction:column; gap:8px; margin-top:6px; }
.co-match { display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; }
.co-match.top { border-color:var(--ink); background:var(--mist); }
.co-match-rank { width:26px; height:26px; border-radius:50%; background:var(--ink); color:#fff; display:grid; place-items:center; font-weight:700; font-size:13px; flex:none; }
.co-match-main { flex:1; }
.co-match-main b { font-size:15px; }
.co-match-sal { font-size:12px; color:var(--muted); margin-top:2px; }
.co-match-pct { text-align:right; font-size:11px; color:var(--muted); line-height:1.2; }
.co-match-pct span { display:block; font-size:18px; font-weight:800; color:var(--ink); }

/* AI outlook */
.co-airisk { border-left:4px solid #1f7a4d; }

/* Alternatives */
.co-alts { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }
.co-alt { border:1px solid var(--line); border-radius:10px; padding:10px 14px; }
.co-alt b { display:block; font-size:14px; }
.co-alt span { font-size:12px; color:var(--muted); }
@media (max-width:520px){ .co-prof-row { grid-template-columns:110px 1fr 30px; } }

/* ===== CertX course recommendations ===== */
.co-certx { border-left:4px solid #111113; }
.co-course-list { display:flex; flex-direction:column; gap:10px; margin-top:8px; }
.co-course-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; }
.co-course-info { display:flex; flex-direction:column; gap:3px; }
.co-course-info b { font-size:14.5px; }
.co-course-tag { font-size:12px; font-weight:600; color:#1f7a4d; }
.co-course-tag.muted { color:var(--muted); font-weight:500; }
.co-course-targets { font-size:11.5px; color:var(--muted); }
.co-course-coupon { margin-top:10px; font-size:13px; color:#111113; background:#f6f6f7; border-radius:8px; padding:8px 12px; }
.co-ats-note { margin:-4px 2px 4px; }
@media (max-width:520px){ .co-course-item { flex-direction:column; align-items:stretch; } }

/* ===== Outcome-focused paywall ===== */
.co-outcome { max-width:560px; margin:0 auto; text-align:center; padding:8px 0 20px; }
.co-outcome-art { width:120px; height:120px; margin:0 auto 18px; }
.co-career-svg { width:100%; height:100%; display:block; }
.co-outcome h2 { font-size:26px; line-height:1.2; margin:10px 0 8px; }
.co-outcome-lead { color:var(--body); font-size:15px; line-height:1.55; max-width:460px; margin:0 auto 20px; }
.co-outcome .co-teaser-row { display:flex; gap:10px; justify-content:center; margin:0 auto 22px; max-width:420px; }
.co-outcome .co-teaser-card { flex:1; background:var(--mist); border-radius:14px; padding:14px 8px; }
.co-outcome .co-teaser-label { font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.co-outcome .co-teaser-val { font-size:28px; font-weight:800; color:var(--ink); margin-top:2px; }
.co-outcome-card { background:#fff; border:1px solid var(--line); border-radius:18px; padding:22px 22px 18px; text-align:left; box-shadow:0 6px 24px rgba(17,17,19,.05); }
.co-outcome-list { display:flex; flex-direction:column; gap:10px; margin-bottom:20px; }
.co-outcome-item { display:flex; align-items:flex-start; gap:10px; font-size:14.5px; color:var(--ink); }
.co-check { color:var(--signal); font-weight:800; flex:none; }
.co-pay-btn { display:block; width:auto; margin:0 auto; padding:13px 28px; font-size:15px; border-radius:999px; }
.co-outcome-card .co-fine { text-align:center; margin-top:10px; }
@media (max-width:480px){
  .co-outcome h2 { font-size:22px; }
  .co-pay-btn { width:100%; }
}

/* ===== Paywall FOMO: blurred report peek + value framing ===== */
.co-peek { position:relative; max-width:420px; margin:0 auto 22px; border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:0 8px 28px rgba(17,17,19,.08); }
.co-peek-shot { filter:blur(3px); opacity:.85; }
.co-peek-svg { width:100%; height:auto; display:block; }
.co-peek-fade { position:absolute; left:0; right:0; bottom:0; height:56%; background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,.92) 82%); }
.co-peek-tag { position:absolute; left:0; right:0; bottom:14px; text-align:center; font-size:13px; font-weight:700; color:#111113; }

.co-social { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; color:#1f7a4d; background:#eaf5ef; border-radius:999px; padding:5px 12px; margin-bottom:14px; }
.co-social:empty { display:none; }
.co-social-dot { width:7px; height:7px; border-radius:50%; background:#1f7a4d; display:inline-block; animation:coPulse 1.8s infinite; }
@keyframes coPulse { 0%,100%{opacity:1} 50%{opacity:.35} }

.co-value-row { display:flex; align-items:baseline; justify-content:center; gap:8px; margin:4px 0 14px; flex-wrap:wrap; }
.co-value-now { font-size:20px; font-weight:800; color:#111113; }
.co-value-sub { font-size:12.5px; color:var(--muted); }

/* ===== Instagram-style dashboard feed ===== */
.ig-wrap { max-width:640px; }
.ig-profile { display:flex; gap:20px; align-items:center; padding:8px 4px 20px; }
.ig-avatar { width:82px; height:82px; border-radius:50%; background:linear-gradient(135deg,#111113,#3a3a40); color:#fff; display:grid; place-items:center; font-size:32px; font-weight:800; flex:none; }
.ig-profile-main { flex:1; min-width:0; }
.ig-profile-top { display:flex; align-items:center; gap:14px; margin-bottom:10px; }
.ig-name { font-size:20px; margin:0; }
.ig-stats { display:flex; gap:22px; margin-bottom:8px; }
.ig-stat b { font-size:17px; } .ig-stat span { font-size:13px; color:var(--muted); margin-left:4px; }
.ig-bio { font-size:14px; }

.ig-stories { display:flex; gap:16px; overflow-x:auto; padding:6px 4px 20px; border-bottom:1px solid var(--line); }
.ig-story { text-align:center; text-decoration:none; color:var(--ink); flex:none; }
.ig-story-ring { display:grid; place-items:center; width:60px; height:60px; border-radius:50%; font-size:26px; background:var(--mist); border:2px solid var(--accent); margin-bottom:5px; }
.ig-story small { display:block; font-size:12px; }
.ig-story:hover .ig-story-ring { background:#fff; }

.ig-section { padding:20px 4px 6px; }
.ig-section-head h2 { font-size:16px; margin:0 0 12px; }
.ig-report-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ig-report-card { border:1px solid var(--line); border-radius:14px; padding:14px; background:#fff; }
.ig-report-card.locked { background:var(--mist); }
.ig-report-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.ig-report-role { font-weight:700; font-size:14px; text-transform:capitalize; }
.ig-report-badge { font-size:11px; font-weight:700; color:var(--signal); background:#eaf5ef; border-radius:999px; padding:2px 8px; }
.ig-report-badge.locked { color:var(--muted); background:var(--mist-2); }
.ig-report-scores { display:flex; gap:16px; margin-bottom:12px; }
.ig-report-scores b { font-size:20px; } .ig-report-scores small { display:block; font-size:11px; color:var(--muted); }
.ig-report-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.ig-report-empty { grid-column:1/-1; text-align:center; padding:24px; border:1px dashed var(--line); border-radius:14px; text-decoration:none; color:var(--ink); }
.ig-report-empty span { font-size:28px; display:block; } .ig-report-empty b { display:block; margin:6px 0 2px; } .ig-report-empty small { color:var(--muted); }

.ig-fieldbar { display:flex; align-items:center; gap:10px; padding:16px 4px 8px; }
.ig-select { border:1px solid var(--line); border-radius:10px; padding:8px 12px; font-family:'Montserrat'; font-size:14px; background:#fff; }

.ig-feed { display:flex; flex-direction:column; gap:16px; padding:8px 4px 40px; }
.ig-card { border:1px solid var(--line); border-radius:16px; padding:18px; background:#fff; }
.ig-card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.ig-card-kind { font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; }
.ig-card-price { font-size:13px; font-weight:700; color:var(--signal); }
.ig-card h3 { font-size:17px; margin:0 0 4px; line-height:1.3; }
.ig-card-meta { font-size:13px; margin-bottom:8px; }
.ig-card-body { font-size:14.5px; color:var(--body); line-height:1.55; margin:6px 0 12px; }
.ig-card-cta { font-size:14px; font-weight:600; color:var(--accent); text-decoration:none; }
.ig-card-cta:hover { text-decoration:none; opacity:.8; }

@media (max-width:520px){
  .ig-profile { gap:14px; }
  .ig-avatar { width:64px; height:64px; font-size:26px; }
  .ig-report-grid { grid-template-columns:1fr; }
}

/* ===== Profile edit page ===== */
.pf-msg { padding:10px 14px; border-radius:10px; font-size:14px; margin-bottom:14px; }
.pf-msg.ok { background:#eaf5ef; color:var(--signal); }
.pf-msg.err { background:#fdeceb; color:var(--danger); }
.field { display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:6px; }

/* ===== Report WhatsApp send button ===== */
.co-dl-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.co-wa-msg { margin-top:12px; padding:9px 13px; border-radius:9px; font-size:13.5px; }
.co-wa-msg.ok { background:#eaf5ef; color:var(--signal); }
.co-wa-msg.err { background:#fdeceb; color:var(--danger); }
.co-wa-msg a { color:inherit; font-weight:700; }
@media (max-width:480px){ .co-dl-row { flex-direction:column; align-items:stretch; gap:12px; } .co-dl-actions .btn { flex:1; } }

/* ===== Dashboard report card buttons (Download + WhatsApp) ===== */
.ig-card-btns { display:flex; gap:6px; align-items:center; }
.ig-wa-msg { margin-top:10px; padding:7px 11px; border-radius:8px; font-size:12.5px; }
.ig-wa-msg.ok { background:#eaf5ef; color:var(--signal); }
.ig-wa-msg.err { background:#fdeceb; color:var(--danger); }
.ig-wa-msg a { color:inherit; font-weight:700; }
.ig-rs-summary { font-size:13px; color:var(--body); line-height:1.5; margin:0 0 12px; }
@media (max-width:520px){ .ig-card-btns { flex-direction:column; align-items:stretch; width:100%; } .ig-card-btns .btn { width:100%; } }

/* ===== Resume score: file meta + history ===== */
.rs-meta { text-align:center; font-size:14px; color:var(--ink); margin:-6px 0 14px; }
.rs-history { display:flex; flex-direction:column; gap:8px; margin-top:6px; }
.rs-hist-row { display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; }
.rs-hist-score { font-size:22px; font-weight:800; width:44px; text-align:center; }
.rs-hist-meta { flex:1; display:flex; flex-direction:column; }
.rs-hist-meta b { font-size:14px; } .rs-hist-meta span { font-size:12px; }
.rs-hist-delta { font-size:13px; font-weight:700; }
.rs-up { color:var(--signal); } .rs-down { color:var(--danger); }

/* ===== Take again card ===== */
.co-retake { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.co-retake small { display:block; margin-top:2px; }
@media (max-width:480px){ .co-retake { flex-direction:column; align-items:stretch; } .co-retake .btn { width:100%; } }

/* ===== Dashboard: tabbed report tables ===== */
.dash-tabs { display:flex; gap:6px; border-bottom:1px solid var(--line); margin:8px 0 0; }
.dash-tab {
  background:none; border:0; border-bottom:2px solid transparent; cursor:pointer;
  font-family:'Montserrat'; font-size:14.5px; font-weight:600; color:var(--muted);
  padding:12px 14px; display:flex; align-items:center; gap:7px; -webkit-tap-highlight-color:transparent;
}
.dash-tab:hover { color:var(--ink); }
.dash-tab.active { color:var(--sky); border-bottom-color:var(--sky); }
.dash-count {
  display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 6px;
  border-radius:10px; background:var(--sky-soft); color:var(--sky-deep); font-size:12px; font-weight:700;
}
.dash-tab.active .dash-count { background:var(--sky); color:#fff; }

.dash-panel { margin-top:14px; }
.dash-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:12px; }
.dash-table { width:100%; border-collapse:collapse; font-size:14px; min-width:560px; }
.dash-table thead th {
  text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.03em;
  color:var(--muted); font-weight:700; padding:11px 14px; border-bottom:1px solid var(--line); background:var(--mist);
}
.dash-table td { padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:middle; }
.dash-table tbody tr:last-child td { border-bottom:0; }
.dash-table tbody tr:hover { background:var(--sky-soft); }
.dash-th-act { text-align:right; }
.dash-role { font-weight:600; color:var(--ink); text-transform:capitalize; }
.dash-file { font-weight:600; color:var(--ink); }
.dash-date { color:var(--muted); white-space:nowrap; }
.dash-lock { font-size:11px; color:var(--danger); font-weight:700; text-transform:uppercase; }
.dash-tag { font-size:11px; color:var(--sky-deep); background:var(--sky-soft); padding:2px 7px; border-radius:8px; text-transform:capitalize; }
.dash-score { font-weight:700; }
.dash-score small { font-weight:500; color:var(--muted); }
.dash-score-strong { color:var(--signal); }
.dash-score-ok { color:#b8860b; }
.dash-score-low { color:var(--danger); }
.dash-row-ver td { background:rgba(150,116,227,.035); }
.dash-ver-parent { color:var(--muted); font-size:13px; padding-left:22px; }

.dash-acts { display:flex; gap:6px; justify-content:flex-end; align-items:center; flex-wrap:wrap; }
.dash-act {
  border:1px solid var(--line); background:#fff; color:var(--ink); border-radius:8px;
  padding:6px 11px; font-size:13px; font-weight:600; font-family:'Montserrat'; cursor:pointer;
  text-decoration:none; white-space:nowrap; transition:.14s;
}
.dash-act:hover { border-color:var(--sky); color:var(--sky-deep); }
.dash-act-primary { background:var(--sky); border-color:var(--sky); color:#fff; }
.dash-act-primary:hover { background:var(--sky-deep); border-color:var(--sky-deep); color:#fff; }
.dash-wa-msg { flex-basis:100%; text-align:right; font-size:12.5px; margin-top:4px; }
.dash-wa-msg.ok { color:var(--signal); }
.dash-wa-msg.err { color:var(--danger); }
.dash-empty { padding:26px 16px; color:var(--muted); text-align:center; }
.dash-empty a { color:var(--sky-deep); font-weight:600; }
@media (max-width:560px){
  .dash-tab { padding:11px 9px; font-size:13.5px; }
  .dash-acts { justify-content:flex-start; }
}

/* ===== AI Resume creator (builder.php) ===== */
.rb-wrap { max-width:760px; padding:26px 0 60px; }
.rb-hero { text-align:center; margin-bottom:22px; }
.rb-hero h1 { font-size:30px; font-weight:700; letter-spacing:-.02em; margin-bottom:8px; }
.rb-hero p { color:var(--body); max-width:560px; margin:0 auto; line-height:1.55; }
.rb-tabs { display:flex; gap:8px; justify-content:center; margin-bottom:18px; }
.rb-tab {
  background:#fff; border:1px solid var(--line); border-radius:999px; cursor:pointer;
  font-family:'Montserrat'; font-size:14.5px; font-weight:600; color:var(--muted);
  padding:9px 18px; transition:.15s; -webkit-tap-highlight-color:transparent;
}
.rb-tab:hover { color:var(--ink); border-color:var(--sky); }
.rb-tab.active { background:var(--sky); border-color:var(--sky); color:#fff; }
.rb-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px; }
.rb-field { margin-bottom:14px; }
.rb-field label { display:block; font-size:13.5px; font-weight:600; color:var(--ink); margin-bottom:6px; }
.rb-opt { font-weight:400; color:var(--muted); }
.rb-field input, .rb-field textarea {
  width:100%; border:1px solid var(--line); border-radius:10px; padding:11px 13px;
  font-family:'Montserrat'; font-size:14.5px; color:var(--ink); background:var(--mist); resize:vertical;
}
.rb-field input:focus, .rb-field textarea:focus { outline:none; border-color:var(--sky); background:#fff; }
.rb-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.rb-hint { display:block; margin-top:6px; color:var(--muted); font-size:12.5px; }
.rb-card .btn-block { margin-top:6px; }

.rb-result { margin-top:24px; }
.rb-result-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.rb-result-head h2 { font-size:20px; font-weight:700; }
.rb-ats { background:var(--sky-soft); color:var(--sky-deep); font-weight:700; font-size:13px; padding:5px 12px; border-radius:999px; }
.rb-preview { border:1px solid var(--line); border-radius:14px; background:#fff; padding:26px; margin-bottom:16px; }
.rb-doc-name { font-size:24px; font-weight:700; }
.rb-doc-role { color:var(--sky-deep); font-weight:600; margin-top:2px; }
.rb-doc-meta { color:var(--muted); font-size:13.5px; margin-top:4px; }
.rb-doc-sec { text-transform:uppercase; letter-spacing:.04em; font-size:12.5px; font-weight:700; color:var(--sky-deep); margin:16px 0 6px; border-bottom:1px solid var(--line); padding-bottom:4px; }
.rb-doc p { margin:4px 0; line-height:1.5; }
.rb-doc-job { margin:8px 0; }
.rb-doc-dates { color:var(--muted); font-size:12.5px; font-weight:400; margin-left:8px; }
.rb-doc ul { margin:4px 0 4px 18px; }
.rb-doc li { margin:2px 0; line-height:1.45; }
.rb-downloads { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.rb-dl-label { font-weight:600; color:var(--ink); }
.rb-signin-note { text-align:center; margin-top:16px; color:var(--body); }
.rb-signin-note a { color:var(--sky-deep); font-weight:600; }
@media (max-width:560px){ .rb-grid2 { grid-template-columns:1fr; } .rb-hero h1 { font-size:25px; } }

/* ===== AI assistant (assistant.php) ===== */
.as-wrap { max-width:720px; padding:26px 0 120px; }
.as-hero { text-align:center; margin-bottom:18px; }
.as-hero h1 { font-size:28px; font-weight:700; letter-spacing:-.02em; margin-bottom:8px; }
.as-hero p { color:var(--body); max-width:560px; margin:0 auto; line-height:1.5; font-size:14.5px; }
.as-chat { display:flex; flex-direction:column; gap:12px; margin-bottom:14px; }
.as-msg { display:flex; }
.as-msg.me { justify-content:flex-end; }
.as-bubble { max-width:80%; padding:11px 14px; border-radius:14px; line-height:1.5; font-size:14.5px; }
.as-msg.bot .as-bubble { background:#fff; border:1px solid var(--line); border-bottom-left-radius:4px; }
.as-msg.me .as-bubble { background:var(--sky); color:#fff; border-bottom-right-radius:4px; }
.as-suggests { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.as-chip { background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 14px; font-family:'Montserrat'; font-size:13px; color:var(--ink); cursor:pointer; transition:.14s; }
.as-chip:hover { border-color:var(--sky); color:var(--sky-deep); }
.as-inputbar {
  position:sticky; bottom:14px; display:flex; gap:8px; align-items:flex-end;
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:8px 8px 8px 14px;
  box-shadow:0 6px 20px rgba(17,17,19,.06);
}
.as-inputbar textarea {
  flex:1; border:0; outline:none; resize:none; font-family:'Montserrat'; font-size:15px;
  color:var(--ink); background:transparent; max-height:160px; line-height:1.45; padding:6px 0;
}
.as-send {
  flex:0 0 auto; width:38px; height:38px; border-radius:50%; border:0; cursor:pointer;
  background:var(--sky); color:#fff; font-size:18px; display:grid; place-items:center;
}
.as-send:hover { background:var(--sky-deep); }
.as-send:disabled { opacity:.5; cursor:default; }
.as-disclaimer { text-align:center; color:var(--muted); font-size:12px; margin-top:8px; }

/* ===== Homepage learning feed ===== */
.hub-feed-section { margin-top:44px; }
.hub-feed-head { text-align:center; margin-bottom:18px; }
.hub-feed-head h2 { font-size:23px; font-weight:700; letter-spacing:-.01em; margin-bottom:4px; }
.hub-feed-head p { font-size:14.5px; }
/* On the homepage, present the feed as a responsive multi-column grid. */
#homeFeed { display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; padding:0 0 40px; }
#homeFeed .ig-card { height:100%; }
@media (max-width:900px){ #homeFeed { grid-template-columns:1fr 1fr; } }
@media (max-width:680px){ #homeFeed { grid-template-columns:1fr; } }

/* ===== Job pre-application form (jobs-apply.php) ===== */
.ja-wrap { max-width:640px; padding:24px 0 80px; }
.ja-back { color:var(--muted); text-decoration:none; font-size:14px; }
.ja-back:hover { color:var(--ink); }
.ja-head { margin:14px 0 18px; }
.ja-head h1 { font-size:26px; font-weight:700; margin-bottom:6px; }
.ja-head p { color:var(--body); line-height:1.5; }
.ja-jobline { margin-top:10px; padding:10px 14px; background:var(--sky-soft); border-radius:10px; color:var(--ink); }
.ja-form { background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px; }
.ja-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ja-money { display:flex; align-items:center; border:1px solid var(--line); border-radius:10px; background:var(--mist); overflow:hidden; }
.ja-money span { padding:0 10px; color:var(--muted); }
.ja-money input { border:0; background:transparent; padding:11px 10px 11px 0; width:100%; font-family:'Montserrat'; font-size:14.5px; }
.ja-money input:focus { outline:none; }
.ja-select { width:100%; border:1px solid var(--line); border-radius:10px; padding:11px 13px; font-family:'Montserrat'; font-size:14.5px; background:var(--mist); }
.ja-consent { display:flex; gap:10px; align-items:flex-start; margin:14px 0 4px; font-size:13.5px; color:var(--body); line-height:1.5; }
.ja-consent input { margin-top:3px; flex:0 0 auto; }
.ja-consent-2 { margin-bottom:14px; }
.ja-msg { margin-top:12px; font-size:14px; text-align:center; }
.ja-msg.ok { color:var(--signal); }
.ja-msg.err { color:var(--danger); }
.ja-fine { margin-top:12px; font-size:12px; color:var(--muted); text-align:center; }
@media (max-width:560px){ .ja-grid2 { grid-template-columns:1fr; } }