:root {
  --navy: #294a5d;
  --navy-dark: #1f3949;
  --blue: #1689f7;
  --blue-dark: #0666c4;
  --gold: #e3b529;
  --ink: #102230;
  --muted: #6b7b88;
  --line: #dce5eb;
  --paper: #f4f8fb;
  --white: #fff;
  --shadow: 0 20px 60px rgba(16, 34, 48, .14);
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 15px;
  --fs-body: 16px;
  --fs-lead: clamp(16px, 1.6vw, 20px);
  --fs-card-title: clamp(24px, 3vw, 34px);
  --fs-section-title: clamp(28px, 3.4vw, 42px);
  --fs-page-title: clamp(34px, 4vw, 54px);
  --fs-hero-title: clamp(46px, 6.6vw, 78px);
  --fs-display-title: clamp(42px, 6vw, 70px);
  --fs-button: 15px;
}

* { box-sizing: border-box; }
html { max-width: 100%; overflow-x: hidden; scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, Arial, sans-serif;
  font-size: var(--fs-body);
  -webkit-font-smoothing: antialiased;
  max-width: 100%;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }

.concept-switcher {
  min-height: 42px;
  padding: 6px clamp(18px, 5vw, 74px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  color: #d8e6ef;
  background: #142938;
  position: sticky;
  top: 0;
  z-index: 40;
}
.switcher-title {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.switcher-title span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #72d1ff;
  box-shadow: 0 0 0 4px rgba(114, 209, 255, .15);
}
.switcher-actions {
  display: flex;
  gap: 6px;
}
.switcher-actions button {
  border: 0;
  border-radius: 999px;
  padding: 8px 14px;
  color: #a9c4d8;
  background: transparent;
  font-size: 11px;
  font-weight: 800;
}
.switcher-actions button.active {
  color: #0e2535;
  background: white;
}

.site-header {
  min-height: 72px;
  padding: 0 clamp(18px, 5vw, 74px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--navy);
}
.brand img {
  width: 188px;
  display: block;
  background: transparent;
}
.market-strip {
  min-height: 44px;
  padding: 0 clamp(18px, 5vw, 74px);
  display: flex;
  justify-content: center;
  gap: 8px;
  background: #203f52;
  box-shadow: inset 0 1px rgba(255,255,255,.05);
}
.market-strip a {
  min-width: 120px;
  padding: 14px 16px 12px;
  color: #cfe2ee;
  text-align: center;
  font-size: 12px;
  font-weight: 850;
  border-bottom: 3px solid transparent;
}
.market-strip a:hover,
.market-strip a.active {
  color: white;
  border-bottom-color: var(--blue);
  background: rgba(255,255,255,.05);
}
.market-strip {
  display: none !important;
}
.desktop-nav {
  display: flex;
  align-items: center;
  gap: 26px;
  color: #dbe8ef;
  font-size: 13px;
  font-weight: 600;
}
.desktop-nav a:hover { color: white; }
.header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  color: white;
  font-size: 13px;
  font-weight: 700;
}
.header-actions button,
.header-button {
  border: 0;
  border-radius: 10px;
  padding: 11px 15px;
  color: var(--navy-dark);
  background: white;
  font-weight: 800;
}

.concept { display: none; max-width: 100%; overflow-x: hidden; }
.concept.active { display: block; animation: fade .25s ease; }
@keyframes fade { from { opacity: 0; transform: translateY(4px); } }

.hero {
  min-height: 680px;
  padding: clamp(54px, 8vw, 96px) clamp(18px, 6vw, 86px);
  position: relative;
  overflow: hidden;
}
.eyebrow {
  margin: 0 0 14px;
  color: var(--blue);
  font-size: var(--fs-xs);
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
h1, h2, h3, p { margin-top: 0; }
.hero h1 {
  max-width: 780px;
  margin-bottom: 22px;
  font-size: var(--fs-hero-title);
  line-height: 1;
  letter-spacing: -.055em;
}
.lead {
  max-width: 650px;
  color: #506575;
  font-size: var(--fs-lead);
  line-height: 1.65;
}

.hero-marketplace {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  align-items: center;
  gap: 5vw;
  background:
    radial-gradient(circle at 86% 24%, rgba(22, 137, 247, .15), transparent 28%),
    linear-gradient(180deg, white, #eef6fc);
}
.hero-search {
  max-width: 760px;
  margin: 34px 0 24px;
  padding: 8px;
  display: grid;
  grid-template-columns: 1fr 1fr 132px;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: white;
  box-shadow: var(--shadow);
}
.hero-search label {
  padding: 11px 14px;
  border-right: 1px solid var(--line);
}
.hero-search label:nth-child(2) { border-right: 0; }
.hero-search span {
  display: block;
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.hero-search input {
  width: 100%;
  border: 0;
  outline: 0;
  color: var(--ink);
  font-weight: 700;
}
.hero-search button,
.primary,
.demand-banner a {
  border: 0;
  border-radius: 12px;
  color: white;
  background: var(--blue);
  font-weight: 900;
  text-transform: uppercase;
}
.hero-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.hero-ctas a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 52px;
  padding: 0 20px;
  border-radius: 12px;
  font-weight: 900;
}
.hero-ctas button {
  min-height: 52px;
  padding: 0 20px;
  border-radius: 12px;
  font-weight: 900;
}
.secondary {
  border: 2px solid var(--navy-dark);
  color: var(--navy-dark);
  background: white;
}
.cta-button.secondary {
  border-color: white;
}
.tertiary {
  color: var(--navy-dark);
  background: #d8e9f5;
}
.hero-card-stack {
  min-height: 540px;
  position: relative;
}
.hero-card {
  border-radius: 28px;
  background: white;
  box-shadow: var(--shadow);
}
.hero-card.main {
  width: min(440px, 100%);
  margin: 30px auto 0;
  overflow: hidden;
}
.hero-card.main img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  object-position: center;
  display: block;
}
.hero-card.main div {
  padding: 24px;
}
.hero-card.main b,
.hero-card.main span { display: block; }
.hero-card.main b {
  font-size: 26px;
}
.hero-card.main span { color: var(--muted); margin-top: 5px; }
.hero-card.floating {
  position: absolute;
  padding: 22px;
  min-width: 154px;
}
.hero-card.floating strong,
.hero-card.floating span { display: block; }
.hero-card.floating strong {
  color: var(--blue);
  font-size: 31px;
}
.hero-card.floating span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.hero-card.top { right: 6%; top: 0; }
.hero-card.bottom { left: 0; bottom: 50px; }

.quick-paths {
  padding: 26px clamp(18px, 6vw, 86px);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  background: var(--blue);
}
.quick-paths a {
  padding: 22px;
  border-radius: 18px;
  color: white;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
}
.quick-paths span,
.quick-paths b,
.quick-paths small { display: block; }
.quick-paths span {
  margin-bottom: 20px;
  color: #bfe4ff;
  font-weight: 900;
}
.quick-paths b { font-size: 18px; }
.quick-paths small {
  margin-top: 7px;
  color: #dbeeff;
  line-height: 1.45;
}

.hero-local {
  min-height: 640px;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  align-items: center;
  gap: 6vw;
  color: white;
  background:
    linear-gradient(90deg, rgba(31,57,73,.92), rgba(31,57,73,.74)),
    url("assets/footer-banner.png") center/cover;
}
.hero-local .eyebrow { color: #9ed7ff; }
.hero-local .lead { color: #dcecf6; }
.local-photo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.local-photo-grid img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 22px;
  box-shadow: 0 20px 50px rgba(0,0,0,.24);
}
.local-photo-grid img:nth-child(2),
.local-photo-grid img:nth-child(3) { transform: translateY(34px); }
.local-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}
.local-actions a {
  padding: 15px 19px;
  border-radius: 999px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.local-actions a:nth-child(2) { background: white; color: var(--navy-dark); }
.local-actions a:nth-child(3) { background: var(--gold); color: #172d3b; }
.proof-row {
  margin-top: 34px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.proof-row span {
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 15px;
  background: rgba(255,255,255,.1);
}
.proof-row b { display: block; color: #fff; }

.blue-panel {
  padding: 68px clamp(18px, 6vw, 86px);
  color: white;
  background: var(--blue);
}
.section-heading {
  max-width: 840px;
  margin: 0 auto 34px;
  text-align: center;
}
.section-heading span {
  display: block;
  margin-bottom: 8px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.section-heading h2 {
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.05;
  letter-spacing: -.04em;
}
.section-heading.light span,
.section-heading.light h2 { color: white; }
.feature-icons {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
  max-width: 1180px;
  margin: auto;
}
.feature-icons article {
  padding: 20px;
  text-align: center;
}
.feature-icons i {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  margin: 0 auto 14px;
  border: 2px solid rgba(255,255,255,.6);
  border-radius: 22px;
  font-style: normal;
  font-size: 28px;
  font-weight: 900;
}
.feature-icons b,
.feature-icons small { display: block; }
.feature-icons small {
  margin-top: 7px;
  color: #d7ecff;
  line-height: 1.45;
}

.hero-vision {
  display: grid;
  grid-template-columns: .86fr 1.14fr;
  align-items: center;
  gap: 5vw;
  color: white;
  background:
    radial-gradient(circle at 82% 18%, rgba(22,137,247,.45), transparent 28%),
    linear-gradient(135deg, #142938, #2b5368);
}
.hero-vision .eyebrow { color: #8bd2ff; }
.hero-vision h1 {
  max-width: 650px;
}
.hero-vision .lead { color: #d3e5ef; }
.path-summary {
  margin-top: 22px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  max-width: 600px;
}
.path-summary span {
  padding: 14px;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 16px;
  background: rgba(255,255,255,.07);
}
.path-summary b,
.path-summary small {
  display: block;
}
.path-summary small {
  margin-top: 5px;
  color: #c8ddeb;
  line-height: 1.4;
}
.metric-strip {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  max-width: 500px;
}
.metric-strip span {
  padding: 17px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 18px;
  background: rgba(255,255,255,.08);
}
.metric-strip b,
.metric-strip small { display: block; }
.metric-strip b {
  font-size: 31px;
}
.metric-strip small {
  color: #c8ddeb;
}
.product-preview {
  padding: 16px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 30px;
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(16px);
  box-shadow: 0 30px 90px rgba(0,0,0,.25);
}
.browser-top {
  display: flex;
  gap: 7px;
  padding: 8px 7px 17px;
}
.browser-top span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ff6b5f;
}
.browser-top span:nth-child(2) { background: #ffc54d; }
.browser-top span:nth-child(3) { background: #4bd37b; }
.preview-search {
  padding: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 18px;
  color: var(--ink);
  background: white;
}
.directory-tabs {
  margin: 12px 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.directory-tabs button,
.directory-tabs a {
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 12px;
  padding: 11px;
  color: white;
  background: rgba(255,255,255,.08);
  font-weight: 900;
  text-align: center;
}
.directory-tabs button.active,
.directory-tabs a.active {
  color: var(--ink);
  background: white;
}

.prototype-page {
  min-height: calc(100vh - 72px);
  background: #f4f8fb;
}
.page-hero {
  padding: 52px clamp(20px, 6vw, 86px) 34px;
  color: white;
  background:
    radial-gradient(circle at 84% 0%, rgba(22,137,247,.34), transparent 32%),
    linear-gradient(135deg, #102838, #28566e);
}
.page-hero.centered {
  text-align: center;
}
.page-hero.centered h1,
.page-hero.centered .lead {
  margin-left: auto;
  margin-right: auto;
}
.page-hero h1 {
  max-width: 860px;
  margin-bottom: 18px;
  font-size: var(--fs-page-title);
  line-height: 1.02;
  letter-spacing: -.052em;
}
.page-hero .lead {
  color: #d3e5ef;
}
.split-hero {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: end;
  gap: 34px;
}
.directory-switch {
  min-width: 560px;
  padding: 8px;
  display: grid;
  grid-template-columns: .7fr 1.05fr 1.2fr 1.55fr;
  gap: 5px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  background: rgba(255,255,255,.1);
}
.directory-switch a {
  padding: 12px 8px;
  border-radius: 11px;
  color: white;
  text-align: center;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.directory-switch a.active {
  color: var(--ink);
  background: white;
}
.hero-note-card {
  min-width: 320px;
  max-width: 420px;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 22px;
  color: white;
  background: rgba(255,255,255,.1);
}
.hero-note-card b,
.hero-note-card span {
  display: block;
}
.hero-note-card b {
  margin-bottom: 8px;
  font-size: 28px;
}
.hero-note-card span {
  color: #d3e5ef;
  line-height: 1.55;
}
.search-panel {
  margin: -24px clamp(20px, 6vw, 86px) 22px;
  padding: 10px;
  display: grid;
  grid-template-columns: 1fr 1fr 170px 150px;
  gap: 8px;
  border-radius: 18px;
  background: white;
  box-shadow: var(--shadow);
  position: relative;
  z-index: 2;
}
.coupon-search {
  margin-bottom: 28px;
}
.search-panel label {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.search-panel span {
  display: block;
  color: var(--blue);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}
.search-panel input,
.search-panel select {
  width: 100%;
  margin-top: 5px;
  border: 0;
  outline: 0;
  background: transparent;
  font-weight: 800;
}
.search-panel button,
.page-submit,
.large-action-card button,
.coupon-grid button,
.card-action {
  border: 0;
  border-radius: 12px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.job-search-block,
.coupon-search-wrap {
  margin: -28px clamp(20px, 6vw, 86px) 28px;
  padding: 24px;
  position: relative;
  z-index: 2;
  border: 1px solid rgba(22,137,247,.16);
  border-radius: 28px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(239,248,255,.98));
  box-shadow: 0 22px 65px rgba(16,34,48,.13);
}
.search-copy {
  margin-bottom: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(300px, 430px);
  align-items: start;
  column-gap: 34px;
  row-gap: 6px;
}
.search-copy span,
.coupon-search-wrap > div:first-child span {
  display: block;
  color: var(--blue);
  font-size: var(--fs-xs);
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.search-copy span {
  grid-column: 1;
}
.search-copy h2,
.coupon-search-wrap h2 {
  margin: 0;
  font-size: clamp(30px, 3vw, 44px);
  line-height: 1.06;
  letter-spacing: -.045em;
}
.search-copy h2 {
  grid-column: 1;
  max-width: 760px;
}
.search-copy p {
  grid-column: 2;
  grid-row: 1 / span 2;
  margin: 4px 0 0;
  padding-left: 24px;
  border-left: 1px solid #d5e6f2;
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: 1.5;
}
.search-panel-strong,
.coupon-search-wrap .search-panel {
  margin: 0;
  box-shadow: inset 0 0 0 1px #d5e6f2;
}
.coupon-search-wrap {
  background:
    radial-gradient(circle at 96% 8%, rgba(22,137,247,.12), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(239,248,255,.98));
}
.search-context {
  margin: 0 clamp(20px, 6vw, 86px) 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.search-context span {
  padding: 9px 12px;
  border: 1px solid #d8e6ef;
  border-radius: 999px;
  color: #365063;
  background: white;
  font-size: 12px;
  font-weight: 850;
}
.local-search-summary {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.local-search-summary span {
  padding: 10px 13px;
  border: 1px solid #d8e6ef;
  border-radius: 999px;
  color: #365063;
  background: white;
  font-size: 13px;
  font-weight: 850;
}
.local-search-summary b {
  color: var(--blue);
  margin-right: 6px;
}
.directory-layout {
  padding: 0 clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: 230px 1fr 330px;
  gap: 18px;
  align-items: start;
}
.jobs-layout {
  grid-template-columns: 230px minmax(0, 1fr) 300px;
}
.filter-card,
.results-stack,
.map-card,
.detail-main,
.apply-card,
.registration-card-page,
.large-action-card,
.coupon-grid article {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: white;
  box-shadow: 0 14px 40px rgba(16,34,48,.06);
}
.filter-card {
  padding: 20px;
}
.filter-heading {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
}
.filter-heading button {
  border: 0;
  color: var(--blue);
  background: transparent;
  font-weight: 900;
}
.filter-check {
  padding: 9px 0;
  display: flex;
  gap: 8px;
  color: #395063;
  font-weight: 700;
}
.filter-check span {
  margin-left: auto;
  color: var(--muted);
}
.filter-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.filter-tags button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 10px;
  background: #f5f9fc;
  font-size: 12px;
}
.filter-tags button.active {
  border-color: rgba(22,137,247,.45);
  color: white;
  background: var(--blue);
}
.results-stack {
  padding: 22px;
}
.results-top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 16px;
}
.results-top b,
.results-top span {
  display: block;
}
.results-top span {
  color: var(--muted);
}
.results-top a {
  color: var(--blue);
  font-weight: 900;
}
.results-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}
.results-actions a {
  padding: 10px 12px;
  border-radius: 999px;
  background: #eef7ff;
}
.result-card {
  padding: 18px 0;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 14px;
  align-items: center;
  border-top: 1px solid var(--line);
}
.result-card img {
  width: 54px;
  height: 54px;
  object-fit: contain;
}
.result-card h2 {
  margin: 4px 0;
  font-size: 20px;
}
.result-card p {
  color: var(--muted);
}
.inline-job-actions {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.inline-job-actions a,
.inline-job-actions button {
  min-height: 38px;
  padding: 0 12px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 900;
}
.inline-job-actions a {
  color: white;
  background: var(--navy);
}
.inline-job-actions button {
  color: var(--navy);
  background: #e9f2f8;
}
.label {
  color: var(--blue);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.job-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.job-tags span {
  padding: 6px 8px;
  border-radius: 999px;
  color: #365063;
  background: #edf4f8;
  font-size: 12px;
  font-weight: 800;
}
.map-card {
  overflow: hidden;
}
.map-card img {
  width: 100%;
  height: 290px;
  object-fit: cover;
  display: block;
}
.jobs-map-card img {
  height: 220px;
}
.jobs-map-card .map-enlarge {
  width: calc(100% - 36px);
  min-height: 42px;
  margin: 0 18px 18px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: var(--navy);
  background: #e8f1f7;
  font-weight: 900;
}
.map-card div {
  padding: 18px;
}
.map-card b,
.map-card span {
  display: block;
}
.map-card span {
  margin-top: 5px;
  color: var(--muted);
}
.back-link {
  display: inline-block;
  margin: 36px clamp(20px, 6vw, 86px) 0;
  color: var(--blue);
  font-weight: 900;
}
.detail-layout-page {
  padding: 28px clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: 1fr 330px;
  gap: 22px;
}
.detail-layout-enhanced {
  grid-template-columns: minmax(0, 1fr) 390px;
}
.detail-main {
  padding: 34px;
}
.detail-title {
  display: flex;
  gap: 18px;
  align-items: center;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}
.detail-title img {
  width: 70px;
}
.detail-title h1 {
  margin: 0;
  font-size: clamp(34px, 5vw, 58px);
  letter-spacing: -.05em;
}
.rating-row {
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #dca900;
  font-weight: 900;
}
.rating-row small {
  color: var(--muted);
}
.detail-action-row {
  margin: 22px 0;
  padding: 14px;
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 10px;
  border-radius: 18px;
  background: #f2f8fc;
}
.detail-action-row a,
.detail-action-row button {
  min-height: 52px;
  border: 0;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-weight: 900;
}
.detail-action-row .apply-now {
  color: white;
  background: var(--blue);
}
.detail-action-row button {
  color: var(--navy);
  background: white;
}
.detail-meta {
  margin: 24px 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.detail-meta span {
  padding: 16px;
  border-radius: 14px;
  background: #f3f8fb;
}
.detail-meta b {
  display: block;
  color: var(--blue);
  font-size: 11px;
  text-transform: uppercase;
}
.detail-main p,
.detail-main li {
  color: #4d6171;
  line-height: 1.75;
}
.review-card {
  margin-top: 26px;
  padding: 22px;
  border: 1px solid #d7e6f0;
  border-radius: 18px;
  background: #f8fcff;
}
.review-card div {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 10px;
}
.review-card b,
.review-card span {
  display: block;
}
.review-card span {
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
}
.review-card p {
  margin-bottom: 0;
}
.apply-card {
  padding: 24px;
  align-self: start;
  position: sticky;
  top: 20px;
}
.apply-card b {
  font-size: 24px;
}
.apply-card p,
.apply-card small {
  color: var(--muted);
  line-height: 1.55;
}
.detail-map {
  width: 100%;
  height: 230px;
  margin: 8px 0 8px;
  object-fit: cover;
  border-radius: 16px;
}
.apply-card a,
.apply-card button {
  width: 100%;
  margin-top: 12px;
  min-height: 50px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 12px;
  font-weight: 900;
}
.apply-card button {
  background: #e8f1f7;
}
.registration-page {
  padding-bottom: 80px;
}
.registration-card-page {
  max-width: 900px;
  margin: -18px auto 0;
  padding: 34px;
  position: relative;
  z-index: 2;
}
.form-layout-page {
  padding: 36px clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 330px;
  gap: 22px;
  align-items: start;
}
.form-panel,
.form-side-card,
.upload-card,
.coupon-hero-card,
.category-directory-grid article,
.how-grid article,
.about-story,
.category-search {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: white;
  box-shadow: 0 14px 40px rgba(16,34,48,.06);
}
.form-panel,
.form-side-card,
.upload-card {
  padding: 28px;
}
.form-section-title {
  margin-bottom: 18px;
}
.form-section-title span,
.form-panel label span,
.form-side-card span,
.upload-card span,
.category-directory-grid span,
.how-grid span,
.about-story span {
  display: block;
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.form-section-title h2,
.form-side-card h2,
.upload-card h2 {
  margin: 8px 0 0;
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1;
  letter-spacing: -.055em;
}
.form-panel label {
  display: block;
}
.field-grid {
  display: grid;
  gap: 14px;
}
.field-grid.two { grid-template-columns: repeat(2, 1fr); }
.field-grid.three { grid-template-columns: repeat(3, 1fr); }
.form-panel input,
.form-panel select,
.form-panel textarea,
.category-search input {
  width: 100%;
  min-height: 54px;
  margin-top: 8px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fbfd;
  font-weight: 750;
}
.form-panel textarea {
  min-height: 120px;
  padding-top: 14px;
  resize: vertical;
}
.form-map {
  width: 100%;
  height: 220px;
  margin: 16px 0;
  object-fit: cover;
  border-radius: 16px;
}
.posting-steps {
  margin: -26px clamp(20px, 6vw, 86px) 24px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  position: relative;
  z-index: 2;
}
.posting-steps article,
.posting-steps a {
  padding: 18px;
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 4px 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 20px;
  color: inherit;
  background: white;
  box-shadow: 0 14px 36px rgba(16,34,48,.07);
}
.posting-steps article.active,
.posting-steps a.active {
  border-color: rgba(22,137,247,.36);
}
.posting-steps span {
  width: 42px;
  height: 42px;
  grid-row: span 2;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.posting-steps b {
  color: var(--ink);
  font-size: 15px;
}
.posting-steps small {
  color: var(--muted);
  line-height: 1.4;
}
.job-post-builder {
  padding: 0 clamp(20px, 6vw, 86px) 24px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 22px;
  align-items: start;
}
.job-post-main {
  display: grid;
  gap: 26px;
}
.job-step-block + .job-step-block {
  padding-top: 26px;
  border-top: 1px solid var(--line);
}
.location-preview {
  margin-top: 4px;
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
}
.location-preview .form-map {
  height: 190px;
  margin: 0;
}
.location-preview .choice-row {
  align-content: center;
}
.job-post-sidebar {
  top: 88px;
}
.post-support-cards {
  padding: 0 clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.post-support-cards article {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: white;
  box-shadow: 0 14px 40px rgba(16,34,48,.05);
}
.post-support-cards span {
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.post-support-cards h3 {
  margin: 10px 0;
  font-size: 24px;
  letter-spacing: -.04em;
}
.post-support-cards p {
  color: var(--muted);
  line-height: 1.6;
}
.choice-row {
  display: grid;
  gap: 10px;
}
.choice-row label {
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f7fbfd;
  font-weight: 800;
}
.choice-row input {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  accent-color: var(--blue);
}
.choice-row.compact label {
  font-size: 13px;
}
.form-side-card {
  position: sticky;
  top: 20px;
}
.form-side-card p,
.upload-card p {
  color: var(--muted);
  line-height: 1.65;
}
.form-side-card a,
.form-side-card button,
.upload-card button,
.category-search a,
.about-story a {
  width: 100%;
  min-height: 50px;
  margin-top: 12px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 12px;
  color: var(--navy);
  background: #e8f1f7;
  font-weight: 900;
}
.form-side-card .primary-fill,
.upload-card button,
.category-search a,
.about-story a {
  color: white;
  background: var(--blue);
}
.upload-card {
  min-height: 360px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  border-style: dashed;
  background: linear-gradient(145deg, white, #f0f8ff);
}
.applicant-flow {
  grid-template-columns: minmax(0, 1fr) 360px 330px;
}
.resume-builder {
  padding: 36px clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .78fr);
  gap: 22px;
  align-items: start;
}
.resume-profile-card,
.resume-upload-zone,
.resume-publish-card {
  border: 1px solid var(--line);
  border-radius: 28px;
  background: white;
  box-shadow: 0 18px 48px rgba(16,34,48,.07);
}
.resume-profile-card {
  padding: 32px;
  display: grid;
  gap: 18px;
}
.builder-kicker,
.builder-heading span,
.resume-upload-zone span,
.resume-publish-card span,
.resume-profile-card label span {
  display: block;
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.builder-kicker {
  width: max-content;
  padding: 8px 12px;
  border-radius: 999px;
  background: #edf7ff;
}
.builder-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 24px;
  align-items: end;
}
.builder-heading h2,
.resume-upload-zone h2,
.resume-publish-card h2 {
  margin: 8px 0 0;
  color: var(--ink);
  font-size: clamp(30px, 4vw, 46px);
  line-height: .98;
  letter-spacing: -.06em;
}
.builder-heading p,
.resume-upload-zone p,
.resume-upload-zone small,
.resume-publish-card p,
.publish-list small {
  color: var(--muted);
  line-height: 1.55;
}
.resume-profile-card input,
.resume-profile-card select,
.resume-profile-card textarea {
  width: 100%;
  min-height: 56px;
  margin-top: 8px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f8fbfd;
  font-weight: 750;
}
.resume-profile-card textarea {
  min-height: 132px;
  padding-top: 14px;
  resize: vertical;
}
.resume-upload-zone {
  padding: 34px;
  min-height: 360px;
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
  border-style: dashed;
  border-color: rgba(22,137,247,.32);
  background:
    radial-gradient(circle at 50% 0%, rgba(22,137,247,.12), transparent 34%),
    linear-gradient(145deg, #ffffff, #f2f9ff);
}
.upload-icon {
  width: 72px;
  height: 72px;
  margin-bottom: 18px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  color: white;
  background: linear-gradient(135deg, var(--blue), #36a7ff);
  box-shadow: 0 14px 28px rgba(22,137,247,.25);
  font-size: 34px;
  font-weight: 900;
}
.resume-upload-zone button,
.resume-publish-card a {
  width: 100%;
  min-height: 54px;
  margin-top: 18px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 14px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.resume-upload-zone small {
  margin-top: 14px;
  display: block;
  font-size: 13px;
}
.resume-publish-card {
  padding: 28px;
  position: sticky;
  top: 20px;
}
.publish-list {
  display: grid;
  gap: 12px;
  margin-top: 20px;
}
.publish-list label {
  padding: 14px;
  display: grid;
  grid-template-columns: 22px 1fr;
  column-gap: 12px;
  row-gap: 3px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f7fbfd;
  cursor: pointer;
}
.publish-list input {
  width: 22px;
  height: 22px;
  grid-row: span 2;
  accent-color: var(--blue);
}
.publish-list b {
  color: var(--ink);
  font-size: 14px;
}
.publish-list small {
  font-size: 13px;
}
.candidate-header {
  display: flex;
  gap: 18px;
  align-items: center;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--line);
}
.candidate-header img {
  width: 82px;
  height: 82px;
  border-radius: 50%;
}
.candidate-header h1 {
  margin: 0;
  font-size: clamp(42px, 6vw, 72px);
  letter-spacing: -.06em;
}
.large-tags {
  margin-top: 12px;
}
.coupon-detail-layout {
  padding: 36px clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 390px;
  gap: 22px;
  align-items: start;
}
.coupon-hero-card {
  overflow: hidden;
}
.coupon-hero-card img {
  width: 100%;
  height: 300px;
  object-fit: cover;
}
.coupon-hero-card > div {
  padding: 30px;
}
.coupon-hero-card h1 {
  margin-bottom: 12px;
  font-size: clamp(44px, 6vw, 72px);
  line-height: .95;
  letter-spacing: -.065em;
}
.coupon-hero-card p,
.coupon-terms p {
  color: var(--muted);
  line-height: 1.65;
}
.coupon-terms {
  grid-column: 1 / -1;
}
.category-search {
  margin: -28px clamp(20px, 6vw, 86px) 28px;
  padding: 18px;
  display: grid;
  grid-template-columns: 1fr 180px;
  gap: 14px;
  position: relative;
  z-index: 2;
}
.category-directory-grid,
.how-grid {
  padding: 0 clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.about-flow-grid {
  padding-top: 42px;
}
.category-directory-grid article,
.how-grid article {
  padding: 26px;
}
.category-directory-grid article {
  padding: 8px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.category-directory-grid p,
.how-grid p {
  color: #4e6271;
  line-height: 1.75;
}
.category-card-link {
  display: block;
  color: #4e6271;
  line-height: 1.75;
  text-decoration: none;
}
.category-card-link:hover {
  color: var(--blue);
}
.category-link-list {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}
.category-link-list a {
  padding: 9px 13px;
  border: 1px solid #d7e8f4;
  border-radius: 999px;
  color: #244659;
  background: white;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.2;
  text-decoration: none;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease;
}
.category-link-list a:hover {
  border-color: rgba(22,137,247,.45);
  color: white;
  background: var(--blue);
  transform: translateY(-1px);
}
.category-link-list.compact {
  justify-content: center;
  gap: 10px;
}
.category-link-list.compact a {
  padding: 9px 13px;
  font-size: 13px;
}
.how-grid h2,
.about-story h2 {
  margin: 10px 0;
  font-size: clamp(28px, 4vw, 44px);
  letter-spacing: -.055em;
}
.about-story {
  margin: 0 clamp(20px, 6vw, 86px) 80px;
  padding: 34px;
  display: grid;
  grid-template-columns: .8fr 1fr 220px;
  align-items: center;
  gap: 28px;
}
.about-story p {
  color: var(--muted);
  line-height: 1.75;
}
.management-grid {
  padding: 42px clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.management-card,
.status-card,
.legal-card {
  border: 1px solid var(--line);
  border-radius: 26px;
  background: white;
  box-shadow: 0 14px 40px rgba(16,34,48,.06);
}
.management-card {
  padding: 30px;
}
.management-card span,
.status-card span {
  display: block;
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.management-card h2 {
  margin: 12px 0;
  font-size: var(--fs-section-title);
  line-height: 1.06;
  letter-spacing: -.045em;
}
.management-card p {
  color: var(--muted);
  line-height: 1.65;
}
.management-card a,
.form-primary-link {
  min-height: 50px;
  margin-top: 16px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 12px;
  padding: 0 18px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.full-link {
  width: 100%;
  display: grid;
}
.mini-card-link {
  margin-top: 14px;
  display: inline-grid;
  place-items: center;
  min-height: 38px;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--blue);
  background: #eef7ff;
  font-size: 13px;
  font-weight: 900;
}
.featured-management {
  color: white;
  background: linear-gradient(145deg, var(--navy), var(--blue));
}
.featured-management span,
.featured-management p {
  color: #d9efff;
}
.featured-management a {
  color: var(--ink);
  background: white;
}
.status-page,
.legal-page {
  min-height: calc(100vh - 72px);
  padding: 70px clamp(20px, 6vw, 86px);
  display: grid;
  place-items: center;
}
.status-card,
.legal-card {
  width: min(960px, 100%);
  padding: clamp(32px, 6vw, 64px);
}
.status-card h1,
.legal-card h1 {
  max-width: 760px;
  margin: 12px 0 18px;
  font-size: var(--fs-display-title);
  line-height: 1;
  letter-spacing: -.052em;
}
.status-card p,
.legal-card p {
  color: var(--muted);
  font-size: 18px;
  line-height: 1.75;
}

.legal-blue-link {
  color: var(--blue);
  font-weight: 800;
  text-decoration: none;
}
.status-actions {
  margin-top: 26px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.status-actions a {
  min-height: 50px;
  padding: 0 18px;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.status-actions a:nth-child(2),
.status-actions a:nth-child(3) {
  color: var(--navy);
  background: #e8f1f7;
}
.legal-card h2 {
  margin-top: 28px;
  font-size: 28px;
}
.contact-layout {
  grid-template-columns: minmax(0, 1fr) 360px;
}
.auth-page {
  min-height: calc(100vh - 72px);
  display: grid;
  place-items: center;
  padding: 30px clamp(20px, 6vw, 86px);
  background:
    radial-gradient(circle at 80% 8%, rgba(22,137,247,.18), transparent 28%),
    linear-gradient(135deg, #f4f8fb, #eaf3f9);
}
.auth-shell {
  width: min(1120px, 100%);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) .95fr;
  gap: 24px;
  align-items: stretch;
}
.auth-card,
.auth-side {
  border: 1px solid var(--line);
  border-radius: 28px;
  box-shadow: 0 22px 65px rgba(16,34,48,.09);
}
.auth-card {
  padding: clamp(24px, 4vw, 38px);
  background: white;
  min-width: 0;
  overflow: hidden;
}
.auth-card h1 {
  max-width: 680px;
  margin-bottom: 10px;
  font-size: var(--fs-page-title);
  line-height: 1;
  letter-spacing: -.052em;
}
.auth-lead {
  max-width: 560px;
  color: var(--muted);
  font-size: var(--fs-base);
  line-height: 1.55;
}
.auth-form {
  margin-top: 18px;
  display: grid;
  gap: 10px;
  min-width: 0;
}
.auth-form > *,
.auth-form label {
  min-width: 0;
}
.auth-form label span {
  display: block;
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.auth-form input {
  width: 100%;
  max-width: 100%;
  min-height: 50px;
  margin-top: 8px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fbfd;
  font-weight: 750;
}
.auth-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
}
.auth-row label {
  display: flex;
  align-items: center;
  gap: 8px;
}
.auth-row input {
  width: 18px;
  min-height: 18px;
  margin: 0;
  accent-color: var(--blue);
}
.auth-row a,
.auth-switch a {
  color: var(--blue);
  font-weight: 900;
}
.auth-form > button {
  min-height: 58px;
  border: 0;
  border-radius: 12px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.auth-switch {
  margin: 14px 0 0;
  color: var(--muted);
}
.auth-side {
  padding: clamp(26px, 4vw, 40px);
  color: white;
  background:
    radial-gradient(circle at 90% 10%, rgba(22,137,247,.38), transparent 32%),
    linear-gradient(145deg, #142938, #2d5d76);
}
.auth-side span {
  color: #8bd2ff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.auth-side h2 {
  margin: 14px 0;
  font-size: clamp(34px, 4.6vw, 52px);
  line-height: 1;
  letter-spacing: -.055em;
}
.auth-side p {
  color: #d3e5ef;
  font-size: 16px;
  line-height: 1.55;
}
.auth-options {
  margin: 4px 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.auth-card .light-options label {
  color: var(--ink);
  border-color: var(--line);
  background: #f7fbfd;
}
.auth-card .light-options input {
  border-color: #8ea1b1;
  background: white;
}
.auth-card .field-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.register-card .auth-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.register-card .auth-options label {
  min-height: 46px;
  padding: 9px 11px;
  align-items: center;
  border-radius: 13px;
  font-size: 13px;
  line-height: 1.25;
  white-space: normal;
}
.register-card .auth-options input {
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 0;
  flex: 0 0 18px;
  padding: 0;
  border-width: 2px;
}
.light-options label {
  color: var(--ink);
  border-color: var(--line);
  background: #f7fbfd;
}
.page-form-label {
  display: block;
  margin-top: 24px;
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}
.page-email {
  width: 100%;
  height: 58px;
  margin-top: 8px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.page-submit {
  width: 100%;
  height: 58px;
  margin-top: 16px;
  display: grid;
  place-items: center;
  border: 0;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.two-column-cards,
.coupon-grid {
  padding: 0 clamp(20px, 6vw, 86px) 80px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
}
.resume-actions-section {
  padding-top: 44px;
}
.toolbox-grid,
.coupon-tools,
.section-link-row {
  padding: 0 clamp(20px, 6vw, 86px) 76px;
  display: grid;
  gap: 18px;
}
.toolbox-grid,
.coupon-tools {
  grid-template-columns: repeat(3, 1fr);
}
.toolbox-grid article,
.coupon-tools article,
.section-link-row a {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: white;
  box-shadow: 0 14px 40px rgba(16,34,48,.05);
}
.toolbox-grid span,
.coupon-tools span {
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.toolbox-grid h2,
.coupon-tools b {
  display: block;
  margin: 10px 0 8px;
  color: var(--ink);
  font-size: 24px;
  letter-spacing: -.03em;
}
.toolbox-grid p,
.coupon-tools p,
.section-link-row span {
  color: var(--muted);
  line-height: 1.6;
}
.section-link-row {
  max-width: 1120px;
  margin: 22px auto 0;
  padding: 0;
  grid-template-columns: repeat(3, 1fr);
}
.section-link-row a {
  display: block;
}
.section-link-row b,
.section-link-row span {
  display: block;
}
.section-link-row b {
  color: var(--ink);
  font-size: 18px;
}
.large-action-card {
  min-height: 330px;
  padding: 34px;
}
.large-action-card span,
.coupon-grid span {
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.large-action-card h2 {
  margin: 12px 0;
  font-size: clamp(34px, 5vw, 56px);
  letter-spacing: -.05em;
}
.large-action-card p {
  color: var(--muted);
  line-height: 1.65;
}
.large-action-card button,
.large-action-card .card-action {
  margin-top: 18px;
  padding: 15px 20px;
}
.large-action-card.accent {
  color: white;
  background: linear-gradient(145deg, var(--navy), var(--blue));
}
.large-action-card.accent span,
.large-action-card.accent p {
  color: #d9efff;
}
.coupon-grid {
  grid-template-columns: repeat(3, 1fr);
}
.grid-section-title {
  grid-column: 1 / -1;
  margin: 12px 0 0;
  color: var(--ink);
  font-size: clamp(28px, 4vw, 42px);
  letter-spacing: -.055em;
}
.coupon-grid article {
  overflow: hidden;
}
.coupon-grid img {
  width: 100%;
  height: 210px;
  object-fit: cover;
}
.coupon-grid span,
.coupon-grid h2,
.coupon-grid button,
.coupon-grid .card-action {
  margin-left: 22px;
  margin-right: 22px;
}
.coupon-grid span {
  display: block;
  margin-top: 22px;
}
.coupon-grid h2 {
  min-height: 64px;
  font-size: 24px;
}
.coupon-grid button,
.coupon-grid .card-action {
  margin-bottom: 24px;
  padding: 13px 16px;
  display: inline-grid;
  place-items: center;
}
.preview-search button {
  border: 0;
  border-radius: 10px;
  padding: 11px 15px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}
.preview-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 12px 0;
}
.preview-grid article {
  padding: 17px;
  border-radius: 16px;
  color: var(--ink);
  background: white;
}
.company-dot {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-bottom: 16px;
  color: white;
  border-radius: 10px;
  background: var(--blue);
  font-weight: 900;
}
.company-dot.yellow { background: var(--gold); color: #173042; }
.company-dot.green { background: #1aa179; }
.preview-grid b,
.preview-grid small { display: block; }
.preview-grid small { margin-top: 5px; color: var(--muted); }
.preview-map {
  height: 240px;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
}
.preview-map img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.preview-map div {
  position: absolute;
  left: 18px;
  bottom: 18px;
  padding: 10px 13px;
  color: var(--ink);
  background: white;
  border-radius: 10px;
  font-weight: 900;
}

.content-band,
.categories {
  padding: 70px clamp(18px, 6vw, 86px);
  background: white;
}
.job-grid {
  max-width: 1120px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.job-card {
  padding: 22px;
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: white;
  box-shadow: 0 14px 40px rgba(31, 57, 73, .07);
}
.job-card img {
  width: 46px;
  height: 46px;
  object-fit: contain;
}
.job-card b,
.job-card span,
.job-card small { display: block; }
.job-card span { margin-top: 5px; color: var(--blue); font-weight: 700; }
.job-card small { margin-top: 8px; color: var(--muted); line-height: 1.45; }
.job-card button {
  grid-column: 2;
  justify-self: start;
  border: 0;
  border-radius: 8px;
  padding: 9px 13px;
  color: white;
  background: var(--navy);
  font-size: 12px;
  font-weight: 900;
}

.gallery-strip {
  padding: 20px clamp(18px, 6vw, 86px);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  background: var(--blue);
}
.gallery-strip img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 15px;
}

.category-grid {
  max-width: 1040px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
}
.category-grid div {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.category-grid h3 {
  margin: 0 0 14px;
  color: var(--blue);
  font-size: 15px;
  text-align: center;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.category-grid p {
  margin: 0;
  color: #4e6271;
  line-height: 1.75;
}

.demand-banner {
  min-height: 250px;
  padding: 55px clamp(18px, 6vw, 86px);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 35px;
  text-align: center;
  color: white;
  background:
    linear-gradient(rgba(41,74,93,.8), rgba(41,74,93,.8)),
    url("assets/footer-banner.png") center/cover;
}
.demand-banner h2 {
  margin-bottom: 8px;
  font-size: clamp(30px, 4vw, 46px);
}
.demand-banner p {
  margin-bottom: 0;
  color: #dbeaf3;
}
.demand-banner a {
  padding: 15px 22px;
  white-space: nowrap;
}

.site-footer {
  padding: 54px clamp(18px, 6vw, 86px);
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 30px;
  color: #d8e6ef;
  background: var(--navy);
}
.site-footer img { width: 170px; }
.site-footer p {
  max-width: 260px;
  color: #aac1cf;
  line-height: 1.55;
}
.site-footer nav {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.site-footer a:hover { color: white; }
.site-footer label {
  display: block;
  margin-bottom: 9px;
  color: white;
  font-weight: 900;
}
.site-footer form div {
  display: flex;
  overflow: hidden;
  border-radius: 12px;
  background: #1c3849;
}
.site-footer input {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  padding: 13px;
  color: white;
  background: transparent;
}
.site-footer button {
  width: 46px;
  border: 0;
  color: white;
  background: var(--blue);
}

.registration-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  place-items: center;
  padding: 24px;
}
.registration-modal.is-open {
  display: grid;
}
.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 18, 28, .62);
  backdrop-filter: blur(5px);
}
.registration-dialog {
  width: min(900px, 100%);
  max-height: calc(100vh - 48px);
  overflow: auto;
  position: relative;
  z-index: 1;
  padding: 0;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 28px;
  color: white;
  background:
    radial-gradient(circle at 82% -10%, rgba(22,137,247,.36), transparent 34%),
    radial-gradient(circle at 2% 100%, rgba(50,178,126,.16), transparent 28%),
    linear-gradient(145deg, #0d2535, #254b61);
  box-shadow: 0 28px 90px rgba(0,0,0,.35);
}
.modal-close {
  position: absolute;
  right: 18px;
  top: 18px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  color: rgba(255,255,255,.9);
  background: rgba(255,255,255,.1);
  font-size: 0;\n  line-height: 1;
  z-index: 3;
  cursor: pointer;
}
.modal-close:hover {
  background: rgba(255,255,255,.18);
}
.modal-brand {
  padding: 36px 48px 28px;
  display: grid;
  grid-template-columns: 72px 1fr;
  align-items: center;
  gap: 0 18px;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.modal-brand img {
  width: 72px;
  grid-row: 1 / 4;
}
.modal-brand .brand-symbol-crop {
  width: 78px;
  height: 78px;
  padding: 8px;
  border-radius: 24px;
  object-fit: cover;
  object-position: left center;
  background: rgba(255,255,255,.08);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}
.modal-brand span {
  width: fit-content;
  margin-bottom: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  color: #9ed7ff;
  background: rgba(255,255,255,.1);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.modal-brand h2 {
  margin: 0;
  font-size: clamp(32px, 4vw, 46px);
  letter-spacing: -.05em;
}
.modal-brand p {
  margin: 6px 0 0;
  color: #c9dce8;
  font-size: 17px;
  font-weight: 700;
}
.interest-form {
  padding: 30px 48px 40px;
}
.form-intro {
  margin-bottom: 22px;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
}
.interest-form h3 {
  margin: 0;
  color: white;
  font-size: 30px;
  letter-spacing: -.04em;
}
.form-intro p {
  max-width: 420px;
  margin: 0;
  color: #c9dce8;
  line-height: 1.5;
}
.interest-options {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.interest-options label {
  min-height: 58px;
  padding: 13px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 16px;
  color: white;
  background: rgba(255,255,255,.08);
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.interest-options label:hover {
  border-color: rgba(158,215,255,.7);
  background: rgba(22,137,247,.18);
  transform: translateY(-1px);
}
.interest-options input {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  display: grid;
  place-content: center;
  appearance: none;
  border: 2px solid rgba(255,255,255,.65);
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.interest-options input::before {
  content: "\2713";
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: white;
  font-size: 13px;
  font-weight: 900;
  opacity: 0;
  transform: scale(.65);
  transition: opacity .15s ease, transform .15s ease;
}
.interest-options input:checked {
  border-color: #33d17a;
  background: #20b86b;
  box-shadow: 0 0 0 4px rgba(32,184,107,.18);
}
.interest-options input:checked::before {
  opacity: 1;
  transform: scale(1);
}
.interest-options label:has(input:checked) {
  border-color: rgba(51,209,122,.75);
  background: rgba(32,184,107,.16);
  box-shadow: inset 0 0 0 1px rgba(51,209,122,.18);
}
.registration-card-page .form-intro p {
  color: var(--muted);
}
.registration-card-page .light-options label {
  color: var(--ink);
  border-color: var(--line);
  background: #f7fbfd;
}
.registration-card-page .light-options label:hover {
  border-color: rgba(22,137,247,.45);
  background: #edf7ff;
}
.registration-card-page .light-options input {
  border-color: #8ea1b1;
  background: white;
}
.registration-card-page .light-options label:has(input:checked) {
  border-color: rgba(32,184,107,.75);
  background: rgba(32,184,107,.1);
}
.email-label {
  display: block;
  margin: 24px 0 8px;
  color: #9ed7ff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.interest-form > input[type="email"] {
  width: 100%;
  height: 62px;
  padding: 0 18px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 14px;
  color: white;
  background: rgba(255,255,255,.1);
  font-size: 18px;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.interest-form > input[type="email"]::placeholder {
  color: rgba(255,255,255,.55);
}
.interest-form > input[type="email"]:focus {
  outline: 0;
  border-color: rgba(158,215,255,.85);
  background: rgba(255,255,255,.14);
  box-shadow: 0 0 0 4px rgba(22,137,247,.16);
}
.membership-option {
  width: 100%;
  margin: 14px 0 22px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: #dbeaf3;
  background: rgba(255,255,255,.06);
  font-size: 14px;
  font-weight: 900;
}
.membership-option:hover {
  border-color: rgba(158,215,255,.55);
  background: rgba(255,255,255,.1);
}
.membership-option span {
  width: 20px;
  height: 20px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 4px;
}
.membership-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.membership-option:has(input:checked) {
  border-color: rgba(51,209,122,.75);
  background: rgba(32,184,107,.16);
}
.membership-option:has(input:checked) span {
  border-color: #33d17a;
  background: #20b86b;
}
.modal-actions {
  padding-top: 4px;
  display: grid;
  grid-template-columns: 1fr 220px 1fr;
  align-items: center;
  gap: 20px;
}
.modal-actions span {
  color: #9ed7ff;
  font-size: 18px;
  font-weight: 900;
}
.modal-actions span:last-child {
  text-align: right;
}
.modal-actions button {
  min-height: 56px;
  border: 0;
  border-radius: 10px;
  color: white;
  background: var(--blue);
  box-shadow: 0 16px 36px rgba(22,137,247,.28);
  font-size: 15px;
  font-weight: 900;
  text-transform: uppercase;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.modal-actions button:hover {
  transform: translateY(-1px);
  background: #087ff0;
  box-shadow: 0 20px 42px rgba(22,137,247,.34);
}

body[data-variant="local"] .concept-switcher { background: #173042; }
body[data-variant="local"] .switcher-actions button.active { color: #172d3b; background: var(--gold); }

body[data-variant="vision"] .concept-switcher { background: #071823; }
body[data-variant="vision"] .switcher-actions button.active { color: white; background: var(--blue); }

@media (max-width: 980px) {
  .site-header {
    min-height: auto;
    padding-top: 14px;
    padding-bottom: 14px;
    flex-wrap: wrap;
    gap: 12px;
  }
  .desktop-nav {
    order: 3;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    gap: 18px;
    overflow-x: auto;
    padding: 4px 0 2px;
    white-space: nowrap;
    scrollbar-width: none;
  }
  .desktop-nav::-webkit-scrollbar { display: none; }
  .header-actions {
    margin-left: auto;
  }
  .market-strip {
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .market-strip::-webkit-scrollbar { display: none; }
  .market-strip a {
    flex: 0 0 auto;
    min-width: auto;
  }
  .hero-marketplace,
  .hero-local,
  .hero-vision {
    grid-template-columns: 1fr;
  }
  .product-preview {
    width: 100%;
    min-width: 0;
  }
  .quick-paths,
  .feature-icons,
  .job-grid,
  .category-grid,
  .site-footer {
    grid-template-columns: 1fr 1fr;
  }
  .preview-grid { grid-template-columns: 1fr; }
  .directory-layout {
    grid-template-columns: 220px 1fr;
  }
  .map-card {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .site-header {
    padding: 12px 16px 10px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    justify-content: stretch;
    align-items: center;
  }
  .brand {
    min-width: 0;
  }
  .brand img {
    width: min(150px, 100%);
  }
  .header-actions {
    display: flex;
    gap: 8px;
    justify-self: end;
    min-width: 0;
    margin-left: 0;
  }
  .header-actions a {
    font-size: 12px;
  }
  .header-actions button {
    min-height: 38px;
    padding: 0 14px;
    font-size: 12px;
  }
  .desktop-nav {
    grid-column: 1 / -1;
    width: 100%;
    max-width: calc(100vw - 32px);
    flex-wrap: wrap;
    overflow: visible;
    white-space: normal;
    gap: 16px;
    font-size: 13px;
  }
  .market-strip {
    padding: 0 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    overflow: visible;
  }
  .market-strip a {
    padding: 12px 12px 10px;
    font-size: 11px;
    white-space: normal;
  }
  .hero {
    min-height: auto;
    padding: 44px 18px;
    max-width: 100%;
    overflow: visible;
  }
  .hero h1 {
    max-width: 100%;
    font-size: 34px;
    line-height: 1.04;
    letter-spacing: -.055em;
    overflow-wrap: normal;
    word-break: normal;
    text-wrap: balance;
  }
  .hero-copy,
  .vision-copy {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .lead {
    max-width: 100%;
  }
  .hero-search {
    grid-template-columns: 1fr;
  }
  .hero-search label { border-right: 0; border-bottom: 1px solid var(--line); }
  .hero-search button { min-height: 48px; }
  .hero-ctas a,
  .hero-ctas button,
  .local-actions a {
    width: 100%;
  }
  .path-summary {
    grid-template-columns: 1fr;
  }
  .hero-card-stack { min-height: auto; }
  .hero-card.main img { height: 260px; }
  .hero-card.floating { position: static; margin: 12px 0 0; }
  .quick-paths,
  .feature-icons,
  .job-grid,
  .gallery-strip,
  .category-grid,
  .site-footer,
  .metric-strip,
  .toolbox-grid,
  .coupon-tools,
  .section-link-row {
    grid-template-columns: 1fr;
  }
  .product-preview {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 12px;
    border-radius: 22px;
    overflow: hidden;
  }
  .preview-search {
    max-width: 100%;
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }
  .preview-search button {
    width: 100%;
  }
  .directory-tabs {
    grid-template-columns: 1fr;
  }
  .preview-grid article,
  .preview-search b {
    min-width: 0;
    overflow-wrap: break-word;
  }
  .local-photo-grid { width: 100%; min-width: 0; grid-template-columns: 1fr; }
  .local-photo-grid img { min-width: 0; height: 160px; transform: none !important; }
  .proof-row { display: grid; grid-template-columns: 1fr; }
  .preview-map { height: 180px; }
  .content-band,
  .categories,
  .blue-panel {
    padding: 52px 18px;
  }
  .demand-banner {
    align-items: stretch;
    flex-direction: column;
  }
  .split-hero,
  .results-top {
    align-items: stretch;
    flex-direction: column;
  }
  .page-hero {
    padding: 46px 18px 34px;
  }
  .page-hero h1 {
    font-size: 38px;
  }
  .directory-switch {
    width: 100%;
  }
  .directory-switch,
  .search-panel,
  .job-search-block,
  .coupon-search-wrap,
  .directory-layout,
  .detail-layout-page,
  .detail-meta,
  .detail-action-row,
  .two-column-cards,
  .coupon-grid,
  .auth-shell,
  .auth-options,
  .management-grid,
  .posting-steps,
  .job-post-builder,
  .location-preview,
  .post-support-cards,
  .resume-builder,
  .form-layout-page,
  .field-grid.two,
  .field-grid.three,
  .applicant-flow,
  .coupon-detail-layout,
  .category-search,
  .category-directory-grid,
  .how-grid,
  .about-story {
    min-width: 0;
    grid-template-columns: 1fr;
  }
  .search-panel {
    margin-left: 18px;
    margin-right: 18px;
  }
  .job-search-block,
  .coupon-search-wrap {
    margin-left: 18px;
    margin-right: 18px;
    padding: 18px;
  }
  .search-copy {
    align-items: stretch;
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .search-copy span,
  .search-copy h2,
  .search-copy p {
    grid-column: 1;
    grid-row: auto;
  }
  .search-copy p {
    padding-left: 0;
    border-left: 0;
  }
  .coupon-search-wrap .search-panel,
  .job-search-block .search-panel {
    margin-left: 0;
    margin-right: 0;
  }
  .search-context {
    margin-left: 18px;
    margin-right: 18px;
  }
  .toolbox-grid,
  .coupon-tools,
  .auth-page,
  .management-grid,
  .posting-steps,
  .job-post-builder,
  .post-support-cards,
  .resume-builder,
  .form-layout-page,
  .coupon-detail-layout,
  .category-directory-grid,
  .how-grid,
  .about-story {
    padding-left: 18px;
    padding-right: 18px;
  }
  .builder-heading {
    grid-template-columns: 1fr;
  }
  .resume-publish-card {
    position: static;
  }
  .result-card {
    grid-template-columns: 48px 1fr;
  }
  .inline-job-actions {
    grid-column: auto;
  }
  .results-actions {
    justify-content: flex-start;
  }
  .jobs-map-card img,
  .detail-map,
  .form-map,
  .coupon-hero-card img {
    height: 220px;
  }
  .hero-note-card {
    min-width: 0;
    max-width: none;
  }
  .form-side-card {
    position: static;
  }
  .auth-page {
    display: block;
    padding: 36px 18px;
  }
  .auth-row {
    align-items: flex-start;
    flex-direction: column;
  }
  .coupon-terms {
    grid-column: auto;
  }
  .review-card div {
    display: block;
  }
  .registration-dialog {
    border-radius: 22px;
  }
  .modal-brand,
  .interest-form {
    padding-left: 20px;
    padding-right: 20px;
  }
  .modal-brand {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .modal-brand img {
    grid-row: auto;
    margin: auto;
  }
  .modal-brand span {
    margin: 14px auto 8px;
  }
  .modal-brand h2 {
    display: block;
    margin: 0;
  }
  .form-intro,
  .modal-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .interest-options {
    grid-template-columns: 1fr;
  }
  .modal-actions span,
  .modal-actions span:last-child {
    text-align: center;
  }
}

.old-inspired-page {
  background: #f7f7f8;
}

.directory-hero-classic {
  padding: 86px clamp(22px, 7vw, 120px) 78px;
  color: white;
  text-align: center;
  background: #2c5266;
}

.directory-hero-classic h1 {
  margin: 8px auto 18px;
  max-width: 940px;
  font-size: var(--fs-display-title);
  line-height: .95;
  letter-spacing: -.055em;
}

.directory-hero-classic p:not(.eyebrow) {
  max-width: 840px;
  margin: 0 auto;
  color: #eef7fb;
  font-size: clamp(19px, 2.6vw, 28px);
  font-weight: 800;
  line-height: 1.18;
}

.resume-directory-photo {
  display: grid;
  place-items: center;
  background: #050505;
}

.resume-directory-photo img {
  width: min(100%, 1120px);
  max-height: 360px;
  object-fit: cover;
  object-position: center top;
}

.directory-builder,
.history-section,
.coupon-management-layout {
  width: min(1120px, calc(100% - 44px));
  margin: 0 auto;
  padding: 54px 0 86px;
  position: relative;
}

.section-head-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 26px;
}

.section-head-row h2,
.history-section h2,
.coupon-management-layout h2 {
  margin: 0;
  color: #2f5063;
  font-size: var(--fs-section-title);
  letter-spacing: -.04em;
}

.section-head-row.compact {
  margin-top: 34px;
}

.head-actions,
.directory-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.head-actions a,
.directory-actions a,
.large-centered-action,
.row-actions a,
.history-row > a:last-child,
.create-promo-panel a,
.coupon-management-hero a {
  min-height: 52px;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  padding: 0 24px;
  color: white;
  background: var(--blue);
  font-weight: 900;
  text-transform: none;
}

.head-actions a:first-child,
.directory-actions .dark,
.row-actions .dark,
.create-promo-panel a.secondary {
  background: var(--navy);
}

.directory-actions .gold,
.row-actions .gold,
.history-row > a:last-child.gold,
.large-centered-action.gold {
  background: var(--gold);
}

.category-table-card,
.history-table-card,
.selection-pill-row,
.location-select-card {
  border: 1px solid #cfd8e5;
  border-radius: 24px;
  background: white;
  box-shadow: 0 14px 34px rgba(16,34,48,.08);
}

.category-table-card {
  padding: 34px 40px;
}

.category-table-head,
.category-table-card a,
.selection-pill-row {
  display: grid;
  grid-template-columns: minmax(210px, 1fr) 190px 190px;
  gap: 18px;
  align-items: center;
}

.category-table-head {
  padding: 0 0 14px;
  color: #2f5063;
  font-size: clamp(18px, 2vw, 22px);
}

.category-table-card a {
  min-height: 60px;
  border-top: 1px solid #d8e1eb;
  color: #161d24;
  font-size: clamp(18px, 2.3vw, 23px);
}

.category-table-card a strong,
.selection-pill-row strong {
  color: var(--blue);
  font-weight: 600;
  text-align: right;
}

.category-table-card a.selected span {
  width: fit-content;
  min-width: 190px;
  padding: 16px 24px;
  border-radius: 8px;
  color: white;
  background: var(--blue);
  font-weight: 900;
  text-align: center;
}

.alpha-rail {
  position: absolute;
  top: 182px;
  right: -52px;
  display: grid;
  gap: 12px;
  color: #7d8790;
  font-size: 20px;
  text-align: center;
}

.alpha-rail b {
  color: var(--blue);
  text-decoration: underline;
}

.selection-pill-row {
  margin: 18px 0 34px;
  min-height: 90px;
  padding: 0 38px;
  font-size: 24px;
}

.location-select-card {
  padding: 22px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
}

.location-select-card label span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-weight: 800;
}

.location-select-card select {
  width: 100%;
  min-height: 62px;
  border: 1px solid #aeb9c5;
  border-radius: 8px;
  padding: 0 14px;
  color: #666;
  background: white;
  font: inherit;
  font-weight: 800;
}

.map-toggle {
  border: 0;
  color: #2f5063;
  background: transparent;
  font: inherit;
  font-weight: 900;
}

.directory-actions {
  justify-content: center;
  margin-top: 28px;
}

.directory-actions a {
  min-width: 220px;
}

.directory-actions.inline {
  margin-top: 42px;
}

.history-section {
  padding-top: 72px;
  text-align: center;
}

.history-section h2 {
  margin-bottom: 42px;
}

.history-table-card {
  padding: 30px 42px;
  text-align: left;
}

.history-row {
  min-height: 82px;
  display: grid;
  align-items: center;
  gap: 24px;
  border-top: 1px solid #cfd8e5;
  font-size: clamp(17px, 2.1vw, 23px);
}

.history-row:first-child {
  border-top: 0;
}

.resume-posting-table .history-row {
  grid-template-columns: 150px 1fr auto;
}

.list-purchase-table .history-row {
  grid-template-columns: 150px 210px 1fr 120px 150px;
}

.coupon-history-card .history-row {
  grid-template-columns: 150px minmax(0, 1fr) 90px auto;
}

.saved-coupon-card .history-row {
  grid-template-columns: 140px minmax(0, 1fr) 86px 110px;
}

.published-coupon-card .history-row {
  grid-template-columns: 140px minmax(0, 1fr) 86px 232px;
  column-gap: 20px;
}

.coupon-history-card .history-row > span {
  grid-column: 1;
}

.coupon-history-card .history-row > a {
  grid-column: 2;
}

.coupon-history-card .history-row > em {
  grid-column: 3;
  justify-self: center;
}

.saved-coupon-card .history-row > button {
  grid-column: 4;
}

.published-coupon-card .history-row > .row-actions {
  grid-column: 4;
}

.history-row a {
  color: var(--blue);
  font-weight: 500;
}

.history-row strong,
.history-row b {
  font-weight: 600;
}

.history-row em {
  color: #777;
  font-weight: 800;
  text-align: right;
}

.row-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.row-actions a,
.history-row > a:last-child {
  min-width: 104px;
  color: white;
  font-size: var(--fs-button);
  font-weight: 900;
}

.row-actions a.gold {
  color: var(--ink);
}

.row-actions a.dark {
  color: white;
}

.history-row button {
  justify-self: end;
  min-width: 100px;
  min-height: 52px;
  border: 0;
  border-radius: 12px;
  padding: 0 22px;
  color: white;
  background: #b75a60;
  font: inherit;
  font-size: var(--fs-button);
  font-weight: 900;
}

.resume-posting-table .history-row {
  column-gap: 28px;
}

.resume-posting-table .row-actions {
  min-width: 232px;
}

.resume-posting-table .row-actions a,
.resume-posting-table .history-row button {
  min-width: 104px;
}

.large-centered-action {
  margin-top: 52px;
  min-width: 250px;
  min-height: 70px;
  font-size: clamp(18px, 2vw, 22px);
}

.coupon-management-hero {
  min-height: 360px;
  display: grid;
  place-items: center;
  text-align: center;
  color: white;
  background:
    linear-gradient(rgba(16,40,56,.42), rgba(16,40,56,.55)),
    url("assets/footer-banner.png") center / cover;
}

.coupon-management-hero h1 {
  margin: 8px 0 20px;
  font-size: var(--fs-display-title);
  letter-spacing: -.055em;
}

.coupon-management-hero p {
  margin: 0 0 26px;
  font-size: clamp(20px, 3vw, 30px);
  font-weight: 800;
}

.coupon-management-layout {
  width: min(1280px, calc(100% - 44px));
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 28px;
}

.coupon-management-layout h2 + .history-table-card {
  margin: 28px 0 50px;
}

.create-promo-panel,
.candidate-contact-panel {
  align-self: start;
  position: sticky;
  top: 96px;
  border-radius: 24px;
  padding: 28px;
  color: white;
  background: linear-gradient(135deg, #183648, var(--blue));
  box-shadow: var(--shadow);
}

.create-promo-panel span {
  display: block;
  color: #cce7ff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.create-promo-panel h2,
.create-promo-panel p {
  color: white;
}

.create-promo-panel p,
.candidate-contact-panel p,
.candidate-contact-panel small {
  color: #d8ecf7;
  line-height: 1.6;
}

.create-promo-panel a,
.candidate-contact-panel a {
  width: 100%;
  margin-top: 12px;
}

.candidate-resume-shell {
  padding: 28px clamp(20px, 6vw, 86px) 82px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 24px;
}

.candidate-resume-card {
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: 34px;
  background: white;
  box-shadow: var(--shadow);
}

.candidate-topline {
  display: flex;
  gap: 22px;
  align-items: center;
  padding-bottom: 26px;
  border-bottom: 1px solid var(--line);
}

.candidate-inline-actions {
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.candidate-inline-actions a {
  min-height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #d5e6f2;
  border-radius: 999px;
  padding: 0 16px;
  color: var(--navy);
  background: #f2f8fc;
  font-size: var(--fs-sm);
  font-weight: 900;
}

.candidate-inline-actions a:first-child {
  color: white;
  border-color: var(--blue);
  background: var(--blue);
}

.candidate-topline img {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
}

.candidate-topline h1 {
  margin: 4px 0 8px;
  font-size: var(--fs-display-title);
  letter-spacing: -.06em;
}

.candidate-highlight-grid {
  margin: 26px 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.candidate-highlight-grid span {
  padding: 16px;
  border-radius: 14px;
  background: #f2f8fc;
}

.candidate-highlight-grid b,
.resume-access-strip span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.candidate-resume-card h2 {
  margin-top: 28px;
  color: var(--ink);
  font-size: var(--fs-card-title);
}

.candidate-resume-card p {
  color: var(--muted);
  font-size: var(--fs-body);
  line-height: 1.7;
}

.resume-access-strip {
  margin-top: 14px;
  padding: 18px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  border-radius: 16px;
  background: #f2f8fc;
}

.resume-access-strip span {
  padding: 14px 16px;
  border: 1px solid #d8e6ef;
  border-radius: 12px;
  color: #365063;
  background: white;
  font-size: var(--fs-sm);
  font-weight: 800;
}

.resume-access-strip a,
.candidate-contact-panel a {
  min-height: 50px;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  padding: 0 18px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}

.candidate-contact-panel a:not(.primary) {
  background: rgba(255,255,255,.15);
}

.resume-upload-visual {
  padding: 28px clamp(20px, 6vw, 86px) 0;
  background: #f4f8fb;
}

.resume-upload-visual img {
  width: min(980px, 100%);
  max-height: 260px;
  margin: 0 auto;
  display: block;
  border-radius: 24px;
  object-fit: cover;
  object-position: center top;
  box-shadow: 0 18px 45px rgba(16,34,48,.1);
}

.contact-check {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid #d8e6ef;
  border-radius: 14px;
  padding: 0 14px;
  color: var(--navy);
  background: #f2f8fc;
  font-weight: 850;
}

.contact-check input {
  width: 20px;
  min-height: 20px;
  accent-color: var(--blue);
}

.coupon-directory-page {
  background: white;
}

.coupon-search-hero {
  position: relative;
  padding: 44px clamp(20px, 8vw, 120px) 34px;
  color: white;
  text-align: center;
  background:
    radial-gradient(circle at 90% 10%, rgba(255,255,255,.16), transparent 28%),
    linear-gradient(135deg, #1689f7, #0875dc);
}

.coupon-search-hero .round-back {
  position: absolute;
  top: 22px;
  left: 22px;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--navy);
  background: white;
  font-size: 34px;
  font-weight: 500;
  box-shadow: 0 12px 26px rgba(16,34,48,.18);
}

.coupon-search-hero .eyebrow {
  color: #d9efff;
}

.coupon-search-hero h1 {
  margin: 0 auto 12px;
  max-width: 980px;
  font-size: clamp(34px, 4.6vw, 54px);
  line-height: 1;
  letter-spacing: -.052em;
}

.coupon-search-hero > p:not(.eyebrow) {
  max-width: 920px;
  margin: 0 auto 28px;
  color: #e9f6ff;
  font-size: var(--fs-lead);
  line-height: 1.55;
}

.coupon-directory-search {
  max-width: 1060px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.2fr 1.1fr 1.2fr;
  gap: 16px;
}

.coupon-directory-search label,
.coupon-directory-search button {
  min-height: 58px;
  border: 0;
  border-radius: 10px;
}

.coupon-directory-search label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px;
  color: #d9efff;
  background: rgba(16,34,48,.18);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}

.coupon-directory-search label span {
  flex: 0 0 auto;
  color: white;
  font-weight: 800;
}

.coupon-directory-search input,
.coupon-directory-search select {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  color: white;
  background: transparent;
  font: inherit;
  font-weight: 700;
}

.coupon-directory-search input::placeholder {
  color: rgba(255,255,255,.72);
}

.coupon-directory-search select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, white 50%), linear-gradient(135deg, white 50%, transparent 50%);
  background-position: calc(100% - 12px) 50%, calc(100% - 7px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

.coupon-directory-search label:nth-child(4) {
  grid-column: 1;
}

.coupon-directory-search button {
  grid-column: 2;
  color: var(--navy);
  background: white;
  font-weight: 900;
  text-transform: uppercase;
}

.coupon-map-strip {
  width: min(920px, calc(100% - 44px));
  margin: 22px auto 22px;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(16,34,48,.12);
}

.coupon-map-strip img {
  width: 100%;
  height: 170px;
  display: block;
  object-fit: cover;
}

.past-search-card {
  width: min(760px, calc(100% - 44px));
  margin: 0 auto 28px;
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 0 32px;
  color: #2f5063;
  background: white;
  box-shadow: 0 12px 28px rgba(16,34,48,.1);
  font-size: clamp(22px, 2.7vw, 32px);
  font-weight: 900;
}

.coupon-results-header {
  width: min(1120px, calc(100% - 44px));
  margin: 0 auto 28px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  align-items: end;
  gap: 28px;
}

.coupon-results-header h2 {
  margin: 0 0 6px;
  color: #2f5063;
  font-size: clamp(26px, 3vw, 36px);
  letter-spacing: -.04em;
}

.coupon-results-header a {
  color: #ef4a55;
  font-size: clamp(22px, 2.6vw, 30px);
  font-weight: 900;
  text-decoration: underline;
}

.coupon-results-actions {
  display: grid;
  gap: 12px;
}

.coupon-results-actions a {
  min-height: 58px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: white;
  background: var(--blue);
  font-size: var(--fs-body);
  text-decoration: none;
}

.coupon-results-actions a.gold {
  color: white;
  background: var(--gold);
}

.coupon-results-actions a.link {
  color: var(--blue);
  background: transparent;
  font-size: clamp(22px, 2.6vw, 30px);
  text-decoration: underline;
}

.large-coupon-results {
  width: min(1080px, calc(100% - 44px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.large-coupon-card {
  min-height: 500px;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-rows: 230px 1fr 86px;
  border-radius: 24px;
  color: white;
  box-shadow: 0 18px 44px rgba(16,34,48,.18);
}

.large-coupon-card img {
  width: 100%;
  height: 230px;
  object-fit: cover;
}

.large-coupon-card .qr {
  width: 82px;
  height: 82px;
  position: absolute;
  right: 22px;
  top: 124px;
  display: grid;
  place-items: center;
  border: 6px solid white;
  border-radius: 10px;
  color: transparent;
  background:
    conic-gradient(#111 25%, transparent 0 50%, #111 0 75%, transparent 0),
    linear-gradient(#fff, #fff);
  background-size: 18px 18px, 100% 100%;
  font-size: 0;
  font-weight: 900;
  box-shadow: 0 10px 22px rgba(16,34,48,.18);
}

.large-coupon-card > div:not(.qr) {
  padding: 24px 24px 18px;
  text-align: left;
}

.large-coupon-card h3 {
  max-width: 100%;
  margin-bottom: 14px;
  font-size: clamp(18px, 1.85vw, 24px);
  line-height: 1.15;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
}

.large-coupon-card p {
  margin: 0;
  color: rgba(255,255,255,.9);
  font-size: var(--fs-base);
  font-weight: 700;
  line-height: 1.45;
}

.large-coupon-card strong {
  display: flex;
  align-items: center;
  min-height: 86px;
  padding: 0 104px 0 24px;
  font-size: clamp(22px, 2.35vw, 30px);
  line-height: 1.05;
  text-transform: uppercase;
}

.large-coupon-card a {
  position: absolute;
  right: 20px;
  bottom: 24px;
  min-width: 72px;
  min-height: 38px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: white;
  background: rgba(255,255,255,.22);
  font-size: var(--fs-sm);
  font-weight: 900;
  text-transform: uppercase;
}

.large-coupon-card.red {
  background: linear-gradient(#f82929 0 82%, #c62420 82%);
}

.large-coupon-card.purple {
  background: linear-gradient(#a600ff 0 82%, #831cc4 82%);
}

.large-coupon-card.green {
  background: linear-gradient(#249a37 0 82%, #17762a 82%);
}

.additional-results {
  width: min(760px, calc(100% - 44px));
  min-height: 62px;
  margin: 54px auto 70px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: white;
  background: var(--blue);
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 900;
  text-transform: uppercase;
}

.old-coupon-results {
  width: min(1120px, calc(100% - 44px));
  align-items: stretch;
  gap: 28px;
}

.coupon-ad-card {
  min-height: 635px;
  overflow: hidden;
  display: grid;
  grid-template-rows: 270px 1fr 140px;
  border-radius: 28px;
  color: white;
  box-shadow: 0 18px 44px rgba(16,34,48,.18);
}

.coupon-ad-image {
  position: relative;
  background: #eaf1f5;
}

.coupon-ad-image > img:first-child {
  width: 100%;
  height: 270px;
  display: block;
  object-fit: cover;
}

.coupon-ad-image .coupon-qr {
  width: 118px;
  height: 118px;
  position: absolute;
  left: 50%;
  bottom: -58px;
  transform: translateX(-50%);
  border: 8px solid white;
  background: white;
  object-fit: cover;
  box-shadow: 0 10px 24px rgba(16,34,48,.18);
}

.coupon-ad-body {
  padding: 82px 26px 22px;
  text-align: center;
}

.coupon-ad-body h3 {
  margin: 0 0 16px;
  font-size: clamp(22px, 2.3vw, 30px);
  line-height: 1.16;
  letter-spacing: -.025em;
}

.coupon-ad-body p {
  margin: 5px 0;
  color: white;
  font-size: var(--fs-base);
  font-weight: 700;
  line-height: 1.34;
}

.coupon-ad-body .phone {
  font-size: 18px;
  font-weight: 900;
}

.coupon-ad-body .website {
  text-transform: uppercase;
}

.coupon-ad-card footer {
  min-height: 140px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 24px;
}

.coupon-ad-card footer strong {
  color: white;
  font-size: clamp(22px, 2.45vw, 30px);
  line-height: 1.06;
  text-transform: uppercase;
}

.coupon-ad-card footer strong em {
  font-style: normal;
  font-weight: 500;
}

.coupon-ad-card footer span {
  display: grid;
  justify-items: end;
  gap: 9px;
  color: white;
  font-weight: 800;
  text-transform: uppercase;
}

.coupon-ad-card footer small {
  font-size: var(--fs-xs);
  white-space: nowrap;
}

.coupon-ad-card footer a {
  min-width: 72px;
  min-height: 38px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: white;
  background: rgba(255,255,255,.22);
  font-size: var(--fs-sm);
  font-weight: 900;
  text-transform: uppercase;
}

.coupon-red {
  background: #f82929;
}

.coupon-red footer {
  background: #c82421;
}

.coupon-purple {
  background: #a600ff;
}

.coupon-purple footer {
  background: #7a19b8;
}

.coupon-green {
  background: #249a37;
}

.coupon-green footer {
  background: #17762a;
}

/* Prototype B landing */
.prototype-b-page {
  background: #eef5fa;
}

.prototype-b-page .site-header {
  position: sticky;
  top: 0;
  z-index: 30;
}

.pb-hero {
  min-height: calc(100vh - 72px);
  padding: 34px clamp(18px, 5vw, 74px) 52px;
  color: white;
  overflow: hidden;
  background:
    radial-gradient(circle at 84% 8%, rgba(22,137,247,.32), transparent 30%),
    linear-gradient(135deg, #102838, #265e7a);
}

.pb-location-pill {
  width: fit-content;
  margin-bottom: 22px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  padding: 9px 14px;
  color: #d9efff;
  background: rgba(255,255,255,.08);
  font-size: var(--fs-sm);
  font-weight: 850;
}

.pb-hero-grid {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: clamp(22px, 4vw, 54px);
  align-items: stretch;
}

.pb-hero-grid > *,
.pb-entry-panel,
.pb-search-panel {
  min-width: 0;
}

.pb-entry-panel,
.pb-search-panel {
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 28px;
  background: rgba(255,255,255,.1);
  box-shadow: 0 24px 70px rgba(5, 20, 30, .18);
}

.pb-entry-panel {
  padding: 24px;
}

.pb-entry-panel h2 {
  margin-bottom: 18px;
  color: white;
  font-size: clamp(24px, 2.2vw, 32px);
  line-height: 1.08;
  letter-spacing: -.04em;
}

.pb-entry-list {
  display: grid;
  gap: 10px;
}

.pb-entry-list a {
  min-height: 76px;
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  column-gap: 12px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 18px;
  padding: 12px;
  color: white;
  background: rgba(255,255,255,.08);
}

.pb-entry-list a:hover {
  background: rgba(255,255,255,.15);
}

.pb-entry-list span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(255,255,255,.13);
  font-size: 20px;
  grid-row: span 2;
}

.pb-entry-list b {
  font-size: var(--fs-base);
}

.pb-entry-list small {
  color: #cfe5f2;
  line-height: 1.35;
}

.pb-search-panel {
  padding: clamp(26px, 4.2vw, 58px);
  background:
    radial-gradient(circle at 96% 14%, rgba(255,255,255,.16), transparent 24%),
    rgba(255,255,255,.1);
}

.pb-search-panel h1 {
  max-width: 800px;
  margin: 0 0 18px;
  color: white;
  font-size: clamp(44px, 6vw, 78px);
  line-height: .96;
  letter-spacing: -.058em;
}

.pb-hero-copy {
  max-width: 670px;
  margin-bottom: 26px;
  color: #d8ebf5;
  font-size: clamp(17px, 1.6vw, 21px);
  line-height: 1.55;
}

.pb-job-search {
  padding: 10px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .9fr) 170px;
  gap: 10px;
  border-radius: 22px;
  background: white;
  box-shadow: 0 22px 70px rgba(7, 24, 35, .26);
}

.pb-job-search label {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px 14px;
}

.pb-job-search span {
  display: block;
  margin-bottom: 4px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.pb-job-search input {
  width: 100%;
  border: 0;
  outline: 0;
  color: var(--ink);
  background: transparent;
  font-weight: 850;
}

.pb-job-search button,
.pb-cta-band button {
  border: 0;
  border-radius: 16px;
  color: white;
  background: var(--blue);
  font-weight: 900;
}

.pb-quick-actions {
  margin: 16px 0 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.pb-quick-actions a {
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding: 10px 13px;
  color: #e8f5fc;
  background: rgba(255,255,255,.08);
  font-size: var(--fs-sm);
  font-weight: 850;
}

.pb-local-proof {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.pb-local-proof article {
  min-height: 96px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  padding: 16px;
  background: rgba(255,255,255,.08);
}

.pb-local-proof b {
  display: block;
  margin-bottom: 5px;
  color: white;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1;
}

.pb-local-proof span {
  color: #cfe5f2;
  font-size: var(--fs-sm);
  font-weight: 750;
}

.pb-section {
  padding: 64px clamp(18px, 6vw, 86px);
  background: white;
}

.pb-section:nth-of-type(even) {
  background: #f4f8fb;
}

.pb-section-head {
  max-width: 760px;
  margin: 0 auto 30px;
  text-align: center;
}

.pb-section-head.compact {
  margin-left: 0;
  text-align: left;
}

.pb-section-head span {
  display: block;
  margin-bottom: 10px;
  color: var(--blue);
  font-size: var(--fs-xs);
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.pb-section-head h2 {
  margin-bottom: 12px;
  font-size: clamp(30px, 4vw, 50px);
  line-height: 1;
  letter-spacing: -.05em;
}

.pb-section-head p {
  color: var(--muted);
  font-size: var(--fs-lead);
  line-height: 1.55;
}

.pb-market-cards,
.pb-directory-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.pb-market-cards article,
.pb-directory-row a {
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 24px;
  background: white;
  box-shadow: 0 14px 36px rgba(16,34,48,.06);
}

.pb-market-cards span,
.pb-directory-row span {
  width: 44px;
  height: 44px;
  margin-bottom: 16px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #edf7ff;
  font-size: 22px;
}

.pb-market-cards b,
.pb-directory-row b {
  display: block;
  margin-bottom: 8px;
  font-size: 22px;
}

.pb-market-cards p,
.pb-directory-row small {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.pb-job-list {
  display: grid;
  gap: 12px;
}

.pb-job-list a {
  min-height: 86px;
  display: grid;
  grid-template-columns: 54px 1fr auto;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px 16px;
  background: white;
}

.pb-job-list img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
}

.pb-job-list b,
.pb-job-list span {
  display: block;
}

.pb-job-list b {
  margin-bottom: 4px;
  font-size: 18px;
}

.pb-job-list span {
  color: var(--muted);
}

.pb-job-list small {
  border-radius: 999px;
  padding: 10px 14px;
  color: var(--blue);
  background: #edf7ff;
  font-weight: 900;
}

.pb-cta-band {
  padding: 50px clamp(18px, 6vw, 86px);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  color: white;
  background:
    linear-gradient(rgba(16,40,56,.78), rgba(16,40,56,.78)),
    url("assets/footer-banner.png") center / cover;
}

.pb-cta-band h2 {
  margin-bottom: 8px;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1;
  letter-spacing: -.045em;
}

.pb-cta-band p {
  margin: 0;
  color: #dbeaf3;
  font-size: var(--fs-lead);
}

.pb-cta-band button {
  min-height: 56px;
  padding: 0 22px;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .pb-hero {
    min-height: auto;
    padding: 26px 18px 42px;
  }
  .pb-hero-grid,
  .pb-job-search,
  .pb-local-proof,
  .pb-market-cards,
  .pb-directory-row {
    grid-template-columns: 1fr;
  }
  .pb-search-panel h1 {
    font-size: clamp(36px, 10vw, 50px);
  }
  .pb-section {
    padding: 48px 18px;
  }
  .pb-section-head,
  .pb-section-head.compact {
    text-align: left;
  }
  .pb-cta-band {
    align-items: stretch;
    flex-direction: column;
  }
  .pb-cta-band button {
    width: 100%;
  }
}

@media (max-width: 640px) {
  .prototype-b-page .site-header {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
  }
  .prototype-b-page .brand img {
    width: min(146px, 100%);
  }
  .prototype-b-page .header-actions {
    gap: 6px;
  }
  .prototype-b-page .header-actions a {
    font-size: 11px;
  }
  .prototype-b-page .header-actions .header-button {
    border-radius: 9px;
    padding: 9px 10px;
  }
  .prototype-b-page .desktop-nav {
    gap: 16px;
    font-size: 12px;
  }
  .pb-location-pill {
    width: auto;
    max-width: 100%;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }
  .pb-entry-panel,
  .pb-search-panel {
    border-radius: 22px;
  }
  .pb-entry-panel,
  .pb-search-panel {
    padding: 22px;
  }
  .pb-entry-list a {
    min-height: 72px;
  }
}

.donation-tier-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.donation-tier-grid label {
  cursor: pointer;
}

.donation-tier-grid input {
  position: absolute;
  width: auto;
  min-height: 0;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}

.auth-form .donation-tier-grid label span {
  min-height: 58px;
  display: grid;
  place-items: center;
  text-align: center;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--navy);
  background: #f2f8fc;
  font-size: var(--fs-card-title);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
}

.auth-form .donation-tier-grid input:checked + span {
  color: white;
  border-color: var(--gold);
  background: var(--gold);
}

@media (max-width: 980px) {
  .section-head-row,
  .candidate-topline,
  .resume-access-strip {
    align-items: stretch;
  }
  .category-table-head,
  .category-table-card a,
  .selection-pill-row,
  .resume-posting-table .history-row,
  .list-purchase-table .history-row,
  .coupon-history-card .history-row,
  .coupon-management-layout,
  .candidate-resume-shell,
  .candidate-highlight-grid,
  .location-select-card,
  .coupon-directory-search,
  .coupon-results-header,
  .large-coupon-results {
    grid-template-columns: 1fr;
  }
  .coupon-directory-search label:nth-child(4),
  .coupon-directory-search button {
    grid-column: auto;
  }
  .coupon-results-header {
    align-items: stretch;
  }
  .coupon-search-hero {
    padding: 42px 18px 28px;
  }
  .coupon-search-hero .round-back {
    position: static;
    margin: 0 0 18px;
  }
  .large-coupon-card {
    min-height: 520px;
  }
  .coupon-ad-card {
    min-height: 560px;
    grid-template-rows: 250px 1fr auto;
  }
  .coupon-ad-image > img:first-child {
    height: 250px;
  }
  .coupon-ad-card footer {
    align-items: flex-start;
    flex-direction: column;
  }
  .coupon-ad-card footer span {
    width: 100%;
    justify-items: start;
  }
  .alpha-rail {
    position: static;
    margin: 18px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .history-row {
    padding: 18px 0;
    font-size: 21px;
  }
  .history-table-card {
    padding: 22px;
    overflow: hidden;
  }
  .history-row > *,
  .row-actions {
    min-width: 0;
    max-width: 100%;
  }
  .history-row a,
  .history-row span,
  .history-row b,
  .history-row strong {
    overflow-wrap: anywhere;
  }
  .row-actions {
    flex-direction: column;
  }
  .row-actions,
  .directory-actions,
  .head-actions {
    width: 100%;
  }
  .row-actions a,
  .history-row > a:last-child,
  .history-row button,
  .directory-actions a,
  .head-actions a {
    width: 100%;
  }
  .create-promo-panel,
  .candidate-contact-panel {
    position: static;
  }
}

/* Prototype B final mobile guardrails */
@media (max-width: 640px) {
  html,
  body.prototype-b-page {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .prototype-b-page *,
  .prototype-b-page *::before,
  .prototype-b-page *::after {
    box-sizing: border-box;
  }

  .prototype-b-page .site-header {
    width: 100%;
    max-width: 100vw;
    padding: 12px 12px 10px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px;
    overflow: hidden;
  }

  .prototype-b-page .brand {
    min-width: 0;
    max-width: 100%;
  }

  .prototype-b-page .brand img {
    width: 142px !important;
    max-width: 142px;
  }

  .prototype-b-page .header-actions {
    gap: 6px;
    min-width: 0;
    max-width: 128px;
    justify-content: end;
  }

  .prototype-b-page .header-actions > a:not(.header-button) {
    display: none;
  }

  .prototype-b-page .header-actions .header-button {
    display: inline-grid;
    padding: 8px 10px;
    font-size: 12px;
    white-space: nowrap;
  }

  .prototype-b-page .desktop-nav {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    gap: 14px;
    padding: 2px 0 4px;
    scrollbar-width: none;
  }

  .prototype-b-page .desktop-nav::-webkit-scrollbar {
    display: none;
  }

  .prototype-b-page .desktop-nav a {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .prototype-b-page .pb-hero {
    width: 100%;
    max-width: 100vw;
    padding: 22px 14px 38px !important;
    overflow: hidden;
  }

  .prototype-b-page .pb-location-pill {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal;
    line-height: 1.35;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .prototype-b-page .pb-hero-grid,
  .prototype-b-page .pb-job-search,
  .prototype-b-page .pb-local-proof,
  .prototype-b-page .pb-market-cards,
  .prototype-b-page .pb-directory-row {
    width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .prototype-b-page .pb-hero-grid > *,
  .prototype-b-page .pb-entry-panel,
  .prototype-b-page .pb-search-panel,
  .prototype-b-page .pb-entry-card,
  .prototype-b-page .pb-market-card,
  .prototype-b-page .pb-job-row,
  .prototype-b-page .pb-job-search label,
  .prototype-b-page .pb-job-search button {
    min-width: 0;
    max-width: 100%;
  }

  .prototype-b-page .pb-entry-panel,
  .prototype-b-page .pb-search-panel {
    width: 100%;
    padding: 22px !important;
    overflow: hidden;
  }

  .prototype-b-page .pb-search-panel {
    order: -1;
  }

  .prototype-b-page .pb-entry-panel {
    order: 2;
  }

  .prototype-b-page .pb-search-panel h1 {
    max-width: 100%;
    font-size: 35px !important;
    line-height: 1.02;
    letter-spacing: -0.045em;
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .prototype-b-page .pb-hero-copy,
  .prototype-b-page .pb-entry-panel p,
  .prototype-b-page .pb-search-panel p {
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 420px) {
  .prototype-b-page .pb-search-panel h1 {
    font-size: 32px !important;
  }
}

/* Prototype B role-based landing update */
.prototype-b-page .pb-hero > .pb-location-pill,
.prototype-b-page .pb-hero > .pb-hero-grid {
  display: none !important;
}

.pb-role-landing {
  width: min(1180px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 22px;
}

.pb-role-badge {
  width: fit-content;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding: 9px 14px;
  color: #d9efff;
  background: rgba(255,255,255,.08);
  font-size: var(--fs-sm);
  font-weight: 850;
}

.pb-role-tabs {
  width: fit-content;
  display: flex;
  gap: 8px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  padding: 8px;
  background: rgba(255,255,255,.08);
}

.pb-role-tabs button {
  border: 0;
  border-radius: 999px;
  padding: 11px 17px;
  color: #dff2ff;
  background: transparent;
  font: inherit;
  font-size: var(--fs-sm);
  font-weight: 900;
  cursor: pointer;
}

.pb-role-tabs button.active {
  color: var(--ink);
  background: white;
  box-shadow: 0 12px 30px rgba(0,0,0,.16);
}

.pb-role-card {
  min-height: 430px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 34px;
  padding: clamp(28px, 5vw, 70px);
  background:
    radial-gradient(circle at 86% 8%, rgba(255,255,255,.18), transparent 28%),
    rgba(255,255,255,.1);
  box-shadow: 0 26px 80px rgba(5, 20, 30, .2);
}

.pb-role-card h1 {
  max-width: 850px;
  margin: 0 0 18px;
  color: white;
  font-size: clamp(48px, 7vw, 88px);
  line-height: .96;
  letter-spacing: -.06em;
}

.pb-role-card .pb-hero-copy {
  max-width: 720px;
}

.pb-role-actions {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.pb-role-actions a {
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  padding: 11px 15px;
  color: white;
  background: rgba(255,255,255,.09);
  font-size: var(--fs-sm);
  font-weight: 900;
}

.pb-role-actions a:hover {
  background: rgba(255,255,255,.16);
}

.pb-role-support {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.pb-role-support a {
  min-height: 138px;
  display: grid;
  gap: 8px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 22px;
  padding: 20px;
  color: white;
  background: rgba(255,255,255,.08);
}

.pb-role-support span {
  color: #35a0ff;
  font-size: var(--fs-xs);
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.pb-role-support b {
  font-size: var(--fs-lg);
}

.pb-role-support small {
  color: #cfe5f2;
  line-height: 1.45;
}

@media (max-width: 760px) {
  .prototype-b-page .pb-hero {
    min-height: auto;
    padding: 22px 14px 36px !important;
  }

  .pb-role-landing {
    gap: 18px;
  }

  .pb-role-badge {
    width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .pb-role-tabs {
    width: 100%;
    border-radius: 999px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }

  .pb-role-tabs button {
    width: 100%;
    padding: 10px 6px;
    font-size: 12px;
  }

  .pb-role-card {
    min-height: auto;
    border-radius: 24px;
    padding: 24px 22px;
  }

  .pb-role-card h1 {
    font-size: 38px;
    line-height: 1.02;
    letter-spacing: -.045em;
  }

  .pb-role-card .pb-hero-copy {
    font-size: 17px;
  }

  .pb-role-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .pb-role-actions a {
    text-align: center;
  }

  .pb-role-support {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 420px) {
  .pb-role-card h1 {
    font-size: 34px;
  }
}

/* Prototype B modal close mobile refinement */
@media (max-width: 640px) {
  .registration-card {
    overflow: visible;
  }
  .modal-close {
    right: 12px;
    top: 12px;
    width: 38px;
    height: 38px;
    font-size: 0;
    background: rgba(11, 32, 47, .78);
    box-shadow: 0 10px 24px rgba(0,0,0,.22);
  }
  .modal-brand {
    padding-top: 56px;
  }
}

.modal-close::before,
.modal-close::after {
  content: "";
  position: absolute;
  width: 17px;
  height: 2px;
  top: 50%;
  left: 50%;
  border-radius: 999px;
  background: currentColor;
}
.modal-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.modal-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* V2 consistency polish pass - typography, spacing, buttons, icons */
:root {
  --container-wide: min(1180px, calc(100% - 44px));
  --container-mid: min(1040px, calc(100% - 44px));
  --shadow-soft: 0 16px 44px rgba(16, 34, 48, .10);
  --shadow-button: 0 10px 22px rgba(22, 137, 247, .18);
}

body {
  line-height: 1.55;
}

h1,
h2,
h3,
.hero-copy h1,
.page-hero h1,
.pb-role-card h1,
.pb-search-panel h1 {
  letter-spacing: -.035em !important;
}

.pb-role-card h1 {
  max-width: 780px;
  font-size: clamp(46px, 6vw, 76px);
  line-height: 1.01;
}

.pb-role-card {
  min-height: 390px;
  padding: clamp(30px, 4.6vw, 58px);
}

.pb-role-card .pb-hero-copy {
  max-width: 690px;
  font-size: clamp(16px, 1.45vw, 19px);
  font-weight: 500;
}

.pb-job-search input,
.hero-search input,
.search-card input,
.search-card select,
.coupon-directory-search input,
.coupon-directory-search select {
  font-weight: 550 !important;
  color: #203544;
}

.pb-job-search span,
.hero-search span,
.search-card span,
.coupon-directory-search span {
  letter-spacing: .08em;
  font-weight: 800;
}

.pb-role-actions a,
.pb-quick-actions a,
.chip-row a,
.filter-tags button {
  font-weight: 700 !important;
  letter-spacing: -.01em;
}

.btn,
.header-button,
.pb-job-search button,
.hero-search button,
.search-card button,
.large-centered-action,
.row-actions a,
.history-row button,
.history-row > a:last-child,
.coupon-results-actions a,
.modal-actions button,
.status-actions a,
.directory-actions a,
.head-actions a {
  box-shadow: var(--shadow-button);
}

.pb-job-search button,
.hero-search button,
.search-card button,
.large-centered-action,
.status-actions a:first-child {
  background: var(--blue);
  color: #fff;
}

.pb-job-search button:hover,
.hero-search button:hover,
.search-card button:hover,
.large-centered-action:hover {
  background: var(--blue-dark);
}

.pb-role-support a,
.pb-market-cards article,
.pb-directory-row a,
.filter-card,
.results-stack,
.map-card,
.detail-main,
.apply-card,
.registration-card-page,
.history-table-card,
.coupon-history-card,
.saved-coupon-card,
.published-coupon-card,
.large-action-card,
.candidate-card,
.candidate-panel,
.coupon-grid article,
.checkout-card,
.membership-card {
  box-shadow: var(--shadow-soft);
}

.pb-market-cards span,
.pb-directory-row span,
.pb-entry-list span {
  width: 46px;
  height: 46px;
  border-radius: 16px;
  color: #0d2535;
  background: linear-gradient(145deg, #ffffff, #dff0fb);
  border: 1px solid rgba(255,255,255,.45);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
}

.pb-role-support span {
  width: fit-content;
  min-width: 34px;
  border-radius: 999px;
  padding: 5px 9px;
  color: #fff;
  background: rgba(22,137,247,.9);
  letter-spacing: .08em;
}

.pb-section,
.prototype-page,
.jobs-content,
.detail-shell,
.resume-directory-shell,
.coupon-results-header,
.large-coupon-results,
.coupon-management-layout,
.candidate-resume-shell {
  width: var(--container-wide);
  margin-left: auto;
  margin-right: auto;
}

.jobs-layout,
.jobs-results-layout {
  grid-template-columns: minmax(210px, 260px) minmax(0, 1fr) minmax(220px, 300px);
  gap: 24px;
}

.job-result,
.result-row,
.pb-job-list a {
  grid-template-columns: auto minmax(0, 1fr) auto;
  column-gap: 18px;
}

.job-result .btn,
.result-row .btn,
.pb-job-list small {
  justify-self: end;
  min-width: 92px;
  text-align: center;
  color: #fff;
  background: #244a60;
}

.filter-card {
  align-self: start;
}

.filter-check {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  column-gap: 10px;
  align-items: center;
}

.filter-check span {
  margin-left: 0;
}

.filter-tags {
  gap: 8px;
}

.filter-tags button {
  min-height: 34px;
  padding: 8px 12px;
}

.coupon-results-header {
  align-items: end;
}

.coupon-results-header h2 {
  letter-spacing: -.025em;
}

.coupon-results-header a {
  font-size: clamp(18px, 2vw, 24px);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .01em;
}

.large-coupon-results {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.large-coupon-card {
  min-height: 460px;
  border-radius: 24px;
  overflow: hidden;
}

.large-coupon-card img {
  height: 210px;
}

.large-coupon-card .qr {
  width: 74px;
  height: 74px;
  top: 170px;
}

.large-coupon-card h3 {
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.05;
}

.large-coupon-card strong {
  font-size: clamp(25px, 2.8vw, 34px);
}

.history-table-card {
  max-width: 100%;
}

.history-row {
  min-height: 74px;
  font-size: clamp(16px, 1.3vw, 20px);
}

.history-row em {
  font-weight: 700;
  opacity: .72;
}

.row-actions {
  justify-content: end;
}

.row-actions a,
.history-row button {
  min-height: 40px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 750;
}

@media (min-width: 1180px) {
  .pb-role-landing {
    width: min(1100px, calc(100% - 88px));
  }
}

@media (max-width: 980px) {
  .jobs-layout,
  .jobs-results-layout,
  .large-coupon-results,
  .coupon-results-header {
    grid-template-columns: 1fr;
  }

  .pb-role-card h1 {
    font-size: clamp(38px, 8vw, 56px);
  }
}

@media (max-width: 640px) {
  :root {
    --container-wide: min(100% - 28px, 560px);
    --container-mid: min(100% - 28px, 560px);
  }

  .pb-role-card {
    padding: 24px 22px;
  }

  .pb-role-card h1 {
    font-size: 34px !important;
    line-height: 1.06;
    letter-spacing: -.028em !important;
  }

  .pb-role-card .pb-hero-copy {
    font-size: 15.5px;
  }

  .large-coupon-card {
    min-height: 500px;
  }

  .history-row {
    font-size: 17px;
  }
}

/* V2 targeted page polish */
.job-search-block,
.coupon-search-wrap {
  width: var(--container-mid);
  margin-left: auto;
  margin-right: auto;
}

.job-search-block {
  margin-top: -24px;
}

.search-copy {
  gap: 18px 26px;
}

.search-copy h2 {
  max-width: 620px;
  font-size: clamp(30px, 2.7vw, 40px);
  line-height: 1.04;
}

.search-copy p {
  max-width: 390px;
}

.search-panel-strong {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) 170px 160px;
  gap: 8px;
}

.search-context {
  width: var(--container-mid);
  margin-left: auto;
  margin-right: auto;
}

.directory-layout {
  width: var(--container-wide);
  padding-left: 0;
  padding-right: 0;
}

.results-actions a {
  color: #fff;
  background: #244a60;
  box-shadow: 0 9px 18px rgba(16,34,48,.12);
}

.results-actions a:hover {
  background: #193749;
}

.result-card {
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 16px;
}

.result-card img {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 8px;
  background: #fff;
}

.result-card p {
  margin: 0 0 10px;
}

.inline-job-actions a,
.inline-job-actions button {
  min-height: 36px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 720;
}

.inline-job-actions button {
  color: #28475a;
  background: #f4f8fb;
  border: 1px solid #d8e6ef;
}

.coupon-results-actions a.link {
  border: 1px solid rgba(22,137,247,.22);
  border-radius: 14px;
  padding: 12px 16px;
  background: #f4f9ff;
  font-size: clamp(18px, 2vw, 24px);
}

.coupon-results-actions a.gold {
  background: #d7ad27;
}

/* V2 coupon directory final alignment override */
.coupon-directory-page .coupon-search-hero {
  padding-bottom: clamp(34px, 4.5vw, 56px);
}

.coupon-directory-page .coupon-map-strip {
  margin-top: 24px;
}

.coupon-directory-page .past-search-card {
  width: min(760px, calc(100% - 44px));
  min-height: 68px;
  margin: 22px auto 26px;
  padding: 0 28px;
  font-size: clamp(22px, 2.2vw, 30px);
  letter-spacing: -.025em;
}

.coupon-directory-page .coupon-results-header {
  width: min(1080px, calc(100% - 44px));
  grid-template-columns: minmax(0, 1fr) 260px;
  align-items: start;
  gap: 34px;
  margin-bottom: 24px;
}

.coupon-directory-page .coupon-results-header h2 {
  margin: 0 0 8px;
  font-size: clamp(26px, 2.6vw, 34px);
  letter-spacing: -.02em;
}

.coupon-directory-page .coupon-results-header > div a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #d83d4c;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 800;
  text-transform: none;
}

.coupon-directory-page .coupon-results-actions {
  gap: 10px;
}

.coupon-directory-page .coupon-results-actions a {
  min-height: 46px;
  border-radius: 12px;
  padding: 10px 14px;
  font-size: var(--fs-sm);
  font-weight: 800;
  letter-spacing: .01em;
  line-height: 1.15;
  text-align: center;
  text-transform: none;
  box-shadow: 0 10px 18px rgba(16,34,48,.08);
}

.coupon-directory-page .coupon-results-actions a.link {
  min-height: auto;
  color: var(--blue);
  background: #eef7ff;
  border-color: rgba(22,137,247,.25);
  font-size: var(--fs-body);
  text-decoration: none;
}

.coupon-directory-page .large-coupon-results {
  width: min(1080px, calc(100% - 44px));
  gap: 26px;
  align-items: stretch;
}

.coupon-directory-page .coupon-ad-card {
  min-height: 520px;
  grid-template-rows: 215px minmax(170px, 1fr) auto;
  border-radius: 24px;
}

.coupon-directory-page .coupon-ad-image {
  position: relative;
  min-height: 215px;
}

.coupon-directory-page .coupon-ad-image > img:first-child {
  height: 215px;
  object-fit: cover;
}

.coupon-directory-page .coupon-qr {
  width: 86px;
  height: 86px;
  left: 50%;
  right: auto;
  top: auto;
  bottom: -43px;
  transform: translateX(-50%);
  border: 7px solid white;
  border-radius: 4px;
  box-shadow: 0 10px 22px rgba(0,0,0,.15);
}

.coupon-directory-page .coupon-ad-body {
  padding: 56px 24px 22px;
}

.coupon-directory-page .coupon-ad-body h3 {
  font-size: clamp(22px, 2vw, 27px);
  line-height: 1.08;
  margin-bottom: 14px;
  overflow-wrap: anywhere;
}

.coupon-directory-page .coupon-ad-body p {
  font-size: var(--fs-sm);
  line-height: 1.35;
}

.coupon-directory-page .coupon-ad-card footer {
  min-height: 104px;
  gap: 16px;
  padding: 22px 24px;
}

.coupon-directory-page .coupon-ad-card footer strong {
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.coupon-directory-page .coupon-ad-card footer a {
  min-width: 68px;
  min-height: 36px;
  border-radius: 8px;
  font-size: var(--fs-sm);
}

@media (max-width: 860px) {
  .coupon-directory-page .coupon-results-header {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .coupon-directory-page .coupon-results-actions {
    grid-template-columns: 1fr 1fr;
  }

  .coupon-directory-page .coupon-results-actions a.link {
    grid-column: span 1;
  }

  .coupon-directory-page .large-coupon-results {
    grid-template-columns: 1fr;
  }

  .coupon-directory-page .coupon-ad-card {
    min-height: 480px;
  }
}

@media (max-width: 560px) {
  .coupon-directory-page .coupon-results-actions {
    grid-template-columns: 1fr;
  }

  .coupon-directory-page .past-search-card {
    width: calc(100% - 32px);
    padding: 0 20px;
  }
}

/* V2 mobile overflow guard for inner pages */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.prototype-page {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.mobile-title {
  display: none;
}

@media (max-width: 640px) {
  .site-header {
    width: 100%;
    max-width: 100vw;
    grid-template-columns: minmax(0, 1fr) auto;
    overflow: hidden;
  }

  .site-header .brand img {
    width: min(142px, 100%) !important;
  }

  .site-header .header-actions {
    max-width: 104px;
    justify-self: end;
  }

  .site-header .header-actions > a:not(.header-button) {
    display: none;
  }

  .site-header .header-actions .header-button {
    padding: 8px 10px;
    font-size: 12px;
    white-space: nowrap;
  }

  .site-header .desktop-nav {
    grid-column: 1 / -1;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    gap: 16px;
    padding-bottom: 2px;
    -webkit-overflow-scrolling: touch;
  }

  .site-header .desktop-nav a {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .coupon-directory-page .coupon-search-hero {
    padding-left: 18px;
    padding-right: 18px;
  }

  .coupon-directory-page .coupon-search-hero h1 {
    max-width: calc(100vw - 44px);
    font-size: clamp(26px, 7.5vw, 30px);
    line-height: 1.06;
    overflow-wrap: anywhere;
  }

  .coupon-directory-page .coupon-search-hero .desktop-title {
    display: none;
  }

  .coupon-directory-page .coupon-search-hero .mobile-title {
    display: inline;
  }

  .coupon-directory-page .coupon-search-hero p {
    max-width: 286px;
    font-size: 13px;
    line-height: 1.55;
    overflow-wrap: anywhere;
  }

  .coupon-directory-page .coupon-directory-search {
    width: 100%;
    max-width: 100%;
  }

  .coupon-directory-page .coupon-directory-search label {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
  }

  .coupon-directory-page .coupon-directory-search input,
  .coupon-directory-page .coupon-directory-search select {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .coupon-directory-page .coupon-map-strip,
  .coupon-directory-page .past-search-card,
  .coupon-directory-page .coupon-results-header,
  .coupon-directory-page .large-coupon-results {
    width: calc(100% - 32px);
  }

  .coupon-directory-page .coupon-results-header h2 {
    font-size: 22px;
    line-height: 1.12;
    overflow-wrap: anywhere;
  }

  .coupon-directory-page .coupon-results-header > div a {
    font-size: 20px;
  }
}

@media (max-width: 430px) {
  .site-header .header-actions {
    display: none;
  }

  .site-header {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .search-panel-strong {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .job-search-block,
  .coupon-search-wrap,
  .search-context,
  .directory-layout {
    width: var(--container-wide);
  }

  .search-copy h2 {
    font-size: 30px;
  }

  .result-card {
    grid-template-columns: 46px minmax(0, 1fr);
  }
}

/* Prototype B feedback pass: one-time coming-soon prompt */
.coming-soon-prompt {
  width: min(410px, calc(100vw - 32px));
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 120;
  padding: 22px 70px 22px 22px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 20px;
  color: white;
  background: linear-gradient(145deg, #12394f, #1f607e);
  box-shadow: 0 24px 60px rgba(7,24,35,.34);
  opacity: 0;
  visibility: hidden;
  transform: translateY(18px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
}

.coming-soon-prompt.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.coming-soon-prompt > span {
  display: block;
  margin-bottom: 7px;
  color: #8bd2ff;
  font-size: var(--fs-xs);
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.coming-soon-prompt strong {
  display: block;
  font-size: var(--fs-card-title);
  line-height: 1.15;
}

.coming-soon-prompt p {
  margin: 8px 0 16px;
  color: #d7ebf6;
  font-size: var(--fs-sm);
  line-height: 1.45;
}

.coming-soon-prompt a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  border-radius: 10px;
  color: white;
  background: var(--blue);
  font-size: var(--fs-sm);
  font-weight: 900;
  text-decoration: none;
}

.coming-soon-close {
  width: 36px;
  height: 36px;
  position: absolute;
  top: 16px;
  right: 16px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 50%;
  background: rgba(255,255,255,.08);
}

.coming-soon-close::before,
.coming-soon-close::after {
  width: 15px;
  height: 2px;
  position: absolute;
  top: 50%;
  left: 50%;
  content: "";
  border-radius: 2px;
  background: white;
  transform: translate(-50%, -50%) rotate(45deg);
}

.coming-soon-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* Prototype B feedback pass: map follows the job search criteria */
.jobs-map-inline {
  width: min(1380px, calc(100% - 44px));
  margin: 20px auto 18px;
  display: grid;
  grid-template-columns: minmax(270px, .7fr) minmax(0, 1.5fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: white;
  box-shadow: 0 14px 34px rgba(16,34,48,.09);
}

.jobs-map-inline-copy {
  padding: 26px;
}

.jobs-map-inline-copy > span {
  color: var(--blue);
  font-size: var(--fs-xs);
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.jobs-map-inline-copy h2 {
  margin: 8px 0;
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.08;
}

.jobs-map-inline-copy p {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: var(--fs-sm);
  line-height: 1.5;
}

.jobs-map-inline-copy button {
  min-height: 42px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  color: white;
  background: var(--navy);
  font-weight: 800;
}

.jobs-map-inline-visual {
  min-height: 240px;
}

.jobs-map-inline-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.jobs-map-inline.is-collapsed {
  grid-template-columns: 1fr;
}

.jobs-map-inline.is-collapsed .jobs-map-inline-visual {
  display: none;
}

@media (max-width: 700px) {
  .coming-soon-prompt {
    right: 16px;
    bottom: 16px;
    padding: 19px 58px 19px 18px;
    border-radius: 18px;
  }

  .coming-soon-prompt strong {
    font-size: 18px;
  }

  .jobs-map-inline {
    width: calc(100% - 36px);
    grid-template-columns: 1fr;
  }

  .jobs-map-inline-copy {
    padding: 20px;
  }

  .jobs-map-inline-visual {
    min-height: 190px;
  }
}

/* Prototype B search refinement: ordered settings, live radius, adjustable map */
.search-panel-strong {
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) minmax(190px, .62fr) 150px;
}

.radius-control {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.radius-control > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.radius-control output {
  color: var(--navy);
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
}

.search-panel input[type="range"] {
  height: 22px;
  margin-top: 6px;
  accent-color: var(--blue);
  cursor: pointer;
}

.search-settings-summary {
  padding: 15px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  border: 1px solid #c8deec;
  border-radius: 16px;
  background: #eaf4fa;
}

.search-settings-heading {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 2px 7px;
}

.search-settings-heading div {
  display: grid;
  gap: 2px;
}

.search-settings-heading b {
  margin: 0;
  color: var(--navy);
  font-size: var(--fs-body);
}

.search-settings-heading small {
  color: var(--muted);
  font-size: var(--fs-xs);
}

.search-settings-heading button {
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid #b7d1e1;
  border-radius: 9px;
  color: var(--navy);
  background: white;
  font-size: var(--fs-xs);
  font-weight: 850;
}

.search-settings-summary > span {
  min-width: 0;
  padding: 10px 12px;
  display: grid;
  gap: 3px;
  border: 1px solid #d4e4ee;
  border-radius: 11px;
}

.search-settings-summary > span b {
  margin: 0;
  font-size: 10px;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.search-settings-summary em {
  overflow: hidden;
  color: #29495d;
  font-size: 13px;
  font-style: normal;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.map-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.jobs-map-inline-copy .secondary-map-action {
  color: var(--navy);
  background: #e5f1f7;
}

.jobs-map-inline-visual {
  position: relative;
  overflow: hidden;
}

.map-radius-indicator {
  width: var(--map-radius-size, 100px);
  height: var(--map-radius-size, 100px);
  position: absolute;
  top: 50%;
  left: 55%;
  display: grid;
  place-items: center;
  border: 2px solid rgba(22,137,247,.68);
  border-radius: 50%;
  color: #0f4f78;
  background: rgba(22,137,247,.18);
  box-shadow: 0 0 0 8px rgba(255,255,255,.42);
  transform: translate(-50%, -50%);
  transition: width .18s ease, height .18s ease;
}

.map-radius-indicator span {
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.9);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.coming-soon-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.coming-soon-prompt .coming-soon-membership {
  border: 1px solid rgba(255,255,255,.24);
  color: white;
  background: rgba(255,255,255,.1);
}

@media (max-width: 900px) {
  .search-panel-strong {
    grid-template-columns: 1fr 1fr;
  }

  .search-panel-strong > button {
    min-height: 48px;
  }
}

@media (max-width: 700px) {
  .search-panel-strong,
  .search-settings-summary {
    grid-template-columns: 1fr;
  }

  .search-settings-summary {
    padding: 12px;
  }

  .search-settings-summary > span {
    grid-template-columns: 78px minmax(0, 1fr);
    align-items: center;
  }

  .search-settings-heading {
    align-items: flex-end;
  }

  .coming-soon-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .coming-soon-actions a {
    width: 100%;
  }
}

/* Prototype B mobile navigation refinement */
.mobile-menu-toggle,
.mobile-nav {
  display: none;
}

@media (max-width: 700px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .site-header {
    width: 100%;
    min-height: 66px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
  }

  .site-header .brand {
    min-width: 0;
  }

  .site-header .brand img {
    width: 150px;
    max-width: 100%;
  }

  .site-header .desktop-nav,
  .site-header .header-actions {
    display: none !important;
  }

  .mobile-menu-toggle {
    width: 44px;
    height: 44px;
    display: grid;
    place-content: center;
    gap: 5px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 13px;
    color: white;
    background: rgba(255,255,255,.08);
  }

  .mobile-menu-toggle span {
    width: 20px;
    height: 2px;
    display: block;
    border-radius: 2px;
    background: currentColor;
    transition: transform .2s ease, opacity .2s ease;
  }

  .mobile-menu-toggle[aria-expanded="true"] span:first-child {
    transform: translateY(7px) rotate(45deg);
  }

  .mobile-menu-toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0;
  }

  .mobile-menu-toggle[aria-expanded="true"] span:last-child {
    transform: translateY(-7px) rotate(-45deg);
  }

  .mobile-nav {
    grid-column: 1 / -1;
    padding: 8px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 16px;
    background: #173b50;
  }

  .mobile-nav:not([hidden]) {
    display: grid;
    gap: 6px;
  }

  .mobile-nav > a,
  .mobile-nav summary,
  .mobile-nav details a {
    min-height: 42px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    border-radius: 10px;
    color: white;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
  }

  .mobile-nav > a:first-child {
    background: var(--blue);
  }

  .mobile-nav summary {
    cursor: pointer;
    list-style: none;
    background: rgba(255,255,255,.08);
  }

  .mobile-nav summary::-webkit-details-marker {
    display: none;
  }

  .mobile-nav details a {
    margin-top: 4px;
    color: #d7ebf6;
    background: rgba(255,255,255,.04);
  }

  .prototype-page,
  .page-hero,
  .job-search-block,
  .search-context,
  .directory-layout {
    max-width: 100%;
  }

  .prototype-page {
    width: 100%;
  }

  .page-hero {
    width: 100%;
    padding-left: 18px;
    padding-right: 18px;
  }

  .page-hero h1 {
    max-width: 100%;
    font-size: 34px;
    line-height: 1.04;
    overflow-wrap: anywhere;
  }

  .page-hero .lead {
    max-width: 100%;
    font-size: 15px;
  }

  .directory-switch {
    width: 100%;
    min-width: 0;
  }

  .job-search-block,
  .search-context,
  .directory-layout {
    width: calc(100% - 28px);
  }

  .search-panel-strong,
  .search-panel-strong label,
  .search-panel-strong input,
  .search-panel-strong select {
    min-width: 0;
    max-width: 100%;
  }

  .search-context {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 6px;
  }

  .search-context span {
    flex: 0 0 auto;
  }
}

/* July 26 consolidated feedback pass */
.pb-role-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 15px;
  border-radius: 999px;
  color: #dff2ff;
  font-size: var(--fs-sm);
  font-weight: 900;
  text-decoration: none;
}

.role-membership-cta {
  margin-top: 14px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 16px;
  background: rgba(255,255,255,.1);
}

.role-membership-cta[hidden] {
  display: none !important;
}

.role-membership-cta > div {
  display: grid;
  gap: 4px;
}

.role-membership-cta span {
  color: #e2f4ff;
  font-weight: 800;
}

.role-membership-cta a,
.pb-cta-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 12px;
  color: white;
  background: var(--blue);
  font-weight: 900;
  text-decoration: none;
}

.combined-intake-page {
  min-height: calc(100vh - 72px);
  padding-bottom: 70px;
  background:
    radial-gradient(circle at 84% 10%, rgba(22,137,247,.18), transparent 28%),
    #f2f7fb;
}

.combined-intake-hero {
  padding: 54px max(24px, calc((100% - 1180px) / 2)) 126px;
  color: white;
  text-align: center;
  background: linear-gradient(118deg, #12364a, #1e668f);
}

.combined-intake-hero h1 {
  max-width: 920px;
  margin: 10px auto 14px;
  font-size: clamp(38px, 5.3vw, 70px);
  line-height: .98;
  letter-spacing: -.055em;
}

.combined-intake-hero p {
  max-width: 760px;
  margin: 0 auto 16px;
  color: #d9edf8;
  font-size: 17px;
  line-height: 1.55;
}

.combined-intake-hero strong {
  display: inline-block;
  padding: 8px 13px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(255,255,255,.1);
}

.combined-intake-grid {
  width: min(1180px, calc(100% - 36px));
  margin: -80px auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  position: relative;
}

.combined-intake-card {
  padding: clamp(24px, 3vw, 38px);
  border: 1px solid #d7e4ec;
  border-radius: 26px;
  background: white;
  box-shadow: 0 24px 60px rgba(14,46,65,.12);
}

.membership-intake-card {
  color: white;
  border-color: rgba(255,255,255,.16);
  background: linear-gradient(145deg, #173f55, #206c9d);
}

.intake-card-head {
  min-height: 82px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.intake-card-head span,
.combined-intake-card .page-form-label {
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.intake-card-head h2 {
  margin: 6px 0 0;
  font-size: clamp(27px, 3vw, 39px);
  line-height: 1;
  letter-spacing: -.04em;
}

.intake-card-head small {
  max-width: 152px;
  padding: 7px 10px;
  border-radius: 999px;
  color: #426274;
  background: #eef6fa;
  font-size: 10px;
  font-weight: 800;
  text-align: center;
}

.membership-intake-card .intake-card-head span,
.membership-intake-card .page-form-label {
  color: #92d5ff;
}

.membership-intake-card .intake-card-head small {
  color: #dff2ff;
  background: rgba(255,255,255,.1);
}

.combined-intake-card > p {
  color: #5d7483;
  line-height: 1.55;
}

.membership-intake-card > p {
  color: #d5e8f2;
}

.compact-interest-options {
  margin: 20px 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.compact-interest-options label {
  min-height: 49px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border: 1px solid #d7e4ec;
  border-radius: 13px;
  color: var(--ink);
  background: #f7fafc;
  font-size: 13px;
  font-weight: 800;
}

.compact-interest-options input {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  accent-color: #21a366;
}

.combined-intake-card .page-form-label {
  margin: 15px 0 7px;
  display: block;
}

.combined-intake-card .page-email {
  width: 100%;
  min-height: 52px;
  padding: 0 15px;
  border: 1px solid #cddce5;
  border-radius: 12px;
  color: var(--ink);
  background: #f8fbfd;
  font: inherit;
  font-weight: 700;
}

.membership-tier-options {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.membership-tier-options label {
  position: relative;
}

.membership-tier-options input {
  position: absolute;
  opacity: 0;
}

.membership-tier-options span {
  min-height: 62px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 14px;
  color: white;
  background: rgba(255,255,255,.08);
  font-size: 27px;
  font-weight: 900;
  cursor: pointer;
}

.membership-tier-options input:checked + span {
  color: #17384b;
  border-color: #f0bd22;
  background: #f0bd22;
}

.combined-intake-card .page-submit {
  width: 100%;
  min-height: 54px;
  margin-top: 18px;
  border: 0;
  border-radius: 13px;
  color: white;
  background: var(--blue);
  font: inherit;
  font-weight: 900;
}

.membership-intake-card .membership-submit {
  color: #17384b;
  background: #f0bd22;
}

.intake-disclaimer {
  padding: 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  font-size: 12px;
}

.jobs-workspace {
  width: min(1440px, calc(100% - 48px));
  margin: 32px auto;
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(340px, .75fr);
  gap: 24px;
  align-items: start;
}

.jobs-primary-results,
.jobs-search-column > section,
.jobs-search-column > aside {
  border: 1px solid #d8e5ed;
  border-radius: 22px;
  background: white;
  box-shadow: 0 16px 36px rgba(20,55,75,.08);
}

.jobs-primary-results {
  padding: 24px;
}

.jobs-results-heading {
  margin-bottom: 18px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.jobs-results-heading h2 {
  margin: 4px 0;
  font-size: clamp(28px, 3vw, 42px);
  letter-spacing: -.04em;
}

.jobs-results-heading > a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0 16px;
  border-radius: 12px;
  color: white;
  background: var(--blue);
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

.restaurant-result-grid,
.past-job-grid {
  display: grid;
  gap: 12px;
}

.restaurant-result-grid .result-card,
.past-job-grid .result-card {
  min-width: 0;
  margin: 0;
  padding: 18px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 15px;
  align-items: center;
  border: 1px solid #dbe6ed;
  border-radius: 16px;
  background: #fbfdfe;
}

.restaurant-result-grid .result-card img,
.past-job-grid .result-card img {
  width: 52px;
  height: 52px;
  border: 1px solid #d7e2e9;
  border-radius: 50%;
  object-fit: cover;
}

.result-card h3 {
  margin: 3px 0;
}

.result-card p {
  margin: 0;
  color: #687f8e;
}

.result-card .label {
  color: var(--blue);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.inline-job-actions {
  margin-top: 10px;
  display: flex;
  gap: 8px;
}

.inline-job-actions a,
.inline-job-actions button {
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid #cddde6;
  border-radius: 9px;
  color: #294e63;
  background: white;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
}

.inline-job-actions a {
  color: white;
  border-color: #244f65;
  background: #244f65;
}

.jobs-search-column {
  display: grid;
  gap: 16px;
}

.jobs-search-column .job-search-block {
  width: 100%;
  margin: 0;
  padding: 18px;
}

.compact-job-search .search-copy {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.compact-job-search .search-copy h2 {
  margin: 3px 0 0;
  font-size: 28px;
}

.category-helper-link,
.inline-category-link {
  color: var(--blue);
  font-weight: 900;
}

.compact-job-search .search-panel-strong {
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
}

.compact-job-search .search-panel-strong > * {
  min-width: 0;
}

.compact-job-search .search-settings-summary {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

.jobs-map-inline-visual {
  min-height: 230px;
  border-radius: 22px;
}

.jobs-map-inline-visual img {
  width: 100%;
  height: 230px;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}

.jobs-map-inline.is-collapsed,
.jobs-map-inline.is-collapsed .jobs-map-inline-visual {
  min-height: 68px;
}

.jobs-map-inline.is-collapsed img,
.jobs-map-inline.is-collapsed .map-radius-indicator {
  display: none;
}

.compact-filter-card {
  padding: 18px;
}

.advanced-filter-details {
  margin-top: 8px;
  border-top: 1px solid #dbe5eb;
}

.advanced-filter-details summary {
  padding: 13px 0 5px;
  color: var(--blue);
  font-weight: 900;
  cursor: pointer;
}

.inline-support-cta {
  padding: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: white;
  background: linear-gradient(135deg, #173f55, #1d70a6) !important;
}

.inline-support-cta div {
  display: grid;
  gap: 3px;
}

.inline-support-cta span,
.inline-support-cta small {
  color: #dceef7;
}

.inline-support-cta a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  border-radius: 10px;
  color: #18384a;
  background: #f0bd22;
  font-size: 12px;
  font-weight: 900;
  text-decoration: none;
}

.past-saved-jobs {
  width: min(1440px, calc(100% - 48px));
  margin: 0 auto 70px;
  padding: 25px;
  border-radius: 24px;
  background: #eaf3f8;
}

.hero-registration-link {
  width: fit-content;
  max-width: 520px;
  margin-top: 20px;
  padding: 11px 15px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 12px;
  color: white;
  background: rgba(255, 255, 255, 0.1);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.hero-registration-link span {
  padding: 5px 8px;
  border-radius: 999px;
  color: #17384b;
  background: #f0bd22;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.past-job-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.professional-details {
  margin-top: 18px;
  padding: 0 18px;
  border: 1px solid #d8e5ed;
  border-radius: 16px;
  background: #f7fbfd;
}

.professional-details summary {
  padding: 18px 0;
  color: #204a60;
  font-weight: 900;
  cursor: pointer;
}

.professional-detail-grid {
  padding: 0 0 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.professional-detail-grid fieldset {
  margin: 0;
  padding: 14px;
  display: grid;
  gap: 9px;
  border: 1px solid #d7e3ea;
  border-radius: 13px;
  background: white;
}

.professional-detail-grid legend {
  color: var(--blue);
  font-size: 12px;
  font-weight: 900;
}

.sidebar-support-cta {
  margin-top: 14px;
  padding: 16px;
  display: grid;
  gap: 7px;
  border-radius: 15px;
  color: white;
  background: #204f67;
}

.sidebar-support-cta a {
  min-height: 42px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #19394a;
  background: #f0bd22;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.coupon-map-row {
  width: min(1120px, calc(100% - 40px));
  margin: 24px auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 18px;
}

.coupon-map-strip img {
  width: 100%;
  height: 210px;
  display: block;
  border-radius: 20px;
  object-fit: cover;
}

.coupon-map-actions {
  padding: 20px;
  display: grid;
  align-content: center;
  gap: 10px;
  border-radius: 20px;
  color: white;
  background: linear-gradient(145deg, #17465f, #1e81c8);
}

.coupon-map-actions a {
  min-height: 43px;
  display: grid;
  place-items: center;
  padding: 0 12px;
  border-radius: 11px;
  color: white;
  background: var(--blue);
  font-weight: 900;
  text-align: center;
  text-decoration: none;
}

.coupon-map-actions a.gold {
  color: #17384b;
  background: #f0bd22;
}

.coupon-management-primary,
.browse-discounts-action {
  width: fit-content;
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  padding: 0 20px;
  border-radius: 12px;
  color: white;
  background: var(--blue);
  font-weight: 900;
  text-decoration: none;
}

.browse-discounts-action {
  margin-bottom: 22px;
}

.form-action-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.form-support-link,
.coupon-update-cta,
.resume-early-access-cta {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
  border-radius: 11px;
  color: #17384b;
  background: #f0bd22;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
}

.coupon-update-cta {
  color: white !important;
  background: var(--blue) !important;
}

.resume-early-access-cta {
  width: 100%;
  margin-top: 11px;
  color: white;
  background: var(--blue);
}

.resume-support-copy {
  margin: 9px 0 0 !important;
  color: #365e74 !important;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}

.resume-upload-visual {
  padding-top: 20px;
}

.resume-upload-visual img {
  max-height: 170px;
  object-position: center 38%;
}

.directory-hero-classic {
  padding-top: 48px;
  padding-bottom: 44px;
}

.resume-directory-photo {
  max-height: 220px;
  overflow: hidden;
}

.resume-directory-photo img {
  height: 220px;
  object-fit: cover;
  object-position: center 32%;
}

@media (max-width: 980px) {
  .combined-intake-grid,
  .jobs-workspace,
  .coupon-map-row {
    grid-template-columns: 1fr;
  }

  .jobs-search-column {
    grid-row: 1;
  }

  .past-job-grid,
  .professional-detail-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .site-header,
  .pb-hero,
  .pb-role-landing,
  .pb-role-card,
  .pb-job-search,
  .page-hero,
  .split-hero > *,
  .directory-switch,
  .jobs-workspace,
  .jobs-primary-results,
  .jobs-search-column,
  .jobs-search-column > *,
  .compact-job-search .search-copy,
  .compact-job-search .search-panel-strong,
  .combined-intake-hero,
  .combined-intake-grid,
  .combined-intake-grid > *,
  .combined-intake-card,
  .coupon-map-row,
  .coupon-map-row > * {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .site-header {
    width: 100vw !important;
    overflow: visible;
    position: relative;
  }

  .mobile-menu-toggle {
    display: grid !important;
    position: absolute;
    top: 11px;
    right: 14px;
    justify-self: end;
    z-index: 2;
  }

  .pb-role-tabs {
    width: calc(100vw - 28px) !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-radius: 18px;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }

  .pb-role-tabs > * {
    min-width: 0;
  }

  .pb-role-tabs button,
  .pb-role-tabs a {
    width: 100%;
    min-height: 40px;
    padding: 7px 5px;
    font-size: 11px;
    overflow-wrap: anywhere;
    text-align: center;
  }

  .pb-role-card {
    width: calc(100vw - 28px) !important;
    overflow: hidden;
  }

  .pb-role-card h1,
  .page-hero h1,
  .combined-intake-hero h1 {
    width: 100%;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .pb-job-search {
    width: calc(100vw - 72px) !important;
    max-width: calc(100vw - 72px) !important;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .pb-job-search > *,
  .pb-job-search input,
  .pb-job-search button {
    width: 100%;
    min-width: 0;
  }

  .role-membership-cta {
    align-items: stretch;
    flex-direction: column;
  }

  .combined-intake-hero {
    width: 100vw !important;
    padding: 38px 18px 92px;
    text-align: left;
  }

  .combined-intake-hero h1 {
    font-size: 39px;
  }

  .combined-intake-grid {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    margin-top: -58px;
  }

  .combined-intake-card {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    padding: 20px;
    border-radius: 20px;
    overflow: hidden;
  }

  .intake-card-head {
    min-height: 0;
    display: grid;
  }

  .intake-card-head small {
    max-width: none;
    width: fit-content;
  }

  .compact-interest-options {
    grid-template-columns: 1fr;
  }

  .combined-intake-card input,
  .membership-tier-options {
    min-width: 0;
    max-width: 100%;
  }

  .split-hero {
    width: 100vw !important;
    align-items: stretch;
    flex-direction: column;
  }

  .hero-registration-link {
    width: 100%;
    max-width: 100%;
    align-items: flex-start;
    flex-direction: column;
  }

  .directory-switch {
    width: calc(100vw - 36px) !important;
    max-width: calc(100vw - 36px) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .directory-switch a {
    white-space: normal;
  }

  .jobs-workspace,
  .past-saved-jobs {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  .jobs-primary-results {
    padding: 16px;
  }

  .compact-job-search .search-copy {
    width: calc(100vw - 60px) !important;
    max-width: calc(100vw - 60px) !important;
    display: grid;
    gap: 8px;
  }

  .compact-job-search .search-panel-strong {
    width: calc(100vw - 60px) !important;
    max-width: calc(100vw - 60px) !important;
    margin: 14px 0 0 !important;
  }

  .compact-job-search .search-panel-strong > *,
  .compact-job-search .search-panel-strong input {
    width: 100%;
    min-width: 0;
  }

  .compact-job-search .search-settings-summary {
    width: calc(100vw - 60px) !important;
    max-width: calc(100vw - 60px) !important;
  }

  .category-helper-link {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .jobs-results-heading {
    display: grid;
  }

  .jobs-results-heading > a {
    width: 100%;
    justify-content: center;
  }

  .restaurant-result-grid .result-card,
  .past-job-grid .result-card {
    grid-template-columns: 42px minmax(0, 1fr);
    padding: 14px;
  }

  .restaurant-result-grid .result-card img,
  .past-job-grid .result-card img {
    width: 42px;
    height: 42px;
  }

  .inline-support-cta {
    align-items: stretch;
    flex-direction: column;
  }

  .inline-support-cta a {
    justify-content: center;
  }

  .coupon-map-row {
    width: calc(100% - 24px);
  }

  .coupon-map-strip img {
    height: 170px;
  }

  .form-action-pair {
    grid-template-columns: 1fr;
  }

  .resume-upload-visual {
    padding: 14px 12px 0;
  }

  .resume-upload-visual img {
    max-height: 105px;
    border-radius: 16px;
  }

  .directory-hero-classic {
    padding: 34px 18px 28px;
  }

  .directory-hero-classic h1 {
    font-size: 42px;
  }

  .directory-hero-classic p:not(.eyebrow) {
    font-size: 16px;
  }

  .resume-directory-photo,
  .resume-directory-photo img {
    height: 126px;
  }
}


/* ============================================================
   Design review round — Prototype B
   Shared action tab, layout updates, and sub-content type scale
   ============================================================ */

/* --- Shared "action tab" component ------------------------- */
.fd-action-tab {
  padding: 18px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-radius: 20px;
  color: #fff;
  background: linear-gradient(135deg, #173f55, #1d70a6);
  box-shadow: 0 16px 36px rgba(20, 55, 75, .16);
}

.fd-action-tab[hidden] { display: none; }

.fd-action-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.fd-action-copy b {
  font-size: 17px;
  line-height: 1.28;
  letter-spacing: -.01em;
}

.fd-action-copy span {
  color: #dceef7;
  font-size: 14px;
  line-height: 1.45;
}

.fd-action-cta {
  flex: 0 0 auto;
  display: grid;
  gap: 6px;
  justify-items: center;
}

.fd-action-cta a {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border-radius: 12px;
  color: #18384a;
  background: #f0bd22;
  font-size: 14px;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
}

.fd-action-cta small {
  color: #dceef7;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
}

.fd-action-tab-stacked {
  align-items: stretch;
  flex-direction: column;
  gap: 14px;
}

.fd-action-tab-stacked .fd-action-cta { justify-items: stretch; }
.fd-action-tab-stacked .fd-action-cta a { width: 100%; }

.fd-action-tab-centered {
  width: min(880px, 100%);
  margin: 18px auto 0;
}

.fd-action-tab-on-dark {
  align-items: stretch;
  flex-direction: column;
  gap: 14px;
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .12);
  box-shadow: none;
}

.fd-action-tab-on-dark .fd-action-cta { justify-items: stretch; }
.fd-action-tab-on-dark .fd-action-cta a { width: 100%; }

.fd-action-tab-wide { margin-bottom: 22px; }

.split-hero > .fd-action-tab {
  min-width: 320px;
  max-width: 460px;
}

/* --- Stacked hero titles (large line + smaller line) ------- */
.stacked-title {
  display: grid;
  gap: 6px;
}

.stacked-title .title-major {
  display: block;
  line-height: .98;
}

.stacked-title .title-minor {
  display: block;
  font-size: .56em;
  line-height: 1.12;
  letter-spacing: -.03em;
}

.combined-intake-hero .stacked-title .title-minor { font-size: .7em; }

/* --- Jobs directory --------------------------------------- */
.page-action-band {
  width: min(1440px, calc(100% - 48px));
  margin: 22px auto 0;
}

.switch-centered .directory-switch {
  min-width: 620px;
  margin-left: auto;
  margin-right: auto;
  grid-template-columns: .6fr .95fr .8fr 1.05fr 1.4fr;
}

.jobs-primary-column {
  min-width: 0;
  display: grid;
  gap: 24px;
  align-content: start;
}

.jobs-workspace .past-saved-jobs {
  width: auto;
  margin: 0;
}

.jobs-workspace .past-job-grid {
  grid-template-columns: minmax(0, 1fr);
}

.saved-jobs-heading { margin-bottom: 14px; }

.saved-jobs-note {
  display: block;
  margin: 4px 0 0 34px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  font-style: italic;
}

.enlarged-job-search { padding: 26px !important; }

.enlarged-job-search .search-panel-strong { gap: 12px; }

.enlarged-job-search .search-panel-strong input,
.enlarged-job-search .search-panel-strong select {
  min-height: 52px;
  font-size: 15px;
}

.enlarged-job-search .search-panel-strong button {
  min-height: 56px;
  font-size: 16px;
}

.enlarged-job-search .search-settings-summary { margin-top: 16px; }

.inline-support-cta small {
  color: #eaf6fc;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.4;
}

/* --- Create job post -------------------------------------- */
.hero-side-stack {
  min-width: 320px;
  max-width: 460px;
  display: grid;
  gap: 14px;
}

.hero-side-stack .hero-note-card {
  min-width: 0;
  max-width: none;
}

/* --- Resume directory ------------------------------------- */
.directory-hero-classic .directory-live-note {
  margin: 0 auto 14px;
  color: #f0bd22;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.directory-builder-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 296px;
  gap: 34px;
  align-items: start;
}

.directory-builder-split .directory-builder-main {
  min-width: 0;
  grid-row: 1;
  grid-column: 1;
}

.directory-side-rail {
  grid-row: 1;
  grid-column: 2;
  display: grid;
  gap: 16px;
  align-content: start;
  position: sticky;
  top: 96px;
}

.side-tab-stack {
  display: grid;
  gap: 10px;
}

.side-tab-stack a {
  min-height: 52px;
  display: inline-grid;
  place-items: center;
  padding: 0 16px;
  border-radius: 12px;
  color: #fff;
  background: var(--blue);
  font-weight: 900;
  text-align: center;
  text-decoration: none;
}

.side-tab-stack a.dark { background: var(--navy); }

.side-tab-stack a.sample {
  color: var(--navy);
  border: 1px solid #cfd8e5;
  background: #fff;
}

.bottom-directory-actions { margin-top: 42px; }

.directory-builder-split .alpha-rail { right: 300px; }

.page-corner-action {
  width: min(320px, 100%);
  margin: 0 0 22px auto;
}

.history-section.has-side-action { padding-top: 34px; }

/* --- Coupon directory ------------------------------------- */
.coupon-map-actions { align-content: start; }

.coupon-manage-tabs {
  display: grid;
  gap: 10px;
}

.coupon-map-actions .coupon-manage-tabs a {
  color: #12303f;
  background: #fff;
}

.coupon-map-actions .ad-free-accent {
  margin: 2px 0 4px;
  color: #f0bd22;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -.01em;
  text-align: center;
}

.coupon-map-actions .fd-action-tab {
  padding: 15px;
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .12);
  box-shadow: none;
}

.coupon-map-actions .fd-action-tab a {
  color: #18384a;
  background: #f0bd22;
}

.coupon-directory-page .tight-results-header { margin-top: 16px; }

/* --- Coupon management ------------------------------------ */
.coupon-management-hero .coupon-management-strap {
  max-width: 800px;
  margin: 0 auto;
  color: #eaf6fc;
  font-size: clamp(17px, 1.9vw, 23px);
  font-weight: 800;
  line-height: 1.35;
}

.section-example-note {
  margin: 6px 0 14px 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  font-style: italic;
}

.section-example-note + .history-table-card { margin: 0 0 50px; }

.coupon-management-rail {
  align-self: start;
  display: grid;
  gap: 16px;
  align-content: start;
  position: sticky;
  top: 96px;
}

.coupon-management-rail .browse-discounts-action {
  width: 100%;
  margin: 0;
  justify-content: center;
}

.coupon-management-rail .create-promo-panel {
  position: static;
  top: auto;
}

/* --- Advertise / create coupon ----------------------------- */
.hero-manage-tab {
  min-height: 44px;
  align-self: end;
  display: inline-flex;
  align-items: center;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 12px;
  color: #fff;
  background: rgba(255, 255, 255, .12);
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

/* --- Resume upload ----------------------------------------- */
.resume-upload-column {
  min-width: 0;
  display: grid;
  gap: 22px;
  align-content: start;
}

.resume-upload-column .resume-upload-zone { min-height: 300px; }

.resume-upload-column .resume-publish-card { position: static; }

/* --- Early registration: fit both forms above the fold ----- */
.combined-intake-hero { padding: 22px max(24px, calc((100% - 1180px) / 2)) 68px; }

.combined-intake-hero h1 {
  margin: 4px auto 10px;
  font-size: clamp(28px, 3.5vw, 46px);
}

.combined-intake-hero p {
  margin-bottom: 8px;
  font-size: 15px;
}

.combined-intake-grid { margin-top: -52px; }

.combined-intake-card { padding: clamp(20px, 2.2vw, 28px); }

.intake-card-head { min-height: 0; }

.combined-intake-card > p {
  margin: 10px 0 0;
  font-size: 14px;
}

.compact-interest-options { margin: 12px 0; gap: 7px; }

.compact-interest-options label { min-height: 35px; padding: 6px 12px; }

.combined-intake-card .page-form-label { margin: 10px 0 5px; }

.combined-intake-card .page-email { min-height: 44px; }

.combined-intake-card .custom-amount-field { max-width: 220px; }

.membership-tier-options span { min-height: 46px; font-size: 21px; }

.combined-intake-card .page-submit {
  min-height: 48px;
  margin-top: 10px;
  padding: 8px 16px;
  font-size: 14px;
  line-height: 1.25;
}

.submit-support-note {
  margin-top: 10px;
  display: block;
  color: #f0bd22;
  font-size: 15px;
  font-weight: 900;
  text-align: center;
}

.intake-disclaimer { padding: 8px 10px; font-size: 10px; line-height: 1.45; }

/* --- Sub-content type scale (hero stays dominant) ---------- */
.form-section-title h2,
.form-side-card h2,
.upload-card h2,
.builder-heading h2,
.resume-upload-zone h2,
.resume-publish-card h2,
.jobs-results-heading h2,
.compact-job-search .search-copy h2,
.create-promo-panel h2,
.intake-card-head h2 {
  font-size: clamp(19px, 1.95vw, 25px);
  line-height: 1.16;
  letter-spacing: -.025em;
}

.section-head-row h2,
.history-section h2,
.coupon-management-layout h2,
.coupon-results-header h2,
.coupon-directory-page .coupon-results-header h2,
.pb-section-head h2 {
  font-size: clamp(21px, 2.3vw, 29px);
  letter-spacing: -.03em;
}

.directory-hero-classic p:not(.eyebrow):not(.directory-live-note),
.coupon-management-hero p,
.coupon-search-hero > p:not(.eyebrow) {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 700;
  line-height: 1.5;
}

.hero-note-card b { font-size: 20px; }

.category-table-head { font-size: clamp(14px, 1.3vw, 16px); }

.category-table-card a { font-size: clamp(15px, 1.5vw, 18px); }

.selection-pill-row { min-height: 74px; font-size: 19px; }

.category-table-card a.selected span {
  min-width: 160px;
  padding: 12px 20px;
}

/* --- Responsive -------------------------------------------- */
@media (max-width: 1100px) {
  .directory-builder-split { grid-template-columns: minmax(0, 1fr); }

  .directory-builder-split .directory-side-rail {
    grid-row: 1;
    grid-column: 1;
    position: static;
  }

  .directory-builder-split .directory-builder-main {
    grid-row: 2;
    grid-column: 1;
  }

  .directory-builder-split .side-tab-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .directory-builder-split .alpha-rail { right: -30px; }
}

@media (max-width: 980px) {
  .coupon-management-rail { position: static; }

  .page-corner-action { width: 100%; margin-left: 0; }
}

@media (max-width: 700px) {
  .fd-action-tab {
    padding: 16px;
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .fd-action-cta { justify-items: stretch; }

  .fd-action-cta a { width: 100%; }

  .split-hero > .fd-action-tab,
  .hero-side-stack {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .page-action-band {
    width: var(--shell) !important;
    min-width: 0 !important;
    max-width: var(--shell) !important;
    margin-left: auto;
    margin-right: auto;
  }

  .switch-centered .directory-switch {
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .switch-centered .directory-switch a:last-child { grid-column: 1 / -1; }

  .directory-builder-split .side-tab-stack { grid-template-columns: minmax(0, 1fr); }

  .directory-builder-split .alpha-rail { display: none; }

  .stacked-title .title-minor { font-size: .6em; }

  .combined-intake-card .custom-amount-field { max-width: 100%; }

  .hero-manage-tab { width: 100%; justify-content: center; }
}

/* ============================================================
   Consistency pass — one shell, one button scale, one gold
   ============================================================ */

:root {
  --gold: #f0bd22;
  --gold-ink: #17384b;

  --shell-max: 1280px;
  --shell-gutter: clamp(18px, 4vw, 56px);
  --shell: min(var(--shell-max), calc(100% - 2 * var(--shell-gutter)));
  --shell-pad: max(var(--shell-gutter), calc((100% - var(--shell-max)) / 2));

  --btn-h: 48px;
  --btn-h-sm: 40px;
  --btn-radius: 12px;
  --card-radius: 20px;
  --card-radius-sm: 14px;
}

/* --- 1. Horizontal alignment: full-bleed bands ------------- */
.site-header,
.market-strip,
.site-footer,
.page-hero,
.pb-hero,
.directory-hero-classic,
.coupon-search-hero,
.combined-intake-hero,
.coupon-management-hero,
.resume-upload-visual,
.resume-directory-photo {
  padding-left: var(--shell-pad);
  padding-right: var(--shell-pad);
}

.pb-section {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-left: var(--shell-pad);
  padding-right: var(--shell-pad);
}

/* --- 2. Horizontal alignment: centred content shells ------- */
.jobs-workspace,
.page-action-band,
.coupon-map-row,
.directory-builder,
.history-section,
.coupon-management-layout,
.coupon-results-header,
.large-coupon-results,
.candidate-resume-shell,
.combined-intake-grid,
.past-search-card,
.form-layout-page,
.resume-builder,
.job-post-builder,
.posting-steps {
  width: var(--shell);
  max-width: var(--shell);
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

/* --- 3. Vertical rhythm ------------------------------------ */
.page-hero { padding-top: 48px; padding-bottom: 40px; }

.jobs-workspace,
.coupon-map-row,
.form-layout-page,
.job-post-builder {
  margin-top: 28px;
}

.form-layout-page,
.resume-builder {
  padding-top: 32px;
  padding-bottom: 72px;
}

.directory-builder,
.history-section,
.coupon-management-layout {
  padding-top: 44px;
  padding-bottom: 72px;
}

/* --- 4. Buttons: one primary scale ------------------------- */
.header-button,
.head-actions a,
.directory-actions a,
.row-actions a,
.history-row > a:last-child,
.create-promo-panel a,
.candidate-contact-panel a,
.coupon-management-primary,
.browse-discounts-action,
.side-tab-stack a,
.fd-action-cta a,
.inline-support-cta a,
.form-primary-link,
.form-support-link,
.coupon-update-cta,
.resume-early-access-cta,
.form-side-card a,
.form-side-card button,
.resume-upload-zone button,
.resume-publish-card a,
.jobs-results-heading > a,
.coupon-map-actions a,
.coupon-results-actions a,
.combined-intake-card .page-submit,
.hero-manage-tab,
.search-panel button,
.large-centered-action,
.pb-job-search button,
.pb-cta-link {
  min-height: var(--btn-h);
  padding-top: 0;
  padding-bottom: 0;
  border-radius: var(--btn-radius);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: none;
}

.combined-intake-card .page-submit {
  padding-top: 8px;
  padding-bottom: 8px;
}

/* --- 5. Buttons: one compact scale ------------------------- */
.inline-job-actions a,
.inline-job-actions button,
.history-row button,
.map-toggle,
.pb-quick-actions a,
.pb-role-actions a,
.filter-heading button,
.local-search-summary button,
.coupon-manage-tabs a,
.additional-results {
  min-height: var(--btn-h-sm);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
}

/* --- 6. Cards: one radius scale ---------------------------- */
.form-panel,
.form-side-card,
.upload-card,
.resume-profile-card,
.resume-upload-zone,
.resume-publish-card,
.jobs-primary-results,
.jobs-search-column > section,
.jobs-search-column > aside,
.category-table-card,
.history-table-card,
.selection-pill-row,
.location-select-card,
.combined-intake-card,
.fd-action-tab,
.create-promo-panel,
.candidate-contact-panel,
.past-saved-jobs,
.coupon-map-actions,
.large-coupon-card,
.coupon-ad-card,
.posting-steps article,
.posting-steps a,
.pb-role-card,
.filter-card,
.hero-note-card {
  border-radius: var(--card-radius);
}

.result-card,
.publish-list label,
.compact-interest-options label,
.filter-check,
.professional-details,
.jobs-map-inline-visual,
.pb-market-cards article,
.pb-directory-row a,
.pb-entry-list a {
  border-radius: var(--card-radius-sm);
}

/* --- 7. Images -------------------------------------------- */
.form-map,
.coupon-map-strip img,
.jobs-map-inline-visual img,
.location-preview .form-map {
  border-radius: var(--card-radius-sm);
  object-fit: cover;
}

.resume-directory-photo {
  display: block;
  padding-top: 22px;
  background: transparent;
}

.resume-directory-photo,
.resume-directory-photo img {
  height: auto;
  max-height: none;
}

.resume-upload-visual img,
.resume-directory-photo img {
  width: 100%;
  height: 240px;
  max-height: 240px;
  margin: 0;
  display: block;
  border-radius: var(--card-radius);
  object-fit: cover;
  object-position: center 30%;
}

.form-map,
.coupon-map-strip img {
  height: 210px;
}

/* --- 8. Type: leads and labels ---------------------------- */
.lead,
.page-hero .lead {
  max-width: 640px;
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: 1.55;
}

.eyebrow,
.builder-kicker {
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* --- 9. Component tweaks ---------------------------------- */
.fd-action-tab-centered { width: min(780px, 100%); }

.split-hero { align-items: center; }

.compact-job-search .search-copy {
  flex-wrap: wrap;
  gap: 6px 14px;
}

.compact-job-search .search-copy > div { flex: 1 1 auto; }

.category-helper-link { white-space: nowrap; }

.market-strip { justify-content: flex-start; }

.coupon-management-hero { min-height: 300px; }

@media (max-width: 700px) {
  .resume-upload-visual img,
  .resume-directory-photo img {
    height: 140px;
    max-height: 140px;
  }

  .form-map,
  .coupon-map-strip img { height: 170px; }

  .page-hero { padding-top: 32px; padding-bottom: 28px; }
}

/* --- 10. Coupon directory alignment ------------------------ */
.coupon-directory-search {
  max-width: 900px;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.1fr) 190px;
}

.coupon-directory-search label:nth-child(4),
.coupon-directory-search button { grid-column: auto; }

.coupon-directory-search label,
.coupon-directory-search button {
  min-height: 52px;
  border-radius: var(--btn-radius);
}

.coupon-map-row .coupon-map-strip {
  width: 100%;
  margin: 0;
  display: grid;
  border-radius: var(--card-radius);
}

.coupon-map-row .coupon-map-strip img {
  height: 100%;
  min-height: 210px;
  border-radius: inherit;
}

@media (max-width: 700px) {
  .coupon-directory-search { grid-template-columns: minmax(0, 1fr); }
  .coupon-map-row .coupon-map-strip img { height: 170px; min-height: 0; }
}

/* --- 11. Higher-specificity shell overrides ---------------- */
.coupon-directory-page .coupon-results-header,
.large-coupon-results.old-coupon-results,
.coupon-directory-page .large-coupon-results {
  width: var(--shell);
  max-width: var(--shell);
  margin-left: auto;
  margin-right: auto;
}

.coupon-directory-page .tight-results-header {
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.coupon-directory-page .coupon-results-header h2 {
  font-size: clamp(21px, 2.3vw, 29px);
  letter-spacing: -.03em;
}

.coupon-directory-page .coupon-results-header > div a {
  font-size: 15px;
  font-weight: 900;
}

/* --- 12. Remaining containers on the shell ----------------- */
.how-grid,
.detail-layout-page,
.management-grid,
.category-directory-grid,
.about-flow-grid,
.jobs-content,
.detail-shell,
.resume-directory-shell {
  width: var(--shell);
  max-width: var(--shell);
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

.about-story {
  width: var(--shell);
  max-width: var(--shell);
  margin-left: auto;
  margin-right: auto;
}

.pb-cta-band {
  padding-left: var(--shell-pad);
  padding-right: var(--shell-pad);
}

/* --- 13. Remaining button normalisation -------------------- */
.primary,
.detail-action-row .apply-now,
.detail-action-row a,
.detail-action-row button,
.how-cta a,
.category-directory-grid a.category-open,
.auth-shell button,
.auth-shell .page-submit,
.management-card a,
.modal-actions button {
  min-height: var(--btn-h);
  border-radius: var(--btn-radius);
  font-size: 14px;
  font-weight: 900;
  text-transform: none;
}

.pb-role-actions a,
.pb-quick-actions a,
.coming-soon-actions a,
.coupon-ad-card footer a,
.coupon-directory-page .coupon-ad-card footer a {
  min-height: var(--btn-h-sm);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
}

.directory-switch a,
.market-strip a {
  border-radius: var(--btn-radius);
  font-size: 13px;
}

/* Large search / hero submit buttons share one size */
.pb-job-search button,
.coupon-directory-search button,
.enlarged-job-search .search-panel-strong button,
.search-panel button,
.category-search button {
  min-height: 52px;
  border-radius: var(--btn-radius);
  font-size: 15px;
  font-weight: 900;
}

/* No square-cornered buttons left anywhere */
.more-details-button,
.site-footer form button,
.footer-search button,
button {
  border-radius: 10px;
}

.mobile-menu-toggle,
.coming-soon-close,
.modal-close,
.membership-tier-options span,
.round-back { border-radius: inherit; }

.mobile-menu-toggle { border-radius: 10px; }
.coming-soon-close,
.modal-close,
.round-back { border-radius: 999px; }
.membership-tier-options span { border-radius: var(--card-radius-sm); }

/* --- 14. Final button font/size alignment ------------------ */
.apply-card a,
.apply-card button,
.about-story a {
  min-height: var(--btn-h);
  border-radius: var(--btn-radius);
  font-size: 14px;
  font-weight: 900;
}

.compact-map-footer button,
.site-footer form button,
.more-details-button {
  min-height: var(--btn-h-sm);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
}

.category-search button,
.category-search a { font-size: 15px; }

/* --- 15. One heading scale across the site ----------------- */
/* Tier 1 — landing hero */
.pb-role-card h1,
.pb-search-panel h1 {
  font-size: clamp(44px, 5.6vw, 76px);
  line-height: 1.02;
}

/* Tier 2 — interior page hero */
.page-hero h1,
.directory-hero-classic h1,
.coupon-management-hero h1,
.detail-hero h1,
.job-detail-hero h1,
.candidate-hero h1 {
  font-size: var(--fs-page-title);
  line-height: 1.04;
}

/* Tier 3 — section headings */
.section-head-row h2,
.history-section h2,
.coupon-management-layout h2,
.coupon-results-header h2,
.pb-section-head h2,
.pb-cta-band h2,
.about-story h2,
.about-flow-grid h2 {
  font-size: clamp(21px, 2.3vw, 29px);
  line-height: 1.2;
  letter-spacing: -.03em;
}

/* Tier 4 — card / panel headings */
.candidate-resume-card h2,
.management-card h2,
.how-grid article h2,
.pb-entry-panel h2,
.modal-brand h2,
.apply-card h2,
.detail-side-card h2 {
  font-size: clamp(19px, 1.95vw, 25px);
  line-height: 1.16;
  letter-spacing: -.025em;
}

.candidate-topline h1,
.job-detail-topline h1,
.detail-topline h1 {
  font-size: var(--fs-page-title);
  line-height: 1.04;
}

.auth-card h2,
.auth-shell h2 {
  font-size: clamp(19px, 1.95vw, 25px);
  line-height: 1.16;
  letter-spacing: -.025em;
}

.detail-title h1 {
  font-size: var(--fs-page-title);
  line-height: 1.04;
}

.legal-card h1,
.status-card h1 {
  font-size: var(--fs-page-title);
  line-height: 1.04;
}

.legal-card h2 {
  font-size: clamp(19px, 1.95vw, 25px);
  letter-spacing: -.025em;
}

/* Landing hero shares the site shell */
.pb-role-landing {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* --- 16. Mobile alignment polish --------------------------- */
@media (max-width: 700px) {
  .section-head-row {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }

  .head-actions,
  .directory-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .head-actions a,
  .directory-actions a { width: 100%; }

  .category-table-head,
  .category-table-card a,
  .selection-pill-row {
    grid-template-columns: minmax(0, 1fr) 58px 58px;
    gap: 10px;
    align-items: center;
  }

  .category-table-card { padding: 18px; }

  .category-table-card a.selected span {
    min-width: 0;
    width: 100%;
    padding: 10px 12px;
  }

  .selection-pill-row {
    min-height: 62px;
    padding: 0 18px;
    font-size: 16px;
  }

  .jobs-results-heading { gap: 12px; }

  .fd-action-copy b { font-size: 16px; }
}

.coupon-detail-layout {
  width: var(--shell);
  max-width: var(--shell);
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

/* --- 17. Split hero: keep copy and side card on one row ---- */
.split-hero > div:first-child,
.split-hero > .hero-copy {
  flex: 1 1 440px;
  min-width: 0;
}

.page-hero h1 { max-width: 720px; }

.split-hero > .fd-action-tab,
.split-hero > .hero-side-stack,
.split-hero > .hero-note-card,
.split-hero > .directory-switch {
  flex: 0 1 auto;
}

@media (max-width: 900px) {
  .split-hero > div:first-child { flex: 1 1 100%; }
}

/* Jobs hero: selection menu on its own centred row */
.split-hero.switch-centered > div:first-child { flex: 1 1 100%; }

.switch-centered .directory-switch {
  flex: 0 0 auto;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

/* --- 18. Jobs sidebar: search card, map card, support tab -- */
.jobs-search-column .search-panel,
.compact-job-search .search-panel {
  width: 100%;
  max-width: 100%;
  margin: 14px 0 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.enlarged-job-search { padding: 20px !important; }

.enlarged-job-search .search-copy {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.enlarged-job-search .search-panel-strong label {
  display: block;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: var(--card-radius-sm);
  background: #f8fbfd;
}

.enlarged-job-search .search-panel-strong label > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--blue);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.enlarged-job-search .search-panel-strong label input[type="text"],
.enlarged-job-search .search-panel-strong label input:not([type]) {
  width: 100%;
  min-height: 30px;
  margin-top: 4px;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 15px;
  font-weight: 800;
}

.enlarged-job-search .search-panel-strong label input[type="range"] {
  width: 100%;
  margin-top: 10px;
  accent-color: var(--blue);
}

.enlarged-job-search .search-panel-strong output {
  color: var(--ink);
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
}

.enlarged-job-search .search-panel-strong button {
  width: 100%;
  margin-top: 2px;
  border: 0;
  color: #fff;
  background: var(--blue);
}

/* Map card: header row above, full-width map below */
.jobs-map-inline.compact-map-card {
  width: 100%;
  margin: 0;
  grid-template-columns: minmax(0, 1fr);
  border-radius: var(--card-radius);
}

.compact-map-header {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
}

.compact-map-summary {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.compact-map-summary b {
  font-size: 14px;
  font-weight: 900;
}

.compact-map-summary em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.compact-map-header button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: #294e63;
  background: #fff;
  font-size: 12px;
  font-weight: 900;
}

.compact-map-card .jobs-map-inline-visual { border-radius: 0; }

.compact-map-card .jobs-map-inline-visual img {
  height: 210px;
  border-radius: 0;
}

.jobs-map-inline.is-collapsed .compact-map-header { border-bottom: 0; }

/* Action tab inside the jobs sidebar keeps its dark card treatment */
.jobs-search-column > .fd-action-tab {
  border: 0;
  color: #fff;
  background: linear-gradient(135deg, #173f55, #1d70a6);
  box-shadow: 0 16px 36px rgba(20, 55, 75, .16);
}

/* Recently Saved Jobs heading sits tight to its caption */
.jobs-workspace .past-saved-jobs { padding: 25px; }

.saved-jobs-heading { margin-bottom: 16px; }

.saved-jobs-heading h2 { margin: 0; }

.saved-jobs-note {
  display: block;
  margin: 3px 0 0 14px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  font-style: italic;
  letter-spacing: .01em;
}

/* --- 19. Form control typography --------------------------- */
/* textarea defaults to monospace and select to the system font
   unless the family is inherited explicitly. */
input,
select,
textarea,
optgroup,
button {
  font-family: inherit;
  font-size: inherit;
  letter-spacing: inherit;
}

textarea { line-height: 1.55; }

/* --- 20. Field value typography (lighter, smaller) --------- */
input,
select,
textarea,
.form-panel input,
.form-panel select,
.form-panel textarea,
.category-search input,
.resume-profile-card input,
.resume-profile-card select,
.resume-profile-card textarea,
.combined-intake-card .page-email,
.search-panel input,
.search-panel select,
.contact-form input,
.contact-form select,
.contact-form textarea,
.enlarged-job-search .search-panel-strong label input:not([type]),
.enlarged-job-search .search-panel-strong label input[type="text"] {
  font-size: 15px;
  font-weight: 500;
}

.pb-job-search input,
.hero-search input,
.search-card input,
.search-card select,
.coupon-directory-search input,
.coupon-directory-search select {
  font-weight: 500 !important;
}

input::placeholder,
textarea::placeholder {
  color: #8ea1b1;
  font-weight: 500;
}

/* --- 21. Resume upload "Search details" card --------------- */
.builder-kicker {
  width: auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
}

.builder-heading {
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  align-items: start;
}

.builder-heading h2 { margin: 0; }

.builder-heading p {
  max-width: 660px;
  margin: 0;
  font-size: 14px;
}

.resume-profile-card {
  padding: 28px;
  gap: 16px;
}

.resume-profile-card .field-grid { gap: 16px; }

.resume-profile-card .field-grid.two {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.resume-profile-card .field-grid.two > *:last-child { grid-column: span 2; }

.resume-profile-card label > span,
.form-panel label > span {
  display: block;
  margin-bottom: 6px;
}

.resume-profile-card input,
.resume-profile-card select,
.resume-profile-card textarea {
  min-height: 50px;
  margin-top: 0;
  border-radius: var(--card-radius-sm);
}

.resume-profile-card textarea { min-height: 112px; }

/* One field size and weight everywhere */
.auth-form input,
.auth-form select,
.auth-form textarea,
.location-select-card select,
.location-select-card input,
.coupon-directory-search input,
.coupon-directory-search select,
.pb-job-search input,
.hero-search input,
.search-card input,
.search-card select {
  font-size: 15px !important;
  font-weight: 500 !important;
}

.registration-dialog input,
.registration-dialog select,
.registration-dialog textarea,
.interest-form input {
  font-size: 15px !important;
  font-weight: 500 !important;
}

/* --- 22. Final outliers: heading, eyebrow, button, navy ---- */
.coupon-hero-card h1 {
  font-size: var(--fs-page-title);
  line-height: 1.04;
}

.combined-intake-hero .eyebrow { font-size: 12px; }

.status-actions a {
  min-height: var(--btn-h);
  border-radius: var(--btn-radius);
  font-size: 14px;
  font-weight: 900;
}

/* One dark button navy everywhere */
.inline-job-actions a {
  border-color: var(--navy);
  background: var(--navy);
}

/* --- 23. Header CTA: centre the label in the pill ---------- */
.header-actions button,
.header-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  line-height: 1;
  white-space: nowrap;
}

/* ============================================================
   Round 3 — control heights, selection controls, page fixes
   ============================================================ */

:root {
  --field-h: 48px;
  --field-h-lg: 60px;
}

/* --- 24. One height for every bordered field --------------- */
.form-panel input,
.form-panel select,
.form-panel textarea,
.category-search input,
.resume-profile-card input,
.resume-profile-card select,
.resume-profile-card textarea,
.combined-intake-card .page-email,
.auth-form input,
.auth-form select,
.contact-form input,
.contact-form select,
.location-select-card select,
.location-select-card input,
.professional-detail-grid select,
.professional-detail-grid input:not([type=checkbox]):not([type=radio]) {
  min-height: var(--field-h);
}

.form-panel textarea,
.resume-profile-card textarea,
.contact-form textarea {
  min-height: 112px;
}

/* Search boxes that stack a caption over the value */
.coupon-directory-search label,
.coupon-directory-search button,
.pb-job-search label,
.pb-job-search button,
.enlarged-job-search .search-panel-strong label,
.enlarged-job-search .search-panel-strong button {
  min-height: var(--field-h-lg);
}

/* --- 25. Checkboxes and radios: visible in both themes ----- */
.light-options input[type="checkbox"],
.light-options input[type="radio"],
.compact-interest-options input[type="checkbox"],
.publish-list input[type="checkbox"],
.filter-check input[type="checkbox"],
.choice-row input[type="checkbox"],
.professional-detail-grid input[type="checkbox"],
.professional-detail-grid input[type="radio"] {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  margin: 0;
  display: inline-grid;
  place-items: center;
  appearance: none;
  -webkit-appearance: none;
  border: 2px solid #b7c9d7;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}

.light-options input[type="radio"],
.professional-detail-grid input[type="radio"] {
  border-radius: 50%;
}

.light-options input[type="checkbox"]:hover,
.compact-interest-options input[type="checkbox"]:hover,
.publish-list input[type="checkbox"]:hover,
.filter-check input[type="checkbox"]:hover,
.choice-row input[type="checkbox"]:hover,
.professional-detail-grid input:hover {
  border-color: #7fa8c4;
}

.light-options input[type="checkbox"]:checked,
.compact-interest-options input[type="checkbox"]:checked,
.publish-list input[type="checkbox"]:checked,
.filter-check input[type="checkbox"]:checked,
.choice-row input[type="checkbox"]:checked,
.professional-detail-grid input[type="checkbox"]:checked,
.professional-detail-grid input[type="radio"]:checked,
.light-options input[type="radio"]:checked {
  border-color: var(--blue);
  background: var(--blue);
}

.light-options input[type="checkbox"]:checked::after,
.compact-interest-options input[type="checkbox"]:checked::after,
.publish-list input[type="checkbox"]:checked::after,
.filter-check input[type="checkbox"]:checked::after,
.choice-row input[type="checkbox"]:checked::after,
.professional-detail-grid input[type="checkbox"]:checked::after {
  content: "";
  width: 5px;
  height: 9px;
  margin-top: -2px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.light-options input[type="radio"]:checked::after,
.professional-detail-grid input[type="radio"]:checked::after {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
}

.light-options input:focus-visible,
.compact-interest-options input:focus-visible,
.publish-list input:focus-visible,
.filter-check input:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

/* --- 26. Select chevron, one treatment -------------------- */
select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 38px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23486b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}

/* --- 27. Create job post: steps + right column ------------ */
.posting-steps {
  gap: 16px;
  margin-bottom: 28px;
}

.posting-steps article,
.posting-steps a {
  min-height: 92px;
  padding: 18px 20px;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 3px 14px;
  align-content: center;
}

.posting-steps span {
  width: 40px;
  height: 40px;
  grid-row: span 2;
  align-self: center;
  display: grid;
  place-items: center;
  border-radius: var(--card-radius-sm);
  font-size: 13px;
  font-weight: 900;
}

.posting-steps b {
  align-self: end;
  font-size: 14px;
  line-height: 1.25;
}

.posting-steps small {
  align-self: start;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.job-post-sidebar {
  display: grid;
  gap: 12px;
  align-content: start;
}

.job-post-sidebar > span { margin-bottom: -4px; }

.job-post-sidebar > h2,
.job-post-sidebar > p {
  margin: 0;
}

.job-post-sidebar > p {
  margin-bottom: 4px;
  font-size: 14px;
}

.job-post-sidebar > a,
.job-post-sidebar > button {
  width: 100%;
  margin: 0;
}

.job-post-sidebar > .fd-action-tab {
  margin-top: 10px;
  padding-top: 18px;
}

/* --- 28. Resume directory: A–Z bar + selected row ---------- */
.alpha-rail {
  width: 100%;
  margin: 0 0 18px;
  position: static;
  top: auto;
  right: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 13px;
  text-align: left;
}

.alpha-rail span,
.alpha-rail b {
  min-width: 34px;
  min-height: 34px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: #5c7484;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}

.alpha-rail span:hover {
  border-color: #9dc2d8;
  color: var(--blue);
}

.alpha-rail b {
  color: #fff;
  border-color: var(--blue);
  background: var(--blue);
  text-decoration: none;
}

.category-table-card a.selected {
  border-radius: var(--card-radius-sm);
  background: #eef7ff;
  box-shadow: inset 3px 0 0 var(--blue);
}

.category-table-card a.selected span {
  width: auto;
  min-width: 0;
  padding: 0 0 0 12px;
  color: var(--blue);
  background: transparent;
  font-weight: 900;
  text-align: left;
}

.category-table-card a.selected strong { color: var(--blue); }

/* --- 29. Coupon directory search bar ----------------------- */
.coupon-directory-search label {
  display: block;
  padding: 9px 14px;
  border-radius: var(--btn-radius);
  background: #fff;
  box-shadow: none;
}

.coupon-directory-search label span {
  display: block;
  color: var(--blue);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.coupon-directory-search label span .field-link { color: var(--blue); }

.coupon-directory-search input,
.coupon-directory-search select {
  width: 100%;
  min-height: 26px;
  margin-top: 2px;
  padding: 0;
  border: 0;
  color: var(--ink) !important;
  background-color: transparent;
}

.coupon-directory-search select {
  padding-right: 26px;
  background-position: right 2px center;
}

.coupon-directory-search input::placeholder { color: #8ea1b1; }

.coupon-directory-search button {
  border: 0;
  color: #fff;
  background: var(--navy);
  text-transform: none;
}

@media (max-width: 700px) {
  .alpha-rail span,
  .alpha-rail b { min-width: 30px; min-height: 30px; font-size: 12px; }

  .posting-steps article,
  .posting-steps a { min-height: 0; }
}

/* --- 30. Selected state uses the site blue, not a stray green */
.interest-options input:checked,
.membership-option:has(input:checked) span {
  border-color: var(--blue);
  background: var(--blue);
  box-shadow: 0 0 0 4px rgba(22, 137, 247, .18);
}

.interest-options label:has(input:checked),
.membership-option:has(input:checked),
.registration-card-page .light-options label:has(input:checked) {
  border-color: rgba(22, 137, 247, .6);
  background: rgba(22, 137, 247, .1);
  box-shadow: inset 0 0 0 1px rgba(22, 137, 247, .18);
}

.publish-list label:has(input:checked),
.filter-check:has(input:checked) {
  border-color: rgba(22, 137, 247, .35);
}

/* --- 31. Strict control-height scale ----------------------- */
/* fields 48 · buttons 48 · compact 40 · tabs 44 · search 60 */

.combined-intake-card .page-email,
.combined-intake-card .custom-amount-field {
  height: var(--field-h);
  min-height: var(--field-h);
  padding-top: 0;
  padding-bottom: 0;
}

.combined-intake-card .page-submit {
  min-height: var(--btn-h);
  height: auto;
}

/* Search submits all share one height */
.pb-job-search button,
.coupon-directory-search button,
.search-panel button,
.enlarged-job-search .search-panel-strong button,
.category-search button,
.category-search > a {
  height: var(--field-h-lg);
  min-height: var(--field-h-lg);
  padding-top: 0;
  padding-bottom: 0;
}

/* Compact controls */
.compact-map-header button,
.candidate-inline-actions a,
.candidate-inline-actions button,
.pb-role-actions a,
.category-link-list a {
  min-height: var(--btn-h-sm);
  height: auto;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 800;
}

/* Tabs */
.pb-role-tabs button,
.pb-role-tabs a,
.directory-switch a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Round icon button matches the button scale */
.coupon-search-hero .round-back {
  width: var(--btn-h);
  height: var(--btn-h);
  min-height: var(--btn-h);
  font-size: 26px;
  line-height: 1;
}

/* Paired form actions stay on one line on desktop */
.form-action-pair > a,
.form-action-pair > button {
  min-height: var(--btn-h);
  white-space: nowrap;
}

@media (max-width: 700px) {
  .form-action-pair > a,
  .form-action-pair > button { white-space: normal; }
}

.form-action-pair {
  grid-auto-rows: var(--btn-h);
  align-items: stretch;
}

/* Unchecked boxes need enough edge contrast to be seen on white */
.light-options input[type="checkbox"],
.light-options input[type="radio"],
.compact-interest-options input[type="checkbox"],
.publish-list input[type="checkbox"],
.filter-check input[type="checkbox"],
.choice-row input[type="checkbox"],
.professional-detail-grid input[type="checkbox"],
.professional-detail-grid input[type="radio"] {
  border-color: #7d94a6;
}

/* --- 32. Form flow rhythm --------------------------------- */
/* Standalone labels between field grids had no vertical margin,
   so they sat flush against the grid above and below. */
.job-step-block > * + *,
.form-panel > * + * {
  margin-top: 18px;
}

/* card already uses grid gap — no double spacing */
.resume-profile-card { gap: 18px; }

.resume-profile-card > * + * { margin-top: 0; }

.form-panel > .form-action-pair { margin-top: 22px; }

/* --- 33. Checkbox / radio geometry ------------------------- */
/* Field rules were sizing these as text inputs (48px tall,
   14px side padding), so they rendered as tall rectangles. */
input[type="checkbox"],
input[type="radio"],
.form-panel input[type="checkbox"],
.form-panel input[type="radio"],
.resume-profile-card input[type="checkbox"],
.resume-profile-card input[type="radio"],
.combined-intake-card input[type="checkbox"],
.combined-intake-card input[type="radio"],
.auth-form input[type="checkbox"],
.auth-form input[type="radio"],
.contact-form input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  flex: 0 0 auto;
  aspect-ratio: 1;
}

/* --- 34. Location preview: even split --------------------- */
.location-preview {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
}

.location-preview .form-map {
  height: 100%;
  min-height: 190px;
  margin: 0;
}

.location-preview .choice-row {
  align-content: start;
  gap: 10px;
}

.choice-row label {
  padding: 12px 14px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: var(--card-radius-sm);
  background: #f8fbfd;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.choice-row label:has(input:checked) {
  border-color: rgba(22, 137, 247, .35);
  background: #f2f9ff;
}

/* --- 35. Early registration: hero and column balance ------- */
.combined-intake-hero { padding-top: 30px; padding-bottom: 58px; }

.combined-intake-grid { margin-top: -42px; }

.combined-intake-card {
  padding: 24px;
  display: flex;
  flex-direction: column;
}

.combined-intake-card .compact-interest-options { flex: 1 1 auto; align-content: start; }

.combined-intake-card .page-submit { margin-top: auto; }

.membership-intake-card .page-submit { margin-top: 10px; }

/* Give the hero pill room to breathe above the cards */
.combined-intake-grid { margin-top: -28px; }

.combined-intake-card .intake-disclaimer {
  padding: 6px 10px;
  line-height: 1.35;
}

.membership-tier-options span { min-height: 44px; }

.combined-intake-card .page-form-label { margin-top: 8px; }

/* --- 36. Step strip used in normal flow (not overlapping) -- */
.posting-steps.flow-steps {
  margin-top: 28px;
  margin-bottom: 0;
}

.resume-builder { padding-top: 22px; }

/* --- 37. Resume upload: details + file, then publish band -- */
.resume-builder {
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .78fr);
  align-items: start;
  padding-bottom: 0;
}

.resume-builder .resume-upload-zone {
  min-height: 0;
  height: 100%;
  padding: 30px;
}

.resume-publish-section {
  width: var(--shell);
  max-width: var(--shell);
  margin: 22px auto 0;
  padding-bottom: 72px;
}

.resume-publish-card {
  display: grid;
  gap: 18px;
  position: static;
}

.publish-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.publish-head h2 { margin: 4px 0 0; }

.publish-head p {
  max-width: 520px;
  margin: 0;
  font-size: 14px;
  text-align: right;
}

.resume-publish-card .publish-list {
  margin-top: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.resume-publish-card > a {
  width: fit-content;
  min-width: 280px;
  margin: 0 0 0 auto;
}

@media (max-width: 980px) {
  .publish-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .publish-head p { text-align: left; }

  .resume-publish-card .publish-list { grid-template-columns: minmax(0, 1fr); }

  .resume-publish-card > a { width: 100%; margin: 0; }
}

/* --- Mobile touch pass ------------------------------------- */
/* Scoped to small screens only — cannot reach the desktop layout. */
@media (max-width: 700px) {
  .brand {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .pb-job-search label span,
  .hero-search label span,
  .search-card label span { font-size: 11px; }

  .category-helper-link,
  .additional-results,
  .additional-results > a,
  .coupon-results-header > div a,
  .history-row > a,
  .inline-category-link,
  .field-link,
  .back-link,
  .auth-row a,
  .auth-switch a,
  .legal-blue-link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .additional-results { min-height: 48px; }

  .professional-detail-grid label,
  .choice-row label,
  .compact-interest-options label,
  .publish-list label,
  .filter-check { min-height: 44px; }

  .professional-detail-grid label {
    display: flex;
    align-items: center;
    gap: 10px;
  }
}

/* --- Persistent back bar ----------------------------------- */
.page-back-bar {
  padding: 8px var(--shell-pad);
  border-bottom: 1px solid var(--line);
  background: #eef4f8;
}

.page-back-bar a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.page-back-bar a:hover { text-decoration: underline; }

/* Footer nav is now three equal columns */
.site-footer { grid-template-columns: 1.6fr 1fr 1fr 1fr; }

@media (max-width: 980px) {
  .site-footer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .site-footer { grid-template-columns: minmax(0, 1fr); }
  .page-back-bar { padding-top: 4px; padding-bottom: 4px; }
  .page-back-bar a { min-height: 44px; }
}

/* --- Job search: settings + filters on the left ------------ */
.jobs-workspace {
  grid-template-columns: minmax(320px, .75fr) minmax(0, 1.65fr);
}

.jobs-search-column {
  grid-column: 1;
  grid-row: 1;
}

.jobs-primary-column {
  grid-column: 2;
  grid-row: 1;
}

@media (max-width: 980px) {
  .jobs-workspace { grid-template-columns: minmax(0, 1fr); }

  .jobs-search-column,
  .jobs-primary-column {
    grid-column: 1;
    grid-row: auto;
  }
}

/* --- Resume upload: chosen file feedback -------------------- */
.chosen-file {
  margin: 12px 0 0;
  padding: 10px 14px;
  border: 1px solid rgba(22, 137, 247, .3);
  border-radius: var(--card-radius-sm);
  color: #1c5f8a;
  background: #eef7ff;
  font-size: 13px;
  font-weight: 800;
}

.chosen-file[hidden] { display: none; }

/* --- Step cards: centre the block, equal space top/bottom --- */
.posting-steps article,
.posting-steps a {
  align-content: center;
  align-items: center;
}

/* --- How It Works: user-type labels, not a 1-2-3 sequence --- */
.how-grid article > span,
.about-flow-grid article > span {
  width: fit-content;
  min-width: 0;
  padding: 5px 12px;
  border-radius: 999px;
  color: #1c5f8a;
  background: #e8f1f7;
  font-size: 11px;
  letter-spacing: .06em;
}

/* --- Crisp initials avatar (replaces upscaled 39px photos) -- */
.avatar-initials {
  width: 88px;
  height: 88px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #1d70a6, #1689f7);
  font-size: 30px;
  font-weight: 900;
  letter-spacing: .02em;
}

/* --- Resume results ---------------------------------------- */
.resume-results-layout {
  width: var(--shell);
  max-width: var(--shell);
  margin: 0 auto;
  padding: 44px 0 72px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 296px;
  gap: 34px;
  align-items: start;
}

.resume-results-main { min-width: 0; }

.results-sort label { display: flex; align-items: center; gap: 10px; }

.results-sort span {
  color: var(--blue);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.results-sort select {
  min-height: var(--field-h);
  padding: 0 38px 0 14px;
  border: 1px solid var(--line);
  border-radius: var(--card-radius-sm);
  background-color: #fff;
}

.resume-result-list {
  display: grid;
  gap: 12px;
}

.resume-result-card {
  padding: 20px;
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--card-radius);
  background: #fff;
  color: inherit;
  text-decoration: none;
  box-shadow: 0 10px 26px rgba(16, 34, 48, .06);
}

a.resume-result-card:hover {
  border-color: rgba(22, 137, 247, .45);
  box-shadow: 0 14px 32px rgba(16, 34, 48, .12);
}

.resume-result-card.is-locked {
  background: #f7fafc;
  box-shadow: none;
}

.resume-result-card.is-locked .avatar-initials {
  color: #7d94a6;
  background: #e3ebf1;
}

.resume-result-body { min-width: 0; }

.resume-result-body b {
  display: block;
  font-size: 18px;
  letter-spacing: -.02em;
}

.resume-result-body > span {
  display: block;
  margin-top: 2px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
}

.resume-result-body p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.resume-tags {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.resume-tags span {
  padding: 5px 10px;
  border-radius: 999px;
  background: #eef4f8;
  color: #40607a;
  font-size: 12px;
  font-weight: 800;
}

.resume-result-meta {
  display: grid;
  gap: 6px;
  justify-items: end;
  text-align: right;
}

.resume-result-meta .boosted {
  padding: 5px 10px;
  border-radius: 999px;
  color: var(--gold-ink);
  background: var(--gold);
  font-size: 11px;
  font-weight: 900;
  font-style: normal;
  text-transform: uppercase;
}

.resume-result-meta small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

/* --- Pagination -------------------------------------------- */
.pagination {
  margin-top: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.page-numbers {
  display: flex;
  align-items: center;
  gap: 6px;
}

.pagination a {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: #40607a;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.pagination a:hover { border-color: #9dc2d8; color: var(--blue); }

.pagination a.active {
  color: #fff;
  border-color: var(--blue);
  background: var(--blue);
}

.pagination a[aria-disabled="true"] {
  opacity: .45;
  pointer-events: none;
}

.page-gap { padding: 0 4px; color: var(--muted); font-weight: 800; }

@media (max-width: 980px) {
  .resume-results-layout { grid-template-columns: minmax(0, 1fr); }
  /* The rail used to sit at grid-row 1, which on a phone pushed the saved/
     manage tabs and the sign-in card between the title and the result
     count. Andrew asked for nothing between those two, so the rail now
     follows the results. */
  .resume-results-layout .directory-side-rail { grid-row: 2; position: static; }
  .resume-results-layout .side-tab-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  /* one compact row per resume: avatar, name/role, status */
  .resume-result-card {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 12px;
    padding: 14px;
    align-items: center;
  }

  .avatar-initials { width: 44px; height: 44px; font-size: 15px; }

  .resume-result-body b { font-size: 15px; }

  .resume-result-body > span {
    margin-top: 1px;
    font-size: 12px;
    line-height: 1.3;
  }

  /* secondary detail lives on the profile page, not the list */
  .resume-result-body p { display: none; }

  .resume-tags { margin-top: 7px; gap: 5px; }

  .resume-tags span:nth-child(n + 3) { display: none; }

  .resume-tags span { padding: 3px 8px; font-size: 11px; }

  .resume-result-meta {
    gap: 4px;
    justify-items: end;
    text-align: right;
  }

  .resume-result-meta small { display: none; }

  .resume-result-meta .boosted { padding: 4px 8px; font-size: 10px; }

  .pagination {
    flex-wrap: wrap;
    justify-content: center;
  }

  .resume-results-layout .side-tab-stack { grid-template-columns: minmax(0, 1fr); }
}

/* --- Stacked headline rows (equal weight, one per line) ----- */
.title-lines { line-height: 1.06; }

.pb-role-card h1 { white-space: pre-line; }

/* each authored row must sit on its own line */
.page-hero h1.title-lines {
  max-width: 900px;
  text-wrap: balance;
}

/* Landing stacked title needs room for its longest row */
.pb-role-card h1 { max-width: 1120px; }

/* Split hero: give the copy column enough width for stacked rows */
.split-hero > .fd-action-tab { max-width: 400px; }

/* --- Jobs results: heading + action row, then listings ------ */
.jobs-primary-results {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 20px;
  align-items: center;
}

.jobs-primary-results > .jobs-results-heading { display: contents; }

.jobs-primary-results > .jobs-results-heading > div:not(.results-heading-actions) {
  grid-column: 1;
  grid-row: 1;
}

.results-heading-actions { display: contents; }

.results-heading-actions .boost-link {
  grid-column: 2;
  grid-row: 1;
  min-height: var(--btn-h);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border-radius: var(--btn-radius);
  color: #fff;
  background: var(--blue);
  font-size: 14px;
  font-weight: 900;
  white-space: nowrap;
  text-decoration: none;
}

.results-heading-actions .fd-action-tab {
  grid-column: 1 / -1;
  grid-row: 2;
  padding: 12px 16px;
  align-items: center;
  flex-direction: row;
  gap: 16px;
}

.results-heading-actions .fd-action-copy b {
  font-size: 14px;
  line-height: 1.35;
}

.results-heading-actions .fd-action-cta {
  flex: 0 0 auto;
  justify-items: end;
}

.results-heading-actions .fd-action-cta a {
  width: auto;
  font-size: 13px;
  white-space: nowrap;
}

.jobs-primary-results > .restaurant-result-grid {
  grid-column: 1 / -1;
  grid-row: 3;
}

@media (max-width: 700px) {
  .jobs-primary-results { grid-template-columns: minmax(0, 1fr); }

  .results-heading-actions .boost-link {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
  }

  .results-heading-actions .fd-action-tab {
    grid-column: 1;
    grid-row: auto;
    align-items: stretch;
    flex-direction: column;
  }

  .results-heading-actions .fd-action-cta a { width: 100%; }

  .jobs-primary-results > .restaurant-result-grid { grid-column: 1; grid-row: auto; }
}

/* --- Jobs hero: copy left, illustration right -------------- */
.split-hero.switch-centered > .hero-top {
  flex: 1 1 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.hero-copy {
  flex: 1 1 460px;
  min-width: 0;
}

.hero-art {
  flex: 0 1 420px;
  min-width: 0;
  align-self: center;
}

.hero-art svg {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 900px) {
  .split-hero.switch-centered > .hero-top {
    align-items: flex-start;
    flex-direction: column;
    gap: 24px;
  }

  .hero-art { display: none; }
}

/* ============================================================
   Mobile pass — content density
   All scoped to small screens; desktop is untouched.
   ============================================================ */

/* --- Footer: 4 stacked columns was ~706px on every page ----- */
@media (max-width: 700px) {
  .site-footer {
    padding: 26px var(--shell-pad) 30px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 16px;
    align-items: start;
  }

  .site-footer > div:first-child {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .site-footer img { width: 132px; }

  .site-footer > div:first-child p {
    max-width: none;
    margin: 0;
    font-size: 12px;
    line-height: 1.4;
  }

  .site-footer nav { gap: 9px; }

  .site-footer nav a { font-size: 13px; }
}

/* --- Coupon cards: 596px each on mobile -------------------- */
@media (max-width: 700px) {
  .coupon-ad-card { min-height: 0; }

  .coupon-ad-image { height: 132px; }

  .coupon-ad-image img { height: 132px; object-fit: cover; }

  .coupon-ad-image .coupon-qr { width: 46px; height: 46px; }

  .coupon-ad-body { padding: 12px 14px; }

  .coupon-ad-body h3 { font-size: 17px; line-height: 1.2; }

  .coupon-ad-body p { margin: 3px 0 0; font-size: 12px; line-height: 1.35; }

  /* the profile-reference lines are detail, not list content */
  .coupon-ad-body p:nth-of-type(n + 3) { display: none; }

  .coupon-ad-card footer { padding: 12px 14px; }

  .coupon-ad-card footer strong { font-size: 15px; line-height: 1.25; }
}

/* --- Landing: trim descriptive copy on phones -------------- */
@media (max-width: 700px) {
  .pb-market-cards article p { display: none; }

  .pb-market-cards article { padding: 16px; }

  .pb-role-support a { padding: 14px 16px; }

  .pb-role-support small { display: none; }

  .pb-directory-row a small { display: none; }

  .pb-directory-row a { padding: 14px 16px; }

  .pb-section { padding-top: 30px; padding-bottom: 30px; }
}

/* --- Jobs search: tighter panel on phones ------------------ */
@media (max-width: 700px) {
  .enlarged-job-search { padding: 16px !important; }

  .enlarged-job-search .search-copy { padding-bottom: 10px; }

  .enlarged-job-search .search-panel-strong { gap: 9px; }

  .enlarged-job-search .search-panel-strong label { padding: 8px 12px; }

  .compact-map-card .jobs-map-inline-visual img { height: 150px; }
}

/* coupon cards: match .coupon-directory-page specificity */
@media (max-width: 700px) {
  .coupon-directory-page .coupon-ad-card { min-height: 0; }

  .coupon-directory-page .coupon-ad-image { height: 132px; min-height: 0; }

  .coupon-directory-page .coupon-ad-image > img:first-child {
    height: 132px;
    object-fit: cover;
  }

  .coupon-directory-page .coupon-ad-card footer { padding: 12px 14px; }

  .coupon-directory-page .coupon-ad-card footer strong {
    font-size: 15px;
    line-height: 1.25;
  }
}

@media (max-width: 700px) {
  .coupon-ad-card,
  .coupon-directory-page .coupon-ad-card {
    min-height: 0;
    grid-template-rows: 132px auto auto;
  }

  .coupon-ad-card footer,
  .coupon-directory-page .coupon-ad-card footer {
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    gap: 12px;
  }

  .coupon-ad-card footer span {
    width: auto;
    display: flex;
    align-items: center;
    gap: 8px;
  }
}

/* ============================================================
   Mobile stacking — authoritative.
   Several desktop overrides were declared after the original
   media queries, so those layouts never collapsed on phones.
   This block is last, so it wins.
   ============================================================ */
@media (max-width: 900px) {
  .resume-builder,
  .resume-results-layout,
  .directory-builder-split,
  .jobs-workspace,
  .form-layout-page,
  .job-post-builder,
  .coupon-management-layout,
  .candidate-resume-shell,
  .detail-layout-page,
  .combined-intake-grid,
  .coupon-map-row,
  .large-coupon-results,
  .how-grid,
  .management-grid,
  .category-directory-grid,
  .about-flow-grid,
  .resume-upload-column,
  .contact-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  /* clear explicit desktop placements */
  .jobs-workspace > *,
  .resume-results-layout > *,
  .directory-builder-split > *,
  .jobs-primary-results > * {
    grid-column: auto;
    grid-row: auto;
  }

  .resume-results-layout .directory-side-rail,
  .directory-builder-split .directory-side-rail {
    position: static;
    top: auto;
  }

  .jobs-primary-results { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 700px) {
  .field-grid.two,
  .field-grid.three,
  .resume-profile-card .field-grid.two,
  .publish-list,
  .resume-publish-card .publish-list,
  .professional-detail-grid,
  .location-select-card,
  .coupon-directory-search {
    grid-template-columns: minmax(0, 1fr);
  }

  .resume-profile-card .field-grid.two > *:last-child { grid-column: auto; }

  .results-sort label {
    align-items: stretch;
    flex-direction: column;
    gap: 6px;
  }

  .section-head-row .results-sort { width: 100%; }

  .results-sort select { width: 100%; }
}

@media (max-width: 700px) {
  /* long CTA labels can't share a row at 390 */
  .directory-actions,
  .directory-actions.inline,
  .bottom-directory-actions,
  .head-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  /* map + consent checkboxes stack */
  .location-preview { grid-template-columns: minmax(0, 1fr); }

  .radius-control input[type="range"],
  .search-panel input[type="range"] {
    width: 100%;
    min-width: 0;
  }

  /* history rows: date + label above, actions below */
  .history-row {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 8px;
    align-items: start;
  }

  .history-row .row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .history-row .row-actions a,
  .history-row button { flex: 1 1 auto; }

  .pb-role-landing,
  .pb-role-tabs {
    max-width: 100%;
    min-width: 0;
  }

  .pb-role-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  /* nothing may exceed its container on a phone */
  input,
  select,
  textarea,
  .category-search input {
    max-width: 100%;
    box-sizing: border-box;
  }

  .radius-control,
  .search-panel label,
  .field-grid > label {
    min-width: 0;
    overflow: hidden;
  }

  .radius-control input[type="range"] {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  /* history rows at matching specificity */
  .history-table-card .history-row,
  .coupon-history-card .history-row,
  .saved-coupon-card .history-row,
  .published-coupon-card .history-row,
  .resume-posting-table .history-row,
  .list-purchase-table .history-row {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 8px;
  }

  .resume-posting-table .row-actions,
  .list-purchase-table .row-actions { min-width: 0; }

  .pb-role-tabs,
  .pb-role-card,
  .pb-role-landing { width: 100%; }

  .detail-title { grid-template-columns: minmax(0, 1fr); }

  .detail-title img { width: 52px; height: 52px; }
}

@media (max-width: 700px) {
  /* these were sized off 100vw, ignoring the hero's own padding */
  .pb-role-tabs,
  .pb-role-card,
  .pb-job-search {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* saved/published coupon rows kept explicit desktop columns */
  .saved-coupon-card .history-row,
  .published-coupon-card .history-row,
  .coupon-history-card .history-row {
    grid-template-columns: minmax(0, 1fr) !important;
    row-gap: 8px;
  }

  .category-search input,
  .category-search label {
    min-width: 0;
    width: 100%;
  }
}

@media (max-width: 700px) {
  /* these rows use grid-auto-flow:column, so extra children were
     creating implicit columns regardless of grid-template-columns */
  .history-row,
  .history-table-card .history-row,
  .coupon-history-card .history-row,
  .saved-coupon-card .history-row,
  .published-coupon-card .history-row,
  .resume-posting-table .history-row,
  .list-purchase-table .history-row {
    grid-auto-flow: row !important;
    justify-items: start;
  }

  .history-row > * { min-width: 0; }

  .pb-job-search input,
  .category-search input,
  .coupon-directory-search input { min-width: 0; }
}

@media (max-width: 700px) {
  /* drop out of grid entirely — column definitions can't apply */
  .history-row,
  .history-table-card .history-row,
  .coupon-history-card .history-row,
  .saved-coupon-card .history-row,
  .published-coupon-card .history-row,
  .resume-posting-table .history-row,
  .list-purchase-table .history-row {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
  }

  .history-row > span,
  .history-row > b,
  .history-row > strong { flex: 0 0 auto; }

  .history-row > a { flex: 1 1 auto; min-width: 0; }

  .history-row > .row-actions,
  .history-row > button {
    flex: 0 0 auto;
    margin-left: auto;
  }

  .category-search input,
  .pb-job-search input { width: 100%; }
}

@media (max-width: 700px) {
  /* long employer/location lines were overflowing their cell */
  .pb-job-list a { grid-template-columns: 40px minmax(0, 1fr) auto; }

  .pb-job-list a > div { min-width: 0; }

  .pb-job-list a span,
  .pb-job-list a b {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
  }
}

/* --- Icon badges (replaces word/abbreviation placeholders) -- */
.icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.pb-icon svg,
.pb-market-cards .pb-icon svg,
.pb-directory-row .pb-icon svg,
.pb-entry-list .pb-icon svg {
  width: 22px;
  height: 22px;
  display: block;
  fill: none;
  stroke: var(--blue);
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pb-market-cards .pb-icon,
.pb-directory-row .pb-icon,
.pb-entry-list .pb-icon {
  font-size: 0;
  color: transparent;
}

/* --- Landing CTA band button ------------------------------- */
.pb-cta-band .pb-cta-link {
  flex: 0 0 auto;
  padding: 0 24px;
  white-space: nowrap;
}

/* --- Role step badges: keep them circular, not stretched ---- */
.pb-role-support a > span {
  width: 34px;
  height: 34px;
  min-width: 0;
  padding: 0;
  display: grid;
  place-items: center;
  justify-self: start;
  align-self: start;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
}

@media (max-width: 700px) {
  /* five role tabs: 2 per row, last one spans */
  .pb-role-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .pb-role-tabs > *:last-child { grid-column: 1 / -1; }

  .pb-cta-band {
    align-items: stretch;
    flex-direction: column;
    gap: 16px;
  }

  .pb-cta-band .pb-cta-link {
    width: 100%;
    white-space: normal;
  }
}

/* --- Coupon hero search submit ----------------------------- */
.coupon-search-submit {
  min-height: var(--field-h-lg);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--btn-radius);
  color: #fff;
  background: var(--navy);
  font-size: 15px;
  font-weight: 900;
  text-decoration: none;
}

/* ============================================================
   Andrew — mobile B adjustments, 3 Aug
   ============================================================ */
@media (max-width: 900px) {
  /* search settings + filters sit under the listings,
     above Recently Saved Jobs */
  .jobs-workspace {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "results"
      "search";
  }

  .jobs-workspace > .jobs-primary-column {
    grid-area: results;
    display: contents;
  }

  .jobs-workspace > .jobs-search-column {
    grid-area: search;
    order: 0;
  }
}

@media (max-width: 900px) {
  /* re-flow the primary column so saved jobs land after search */
  .jobs-workspace { display: flex; flex-direction: column; gap: 20px; }

  .jobs-workspace > .jobs-primary-column {
    display: contents;
  }

  .jobs-primary-results { order: 1; }
  .jobs-workspace > .jobs-search-column { order: 2; }
  .jobs-primary-column > .past-saved-jobs { order: 3; }
}

/* trim the dark hero on first view */
@media (max-width: 700px) {
  .page-hero { padding-top: 22px; padding-bottom: 20px; }

  .split-hero.switch-centered > .hero-top { gap: 14px; }

  .page-hero .lead { font-size: 15px; line-height: 1.45; }

  .switch-centered .directory-switch { margin-top: 2px; }
}

@media (max-width: 900px) {
  /* flex-basis was being read as a height once the hero stacks,
     padding out ~300px of empty dark space */
  .hero-copy,
  .split-hero > div:first-child {
    flex: 0 0 auto;
  }
}

/* --- Resume entry actions (Save / Msg / Share) -------------- */
.resume-name-link {
  color: inherit;
  text-decoration: none;
}

.resume-name-link:hover { color: var(--blue); text-decoration: underline; }

.resume-entry-actions {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.resume-entry-actions button {
  min-height: var(--btn-h-sm);
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: #294e63;
  background: #fff;
  font-size: 13px;
  font-weight: 800;
}

.resume-entry-actions button:hover {
  border-color: rgba(22, 137, 247, .45);
  color: var(--blue);
}

@media (max-width: 700px) {
  .resume-entry-actions { margin-top: 8px; gap: 6px; }
  .resume-entry-actions button { flex: 1 1 auto; padding: 0 10px; }
}

/* --- 34. Coupon search field box on the height scale -------- */
/* The caption stacks above the control, so natural height came out
   at ~63px and the Search button stretched to match. Tightening the
   caption lets the 60px floor decide, putting both on the scale. */
.coupon-directory-search label {
  padding-top: 8px;
  padding-bottom: 8px;
}

.coupon-directory-search label span {
  line-height: 1.4;
}

/* --- 35. Form feedback messages (API wiring) --------------- */
.form-message {
  margin: 0 0 4px;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
}

.form-message[data-tone="error"] {
  color: #8f1d1d;
  background: #fdeaea;
  box-shadow: inset 0 0 0 1px rgba(143, 29, 29, .18);
}

.form-message[data-tone="success"] {
  color: #14210f;
  background: #e8f6e4;
  box-shadow: inset 0 0 0 1px rgba(32, 92, 20, .2);
}

.form-message[data-tone="info"] {
  color: #294e63;
  background: #eaf4fd;
  box-shadow: inset 0 0 0 1px rgba(22, 137, 247, .2);
}

/* --- 36. Live job results (API wiring) --------------------- */
.results-empty {
  margin: 0;
  padding: 28px 22px;
  border: 1px dashed var(--line);
  border-radius: var(--card-radius);
  color: #5c7484;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
}

.result-card .result-lead {
  margin: 4px 0 0;
  color: #5c7484;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}

[data-job-results][aria-busy="true"] { opacity: .55; }

/* --- 37. Inline link inside form messages ------------------ */
.form-message a {
  color: inherit;
  font-weight: 800;
  text-decoration: underline;
}

/* --- 38. Andrew's mobile reorder (Aug 9 feedback) ---------- */

/* The "Upload Resume" link that used to sit in this strip is gone: Nick's
   10 Sep point was that loose calls to action beside the tabs are part of
   what confuses a first visit. Upload resume now lives inside the Job
   Seeker view, where the person who wants it is already standing. */

@media (max-width: 900px) {
  /* Move the role row beneath the search card ("under Explore Jobs"). */
  .pb-role-landing { display: flex; flex-direction: column; }
  .pb-role-landing > .pb-role-card { order: 1; }
  .pb-role-landing > .pb-role-tabs { order: 2; }

  /* Andrew's order, updated 10 Sep for Nick's five user types. The three
     loose links this used to order (Upload Resume, Advertise, Live Resume
     Listings) are gone from the strip, and "savings" is now "consumer".

     These orders are not decoration. Without one every tab falls to the
     default 0 and lands ahead of any tab that has one, which scrambles
     the row rather than merely leaving it alone.

     Job Seeker is hidden while it is the active view and reappears once
     another role is selected, so there is always a way back. */
  .pb-role-tabs { display: flex; flex-wrap: wrap; }
  .pb-role-tabs > [data-role-tab="jobseeker"] { order: 0; }
  .pb-role-tabs > [data-role-tab="jobseeker"].active { display: none; }
  .pb-role-tabs > [data-role-tab="business"] { order: 1; }
  .pb-role-tabs > [data-role-tab="freelancer"] { order: 2; }
  .pb-role-tabs > [data-role-tab="consumer"] { order: 3; }
  .pb-role-tabs > [data-role-tab="advertiser"] { order: 4; }
}

/* --- 39. About headline + mobile menu welcome (Aug 10) ----- */
.about-headline {
  margin: 0 0 10px;
  font-size: clamp(34px, 6vw, 60px);
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: -.02em;
}

.about-subhead {
  margin: 0 0 18px;
  font-size: clamp(18px, 3vw, 26px);
  font-weight: 700;
  line-height: 1.35;
  opacity: .92;
}

.mobile-nav-welcome {
  margin: 0 0 6px;
  padding: 12px 16px 10px;
  color: #cfe6fb;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* --- 39. Andrew's Aug 10 mobile feedback ------------------- */

/* Removed the 01/02/03 support cards entirely — the markup is gone,
   this just cleans up any stale rule that reserved space for it. */
.pb-role-support { display: none; }

@media (max-width: 900px) {
  /* Tighten the dead space above "Find local jobs". */
  .prototype-b-page .pb-hero { padding-top: 10px !important; }
  .pb-role-landing { gap: 12px; }
}

/* Inputs pre-filled with example text were awkward — they cleared
   only after manual deletion. JS now clears on first focus; this
   keeps the placeholder legible once it does. */
.pb-job-search input::placeholder,
.search-panel input::placeholder { color: #8ea1b1; font-weight: 500; }

/* --- 40. Create job: sponsor block + free trial banner ----- */
.sponsor-fieldset {
  margin: 0;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--card-radius);
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  align-items: center;
}

.sponsor-fieldset legend {
  padding: 0 6px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.sponsor-fieldset label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
}

.free-trial-banner {
  text-align: center;
  font-size: 17px;
}

/* --- 41. Expanded job post form ---------------------------- */
.step-optional {
  margin: 0;
  color: #5c7484;
  font-size: 13px;
  font-weight: 600;
}

.detail-hint {
  color: #5c7484;
  font-size: 13px;
  font-weight: 600;
}

.checks-fieldset {
  margin: 0;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--card-radius);
}

.checks-fieldset legend {
  padding: 0 6px;
  color: var(--blue);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.checks-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px 20px;
}

.checks-grid label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
}

.checks-grid input[type="checkbox"] { margin-top: 3px; flex: 0 0 auto; }
.checks-loading { margin: 0; color: #5c7484; font-size: 14px; }

@media (max-width: 700px) {
  .checks-grid { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------
   42. Andrew's 13 Aug feedback: resume upload restructure, My Jobs,
       and the purchased-list header.
   --------------------------------------------------------------- */

/* "Manage Resumes" tab, sits under the title block on the upload page. */
.resume-manage-bar {
  display: flex;
  gap: 12px;
  /* Matches the page gutter used by .resume-builder / .page-hero. */
  padding: 26px clamp(20px, 6vw, 86px) 0;
  margin: 0;
}

.resume-manage-bar a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 26px;
  border-radius: 12px;
  background: #1689f7;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}

.resume-manage-bar a:hover { background: #0f6fd0; }

/* Upload card promoted out of the two-column builder to full width. */
.resume-upload-lead {
  padding: 18px clamp(20px, 6vw, 86px) 0;
  margin: 0;
}

.resume-upload-lead .resume-upload-zone {
  width: 100%;
}

/* Purchased-list header: counts line and purchase date. */
.directory-hero-classic .purchase-date {
  margin-top: 6px;
  opacity: 0.85;
  font-size: 0.95rem;
}

.hero-tab-row {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 18px;
}

.hero-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 13px 30px;
  border-radius: 12px;
  font-weight: 700;
  text-decoration: none;
  background: #1689f7;
  color: #fff;
}

.hero-tab.gold { background: #f0b429; color: #14303f; }
.hero-tab:hover { filter: brightness(0.94); }

/* My Jobs and Saved Resumes rows carry a fourth cell (employer / role), so
   they need their own column template — the 3-column posting-table one
   would drop it onto its own line. */
.my-jobs-table .history-row,
.saved-resume-table .history-row {
  grid-template-columns: 130px minmax(0, 1.1fr) minmax(0, 1fr) auto;
}

.my-jobs-table .history-row .row-meta,
.saved-resume-table .history-row .row-meta {
  opacity: 0.75;
  font-size: 0.95rem;
}

.my-jobs-table .row-rated {
  font-weight: 600;
  color: #f0b429;
  white-space: nowrap;
}

@media (max-width: 900px) {
  /* Stack the four cells and let the actions sit full width. */
  .my-jobs-table .history-row,
  .saved-resume-table .history-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    padding: 16px 0;
  }
  .my-jobs-table .history-row .row-actions,
  .saved-resume-table .history-row .row-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .resume-manage-bar { padding-top: 18px; }
  .resume-manage-bar a { width: 100%; }
  .hero-tab-row .hero-tab { width: 100%; }
}

/* Category list starts at A and scrolls rather than running the page long. */
.category-table-card {
  max-height: 420px;
  overflow-y: auto;
}

.category-table-card .category-table-head {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #fff;
}

@media (max-width: 720px) {
  .category-table-card { max-height: 340px; }
}

/* Alpha rail state is set by site.js once real categories load.
   :hover also recolours the letter blue, and the pointer is still over the
   pill right after a click — without covering the hover case the selected
   letter renders blue-on-blue and looks blank. */
.alpha-rail .is-current,
.alpha-rail span.is-current:hover,
.alpha-rail b.is-current:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
  font-weight: 800;
}

.alpha-rail .is-empty {
  opacity: 0.35;
  pointer-events: none;
}

.category-empty {
  padding: 26px 8px;
  text-align: center;
  opacity: 0.7;
}

/* ---------------------------------------------------------------
   43. Founder donation funnel: Payment Link checkout, benefits page,
       "View Fairday Under Construction" tab, and the paygate holding
       page for resume/coupon paid features.
   --------------------------------------------------------------- */

/* Tier picker now carries five options, so let it wrap rather than
   squeezing them onto one row. */
.donation-tier-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
  gap: 10px;
}

/* Tier labels inherit a large display size from the original three-tier
   layout. With "$500" and "Custom" added, that overflowed the pill —
   scale the text to the box and stop it wrapping mid-word. */
/* Scoped with .auth-form to match the specificity of the original rule at
   line ~4642, which sets 34px - sized for three short "$5" style labels.
   With "$500" and "Custom" added that overflowed the pill. */
.auth-form .donation-tier-grid label span {
  font-size: clamp(14px, 1.5vw, 19px);
  white-space: nowrap;
  padding: 0 2px;
}

.checkout-secure-note {
  margin: 4px 0 0;
  font-size: 0.9rem;
  opacity: 0.75;
  line-height: 1.5;
}

.summary-amount {
  margin: 6px 0 10px;
  font-size: clamp(30px, 5vw, 42px);
  font-weight: 900;
  color: var(--blue);
}

.side-quiet-link {
  display: inline-block;
  margin-top: 12px;
  font-weight: 700;
}

/* "View Fairday Under Construction" — same blue pill as the Manage
   Resumes tab in block 42, so the two read as one pattern. */
.under-construction-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 22px clamp(20px, 6vw, 86px);
  text-align: center;
}

.under-construction-tab a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 15px 34px;
  border-radius: 12px;
  background: #1689f7;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}

.under-construction-tab a:hover { background: #0f6fd0; }

.under-construction-tab small { opacity: 0.7; }

/* On the early-registration page the tab sits between the two intake
   cards: a middle column on desktop, and between them when stacked. */
.combined-intake-grid .under-construction-tab {
  align-self: center;
  padding: 0 4px;
}

/* Donation benefits page. */
.benefit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  padding: 10px clamp(20px, 6vw, 86px) 20px;
}

.benefit-card {
  padding: 22px 24px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.benefit-card h3 { margin: 0 0 8px; }
.benefit-card p  { margin: 0; line-height: 1.6; }

.benefit-cta {
  padding: 6px clamp(20px, 6vw, 86px) 70px;
  text-align: center;
}

.benefit-cta .intake-disclaimer {
  max-width: 640px;
  margin: 14px auto 0;
}

.large-centered-action.gold {
  background: #f0b429;
  color: #14303f;
}

/* Paygate holding page for resume/coupon paid features. */
.paygate-notice-card {
  max-width: 640px;
  margin: 0 auto;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  text-align: center;
}

.paygate-notice-card .fd-action-tab { margin: 22px auto 0; }

.paygate-founder-note {
  margin: 22px 0 0;
  font-size: 0.95rem;
  opacity: 0.85;
}

@media (max-width: 820px) {
  .under-construction-tab a { width: 100%; }
  .benefit-grid { grid-template-columns: minmax(0, 1fr); }
}

/* The intake grid was two equal columns; the Under Construction tab
   now sits between them, so give it a narrow middle track. Below the
   breakpoint the existing single-column rule takes over and the tab
   falls naturally between the two cards. */
@media (min-width: 861px) {
  .combined-intake-grid {
    grid-template-columns: 1fr auto 1fr;
  }
}

/* ---------------------------------------------------------------
   44. UI/UX consistency pass.
   --------------------------------------------------------------- */

/* job-detail with no ?id used to render "Job not found" beside a 4.5 star
   rating, four empty stat boxes, Apply buttons and a sample review. The
   script now hides the detail body and shows this instead. */
/* With the sidebar hidden the two-column grid left the card stranded in the
   left track, so collapse to a single centred column. */
.detail-layout-page.is-empty {
  grid-template-columns: minmax(0, 1fr);
}

.detail-empty-state {
  padding: 60px 20px 70px;
  text-align: center;
}

.detail-empty-state h1 {
  margin: 0 0 10px;
}

.detail-empty-state p {
  max-width: 460px;
  margin: 0 auto;
  opacity: 0.78;
  line-height: 1.6;
}

.detail-empty-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 26px;
}

.detail-empty-state .detail-empty-actions a {
  font-weight: 700;
  text-decoration: none;
  color: var(--blue);
}

.detail-empty-state .detail-empty-actions .primary-fill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 30px;
  border-radius: 12px;
  background: var(--blue);
  color: #fff;
}

.detail-empty-state .detail-empty-actions .primary-fill:hover { filter: brightness(0.94); }

@media (max-width: 720px) {
  .detail-empty-actions { flex-direction: column; }
  .detail-empty-actions .primary-fill { width: 100%; }
}

/* ---------------------------------------------------------------
   45. Form harmonisation.

   Nick's review found "forms with different layouts". The four form
   patterns on the site had drifted apart on the two things a visitor
   actually notices - control height and label treatment:

     auth-form    50px controls, 14px padding, letter-spaced labels
     form-panel   54px controls, 14px padding, letter-spaced labels
     page-email   58px controls, 16px padding, labels with no spacing

   Normalising here rather than rewriting the markup: the patterns each
   carry their own behaviour and layout, and restructuring them risks
   breaking working forms for a purely visual problem.
   --------------------------------------------------------------- */

.auth-form input,
.auth-form select,
.auth-form textarea,
.form-panel input,
.form-panel select,
.form-panel textarea,
.combined-intake-card input:not([type="checkbox"]):not([type="radio"]),
.combined-intake-card select,
.combined-intake-card textarea,
.page-email,
.resume-profile-card input:not([type="checkbox"]):not([type="radio"]),
.resume-profile-card select,
.resume-profile-card textarea,
.job-post-main input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.job-post-main select,
.job-post-main textarea {
  min-height: 54px;
  margin-top: 8px;
  padding: 0 14px;
  border-radius: 12px;
}

/* Textareas need vertical padding and room to breathe; the height above is
   a minimum, not a fixed value. */
.auth-form textarea,
.form-panel textarea,
.combined-intake-card textarea,
.resume-profile-card textarea,
.job-post-main textarea {
  min-height: 120px;
  padding: 14px;
  line-height: 1.55;
}

/* page-form-label was the odd one out: same colour, weight and size as the
   others but without the letter-spacing, which made it read tighter. */
.page-form-label {
  letter-spacing: .08em;
}

/* ---------------------------------------------------------------
   46. Andrew's 26 Aug walkthrough feedback.
   --------------------------------------------------------------- */

/* "make Become a Fairday First Founder a little bit bolder" */
.membership-intake-card .intake-card-head h2 {
  font-weight: 900;
  letter-spacing: -0.01em;
}

/* The Under Construction tab moved out of the middle column and in beside
   the tiers, so it needs to sit inside the dark membership card. */
.under-construction-inline {
  display: block;
  margin: 14px 0 4px;
  padding: 13px 18px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
}

.under-construction-inline:hover {
  background: rgba(255, 255, 255, 0.22);
}

/* With the tab no longer in the middle track, return the intake grid to two
   equal columns. */
@media (min-width: 861px) {
  .combined-intake-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Button harmonisation. Nick asked for consistent sizing across interfaces.
   Measuring the rendered primaries showed the site standard is 48px tall,
   14px, weight 900, 12px radius - and two buttons had drifted off it:
   the job-detail empty-state action (53px/16px/700, added in block 44) and
   the membership submit (51px). */
.detail-empty-state .detail-empty-actions .primary-fill,
.membership-intake-card .page-submit.membership-submit {
  min-height: 48px;
  padding: 0 30px;
  font-size: 14px;
  font-weight: 900;
  border-radius: 12px;
  line-height: 1.3;
}

/* The membership button carries two lines of copy, so it needs vertical
   padding rather than a fixed height - the min-height above still holds. */
.membership-intake-card .page-submit.membership-submit {
  height: auto;
  padding: 12px 24px;
}

/* ---------------------------------------------------------------
   47. Andrew's 30 Aug demo feedback.
   --------------------------------------------------------------- */

/* An empty job search was a dead end: an apology, and the sign-up option
   scrolled out of first view. Most new visitors land here on their second
   click, so the invitation now sits in the results area itself. */
.results-empty-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 40px 24px 46px;
  text-align: center;
}

.results-empty-lead {
  margin: 0;
  max-width: 30ch;
  font-size: clamp(18px, 2.4vw, 22px);
  font-weight: 800;
  line-height: 1.4;
  color: var(--navy);
}

.results-empty-cta .fd-action-tab {
  margin: 0;
  width: min(100%, 340px);
}

.results-empty-hint {
  margin: 0;
  max-width: 34ch;
  font-size: 0.95rem;
  opacity: 0.7;
}

/* ==================================================================
   48. Resume drop zone states, and the coupon empty result

   The zone advertised drag and drop but had no feedback for it, so a
   drop looked identical to nothing happening. Nick, 30 Aug.
   ================================================================== */

.resume-upload-zone {
  transition: border-color .15s ease, background-color .15s ease;
}

.resume-upload-zone[data-dragging="true"] {
  border-color: #1f6feb;
  background-color: rgba(31, 111, 235, .06);
}

.resume-upload-zone[data-has-file="true"] {
  border-color: #1a7f37;
}

.resume-upload-zone .chosen-file {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.4;
  word-break: break-word;
}

.resume-upload-zone .chosen-file[data-tone="success"] { color: #1a7f37; }
.resume-upload-zone .chosen-file[data-tone="error"]   { color: #b42318; }

/* Nick also flagged the panel running past the page margins on narrow
   screens, which was the file row refusing to wrap. */
.resume-upload-zone {
  max-width: 100%;
  box-sizing: border-box;
}

.resume-upload-zone > * { min-width: 0; }

/* ==================================================================
   49. Nick's 30 Aug review: sign up stays visible, submit at the end
       of long forms, and the signed-in email reads as settled
   ================================================================== */

/* He asked for the sign up to be frozen to the top rather than floating
   over the results: "If you want the Sign up button to show up while I
   scroll down, freeze to top section so it is always visible." Andrew
   wants it in first view, so making the results heading sticky satisfies
   both instead of choosing between them. */
/* The heading itself carries display:contents so it can feed the grid,
   which means it has no box and position:sticky on it does nothing. The
   sign up block is a real box, so that is what gets pinned. */
/* A sticky grid item can only travel inside its own grid row, which is
   why pinning it in the column did nothing. This wrapper is a plain block
   spanning the heading and the job list, so that becomes the range: the
   sign up stays with you through the results and releases at the saved
   jobs below. */
.jobs-results-block {
  display: block;
}

.jobs-signup-sticky {
  position: sticky;
  top: 8px;
  z-index: 20;
  margin-bottom: 12px;
}

/* A sticky child needs its ancestors to keep their overflow visible,
   otherwise the browser silently treats it as static. */
.jobs-workspace,
.jobs-primary-column,
.jobs-primary-results {
  overflow: visible;
}

@media (max-width: 720px) {
  /* Tighter on a phone, where vertical space is the scarce thing. */
  .jobs-signup-sticky {
    top: 4px;
  }
}

/* Publish at the end of the form as well as in the sidebar. */
.form-submit-row {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid rgba(15, 23, 42, .12);
}

.form-submit-row button {
  min-width: 220px;
}

@media (max-width: 720px) {
  .form-submit-row button { width: 100%; min-width: 0; }
}

/* The account email is filled in and not for editing. Readonly rather
   than disabled, so it is still submitted with the form. */
input[data-locked="true"] {
  background: rgba(15, 23, 42, .04);
  cursor: default;
}

.field-note {
  font-weight: 400;
  opacity: .7;
  text-transform: none;
  letter-spacing: 0;
}

/* The horizontal overflow guard on html/body was written as
   overflow-x: hidden. A hidden value on one axis forces the other axis to
   compute as auto, which turns the page into a scroll container and stops
   position: sticky working anywhere inside it. That is why pinning the
   sign up block had no effect no matter where it was placed.

   overflow-x: clip gives the same protection against sideways scrolling
   without touching the vertical axis. The hidden declaration stays first
   as a fallback for browsers that do not know clip. */
html {
  overflow-x: hidden;
  overflow-x: clip;
}

body {
  overflow-x: hidden;
  overflow-x: clip;
}

/* ==================================================================
   50. Andrew's founder letter on the benefits page

   His V3 wording, set as a letter rather than broken into cards, so it
   reads the way he wrote it for the funding pitch.
   ================================================================== */

.founder-letter {
  max-width: 74ch;
  margin: 0 auto 40px;
  padding: 32px clamp(20px, 4vw, 40px);
  background: #fff;
  border: 1px solid rgba(15, 23, 42, .1);
  border-radius: 16px;
  line-height: 1.65;
}

.founder-letter-head { margin-bottom: 24px; }

.founder-letter-from {
  margin: 0 0 20px;
  font-size: 14px;
  line-height: 1.5;
  opacity: .7;
}

.founder-letter h2 {
  margin: 0;
  font-size: clamp(22px, 3vw, 28px);
  line-height: 1.25;
}

.founder-letter p { margin: 0 0 16px; }

/* The paragraph he set apart in the document stays set apart here. */
.founder-letter-feature {
  padding: 18px 20px;
  border-left: 3px solid #1f6feb;
  background: rgba(31, 111, 235, .05);
  border-radius: 0 10px 10px 0;
}

.founder-letter-expiry { color: #b54708; }

.founder-letter-signoff {
  margin-bottom: 0;
  font-weight: 600;
  text-align: center;
}

/* The Under Construction tabs pointed at admin.fairdayjobs.com, which
   Andrew asked to delete on 31 Aug. Rules kept for now: styles.css is
   append-only here and removing mid-file rules risks the numbering. */

/* ==================================================================
   51. Apply on the job card, and the apply intent it carries

   Andrew, 1 Sep: "each job should have both view and apply". Apply is
   the primary action of the two, so it reads as one; View details stays
   quiet beside it.
   ================================================================== */

.inline-job-actions .inline-apply {
  background: #1f6feb;
  color: #fff;
  border-radius: 8px;
  padding: 8px 16px;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
}

.inline-job-actions .inline-apply:hover { background: #1a5fd0; }

.inline-job-actions .inline-apply:focus-visible {
  outline: 2px solid #0b3d91;
  outline-offset: 2px;
}

/* Landing from an Apply link: say which control they were sent to,
   without pressing it for them. */
[data-apply-job][data-intent="true"] {
  box-shadow: 0 0 0 3px rgba(31, 111, 235, .35);
}

@media (prefers-reduced-motion: reduce) {
  [data-apply-job][data-intent="true"] { box-shadow: 0 0 0 3px rgba(31, 111, 235, .5); }
}

/* ==================================================================
   52. Message centre

   Andrew, 1 Sep: "I dont see any hamburger or msg center top bar menu."
   There was no message centre at all, though the API has always had one.
   ================================================================== */

.header-messages {
  position: relative;
  color: #fff;
  font-weight: 500;
  margin-right: 4px;
  white-space: nowrap;
}

.header-messages:hover { text-decoration: underline; }

.message-badge {
  display: inline-block;
  min-width: 18px;
  margin-left: 6px;
  padding: 1px 5px;
  border-radius: 9px;
  background: #d92d20;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  vertical-align: text-top;
}

.messages-layout {
  max-width: 860px;
  margin: 0 auto 48px;
  padding: 0 20px;
}

.messages-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.messages-filters { display: flex; gap: 8px; }

.messages-filters button {
  padding: 8px 16px;
  border: 1px solid rgba(15, 23, 42, .15);
  border-radius: 999px;
  background: #fff;
  font-weight: 500;
}

.messages-filters button.active {
  background: #1f6feb;
  border-color: #1f6feb;
  color: #fff;
}

.messages-mark-all {
  padding: 8px 16px;
  border: 1px solid rgba(15, 23, 42, .15);
  border-radius: 8px;
  background: #fff;
}

.message-list { list-style: none; margin: 0; padding: 0; }

.message-row {
  padding: 16px 18px;
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 12px;
  background: #fff;
  margin-bottom: 10px;
}

/* Unread carries a colour and a bar, not colour alone. */
.message-row.is-unread {
  border-left: 4px solid #1f6feb;
  background: #f5f9ff;
}

.message-from {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  margin-bottom: 4px;
}

.message-when { font-size: 13px; opacity: .65; }

.message-subject { margin: 0 0 4px; font-weight: 600; }

.message-body {
  margin: 0;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

@media (max-width: 700px) {
  .header-messages { display: none; }
  .messages-toolbar { flex-direction: column; align-items: stretch; }
}

/* ==================================================================
   53. A feature closed in this country

   Andrew, 2 Sep: once a market is established the membership should
   disappear there rather than sit greyed out.
   ================================================================== */

.country-closed {
  max-width: 46ch;
  margin: 12vh auto;
  padding: 0 24px;
  text-align: center;
}

.country-closed h1 {
  font-size: clamp(22px, 4vw, 30px);
  line-height: 1.25;
  margin: 0 0 12px;
}

.country-closed p { margin: 0 0 24px; opacity: .75; }

.country-closed-home {
  display: inline-block;
  padding: 12px 24px;
  border-radius: 10px;
  background: #1f6feb;
  color: #fff;
  font-weight: 600;
}

/* ==================================================================
   54. Coupon detail dialog

   Nick, slide 12: the detail page was a page hop for forty lines of
   content, and every card opened the same one.
   ================================================================== */

.coupon-dialog {
  width: min(560px, calc(100vw - 32px));
  max-height: calc(100vh - 64px);
  padding: 0;
  border: none;
  border-radius: 16px;
  background: #fff;
  overflow: visible;
}

.coupon-dialog::backdrop {
  background: rgba(9, 20, 30, .55);
}

.coupon-dialog-close {
  position: absolute;
  top: -14px;
  right: -14px;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 50%;
  background: #14384c;
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
}

.coupon-dialog-close:focus-visible {
  outline: 3px solid #6aa6ff;
  outline-offset: 2px;
}

.coupon-dialog-body {
  padding: 24px 24px 0;
  max-height: calc(100vh - 190px);
  overflow-y: auto;
}

/* The card is reused as it appears in the list, so the coupon looks the
   same in both places rather than being restyled into something else. */
.coupon-dialog-body .coupon-ad-card {
  margin: 0;
  box-shadow: none;
}

.coupon-dialog-actions {
  padding: 18px 24px 24px;
  display: flex;
  justify-content: flex-end;
}

.coupon-dialog-save {
  display: inline-block;
  padding: 12px 22px;
  border-radius: 10px;
  background: #e3b529;
  color: #14384c;
  font-weight: 700;
}

@media (max-width: 560px) {
  .coupon-dialog { width: calc(100vw - 20px); }
  .coupon-dialog-close { top: 8px; right: 8px; }
  .coupon-dialog-actions { justify-content: stretch; }
  .coupon-dialog-save { width: 100%; text-align: center; }
}

/* ==================================================================
   55. Search settings panel, Nick's slide 6

   "The blue-coloured header shouldn't look the same as Browse
   Categories." The eyebrow and the link were both blue at weight 900,
   so two different things read as the same thing. The eyebrow is gone
   and the link now reads as a link.
   ================================================================== */

.search-copy .category-helper-link {
  font-weight: 600;
  font-size: var(--fs-body);
  text-decoration: underline;
  text-underline-offset: 3px;
  align-self: center;
}

.search-copy .category-helper-link:hover {
  text-decoration-thickness: 2px;
}

/* "Boost your resume" sits a row under the Upload Resume tab. It is an
   upsell, not the same action, so it should not look like another tab. */
.results-heading-actions .boost-link {
  font-weight: 600;
}

/* ==================================================================
   56. Donation tiers as links, Andrew 3 Sep

   The amounts were a static line of text. Each one now opens checkout
   with that tier already selected.
   ================================================================== */

.hero-tier-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

.hero-tier-links a {
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .35);
  color: inherit;
  font-weight: 700;
  white-space: nowrap;
  transition: background-color .15s ease;
}

.hero-tier-links a:hover,
.hero-tier-links a:focus-visible {
  background: rgba(255, 255, 255, .3);
}

.hero-tier-links a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* ==================================================================
   57. Publishing warning, Andrew 5 Sep

   Sits with the publish control so it is read at the moment of posting
   rather than skipped at the top of a long form.
   ================================================================== */

.publish-warning {
  margin: 24px 0 0;
  padding: 14px 16px;
  border-left: 3px solid #e3b529;
  border-radius: 0 10px 10px 0;
  background: rgba(227, 181, 41, .1);
  font-size: 14.5px;
  line-height: 1.55;
  max-width: 70ch;
}

.publish-warning b { display: block; margin-bottom: 2px; }

/* ==================================================================
   58. Sample job labelling, Andrew and Nick 6 Sep

   Sample listings were agreed on the condition that they say what they
   are. The card gets a small badge beside the job type; the detail page
   gets a sentence, because that is where somebody decides to apply and a
   cover letter written for a job that does not exist is a real cost to
   them.

   Deliberately not styled as a warning. These are honest demonstration
   content, not a hazard, so it reads as a quiet label rather than an
   alarm competing with the publishing warning in block 57.
   ================================================================== */

.sample-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border: 1px solid #b9c6d4;
  border-radius: 999px;
  background: #eef3f8;
  color: #40546b;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  vertical-align: middle;
  white-space: nowrap;
}

.sample-note {
  margin: 10px 0 0;
  padding: 12px 14px;
  border-left: 3px solid #b9c6d4;
  border-radius: 0 8px 8px 0;
  background: #f5f8fb;
  color: #40546b;
  font-size: 13px;
  line-height: 1.55;
  max-width: 70ch;
}

/* The badge opens the sentence, so it should not also carry the indent
   it needs when trailing a job type on a card. */
.sample-note .sample-badge { margin-left: 0; margin-right: 4px; }