/* =========================================================
   V Resurse Ok — structured CSS
   Desktop base: 1440px / container 1200px
   ========================================================= */

/* 01. TOKENS */
/* 01. TOKENS */
:root {
  /* Neutral */
  --bg-primary: #FFF7FA;
  --bg-secondary: #F8EEF4;
  --surface-white: #FFFFFF;
  --text-primary: #453754;
  --text-secondary: #9A8BA2;
  --border-default: #EDDDE7;

  /* Brand / Public */
  --brand-primary: #B57BBE;
  --brand-secondary: #F1D3DF;
  --brand-soft-blue: #C7DFF0;
  --brand-soft-lilac: #E7D3EE;

  /* Sections — only Tarot color is used for all section/category badges */
  --section-color: #AE7BC4;       /* Tarot */
  --section-color-soft: #F8EFFB;  /* Tarot / Soft */

  /* Status */
  --success: #22C55E;
  --warning: #F59E0B;
  --error: #EF4444;
  --info: #3B82F6;

  --success-soft: rgba(34, 197, 94, 0.12);
  --warning-soft: rgba(245, 158, 11, 0.14);
  --error-soft: rgba(239, 68, 68, 0.12);
  --info-soft: rgba(59, 130, 246, 0.12);

  /* Semantic aliases used below */
  --page-bg: var(--bg-primary);
  --page-bg-2: var(--surface-white);
  --surface: var(--surface-white);
  --surface-soft: var(--bg-secondary);
  --surface-tint: var(--section-color-soft);

  --stroke: var(--border-default);
  --stroke-strong: var(--border-default);

  --primary: var(--brand-primary);
  --primary-strong: var(--brand-primary);
  --primary-soft: var(--brand-secondary);
  --primary-pale: var(--section-color-soft);

  /* Compatibility aliases. Old class names stay, but color is no longer blue. */
  --blue-soft: var(--section-color-soft);
  --blue-text: var(--section-color);
  --lilac-soft: var(--brand-soft-lilac);

  --text: var(--text-primary);
  --text-soft: var(--text-secondary);
  --text-faint: var(--text-secondary);

  --container: 1200px;
  --header-container: 1340px;

  --radius-lg: 32px;
  --radius-md: 24px;
  --radius-sm: 18px;
  --radius-pill: 999px;

  --section-gap: 72px;
  --section-gap-small: 48px;

  --shadow-soft: 0 8px 24px rgba(69, 55, 84, 0.04);
  --glow-soft: 0 14px 34px rgba(174, 123, 196, 0.10);
}

/* 02. BASE */
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: "Comfortaa", system-ui, sans-serif;
  color: var(--text);
  background: linear-gradient(180deg, var(--page-bg-2) 0%, var(--page-bg) 100%);
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
textarea,
select {
  font: inherit;
}

.page-shell {
  min-height: 100vh;
}

/* 03. LAYOUT */
.container {
  width: min(calc(100% - 240px), var(--container));
  margin: 0 auto;
}

.site-header .container {
  width: min(calc(100% - 100px), var(--header-container));
}

.section {
  padding-top: var(--section-gap);
  scroll-margin-top: 150px;
}

.hero-section {
  padding-top: 48px;
}

.footer-section {
  padding-top: var(--section-gap);
  padding-bottom: 24px;
}

/* 04. SHARED FLEX HELPERS */
.utility-inner,
.main-inner,
.hero-actions,
.preview-top-badges,
.trust-row,
.tag-row,
.qa-top,
.qa-footer,
.review-top,
.card-day-footer,
.card-day-grid,
.section-footer,
.footer-main,
.footer-links,
.footer-bottom,
.utility-links,
.utility-actions,
.cta-card,
.cta-actions,
.review-top-left {
  display: flex;
  align-items: center;
}

.utility-inner,
.main-inner,
.section-footer,
.qa-footer,
.card-day-footer,
.footer-bottom,
.cta-card,
.review-top {
  justify-content: space-between;
}

/* 05. COMPONENTS */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 22px;
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  font-size: 13px;
  line-height: 16px;
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.button:hover {
  transform: translateY(-1px);
}

.button-lg {
  height: 48px;
}

.button-primary {
  color: #ffffff;
  background: var(--brand-primary);
  border-color: var(--brand-primary);
}

.button-primary:hover {
  background: var(--section-color);
  border-color: var(--section-color);
}

.button-secondary {
  color: var(--brand-primary);
  background: var(--surface-white);
  border-color: var(--border-default);
}

.button-secondary:hover {
  background: var(--bg-secondary);
  box-shadow: none;
}
.header-cta {
  width: 172px;
}

/* 06. HEADER */

.site-header {
  padding: 36px 16px 0;
  background: transparent;
}

.site-header .container {
  width: min(calc(100% - 32px), 1408px);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: var(--surface-white);
}

.utility-bar {
  height: 48px;
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border-default);
}

.utility-inner {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  font-size: 13px;
  line-height: 20px;
}

.utility-links,
.utility-actions {
  display: flex;
  align-items: center;
  gap: 24px;
}

.utility-links a,
.utility-actions a {
  color: var(--text-secondary);
}

.utility-links a:hover,
.utility-actions a:hover {
  color: var(--brand-primary);
}

.lang-switch {
  height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: 999px;
  background: var(--surface-white);
  color: var(--text-secondary);
  cursor: pointer;
}

.lang-switch span {
  height: 30px;
  min-width: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  line-height: 16px;
}

.lang-switch .is-active {
  color: var(--text-primary);
  background: var(--surface-white);
}

.account-chip {
  height: 40px;
  min-width: 116px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 4px 14px 4px 4px;
  border: 1px solid var(--border-default);
  border-radius: 999px;
  background: var(--surface-white);
  color: var(--text-secondary);
}

.avatar-mini {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border-radius: 50%;
  border: 1px solid #eadbdc;
  background: #f1e7df;
}

.main-bar {
  height: 80px;
  background: var(--surface-white);
}

.main-inner {
  width: calc(100% - 112px);
  height: 80px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 260px 1fr 172px;
  align-items: center;
  column-gap: 40px;
}

.brand {
  width: 243px;
  height: 72px;
  display: flex;
  align-items: center;
}

.brand img {
  width: 243px;
  height: 72px;
  object-fit: contain;
}

.main-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 36px;
  font-size: 15px;
  line-height: 20px;
}

.main-nav a {
  color: var(--text-primary);
}

.main-nav a:hover {
  color: var(--brand-primary);
}

.header-cta {
  width: 172px;
  height: 44px;
  justify-self: end;
}

.hero-action-primary {
  width: 172px;
}

.hero-action-secondary {
  width: 233px;
}

.footer-btn-wide {
  width: 233px;
}

.footer-btn-mid {
  width: 197px;
}

.footer-btn-small {
  width: 149px;
}

.card-button {
  width: 230px;
}

.badge,
.trust-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  padding: 0 14px;
  border-radius: var(--radius-pill);
  font-size: 13px;
  line-height: 16px;
  font-weight: 400;
}

.badge-soft,
.trust-chip {
  color: var(--section-color);
  background: var(--section-color-soft);
  border: 1px solid rgba(174, 123, 196, 0.18);
}

.badge-blue {
  color: var(--info);
  background: var(--info-soft);
  border: 1px solid rgba(59, 130, 246, 0.18);
}

/* Status badges: background is soft status, text is base status. */
.badge-success {
  color: var(--success);
  background: var(--success-soft);
  border: 1px solid rgba(34, 197, 94, 0.20);
}

.badge-warning {
  color: var(--warning);
  background: var(--warning-soft);
  border: 1px solid rgba(245, 158, 11, 0.22);
}

.badge-error {
  color: var(--error);
  background: var(--error-soft);
  border: 1px solid rgba(239, 68, 68, 0.20);
}

.badge-info {
  color: var(--info);
  background: var(--info-soft);
  border: 1px solid rgba(59, 130, 246, 0.20);
}

/* Specialist availability is a status, so it uses Success by default. */
.specialist-status-row .badge {
  color: var(--success);
  background: var(--success-soft);
  border-color: rgba(34, 197, 94, 0.20);
}

.hero-card,
.info-card,
.cta-card,
.footer-card,
.hero-preview,
.mini-card,
.note-box,
.answer-box,
.info-row {
  background: var(--surface);
  border: 1px solid var(--stroke);
}

.hero-card,
.cta-card,
.footer-card {
  border-radius: var(--radius-lg);
}

.info-card,
.hero-preview {
  border-radius: var(--radius-md);
}

.mini-card,
.note-box,
.answer-box,
.info-row {
  border-radius: var(--radius-sm);
}

.avatar-mini,
.avatar-circle,
.review-avatar {
  border-radius: 50%;
  border: 1px solid var(--stroke);
  background: linear-gradient(180deg, var(--surface-white) 0%, var(--section-color-soft) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.avatar-mini {
  width: 32px;
  height: 32px;
}

.avatar-circle {
  width: 72px;
  height: 72px;
}

.review-avatar {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: var(--text-soft);
  font-size: 14px;
  line-height: 16px;
}

.meta,
.date-text,
.label-text,
.review-footer span,
.qa-footer span,
.daily-insight-label {
  color: var(--text-faint);
  font-size: 13px;
  line-height: 16px;
}

.text-link {
  margin-top: auto;
  padding-top: 20px;
  color: var(--primary-strong);
  font-size: 16px;
  line-height: 20px;
}

.text-link:hover {
  color: var(--primary);
}


/* Optional explicit badge types.
   Use these classes in HTML when you want to be precise. */
.badge-section,
.badge-category,
.badge-public {
  color: var(--section-color);
  background: var(--section-color-soft);
  border-color: rgba(174, 123, 196, 0.18);
}

/* 06. HEADER */
.site-header {
  position: relative;
  background: var(--page-bg-2);
}

.utility-bar {
  border-top: 1px solid var(--border-default);
  border-bottom: 1px solid var(--border-default);
}

.utility-inner {
  min-height: 52px;
  font-size: 12px;
  line-height: 20px;
}

.utility-links,
.utility-actions {
  gap: 20px;
}

.utility-links a,
.utility-actions a,
.main-nav a,
.footer-links a,
.footer-bottom a {
  color: var(--text-soft);
  transition: color 0.2s ease;
}

.utility-links a:hover,
.utility-actions a:hover,
.main-nav a:hover,
.footer-links a:hover,
.footer-bottom a:hover {
  color: var(--primary-strong);
}

.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 32px;
  padding: 0 8px;
  border: 0;
  color: var(--text-soft);
  background: transparent;
  cursor: pointer;
}

.lang-switch .is-active {
  color: var(--primary-strong);
}

.account-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 40px;
  padding: 4px 12px 4px 4px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--stroke);
  background: #ffffff;
}

.main-inner {
  min-height: 84px;
  gap: 24px;
}

.brand {
  flex: 0 0 243px;
  display: flex;
  align-items: center;
}

.brand img {
  width: 243px;
  height: 80px;
}

.main-nav {
  flex: 0 0 540px;
  display: flex;
  justify-content: center;
  gap: 28px;
  font-size: 14px;
  line-height: 20px;
  color: var(--text-soft);
}

/* 07. HERO */
.hero-card {
  min-height: 648px;
  padding: 48px;
  background: rgba(255, 255, 255, 0.42);
}

.hero-grid {
  display: grid;
  grid-template-columns: 560px 544px;
  justify-content: space-between;
}

.hero-copy h1,
.section-head h2,
.cta-copy h2 {
  margin: 20px 0 0;
  letter-spacing: -0.03em;
}

.hero-copy h1 {
  max-width: 560px;
  font-size: 48px;
  line-height: 48px;
  font-weight: 700;
}

.hero-lead,
.section-head p,
.cta-copy p,
.hero-note,
.hero-preview p,
.card-day-content p,
.side-panel p,
.review-card p,
.specialist-description {
  color: var(--text-soft);
}

.hero-lead {
  max-width: 560px;
  margin: 20px 0 0;
  font-size: 16px;
  line-height: 24px;
}

.hero-actions {
  gap: 12px;
  margin-top: 120px;
}

.hero-note {
  max-width: 560px;
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 20px;
}

.trust-row {
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.trust-chip {
  height: 36px;
  padding: 0 14px;
}

.hero-preview {
  min-height: 552px;
  padding: 24px;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: var(--glow-soft);
}

.preview-top-badges {
  gap: 8px;
}

.hero-preview h2 {
  margin: 20px 0 0;
  font-size: 24px;
  line-height: 28px;
  font-weight: 700;
}

.hero-preview > p {
  max-width: 456px;
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 20px;
}

.preview-stack {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.mini-card {
  min-height: 96px;
}

.mini-card-inner {
  padding: 6px 12px;
}

.mini-card h3 {
  margin: 6px 0 0;
  font-size: 17px;
  line-height: 24px;
  font-weight: 700;
}

.mini-card p {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 16px;
  color: var(--text-soft);
}

/* 08. SECTION HEADS / GRIDS */
.section-head {
  max-width: 760px;
  margin-bottom: 32px;
}

.section-head-compact {
  margin-bottom: 24px;
}

.section-head h2,
.cta-copy h2 {
  font-size: 36px;
  line-height: 40px;
  font-weight: 700;
}

.section-head p,
.cta-copy p {
  margin: 12px 0 0;
  font-size: 15px;
  line-height: 24px;
}

.cards-grid {
  display: grid;
  gap: 24px;
}

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

.info-card {
  padding: 20px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: none;
}

.section-footer {
  gap: 24px;
  margin-top: 32px;
}

.section-footer p {
  max-width: 760px;
  margin: 0;
  color: var(--text-soft);
  font-size: 15px;
  line-height: 20px;
}

/* 09. DIRECTIONS */
.direction-card {
  min-height: 430px;
  display: flex;
  flex-direction: column;
}

.accent-bar {
  width: 56px;
  height: 6px;
  border-radius: var(--radius-pill);
  background: var(--section-color);
}

.illustration-wrap {
  position: relative;
  height: 170px;
  margin-top: 16px;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid var(--stroke);
  background: linear-gradient(180deg, var(--surface-soft) 0%, var(--section-color-soft) 100%);
}

.illustration-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 48%, rgba(174, 123, 196, 0.16) 0%, rgba(174, 123, 196, 0.06) 28%, rgba(174, 123, 196, 0) 64%),
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.58) 100%);
}

.illustration-wrap img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 340px;
  max-width: none;
  transform-origin: center center;
  opacity: 0.95;
}

/* Images are already prepared on a 340x170 transparent canvas.
   Keep width 340 and only adjust scale/position. */
.psychology-illustration img {
  transform: translate(-50%, -50%) scale(0.78);
}

.coaching-illustration img {
  transform: translate(-50%, -50%) scale(0.76);
}

.tarot-illustration img {
  transform: translate(-50%, -50%) scale(0.80);
}

.card-body {
  min-height: 176px;
  margin-top: 16px;
  display: flex;
  flex-direction: column;
}

.card-body h3 {
  margin: 0;
  font-size: 22px;
  line-height: 28px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.card-body p {
  min-height: 78px;
  margin: 14px 0 0;
  color: var(--text-soft);
  font-size: 15px;
  line-height: 26px;
}

.meta {
  display: inline-block;
  margin-top: 10px;
}

/* 10. SPECIALISTS */
.specialist-card {
  min-height: 460px;
  display: flex;
  flex-direction: column;
}

.specialist-top {
  min-height: 104px;
  display: grid;
  grid-template-columns: 72px 260px;
  gap: 12px;
  align-items: start;
}

.specialist-title-wrap {
  min-height: 46px;
}

.specialist-top h3 {
  margin: 0;
  font-size: 20px;
  line-height: 20px;
}

.specialist-role {
  margin: 6px 0 0;
  color: var(--text-soft);
  font-size: 14px;
  line-height: 20px;
}

.specialist-status-row {
  min-height: 52px;
  margin-top: 6px;
  display: flex;
  align-items: center;
}

.tag-row {
  flex-wrap: wrap;
  gap: 8px;
}

.specialist-card .tag-row {
  margin-top: 16px;
}

.specialist-description {
  min-height: 72px;
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 24px;
}

.meta-list {
  display: grid;
  gap: 10px;
  margin: 16px 0 0;
}

.meta-list div {
  display: flex;
  justify-content: space-between;
  color: var(--text-soft);
  font-size: 14px;
  line-height: 16px;
}

.meta-list dt,
.meta-list dd {
  margin: 0;
}

.meta-list dd {
  color: var(--text);
}

.specialist-footer {
  margin-top: auto;
  padding-top: 36px;
  display: flex;
  justify-content: center;
}

/* 11. CARD OF THE DAY */
.card-day-grid {
  align-items: stretch;
  gap: 24px;
}

.card-day-card {
  flex: 0 0 720px;
  min-height: 428px;
  display: grid;
  grid-template-columns: 240px 319px;
  gap: 24px;
  justify-content: start;
}

.card-visual {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 12px;
}

.daily-card-shape {
  position: relative;
  width: 160px;
  height: 220px;
  border-radius: 20px;
  border: 1px solid var(--border-default);
  background: linear-gradient(180deg, var(--surface-white) 0%, var(--section-color-soft) 100%);
}

.daily-card-shape::after {
  content: "";
  position: absolute;
  inset: 32px;
  border-radius: 16px;
  background: radial-gradient(circle, rgba(174, 123, 196, 0.18), rgba(174, 123, 196, 0));
}

.card-day-content {
  display: flex;
  flex-direction: column;
}

.card-day-content h3,
.side-panel h3 {
  margin: 0;
  font-size: 28px;
  line-height: 28px;
}

.card-day-top p {
  margin-top: 10px;
}

.card-day-content blockquote {
  margin: 18px 0 0;
  color: var(--text);
  font-size: 16px;
  line-height: 20px;
}

.note-box {
  margin-top: 10px;
  padding: 10px;
  color: var(--text-faint);
  line-height: 16px;
}

.card-day-footer {
  gap: 12px;
  margin-top: auto;
}

.side-panel {
  flex: 0 0 456px;
  min-height: 428px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.side-panel > h3 {
  margin-top: 16px;
}

.side-panel > p {
  margin-top: 16px;
  line-height: 20px;
}

.info-rows {
  width: 100%;
  display: grid;
  gap: 10px;
  margin: 16px 0;
}

.info-row {
  width: 100%;
  min-height: 44px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  color: var(--text-soft);
  font-size: 14px;
  line-height: 20px;
}

/* 12. Q&A */
.qa-card {
  min-height: 514px;
  display: flex;
  flex-direction: column;
}

.qa-top {
  min-height: 40px;
  align-items: center;
  gap: 12px;
}

.qa-question {
  min-height: 108px;
  margin-top: 16px;
}

.qa-question h3 {
  margin: 8px 0 0;
  font-size: 22px;
  line-height: 28px;
}

.answer-box {
  margin-top: 16px;
  padding: 10px 16px;
}

.answer-box p {
  margin: 12px 0 0;
  color: var(--text-soft);
  font-size: 15px;
  line-height: 24px;
}

.qa-footer {
  gap: 16px;
  margin-top: auto;
  padding-top: 18px;
}

/* 13. REVIEWS */
.review-card {
  min-height: 320px;
  display: flex;
  flex-direction: column;
}

.review-top-left {
  gap: 12px;
}

.review-author h3 {
  margin: 0;
  font-size: 24px;
  line-height: 24px;
}

.review-author .date-text {
  display: inline-block;
  margin-top: 4px;
}

.review-rating {
  min-width: 33px;
  height: 28px;
  padding: 0 8px;
  border-radius: var(--radius-pill);
  border: 1px solid rgba(174, 123, 196, 0.18);
  background: var(--section-color-soft);
  color: var(--section-color);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 16px;
}

.service-row {
  margin-top: 16px;
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--text-soft);
  font-size: 20px;
  line-height: 20px;
}

.service-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--section-color);
}

.review-card p {
  margin: 16px 0 0;
  font-size: 15px;
  line-height: 24px;
}

.review-footer {
  margin-top: auto;
  padding-top: 32px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

/* 14. CTA */
.cta-card {
  min-height: 252px;
  padding: 32px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(248, 239, 251, 0.98) 100%);
  box-shadow: var(--glow-soft);
}

.cta-copy {
  max-width: 720px;
}

.cta-actions {
  min-width: 233px;
  align-items: stretch;
  flex-direction: column;
  gap: 12px;
}

/* 15. FOOTER */
.footer-card {
  min-height: 300px;
  padding: 32px;
  background: rgba(255, 255, 255, 0.92);
}

.footer-main {
  align-items: flex-start;
  gap: 56px;
}

.footer-brand {
  max-width: 360px;
}

.footer-brand img {
  width: 243px;
  height: 80px;
}

.footer-brand p {
  margin: 16px 0 0;
  color: var(--text-soft);
  font-size: 15px;
  line-height: 20px;
}

.footer-links {
  flex: 1;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
}

.footer-links div {
  display: grid;
  gap: 10px;
}

.footer-links h3 {
  margin: 0 0 2px;
  font-size: 24px;
  line-height: 24px;
}

.footer-bottom {
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid var(--border-default);
  color: var(--text-faint);
  font-size: 13px;
  line-height: 16px;
}

.footer-bottom div {
  display: flex;
  gap: 20px;
}

/* 17. FINAL FIGMA FIXES */
.qa-top .date-text {
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  white-space: nowrap;
  margin: 0;
  line-height: 20px;
}

.qa-top .tag-row {
  min-height: 40px;
  align-items: center;
}

.info-card,
.hero-preview,
.mini-card,
.note-box,
.answer-box,
.info-row {
  border-color: var(--stroke);
}

.text-link {
  color: var(--section-color);
}

.accent-bar,
.service-dot {
  background: var(--section-color);
}

/* ===== SECTION FOOTER FIX ===== */

.section-footer {
  align-items: center;
}

.section-footer .button {
  flex-shrink: 0;
  white-space: nowrap;
}

/* ===== REVIEWS FIX ===== */

.review-footer {
  margin-top: auto;
  padding-top: 32px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.review-footer span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 18px;
}

.review-footer .text-link {
  margin-top: 0;
  padding-top: 0;
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  color: var(--brand-primary);
  font-size: 16px;
  line-height: 20px;
  white-space: nowrap;
}

/* Кнопка "Більше відгуків" */
.section-footer .button.footer-btn-small {
  width: auto;
  min-width: 184px;
  padding-left: 24px;
  padding-right: 24px;
}
/* ===== REVIEW AVATAR POSITION FIX ===== */

.review-top-left {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

.review-avatar {
  flex: 0 0 48px;
}

.review-author {
  text-align: left;
}

.review-author h3 {
  margin: 0;
}

.review-author .date-text {
  display: block;
  margin-top: 4px;
}



/* 16. RESPONSIVE */
@media (max-width: 1260px) {
  .container {
    width: min(calc(100% - 48px), var(--container));
  }

  .site-header .container {
    width: min(calc(100% - 48px), var(--header-container));
  }

  .hero-grid,
  .card-day-grid,
  .cta-card,
  .footer-main,
  .section-footer {
    display: flex;
    flex-direction: column;
  }

  .hero-copy h1 {
    font-size: 42px;
    line-height: 44px;
  }

  .hero-actions {
    margin-top: 40px;
  }

  .hero-preview,
  .card-day-card,
  .side-panel {
    width: 100%;
    min-height: unset;
    flex: unset;
  }

  .card-day-card {
    grid-template-columns: 240px 1fr;
  }
}

@media (max-width: 980px) {
  .container,
  .site-header .container {
    width: min(calc(100% - 24px), var(--container));
  }

  .section {
    padding-top: 56px;
  }

  .cards-grid-3 {
    grid-template-columns: 1fr;
  }

  .main-inner {
    flex-wrap: wrap;
    justify-content: center;
    padding: 12px 0;
  }

  .brand,
  .main-nav {
    flex: initial;
  }

  .main-nav {
    width: 100%;
    flex-wrap: wrap;
  }

  .hero-card {
    padding: 24px;
  }

  .hero-grid,
  .card-day-card {
    grid-template-columns: 1fr;
  }

  .cta-actions {
    width: 100%;
  }

  .cta-actions .button {
    width: 100%;
  }
}

@media (max-width: 720px) {
  .utility-inner,
  .utility-links,
  .utility-actions,
  .hero-actions,
  .review-top,
  .review-top-left,
  .qa-footer,
  .card-day-footer,
  .footer-bottom,
  .footer-bottom div {
    flex-direction: column;
    align-items: flex-start;
  }

  .hero-copy h1 {
    font-size: 34px;
    line-height: 38px;
  }

  .section-head h2,
  .cta-copy h2 {
    font-size: 28px;
    line-height: 32px;
  }

  .button,
  .header-cta,
  .hero-action-primary,
  .hero-action-secondary,
  .footer-btn-wide,
  .footer-btn-mid,
  .footer-btn-small,
  .card-button {
    width: 100%;
  }
}

/* ===== HEADER FINAL FIX ===== */

.site-header {
  padding: 8px 8px 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

/* Работает и если у тебя .container, и если header-shell */
.site-header > .container,
.site-header .container,
.header-shell {
  width: min(calc(100% - 16px), 1408px) !important;
  max-width: 1408px !important;
  margin: 0 auto !important;

  border: 1px solid var(--border-default) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  background: var(--surface-white) !important;
}

/* верхняя розовая полоса */
.utility-bar {
  height: 48px !important;
  background: var(--bg-secondary) !important;
  border-bottom: 1px solid var(--border-default) !important;
  border-radius: 20px 20px 0 0 !important;
}

/* контент верхней строки растягиваем по всей длине */
.utility-inner {
  width: calc(100% - 112px) !important;
  height: 48px !important;
  margin: 0 auto !important;

  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  justify-content: unset !important;

  font-size: 13px !important;
  line-height: 20px !important;
}

/* левая группа */
.utility-links {
  justify-self: start !important;
  display: flex !important;
  align-items: center !important;
  gap: 28px !important;
}

/* если UA/RU и Кабінет лежат в utility-actions */
.utility-actions {
  justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

/* если UA/RU и Кабінет лежат прямо внутри utility-inner */
.utility-inner > .lang-switch {
  justify-self: center !important;
}

.utility-inner > .account-chip {
  justify-self: end !important;
}

/* нижняя белая часть */
.main-bar {
  height: 80px !important;
  background: var(--surface-white) !important;
  border-radius: 0 0 20px 20px !important;
}

.main-inner {
  width: calc(100% - 112px) !important;
  height: 80px !important;
  margin: 0 auto !important;

  display: grid !important;
  grid-template-columns: 260px 1fr 172px !important;
  align-items: center !important;
  column-gap: 40px !important;
  justify-content: unset !important;
}

/* лого слева */
.brand {
  justify-self: start !important;
  width: 243px !important;
  height: 72px !important;
  display: flex !important;
  align-items: center !important;
}

.brand img {
  width: 243px !important;
  height: 72px !important;
  object-fit: contain !important;
}

/* навигация по центру */
.main-nav {
  justify-self: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 36px !important;
}

/* кнопка справа */
.header-cta {
  justify-self: end !important;
  width: 172px !important;
  height: 44px !important;
}

/* ===== LANGUAGE SWITCH FIX ===== */

.lang-switch {
  height: 32px !important;
  min-width: 78px !important;
  padding: 0 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;

  border: 1px solid var(--border-default) !important;
  border-radius: 999px !important;
  background: var(--surface-white) !important;
  color: var(--text-secondary) !important;
  overflow: visible !important;
}

.lang-option {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--text-secondary) !important;
  font: inherit !important;
  font-size: 12px !important;
  line-height: 16px !important;
  cursor: pointer !important;
}

.lang-option.is-active {
  color: var(--text-primary) !important;
}

.lang-divider {
  color: var(--text-secondary);
  opacity: 0.7;
  line-height: 16px;
}

/* ===== DIRECTIONS PAGE ===== */

.directions-page {
  padding-top: 0;
}

.directions-hero-section {
  padding-top: 48px;
}

.page-hero-card {
  min-height: 520px;
  display: grid;
  grid-template-columns: minmax(0, 560px) minmax(0, 520px);
  gap: 64px;
  align-items: center;
  padding: 48px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.72);
}

.page-hero-copy h1 {
  margin: 24px 0 0;
  max-width: 620px;
  color: var(--text-primary);
  font-size: 52px;
  line-height: 60px;
  font-weight: 700;
  letter-spacing: -0.04em;
}

.page-hero-copy p {
  margin: 20px 0 0;
  max-width: 560px;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 28px;
}

.page-hero-actions {
  margin-top: 48px;
}

.page-hero-panel {
  min-height: 360px;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-white);
}

.page-hero-steps {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}

.page-step {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 14px;
  align-items: start;
  min-height: 76px;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: var(--bg-primary);
}

.page-step span {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 14px;
  line-height: 18px;
}

.page-step p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 24px;
}

.direction-list {
  display: grid;
  gap: 24px;
}

.direction-list-card {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 40px;
  align-items: center;
  min-height: 360px;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-white);
}

.direction-list-card-reverse {
  grid-template-columns: 1fr 360px;
}

.direction-list-card-reverse .direction-list-visual {
  order: 2;
}

.direction-list-card-reverse .direction-list-content {
  order: 1;
}

.direction-list-visual {
  position: relative;
  height: 260px;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, var(--bg-secondary) 0%, var(--bg-primary) 100%);
}

.direction-list-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 48%, rgba(174, 123, 196, 0.16), rgba(174, 123, 196, 0) 60%),
    linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,0.52));
}

.direction-list-visual img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 360px;
  max-width: none;
  transform: translate(-50%, -50%) scale(0.92);
}

.direction-list-content h3 {
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: 32px;
  line-height: 40px;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.direction-list-content p {
  margin: 14px 0 0;
  max-width: 640px;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 28px;
}

.direction-points {
  display: grid;
  gap: 10px;
  margin-top: 20px;
}

.direction-points span {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 10px 14px;
  border: 1px solid var(--border-default);
  border-radius: 18px;
  background: var(--bg-primary);
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 22px;
}

.direction-actions {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 28px;
}

.choose-format-card {
  display: grid;
  grid-template-columns: 420px 1fr;
  gap: 48px;
  align-items: stretch;
  padding: 32px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-white);
}

.choose-format-copy h2 {
  margin: 20px 0 0;
  color: var(--text-primary);
  font-size: 36px;
  line-height: 44px;
  letter-spacing: -0.03em;
}

.choose-format-copy p {
  margin: 16px 0 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 28px;
}

.format-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.format-option {
  min-height: 240px;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--bg-primary);
}

.format-option h3 {
  margin: 20px 0 0;
  color: var(--text-primary);
  font-size: 24px;
  line-height: 32px;
}

.format-option p {
  margin: 14px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

@media (max-width: 1260px) {
  .page-hero-card,
  .direction-list-card,
  .direction-list-card-reverse,
  .choose-format-card {
    grid-template-columns: 1fr;
  }

  .direction-list-card-reverse .direction-list-visual,
  .direction-list-card-reverse .direction-list-content {
    order: initial;
  }

  .direction-list-visual {
    height: 240px;
  }
}

@media (max-width: 720px) {
  .page-hero-card {
    padding: 24px;
  }

  .page-hero-copy h1 {
    font-size: 34px;
    line-height: 40px;
  }

  .direction-list-card {
    padding: 20px;
  }

  .direction-list-content h3 {
    font-size: 26px;
    line-height: 34px;
  }

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

  .direction-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ===== DIRECTIONS PAGE BUTTONS FIX ===== */

/* Ссылки рядом с кнопками: "Переглянути фахівців" */
.direction-actions .text-link {
  margin-top: 0 !important;
  padding-top: 0 !important;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 20px;
  white-space: nowrap;
}

/* Кнопка "Відкрити напрям" и ссылка рядом — ровно по одной линии */
.direction-actions {
  display: flex;
  align-items: center;
  gap: 24px;
}

/* Низ секций: текст слева, кнопка справа */
.section-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

/* Чтобы кнопки справа не ломались в 2 строки */
.section-footer .button,
.cta-actions .button {
  white-space: nowrap;
  flex-shrink: 0;
}

/* Конкретно кнопка "Переглянути фахівців" */
.footer-btn-small,
.footer-btn-wide,
.hero-action-secondary {
  width: auto !important;
  min-width: 230px;
  padding-left: 24px;
  padding-right: 24px;
}

/* Если кнопка находится в CTA справа */
.cta-actions .footer-btn-small {
  min-width: 230px;
}

/* Чтобы текст внутри кнопок всегда был по центру */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}

/* =========================================================
   DIRECTION DETAIL PAGE — Psychology
   Clean no-glow version
   ========================================================= */

.direction-detail-page .hero-card,
.direction-detail-page .info-card,
.direction-detail-page .cta-card,
.direction-detail-page .choose-format-card,
.direction-detail-page .format-option,
.direction-detail-page .faq-item,
.direction-detail-image-card {
  box-shadow: none !important;
}

.direction-detail-page .hero-section {
  padding-top: 48px;
}

.direction-detail-hero {
  min-height: 560px;
  padding: 48px;
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
}

.direction-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 560px) minmax(0, 500px);
  justify-content: space-between;
  gap: 56px;
  align-items: center;
  min-height: 464px;
}

.direction-detail-copy h1 {
  max-width: 600px;
  margin: 22px 0 0;
  color: var(--text-primary);
  font-size: 52px;
  line-height: 58px;
  font-weight: 700;
  letter-spacing: -0.04em;
}

.direction-detail-copy .hero-lead {
  max-width: 560px;
  margin-top: 20px;
  font-size: 16px;
  line-height: 28px;
}

.direction-detail-actions {
  margin-top: 52px !important;
  gap: 12px;
}

.direction-detail-actions .button {
  white-space: nowrap;
}

.direction-detail-chips {
  margin-top: 14px;
}

.direction-detail-visual {
  display: flex;
  align-items: center;
  justify-content: center;
}

.direction-detail-image-card {
  position: relative;
  width: min(100%, 456px);
  height: 392px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 30px 32px 0;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, var(--bg-secondary) 0%, var(--bg-primary) 100%);
}

.direction-detail-image-card::before,
.direction-detail-image-card::after {
  content: none !important;
}

.direction-detail-image-card img {
  width: min(100%, 352px);
  max-width: none;
  height: auto;
  object-fit: contain;
  object-position: center bottom;
  transform: translateY(6px);
  opacity: 0.98;
}

.topic-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.topic-card {
  min-height: 252px;
  display: flex;
  flex-direction: column;
  padding: 24px;
}

.topic-card .badge {
  width: fit-content;
  margin-top: 18px;
}

.topic-card h3 {
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: 24px;
  line-height: 30px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.topic-card p {
  margin: 14px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.direction-format-card {
  background: rgba(255, 255, 255, 0.84);
}

.direction-format-option {
  background: var(--bg-primary);
}

.direction-format-option .badge {
  width: fit-content;
}

.check-list {
  display: grid;
  gap: 10px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.check-list li {
  position: relative;
  padding-left: 22px;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 22px;
}

.check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--section-color);
}

.direction-specialist-banner {
  min-height: 244px;
  display: grid;
  grid-template-columns: minmax(0, 720px) auto;
  gap: 32px;
  align-items: center;
  padding: 32px;
  background: rgba(255, 255, 255, 0.92);
  border-radius: var(--radius-lg);
}

.direction-specialist-banner h2 {
  margin: 20px 0 0;
  color: var(--text-primary);
  font-size: 36px;
  line-height: 42px;
  letter-spacing: -0.03em;
}

.direction-specialist-banner p {
  max-width: 680px;
  margin: 14px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.direction-banner-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.direction-banner-actions .text-link {
  margin-top: 0;
  padding-top: 0;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

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

.faq-item {
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.92);
}

.faq-item summary {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 24px;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 24px;
  font-weight: 700;
  cursor: pointer;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary::after {
  content: "+";
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 18px;
  line-height: 1;
}

.faq-item[open] summary::after {
  content: "−";
}

.faq-item p {
  margin: 0;
  padding: 0 24px 22px;
  max-width: 840px;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.direction-detail-page .cta-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(248, 239, 251, 0.98) 100%);
}

.direction-detail-page .button,
.direction-detail-page .text-link {
  white-space: nowrap;
}

@media (max-width: 1260px) {
  .direction-detail-grid,
  .direction-specialist-banner {
    grid-template-columns: 1fr;
  }

  .direction-detail-hero {
    min-height: unset;
  }

  .direction-detail-grid {
    min-height: unset;
  }

  .direction-detail-image-card {
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
  }

  .direction-banner-actions {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
  }
}

@media (max-width: 980px) {
  .direction-detail-hero {
    padding: 28px;
  }

  .direction-detail-copy h1 {
    font-size: 42px;
    line-height: 48px;
  }

  .topic-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .direction-detail-page .hero-section {
    padding-top: 32px;
  }

  .direction-detail-hero {
    padding: 24px;
  }

  .direction-detail-copy h1 {
    font-size: 34px;
    line-height: 40px;
  }

  .direction-detail-actions,
  .direction-banner-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .direction-detail-actions .button,
  .direction-banner-actions .button,
  .direction-detail-page .cta-actions .button {
    width: 100%;
  }

  .direction-detail-image-card {
    height: 300px;
    padding: 24px 20px 0;
  }

  .direction-detail-image-card img {
    width: min(100%, 280px);
  }

  .topic-card,
  .direction-specialist-banner {
    padding: 20px;
  }

  .direction-specialist-banner h2 {
    font-size: 28px;
    line-height: 34px;
  }

  .faq-item summary {
    padding: 18px 20px;
    font-size: 15px;
    line-height: 22px;
  }

  .faq-item p {
    padding: 0 20px 20px;
  }
}

/* =========================================================
   REQUEST PAGE — polished request modes + range calendar
   Added after badge cleanup: no glow, softer public option
========================================================= */

.site-header .header-cta,
.site-header .header-cta.button-primary,
.site-header .header-cta.button-secondary {
  color: var(--brand-primary) !important;
  background: var(--surface-white) !important;
  border-color: var(--border-default) !important;
  box-shadow: none !important;
}

.site-header .header-cta:hover {
  color: var(--brand-primary) !important;
  background: var(--bg-secondary) !important;
  border-color: var(--border-default) !important;
}

.request-type-grid-polished {
  align-items: stretch;
}

.request-type-grid-polished .request-type-card {
  position: relative;
  min-height: 178px;
  padding: 20px;
  gap: 10px;
  overflow: hidden;
}

.request-type-grid-polished .request-type-card .badge {
  margin-bottom: 2px;
}

.request-type-grid-polished .request-type-card strong {
  max-width: 420px;
  font-size: 20px;
  line-height: 27px;
  letter-spacing: -0.02em;
}

.request-type-grid-polished .request-type-card small {
  max-width: 470px;
  font-size: 14px;
  line-height: 22px;
}

.request-type-mini {
  margin-top: auto;
  padding-top: 8px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.request-type-card-private:has(input:checked) {
  border-color: rgba(34, 197, 94, 0.30);
  background: linear-gradient(180deg, #ffffff 0%, rgba(34, 197, 94, 0.055) 100%);
}

.request-type-card-public:has(input:checked) {
  border-color: rgba(174, 123, 196, 0.32);
  background: linear-gradient(180deg, #ffffff 0%, rgba(248, 239, 251, 0.84) 100%);
}

.request-mode-helper {
  margin: -6px 0 24px;
}

.request-mode-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  min-height: 86px;
  padding: 18px 20px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: var(--surface-white);
}

.request-mode-note[hidden] {
  display: none !important;
}

.request-mode-note .badge {
  align-self: flex-start;
  margin-top: 2px;
  white-space: nowrap;
}

.request-mode-note strong {
  display: block;
  margin: 0;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 24px;
  letter-spacing: -0.01em;
}

.request-mode-note p {
  max-width: 720px;
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 22px;
}

.request-mode-note-private {
  border-color: rgba(34, 197, 94, 0.20);
  background: linear-gradient(180deg, #ffffff 0%, rgba(34, 197, 94, 0.045) 100%);
}

.request-mode-note-public {
  border-color: rgba(245, 158, 11, 0.22);
  background: linear-gradient(180deg, #ffffff 0%, rgba(245, 158, 11, 0.055) 100%);
}

.request-note-button {
  min-width: 190px;
  white-space: nowrap;
}

[data-request-private][hidden],
[data-request-public][hidden] {
  display: none !important;
}

.calendar-input-wrap {
  position: relative;
  width: 100%;
  overflow: visible;
}

.calendar-input-wrap input[data-calendar] {
  padding-right: 58px;
  cursor: pointer;
}

.calendar-input-button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(174, 123, 196, 0.16);
  border-radius: 14px;
  background: var(--section-color-soft);
  color: var(--section-color);
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.calendar-input-button:hover {
  transform: translateY(-1px);
  border-color: rgba(174, 123, 196, 0.30);
  background: var(--bg-primary);
}

.calendar-picker {
  position: absolute;
  z-index: 95;
  top: calc(100% + 12px);
  left: 0;
  width: min(100%, 470px);
  padding: 20px;
  border: 1px solid rgba(237, 221, 231, 0.98);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 44px rgba(69, 55, 84, 0.10);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 0.16s ease, transform 0.16s ease;
}

.calendar-picker.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.calendar-picker-top {
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 12px;
}

.calendar-picker-label {
  color: var(--text-secondary);
  text-align: center;
  font-size: 14px;
  line-height: 20px;
}

.calendar-nav-button {
  width: 44px;
  height: 44px;
  border: 1px solid var(--border-default);
  border-radius: 50%;
  background: var(--surface-white);
  color: var(--text-primary);
  cursor: pointer;
  font-size: 28px;
  line-height: 1;
}

.calendar-months {
  margin-top: 20px;
}

.calendar-month-title {
  margin-bottom: 18px;
  color: var(--text-primary);
  text-align: center;
  font-size: 22px;
  line-height: 28px;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.calendar-weekdays,
.calendar-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}

.calendar-weekdays {
  margin-bottom: 8px;
}

.calendar-weekdays span {
  color: var(--text-secondary);
  text-align: center;
  font-size: 13px;
  line-height: 24px;
}

.calendar-day {
  position: relative;
  height: 38px;
  border: 0;
  border-radius: 13px;
  background: transparent;
  color: var(--text-primary);
  cursor: pointer;
  font-size: 14px;
  line-height: 20px;
  transition: background 0.12s ease, color 0.12s ease, opacity 0.12s ease;
}

.calendar-day:hover:not(.is-disabled) {
  background: var(--bg-primary);
  color: var(--brand-primary);
}

.calendar-day.is-muted {
  color: rgba(154, 139, 162, 0.44);
}

.calendar-day.is-disabled {
  cursor: not-allowed;
  color: rgba(154, 139, 162, 0.30);
}

.calendar-day.is-today:not(.is-range-start):not(.is-range-end) {
  box-shadow: inset 0 0 0 1px rgba(174, 123, 196, 0.28);
}

.calendar-day.is-hover-range {
  border-radius: 6px;
  background: rgba(174, 123, 196, 0.10);
}

.calendar-day.is-hover-end,
.calendar-day.is-range-start,
.calendar-day.is-range-end,
.calendar-day.is-single-range {
  border-radius: 13px;
  background: var(--section-color);
  color: #ffffff;
}

.calendar-actions {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--border-default);
}

.calendar-action {
  height: 44px;
  padding: 0 20px;
  border-radius: var(--radius-pill);
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  line-height: 18px;
}

.calendar-action-secondary {
  border: 1px solid var(--border-default);
  background: var(--surface-white);
  color: var(--text-secondary);
}

.calendar-action-primary {
  border: 1px solid var(--brand-primary);
  background: var(--brand-primary);
  color: #ffffff;
}

@media (max-width: 720px) {
  .request-mode-note {
    grid-template-columns: 1fr;
  }

  .request-note-button {
    width: 100%;
  }

  .calendar-picker {
    width: calc(100vw - 48px);
    max-width: 470px;
  }
}

/* =========================================================
   REQUEST PAGE HARD FIX — form, custom selects, calendar
   This block intentionally overrides earlier partial request styles.
========================================================= */

.request-page,
.request-page .container,
.request-layout,
.request-form-card,
.request-side-card,
.form-field,
.calendar-input-wrap {
  overflow: visible;
}

.request-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 24px;
  align-items: start;
}

.request-form-card {
  position: relative;
  z-index: 3;
  padding: 24px;
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.96);
}

.request-side-card {
  position: sticky;
  top: 24px;
  z-index: 1;
  padding: 24px;
}

.request-side-card h3 {
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: 26px;
  line-height: 32px;
  letter-spacing: -0.03em;
}

.request-side-card > p {
  margin: 14px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.request-fieldset {
  min-width: 0;
  margin: 0 0 22px;
  padding: 0;
  border: 0;
}

.request-fieldset legend {
  margin: 0 0 14px;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.request-type-grid,
.request-type-grid-polished {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.request-type-card {
  position: relative;
  min-width: 0;
  min-height: 188px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 20px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: var(--surface-white);
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.request-type-card:hover {
  transform: translateY(-1px);
  border-color: rgba(174, 123, 196, 0.28);
  background: rgba(255, 247, 250, 0.54);
}

.request-type-card input[type="radio"] {
  position: absolute;
  inset: 18px 18px auto auto;
  width: 18px;
  height: 18px;
  accent-color: var(--brand-primary);
}

.request-type-card .badge {
  margin-right: 28px;
}

.request-type-card strong {
  max-width: 470px;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.02em;
}

.request-type-card small {
  max-width: 520px;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 23px;
}

.request-type-mini {
  margin-top: auto;
  padding-top: 8px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.request-type-card-private:has(input:checked) {
  border-color: rgba(34, 197, 94, 0.34);
  background: linear-gradient(180deg, #ffffff 0%, rgba(34, 197, 94, 0.055) 100%);
}

.request-type-card-public:has(input:checked) {
  border-color: rgba(174, 123, 196, 0.32);
  background: linear-gradient(180deg, #ffffff 0%, rgba(248, 239, 251, 0.88) 100%);
}

.request-mode-helper {
  margin: -4px 0 24px;
}

.request-mode-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  min-height: 86px;
  padding: 18px 20px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: var(--surface-white);
}

.request-mode-note[hidden] {
  display: none !important;
}

.request-mode-note-private {
  border-color: rgba(34, 197, 94, 0.20);
  background: linear-gradient(180deg, #ffffff 0%, rgba(34, 197, 94, 0.045) 100%);
}

.request-mode-note-public {
  border-color: rgba(245, 158, 11, 0.22);
  background: linear-gradient(180deg, #ffffff 0%, rgba(245, 158, 11, 0.055) 100%);
}

.request-mode-note .badge {
  align-self: flex-start;
  margin-top: 2px;
  white-space: nowrap;
}

.request-mode-note strong {
  display: block;
  margin: 0;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 24px;
  letter-spacing: -0.01em;
}

.request-mode-note p {
  max-width: 720px;
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 22px;
}

.request-note-button {
  min-width: 190px;
  white-space: nowrap;
}

.request-form-grid {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 20px;
}

.form-field {
  position: relative;
  z-index: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.form-field:focus-within {
  z-index: 80;
}

.form-field-full {
  grid-column: 1 / -1;
}

.form-field > span {
  color: var(--text-primary);
  font-size: 15px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.form-field input:not([type="hidden"]),
.form-field textarea,
.form-field select,
.custom-select__button {
  width: 100%;
  min-height: 56px;
  padding: 0 20px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  outline: none;
  background: rgba(255, 255, 255, 0.92);
  color: var(--text-primary);
  font-family: inherit;
  font-size: 15px;
  line-height: 22px;
  transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

.form-field textarea {
  min-height: 152px;
  padding-top: 18px;
  padding-bottom: 18px;
  resize: vertical;
}

.form-field input::placeholder,
.form-field textarea::placeholder {
  color: rgba(154, 139, 162, 0.72);
}

.form-field input:not([type="hidden"]):focus,
.form-field textarea:focus,
.form-field select:focus,
.custom-select.is-open .custom-select__button,
.custom-select__button:focus-visible {
  border-color: rgba(174, 123, 196, 0.46);
  background: var(--surface-white);
  box-shadow: 0 0 0 4px rgba(174, 123, 196, 0.08);
}

.form-field[hidden],
[data-request-private][hidden],
[data-request-public][hidden] {
  display: none !important;
}

.custom-select {
  position: relative;
  width: 100%;
}

.custom-native-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  border: 0 !important;
}

.custom-select__button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  cursor: pointer;
  text-align: left;
}

.custom-select__value {
  overflow: hidden;
  color: var(--text-primary);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-select__arrow {
  width: 10px;
  height: 10px;
  flex: 0 0 auto;
  border-right: 2px solid var(--text-secondary);
  border-bottom: 2px solid var(--text-secondary);
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.16s ease;
}

.custom-select.is-open .custom-select__arrow {
  transform: rotate(225deg) translateY(-1px);
}

.custom-select__menu {
  position: absolute;
  z-index: 120;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  max-height: 260px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 44px rgba(69, 55, 84, 0.10);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 0.16s ease, transform 0.16s ease;
}

.custom-select.is-open .custom-select__menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.custom-select__option {
  width: 100%;
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 10px 12px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--text-primary);
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  line-height: 20px;
  text-align: left;
}

.custom-select__option:hover {
  background: var(--bg-primary);
  color: var(--brand-primary);
}

.custom-select__option.is-selected {
  background: var(--section-color-soft);
  color: var(--section-color);
}

.calendar-input-wrap {
  position: relative;
  z-index: 90;
  width: 100%;
}

.calendar-input-wrap input[data-calendar] {
  width: 100%;
  padding-right: 62px;
  cursor: pointer;
}

.calendar-input-button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(174, 123, 196, 0.16);
  border-radius: 14px;
  background: var(--section-color-soft);
  color: var(--section-color);
  cursor: pointer;
  font-size: 15px;
  line-height: 1;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}

.calendar-input-button:hover {
  transform: translateY(-1px);
  border-color: rgba(174, 123, 196, 0.30);
  background: var(--bg-primary);
}

.calendar-picker {
  position: absolute;
  z-index: 260;
  top: calc(100% + 12px);
  left: 0;
  width: min(100%, 470px);
  padding: 20px;
  border: 1px solid rgba(237, 221, 231, 0.98);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.985);
  box-shadow: 0 20px 56px rgba(69, 55, 84, 0.12);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 0.16s ease, transform 0.16s ease;
}

.calendar-picker.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.calendar-picker-top {
  display: grid;
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 12px;
}

.calendar-picker-label {
  color: var(--text-secondary);
  text-align: center;
  font-size: 14px;
  line-height: 20px;
}

.calendar-nav-button {
  width: 44px;
  height: 44px;
  border: 1px solid var(--border-default);
  border-radius: 50%;
  background: var(--surface-white);
  color: var(--text-primary);
  cursor: pointer;
  font: inherit;
  font-size: 28px;
  line-height: 1;
}

.calendar-nav-button:hover {
  background: var(--bg-primary);
  color: var(--brand-primary);
}

.calendar-months {
  margin-top: 20px;
}

.calendar-month-title {
  margin-bottom: 18px;
  color: var(--text-primary);
  text-align: center;
  font-size: 22px;
  line-height: 28px;
  font-weight: 700;
  letter-spacing: -0.03em;
}

.calendar-weekdays,
.calendar-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}

.calendar-weekdays {
  margin-bottom: 8px;
}

.calendar-weekdays span {
  color: var(--text-secondary);
  text-align: center;
  font-size: 13px;
  line-height: 24px;
}

.calendar-day {
  position: relative;
  height: 38px;
  border: 0;
  border-radius: 13px;
  background: transparent;
  color: var(--text-primary);
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  line-height: 20px;
  transition: background 0.12s ease, color 0.12s ease, opacity 0.12s ease;
}

.calendar-day:hover:not(.is-disabled) {
  background: var(--bg-primary);
  color: var(--brand-primary);
}

.calendar-day.is-muted {
  color: rgba(154, 139, 162, 0.44);
}

.calendar-day.is-disabled {
  cursor: not-allowed;
  color: rgba(154, 139, 162, 0.30);
}

.calendar-day.is-today:not(.is-range-start):not(.is-range-end) {
  box-shadow: inset 0 0 0 1px rgba(174, 123, 196, 0.28);
}

.calendar-day.is-hover-range {
  border-radius: 6px;
  background: rgba(174, 123, 196, 0.10);
}

.calendar-day.is-hover-end,
.calendar-day.is-range-start,
.calendar-day.is-range-end,
.calendar-day.is-single-range {
  border-radius: 13px;
  background: var(--section-color);
  color: #ffffff;
}

.calendar-actions {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--border-default);
}

.calendar-action {
  height: 44px;
  padding: 0 20px;
  border-radius: var(--radius-pill);
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  line-height: 18px;
}

.calendar-action-secondary {
  border: 1px solid var(--border-default);
  background: var(--surface-white);
  color: var(--text-secondary);
}

.calendar-action-primary {
  border: 1px solid var(--brand-primary);
  background: var(--brand-primary);
  color: #ffffff;
}

.form-consent {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin-top: 20px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 22px;
}

.form-consent input {
  margin-top: 3px;
  accent-color: var(--brand-primary);
}

.form-consent a {
  color: var(--brand-primary);
  white-space: nowrap;
}

.request-submit-row {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 24px;
}

.request-submit-row .text-link {
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.request-info-rows {
  margin-top: 18px;
}

.request-emergency-note {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(239, 68, 68, 0.18);
  border-radius: 20px;
  background: rgba(239, 68, 68, 0.045);
}

.request-emergency-note p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 22px;
}

@media (max-width: 1260px) {
  .request-layout {
    grid-template-columns: 1fr;
  }

  .request-side-card {
    position: static;
  }
}

@media (max-width: 860px) {
  .request-type-grid,
  .request-type-grid-polished,
  .request-form-grid {
    grid-template-columns: 1fr;
  }

  .request-mode-note {
    grid-template-columns: 1fr;
  }

  .request-note-button,
  .request-submit-row .button {
    width: 100%;
  }

  .request-submit-row {
    flex-direction: column;
    align-items: stretch;
  }
}

@media (max-width: 720px) {
  .request-form-card,
  .request-side-card {
    padding: 20px;
  }

  .calendar-picker {
    width: calc(100vw - 48px);
    max-width: 470px;
  }
}

/* ===== REQUEST CALENDAR STACKING HOTFIX =====
   Keeps the calendar above textarea/selects after calendar rerenders. */
.request-page,
.request-page .section,
.request-page .container,
.request-layout,
.request-form-card,
.request-form-grid {
  overflow: visible !important;
}

.request-form-card {
  isolation: isolate;
}

.request-form-grid {
  position: relative;
}

.request-form-grid .form-field {
  position: relative;
  z-index: 1;
}

.request-form-grid .form-field:focus-within,
.request-form-grid .form-field.is-calendar-open,
.request-form-grid .calendar-input-wrap.is-calendar-open {
  z-index: 10000 !important;
}

.request-form-grid .custom-select.is-open {
  z-index: 9000 !important;
}

.request-form-grid .calendar-picker {
  z-index: 10001 !important;
  background: #ffffff !important;
  opacity: 0;
}

.request-form-grid .calendar-picker.is-open {
  opacity: 1 !important;
}
/* ===== GLOBAL IMAGE POSITION FIX - direction sections ===== */

/* Direction cards on index.html */
.illustration-wrap {
  position: relative;
  display: block;
}

.illustration-wrap img {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: none;
  height: auto;
  object-fit: contain;
  object-position: center center;
  transform-origin: center center;
}

.psychology-illustration img {
  transform: translate(-50%, -50%) scale(0.78);
}

.coaching-illustration img {
  transform: translate(-50%, -50%) scale(0.76);
}

.tarot-illustration img {
  transform: translate(-50%, -50%) scale(0.80);
}

/* Direction list cards on directions.html */
.direction-list-visual {
  position: relative;
  display: block;
}

.direction-list-visual img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(150%, 560px);
  max-width: none;
  height: auto;
  object-fit: contain;
  object-position: center center;
  transform: translate(-50%, -50%) scale(1.06);
  transform-origin: center center;
}

@media (max-width: 720px) {
  .direction-list-visual img {
    width: min(170%, 520px);
    transform: translate(-50%, -50%) scale(1.02);
  }
}

/* Hero image cards on direction-psychology / coaching / tarot */
.direction-detail-visual {
  display: flex;
  align-items: center;
  justify-content: center;
}

.direction-detail-image-card {
  position: relative;
  display: block;
  padding: 0;
  overflow: hidden;
}

.direction-detail-image-card img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(76%, 352px);
  max-width: none;
  height: auto;
  object-fit: contain;
  object-position: center center;
  transform: translate(-50%, -50%);
  opacity: 0.98;
}

@media (max-width: 720px) {
  .direction-detail-image-card {
    padding: 0;
  }

  .direction-detail-image-card img {
    width: min(78%, 280px);
  }
}

.trust-chip {
  height: 36px;
  margin-top: 20px;
  padding: 0 14px;
}

/* Final responsive guardrails: keep compact labels and profile card heads inside their cards. */
.badge {
  max-width: 100% !important;
  min-width: 0;
  white-space: normal !important;
  overflow-wrap: anywhere;
  text-align: center;
}

.specialist-card .specialist-top {
  grid-template-columns: 72px minmax(0, 1fr) !important;
  max-width: 100%;
}

.specialist-card .specialist-top-content,
.specialist-card .specialist-title-wrap,
.specialist-card .specialist-status-row {
  min-width: 0;
  max-width: 100%;
}

.specialist-card .specialist-top h3,
.specialist-card .specialist-role {
  overflow-wrap: anywhere;
}

.specialist-card .specialist-status-row .badge {
  justify-content: center;
  max-width: 100% !important;
}

.specialist-review-manager-page .reviews-v2-count,
.specialist-review-manager-panel .reviews-v2-count {
  width: auto;
  max-width: 100%;
  flex: 0 1 auto;
  overflow-wrap: anywhere;
  text-align: center;
}

@media (max-width: 760px) {
  .specialist-review-manager-page .reviews-v2-count,
  .specialist-review-manager-panel .reviews-v2-count {
    width: 100%;
  }
}


/* ===== QUESTIONS PAGE ===== */
.questions-page {
  padding-top: 0;
}

.questions-hero-section {
  padding-top: 48px;
}

.questions-hero-card {
  grid-template-columns: minmax(0, 610px) minmax(0, 470px);
}

.questions-hero-panel {
  display: flex;
  flex-direction: column;
}

.public-warning {
  margin-top: 22px;
  padding: 22px;
  border: 1px solid rgba(59, 130, 246, 0.16);
  border-radius: var(--radius-md);
  background: rgba(59, 130, 246, 0.06);
}

.public-warning h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 24px;
  line-height: 32px;
  letter-spacing: -0.03em;
}

.public-warning p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.questions-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: auto;
  padding-top: 24px;
}

.questions-stats div {
  min-height: 92px;
  display: grid;
  align-content: center;
  justify-items: center;
  padding: 14px 10px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: var(--bg-primary);
  text-align: center;
}

.questions-stats strong {
  color: var(--text-primary);
  font-size: 26px;
  line-height: 30px;
  font-weight: 700;
}

.questions-stats span {
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 18px;
}

.questions-format-card {
  background: rgba(255, 255, 255, 0.9);
}

.questions-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: -10px 0 24px;
}

.questions-filter-row .badge {
  min-height: 36px;
}

.question-list {
  display: grid;
  gap: 18px;
}

.question-full-card {
  min-height: unset;
  padding: 24px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 440px);
  gap: 24px;
  align-items: stretch;
  scroll-margin-top: 140px;
}

.question-card-top {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.question-main {
  padding: 20px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--bg-primary);
}

.question-main h3 {
  margin: 10px 0 0;
  color: var(--text-primary);
  font-size: 24px;
  line-height: 32px;
  letter-spacing: -0.03em;
}

.question-main p {
  margin: 14px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.question-answer {
  display: flex;
  flex-direction: column;
  padding: 20px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.92);
}

.answer-author {
  display: flex;
  align-items: center;
  gap: 12px;
}

.answer-author h4 {
  margin: 4px 0 0;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 24px;
}

.question-answer > p {
  margin: 16px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.question-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding-top: 22px;
}

.question-actions .text-link {
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.question-actions .button {
  white-space: nowrap;
}

.questions-split {
  display: grid;
  grid-template-columns: minmax(0, 520px) minmax(0, 1fr);
  gap: 48px;
  align-items: start;
  padding: 32px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--surface-white);
}

.questions-split .section-head {
  margin-bottom: 0;
}

.questions-note-list {
  display: grid;
  gap: 12px;
}

.questions-note-list .info-row {
  min-height: 58px;
  border: 1px solid var(--border-default);
  background: var(--bg-primary);
}

@media (max-width: 1260px) {
  .questions-hero-card,
  .question-full-card,
  .questions-split {
    grid-template-columns: 1fr;
  }

  .questions-stats {
    margin-top: 24px;
  }
}

@media (max-width: 720px) {
  .questions-stats {
    grid-template-columns: 1fr;
  }

  .question-card-top,
  .question-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .question-actions .button {
    width: 100%;
  }

  .questions-split,
  .question-full-card,
  .question-main,
  .question-answer {
    padding: 20px;
  }
}

/* =========================================================
   SAFE STABILIZATION PATCH — card-day + support only
   Does not touch request form, custom calendar, trust-chip, or specialist data logic.
   ========================================================= */

/* --- Card day page: restore balanced hero and prevent overflow --- */
.card-day-page .card-day-hero-section {
  padding-top: 44px;
}

.card-day-page .card-day-hero-card {
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 520px) !important;
  gap: 56px !important;
  align-items: center !important;
  padding: 50px !important;
  overflow: hidden;
}

.card-day-page .page-hero-copy,
.card-day-page .card-day-panel,
.card-day-page .daily-card-copy,
.card-day-page .daily-reflection-box,
.card-day-page blockquote {
  min-width: 0;
}

.card-day-page .page-hero-copy h1 {
  max-width: 620px !important;
  margin: 24px 0 0 !important;
  font-size: clamp(42px, 4vw, 58px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.055em !important;
}

.card-day-page .page-hero-copy p {
  max-width: 610px !important;
  font-size: 17px !important;
  line-height: 1.75 !important;
}

.card-day-page .page-hero-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 34px !important;
}

.card-day-page .page-hero-actions .button {
  width: auto !important;
  min-width: 220px !important;
  max-width: 100% !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  white-space: nowrap !important;
}

.card-day-page .card-day-panel {
  min-height: 0 !important;
  padding: 32px !important;
  border-radius: 30px !important;
  background: rgba(255, 255, 255, 0.82) !important;
}

.card-day-page .daily-card-layout {
  display: grid !important;
  grid-template-columns: 190px minmax(0, 1fr) !important;
  gap: 30px !important;
  align-items: center !important;
}

.card-day-page .daily-card-visual {
  width: 190px !important;
  max-width: 100% !important;
}

.card-day-page .daily-card-face {
  width: 100% !important;
  aspect-ratio: 0.78 / 1 !important;
  min-height: 0 !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(248, 239, 251, 0.96) 0%, rgba(255, 247, 250, 0.92) 100%) !important;
}

.card-day-page .daily-card-copy h2 {
  margin: 8px 0 14px !important;
  font-size: clamp(36px, 3.4vw, 52px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.055em !important;
  overflow-wrap: anywhere;
}

.card-day-page .daily-card-copy p {
  max-width: 330px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.7;
}

.card-day-page .card-day-panel blockquote {
  margin: 26px 0 0 !important;
  padding: 24px 26px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 24px !important;
  background: #fff !important;
  color: var(--text-primary) !important;
  font-size: 18px !important;
  line-height: 1.75 !important;
}

.card-day-page .daily-reflection-box {
  margin-top: 18px !important;
  padding: 20px 24px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 24px !important;
  background: rgba(255, 247, 250, 0.78) !important;
}

.card-day-page .daily-reflection-box p {
  margin: 8px 0 0 !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
}

.card-day-page .card-day-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 22px !important;
}

.card-day-page .card-day-actions .button {
  min-width: 170px;
}

.card-day-page .card-day-steps {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.card-day-page .card-day-step-card,
.card-day-page .card-day-format-options .format-option,
.card-day-page .card-day-donate-card,
.card-day-page .card-day-safety-card {
  min-width: 0;
  overflow: hidden;
}

.card-day-page .card-day-step-card {
  min-height: 0 !important;
  padding: 26px !important;
}

.card-day-page .card-day-step-card h3,
.card-day-page .card-day-format-options .format-option h3 {
  overflow-wrap: anywhere;
}

.card-day-page .card-day-donate-card {
  display: grid !important;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.35fr) !important;
  gap: 34px !important;
  align-items: stretch !important;
  padding: 36px !important;
}

.card-day-page .card-day-format-options {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.card-day-page .card-day-format-options .format-option {
  min-height: 250px !important;
  padding: 26px !important;
}

.card-day-page .card-day-safety-card {
  padding: 36px !important;
}

/* --- Support page: polished layout + form, scoped only to support.html --- */
.support-page {
  padding-top: 0;
}

.support-page .section {
  overflow: visible;
}

.support-hero-section {
  padding-top: 44px;
}

.support-hero-card,
.support-form-layout,
.support-faq-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.75fr);
  gap: 34px;
  align-items: stretch;
}

.support-hero-card {
  padding: 52px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.78);
}

.support-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}

.support-hero-copy h1 {
  max-width: 700px;
  margin: 24px 0 0;
  color: var(--text-primary);
  font-size: clamp(42px, 4.4vw, 64px);
  line-height: 1.08;
  letter-spacing: -0.055em;
}

.support-hero-copy p {
  max-width: 650px;
  margin: 22px 0 0;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.75;
}

.support-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 38px;
}

.support-hero-actions .button {
  min-width: 210px;
  max-width: 100%;
}

.support-status-card,
.support-form-card,
.support-ticket-card,
.support-topic-card,
.support-faq-intro,
.support-faq-card {
  min-width: 0;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.88);
}

.support-status-card,
.support-ticket-card,
.support-faq-intro {
  padding: 28px;
}

.support-status-list,
.support-ticket-flow,
.support-faq-list {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}

.support-status-list article,
.support-ticket-flow article {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: rgba(255, 247, 250, 0.72);
}

.support-status-list article > span,
.support-ticket-flow article > span {
  width: 46px;
  min-width: 46px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-pill);
  background: var(--info-soft);
  color: var(--info);
  font-size: 13px;
  font-weight: 700;
}

.support-status-list h3,
.support-ticket-flow strong,
.support-topic-card h3,
.support-faq-card h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1.45;
}

.support-status-list p,
.support-ticket-flow p,
.support-topic-card p,
.support-faq-card p,
.support-form-head p,
.support-faq-intro p {
  margin: 8px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.7;
}

.support-form-card {
  padding: 34px;
}

.support-form-head h2,
.support-ticket-card h2,
.support-faq-intro h2 {
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.18;
  letter-spacing: -0.045em;
}

.support-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 28px;
}

.support-form-card .form-field {
  min-width: 0;
}

.support-form-card .form-field input,
.support-form-card .form-field textarea,
.support-form-card .form-field select,
.support-form-card .custom-select__button {
  width: 100% !important;
  min-height: 58px !important;
  padding: 0 18px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}

.support-form-card .form-field textarea {
  min-height: 150px !important;
  padding: 18px !important;
  resize: vertical;
}

.support-form-card .form-field input::placeholder,
.support-form-card .form-field textarea::placeholder {
  color: rgba(154, 139, 162, 0.78);
}

.support-form-card .form-field input:focus,
.support-form-card .form-field textarea:focus,
.support-form-card .form-field select:focus,
.support-form-card .custom-select__button:focus-visible {
  outline: none !important;
  border-color: rgba(174, 123, 196, 0.52) !important;
  background: #fff !important;
}

.support-choice-group,
.support-form-card .form-field-full,
.support-consent-card,
.support-form-actions {
  margin-top: 20px;
}

.support-choice-title {
  margin: 0 0 12px;
  color: var(--text-primary);
  font-weight: 700;
}

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

.support-choice-card,
.support-consent-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 16px 18px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: rgba(255, 247, 250, 0.62);
  cursor: pointer;
}

.support-consent-card {
  align-items: flex-start;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.6;
}

.support-choice-card input,
.support-consent-card input {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  min-width: 20px;
  height: 20px;
  margin: 0;
  border: 1.5px solid rgba(154, 139, 162, 0.55);
  background: #fff;
}

.support-choice-card input[type="radio"] {
  border-radius: 50%;
}

.support-consent-card input[type="checkbox"] {
  border-radius: 7px;
  margin-top: 1px;
}

.support-choice-card:has(input:checked),
.support-consent-card:has(input:checked) {
  border-color: rgba(174, 123, 196, 0.46);
  background: rgba(248, 239, 251, 0.88);
}

.support-choice-card input[type="radio"]:checked {
  border-color: var(--brand-primary);
  box-shadow: inset 0 0 0 5px var(--brand-primary);
}

.support-consent-card input[type="checkbox"]:checked {
  border-color: var(--brand-primary);
  background-color: var(--brand-primary);
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='11' viewBox='0 0 14 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.4 5.7L5.2 9.1L12.6 1.5' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 13px 10px;
}

.support-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.support-form-actions .button {
  min-width: 210px;
}

.support-ticket-card {
  align-self: start;
  position: sticky;
  top: 180px;
}

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

.support-topic-card {
  padding: 26px;
}

.support-topic-card .text-link {
  display: inline-flex;
  margin-top: 16px;
}

.support-faq-layout {
  align-items: start;
}

.support-faq-card {
  padding: 24px 26px;
}

.support-page .button,
.support-page .badge,
.support-page .text-link {
  max-width: 100%;
}

@media (max-width: 1260px) {
  .card-day-page .card-day-hero-card,
  .card-day-page .card-day-donate-card,
  .support-hero-card,
  .support-form-layout,
  .support-faq-layout {
    grid-template-columns: 1fr !important;
  }

  .card-day-page .card-day-format-options,
  .card-day-page .card-day-steps,
  .support-topic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .support-ticket-card {
    position: static;
  }
}

@media (max-width: 760px) {
  .card-day-page .card-day-hero-card,
  .card-day-page .card-day-donate-card,
  .card-day-page .card-day-safety-card,
  .support-hero-card,
  .support-form-card,
  .support-ticket-card,
  .support-faq-intro,
  .support-faq-card,
  .support-topic-card {
    padding: 24px !important;
    border-radius: 24px !important;
  }

  .card-day-page .page-hero-copy h1,
  .support-hero-copy h1 {
    font-size: 38px !important;
    line-height: 1.12 !important;
  }

  .card-day-page .daily-card-layout,
  .support-form-grid,
  .support-choice-grid,
  .card-day-page .card-day-format-options,
  .card-day-page .card-day-steps,
  .support-topic-grid {
    grid-template-columns: 1fr !important;
  }

  .card-day-page .daily-card-visual {
    width: 170px !important;
  }

  .card-day-page .page-hero-actions .button,
  .card-day-page .card-day-actions .button,
  .support-hero-actions .button,
  .support-form-actions .button {
    width: 100% !important;
    min-width: 0 !important;
  }
}



/* =========================================================
   Card day rebuild v3 — shared component for index + page
   Scope only: .day-card-v3-* / .card-day-v3-*
   ========================================================= */
.day-card-v3-section {
  overflow: hidden;
}

.day-card-v3-shell,
.card-day-v3-hero-shell,
.card-day-v3-format-shell,
.card-day-v3-safety-shell {
  border: 1px solid var(--border-default);
  border-radius: 36px;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF9FC 52%, #F8EFFB 100%);
  box-shadow: 0 18px 44px rgba(69, 55, 84, 0.055);
  overflow: hidden;
}

.day-card-v3-shell {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(360px, 1.14fr);
  gap: 28px;
  align-items: stretch;
  padding: 34px;
}

.day-card-v3-copy,
.card-day-v3-hero-copy,
.card-day-v3-format-copy {
  min-width: 0;
}

.day-card-v3-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 8px 0 8px 8px;
}

.day-card-v3-copy h2,
.card-day-v3-hero-copy h1,
.card-day-v3-format-copy h2,
.card-day-v3-safety-shell h2 {
  color: var(--text-primary);
  letter-spacing: -0.055em;
}

.day-card-v3-copy h2 {
  max-width: 560px;
  margin: 22px 0 0;
  font-size: clamp(30px, 3.25vw, 46px);
  line-height: 1.1;
}

.day-card-v3-copy p,
.card-day-v3-hero-copy p,
.card-day-v3-format-copy p,
.card-day-v3-safety-shell p {
  margin: 18px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.day-card-v3-copy p {
  max-width: 540px;
}

.day-card-v3-points,
.card-day-v3-hero-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.day-card-v3-point,
.card-day-v3-hero-list span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 13px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.72);
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.25;
}

.day-card-v3-actions,
.card-day-v3-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.day-card-v3-widget {
  min-width: 0;
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 26px;
  align-items: stretch;
  padding: 26px;
  border: 1px solid var(--border-default);
  border-radius: 32px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 14px 32px rgba(69, 55, 84, 0.045);
}

.day-card-v3-card-wrap {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  border: 1px solid var(--border-default);
  border-radius: 28px;
  background: linear-gradient(180deg, #FFFBFD 0%, #F8EFFB 100%);
}

.day-card-v3-card {
  position: relative;
  width: 100%;
  max-width: 188px;
  min-height: 282px;
  border: 1px solid rgba(237, 221, 231, 0.95);
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 239, 251, 0.95) 100%);
  box-shadow: 0 18px 28px rgba(69, 55, 84, 0.08);
  overflow: hidden;
}

.day-card-v3-card::before {
  content: "";
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(181, 123, 190, 0.24);
  border-radius: 22px;
}

.day-card-v3-card::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 50px;
  width: 72px;
  height: 1px;
  transform: translateX(-50%);
  background: rgba(181, 123, 190, 0.24);
}

.day-card-v3-card-code,
.day-card-v3-card-caption {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
  color: var(--text-secondary);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.day-card-v3-card-code {
  top: 30px;
}

.day-card-v3-card-caption {
  bottom: 28px;
}

.day-card-v3-card-moon {
  position: absolute;
  top: 78px;
  left: 50%;
  transform: translateX(-50%);
  color: var(--brand-primary);
  font-size: 42px;
  line-height: 1;
}

.day-card-v3-card-line {
  position: absolute;
  top: 142px;
  left: 50%;
  width: 54px;
  height: 1px;
  transform: translateX(-50%);
  background: rgba(181, 123, 190, 0.24);
}

.day-card-v3-card-title {
  position: absolute;
  left: 20px;
  right: 20px;
  top: 166px;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.25;
  text-align: center;
}

.day-card-v3-message {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.day-card-v3-label {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 12px;
  line-height: 1;
}

.day-card-v3-message h2,
.day-card-v3-message h3 {
  margin: 14px 0 0;
  color: var(--text-primary);
  font-size: clamp(28px, 3.1vw, 42px);
  line-height: 1.12;
  letter-spacing: -0.052em;
}

.day-card-v3-message p {
  max-width: 440px;
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.65;
}

.day-card-v3-message blockquote {
  width: 100%;
  margin: 18px 0 0;
  padding: 18px 18px 18px 20px;
  border: 1px solid var(--border-default);
  border-left: 4px solid var(--brand-secondary);
  border-radius: 22px;
  background: #FFFFFF;
  color: var(--text-primary);
  font-size: 15px;
  line-height: 1.72;
  overflow-wrap: anywhere;
}

.day-card-v3-question {
  width: 100%;
  margin-top: 12px;
  padding: 15px 16px;
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(248, 239, 251, 0.58);
}

.day-card-v3-question span {
  display: block;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.2;
}

.day-card-v3-question p {
  max-width: none;
  margin-top: 6px;
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.55;
}

.day-card-v3-footer {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 18px;
}

.day-card-v3-footer small {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.25;
}

.card-day-v3-hero {
  padding-top: 48px;
}

.card-day-v3-hero-shell {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(420px, 1.18fr);
  gap: 34px;
  align-items: center;
  padding: 52px;
}

.card-day-v3-hero-copy h1 {
  max-width: 620px;
  margin: 22px 0 0;
  font-size: clamp(42px, 5.2vw, 68px);
  line-height: 1.02;
}

.card-day-v3-hero-copy p {
  max-width: 590px;
  font-size: 16px;
}

.day-card-v3-widget-page {
  grid-template-columns: 230px minmax(0, 1fr);
  padding: 30px;
}

.day-card-v3-widget-page .day-card-v3-card {
  max-width: 206px;
  min-height: 318px;
}

.day-card-v3-widget-page .day-card-v3-message blockquote {
  font-size: 16px;
}

.card-day-v3-steps-grid,
.card-day-v3-formats-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.card-day-v3-mini-card,
.card-day-v3-format-card {
  min-width: 0;
  min-height: 100%;
  padding: 26px;
  border: 1px solid var(--border-default);
  border-radius: 28px;
  background: #FFFFFF;
  overflow: hidden;
}

.card-day-v3-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 16px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 12px;
}

.card-day-v3-mini-card h3,
.card-day-v3-format-card h3 {
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.25;
  letter-spacing: -0.035em;
}

.card-day-v3-mini-card p,
.card-day-v3-format-card p {
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.65;
}

.card-day-v3-format-shell {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  gap: 28px;
  align-items: stretch;
  padding: 34px;
}

.card-day-v3-format-copy h2,
.card-day-v3-safety-shell h2 {
  margin: 18px 0 0;
  font-size: clamp(30px, 3.2vw, 44px);
  line-height: 1.12;
}

.card-day-v3-format-card.is-featured {
  background: linear-gradient(180deg, #FFFFFF 0%, #FFF7FA 100%);
}

.card-day-v3-safety-shell {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 28px;
  align-items: start;
  padding: 34px;
}

.card-day-v3-safety-list {
  display: grid;
  gap: 12px;
}

.card-day-v3-safety-list div {
  min-width: 0;
  padding: 15px 16px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.55;
}

@media (max-width: 1260px) {
  .day-card-v3-shell,
  .card-day-v3-hero-shell,
  .card-day-v3-format-shell,
  .card-day-v3-safety-shell {
    grid-template-columns: 1fr;
  }

  .card-day-v3-hero-shell {
    padding: 42px;
  }
}

@media (max-width: 980px) {
  .day-card-v3-widget,
  .day-card-v3-widget-page {
    grid-template-columns: 1fr;
  }

  .day-card-v3-card-wrap {
    justify-content: flex-start;
  }

  .day-card-v3-card {
    max-width: 190px;
  }

  .card-day-v3-steps-grid,
  .card-day-v3-formats-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .day-card-v3-shell,
  .day-card-v3-widget,
  .card-day-v3-hero-shell,
  .card-day-v3-format-shell,
  .card-day-v3-safety-shell {
    padding: 22px;
    border-radius: 28px;
  }

  .day-card-v3-copy {
    padding: 0;
  }

  .day-card-v3-copy h2 {
    font-size: 30px;
    line-height: 1.1;
  }

  .card-day-v3-hero-copy h1 {
    font-size: 34px;
    line-height: 1.08;
  }

  .day-card-v3-message h2,
  .day-card-v3-message h3,
  .card-day-v3-format-copy h2,
  .card-day-v3-safety-shell h2 {
    font-size: 28px;
  }

  .day-card-v3-card-wrap {
    justify-content: center;
    padding: 14px;
  }

  .day-card-v3-card,
  .day-card-v3-widget-page .day-card-v3-card {
    max-width: 180px;
    min-height: 270px;
  }

  .day-card-v3-actions .button,
  .card-day-v3-hero-actions .button,
  .day-card-v3-footer .button,
  .cta-actions .button {
    width: 100%;
  }

  .day-card-v3-footer {
    align-items: stretch;
  }
}


/* =========================================================
   INDEX — final homepage pass
   Scoped to index-only blocks. No glow, no global form/header rebuild.
   ========================================================= */

.hero-section .hero-actions {
  margin-top: 34px !important;
}

.hero-section .hero-card {
  min-height: 0 !important;
}

.hero-preview-final {
  min-height: 0 !important;
  border: 1px solid var(--border-default) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(255, 247, 250, 0.74) 100%) !important;
  box-shadow: 0 16px 36px rgba(69, 55, 84, 0.06) !important;
}

.hero-preview-final > h2 {
  max-width: 460px;
  margin-top: 14px !important;
}

.hero-preview-final > p {
  max-width: 480px !important;
  margin-top: 10px !important;
}

.home-route-grid {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.home-route-card {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  grid-template-areas:
    "number badge"
    "number title"
    "number text";
  gap: 8px 14px;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.home-route-card:hover {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.34);
  box-shadow: 0 12px 26px rgba(69, 55, 84, 0.06);
}

.home-route-number {
  grid-area: number;
  width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid var(--border-default);
  background: var(--bg-primary);
  color: var(--brand-primary);
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
}

.home-route-card .badge {
  grid-area: badge;
  width: fit-content;
  min-height: 28px;
  padding: 6px 10px;
  font-size: 11px;
}

.home-route-card strong {
  grid-area: title;
  min-width: 0;
  color: var(--text-primary);
  font-size: 15px;
  line-height: 1.35;
}

.home-route-card small {
  grid-area: text;
  min-width: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.home-pulse-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: rgba(248, 239, 251, 0.72);
}

.home-pulse-icon {
  width: 58px;
  height: 58px;
  display: inline-grid;
  place-items: center;
  border-radius: 20px;
  border: 1px solid var(--border-default);
  background: #fff;
  color: var(--brand-primary);
  font-size: 28px;
}

.home-pulse-copy {
  min-width: 0;
}

.home-pulse-copy h3 {
  margin: 10px 0 0;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1.35;
}

.home-pulse-copy p {
  margin: 8px 0 0 !important;
  max-width: 100% !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.home-pulse-copy .text-link {
  margin-top: 10px;
}

.hero-preview-final .preview-metrics {
  margin-top: 0;
}

.index-flow-section .section-head {
  max-width: 780px;
}

.index-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  min-width: 0;
}

.index-flow-card {
  min-width: 0;
  min-height: 260px;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 30px rgba(69, 55, 84, 0.04);
}

.index-flow-number {
  width: 52px;
  height: 52px;
  display: inline-grid;
  place-items: center;
  border-radius: 18px;
  border: 1px solid var(--border-default);
  background: var(--bg-primary);
  color: var(--brand-primary);
  font-weight: 700;
}

.index-flow-card h3 {
  margin: 24px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.index-flow-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.index-safety-card {
  margin-top: 24px;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 247, 250, 0.78);
}

.index-safety-card h3 {
  margin: 12px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.35;
}

.index-safety-card p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

@media (max-width: 1180px) {
  .hero-preview-final {
    gap: 14px !important;
  }

  .index-flow-grid {
    grid-template-columns: 1fr;
  }

  .index-flow-card {
    min-height: 0;
  }
}

@media (max-width: 900px) {
  .home-route-card {
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .home-route-number {
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }

  .index-safety-card {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .home-route-card {
    grid-template-columns: 1fr;
    grid-template-areas:
      "number"
      "badge"
      "title"
      "text";
  }

  .home-pulse-card {
    grid-template-columns: 1fr;
  }

  .home-pulse-icon {
    width: 52px;
    height: 52px;
  }

  .index-flow-card,
  .index-safety-card {
    padding: 20px;
    border-radius: 22px;
  }

  .index-flow-card h3,
  .index-safety-card h3 {
    font-size: 20px;
  }
}


/* Required trust-chip lock */
.trust-chip {
  height: 36px;
  margin-top: 20px;
  padding: 0 14px;
}

/* =========================================================
   TARGETED FINAL FIXES — 2026-04-19
   Scope: index hero/card-day, card-day page, specialists list,
   specialist application, questions overflow, sticky header.
   No request form / request.css / custom calendar overrides here.
   ========================================================= */

/* Header: sticky without an extra colored strip around the rounded header card */
.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  padding: 8px 8px 0 !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.site-header .header-shell,
.site-header > .container,
.site-header .container {
  background: var(--surface-white) !important;
  box-shadow: none !important;
}

/* Global safe button containment. Keeps labels inside pills without changing forms. */
.button {
  max-width: 100%;
  text-align: center;
  white-space: nowrap;
}

/* Main hero right preview: restore the finished card layout */
.hero-preview {
  min-width: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  padding: 24px !important;
  box-shadow: none !important;
}

.hero-preview .preview-stack {
  display: grid !important;
  gap: 12px !important;
  margin-top: 0 !important;
}

.hero-preview .mini-card {
  min-height: 0 !important;
  overflow: hidden !important;
}

.hero-preview .mini-card-inner {
  padding: 18px !important;
}

.hero-preview-bottom {
  margin-top: auto !important;
  display: grid !important;
  gap: 14px !important;
  min-width: 0 !important;
}

.preview-metrics {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0 !important;
}

.preview-metric {
  min-width: 0 !important;
  min-height: 86px !important;
  padding: 12px 10px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 20px !important;
  background: var(--bg-primary) !important;
  text-align: center !important;
}

.preview-metric strong {
  color: var(--text-primary) !important;
  font-size: 28px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
}

.preview-metric span {
  margin-top: 8px !important;
  color: var(--text-secondary) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

.preview-next-step {
  min-width: 0 !important;
  padding: 18px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 22px !important;
  background: rgba(255, 247, 250, 0.72) !important;
}

.preview-next-step h3 {
  margin: 12px 0 0 !important;
  color: var(--text-primary) !important;
  font-size: 20px !important;
  line-height: 1.35 !important;
}

.preview-next-step p {
  margin: 8px 0 0 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

.preview-next-link {
  margin-top: 10px !important;
  padding-top: 0 !important;
  display: inline-flex !important;
}

/* Index card-day section: keep old good card, prevent overflow */
.card-day-grid {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr) !important;
  gap: 24px !important;
  align-items: stretch !important;
}

.card-day-grid > * {
  min-width: 0 !important;
}

.card-day-card {
  width: 100% !important;
  flex: initial !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 28px !important;
  display: grid !important;
  grid-template-columns: 200px minmax(0, 1fr) !important;
  gap: 26px !important;
  overflow: hidden !important;
}

.card-day-card .card-visual {
  min-width: 0 !important;
}

.card-day-card .daily-card-shape {
  width: 150px !important;
  height: 205px !important;
}

.card-day-content {
  min-width: 0 !important;
}

.card-day-content h3 {
  font-size: 28px !important;
  line-height: 1.18 !important;
  overflow-wrap: normal !important;
}

.card-day-content p,
.card-day-content blockquote,
.card-day-content .note-box {
  overflow-wrap: anywhere !important;
}

.card-day-content blockquote {
  font-size: 16px !important;
  line-height: 1.55 !important;
}

.card-day-footer {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
}

.card-day-footer .button {
  min-width: 165px !important;
}

.side-panel {
  width: 100% !important;
  flex: initial !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 28px !important;
  overflow: hidden !important;
}

.side-panel h3 {
  font-size: 26px !important;
  line-height: 1.25 !important;
}

/* Standalone card-day page: controlled typography and stable panel */
.card-day-page .card-day-hero-card {
  display: grid !important;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr) !important;
  gap: 56px !important;
  align-items: center !important;
  min-height: 0 !important;
  padding: 52px !important;
  overflow: hidden !important;
}

.card-day-page .page-hero-copy,
.card-day-page .card-day-panel {
  min-width: 0 !important;
}

.card-day-page .page-hero-copy h1 {
  max-width: 620px !important;
  margin-top: 24px !important;
  font-size: clamp(42px, 4.2vw, 58px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.055em !important;
}

.card-day-page .page-hero-copy p {
  max-width: 610px !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}

.card-day-page .card-day-panel {
  padding: 32px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: var(--radius-md) !important;
  background: rgba(255, 255, 255, 0.88) !important;
  overflow: hidden !important;
}

.card-day-page .daily-card-layout {
  display: grid !important;
  grid-template-columns: 185px minmax(0, 1fr) !important;
  gap: 28px !important;
  align-items: center !important;
  margin-top: 24px !important;
}

.card-day-page .daily-card-visual {
  width: 185px !important;
  min-width: 0 !important;
}

.card-day-page .daily-card-face {
  width: 170px !important;
  height: 220px !important;
  border-radius: 24px !important;
}

.card-day-page .daily-card-copy {
  min-width: 0 !important;
}

.card-day-page .daily-card-copy h2 {
  max-width: 360px !important;
  margin: 8px 0 0 !important;
  font-size: clamp(38px, 3.8vw, 52px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.055em !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.card-day-page .daily-card-copy p {
  max-width: 360px !important;
  margin-top: 16px !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
}

.card-day-page .card-day-panel blockquote,
.card-day-page .daily-reflection-box {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

.card-day-page .card-day-format-options {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.card-day-page .card-day-format-options .format-option {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 26px !important;
  overflow: hidden !important;
}

.card-day-page .card-day-format-options .format-option h3 {
  font-size: 28px !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

.card-day-page .card-day-format-options .format-option p {
  font-size: 15px !important;
  line-height: 1.65 !important;
  overflow-wrap: anywhere !important;
}

/* Questions: similar-question button must never leave the answer card */
.question-full-card,
.question-answer,
.question-main {
  min-width: 0 !important;
  overflow: hidden !important;
}

.question-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.question-actions .text-link {
  margin-top: 0 !important;
  padding-top: 0 !important;
  flex: 1 1 150px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
}

.question-actions .button {
  flex: 1 1 230px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 44px !important;
  padding: 11px 18px !important;
  white-space: normal !important;
  line-height: 1.35 !important;
}

/* Specialists list: dynamic renderer layout restoration */
.specialists-page .specialists-list-section .container {
  min-width: 0 !important;
}

.specialists-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin: 28px 0 26px !important;
}

.specialists-filter-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  min-width: 0 !important;
}

.specialists-filter-button {
  min-height: 38px !important;
  cursor: pointer !important;
}

.specialists-count {
  color: var(--text-secondary) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.specialists-dynamic-list {
  display: grid !important;
  gap: 36px !important;
}

.specialists-direction-section {
  min-width: 0 !important;
}

.specialists-direction-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-bottom: 18px !important;
}

.specialists-direction-head > div {
  min-width: 0 !important;
}

.specialists-direction-head h3 {
  margin: 14px 0 0 !important;
  color: var(--text-primary) !important;
  font-size: 28px !important;
  line-height: 1.25 !important;
  letter-spacing: -0.03em !important;
}

.specialists-direction-head p {
  max-width: 820px !important;
  margin: 10px 0 0 !important;
  color: var(--text-secondary) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
}

.specialists-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
}

.specialists-grid .specialist-card {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 24px !important;
  overflow: hidden !important;
}

.specialists-grid .specialist-top {
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: 76px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: start !important;
}

.specialists-grid .specialist-list-avatar,
.specialists-grid .avatar-circle {
  width: 72px !important;
  height: 72px !important;
  display: grid !important;
  place-items: center !important;
  color: var(--text-secondary) !important;
  font-size: 15px !important;
  line-height: 1 !important;
}

.specialists-grid .specialist-top-content,
.specialists-grid .specialist-title-wrap {
  min-width: 0 !important;
}

.specialists-grid .specialist-top h3 {
  margin: 0 !important;
  font-size: 22px !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
}

.specialists-grid .specialist-role {
  margin-top: 6px !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

.specialists-grid .specialist-status-row {
  min-height: 0 !important;
  margin-top: 12px !important;
}

.specialists-grid .tag-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 18px !important;
}

.specialists-grid .badge {
  max-width: 100% !important;
  white-space: normal !important;
}

.specialists-grid .specialist-description {
  min-height: 96px !important;
  margin-top: 18px !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  overflow-wrap: anywhere !important;
}

.specialists-grid .meta-list {
  gap: 8px !important;
}

.specialists-grid .meta-list div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 16px !important;
}

.specialists-grid .specialist-footer {
  margin-top: auto !important;
  padding-top: 24px !important;
}

/* Specialist application: finished form layout */
.specialist-application-page .application-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 420px) !important;
  gap: 28px !important;
  align-items: start !important;
}

.application-form-card,
.application-side-card {
  min-width: 0 !important;
  border: 1px solid var(--border-default) !important;
  border-radius: var(--radius-lg) !important;
  background: rgba(255, 255, 255, 0.88) !important;
}

.application-form-card {
  padding: 32px !important;
}

.application-form-head h2,
.application-side-card h2 {
  margin: 16px 0 0 !important;
  color: var(--text-primary) !important;
  font-size: clamp(30px, 3vw, 42px) !important;
  line-height: 1.16 !important;
  letter-spacing: -0.045em !important;
}

.application-form-head p,
.application-side-card > p {
  margin: 14px 0 0 !important;
  color: var(--text-secondary) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}

.application-form-section {
  margin-top: 28px !important;
  padding-top: 26px !important;
  border-top: 1px solid var(--border-default) !important;
}

.application-form-section h3 {
  margin: 0 0 18px !important;
  color: var(--text-primary) !important;
  font-size: 20px !important;
  line-height: 1.35 !important;
}

.application-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px 20px !important;
}

.application-form-card .form-field,
.application-form-card .custom-select {
  min-width: 0 !important;
}

.application-form-card .form-field input:not([type="hidden"]),
.application-form-card .form-field textarea,
.application-form-card .form-field select,
.application-form-card .custom-select__button {
  width: 100% !important;
  min-height: 58px !important;
  border-radius: 20px !important;
}

.application-form-card .form-field textarea {
  min-height: 150px !important;
}

.application-choice-group {
  min-width: 0 !important;
}

.application-choice-title {
  display: block !important;
  margin-bottom: 12px !important;
  color: var(--text-primary) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

.application-choice-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.soft-choice-card,
.application-consent-card {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 18px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 20px !important;
  background: rgba(255, 247, 250, 0.62) !important;
  color: var(--text-primary) !important;
}

.application-consent-card {
  margin-top: 12px !important;
  align-items: flex-start !important;
  color: var(--text-secondary) !important;
  line-height: 1.6 !important;
}

.soft-choice-card input,
.application-consent-card input {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  margin: 0 !important;
  border: 1.5px solid rgba(154, 139, 162, 0.55) !important;
  border-radius: 7px !important;
  background: #fff !important;
}

.soft-choice-card:has(input:checked),
.application-consent-card:has(input:checked) {
  border-color: rgba(174, 123, 196, 0.46) !important;
  background: rgba(248, 239, 251, 0.88) !important;
}

.soft-choice-card input:checked,
.application-consent-card input:checked {
  border-color: var(--brand-primary) !important;
  background-color: var(--brand-primary) !important;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='11' viewBox='0 0 14 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.4 5.7L5.2 9.1L12.6 1.5' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 13px 10px !important;
}

.application-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 28px !important;
}

.application-side-card {
  position: sticky !important;
  top: 160px !important;
  padding: 30px !important;
}

.application-side-flow {
  display: grid !important;
  gap: 12px !important;
  margin-top: 22px !important;
}

.application-step-card,
.application-note-card {
  display: grid !important;
  gap: 8px !important;
  padding: 16px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 20px !important;
  background: rgba(255, 247, 250, 0.72) !important;
}

.application-step-card span,
.application-note-card span {
  color: var(--text-secondary) !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

.application-step-card strong,
.application-note-card strong {
  color: var(--text-primary) !important;
  font-size: 17px !important;
  line-height: 1.35 !important;
}

.application-step-card p,
.application-note-card p {
  margin: 0 !important;
  color: var(--text-secondary) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

/* Responsive containment for targeted pages */
@media (max-width: 1260px) {
  .card-day-grid,
  .card-day-page .card-day-hero-card,
  .specialist-application-page .application-layout {
    grid-template-columns: 1fr !important;
  }

  .application-side-card {
    position: static !important;
  }
}

@media (max-width: 980px) {
  .preview-metrics,
  .specialists-grid,
  .application-form-grid,
  .application-choice-grid,
  .card-day-page .card-day-format-options {
    grid-template-columns: 1fr !important;
  }

  .card-day-card,
  .card-day-page .daily-card-layout {
    grid-template-columns: 1fr !important;
  }

  .card-day-page .daily-card-visual {
    width: 100% !important;
    justify-items: start !important;
  }
}

@media (max-width: 720px) {
  .card-day-page .card-day-hero-card,
  .application-form-card,
  .application-side-card {
    padding: 24px !important;
  }

  .card-day-page .page-hero-copy h1 {
    font-size: 36px !important;
  }

  .question-actions .button,
  .card-day-footer .button,
  .application-actions .button {
    width: 100% !important;
  }
}


/* =========================================================
   INDEX — final homepage pass
   Scoped to index-only blocks. No glow, no global form/header rebuild.
   ========================================================= */

.hero-section .hero-actions {
  margin-top: 34px !important;
}

.hero-section .hero-card {
  min-height: 0 !important;
}

.hero-preview-final {
  min-height: 0 !important;
  border: 1px solid var(--border-default) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(255, 247, 250, 0.74) 100%) !important;
  box-shadow: 0 16px 36px rgba(69, 55, 84, 0.06) !important;
}

.hero-preview-final > h2 {
  max-width: 460px;
  margin-top: 14px !important;
}

.hero-preview-final > p {
  max-width: 480px !important;
  margin-top: 10px !important;
}

.home-route-grid {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.home-route-card {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  grid-template-areas:
    "number badge"
    "number title"
    "number text";
  gap: 8px 14px;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.home-route-card:hover {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.34);
  box-shadow: 0 12px 26px rgba(69, 55, 84, 0.06);
}

.home-route-number {
  grid-area: number;
  width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid var(--border-default);
  background: var(--bg-primary);
  color: var(--brand-primary);
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
}

.home-route-card .badge {
  grid-area: badge;
  width: fit-content;
  min-height: 28px;
  padding: 6px 10px;
  font-size: 11px;
}

.home-route-card strong {
  grid-area: title;
  min-width: 0;
  color: var(--text-primary);
  font-size: 15px;
  line-height: 1.35;
}

.home-route-card small {
  grid-area: text;
  min-width: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.home-pulse-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: rgba(248, 239, 251, 0.72);
}

.home-pulse-icon {
  width: 58px;
  height: 58px;
  display: inline-grid;
  place-items: center;
  border-radius: 20px;
  border: 1px solid var(--border-default);
  background: #fff;
  color: var(--brand-primary);
  font-size: 28px;
}

.home-pulse-copy {
  min-width: 0;
}

.home-pulse-copy h3 {
  margin: 10px 0 0;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1.35;
}

.home-pulse-copy p {
  margin: 8px 0 0 !important;
  max-width: 100% !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.home-pulse-copy .text-link {
  margin-top: 10px;
}

.hero-preview-final .preview-metrics {
  margin-top: 0;
}

.index-flow-section .section-head {
  max-width: 780px;
}

.index-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  min-width: 0;
}

.index-flow-card {
  min-width: 0;
  min-height: 260px;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 30px rgba(69, 55, 84, 0.04);
}

.index-flow-number {
  width: 52px;
  height: 52px;
  display: inline-grid;
  place-items: center;
  border-radius: 18px;
  border: 1px solid var(--border-default);
  background: var(--bg-primary);
  color: var(--brand-primary);
  font-weight: 700;
}

.index-flow-card h3 {
  margin: 24px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.index-flow-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.index-safety-card {
  margin-top: 24px;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 247, 250, 0.78);
}

.index-safety-card h3 {
  margin: 12px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.35;
}

.index-safety-card p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

@media (max-width: 1180px) {
  .hero-preview-final {
    gap: 14px !important;
  }

  .index-flow-grid {
    grid-template-columns: 1fr;
  }

  .index-flow-card {
    min-height: 0;
  }
}

@media (max-width: 900px) {
  .home-route-card {
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .home-route-number {
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }

  .index-safety-card {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .home-route-card {
    grid-template-columns: 1fr;
    grid-template-areas:
      "number"
      "badge"
      "title"
      "text";
  }

  .home-pulse-card {
    grid-template-columns: 1fr;
  }

  .home-pulse-icon {
    width: 52px;
    height: 52px;
  }

  .index-flow-card,
  .index-safety-card {
    padding: 20px;
    border-radius: 22px;
  }

  .index-flow-card h3,
  .index-safety-card h3 {
    font-size: 20px;
  }
}


/* Required trust-chip lock */
.trust-chip {
  height: 36px !important;
  margin-top: 20px !important;
  padding: 0 14px !important;
}


/* =========================================================
   Dynamic Rider-Waite daily card — shared for index + card-day
   Works only inside [data-daily-card], does not touch specialists/forms.
   ========================================================= */

.day-card-dynamic {
  grid-template-columns: minmax(190px, 230px) minmax(0, 1fr);
}

.day-card-dynamic .day-card-waite-wrap {
  padding: 16px;
  background: linear-gradient(180deg, #FFFFFF 0%, #FBF4F8 100%);
}

.day-card-dynamic .day-card-waite-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 216px;
  min-height: auto;
  padding: 12px;
  border-radius: 26px;
  background: #FFFFFF;
}

.day-card-dynamic .day-card-waite-shell::before,
.day-card-dynamic .day-card-waite-shell::after {
  display: none;
}

.day-card-waite-image-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 825 / 1429;
  overflow: hidden;
  border: 1px solid rgba(237, 221, 231, 0.96);
  border-radius: 20px;
  background: linear-gradient(180deg, #FFFBFD 0%, #F8EFFB 100%);
}

.day-card-waite-image {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.day-card-waite-image.is-loading {
  opacity: 0;
}

.day-card-waite-image.is-hidden {
  display: none;
}

.day-card-waite-fallback {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  color: var(--brand-primary);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 239, 251, 0.95) 100%);
}

.day-card-waite-fallback span {
  display: grid;
  place-items: center;
  width: 78px;
  height: 78px;
  border: 1px solid rgba(181, 123, 190, 0.28);
  border-radius: 999px;
  font-size: 38px;
  line-height: 1;
}

.day-card-waite-card-meta {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 0 2px 2px;
}

.day-card-dynamic .day-card-v3-card-code,
.day-card-dynamic .day-card-v3-card-title,
.day-card-dynamic .day-card-v3-card-caption {
  position: static;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  width: auto;
  text-align: left;
}

.day-card-dynamic .day-card-v3-card-code,
.day-card-dynamic .day-card-v3-card-caption {
  color: var(--text-secondary);
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.day-card-dynamic .day-card-v3-card-title {
  color: var(--text-primary);
  font-size: 17px;
  line-height: 1.22;
  letter-spacing: -0.035em;
  overflow-wrap: anywhere;
}

.day-card-waite-message [data-daily-card-lead] {
  color: var(--text-secondary);
  font-weight: 500;
}

.day-card-waite-message blockquote {
  min-height: 116px;
}

.day-card-v3-widget-page.day-card-dynamic {
  grid-template-columns: minmax(210px, 250px) minmax(0, 1fr);
}

.day-card-v3-widget-page.day-card-dynamic .day-card-waite-shell {
  max-width: 238px;
}

@media (max-width: 980px) {
  .day-card-dynamic,
  .day-card-v3-widget-page.day-card-dynamic {
    grid-template-columns: 1fr;
  }

  .day-card-dynamic .day-card-waite-wrap {
    justify-content: center;
  }

  .day-card-dynamic .day-card-waite-shell,
  .day-card-v3-widget-page.day-card-dynamic .day-card-waite-shell {
    max-width: 210px;
  }
}

@media (max-width: 720px) {
  .day-card-dynamic .day-card-waite-wrap {
    padding: 14px;
  }

  .day-card-dynamic .day-card-waite-shell,
  .day-card-v3-widget-page.day-card-dynamic .day-card-waite-shell {
    max-width: 188px;
    padding: 10px;
    border-radius: 24px;
  }

  .day-card-waite-image-frame {
    border-radius: 18px;
  }

  .day-card-dynamic .day-card-v3-card-title {
    font-size: 16px;
  }

  .day-card-waite-message blockquote {
    min-height: 0;
  }
}

/* =========================================================
   SITE-WIDE STABILIZATION PASS — 2026-04-20
   Scope: safe containment, responsive header/footer, cards/forms.
   No request.css logic, no JS, no backend changes.
   ========================================================= */

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.page-shell,
main,
section,
.container,
.hero-card,
.page-hero-card,
.info-card,
.cta-card,
.footer-card,
.question-full-card,
.specialist-card,
.format-option,
.support-form-card,
.support-ticket-card,
.application-form-card,
.application-side-card {
  min-width: 0;
}

h1,
h2,
h3,
h4,
p,
li,
blockquote,
.text-link,
.footer-links a,
.main-nav a,
.utility-links a,
.utility-actions a {
  overflow-wrap: anywhere;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

input,
select,
textarea {
  max-width: 100%;
}

/* Buttons should contain long UA/RU labels instead of pushing cards wider. */
.button {
  max-width: 100% !important;
  min-width: 0;
  min-height: 44px;
  height: auto;
  padding-top: 10px;
  padding-bottom: 10px;
  white-space: normal !important;
  text-align: center;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.button-lg {
  min-height: 48px;
}

/* Badges may wrap, but trust-chip stays locked at the end of this block. */
.badge {
  max-width: 100%;
  min-width: 0;
  min-height: 32px;
  height: auto;
  padding-top: 8px;
  padding-bottom: 8px;
  white-space: normal;
  text-align: center;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

/* Header: keep the existing visual, but prevent mobile/tablet overflow. */
.site-header {
  max-width: 100%;
}

.site-header .header-shell,
.site-header > .container,
.site-header .container {
  max-width: 1408px !important;
}

.utility-inner {
  min-width: 0 !important;
}

.utility-links,
.utility-actions {
  min-width: 0;
  flex-wrap: wrap;
}

.main-inner {
  min-width: 0 !important;
  grid-template-columns: minmax(190px, 260px) minmax(0, 1fr) minmax(148px, 172px) !important;
  column-gap: clamp(16px, 3vw, 40px) !important;
}

.brand,
.brand img {
  max-width: 100%;
}

.main-nav {
  min-width: 0;
  gap: clamp(12px, 2vw, 30px) !important;
  flex-wrap: wrap;
}

.main-nav a {
  min-width: 0;
}

/* Generic hero grid: previous fixed columns could exceed the 1200px container. */
.hero-grid {
  grid-template-columns: minmax(0, 560px) minmax(0, 544px) !important;
  gap: 24px !important;
}

.page-hero-card {
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr) !important;
  gap: clamp(24px, 4vw, 48px) !important;
  min-height: 0 !important;
  overflow: hidden;
}

.questions-hero-card {
  grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr) !important;
}

.page-hero-copy,
.page-hero-panel,
.hero-copy,
.hero-preview {
  min-width: 0;
}

.page-hero-copy h1,
.hero-copy h1,
.section-head h2,
.cta-copy h2 {
  overflow-wrap: normal;
  word-break: normal;
}

.page-hero-actions,
.hero-actions,
.cta-actions,
.section-footer,
.direction-actions,
.support-hero-actions,
.support-form-actions,
.application-actions,
.question-actions {
  min-width: 0;
  flex-wrap: wrap;
}

/* Cards and grids: keep text inside the surface, not outside the viewport. */
.cards-grid,
.cards-grid-3,
.format-options,
.card-day-v3-steps-grid,
.card-day-v3-formats-grid,
.support-topic-grid,
.support-choice-grid,
.application-form-grid,
.application-choice-grid,
.specialists-grid,
.questions-stats,
.preview-metrics {
  min-width: 0;
}

.info-card,
.format-option,
.card-day-v3-mini-card,
.card-day-v3-format-card,
.question-main,
.question-answer,
.support-topic-card,
.support-faq-card,
.application-step-card,
.application-note-card {
  overflow: hidden;
}

.info-card h3,
.format-option h3,
.card-day-v3-mini-card h3,
.card-day-v3-format-card h3,
.question-main h3,
.support-topic-card h3,
.support-faq-card h3 {
  overflow-wrap: anywhere;
}

/* CTA and footer: stable responsive layout for all secondary pages. */
.cta-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(220px, max-content) !important;
  gap: 24px !important;
  align-items: center !important;
}

.cta-copy {
  min-width: 0;
}

.cta-actions {
  min-width: 0 !important;
  width: min(100%, 260px);
  justify-self: end;
}

.cta-actions .button {
  width: 100%;
}

.footer-main {
  display: grid !important;
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr) !important;
  gap: clamp(28px, 4vw, 56px) !important;
  align-items: start !important;
}

.footer-brand {
  min-width: 0;
}

.footer-links {
  min-width: 0;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(18px, 3vw, 40px) !important;
  align-items: start !important;
}

.footer-links div {
  min-width: 0;
}

.footer-bottom {
  gap: 16px;
  flex-wrap: wrap;
}

/* Specific pages: small containment fixes after localization. */
.question-actions {
  align-items: center !important;
}

.question-actions .text-link,
.question-actions .button {
  min-width: 0 !important;
}

.specialists-direction-head,
.question-card-top,
.answer-author {
  min-width: 0;
  flex-wrap: wrap;
}

.support-form-layout,
.support-faq-layout,
.support-hero-card,
.specialist-application-page .application-layout {
  min-width: 0;
}

.support-choice-card,
.support-consent-card,
.soft-choice-card,
.application-consent-card {
  min-width: 0;
  overflow-wrap: anywhere;
}

.custom-select,
.custom-select__button,
.custom-select__list {
  max-width: 100%;
  min-width: 0;
}

/* Tablet layout. */
@media (max-width: 1260px) {
  .hero-grid,
  .page-hero-card,
  .questions-hero-card,
  .support-hero-card,
  .support-form-layout,
  .support-faq-layout,
  .specialist-application-page .application-layout,
  .card-day-v3-hero-shell,
  .day-card-v3-shell,
  .card-day-v3-format-shell,
  .card-day-v3-safety-shell,
  .cta-card,
  .footer-main {
    grid-template-columns: 1fr !important;
  }

  .cta-actions {
    width: 100%;
    justify-self: stretch;
  }

  .footer-links {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Header tablet rebuild: grid instead of broken flex rules on a grid element. */
@media (max-width: 980px) {
  .site-header {
    padding: 6px 6px 0 !important;
  }

  .site-header .header-shell,
  .site-header > .container,
  .site-header .container {
    width: min(calc(100% - 12px), 1408px) !important;
    border-radius: 18px !important;
  }

  .utility-bar {
    height: auto !important;
    min-height: 44px !important;
  }

  .utility-inner {
    width: calc(100% - 24px) !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 8px 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    gap: 10px !important;
    align-items: center !important;
  }

  .utility-links {
    gap: 12px !important;
  }

  .account-chip {
    min-width: 0 !important;
    height: 36px !important;
  }

  .main-bar {
    height: auto !important;
  }

  .main-inner {
    width: calc(100% - 24px) !important;
    height: auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "brand cta"
      "nav nav" !important;
    row-gap: 10px !important;
    column-gap: 12px !important;
    padding: 10px 0 12px !important;
  }

  .brand {
    grid-area: brand;
    width: 180px !important;
    height: 54px !important;
    flex: 0 1 auto !important;
  }

  .brand img {
    width: 180px !important;
    height: 54px !important;
    object-fit: contain !important;
  }

  .header-cta {
    grid-area: cta;
    justify-self: end;
    width: auto !important;
    min-width: 132px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .main-nav {
    grid-area: nav;
    width: 100% !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .main-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    background: var(--bg-primary);
    font-size: 13px;
    line-height: 1.25;
    white-space: normal;
  }

  .cards-grid-3,
  .format-options,
  .card-day-v3-steps-grid,
  .card-day-v3-formats-grid,
  .support-topic-grid,
  .support-choice-grid,
  .questions-stats,
  .preview-metrics,
  .specialists-grid {
    grid-template-columns: 1fr !important;
  }

  .footer-links {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* Mobile layout: no horizontal scroll, no clipped buttons. */
@media (max-width: 720px) {
  .container,
  .site-header .container {
    width: min(calc(100% - 20px), var(--container)) !important;
  }

  .site-header {
    padding: 6px 4px 0 !important;
  }

  .utility-inner {
    width: calc(100% - 20px) !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    text-align: center !important;
  }

  .utility-links {
    width: 100%;
    justify-content: center;
  }

  .main-inner {
    width: calc(100% - 20px) !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "brand"
      "nav"
      "cta" !important;
    justify-items: center !important;
  }

  .brand {
    width: 170px !important;
    height: 50px !important;
    justify-content: center;
  }

  .brand img {
    width: 170px !important;
    height: 50px !important;
  }

  .main-nav {
    justify-content: center !important;
  }

  .header-cta {
    width: 100% !important;
    max-width: 240px !important;
    justify-self: center !important;
  }

  .hero-card,
  .page-hero-card,
  .support-hero-card,
  .support-form-card,
  .support-ticket-card,
  .support-faq-intro,
  .support-faq-card,
  .specialist-application-page .application-form-card,
  .specialist-application-page .application-side-card,
  .cta-card,
  .footer-card {
    padding: 22px !important;
    border-radius: 24px !important;
  }

  .page-hero-copy h1,
  .hero-copy h1 {
    font-size: clamp(30px, 11vw, 38px) !important;
    line-height: 1.12 !important;
  }

  .section-head h2,
  .cta-copy h2,
  .choose-format-copy h2 {
    font-size: clamp(26px, 9vw, 32px) !important;
    line-height: 1.16 !important;
  }

  .page-hero-actions .button,
  .hero-actions .button,
  .cta-actions .button,
  .section-footer .button,
  .direction-actions .button,
  .support-hero-actions .button,
  .support-form-actions .button,
  .application-actions .button,
  .question-actions .button {
    width: 100% !important;
  }

  .footer-links,
  .footer-bottom,
  .footer-bottom div {
    grid-template-columns: 1fr !important;
    align-items: flex-start !important;
  }

  .footer-bottom div {
    width: 100%;
    display: grid !important;
    gap: 10px !important;
  }

  .question-card-top,
  .question-actions,
  .specialists-direction-head,
  .section-footer,
  .direction-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .question-actions .text-link {
    text-align: center;
  }
}


/* =========================================================
   INDEX — final homepage pass
   Scoped to index-only blocks. No glow, no global form/header rebuild.
   ========================================================= */

.hero-section .hero-actions {
  margin-top: 34px !important;
}

.hero-section .hero-card {
  min-height: 0 !important;
}

.hero-preview-final {
  min-height: 0 !important;
  border: 1px solid var(--border-default) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86) 0%, rgba(255, 247, 250, 0.74) 100%) !important;
  box-shadow: 0 16px 36px rgba(69, 55, 84, 0.06) !important;
}

.hero-preview-final > h2 {
  max-width: 460px;
  margin-top: 14px !important;
}

.hero-preview-final > p {
  max-width: 480px !important;
  margin-top: 10px !important;
}

.home-route-grid {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.home-route-card {
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  grid-template-areas:
    "number badge"
    "number title"
    "number text";
  gap: 8px 14px;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.home-route-card:hover {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.34);
  box-shadow: 0 12px 26px rgba(69, 55, 84, 0.06);
}

.home-route-number {
  grid-area: number;
  width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid var(--border-default);
  background: var(--bg-primary);
  color: var(--brand-primary);
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
}

.home-route-card .badge {
  grid-area: badge;
  width: fit-content;
  min-height: 28px;
  padding: 6px 10px;
  font-size: 11px;
}

.home-route-card strong {
  grid-area: title;
  min-width: 0;
  color: var(--text-primary);
  font-size: 15px;
  line-height: 1.35;
}

.home-route-card small {
  grid-area: text;
  min-width: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.home-pulse-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: rgba(248, 239, 251, 0.72);
}

.home-pulse-icon {
  width: 58px;
  height: 58px;
  display: inline-grid;
  place-items: center;
  border-radius: 20px;
  border: 1px solid var(--border-default);
  background: #fff;
  color: var(--brand-primary);
  font-size: 28px;
}

.home-pulse-copy {
  min-width: 0;
}

.home-pulse-copy h3 {
  margin: 10px 0 0;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1.35;
}

.home-pulse-copy p {
  margin: 8px 0 0 !important;
  max-width: 100% !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.home-pulse-copy .text-link {
  margin-top: 10px;
}

.hero-preview-final .preview-metrics {
  margin-top: 0;
}

.index-flow-section .section-head {
  max-width: 780px;
}

.index-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  min-width: 0;
}

.index-flow-card {
  min-width: 0;
  min-height: 260px;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 30px rgba(69, 55, 84, 0.04);
}

.index-flow-number {
  width: 52px;
  height: 52px;
  display: inline-grid;
  place-items: center;
  border-radius: 18px;
  border: 1px solid var(--border-default);
  background: var(--bg-primary);
  color: var(--brand-primary);
  font-weight: 700;
}

.index-flow-card h3 {
  margin: 24px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.index-flow-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.index-safety-card {
  margin-top: 24px;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 247, 250, 0.78);
}

.index-safety-card h3 {
  margin: 12px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.35;
}

.index-safety-card p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

@media (max-width: 1180px) {
  .hero-preview-final {
    gap: 14px !important;
  }

  .index-flow-grid {
    grid-template-columns: 1fr;
  }

  .index-flow-card {
    min-height: 0;
  }
}

@media (max-width: 900px) {
  .home-route-card {
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .home-route-number {
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }

  .index-safety-card {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .home-route-card {
    grid-template-columns: 1fr;
    grid-template-areas:
      "number"
      "badge"
      "title"
      "text";
  }

  .home-pulse-card {
    grid-template-columns: 1fr;
  }

  .home-pulse-icon {
    width: 52px;
    height: 52px;
  }

  .index-flow-card,
  .index-safety-card {
    padding: 20px;
    border-radius: 22px;
  }

  .index-flow-card h3,
  .index-safety-card h3 {
    font-size: 20px;
  }
}


/* Required trust-chip lock */
.trust-chip {
  height: 36px !important;
  margin-top: 20px !important;
  padding: 0 14px !important;
}


/* =========================================================
   QUESTIONS FINAL PASS — public Q&A polish + safe filters
   ========================================================= */
.questions-topics-section {
  padding-top: 24px;
}

.questions-topic-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.questions-topic-card {
  min-width: 0;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 16px 38px rgba(69, 55, 84, 0.06);
}

.questions-topic-card h3 {
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 30px;
  letter-spacing: -0.03em;
  overflow-wrap: anywhere;
}

.questions-topic-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 26px;
}

.questions-topic-card .text-link {
  margin-top: auto;
  padding-top: 18px;
}

.questions-filter-row {
  align-items: center;
}

.questions-filter-row .question-filter-button {
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.questions-filter-row .question-filter-button:hover {
  transform: translateY(-1px);
}

.questions-filter-row .question-filter-button.is-active {
  border-color: rgba(181, 123, 190, 0.32);
  background: var(--section-color-soft);
  color: var(--section-color);
}

.questions-filter-count {
  margin: -12px 0 22px;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 22px;
}

.question-full-card.is-hidden {
  display: none !important;
}

.question-full-card {
  transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.question-full-card:hover {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.22);
  box-shadow: 0 18px 44px rgba(69, 55, 84, 0.07);
}

@media (max-width: 980px) {
  .questions-topic-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .questions-topics-section {
    padding-top: 8px;
  }

  .questions-topic-card {
    padding: 20px;
  }

  .questions-filter-row .question-filter-button {
    justify-content: center;
  }
}

/* =========================================================
   SUPPORT FINAL PASS — frontend form state + safer controls
   Scope only: support.html
========================================================= */
.support-form-card .form-field select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 48px !important;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='9' viewBox='0 0 14 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.4 1.6L7 7.2L12.6 1.6' stroke='%239A8BA2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 18px center !important;
  background-size: 14px 9px !important;
}

.support-form-card .form-field input:required,
.support-form-card .form-field textarea:required,
.support-consent-card input:required {
  scroll-margin-top: 180px;
}

.support-form-notice {
  margin-top: 20px;
  padding: 18px 20px;
  border: 1px solid rgba(34, 197, 94, 0.24);
  border-radius: 22px;
  background: var(--success-soft);
  color: var(--text-primary);
}

.support-form-notice strong {
  display: block;
  margin: 0 0 6px;
  font-size: 16px;
  line-height: 1.35;
}

.support-form-notice p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.65;
}

.support-form-notice[hidden] {
  display: none !important;
}

.support-page select::-ms-expand {
  display: none;
}

/* Required trust-chip lock */
.trust-chip {
  height: 36px !important;
  margin-top: 20px !important;
  padding: 0 14px !important;
}

/* =========================================================
   CABINET FINAL PASS — future user cabinet frontend shell
   Scope only: cabinet.html / .cabinet-v2-*
========================================================= */
.cabinet-v2-page { overflow: hidden; }
.cabinet-v2-hero-section { padding-top: 40px; }
.cabinet-v2-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  gap: 28px;
  align-items: stretch;
  padding: 36px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(248,238,244,.76));
  box-shadow: 0 24px 58px rgba(69,55,84,.08);
}
.cabinet-v2-hero-copy,
.cabinet-v2-profile-card,
.cabinet-v2-module-card,
.cabinet-v2-main-panel,
.cabinet-v2-side-panel,
.cabinet-v2-quick-card { min-width: 0; }
.cabinet-v2-hero-copy { display: flex; flex-direction: column; justify-content: center; }
.cabinet-v2-hero-copy h1 {
  max-width: 780px;
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.04;
  letter-spacing: -.06em;
  overflow-wrap: anywhere;
}
.cabinet-v2-hero-copy > p {
  max-width: 700px;
  margin: 22px 0 0;
  color: var(--text-secondary);
  font-size: 18px;
  line-height: 1.8;
}
.cabinet-v2-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.cabinet-v2-note {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr);
  gap: 12px;
  max-width: 680px;
  margin-top: 22px;
  padding: 16px 18px;
  border: 1px solid rgba(181,123,190,.18);
  border-radius: 22px;
  background: rgba(255,255,255,.72);
}
.cabinet-v2-note span {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 800;
}
.cabinet-v2-note p { margin: 0; color: var(--text-secondary); font-size: 14px; line-height: 1.65; }
.cabinet-v2-profile-card,
.cabinet-v2-main-panel,
.cabinet-v2-side-panel,
.cabinet-v2-module-card,
.cabinet-v2-quick-card {
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.92);
  box-shadow: 0 16px 38px rgba(69,55,84,.055);
}
.cabinet-v2-profile-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 22px;
  padding: 28px;
  border-radius: 30px;
}
.cabinet-v2-profile-top { display: grid; grid-template-columns: 70px minmax(0,1fr); gap: 16px; align-items: center; }
.cabinet-v2-avatar {
  width: 70px;
  height: 70px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 24px;
  background: linear-gradient(135deg, var(--brand-secondary), var(--section-color-soft));
  color: var(--section-color);
  font-weight: 800;
}
.cabinet-v2-profile-top h2 { margin: 10px 0 4px; color: var(--text-primary); font-size: 26px; line-height: 1.15; letter-spacing: -.04em; }
.cabinet-v2-profile-top p,
.cabinet-v2-progress span,
.cabinet-v2-mini-list p { margin: 0; color: var(--text-secondary); font-size: 14px; line-height: 1.55; }
.cabinet-v2-progress { padding: 18px; border-radius: 24px; background: var(--bg-primary); }
.cabinet-v2-progress > div { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.cabinet-v2-progress strong { color: var(--section-color); font-size: 15px; }
.cabinet-v2-progress i { display: block; height: 10px; overflow: hidden; border-radius: var(--radius-pill); background: var(--bg-secondary); }
.cabinet-v2-progress b { display: block; width: 78%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--brand-primary), var(--brand-secondary)); }
.cabinet-v2-mini-list { display: grid; gap: 10px; }
.cabinet-v2-mini-list p::before { content: ''; display: inline-flex; width: 9px; height: 9px; margin-right: 9px; border-radius: 50%; background: var(--brand-primary); }
.cabinet-v2-section-heading { max-width: 780px; }
.cabinet-v2-modules-grid,
.cabinet-v2-quick-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 30px; }
.cabinet-v2-module-card,
.cabinet-v2-quick-card { display: block; min-height: 100%; padding: 24px; border-radius: var(--radius-md); text-decoration: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.cabinet-v2-module-card:hover,
.cabinet-v2-quick-card:hover { transform: translateY(-2px); border-color: rgba(181,123,190,.24); box-shadow: 0 18px 44px rgba(69,55,84,.07); }
.cabinet-v2-module-card > span {
  display: inline-flex;
  width: 50px;
  height: 50px;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  border-radius: 18px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 15px;
  font-weight: 800;
}
.cabinet-v2-module-card h3,
.cabinet-v2-status-list h3,
.cabinet-v2-quick-card h3 { margin: 14px 0 0; color: var(--text-primary); font-size: 22px; line-height: 1.25; letter-spacing: -.035em; overflow-wrap: anywhere; }
.cabinet-v2-module-card p,
.cabinet-v2-status-list p,
.cabinet-v2-side-panel p,
.cabinet-v2-quick-card p { margin: 12px 0 0; color: var(--text-secondary); font-size: 15px; line-height: 1.7; }
.cabinet-v2-dashboard-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,.42fr); gap: 20px; align-items: stretch; }
.cabinet-v2-main-panel,
.cabinet-v2-side-panel { padding: 28px; border-radius: var(--radius-lg); }
.cabinet-v2-panel-head { display: flex; gap: 18px; align-items: flex-start; justify-content: space-between; margin-bottom: 22px; }
.cabinet-v2-panel-head h2,
.cabinet-v2-side-panel h2 { margin: 14px 0 0; color: var(--text-primary); font-size: clamp(28px, 3vw, 42px); line-height: 1.1; letter-spacing: -.055em; }
.cabinet-v2-status-list { display: grid; gap: 14px; }
.cabinet-v2-status-list article { display: grid; grid-template-columns: 14px minmax(0,1fr); gap: 14px; padding: 18px; border: 1px solid rgba(237,221,231,.88); border-radius: 24px; background: var(--bg-primary); }
.cabinet-v2-status-list i { width: 12px; min-height: 100%; border-radius: var(--radius-pill); background: var(--brand-primary); }
.cabinet-v2-status-list article:nth-child(1) i { background: var(--warning); }
.cabinet-v2-status-list article:nth-child(2) i { background: var(--success); }
.cabinet-v2-status-list span,
.cabinet-v2-quick-card > span { display: inline-flex; color: var(--section-color); font-size: 13px; font-weight: 700; }
.cabinet-v2-side-panel { background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,239,251,.78)); }
.cabinet-v2-checklist { display: grid; gap: 12px; margin-top: 24px; }
.cabinet-v2-checklist p { margin: 0; }
.cabinet-v2-cta-card { align-items: center; }
@media (max-width: 1100px) {
  .cabinet-v2-hero-card,
  .cabinet-v2-dashboard-grid { grid-template-columns: 1fr; }
  .cabinet-v2-modules-grid,
  .cabinet-v2-quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .cabinet-v2-hero-section { padding-top: 20px; }
  .cabinet-v2-hero-card,
  .cabinet-v2-main-panel,
  .cabinet-v2-side-panel,
  .cabinet-v2-profile-card { padding: 20px; border-radius: 24px; }
  .cabinet-v2-hero-copy h1 { font-size: 34px; line-height: 1.06; }
  .cabinet-v2-hero-copy > p { font-size: 16px; }
  .cabinet-v2-hero-actions,
  .cabinet-v2-panel-head,
  .cabinet-v2-cta-card .cta-actions { flex-direction: column; align-items: stretch; }
  .cabinet-v2-hero-actions .button,
  .cabinet-v2-panel-head .button,
  .cabinet-v2-cta-card .button { width: 100%; }
  .cabinet-v2-modules-grid,
  .cabinet-v2-quick-grid { grid-template-columns: 1fr; }
  .cabinet-v2-profile-top { grid-template-columns: 58px minmax(0,1fr); }
  .cabinet-v2-avatar { width: 58px; height: 58px; border-radius: 20px; }
}
/* Required trust-chip lock */
.trust-chip { height: 36px !important; margin-top: 20px !important; padding: 0 14px !important; }


/* =========================================================
   DONATE FINAL PASS — card-day voluntary support page
   Scope only: donate.html / .donate-v2-*
========================================================= */
.donate-v2-page {
  overflow: hidden;
}

.donate-v2-hero-section {
  padding-top: 40px;
}

.donate-v2-hero-shell,
.donate-v2-value-shell,
.donate-v2-safety-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  gap: 28px;
  align-items: stretch;
  padding: 36px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(248,239,251,.72));
  box-shadow: 0 22px 56px rgba(69, 55, 84, .07);
}

.donate-v2-hero-copy,
.donate-v2-value-copy,
.donate-v2-safety-shell > div:first-child {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.donate-v2-hero-copy h1,
.donate-v2-value-copy h2,
.donate-v2-safety-shell h2 {
  margin: 18px 0 16px;
  max-width: 760px;
  color: var(--text-primary);
  font-size: clamp(34px, 4.3vw, 64px);
  line-height: 1.05;
  letter-spacing: -0.045em;
}

.donate-v2-value-copy h2,
.donate-v2-safety-shell h2 {
  font-size: clamp(28px, 3vw, 46px);
}

.donate-v2-hero-copy p,
.donate-v2-value-copy p,
.donate-v2-safety-shell p {
  max-width: 680px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.85;
}

.donate-v2-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.donate-v2-hero-actions .button {
  min-width: 0;
  white-space: normal;
  text-align: center;
}

.donate-v2-hero-note {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  max-width: 620px;
  margin-top: 22px;
  padding: 16px 18px;
  border: 1px solid rgba(181, 123, 190, .18);
  border-radius: 22px;
  background: rgba(255,255,255,.72);
}

.donate-v2-hero-note span {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 800;
}

.donate-v2-hero-note p {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
}

.donate-v2-card-preview {
  min-width: 0;
  align-self: stretch;
  padding: 24px;
  border: 1px solid rgba(181, 123, 190, .18);
  border-radius: 30px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 44px rgba(69, 55, 84, .06);
}

.donate-v2-preview-top,
.donate-v2-preview-body {
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
}

.donate-v2-preview-top small {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.5;
  text-align: right;
}

.donate-v2-preview-body {
  justify-content: flex-start;
  align-items: stretch;
  margin-top: 22px;
}

.donate-v2-preview-image {
  position: relative;
  flex: 0 0 148px;
  width: 148px;
  min-height: 218px;
  overflow: hidden;
  border-radius: 22px;
  background: linear-gradient(160deg, #fff, var(--section-color-soft));
  border: 1px solid rgba(181, 123, 190, .22);
}

.donate-v2-preview-image img {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity .2s ease;
}

.donate-v2-preview-image img.is-loading,
.donate-v2-preview-image img.is-hidden {
  opacity: 0;
}

.donate-v2-preview-image span {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  color: var(--section-color);
  font-size: 44px;
  font-weight: 800;
}

.donate-v2-preview-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.donate-v2-preview-copy span {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.45;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.donate-v2-preview-copy h2 {
  margin: 8px 0 10px;
  color: var(--text-primary);
  font-size: clamp(22px, 2.3vw, 34px);
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.donate-v2-preview-copy p,
.donate-v2-card-preview blockquote,
.donate-v2-preview-question p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.7;
}

.donate-v2-card-preview blockquote {
  margin-top: 20px;
  padding: 18px 20px;
  border: 1px solid rgba(181, 123, 190, .14);
  border-radius: 22px;
  background: var(--bg-primary);
  color: var(--text-primary);
}

.donate-v2-preview-question {
  margin-top: 16px;
  padding: 16px 18px;
  border-radius: 20px;
  background: rgba(248, 239, 251, .75);
}

.donate-v2-preview-question span {
  display: block;
  margin-bottom: 6px;
  color: var(--section-color);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.donate-v2-options-grid,
.donate-v2-value-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 28px;
}

.donate-v2-option-card,
.donate-v2-value-card {
  min-width: 0;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: 28px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 16px 38px rgba(69, 55, 84, .055);
}

.donate-v2-option-card.is-featured {
  border-color: rgba(181, 123, 190, .34);
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(248,239,251,.8));
}

.donate-v2-option-amount {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 18px;
  border-radius: var(--radius-pill);
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 18px;
  font-weight: 900;
}

.donate-v2-option-card h3,
.donate-v2-value-card h3 {
  margin: 18px 0 10px;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.25;
}

.donate-v2-option-card p,
.donate-v2-value-card p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.7;
}

.donate-v2-option-card .button {
  width: 100%;
  margin-top: 22px;
  white-space: normal;
}

.donate-v2-option-card .button.is-selected {
  border-color: rgba(181, 123, 190, .38);
  transform: translateY(-1px);
}

.donate-v2-notice {
  margin-top: 22px;
  padding: 18px 20px;
  border: 1px solid rgba(59, 130, 246, .18);
  border-radius: 24px;
  background: var(--info-soft);
}

.donate-v2-notice[hidden] {
  display: none !important;
}

.donate-v2-notice strong {
  display: block;
  margin-bottom: 6px;
  color: var(--text-primary);
  font-size: 16px;
  line-height: 1.4;
}

.donate-v2-notice p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.7;
}

.donate-v2-value-shell,
.donate-v2-safety-shell {
  align-items: start;
}

.donate-v2-value-grid {
  grid-template-columns: 1fr;
  margin-top: 0;
}

.donate-v2-value-card span {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.donate-v2-safety-shell {
  background: rgba(255,255,255,.78);
}

.donate-v2-safety-list {
  display: grid;
  gap: 12px;
  align-self: center;
}

.donate-v2-safety-list div {
  padding: 16px 18px;
  border: 1px solid rgba(181, 123, 190, .16);
  border-radius: 20px;
  background: var(--section-color-soft);
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.65;
}

.donate-v2-cta-card .cta-actions .button {
  white-space: normal;
  text-align: center;
}

@media (max-width: 980px) {
  .donate-v2-hero-shell,
  .donate-v2-value-shell,
  .donate-v2-safety-shell {
    grid-template-columns: 1fr;
    padding: 28px;
  }

  .donate-v2-options-grid {
    grid-template-columns: 1fr;
  }

  .donate-v2-value-grid {
    margin-top: 8px;
  }
}

@media (max-width: 640px) {
  .donate-v2-hero-section {
    padding-top: 24px;
  }

  .donate-v2-hero-shell,
  .donate-v2-value-shell,
  .donate-v2-safety-shell,
  .donate-v2-card-preview,
  .donate-v2-option-card,
  .donate-v2-value-card {
    padding: 20px;
    border-radius: 24px;
  }

  .donate-v2-hero-copy h1 {
    font-size: 31px;
  }

  .donate-v2-preview-body {
    flex-direction: column;
  }

  .donate-v2-preview-image {
    width: min(188px, 100%);
    min-height: 276px;
    align-self: center;
    flex-basis: auto;
  }

  .donate-v2-hero-actions .button,
  .donate-v2-cta-card .cta-actions .button {
    width: 100%;
  }

  .donate-v2-preview-top {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .donate-v2-preview-top small {
    text-align: left;
  }
}

/* =========================================================
   DONATE ENTRY LINKS FIX — safe scoped additions
   Keeps the donate page reachable from card-day and footer.
========================================================= */
.card-day-v3-format-card .button {
  width: 100%;
  margin-top: 18px;
}

.day-card-v3-actions .button,
.card-day-v3-hero-actions .button,
.cta-actions .button {
  min-width: 0;
}


/* =========================================================
   LEGAL PAGES FINAL PASS — privacy.html + terms.html
   Scoped styles only. No glow, no global layout rebuild.
========================================================= */
.legal-page {
  overflow-x: hidden;
}

.legal-hero-section {
  padding-top: 34px;
}

.legal-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, .72fr);
  gap: 28px;
  align-items: stretch;
  padding: 34px;
  border: 1px solid rgba(181, 123, 190, .18);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(248,238,244,.72));
  box-shadow: 0 22px 52px rgba(69, 55, 84, .07);
}

.legal-hero-copy,
.legal-summary-panel,
.legal-content-card,
.legal-aside-card,
.legal-mini-card,
.legal-split-card {
  min-width: 0;
}

.legal-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.legal-hero-copy h1 {
  max-width: 780px;
  margin: 18px 0 16px;
  color: var(--text-primary);
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.05;
  letter-spacing: -.04em;
}

.legal-hero-copy p {
  max-width: 720px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.8;
}

.legal-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

.legal-hero-actions .button {
  min-width: 0;
  white-space: normal;
  text-align: center;
}

.legal-summary-panel {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 24px;
  border: 1px solid rgba(181, 123, 190, .16);
  border-radius: 30px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 16px 36px rgba(69, 55, 84, .055);
}

.legal-summary-list {
  display: grid;
  gap: 12px;
}

.legal-summary-list div {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 14px;
  border: 1px solid rgba(181, 123, 190, .13);
  border-radius: 22px;
  background: var(--section-color-soft);
}

.legal-summary-list span {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.86);
  color: var(--section-color);
  font-size: 12px;
  font-weight: 900;
}

.legal-summary-list p {
  margin: 0;
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.65;
}

.legal-intro-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.legal-mini-card {
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: 28px;
  background: rgba(255,255,255,.84);
  box-shadow: 0 14px 36px rgba(69, 55, 84, .05);
}

.legal-mini-icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.legal-mini-card h3 {
  margin: 18px 0 10px;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.25;
}

.legal-mini-card p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.75;
}

.legal-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .55fr);
  gap: 22px;
  align-items: start;
}

.legal-layout-reverse {
  grid-template-columns: minmax(280px, .55fr) minmax(0, 1.15fr);
}

.legal-content-card,
.legal-aside-card,
.legal-split-card {
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.84);
  box-shadow: 0 18px 44px rgba(69, 55, 84, .055);
}

.legal-content-card {
  padding: 30px;
}

.legal-content-card h2,
.legal-split-card h2 {
  margin: 14px 0 18px;
  color: var(--text-primary);
  font-size: clamp(26px, 3.2vw, 40px);
  line-height: 1.12;
  letter-spacing: -.03em;
}

.legal-list {
  display: grid;
  gap: 14px;
  margin-top: 20px;
}

.legal-list.compact {
  margin-top: 16px;
}

.legal-list article {
  padding: 18px;
  border: 1px solid rgba(181, 123, 190, .13);
  border-radius: 24px;
  background: rgba(248,239,251,.58);
}

.legal-list h3 {
  margin: 0 0 8px;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 1.35;
}

.legal-list p,
.legal-aside-card p,
.legal-split-card p,
.legal-warning-card p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.75;
}

.legal-aside-card {
  padding: 24px;
}

.legal-aside-card h3 {
  margin: 14px 0 12px;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.25;
}

.legal-aside-card ul {
  display: grid;
  gap: 10px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.legal-aside-card li {
  position: relative;
  padding-left: 22px;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.65;
}

.legal-aside-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-primary);
}

.legal-split-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .48fr);
  gap: 22px;
  align-items: center;
  padding: 30px;
}

.legal-warning-card {
  padding: 20px;
  border: 1px solid rgba(245, 158, 11, .22);
  border-radius: 26px;
  background: rgba(245, 158, 11, .1);
}

.legal-warning-card strong {
  display: block;
  margin-bottom: 8px;
  color: var(--text-primary);
  font-size: 16px;
  line-height: 1.35;
}

.legal-cta-card .cta-actions .button {
  min-width: 0;
  white-space: normal;
  text-align: center;
}

@media (max-width: 980px) {
  .legal-hero-card,
  .legal-layout,
  .legal-layout-reverse,
  .legal-split-card {
    grid-template-columns: 1fr;
  }

  .legal-intro-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .legal-hero-section {
    padding-top: 24px;
  }

  .legal-hero-card,
  .legal-summary-panel,
  .legal-content-card,
  .legal-aside-card,
  .legal-mini-card,
  .legal-split-card {
    padding: 20px;
    border-radius: 24px;
  }

  .legal-hero-copy h1 {
    font-size: 32px;
  }

  .legal-hero-actions .button,
  .legal-cta-card .cta-actions .button {
    width: 100%;
  }

  .legal-summary-list div {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   SPECIALIST FLOW FINAL PASS — become-specialist + application
   Scoped only to specialist onboarding pages.
========================================================= */

.specialist-flow-page,
.specialist-application-v2-page {
  overflow-x: clip;
}

.specialist-flow-hero-section {
  padding-top: 34px;
}

.specialist-flow-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 430px);
  gap: 28px;
  align-items: stretch;
  padding: 34px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 24px 70px rgba(69, 55, 84, 0.08);
}

.specialist-flow-copy,
.specialist-flow-panel {
  min-width: 0;
}

.specialist-flow-copy h1 {
  margin: 18px 0 0;
  max-width: 820px;
  color: var(--text-primary);
  font-size: clamp(38px, 5vw, 68px);
  line-height: 1.05;
  letter-spacing: -0.06em;
}

.specialist-flow-copy p {
  max-width: 720px;
  margin: 18px 0 0;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.75;
}

.specialist-flow-copy .button,
.specialist-flow-panel .button,
.specialist-flow-page .cta-actions .button,
.specialist-application-v2-page .button {
  min-width: 0;
  white-space: normal;
  text-align: center;
}

.specialist-flow-panel {
  padding: 28px;
  border: 1px solid var(--border-default);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(248, 239, 251, 0.86), rgba(255, 247, 250, 0.82));
}

.specialist-flow-steps,
.specialist-flow-roadmap-grid,
.specialist-flow-principles {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.specialist-flow-steps {
  margin-top: 20px;
}

.specialist-flow-steps article,
.specialist-flow-roadmap-grid article,
.specialist-flow-principles article {
  min-width: 0;
  border: 1px solid rgba(237, 221, 231, 0.9);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.72);
}

.specialist-flow-steps article,
.specialist-flow-roadmap-grid article {
  display: grid;
  gap: 8px;
  padding: 16px;
}

.specialist-flow-steps span,
.specialist-flow-roadmap-grid span {
  color: var(--brand-primary);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.08em;
}

.specialist-flow-steps strong,
.specialist-flow-roadmap-grid strong {
  color: var(--text-primary);
  font-size: 17px;
  line-height: 1.35;
}

.specialist-flow-steps p,
.specialist-flow-roadmap-grid p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.55;
}

.specialist-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 30px;
}

.specialist-flow-card {
  min-width: 0;
  padding: 26px;
  border: 1px solid var(--border-default);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 18px 44px rgba(69, 55, 84, 0.055);
}

.specialist-flow-card h3 {
  margin: 16px 0 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.25;
}

.specialist-flow-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.65;
}

.specialist-flow-split,
.specialist-flow-roadmap {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 26px;
  align-items: stretch;
  padding: 30px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.78);
}

.specialist-flow-split-copy,
.specialist-flow-roadmap > div {
  min-width: 0;
}

.specialist-flow-split-copy h2,
.specialist-flow-roadmap h2 {
  margin: 16px 0 0;
  color: var(--text-primary);
  font-size: clamp(30px, 3.2vw, 46px);
  line-height: 1.12;
  letter-spacing: -0.045em;
}

.specialist-flow-split-copy p,
.specialist-flow-roadmap > div > p {
  margin: 14px 0 20px;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.7;
}

.specialist-flow-principles article {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 18px;
}

.specialist-flow-principles span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--brand-primary);
  font-weight: 900;
}

.specialist-flow-principles p {
  margin: 0;
  color: var(--text-primary);
  font-size: 15px;
  line-height: 1.6;
}

.application-form-state {
  margin-top: 22px;
  padding: 16px 18px;
  border: 1px solid rgba(34, 197, 94, 0.28);
  border-radius: 20px;
  background: var(--success-soft);
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.55;
}

.specialist-application-v2-page .application-form-card {
  box-shadow: 0 22px 70px rgba(69, 55, 84, 0.065);
}

.specialist-application-v2-page .application-form-card .form-field input:focus,
.specialist-application-v2-page .application-form-card .form-field textarea:focus,
.specialist-application-v2-page .application-form-card .form-field select:focus,
.specialist-application-v2-page .application-form-card .custom-select__button:focus {
  outline: none;
  border-color: rgba(181, 123, 190, 0.72) !important;
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.12) !important;
}

@media (max-width: 1120px) {
  .specialist-flow-hero,
  .specialist-flow-split,
  .specialist-flow-roadmap {
    grid-template-columns: 1fr;
  }

  .specialist-flow-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .specialist-flow-hero,
  .specialist-flow-panel,
  .specialist-flow-split,
  .specialist-flow-roadmap,
  .specialist-flow-card {
    padding: 20px;
    border-radius: 24px;
  }

  .specialist-flow-copy h1 {
    font-size: 34px;
  }

  .specialist-flow-copy .button,
  .specialist-flow-page .cta-actions .button {
    width: 100%;
  }

  .specialist-flow-principles article {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   SPECIALIST FLOW STYLE FIX — missing local classes
   Finishes become-specialist.html and specialist-application.html
   without touching request/card-day/specialists logic.
========================================================= */

.specialist-flow-page .section {
  padding-top: clamp(58px, 7vw, 92px);
  padding-bottom: clamp(58px, 7vw, 92px);
}

.specialist-flow-page .specialist-flow-hero-section {
  padding-top: clamp(36px, 5vw, 56px);
  padding-bottom: clamp(58px, 7vw, 86px);
}

.specialist-flow-page .section-heading {
  display: grid;
  gap: 14px;
  max-width: 920px;
  margin: 0 auto 34px;
  min-width: 0;
}

.specialist-flow-page .section-heading.centered {
  text-align: center;
  justify-items: center;
}

.specialist-flow-page .section-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  min-height: 36px;
  padding: 8px 16px;
  border: 1px solid rgba(181, 123, 190, 0.22);
  border-radius: var(--radius-pill);
  background: var(--section-color-soft);
  color: var(--brand-primary);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.specialist-flow-page .section-heading h2 {
  margin: 0;
  max-width: 820px;
  color: var(--text-primary);
  font-size: clamp(34px, 4.2vw, 56px);
  line-height: 1.08;
  letter-spacing: -0.055em;
}

.specialist-flow-page .section-heading p {
  margin: 0;
  max-width: 860px;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.75;
}

.specialist-flow-page .specialist-flow-grid {
  margin-top: 0;
}

.specialist-flow-page .specialist-flow-card {
  display: grid;
  align-content: start;
  min-height: 238px;
}

.specialist-flow-page .specialist-flow-card .badge {
  justify-self: start;
}

.specialist-flow-page .specialist-flow-split,
.specialist-flow-page .specialist-flow-roadmap {
  box-shadow: 0 22px 60px rgba(69, 55, 84, 0.055);
}

.specialist-flow-page .specialist-flow-roadmap-grid {
  align-self: stretch;
}

.specialist-flow-page .specialist-flow-roadmap-grid article {
  align-content: start;
}

.specialist-flow-page .cta-card {
  overflow: hidden;
}

.specialist-application-v2-page .application-layout {
  gap: 30px !important;
}

.specialist-application-v2-page .application-form-card,
.specialist-application-v2-page .application-side-card {
  background: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 22px 70px rgba(69, 55, 84, 0.065) !important;
}

.specialist-application-v2-page .application-form-card .form-field {
  display: grid !important;
  gap: 9px !important;
}

.specialist-application-v2-page .application-form-card .form-field > span,
.specialist-application-v2-page .application-choice-title {
  color: var(--text-primary) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.specialist-application-v2-page .application-form-card .form-field input:not([type="hidden"]),
.specialist-application-v2-page .application-form-card .form-field textarea,
.specialist-application-v2-page .application-form-card .form-field select {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 100% !important;
  min-height: 58px !important;
  padding: 0 18px !important;
  border: 1px solid var(--border-default) !important;
  border-radius: 20px !important;
  background-color: rgba(255, 247, 250, 0.68) !important;
  color: var(--text-primary) !important;
  font: inherit !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

.specialist-application-v2-page .application-form-card .form-field select {
  padding-right: 46px !important;
  background-image: linear-gradient(45deg, transparent 50%, var(--brand-primary) 50%), linear-gradient(135deg, var(--brand-primary) 50%, transparent 50%);
  background-position: calc(100% - 24px) 50%, calc(100% - 18px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

.specialist-application-v2-page .application-form-card .form-field textarea {
  min-height: 148px !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  resize: vertical;
}

.specialist-application-v2-page .application-form-card .form-field input::placeholder,
.specialist-application-v2-page .application-form-card .form-field textarea::placeholder {
  color: rgba(154, 139, 162, 0.78) !important;
}

.specialist-application-v2-page .soft-choice-card,
.specialist-application-v2-page .application-consent-card {
  border-color: rgba(237, 221, 231, 0.95) !important;
  background: rgba(255, 247, 250, 0.68) !important;
}

.specialist-application-v2-page .soft-choice-card span,
.specialist-application-v2-page .application-consent-card span {
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 1120px) {
  .specialist-flow-page .section-heading {
    margin-bottom: 26px;
  }

  .specialist-flow-page .section-heading.centered {
    text-align: left;
    justify-items: start;
  }

  .specialist-flow-page .specialist-flow-card {
    min-height: 0;
  }
}

@media (max-width: 720px) {
  .specialist-flow-page .section {
    padding-top: 42px;
    padding-bottom: 42px;
  }

  .specialist-flow-page .section-heading h2,
  .specialist-flow-split-copy h2,
  .specialist-flow-roadmap h2 {
    font-size: 30px !important;
    line-height: 1.14 !important;
  }

  .specialist-flow-page .section-heading p,
  .specialist-flow-copy p,
  .specialist-flow-split-copy p,
  .specialist-flow-roadmap > div > p {
    font-size: 15px !important;
    line-height: 1.65 !important;
  }

  .specialist-flow-page .section-kicker {
    min-height: 34px;
    padding: 7px 14px;
  }

  .specialist-application-v2-page .application-form-grid,
  .specialist-application-v2-page .application-choice-grid {
    grid-template-columns: 1fr !important;
  }
}

.trust-chip {
  height: 36px;
  margin-top: 20px;
  padding: 0 14px;
}

/* =========================================================
   SPECIALISTS / PROFILE / REVIEWS FINAL PASS
   Scoped additions only. Do not touch request.css or .trust-chip.
========================================================= */

.profile-reviews-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 22px;
}

.profile-reviews-head > div {
  min-width: 0;
  max-width: 780px;
}

.profile-reviews-link {
  flex: 0 0 auto;
  white-space: normal;
  text-align: center;
}

.reviews-v2-page .page-hero-card {
  align-items: stretch;
}

.reviews-v2-hero .page-hero-copy {
  min-width: 0;
}

.reviews-v2-panel {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.reviews-v2-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.reviews-v2-stats div {
  min-width: 0;
  padding: 16px 14px;
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
}

.reviews-v2-stats strong {
  display: block;
  color: var(--text-primary);
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1;
  letter-spacing: -0.06em;
  margin-bottom: 8px;
}

.reviews-v2-stats span,
.reviews-v2-panel p {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

.reviews-v2-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 26px 0 24px;
}

.reviews-v2-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  min-width: 0;
}

.reviews-v2-filter {
  border: 1px solid var(--border-default);
  cursor: pointer;
  font-family: inherit;
  min-height: 36px;
}

.reviews-v2-filter:hover {
  transform: translateY(-1px);
}

.reviews-v2-count {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.45;
  padding: 10px 14px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.72);
}

.reviews-v2-grid {
  align-items: stretch;
}

.reviews-v2-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

.reviews-v2-card p {
  margin: 0;
}

.reviews-v2-specialist-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

.reviews-v2-card-actions {
  margin-top: auto;
  gap: 12px;
}

.reviews-v2-card-actions .button {
  min-width: 0;
  white-space: normal;
}

.reviews-v2-empty {
  grid-column: 1 / -1;
  text-align: center;
}

.reviews-v2-principles {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 24px;
  align-items: stretch;
  padding: clamp(24px, 4vw, 40px);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.78);
}

.reviews-v2-principles h2 {
  margin: 14px 0 14px;
  color: var(--text-primary);
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.08;
  letter-spacing: -0.06em;
}

.reviews-v2-principles p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.75;
}

.reviews-v2-principle-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.reviews-v2-principle-list .info-card {
  min-width: 0;
  padding: 22px;
}

.reviews-v2-principle-list h3 {
  margin: 14px 0 10px;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.25;
}

@media (max-width: 980px) {
  .profile-reviews-head,
  .reviews-v2-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .profile-reviews-link,
  .reviews-v2-count {
    width: 100%;
  }

  .reviews-v2-stats,
  .reviews-v2-principles,
  .reviews-v2-principle-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .reviews-v2-stats div,
  .reviews-v2-principle-list .info-card {
    padding: 18px;
    border-radius: 20px;
  }

  .reviews-v2-card-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .reviews-v2-card-actions .button,
  .reviews-v2-card-actions .text-link {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}

.trust-chip {
  height: 36px;
  margin-top: 20px;
  padding: 0 14px;
}

/* =========================================================
   DIRECTIONS FINAL PASS — overview + detail pages
   Scoped safe polish, no global layout rebuild
   ========================================================= */

.directions-page,
.direction-detail-page {
  overflow-x: clip;
}

.directions-page .page-hero-card,
.direction-detail-page .direction-detail-hero {
  position: relative;
  overflow: hidden;
}

.directions-page .page-hero-card::after,
.direction-detail-page .direction-detail-hero::after {
  content: "";
  position: absolute;
  inset: auto 28px 28px auto;
  width: 112px;
  height: 112px;
  border: 1px solid rgba(181, 123, 190, 0.22);
  border-radius: 999px;
  opacity: 0.55;
  pointer-events: none;
}

.directions-page .page-hero-copy,
.direction-detail-page .direction-detail-copy,
.directions-page .page-hero-panel,
.direction-detail-page .direction-detail-visual {
  position: relative;
  z-index: 1;
}

.directions-page .direction-list {
  display: grid;
  gap: 28px;
}

.directions-page .direction-list-card {
  min-height: 360px;
  align-items: stretch;
  border-color: rgba(237, 221, 231, 0.95);
  background: rgba(255, 255, 255, 0.86);
}

.directions-page .direction-list-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.directions-page .direction-points {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.directions-page .direction-points span,
.direction-detail-page .check-list li,
.direction-detail-page .faq-item p {
  overflow-wrap: anywhere;
}

.directions-page .direction-actions,
.direction-detail-page .direction-banner-actions,
.direction-detail-page .direction-detail-actions {
  flex-wrap: wrap;
}

.directions-page .direction-actions .button,
.directions-page .direction-actions .text-link,
.direction-detail-page .direction-banner-actions .button,
.direction-detail-page .direction-banner-actions .text-link,
.direction-detail-page .direction-detail-actions .button {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
}

.directions-page .direction-actions .text-link,
.direction-detail-page .direction-banner-actions .text-link {
  padding: 0 2px;
  color: var(--section-color);
  font-weight: 700;
  text-decoration: none;
}

.directions-page .direction-actions .text-link:hover,
.direction-detail-page .direction-banner-actions .text-link:hover {
  color: var(--brand-primary);
}

.directions-page .choose-format-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.94) 0%, rgba(255,247,250,0.94) 100%);
}

.directions-page .format-option {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-height: 220px;
}

.direction-detail-page .direction-detail-copy .badge,
.direction-detail-page .topic-card .badge,
.direction-detail-page .direction-format-option .badge,
.directions-page .direction-list-content .badge,
.directions-page .format-option .badge {
  width: fit-content;
  max-width: 100%;
}

.direction-detail-page .direction-detail-actions {
  margin-top: 34px !important;
}

.direction-detail-page .direction-detail-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.direction-detail-page .direction-detail-chips .trust-chip {
  margin-top: 0;
}

.direction-detail-page .direction-format-card {
  border: 1px solid var(--border-default);
}

.direction-detail-page .direction-specialist-banner {
  border: 1px solid var(--border-default);
}

.direction-detail-page .direction-banner-actions {
  justify-content: flex-start;
}

.direction-detail-page .faq-item summary {
  overflow-wrap: anywhere;
}

@media (max-width: 1080px) {
  .directions-page .direction-points {
    grid-template-columns: 1fr;
  }

  .directions-page .direction-list-card {
    min-height: unset;
  }
}

@media (max-width: 760px) {
  .directions-page .page-hero-card::after,
  .direction-detail-page .direction-detail-hero::after {
    display: none;
  }

  .directions-page .direction-actions,
  .direction-detail-page .direction-detail-actions,
  .direction-detail-page .direction-banner-actions,
  .directions-page .cta-actions,
  .direction-detail-page .cta-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .directions-page .direction-actions .button,
  .directions-page .direction-actions .text-link,
  .direction-detail-page .direction-detail-actions .button,
  .direction-detail-page .direction-banner-actions .button,
  .direction-detail-page .direction-banner-actions .text-link,
  .directions-page .cta-actions .button,
  .direction-detail-page .cta-actions .button {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center;
    text-align: center;
    white-space: normal;
  }

  .directions-page .choose-format-card {
    padding: 22px;
  }

  .directions-page .choose-format-copy h2,
  .direction-detail-page .direction-specialist-banner h2 {
    font-size: 28px;
    line-height: 34px;
  }

  .direction-detail-page .direction-detail-chips {
    align-items: stretch;
  }
}

/* =========================================================
   QUESTION DETAIL FINAL PASS + LAST QA
   Scope: question-detail.html and safe Q&A links only
   ========================================================= */
.question-detail-v2-page {
  overflow: hidden;
}

.question-detail-v2-hero-section {
  padding-top: 48px;
}

.question-detail-v2-hero-card {
  grid-template-columns: minmax(0, 620px) minmax(360px, 460px);
}

.question-detail-v2-actions {
  flex-wrap: wrap;
}

.question-detail-v2-panel {
  min-width: 0;
}

.question-detail-v2-panel-list {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.question-detail-v2-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 390px);
  gap: 24px;
  align-items: start;
}

.question-detail-v2-main-card,
.question-detail-v2-side-card,
.question-detail-v2-related-card {
  min-width: 0;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 44px rgba(69, 55, 84, 0.06);
}

.question-detail-v2-main-card {
  padding: 26px;
  display: grid;
  gap: 18px;
}

.question-detail-v2-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.question-detail-v2-block {
  min-width: 0;
  padding: 24px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--bg-primary);
}

.question-detail-v2-question h2 {
  margin: 10px 0 0;
  color: var(--text-primary);
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.18;
  letter-spacing: -0.04em;
  overflow-wrap: anywhere;
}

.question-detail-v2-question p,
.question-detail-v2-answer-text,
.question-detail-v2-side-card p,
.question-detail-v2-related-card p,
.question-detail-v2-note p {
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.question-detail-v2-question p {
  margin: 16px 0 0;
}

.question-detail-v2-answer {
  background: rgba(255, 255, 255, 0.95);
}

.question-detail-v2-author h3,
.question-detail-v2-side-card h3,
.question-detail-v2-related-card h3,
.question-detail-v2-note h3 {
  margin: 4px 0 0;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}

.question-detail-v2-author p {
  margin: 4px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.5;
}

.question-detail-v2-answer-text {
  margin-top: 18px;
}

.question-detail-v2-answer-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 22px;
}

.question-detail-v2-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  padding: 20px;
  border: 1px solid rgba(245, 158, 11, 0.18);
  border-radius: var(--radius-md);
  background: rgba(245, 158, 11, 0.08);
}

.question-detail-v2-note h3,
.question-detail-v2-note p {
  margin: 0;
}

.question-detail-v2-note p {
  margin-top: 8px;
}

.question-detail-v2-sidebar {
  display: grid;
  gap: 18px;
}

.question-detail-v2-side-card {
  padding: 24px;
}

.question-detail-v2-specialist-mini {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 18px;
}

.question-detail-v2-specialist-mini h3,
.question-detail-v2-specialist-mini p {
  margin: 0;
}

.question-detail-v2-side-card > p {
  margin: 16px 0 0;
}

.question-detail-v2-side-card .button {
  margin-top: 18px;
}

.question-detail-v2-side-actions {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.question-detail-v2-related-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.question-detail-v2-related-card {
  padding: 22px;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.question-detail-v2-related-card:hover {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.24);
  box-shadow: 0 22px 50px rgba(69, 55, 84, 0.08);
}

.question-detail-v2-related-card h3 {
  margin-top: 16px;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: -0.03em;
}

.question-detail-v2-related-card p {
  margin: 12px 0 0;
}

.question-detail-v2-related-card .text-link {
  margin-top: auto;
  padding-top: 18px;
}

.question-actions {
  flex-wrap: wrap;
}

.question-actions .text-link {
  white-space: normal;
}

.question-read-link {
  font-weight: 700;
}

@media (max-width: 1100px) {
  .question-detail-v2-hero-card,
  .question-detail-v2-layout {
    grid-template-columns: 1fr;
  }

  .question-detail-v2-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .question-detail-v2-related-grid,
  .question-detail-v2-sidebar {
    grid-template-columns: 1fr;
  }

  .question-detail-v2-main-card,
  .question-detail-v2-block,
  .question-detail-v2-side-card,
  .question-detail-v2-related-card {
    padding: 20px;
  }
}

@media (max-width: 640px) {
  .question-detail-v2-meta,
  .question-detail-v2-answer-actions,
  .question-detail-v2-note {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .question-detail-v2-answer-actions .button,
  .question-detail-v2-actions .button {
    width: 100%;
  }
}

.trust-chip {
  height: 36px !important;
  margin-top: 20px !important;
  padding: 0 14px !important;
}

/* =========================================================
   QUESTION DETAIL AVATAR FIX
   Keeps initials centered in the specialist card on question-detail.html.
   ========================================================= */
.question-detail-v2-specialist-mini .avatar-circle {
  flex: 0 0 72px;
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.03em;
  text-align: center;
}

.question-detail-v2-specialist-mini > div:not(.avatar-circle) {
  min-width: 0;
}

.question-detail-v2-specialist-mini h3,
.question-detail-v2-specialist-mini p {
  overflow-wrap: anywhere;
}

@media (max-width: 640px) {
  .question-detail-v2-specialist-mini .avatar-circle {
    flex-basis: 64px;
    width: 64px;
    height: 64px;
    font-size: 16px;
  }
}

.trust-chip {
  height: 36px !important;
  margin-top: 20px !important;
  padding: 0 14px !important;
}

/* =========================================================
   INDEX QA META FIX
   Keeps the date on the right side of public question cards.
   ========================================================= */
.qa-top {
  width: 100%;
  justify-content: space-between;
}

.qa-top .tag-row {
  flex: 1 1 auto;
  min-width: 0;
  flex-wrap: wrap;
}

.qa-top .date-text {
  flex: 0 0 auto;
  margin-left: auto;
  text-align: right;
}

@media (max-width: 420px) {
  .qa-top {
    gap: 10px;
  }

  .qa-top .tag-row {
    flex: 1 1 100%;
  }

  .qa-top .date-text {
    margin-left: 0;
    margin-right: 0;
  }
}

.trust-chip {
  height: 36px !important;
  margin-top: 20px !important;
  padding: 0 14px !important;
}


/* =========================================================
   SPECIALIST CABINET FRONTEND SHELL
   Scope only: cabinet specialist role + specialist workspace pages
========================================================= */
.cabinet-specialist-role-card,
.specialist-workspace-hero,
.specialist-workspace-simple-hero,
.specialist-workspace-panel,
.specialist-workspace-status-card,
.specialist-workspace-metric-card,
.specialist-workspace-section-card,
.specialist-request-preview-card,
.specialist-workspace-statistics-card,
.specialist-workspace-notice {
  min-width: 0;
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.93);
  box-shadow: 0 18px 46px rgba(69,55,84,.065);
}

.cabinet-specialist-role-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .42fr);
  gap: 22px;
  align-items: stretch;
  padding: 30px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,239,251,.74));
}

.cabinet-specialist-role-copy h2,
.specialist-workspace-hero-copy h1,
.specialist-workspace-simple-hero h1 {
  margin: 16px 0 0;
  color: var(--text-primary);
  font-size: clamp(34px, 4.8vw, 58px);
  line-height: 1.04;
  letter-spacing: -.06em;
  overflow-wrap: anywhere;
}

.cabinet-specialist-role-copy p,
.specialist-workspace-hero-copy p,
.specialist-workspace-simple-hero > p,
.specialist-workspace-panel p,
.specialist-workspace-section-card p,
.specialist-request-preview-card p,
.specialist-workspace-status-list p,
.specialist-workspace-notice p {
  color: var(--text-secondary);
  line-height: 1.72;
}

.cabinet-specialist-role-copy > p,
.specialist-workspace-hero-copy > p,
.specialist-workspace-simple-hero > p {
  max-width: 760px;
  margin: 18px 0 0;
  font-size: 17px;
}

.cabinet-specialist-role-actions,
.specialist-workspace-actions,
.specialist-workspace-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.cabinet-specialist-role-status {
  display: grid;
  gap: 14px;
  padding: 22px;
  border-radius: 26px;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(237,221,231,.9);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
}

.cabinet-specialist-role-status > div,
.specialist-workspace-status-list p,
.specialist-workspace-safe-dl div {
  margin: 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: var(--bg-primary);
}

.cabinet-specialist-role-status span,
.specialist-workspace-status-list span,
.specialist-workspace-safe-dl dt,
.specialist-request-preview-card dt,
.specialist-workspace-muted {
  color: var(--text-secondary);
  font-size: 13px;
}

.cabinet-specialist-role-status strong,
.specialist-workspace-status-list strong,
.specialist-workspace-safe-dl dd,
.specialist-request-preview-card dd {
  display: block;
  margin-top: 5px;
  color: var(--text-primary);
  font-weight: 800;
}

.cabinet-specialist-role-status p {
  margin: 0;
  font-size: 14px;
}

.specialist-status-strip {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 12px;
  row-gap: 3px;
  align-items: center;
  padding: 15px 16px;
  border: 1px solid transparent;
  border-radius: 20px;
  line-height: 1.25;
}

.specialist-status-strip::before {
  content: "";
  width: 11px;
  height: 11px;
  border-radius: 50%;
  grid-row: 1 / span 2;
  background: currentColor;
  box-shadow: 0 0 0 5px rgba(34, 197, 94, .11);
}

.specialist-status-strip span {
  color: inherit;
  opacity: .72;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.specialist-status-strip strong {
  margin: 0;
  color: inherit;
  font-size: 17px;
  font-weight: 850;
}

.specialist-status-strip--approved {
  color: #15803D;
  border-color: rgba(34,197,94,.32);
  background: linear-gradient(135deg, rgba(34,197,94,.16), rgba(34,197,94,.08));
}

.specialist-status-strip--pending {
  color: #B45309;
  border-color: rgba(245,158,11,.35);
  background: linear-gradient(135deg, rgba(245,158,11,.18), rgba(245,158,11,.08));
}

.specialist-status-strip--pending::before {
  box-shadow: 0 0 0 5px rgba(245,158,11,.12);
}

.specialist-status-strip--rejected {
  color: #B91C1C;
  border-color: rgba(239,68,68,.34);
  background: linear-gradient(135deg, rgba(239,68,68,.16), rgba(239,68,68,.08));
}

.specialist-status-strip--rejected::before {
  box-shadow: 0 0 0 5px rgba(239,68,68,.11);
}

.cabinet-specialist-role-note {
  padding: 0 2px;
  color: var(--text-secondary);
  line-height: 1.55;
}

.specialist-workspace-page {
  overflow: hidden;
}

.specialist-workspace-hero-section {
  padding-top: 40px;
}

.specialist-workspace-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
  gap: 26px;
  align-items: stretch;
  padding: 36px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,238,244,.72));
}

.specialist-workspace-simple-hero {
  padding: 36px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,238,244,.72));
}

.specialist-workspace-hero-copy,
.specialist-workspace-status-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.specialist-workspace-status-card,
.specialist-workspace-panel,
.specialist-workspace-statistics-card {
  padding: 28px;
  border-radius: var(--radius-lg);
}

.specialist-workspace-status-list {
  display: grid;
  gap: 12px;
  margin-top: 22px;
}

.specialist-workspace-metrics-grid,
.specialist-workspace-section-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.specialist-workspace-metric-card {
  padding: 22px;
  border-radius: 26px;
}

.specialist-workspace-metric-card span,
.specialist-public-preview-list span,
.specialist-request-preview-top span {
  color: var(--section-color);
  font-size: 13px;
  font-weight: 800;
}

.specialist-workspace-metric-card strong {
  display: block;
  margin-top: 10px;
  color: var(--text-primary);
  font-size: 42px;
  line-height: 1;
  letter-spacing: -.06em;
}

.specialist-workspace-metric-card p {
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
}

.specialist-workspace-heading {
  max-width: 780px;
}

.specialist-workspace-section-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 30px;
}

.specialist-workspace-section-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  gap: 14px;
  padding: 24px;
  border-radius: var(--radius-md);
}

.specialist-workspace-section-card > span {
  display: inline-flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 800;
}

.specialist-workspace-section-card h3,
.specialist-workspace-panel h2,
.specialist-workspace-statistics-card h2,
.specialist-public-preview-list h3,
.specialist-workspace-decks-preview h3 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: -.04em;
}

.specialist-workspace-section-card p {
  margin: 0;
}

.specialist-workspace-section-card .button {
  margin-top: auto;
  align-self: flex-start;
}

.specialist-workspace-split-grid,
.specialist-workspace-detail-grid,
.specialist-workspace-session-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .42fr);
  gap: 20px;
  align-items: stretch;
}

.specialist-workspace-panel-head {
  display: flex;
  gap: 18px;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 22px;
}

.specialist-request-preview-list,
.specialist-public-preview-list,
.specialist-profile-edit-grid,
.specialist-workspace-safe-dl {
  display: grid;
  gap: 14px;
}

.specialist-request-preview-list-compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.specialist-request-preview-card {
  padding: 20px;
  border-radius: 24px;
}

.specialist-request-preview-top {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}

.specialist-request-preview-card p {
  margin: 16px 0 0;
}

.specialist-request-preview-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin: 18px 0 0;
}

.specialist-request-preview-card dl div {
  padding: 12px;
  border-radius: 16px;
  background: var(--bg-primary);
}

.specialist-request-preview-card dt,
.specialist-request-preview-card dd,
.specialist-workspace-safe-dl dt,
.specialist-workspace-safe-dl dd {
  margin: 0;
}

.specialist-public-preview-list article {
  padding: 18px;
  border: 1px solid rgba(237,221,231,.88);
  border-radius: 22px;
  background: var(--bg-primary);
}

.specialist-public-preview-list h3 {
  margin-top: 10px;
  font-size: 19px;
  line-height: 1.35;
}

.specialist-public-preview-list a {
  display: inline-flex;
  margin-top: 12px;
  color: var(--section-color);
  font-weight: 800;
  text-decoration: none;
}

.specialist-workspace-decks-preview {
  margin-top: 24px;
  padding: 20px;
  border-radius: 24px;
  background: var(--section-color-soft);
}

.specialist-workspace-statistics-card {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(280px,.55fr);
  gap: 20px;
  align-items: center;
}

.specialist-workspace-mini-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}

.specialist-workspace-mini-stats p {
  margin: 0;
  padding: 16px;
  border-radius: 20px;
  background: var(--bg-primary);
}

.specialist-workspace-mini-stats strong {
  display: block;
  color: var(--text-primary);
  font-size: 28px;
}

.specialist-workspace-mini-stats span {
  color: var(--text-secondary);
  font-size: 13px;
}

.specialist-workspace-notice {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr);
  gap: 12px;
  align-items: start;
  padding: 18px 20px;
  border-radius: 24px;
  background: rgba(255,255,255,.86);
}

.specialist-workspace-notice span {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.specialist-workspace-notice p {
  margin: 0;
}

.specialist-workspace-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 22px;
}

.specialist-workspace-tabs span {
  display: inline-flex;
  padding: 10px 14px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  font-size: 14px;
  font-weight: 800;
}

.specialist-workspace-tabs .is-active {
  background: var(--section-color-soft);
  color: var(--section-color);
  border-color: rgba(181,123,190,.28);
}

.specialist-workspace-safe-dl {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 20px 0;
}

.specialist-workspace-locked-card {
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,239,251,.78));
}

.specialist-profile-edit-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 20px;
}

.specialist-profile-edit-grid label {
  display: grid;
  gap: 8px;
  color: var(--text-primary);
  font-weight: 800;
}

.specialist-profile-edit-grid input {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font: inherit;
}

.deck-session-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 24px 0;
}

.deck-session-cards span {
  display: flex;
  min-height: 180px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(181,123,190,.2);
  border-radius: 24px;
  background: linear-gradient(135deg, var(--bg-primary), var(--section-color-soft));
  color: var(--section-color);
  font-size: 40px;
  font-weight: 900;
}

@media (max-width: 1100px) {
  .cabinet-specialist-role-card,
  .specialist-workspace-hero,
  .specialist-workspace-split-grid,
  .specialist-workspace-detail-grid,
  .specialist-workspace-session-grid,
  .specialist-workspace-statistics-card {
    grid-template-columns: 1fr;
  }

  .specialist-workspace-metrics-grid,
  .specialist-workspace-section-grid,
  .specialist-request-preview-list-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .cabinet-specialist-role-card,
  .specialist-workspace-hero,
  .specialist-workspace-simple-hero,
  .specialist-workspace-panel,
  .specialist-workspace-status-card,
  .specialist-workspace-statistics-card {
    padding: 20px;
    border-radius: 24px;
  }

  .cabinet-specialist-role-actions,
  .specialist-workspace-actions,
  .specialist-workspace-card-actions,
  .specialist-workspace-panel-head {
    flex-direction: column;
    align-items: stretch;
  }

  .cabinet-specialist-role-actions .button,
  .specialist-workspace-actions .button,
  .specialist-workspace-card-actions .button,
  .specialist-workspace-panel-head .button {
    width: 100%;
  }

  .specialist-workspace-metrics-grid,
  .specialist-workspace-section-grid,
  .specialist-request-preview-list-compact,
  .specialist-workspace-safe-dl,
  .specialist-profile-edit-grid,
  .specialist-workspace-mini-stats,
  .deck-session-cards {
    grid-template-columns: 1fr;
  }
}

/* Required trust-chip lock */
.trust-chip { height: 36px !important; margin-top: 20px !important; padding: 0 14px !important; }

/* =========================================================
   SPECIALIST REQUESTS WORKFLOW
   Scope only: specialist-requests.html + specialist-request-detail.html
========================================================= */
.specialist-request-dashboard-hero,
.specialist-request-detail-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .55fr);
  gap: 24px;
  align-items: stretch;
  padding: 36px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.97), rgba(248,238,244,.74));
  box-shadow: 0 18px 46px rgba(69,55,84,.065);
}

.specialist-request-privacy-card,
.specialist-request-detail-status-card,
.specialist-request-card,
.specialist-request-list-panel {
  min-width: 0;
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.94);
  box-shadow: 0 16px 42px rgba(69,55,84,.06);
}

.specialist-request-privacy-card,
.specialist-request-detail-status-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  justify-content: center;
  padding: 26px;
  border-radius: 28px;
}

.specialist-request-privacy-icon {
  display: inline-flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  border-radius: 18px;
  background: var(--section-color-soft);
  font-size: 22px;
}

.specialist-request-privacy-card h2,
.specialist-request-detail-status-card h2,
.specialist-request-list-head h2,
.specialist-request-filter-panel h2,
.specialist-request-card h3,
.specialist-request-detail-card h3 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: -.04em;
}

.specialist-request-privacy-card p,
.specialist-request-filter-note,
.specialist-request-card p,
.specialist-request-problem-box p,
.specialist-request-message p,
.specialist-request-unlocked-demo p {
  color: var(--text-secondary);
  line-height: 1.72;
}

.specialist-request-dashboard-section,
.specialist-request-detail-section {
  padding-top: 28px;
}

.specialist-request-metrics-grid {
  margin-top: 0;
}

.specialist-metric-card--new {
  background: linear-gradient(135deg, rgba(59,130,246,.11), rgba(255,255,255,.95));
}

.specialist-metric-card--work {
  background: linear-gradient(135deg, rgba(245,158,11,.13), rgba(255,255,255,.95));
}

.specialist-metric-card--closed {
  background: linear-gradient(135deg, rgba(34,197,94,.11), rgba(255,255,255,.95));
}

.specialist-metric-card--admin {
  background: linear-gradient(135deg, rgba(239,68,68,.10), rgba(255,255,255,.95));
}

.specialist-request-board-grid,
.specialist-request-detail-layout {
  display: grid;
  grid-template-columns: minmax(260px, .34fr) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.specialist-request-detail-layout {
  grid-template-columns: minmax(0, 1fr) minmax(300px, .42fr);
}

.specialist-request-filter-panel {
  position: sticky;
  top: 108px;
}

.specialist-filter-head {
  margin-bottom: 18px;
}

.specialist-request-filter-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid rgba(237,221,231,.72);
}

.specialist-request-filter-group button {
  appearance: none;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,.82);
  color: var(--text-secondary);
  cursor: default;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  padding: 10px 13px;
}

.specialist-request-filter-group button.is-active {
  border-color: rgba(181,123,190,.28);
  background: var(--section-color-soft);
  color: var(--section-color);
}

.specialist-request-filter-note {
  margin: 18px 0 0;
  padding: 14px;
  border-radius: 18px;
  background: var(--bg-primary);
  font-size: 14px;
}

.specialist-request-list-panel {
  padding: 28px;
  border-radius: var(--radius-lg);
}

.specialist-request-list-head {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 20px;
}

.specialist-request-card-list,
.specialist-request-detail-main,
.specialist-request-detail-sidebar {
  display: grid;
  gap: 16px;
}

.specialist-request-card {
  padding: 22px;
  border-radius: 26px;
}

.specialist-request-card--new {
  border-color: rgba(59,130,246,.22);
}

.specialist-request-card--work {
  border-color: rgba(245,158,11,.24);
}

.specialist-request-card--admin {
  border-color: rgba(239,68,68,.20);
}

.specialist-request-card--closed {
  border-color: rgba(34,197,94,.22);
}

.specialist-request-card-top {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: flex-start;
  justify-content: space-between;
}

.specialist-request-card-title {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.specialist-request-card-title h3 {
  flex: 1 1 100%;
  font-size: 22px;
  line-height: 1.25;
}

.specialist-request-card-top time {
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 800;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
}

.status-pill--new {
  color: #1D4ED8;
  border-color: rgba(59,130,246,.24);
  background: rgba(59,130,246,.10);
}

.status-pill--work {
  color: #B45309;
  border-color: rgba(245,158,11,.28);
  background: rgba(245,158,11,.12);
}

.status-pill--closed {
  color: #15803D;
  border-color: rgba(34,197,94,.28);
  background: rgba(34,197,94,.11);
}

.status-pill--admin {
  color: #B91C1C;
  border-color: rgba(239,68,68,.28);
  background: rgba(239,68,68,.10);
}

.status-pill--paid,
.status-pill--public {
  color: var(--section-color);
  border-color: rgba(181,123,190,.24);
  background: var(--section-color-soft);
}

.specialist-request-info-grid,
.specialist-request-detail-mini-dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0 0;
}

.specialist-request-detail-mini-dl {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.specialist-request-info-grid div,
.specialist-request-detail-mini-dl div {
  min-width: 0;
  padding: 13px;
  border-radius: 16px;
  background: var(--bg-primary);
}

.specialist-request-info-grid dt,
.specialist-request-info-grid dd,
.specialist-request-detail-mini-dl dt,
.specialist-request-detail-mini-dl dd {
  margin: 0;
}

.specialist-request-info-grid dt,
.specialist-request-detail-mini-dl dt {
  color: var(--text-secondary);
  font-size: 12px;
}

.specialist-request-info-grid dd,
.specialist-request-detail-mini-dl dd {
  margin-top: 5px;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.specialist-request-card-actions,
.specialist-request-sidebar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.specialist-request-sidebar-actions {
  flex-direction: column;
}

.button.button-ghost {
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.72);
  color: var(--text-secondary);
}

.button.button-ghost:hover {
  border-color: rgba(181,123,190,.34);
  color: var(--section-color);
}

.specialist-request-backend-notice {
  margin-top: 0;
}

.specialist-request-detail-card,
.specialist-request-actions-card,
.specialist-request-unlocked-demo {
  min-width: 0;
}

.specialist-request-detail-safe-dl {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.specialist-request-problem-box {
  margin-top: 18px;
  padding: 18px;
  border-radius: 22px;
  background: var(--section-color-soft);
}

.specialist-request-problem-box p {
  margin: 10px 0 0;
}

.specialist-request-timeline {
  display: grid;
  gap: 12px;
}

.specialist-request-message {
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: var(--bg-primary);
}

.specialist-request-message--client {
  background: rgba(248,239,251,.76);
}

.specialist-request-message--system {
  background: rgba(59,130,246,.08);
}

.specialist-request-message span,
.specialist-request-reply-box span {
  color: var(--section-color);
  font-size: 13px;
  font-weight: 900;
}

.specialist-request-message p {
  margin: 8px 0 0;
}

.specialist-request-reply-box {
  display: grid;
  gap: 10px;
}

.specialist-request-reply-box textarea {
  width: 100%;
  min-height: 150px;
  resize: vertical;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font: inherit;
  line-height: 1.6;
}

.specialist-request-lock-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.specialist-request-lock-list span {
  padding: 12px 14px;
  border-radius: 16px;
  background: var(--bg-primary);
  color: var(--text-secondary);
  font-size: 14px;
  font-weight: 800;
}

.specialist-request-unlocked-demo {
  border-color: rgba(34,197,94,.26);
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(34,197,94,.08));
}

.specialist-request-unlocked-demo .specialist-request-detail-mini-dl {
  grid-template-columns: 1fr;
}

@media (max-width: 1100px) {
  .specialist-request-dashboard-hero,
  .specialist-request-detail-hero,
  .specialist-request-board-grid,
  .specialist-request-detail-layout {
    grid-template-columns: 1fr;
  }

  .specialist-request-filter-panel {
    position: static;
  }

  .specialist-request-detail-safe-dl,
  .specialist-request-info-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .specialist-request-dashboard-hero,
  .specialist-request-detail-hero,
  .specialist-request-list-panel,
  .specialist-request-card {
    padding: 20px;
    border-radius: 24px;
  }

  .specialist-request-list-head,
  .specialist-request-card-top,
  .specialist-request-card-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .specialist-request-card-actions .button,
  .specialist-request-list-head .button {
    width: 100%;
  }

  .specialist-request-info-grid,
  .specialist-request-detail-mini-dl,
  .specialist-request-detail-safe-dl {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   SPECIALIST BLOG + PUBLIC PROFILE PUBLICATIONS
   Scope only: specialist-blog.html, specialist-blog-editor.html,
   specialist-cabinet blog card and specialist-profile.html publications
========================================================= */
.specialist-blog-hero,
.specialist-blog-moderation-card,
.specialist-blog-list-panel,
.specialist-blog-post-card,
.specialist-publication-card {
  min-width: 0;
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 46px rgba(69,55,84,.065);
}

.specialist-blog-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, .55fr);
  gap: 26px;
  align-items: stretch;
  padding: 36px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,238,244,.72));
}

.specialist-blog-moderation-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 28px;
  border-radius: var(--radius-lg);
}

.specialist-blog-icon,
.specialist-publication-icon,
.specialist-blog-cover {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: 22px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.specialist-blog-icon {
  width: 52px;
  height: 52px;
  margin-bottom: 18px;
  font-size: 24px;
}

.specialist-blog-moderation-card h2,
.specialist-blog-list-panel h2,
.specialist-blog-post-card h3,
.specialist-blog-checklist h2,
.specialist-publication-card h3 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: -.04em;
}

.specialist-blog-moderation-card p,
.specialist-blog-post-card p,
.specialist-blog-upload-box p,
.specialist-publication-card p {
  color: var(--text-secondary);
  line-height: 1.72;
}

.specialist-blog-moderation-card p,
.specialist-blog-post-card p,
.specialist-publication-card p {
  margin: 12px 0 0;
}

.specialist-blog-rule-list {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.specialist-blog-rule-list span {
  padding: 12px 14px;
  border-radius: 16px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 800;
}

.specialist-blog-dashboard-section,
.specialist-blog-editor-section {
  padding-top: 28px;
}

.specialist-blog-board-grid,
.specialist-blog-editor-layout {
  display: grid;
  grid-template-columns: minmax(260px, .34fr) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.specialist-blog-editor-layout {
  grid-template-columns: minmax(0, 1fr) minmax(320px, .42fr);
}

.specialist-blog-filter-panel {
  position: sticky;
  top: 108px;
}

.specialist-blog-list-panel {
  padding: 28px;
  border-radius: var(--radius-lg);
}

.specialist-blog-card-list {
  display: grid;
  gap: 16px;
}

.specialist-blog-post-card {
  padding: 22px;
  border-radius: 26px;
}

.specialist-blog-post-card--published {
  border-color: rgba(34,197,94,.22);
}

.specialist-blog-post-card--moderation {
  border-color: rgba(245,158,11,.24);
}

.specialist-blog-post-card--draft {
  border-color: rgba(59,130,246,.22);
}

.specialist-blog-card-top {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.specialist-blog-cover {
  width: 78px;
  height: 78px;
  font-size: 30px;
}

.specialist-blog-title-block {
  min-width: 0;
}

.specialist-blog-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.specialist-blog-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0 0;
}

.specialist-blog-meta div {
  min-width: 0;
  padding: 13px;
  border-radius: 16px;
  background: var(--bg-primary);
}

.specialist-blog-meta dt,
.specialist-blog-meta dd {
  margin: 0;
}

.specialist-blog-meta dt {
  color: var(--text-secondary);
  font-size: 12px;
}

.specialist-blog-meta dd {
  margin-top: 5px;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.specialist-cabinet-blog-preview {
  background: linear-gradient(135deg, var(--section-color-soft), rgba(255,255,255,.86));
}

.specialist-workspace-section-card--blog {
  border-color: rgba(181,123,190,.22);
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(248,239,251,.78));
}

.specialist-blog-editor-form,
.specialist-blog-editor-sidebar {
  display: grid;
  gap: 20px;
}

.specialist-blog-editor-group,
.specialist-blog-editor-field {
  display: grid;
  gap: 10px;
}

.specialist-blog-type-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.specialist-blog-type-grid label {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 12px 14px;
  border: 1px solid var(--border-default);
  border-radius: 18px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-weight: 800;
}

.specialist-blog-type-grid input {
  accent-color: var(--section-color);
}

.specialist-blog-editor-field > span,
.specialist-blog-editor-group > span {
  color: var(--text-primary);
  font-weight: 850;
}

.specialist-blog-editor-field input,
.specialist-blog-editor-field textarea {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid var(--border-default);
  border-radius: 18px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font: inherit;
  line-height: 1.6;
}

.specialist-blog-editor-field input {
  min-height: 52px;
}

.specialist-blog-editor-field textarea {
  min-height: 128px;
  resize: vertical;
}

.specialist-blog-editor-field .specialist-blog-editor-body {
  min-height: 250px;
}

.specialist-blog-upload-box {
  padding: 18px;
  border: 1px dashed rgba(181,123,190,.42);
  border-radius: 22px;
  background: var(--section-color-soft);
}

.specialist-blog-upload-box strong {
  display: block;
  color: var(--text-primary);
}

.specialist-blog-upload-box p {
  margin: 8px 0 0;
}

.specialist-blog-editor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.specialist-blog-editor-actions .button {
  border: 0;
  cursor: pointer;
  font-family: inherit;
}

.specialist-blog-checklist {
  padding: 18px;
  border-radius: 22px;
  background: var(--bg-primary);
}

.specialist-blog-checklist ul {
  display: grid;
  gap: 10px;
  margin: 14px 0 0;
  padding-left: 20px;
  color: var(--text-secondary);
  line-height: 1.6;
}

.specialist-publications-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.specialist-publication-card {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 18px;
  padding: 22px;
  border-radius: 26px;
}

.specialist-publication-icon {
  width: 72px;
  height: 72px;
  font-size: 28px;
}

.specialist-publication-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
}

.specialist-publication-meta span:not(.badge) {
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 800;
}

.specialist-publication-body .text-link {
  display: inline-flex;
  margin-top: 14px;
}

@media (max-width: 1100px) {
  .specialist-blog-hero,
  .specialist-blog-board-grid,
  .specialist-blog-editor-layout {
    grid-template-columns: 1fr;
  }

  .specialist-blog-filter-panel {
    position: static;
  }
}

@media (max-width: 720px) {
  .specialist-blog-hero,
  .specialist-blog-moderation-card,
  .specialist-blog-list-panel,
  .specialist-blog-post-card {
    padding: 20px;
    border-radius: 24px;
  }

  .specialist-blog-card-top,
  .specialist-publication-card {
    grid-template-columns: 1fr;
  }

  .specialist-blog-meta,
  .specialist-blog-type-grid,
  .specialist-publications-grid {
    grid-template-columns: 1fr;
  }

  .specialist-blog-cover,
  .specialist-publication-icon {
    width: 64px;
    height: 64px;
  }

  .specialist-blog-editor-actions .button {
    width: 100%;
  }
}

/* keep the locked trust-chip exactly as required */
.trust-chip { height: 36px !important; margin-top: 20px !important; padding: 0 14px !important; }


/* Specialist workspace badge spacing safety */
.specialist-workspace-page .badge + h1,
.specialist-workspace-page .badge + h2,
.specialist-workspace-page .badge + h3,
.specialist-request-dashboard-hero .badge + h1,
.specialist-request-detail-hero .badge + h1,
.specialist-request-list-head .badge + h2,
.specialist-filter-head .badge + h2,
.specialist-blog-page .badge + h1,
.specialist-blog-page .badge + h2,
.specialist-blog-page .badge + h3,
.specialist-blog-editor-page .badge + h1,
.specialist-blog-editor-page .badge + h2,
.specialist-blog-editor-page .badge + h3,
.specialist-profile-page .section-head .badge + h2 {
  margin-top: 12px;
}

.specialist-request-card-title .status-pill,
.specialist-blog-status-row .status-pill {
  margin-bottom: 2px;
}


/* =========================================================
   BLOG UI PASS 2 — consent card, spacing, safer detail rhythm,
   uniform cabinet section cards and injected blog nav link
========================================================= */
.specialist-blog-consent-card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 18px 20px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: rgba(248, 239, 251, 0.72);
}

.specialist-blog-consent-card input[type="checkbox"] {
  width: 22px;
  height: 22px;
  margin-top: 2px;
  accent-color: var(--brand-primary);
  flex: 0 0 auto;
}

.specialist-blog-consent-card span {
  color: var(--text-secondary);
  line-height: 1.65;
}

.specialist-blog-editor-actions {
  margin-top: 6px;
}

.specialist-blog-list-panel .specialist-blog-found-count {
  margin: 18px 0 24px;
  color: var(--text-secondary);
  font-size: 15px;
  font-weight: 700;
}

.specialist-blog-card-list {
  gap: 18px;
}

.specialist-blog-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.52fr);
  gap: 22px;
  align-items: start;
}

.specialist-blog-detail-content,
.specialist-blog-detail-sidebar-card {
  min-width: 0;
  padding: 28px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 46px rgba(69,55,84,.065);
}

.specialist-blog-detail-safe-card h2,
.specialist-blog-detail-sidebar-card h2 {
  margin: 14px 0 0;
  color: var(--text-primary);
}

.specialist-blog-detail-sidebar-card p,
.specialist-blog-detail-content p {
  color: var(--text-secondary);
  line-height: 1.72;
}

.specialist-blog-detail-content p + p {
  margin-top: 16px;
}

.specialist-blog-detail-safe-card {
  margin-top: 18px;
  padding: 22px;
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(248,239,251,.82), rgba(255,255,255,.95));
  border: 1px solid var(--border-default);
}

.specialist-workspace-section-card {
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(248,239,251,.82));
  border-color: rgba(181,123,190,.18);
}

.specialist-workspace-section-card:nth-child(1),
.specialist-workspace-section-card:nth-child(4) {
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(242,247,255,.84));
}

.specialist-workspace-section-card:nth-child(2),
.specialist-workspace-section-card:nth-child(5) {
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(248,239,251,.84));
}

.specialist-workspace-section-card:nth-child(3),
.specialist-workspace-section-card:nth-child(6),
.specialist-workspace-section-card:nth-child(7) {
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(245,242,252,.88));
}

.main-nav a[data-i18n="navBlogSpecialists"] {
  white-space: nowrap;
}

.home-blog-showcase-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .52fr);
  gap: 24px;
  align-items: stretch;
}

.home-blog-showcase-card,
.home-blog-side-card {
  padding: 30px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 46px rgba(69,55,84,.06);
}

.home-blog-showcase-card p,
.home-blog-side-card p {
  color: var(--text-secondary);
  line-height: 1.72;
}

.home-blog-mini-posts {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.home-blog-mini-post {
  padding: 18px;
  border-radius: 22px;
  background: var(--bg-primary);
}

.home-blog-mini-post h3 {
  margin: 10px 0 0;
  color: var(--text-primary);
}

.home-blog-mini-post p {
  margin: 10px 0 0;
}

@media (max-width: 980px) {
  .specialist-blog-detail-layout,
  .home-blog-showcase-grid {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   BLOG PUBLIC + CONSENT CHECKBOX POLISH
========================================================= */
.blog-public-page .section {
  padding-top: 28px;
}

.blog-public-hero-section {
  padding-top: 18px;
}

.blog-public-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.72fr);
  gap: 24px;
  padding: 34px;
  border: 1px solid var(--border-default);
  border-radius: 36px;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,239,251,.86));
  box-shadow: 0 18px 42px rgba(69,55,84,.05);
}

.blog-public-hero-copy h1 {
  margin: 14px 0 0;
  max-width: 780px;
}

.blog-public-hero-copy > p {
  margin: 16px 0 0;
  max-width: 760px;
  color: var(--text-secondary);
  line-height: 1.72;
}

.blog-public-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.blog-public-hero-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.blog-public-hero-pill {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.88);
  color: var(--text-secondary);
  font-weight: 700;
}

.blog-public-hero-pill.is-active,
.blog-public-hero-pill:hover {
  color: var(--brand-primary);
  border-color: rgba(181,123,190,.35);
  background: rgba(248,239,251,.9);
}

.blog-public-highlight-stack {
  display: grid;
  gap: 16px;
}

.blog-public-highlight-card {
  padding: 24px;
  border-radius: 28px;
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.92);
}

.blog-public-highlight-card.is-primary {
  background: linear-gradient(180deg, rgba(248,239,251,.92), rgba(255,255,255,.96));
}

.blog-public-highlight-card h2,
.blog-public-highlight-card h3 {
  margin: 12px 0 0;
}

.blog-public-highlight-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  line-height: 1.68;
}

.blog-public-highlight-card .text-link {
  display: inline-flex;
  margin-top: 14px;
}

.blog-public-feed-shell {
  padding: 32px;
  border: 1px solid var(--border-default);
  border-radius: 36px;
  background: rgba(255,255,255,.92);
}

.blog-public-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .7fr);
  gap: 20px;
  align-items: end;
}

.blog-public-head p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.7;
}

.blog-public-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.pill-button {
  min-height: 44px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.88);
  color: var(--text-secondary);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.pill-button.is-active,
.pill-button:hover {
  background: rgba(181,123,190,.95);
  border-color: rgba(181,123,190,.95);
  color: #fff;
}

.blog-public-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 24px;
}

.blog-public-post-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 24px;
  border-radius: 28px;
  border: 1px solid var(--border-default);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,239,251,.68));
}

.blog-public-post-top {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.blog-public-post-card h3 {
  margin: 14px 0 0;
}

.blog-public-post-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  line-height: 1.7;
}

.blog-public-post-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.blog-public-post-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 16px;
  background: rgba(248,239,251,.78);
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 700;
}

.blog-public-post-card .text-link {
  display: inline-flex;
  margin-top: 16px;
}

.specialist-blog-consent-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 68px;
  padding: 18px 20px;
  border: 1px solid var(--border-default);
  border-radius: 24px;
  background: rgba(255,255,255,.82);
}

.specialist-blog-consent-card input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 28px;
  height: 28px;
  margin: 0;
  border: 1.5px solid rgba(181,123,190,.38);
  border-radius: 10px;
  background: #fff;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.specialist-blog-consent-card input[type="checkbox"]::after {
  content: "";
  width: 8px;
  height: 14px;
  border-right: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: rotate(45deg) scale(0);
  transform-origin: center;
  margin-top: -2px;
  transition: transform .18s ease;
}

.specialist-blog-consent-card input[type="checkbox"]:checked {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
  box-shadow: 0 10px 24px rgba(181,123,190,.18);
}

.specialist-blog-consent-card input[type="checkbox"]:checked::after {
  transform: rotate(45deg) scale(1);
}

.specialist-blog-consent-card span {
  color: var(--text-primary);
  font-weight: 700;
  line-height: 1.6;
}

.specialist-blog-editor-actions {
  margin-top: 12px;
}

.main-nav a[data-i18n="navBlogSpecialists"] {
  position: relative;
}

@media (max-width: 1120px) {
  .blog-public-hero-card,
  .blog-public-head,
  .blog-public-cards-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .blog-public-hero-card,
  .blog-public-feed-shell,
  .blog-public-highlight-card,
  .blog-public-post-card {
    padding: 22px;
    border-radius: 24px;
  }

  .blog-public-hero-actions .button,
  .blog-public-hero-pill,
  .pill-button {
    width: 100%;
    justify-content: center;
  }
}

/* =========================================================
   BLOG EDITOR FIX — material type options as project checkmarks
   and stable editor preview width
========================================================= */
.specialist-blog-editor-page .specialist-blog-type-grid label {
  cursor: pointer;
  user-select: none;
}

.specialist-blog-editor-page .specialist-blog-type-grid input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  width: 24px;
  min-width: 24px;
  height: 24px;
  margin: 0;
  border: 1.5px solid rgba(181, 123, 190, 0.38);
  border-radius: 9px;
  background: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.specialist-blog-editor-page .specialist-blog-type-grid input[type="radio"]::after {
  content: "";
  width: 7px;
  height: 12px;
  border-right: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: rotate(45deg) scale(0);
  transform-origin: center;
  margin-top: -2px;
  transition: transform .18s ease;
}

.specialist-blog-editor-page .specialist-blog-type-grid label:has(input[type="radio"]:checked) {
  border-color: rgba(174, 123, 196, 0.46);
  background: rgba(248, 239, 251, 0.88);
}

.specialist-blog-editor-page .specialist-blog-type-grid input[type="radio"]:checked {
  border-color: var(--brand-primary);
  background: var(--brand-primary);
  box-shadow: 0 10px 24px rgba(181, 123, 190, 0.16);
}

.specialist-blog-editor-page .specialist-blog-type-grid input[type="radio"]:checked::after {
  transform: rotate(45deg) scale(1);
}

.specialist-blog-editor-page .specialist-blog-type-grid input[type="radio"]:focus-visible {
  outline: 3px solid rgba(181, 123, 190, 0.22);
  outline-offset: 3px;
}

.specialist-blog-editor-sidebar .specialist-blog-post-card {
  width: 100%;
}

.specialist-blog-editor-sidebar .specialist-blog-card-top {
  grid-template-columns: 1fr;
}

.specialist-blog-editor-sidebar .specialist-blog-cover {
  width: 76px;
  height: 76px;
}

.specialist-blog-editor-sidebar .specialist-blog-title-block h3,
.specialist-blog-editor-sidebar .specialist-blog-title-block p {
  max-width: 100%;
}


/* =========================================================
   FINAL FIXED/STICKY HEADER PASS — 2026-04-21
   Keeps the rounded header visible while scrolling without
   adding a separate background strip. CSS-only, no JS.
========================================================= */
:root {
  --fixed-header-space: 164px;
}

html {
  scroll-padding-top: calc(var(--fixed-header-space) + 24px);
}

.site-header {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  left: 0 !important;
  z-index: 5000 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 8px 8px 0 !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.site-header .header-shell,
.site-header > .container,
.site-header .container {
  width: min(calc(100% - 16px), 1408px) !important;
  max-width: 1408px !important;
  margin: 0 auto !important;
  background: var(--surface-white) !important;
  box-shadow: none !important;
}

.page-shell > .site-header + main {
  padding-top: var(--fixed-header-space) !important;
}

.section,
[id] {
  scroll-margin-top: calc(var(--fixed-header-space) + 24px);
}

@media (max-width: 980px) {
  :root {
    --fixed-header-space: 230px;
  }
}

@media (max-width: 720px) {
  :root {
    --fixed-header-space: 320px;
  }
}

@media (max-width: 560px) {
  :root {
    --fixed-header-space: 432px;
  }
}

/* =========================================================
   SPECIALIST PUBLIC QUESTIONS — worker open Q&A screen
   Scope only: specialist-public-questions.html
========================================================= */
.specialist-public-questions-page .badge,
.specialist-public-questions-page .status-pill {
  margin-bottom: 0;
}

.specialist-public-hero,
.specialist-public-rules-card,
.specialist-public-list-panel,
.specialist-public-question-card,
.specialist-public-detail-card,
.specialist-public-empty-card {
  min-width: 0;
  border: 1px solid var(--border-default);
  background: rgba(255,255,255,.94);
  box-shadow: 0 18px 46px rgba(69,55,84,.065);
}

.specialist-public-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(310px, .55fr);
  gap: 26px;
  align-items: stretch;
  padding: 36px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,238,244,.72));
}

.specialist-public-rules-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 28px;
  border-radius: var(--radius-lg);
}

.specialist-public-rules-icon {
  display: inline-flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  border-radius: 20px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 24px;
  font-weight: 900;
}

.specialist-public-rules-card h2,
.specialist-public-filter-panel h2,
.specialist-public-list-panel h2,
.specialist-public-question-card h3,
.specialist-public-detail-card h2,
.specialist-public-detail-card h3,
.specialist-public-empty-card h3,
.specialist-public-answer-form h3 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: -.04em;
}

.specialist-public-rules-card p,
.specialist-public-question-card p,
.specialist-public-detail-card p,
.specialist-public-empty-card p,
.specialist-public-filter-note,
.specialist-public-ethics-note {
  color: var(--text-secondary);
  line-height: 1.72;
}

.specialist-public-rule-list {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.specialist-public-rule-list span {
  padding: 12px 14px;
  border-radius: 16px;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.55;
}

.specialist-public-metrics-section,
.specialist-public-board-section,
.specialist-public-notice-section {
  padding-top: 28px;
}

.specialist-public-metrics-grid {
  margin-top: 0;
}

.specialist-public-board-grid {
  display: grid;
  grid-template-columns: minmax(250px, .32fr) minmax(0, 1fr) minmax(310px, .45fr);
  gap: 22px;
  align-items: start;
}

.specialist-public-filter-panel,
.specialist-public-detail-sidebar {
  position: sticky;
  top: calc(var(--fixed-header-space) + 22px);
}

.specialist-public-filter-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid rgba(237,221,231,.72);
}

.specialist-public-filter-group button {
  appearance: none;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,.82);
  color: var(--text-secondary);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  padding: 10px 13px;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}

.specialist-public-filter-group button:hover {
  transform: translateY(-1px);
  border-color: rgba(181,123,190,.34);
  color: var(--section-color);
}

.specialist-public-filter-group button.is-active {
  border-color: rgba(181,123,190,.28);
  background: var(--section-color-soft);
  color: var(--section-color);
}

.specialist-public-filter-note {
  margin: 18px 0 0;
  padding: 14px;
  border-radius: 18px;
  background: var(--bg-primary);
  font-size: 14px;
}

.specialist-public-list-panel,
.specialist-public-detail-card {
  padding: 28px;
  border-radius: var(--radius-lg);
}

.specialist-public-list-head {
  margin-bottom: 20px;
}

.specialist-public-question-list {
  display: grid;
  gap: 16px;
}

.specialist-public-question-card,
.specialist-public-empty-card {
  padding: 22px;
  border-radius: 26px;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.specialist-public-question-card.is-selected {
  border-color: rgba(181,123,190,.42);
  box-shadow: 0 20px 52px rgba(181,123,190,.095);
}

.specialist-public-question-card:hover {
  transform: translateY(-1px);
  border-color: rgba(181,123,190,.30);
}

.specialist-public-question-top {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  justify-content: space-between;
}

.specialist-public-question-title {
  min-width: 0;
}

.specialist-public-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.specialist-public-question-card h3 {
  font-size: 21px;
  line-height: 1.28;
}

.specialist-public-question-card p {
  margin: 12px 0 0;
}

.specialist-public-question-top time {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 850;
}

.specialist-public-info-grid,
.specialist-public-detail-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0 0;
}

.specialist-public-detail-meta {
  grid-template-columns: 1fr;
}

.specialist-public-info-grid div,
.specialist-public-detail-meta div {
  min-width: 0;
  padding: 13px;
  border-radius: 16px;
  background: var(--bg-primary);
}

.specialist-public-info-grid dt,
.specialist-public-info-grid dd,
.specialist-public-detail-meta dt,
.specialist-public-detail-meta dd {
  margin: 0;
}

.specialist-public-info-grid dt,
.specialist-public-detail-meta dt {
  color: var(--text-secondary);
  font-size: 12px;
}

.specialist-public-info-grid dd,
.specialist-public-detail-meta dd {
  margin-top: 5px;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.specialist-public-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.specialist-public-card-actions .button {
  border: 0;
  cursor: pointer;
  font-family: inherit;
}

.specialist-public-detail-card {
  display: grid;
  gap: 18px;
}

.specialist-public-detail-head h2 {
  font-size: 25px;
  line-height: 1.25;
}

.specialist-public-question-box,
.specialist-public-dialog-box,
.specialist-public-answer-form {
  padding: 18px;
  border-radius: 22px;
  background: var(--bg-primary);
}

.specialist-public-question-box p {
  margin: 10px 0 0;
}

.specialist-public-dialog-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.specialist-public-dialog-message {
  padding: 15px;
  border: 1px solid var(--border-default);
  border-radius: 18px;
  background: rgba(255,255,255,.74);
}

.specialist-public-dialog-message--client {
  background: rgba(248,239,251,.84);
}

.specialist-public-dialog-message--specialist {
  background: rgba(34,197,94,.08);
}

.specialist-public-dialog-message--system {
  background: rgba(59,130,246,.08);
}

.specialist-public-dialog-message span,
.specialist-public-answer-field > span {
  color: var(--section-color);
  font-size: 13px;
  font-weight: 900;
}

.specialist-public-dialog-message p {
  margin: 8px 0 0;
}

.specialist-public-answer-form {
  display: grid;
  gap: 14px;
}

.specialist-public-answer-field {
  display: grid;
  gap: 10px;
}

.specialist-public-answer-field textarea {
  width: 100%;
  min-height: 150px;
  resize: vertical;
  padding: 16px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: rgba(255,255,255,.76);
  color: var(--text-primary);
  font: inherit;
  line-height: 1.65;
}

.specialist-public-upload-box {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px dashed rgba(181,123,190,.42);
  border-radius: 20px;
  background: rgba(248,239,251,.72);
  cursor: pointer;
}

.specialist-public-upload-box input {
  width: 100%;
  color: var(--text-secondary);
  font: inherit;
  font-size: 13px;
}

.specialist-public-upload-box strong {
  color: var(--text-primary);
}

.specialist-public-upload-box p,
.specialist-public-ethics-note {
  margin: 0;
  font-size: 14px;
}

.specialist-public-ethics-note {
  padding: 13px 14px;
  border-radius: 18px;
  background: rgba(245,158,11,.10);
}

.specialist-public-backend-notice {
  margin-top: 0;
}

@media (max-width: 1180px) {
  .specialist-public-board-grid,
  .specialist-public-hero {
    grid-template-columns: 1fr;
  }

  .specialist-public-filter-panel,
  .specialist-public-detail-sidebar {
    position: static;
  }
}

@media (max-width: 820px) {
  .specialist-public-board-grid {
    grid-template-columns: 1fr;
  }

  .specialist-public-info-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .specialist-public-hero,
  .specialist-public-rules-card,
  .specialist-public-list-panel,
  .specialist-public-detail-card,
  .specialist-public-question-card {
    padding: 20px;
    border-radius: 24px;
  }

  .specialist-public-question-top,
  .specialist-public-card-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .specialist-public-card-actions .button,
  .specialist-public-hero .button {
    width: 100%;
  }
}

/* Deck library and deck session — specialist workspace step */
.deck-library-page,
.deck-workbench-page {
  overflow-x: hidden;
}

.deck-library-hero,
.deck-workbench-hero {
  align-items: stretch;
}

.deck-library-status,
.deck-workbench-linked-request {
  align-self: stretch;
}

.deck-library-metrics-section,
.deck-library-section,
.deck-library-bottom-section,
.deck-workbench-section,
.deck-workbench-notes-section {
  padding-top: 0;
}

.deck-library-layout {
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.deck-library-filter-panel {
  position: sticky;
  top: 164px;
  display: grid;
  gap: 18px;
}

.deck-library-search-label,
.deck-workbench-field {
  display: grid;
  gap: 10px;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.5;
}

.deck-library-search,
.deck-workbench-select,
.deck-workbench-textarea {
  width: 100%;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text-primary);
  font: inherit;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.deck-library-search,
.deck-workbench-select {
  min-height: 52px;
  padding: 0 18px;
}

.deck-workbench-textarea {
  min-height: 170px;
  padding: 16px 18px;
  resize: vertical;
}

.deck-library-search:focus,
.deck-workbench-select:focus,
.deck-workbench-textarea:focus {
  border-color: rgba(181, 123, 190, 0.55);
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.12);
  background: #fff;
}

.deck-library-filter-block {
  display: grid;
  gap: 10px;
}

.deck-library-filter-block > p {
  margin: 0;
  color: var(--text-primary);
  font-weight: 700;
}

.deck-library-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.deck-library-filter {
  min-height: 38px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.72);
  color: var(--text-secondary);
  font: inherit;
  font-weight: 700;
  padding: 0 14px;
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.deck-library-filter:hover,
.deck-library-filter.is-active {
  border-color: rgba(181, 123, 190, 0.45);
  background: var(--section-color-soft);
  color: var(--brand-primary);
  transform: translateY(-1px);
}

.deck-library-filter-note,
.deck-workbench-layout-name,
.deck-workbench-selected-deck {
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(248, 239, 251, 0.72);
  padding: 16px;
}

.deck-library-filter-note strong {
  display: block;
  margin-bottom: 8px;
  color: var(--text-primary);
}

.deck-library-filter-note p {
  margin: 0;
}

.deck-library-content {
  min-width: 0;
}

.deck-library-heading {
  margin-bottom: 20px;
  align-items: end;
}

.deck-library-count {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: var(--radius-pill);
  background: var(--info-soft);
  color: #3b68c5;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}

.deck-library-grid {
  display: grid;
  gap: 18px;
}

.deck-library-card {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 18px;
  border: 1px solid var(--border-default);
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.82);
  padding: 18px;
  box-shadow: 0 18px 42px rgba(69, 55, 84, 0.06);
}

.deck-library-card[hidden] {
  display: none;
}

.deck-library-card-visual {
  min-height: 190px;
  border: 1px solid var(--border-default);
  border-radius: 26px;
  background: linear-gradient(145deg, rgba(248, 239, 251, 0.96), rgba(255, 247, 250, 0.92));
  display: grid;
  place-items: center;
}

.deck-library-card-visual span {
  width: 78px;
  height: 78px;
  border-radius: 28px;
  display: grid;
  place-items: center;
  background: #fff;
  color: var(--brand-primary);
  font-size: 30px;
  font-weight: 800;
  box-shadow: 0 16px 34px rgba(69, 55, 84, 0.06);
}

.deck-library-card-body {
  min-width: 0;
  display: grid;
  gap: 12px;
}

.deck-library-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 2px;
}

.deck-library-card h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.18;
}

.deck-library-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.8;
}

.deck-library-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.deck-library-meta div {
  border: 1px solid var(--border-default);
  border-radius: 18px;
  background: rgba(255, 247, 250, 0.72);
  padding: 12px 14px;
}

.deck-library-meta dt,
.deck-library-meta dd {
  margin: 0;
}

.deck-library-meta dt {
  color: var(--text-secondary);
  font-size: 12px;
  margin-bottom: 4px;
}

.deck-library-meta dd {
  color: var(--text-primary);
  font-weight: 800;
}

.deck-library-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.deck-library-tags span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: var(--radius-pill);
  background: rgba(248, 239, 251, 0.82);
  color: var(--brand-primary);
  padding: 0 12px;
  font-size: 13px;
  font-weight: 700;
}

.deck-library-check-list,
.deck-workbench-position-list {
  display: grid;
  gap: 12px;
  margin: 18px 0 0;
  padding-left: 22px;
  color: var(--text-secondary);
  line-height: 1.7;
}

.deck-workbench-layout {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.deck-workbench-setup,
.deck-workbench-notes,
.deck-workbench-positions {
  display: grid;
  gap: 18px;
}

.deck-workbench-choice-grid {
  display: grid;
  gap: 10px;
}

.deck-workbench-choice {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px 12px;
  text-align: left;
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.78);
  padding: 14px;
  cursor: pointer;
  color: var(--text-primary);
  font: inherit;
}

.deck-workbench-choice > span {
  grid-row: span 2;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid rgba(181, 123, 190, 0.35);
  background: #fff;
  position: relative;
}

.deck-workbench-choice.is-active {
  background: var(--section-color-soft);
  border-color: rgba(181, 123, 190, 0.42);
}

.deck-workbench-choice.is-active > span {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
}

.deck-workbench-choice.is-active > span::after {
  content: '';
  position: absolute;
  left: 9px;
  top: 5px;
  width: 7px;
  height: 13px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

.deck-workbench-choice strong {
  font-size: 15px;
}

.deck-workbench-choice small {
  color: var(--text-secondary);
  line-height: 1.45;
}

.deck-workbench-count {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.deck-workbench-count button {
  min-height: 46px;
  border: 1px solid var(--border-default);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text-primary);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.deck-workbench-count button.is-active {
  background: var(--brand-primary);
  color: #fff;
  border-color: var(--brand-primary);
}

.deck-workbench-actions {
  margin-top: 0;
}

.deck-workbench-table {
  min-width: 0;
}

.deck-workbench-selected-deck {
  margin: 18px 0;
  color: var(--text-primary);
  font-weight: 700;
  line-height: 1.6;
}

.deck-workbench-empty {
  min-height: 280px;
  border: 1px dashed rgba(181, 123, 190, 0.35);
  border-radius: 28px;
  background: rgba(248, 239, 251, 0.55);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  text-align: center;
  padding: 34px;
}

.deck-workbench-empty[hidden] {
  display: none;
}

.deck-workbench-empty span {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 26px;
  background: #fff;
  color: var(--brand-primary);
  font-size: 30px;
}

.deck-workbench-empty h3,
.deck-workbench-empty p {
  margin: 0;
}

.deck-workbench-empty p {
  max-width: 540px;
  color: var(--text-secondary);
  line-height: 1.7;
}

.deck-workbench-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 16px;
}

.deck-workbench-card {
  min-height: 300px;
  border: 1px solid var(--border-default);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.86);
  padding: 18px;
  display: grid;
  align-content: start;
  gap: 14px;
  position: relative;
  box-shadow: 0 16px 34px rgba(69, 55, 84, 0.06);
}

.deck-workbench-card-number {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--info-soft);
  color: #3b68c5;
  font-size: 13px;
  font-weight: 800;
}

.deck-workbench-card-face,
.deck-workbench-card-back {
  width: 100%;
  min-height: 150px;
  border-radius: 24px;
  display: grid;
  place-items: center;
  color: var(--brand-primary);
  font-size: 32px;
  font-weight: 800;
}

.deck-workbench-card-face {
  background: linear-gradient(145deg, rgba(248, 239, 251, 0.94), rgba(255, 247, 250, 0.95));
  border: 1px solid var(--border-default);
}

.deck-workbench-card-back {
  background: linear-gradient(145deg, rgba(181, 123, 190, 0.16), rgba(59, 130, 246, 0.10));
  border: 1px dashed rgba(181, 123, 190, 0.45);
}

.deck-workbench-card h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.25;
}

.deck-workbench-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.7;
}

.deck-workbench-notes-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(360px, 1.15fr);
  gap: 24px;
  align-items: start;
}

.deck-workbench-backend-notice {
  grid-column: 1 / -1;
}

@media (max-width: 1100px) {
  .deck-library-layout,
  .deck-workbench-layout,
  .deck-workbench-notes-grid {
    grid-template-columns: 1fr;
  }

  .deck-library-filter-panel {
    position: static;
  }
}

@media (max-width: 760px) {
  .deck-library-card {
    grid-template-columns: 1fr;
  }

  .deck-library-card-visual {
    min-height: 150px;
  }

  .deck-library-heading,
  .specialist-workspace-panel-head {
    align-items: start;
  }

  .deck-library-count {
    width: 100%;
    justify-content: center;
    white-space: normal;
    text-align: center;
  }

  .deck-library-meta,
  .deck-workbench-count {
    grid-template-columns: 1fr;
  }

  .deck-workbench-cards {
    grid-template-columns: 1fr;
  }

  .deck-workbench-card {
    min-height: auto;
  }
}

/* Rider-Waite deck integration — shared with Card of the Day */
.deck-library-card-waite .deck-library-waite-visual {
  padding: 12px;
  background: linear-gradient(145deg, rgba(248, 239, 251, 0.9), rgba(255, 247, 250, 0.96));
}

.deck-library-waite-visual img {
  width: 100%;
  max-height: 210px;
  object-fit: contain;
  border-radius: 18px;
  box-shadow: 0 14px 26px rgba(69, 55, 84, 0.08);
}

.deck-workbench-card-face.has-image {
  min-height: 0;
  padding: 10px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid var(--border-default);
}

.deck-workbench-card-face.has-image img {
  width: 100%;
  max-height: 290px;
  object-fit: contain;
  border-radius: 18px;
  box-shadow: 0 14px 28px rgba(69, 55, 84, 0.08);
}

.deck-workbench-card-back span,
.deck-workbench-card-face span {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.72);
}

.deck-workbench-card.is-closed {
  background: rgba(248, 239, 251, 0.58);
}

@media (max-width: 760px) {
  .deck-library-waite-visual img,
  .deck-workbench-card-face.has-image img {
    max-height: 240px;
  }
}


/* Deck session polish — scoped spacing/text fixes */
.deck-workbench-page .deck-workbench-notes-section {
  padding-top: 28px;
}

.deck-workbench-page .deck-workbench-notes-grid {
  grid-template-columns: minmax(360px, 0.95fr) minmax(420px, 1.05fr);
  gap: 28px;
  align-items: stretch;
}

.deck-workbench-page .deck-workbench-positions,
.deck-workbench-page .deck-workbench-notes {
  min-height: 100%;
  padding: 28px;
}

.deck-workbench-page .deck-workbench-positions h2,
.deck-workbench-page .deck-workbench-notes h2 {
  margin: 12px 0 16px;
  line-height: 1.25;
}

.deck-workbench-page .deck-workbench-notes p {
  margin: 0 0 18px;
  max-width: 760px;
  color: var(--text-secondary);
  line-height: 1.75;
}

.deck-workbench-page .deck-workbench-position-list {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 12px;
  counter-reset: deck-position;
}

.deck-workbench-page .deck-workbench-position-list li {
  counter-increment: deck-position;
  position: relative;
  padding: 14px 16px 14px 54px;
  border: 1px solid var(--border-default);
  border-radius: 20px;
  background: rgba(255, 247, 250, 0.68);
  color: var(--text-secondary);
  line-height: 1.65;
}

.deck-workbench-page .deck-workbench-position-list li::before {
  content: counter(deck-position);
  position: absolute;
  left: 16px;
  top: 14px;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--brand-primary);
  font-size: 12px;
  font-weight: 800;
}

.deck-workbench-page .deck-workbench-textarea {
  min-height: 178px;
  line-height: 1.7;
}

.deck-workbench-page .deck-workbench-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.deck-workbench-page .deck-workbench-actions .button {
  margin: 0;
}

.deck-workbench-page .deck-workbench-backend-notice {
  grid-column: 1 / -1;
  padding: 20px 24px;
  text-align: left;
  border-radius: 26px;
  display: grid;
  grid-template-columns: minmax(160px, max-content) minmax(0, 1fr);
  gap: 14px 20px;
  align-items: center;
}

.deck-workbench-page .deck-workbench-backend-notice span {
  margin: 0;
  color: var(--brand-primary);
  font-weight: 800;
  line-height: 1.35;
}

.deck-workbench-page .deck-workbench-backend-notice p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.65;
}

@media (max-width: 1100px) {
  .deck-workbench-page .deck-workbench-notes-grid,
  .deck-workbench-page .deck-workbench-backend-notice {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .deck-workbench-page .deck-workbench-notes-section {
    padding-top: 18px;
  }

  .deck-workbench-page .deck-workbench-positions,
  .deck-workbench-page .deck-workbench-notes {
    padding: 20px;
  }

  .deck-workbench-page .deck-workbench-position-list li {
    padding: 14px 14px 14px 48px;
  }

  .deck-workbench-page .deck-workbench-actions .button {
    width: 100%;
  }
}


/* Deck pages — final section spacing fix */
.deck-library-page,
.deck-workbench-page {
  --deck-section-gap: 34px;
}

.deck-library-page .specialist-workspace-hero-section,
.deck-workbench-page .specialist-workspace-hero-section {
  padding-bottom: var(--deck-section-gap);
}

.deck-library-page .deck-library-metrics-section {
  padding-top: 0;
  padding-bottom: var(--deck-section-gap);
}

.deck-library-page .deck-library-section,
.deck-workbench-page .deck-workbench-section {
  padding-top: 0;
  padding-bottom: 44px;
}

.deck-library-page .deck-library-bottom-section,
.deck-workbench-page .deck-workbench-notes-section {
  padding-top: 44px;
  padding-bottom: 72px;
}

.deck-library-page .deck-library-metrics,
.deck-library-page .deck-library-layout,
.deck-library-page .deck-library-bottom-grid,
.deck-workbench-page .deck-workbench-layout,
.deck-workbench-page .deck-workbench-notes-grid {
  margin-top: 0;
  margin-bottom: 0;
}

.deck-library-page .deck-library-section + .deck-library-bottom-section,
.deck-workbench-page .deck-workbench-section + .deck-workbench-notes-section {
  margin-top: 0;
}

/* Deck pages — prevent notice title/text from being squeezed into vertical columns */
.deck-library-page .deck-library-backend-notice,
.deck-workbench-page .deck-workbench-backend-notice {
  display: grid;
  grid-template-columns: minmax(220px, 0.34fr) minmax(0, 1fr);
  gap: 18px 28px;
  align-items: start;
  padding: 28px 32px;
  text-align: left;
}

.deck-library-page .deck-library-backend-notice > span,
.deck-workbench-page .deck-workbench-backend-notice > span {
  display: block;
  width: auto;
  height: auto;
  min-width: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--brand-primary);
  font-weight: 800;
  line-height: 1.45;
  overflow-wrap: normal;
  word-break: normal;
}

.deck-library-page .deck-library-backend-notice > p,
.deck-workbench-page .deck-workbench-backend-notice > p {
  margin: 0;
  max-width: 900px;
  color: var(--text-secondary);
  line-height: 1.75;
  overflow-wrap: normal;
  word-break: normal;
}

/* Deck session — keep badges compact inside lower cards */
.deck-workbench-page .deck-workbench-positions > .badge,
.deck-workbench-page .deck-workbench-notes > .badge {
  justify-self: start;
  align-self: start;
  width: auto;
  max-width: max-content;
}

@media (max-width: 1100px) {
  .deck-library-page .deck-library-backend-notice,
  .deck-workbench-page .deck-workbench-backend-notice {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

@media (max-width: 760px) {
  .deck-library-page,
  .deck-workbench-page {
    --deck-section-gap: 22px;
  }

  .deck-library-page .deck-library-section,
  .deck-workbench-page .deck-workbench-section {
    padding-bottom: 32px;
  }

  .deck-library-page .deck-library-bottom-section,
  .deck-workbench-page .deck-workbench-notes-section {
    padding-top: 32px;
    padding-bottom: 56px;
  }

  .deck-library-page .deck-library-backend-notice,
  .deck-workbench-page .deck-workbench-backend-notice {
    padding: 22px;
  }
}


/* === DECKS: секции и вертикальный ритм === */

.decks-section,
.deck-session-section {
  margin-top: 40px;
}

.decks-section:first-child,
.deck-session-section:first-child {
  margin-top: 0;
}

.decks-block {
  margin-top: 24px;
}

.decks-block:first-child {
  margin-top: 0;
}


/* === BACKEND NOTICE FIX === */

.backend-notice {
  margin-top: 32px;
  padding: 16px 18px;
  border-radius: 12px;
  background: #f6f4ff;
  border: 1px solid #e2ddff;

  font-size: 14px;
  line-height: 1.5;

  max-width: 100%;
}

.backend-notice p {
  margin: 0;
}


/* === BADGES FIX === */

.badge {
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: max-content;
  padding: 4px 10px;

  font-size: 12px;
  border-radius: 999px;

  white-space: nowrap;
}


/* === DECK CARD IMPROVE === */

.deck-card {
  transition: all 0.2s ease;
}

.deck-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(0,0,0,0.06);
}

.deck-card.is-active {
  border: 1px solid #7b61ff;
  background: #f4f1ff;
}


/* === FILTER PILLS === */

.filter-pill {
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid #e3e3e3;
  background: #fff;

  font-size: 14px;
  cursor: pointer;
}

.filter-pill.is-active {
  background: #ede9ff;
  border-color: #7b61ff;
  color: #5b43e6;
}


/* === CARDS UX === */

.deck-card-item {
  cursor: pointer;
  transition: transform 0.2s ease;
}

.deck-card-item:hover {
  transform: translateY(-3px);
}


/* === SESSION NOTES === */

.deck-notes textarea {
  width: 100%;
  min-height: 140px;
  resize: vertical;

  border-radius: 12px;
  border: 1px solid #e3e3e3;

  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.5;

  background: #fff;
}

.deck-notes textarea:focus {
  outline: none;
  border-color: #7b61ff;
  box-shadow: 0 0 0 2px rgba(123, 97, 255, 0.1);
}
/* Deck session — custom deck cards and one-by-one reveal */
.deck-workbench-page .deck-workbench-deck-grid {
  display: grid;
  gap: 12px;
}

.deck-workbench-page .deck-workbench-deck-option {
  width: 100%;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border: 1px solid var(--border-default);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.76);
  color: var(--text-primary);
  text-align: left;
  font: inherit;
  cursor: pointer;
  box-shadow: 0 14px 26px rgba(69, 55, 84, 0.045);
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.deck-workbench-page .deck-workbench-deck-option:hover,
.deck-workbench-page .deck-workbench-deck-option:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(134, 90, 168, 0.34);
  background: rgba(255, 247, 250, 0.92);
  box-shadow: 0 18px 34px rgba(69, 55, 84, 0.075);
  outline: none;
}

.deck-workbench-page .deck-workbench-deck-option.is-active {
  border-color: rgba(134, 90, 168, 0.48);
  background: linear-gradient(145deg, rgba(248, 239, 251, 0.92), rgba(255, 247, 250, 0.96));
}

.deck-workbench-page .deck-workbench-deck-option-mark {
  position: relative;
  width: 26px;
  height: 26px;
  margin-top: 2px;
  border: 1px solid rgba(134, 90, 168, 0.28);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.86);
  flex: 0 0 auto;
}

.deck-workbench-page .deck-workbench-deck-option.is-active .deck-workbench-deck-option-mark {
  border-color: var(--brand-primary);
  background: var(--brand-primary);
}

.deck-workbench-page .deck-workbench-deck-option.is-active .deck-workbench-deck-option-mark::after {
  content: '';
  position: absolute;
  left: 8px;
  top: 5px;
  width: 7px;
  height: 11px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.deck-workbench-page .deck-workbench-deck-option-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.deck-workbench-page .deck-workbench-deck-option-copy strong {
  font-size: 14px;
  line-height: 1.35;
  color: var(--text-primary);
}

.deck-workbench-page .deck-workbench-deck-option-copy small {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.6;
}

.deck-workbench-page .deck-workbench-card.is-revealed {
  background: rgba(255, 255, 255, 0.94);
}

.deck-workbench-page .deck-workbench-card-reveal {
  justify-self: center;
  min-height: 38px;
  margin-top: auto;
  padding: 0 16px;
  border: 1px solid rgba(134, 90, 168, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.84);
  color: var(--brand-primary);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.deck-workbench-page .deck-workbench-card-reveal:hover,
.deck-workbench-page .deck-workbench-card-reveal:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(134, 90, 168, 0.44);
  background: rgba(248, 239, 251, 0.94);
  outline: none;
}

@media (max-width: 760px) {
  .deck-workbench-page .deck-workbench-deck-option {
    grid-template-columns: 28px minmax(0, 1fr);
    padding: 13px;
  }
}

/* =========================================================
   Client requests — scoped fix
   Scope only: client-requests.html + client-request-detail.html
   Keeps admin, specialist profile edit, specialist reviews untouched.
   ========================================================= */
.client-requests-page,
.client-request-detail-page {
  padding-bottom: 72px;
}

.client-requests-hero-section,
.client-request-detail-hero-section {
  padding-top: 42px;
  padding-bottom: 26px;
}

.client-requests-workspace-section,
.client-request-detail-section {
  padding-top: 18px;
}

.client-requests-hero-card,
.client-request-detail-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.75fr);
  gap: 24px;
  align-items: stretch;
  padding: 32px;
  border: 1px solid rgba(181, 123, 190, 0.18);
  border-radius: 32px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 18px 45px rgba(69, 55, 84, 0.06);
}

.client-requests-hero-copy,
.client-request-detail-hero-card > div:first-child {
  display: grid;
  align-content: center;
  gap: 16px;
  min-width: 0;
}

.client-requests-hero-copy h1,
.client-request-detail-hero-card h1,
.client-requests-panel-head h2,
.client-requests-side-card h2,
.client-request-detail-card h2,
.client-request-detail-side-card h2,
.client-requests-summary-card h2 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: 0.02em;
}

.client-requests-hero-copy h1,
.client-request-detail-hero-card h1 {
  font-size: clamp(2rem, 4vw, 4rem);
  line-height: 1.05;
}

.client-requests-hero-copy p,
.client-request-detail-hero-card p,
.client-requests-panel-head p,
.client-requests-side-card p,
.client-request-card p,
.client-request-detail-card p,
.client-request-detail-side-card p,
.client-requests-summary-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.75;
}

.client-requests-hero-actions,
.client-request-detail-actions,
.client-request-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.client-requests-summary-card,
.client-request-detail-status-card,
.client-requests-side-card,
.client-request-detail-side-card,
.client-request-detail-card,
.client-request-card,
.client-requests-main {
  border: 1px solid rgba(181, 123, 190, 0.16);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 14px 36px rgba(69, 55, 84, 0.045);
}

.client-requests-summary-card,
.client-request-detail-status-card {
  display: grid;
  align-content: start;
  gap: 18px;
  padding: 24px;
}

.client-requests-summary-grid,
.client-request-detail-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.client-requests-summary-grid div,
.client-request-detail-status-grid div {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(181, 123, 190, 0.14);
  border-radius: 20px;
  background: rgba(248, 239, 251, 0.52);
}

.client-requests-summary-grid strong,
.client-request-detail-status-grid strong {
  color: var(--text-primary);
  font-size: 1.35rem;
  line-height: 1;
}

.client-requests-summary-grid span,
.client-request-detail-status-grid span {
  color: var(--text-secondary);
  font-size: 0.78rem;
  line-height: 1.35;
}

.client-requests-layout,
.client-request-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 24px;
  align-items: start;
}

.client-requests-main {
  padding: 26px;
}

.client-requests-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
  margin-bottom: 20px;
}

.client-requests-panel-head > div {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.client-requests-count {
  display: inline-flex;
  flex: 0 0 auto;
  min-height: 34px;
  align-items: center;
  padding: 0 14px;
  border: 1px solid rgba(181, 123, 190, 0.18);
  border-radius: 999px;
  background: rgba(248, 239, 251, 0.72);
  color: var(--brand-primary);
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}

.client-requests-filters {
  display: grid;
  gap: 12px;
  margin-bottom: 22px;
}

.client-requests-filter-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.client-requests-filter-group button {
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(181, 123, 190, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 0.88rem;
  font-weight: 700;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.client-requests-filter-group button:hover,
.client-requests-filter-group button:focus-visible,
.client-requests-filter-group button.is-active {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.38);
  background: rgba(181, 123, 190, 0.14);
  color: var(--brand-primary);
  outline: none;
}

.client-requests-list,
.client-request-detail-main,
.client-request-detail-side,
.client-requests-side {
  display: grid;
  gap: 18px;
}

.client-request-card {
  display: grid;
  gap: 16px;
  padding: 22px;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.client-request-card:hover {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.30);
  box-shadow: 0 18px 42px rgba(69, 55, 84, 0.065);
}

.client-request-card-top {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.client-request-card h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 1.18rem;
  line-height: 1.45;
}

.client-request-status,
.client-request-type,
.client-request-detail-tags span {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.client-request-type,
.client-request-detail-tags span {
  border: 1px solid rgba(181, 123, 190, 0.18);
  background: rgba(248, 239, 251, 0.72);
  color: var(--brand-primary);
}

.client-request-status--new {
  border: 1px solid rgba(245, 158, 11, 0.22);
  background: var(--warning-soft);
  color: #a46b08;
}

.client-request-status--inwork {
  border: 1px solid rgba(59, 130, 246, 0.20);
  background: var(--info-soft);
  color: #3868ad;
}

.client-request-status--answered {
  border: 1px solid rgba(34, 197, 94, 0.20);
  background: var(--success-soft);
  color: #2f7551;
}

.client-request-status--closed {
  border: 1px solid rgba(181, 123, 190, 0.22);
  background: rgba(181, 123, 190, 0.13);
  color: var(--brand-primary);
}

.client-request-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.client-request-meta-grid div {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(181, 123, 190, 0.13);
  border-radius: 18px;
  background: rgba(255, 247, 250, 0.72);
}

.client-request-meta-grid span {
  color: var(--text-secondary);
  font-size: 0.76rem;
}

.client-request-meta-grid strong {
  min-width: 0;
  color: var(--text-primary);
  font-size: 0.92rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.client-requests-side-card,
.client-request-detail-side-card,
.client-request-detail-card {
  padding: 24px;
}

.client-requests-side-card,
.client-request-detail-side-card,
.client-request-detail-card {
  display: grid;
  gap: 14px;
}

.client-requests-legend {
  display: grid;
  gap: 12px;
}

.client-requests-legend p {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(181, 123, 190, 0.13);
  border-radius: 18px;
  background: rgba(255, 247, 250, 0.64);
}

.client-requests-legend small {
  color: var(--text-secondary);
  line-height: 1.55;
}

.client-requests-safety-card,
.client-request-detail-backend {
  background: linear-gradient(180deg, rgba(248, 239, 251, 0.84), rgba(255, 255, 255, 0.90));
}

.client-requests-empty {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 34px;
  border: 1px dashed rgba(181, 123, 190, 0.28);
  border-radius: 24px;
  background: rgba(248, 239, 251, 0.48);
  text-align: center;
}

.client-requests-empty[hidden],
.client-request-card[hidden],
.client-review-modal[hidden] {
  display: none !important;
}

.client-requests-empty span {
  color: var(--brand-primary);
  font-size: 2rem;
}

.client-requests-empty h3,
.client-requests-empty p {
  margin: 0;
}

.client-request-detail-tags,
.client-request-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.client-request-answer-card {
  border-color: rgba(34, 197, 94, 0.18);
  background: linear-gradient(180deg, rgba(245, 255, 249, 0.80), rgba(255, 255, 255, 0.92));
}

.client-request-answer-note {
  display: grid;
  gap: 6px;
  padding: 16px;
  border: 1px solid rgba(245, 158, 11, 0.18);
  border-radius: 18px;
  background: var(--warning-soft);
}

.client-request-answer-note strong {
  color: #a46b08;
}

.client-request-answer-note span {
  color: var(--text-secondary);
  line-height: 1.65;
}

.client-request-next-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.client-request-next-grid a,
.client-request-next-grid button {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(181, 123, 190, 0.15);
  border-radius: 20px;
  background: rgba(255, 247, 250, 0.72);
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.client-request-next-grid a:hover,
.client-request-next-grid button:hover,
.client-request-next-grid a:focus-visible,
.client-request-next-grid button:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.34);
  background: rgba(248, 239, 251, 0.84);
  outline: none;
}

.client-request-next-grid span {
  color: var(--brand-primary);
  font-size: 0.82rem;
  font-weight: 900;
}

.client-request-next-grid strong,
.client-request-next-grid small {
  line-height: 1.5;
}

.client-request-next-grid small {
  color: var(--text-secondary);
}

.client-request-timeline {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.client-request-timeline li {
  position: relative;
  display: grid;
  gap: 5px;
  padding: 14px 14px 14px 42px;
  border: 1px solid rgba(181, 123, 190, 0.13);
  border-radius: 18px;
  background: rgba(255, 247, 250, 0.70);
}

.client-request-timeline li::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 18px;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: var(--brand-primary);
  box-shadow: 0 0 0 6px rgba(181, 123, 190, 0.12);
}

.client-request-timeline strong {
  color: var(--text-primary);
  line-height: 1.45;
}

.client-request-timeline span {
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.45;
}

.client-review-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(69, 55, 84, 0.28);
  backdrop-filter: blur(8px);
}

.client-review-dialog {
  position: relative;
  display: grid;
  gap: 14px;
  width: min(520px, 100%);
  padding: 28px;
  border: 1px solid rgba(181, 123, 190, 0.22);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 24px 70px rgba(69, 55, 84, 0.16);
}

.client-review-dialog h2,
.client-review-dialog p {
  margin: 0;
}

.client-review-dialog p {
  color: var(--text-secondary);
  line-height: 1.7;
}

.client-review-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(181, 123, 190, 0.16);
  border-radius: 999px;
  background: rgba(248, 239, 251, 0.70);
  color: var(--brand-primary);
  cursor: pointer;
  font-size: 1.35rem;
  line-height: 1;
}

.client-review-stars {
  color: #d2952d;
  letter-spacing: 0.14em;
  font-size: 1.35rem;
}

.client-review-dialog textarea {
  min-height: 120px;
  resize: vertical;
  padding: 16px;
  border: 1px solid rgba(181, 123, 190, 0.18);
  border-radius: 18px;
  background: rgba(255, 247, 250, 0.72);
  color: var(--text-primary);
}

.client-review-dialog textarea:focus {
  border-color: rgba(181, 123, 190, 0.40);
  outline: none;
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.10);
}

@media (max-width: 1100px) {
  .client-requests-hero-card,
  .client-request-detail-hero-card,
  .client-requests-layout,
  .client-request-detail-layout {
    grid-template-columns: 1fr;
  }

  .client-requests-side,
  .client-request-detail-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .client-requests-hero-section,
  .client-request-detail-hero-section {
    padding-top: 24px;
  }

  .client-requests-hero-card,
  .client-request-detail-hero-card,
  .client-requests-main,
  .client-request-card,
  .client-requests-side-card,
  .client-request-detail-side-card,
  .client-request-detail-card,
  .client-requests-summary-card,
  .client-request-detail-status-card {
    padding: 18px;
    border-radius: 22px;
  }

  .client-requests-panel-head,
  .client-request-card-top,
  .client-request-actions,
  .client-requests-hero-actions,
  .client-request-detail-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .client-requests-count,
  .client-request-actions .button,
  .client-requests-hero-actions .button,
  .client-request-detail-actions .button {
    width: 100%;
    justify-content: center;
  }

  .client-request-meta-grid,
  .client-requests-summary-grid,
  .client-request-detail-status-grid,
  .client-request-next-grid,
  .client-requests-side,
  .client-request-detail-side {
    grid-template-columns: 1fr;
  }

  .client-requests-filter-group {
    flex-direction: column;
    align-items: stretch;
  }

  .client-requests-filter-group button {
    width: 100%;
  }
}

/* =========================================================
   Stabilization patch — specialist profile edit + reviews
   Scoped only to specialist-profile-edit.html and specialist-reviews.html
   Added to prevent admin/client request CSS patches from breaking these pages.
========================================================= */

/* ---------- Specialist profile edit page ---------- */
.specialist-profile-edit-page .specialist-workspace-hero-section {
  padding-bottom: 34px;
}

.specialist-profile-edit-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
  gap: 24px;
  align-items: stretch;
}

.specialist-profile-edit-hero-copy,
.specialist-profile-edit-hero-card,
.specialist-profile-edit-card,
.specialist-profile-edit-side-card {
  border: 1px solid rgba(231, 213, 226, 0.86);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 22px 60px rgba(78, 46, 83, 0.08);
}

.specialist-profile-edit-hero-copy {
  padding: clamp(26px, 4vw, 46px);
  border-radius: 34px;
}

.specialist-profile-edit-hero-copy h1,
.specialist-profile-edit-card h2,
.specialist-profile-edit-side-card h2,
.specialist-edit-photo-copy h3,
.specialist-edit-preview-person h3 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: -0.045em;
}

.specialist-profile-edit-hero-copy h1 {
  max-width: 780px;
  margin-top: 14px;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.02;
}

.specialist-profile-edit-hero-copy p,
.specialist-profile-edit-card-head p,
.specialist-edit-photo-copy p,
.specialist-profile-edit-hero-card p,
.specialist-profile-edit-side-card p,
.specialist-profile-edit-bottom-note {
  color: var(--text-secondary);
  line-height: 1.75;
}

.specialist-profile-edit-hero-copy > p {
  max-width: 760px;
  margin: 16px 0 0;
  font-size: 1.04rem;
}

.specialist-profile-edit-hero-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
  min-height: 230px;
  padding: 26px;
  border-radius: 30px;
  background:
    radial-gradient(circle at top right, rgba(191, 159, 214, 0.2), transparent 42%),
    rgba(255, 255, 255, 0.92);
}

.specialist-profile-edit-hero-card strong {
  display: block;
  color: var(--text-primary);
  font-size: 1.4rem;
  line-height: 1.25;
}

.specialist-profile-edit-main-section {
  padding-top: 0;
}

.specialist-profile-edit-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.34fr);
  gap: 24px;
  align-items: start;
}

.specialist-profile-edit-form {
  display: grid;
  gap: 22px;
  min-width: 0;
}

.specialist-profile-edit-card {
  padding: clamp(22px, 3vw, 30px);
  border-radius: 30px;
}

.specialist-profile-edit-card-main {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(251, 246, 252, 0.88));
}

.specialist-profile-edit-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 20px;
}

.specialist-profile-edit-card-head h2 {
  margin-top: 10px;
  font-size: clamp(24px, 2.5vw, 34px);
  line-height: 1.12;
}

.specialist-profile-edit-card-head p {
  max-width: 720px;
  margin: 8px 0 0;
}

.specialist-edit-photo-panel {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding: 20px;
  border: 1px solid rgba(231, 213, 226, 0.76);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.78);
}

.specialist-edit-avatar {
  display: inline-flex;
  width: 112px;
  height: 112px;
  align-items: center;
  justify-content: center;
  border-radius: 34px;
  background:
    radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.75), transparent 32%),
    linear-gradient(135deg, #eadcf1, #d8bedf);
  color: #8f5fb1;
  font-size: 2rem;
  font-weight: 900;
  box-shadow: 0 18px 40px rgba(143, 95, 177, 0.16);
}

.specialist-edit-avatar-small {
  width: 58px;
  height: 58px;
  border-radius: 20px;
  font-size: 1rem;
}

.specialist-edit-photo-copy {
  min-width: 0;
}

.specialist-edit-photo-copy h3 {
  font-size: 1.2rem;
}

.specialist-edit-photo-copy p {
  margin: 8px 0 14px;
}

.specialist-edit-upload-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  align-items: center;
}

.specialist-edit-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.specialist-edit-file-button {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  border: 1px solid rgba(181, 123, 190, 0.25);
  border-radius: 999px;
  background: rgba(191, 159, 214, 0.16);
  color: #8f5fb1;
  cursor: pointer;
  font-weight: 800;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.specialist-edit-file-button:hover {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.42);
  background: rgba(191, 159, 214, 0.24);
}

.specialist-edit-upload-row span {
  color: var(--text-secondary);
  font-size: 0.9rem;
}

.specialist-edit-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.specialist-edit-field {
  display: grid;
  gap: 8px;
  min-width: 0;
  color: var(--text-primary);
  font-weight: 800;
}

.specialist-edit-field-wide {
  grid-column: 1 / -1;
}

.specialist-edit-field input,
.specialist-edit-field textarea {
  width: 100%;
  border: 1px solid rgba(231, 213, 226, 0.95);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--text-primary);
  font: inherit;
  font-weight: 600;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.specialist-edit-field input {
  min-height: 52px;
  padding: 0 16px;
}

.specialist-edit-field textarea {
  min-height: 132px;
  padding: 15px 16px;
  resize: vertical;
  line-height: 1.6;
}

.specialist-edit-field input:focus,
.specialist-edit-field textarea:focus {
  border-color: rgba(181, 123, 190, 0.5);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.12);
}

.specialist-edit-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.specialist-edit-choice-grid-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.specialist-edit-choice-card {
  position: relative;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  min-height: 112px;
  padding: 18px;
  border: 1px solid rgba(231, 213, 226, 0.9);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.82);
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.specialist-edit-choice-card:hover {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.34);
  box-shadow: 0 16px 36px rgba(78, 46, 83, 0.08);
}

.specialist-edit-choice-card-wide {
  grid-column: 1 / -1;
  min-height: auto;
}

.specialist-edit-choice-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.specialist-edit-check {
  position: relative;
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(181, 123, 190, 0.24);
  border-radius: 50%;
  background: #fff;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.specialist-edit-check-square {
  border-radius: 10px;
}

.specialist-edit-check::after {
  content: "";
  width: 10px;
  height: 6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px) scale(0);
  transform-origin: center;
  transition: transform 0.2s ease;
}

.specialist-edit-choice-card input:checked + .specialist-edit-check {
  border-color: #8f5fb1;
  background: #8f5fb1;
}

.specialist-edit-choice-card input:checked + .specialist-edit-check::after {
  transform: rotate(-45deg) translate(1px, -1px) scale(1);
}

.specialist-edit-choice-card:has(input:checked) {
  border-color: rgba(143, 95, 177, 0.42);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 237, 250, 0.95));
  box-shadow: 0 18px 42px rgba(143, 95, 177, 0.12);
}

.specialist-edit-choice-copy {
  display: grid;
  gap: 6px;
}

.specialist-edit-choice-copy strong {
  color: var(--text-primary);
  line-height: 1.35;
}

.specialist-edit-choice-copy small {
  color: var(--text-secondary);
  font-size: 0.88rem;
  line-height: 1.55;
}

.specialist-edit-document-panel {
  display: grid;
  gap: 14px;
  margin-top: 18px;
  padding: 18px;
  border: 1px dashed rgba(181, 123, 190, 0.32);
  border-radius: 24px;
  background: rgba(191, 159, 214, 0.1);
}

.specialist-edit-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 22px;
}

.specialist-profile-edit-bottom-note {
  margin: 14px 0 0;
  font-size: 0.94rem;
}

.specialist-profile-edit-sidebar {
  position: sticky;
  top: 24px;
  display: grid;
  gap: 18px;
  min-width: 0;
}

.specialist-profile-edit-side-card {
  padding: 22px;
  border-radius: 28px;
}

.specialist-edit-status-list {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 18px 0 0;
  list-style: none;
}

.specialist-edit-status-list li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: var(--text-secondary);
  line-height: 1.55;
}

.specialist-edit-status-list li::before {
  content: "✓";
  display: inline-flex;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(199, 239, 216, 0.7);
  color: #2f7551;
  font-size: 0.82rem;
  font-weight: 900;
}

.specialist-edit-preview-card {
  background:
    radial-gradient(circle at top right, rgba(191, 159, 214, 0.18), transparent 44%),
    rgba(255, 255, 255, 0.9);
}

.specialist-edit-preview-person {
  display: flex;
  gap: 14px;
  align-items: center;
  margin: 16px 0;
}

.specialist-edit-preview-person h3 {
  font-size: 1rem;
}

.specialist-edit-preview-person p {
  margin: 4px 0 0;
  font-size: 0.9rem;
}

.specialist-edit-preview-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.specialist-edit-preview-tags span {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(191, 159, 214, 0.14);
  color: #8f5fb1;
  font-size: 0.82rem;
  font-weight: 800;
}

.specialist-profile-edit-notice {
  border: 1px solid rgba(231, 213, 226, 0.86);
}

/* ---------- Specialist reviews manager page ---------- */
.specialist-review-manager-page .specialist-workspace-hero-section {
  padding-bottom: 30px;
}

.specialist-review-manager-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.36fr);
  gap: 24px;
  align-items: stretch;
}

.specialist-review-manager-copy,
.specialist-review-manager-status,
.specialist-review-manager-panel,
.specialist-review-policy-card,
.specialist-review-manager-card,
.specialist-review-metrics article {
  border: 1px solid rgba(231, 213, 226, 0.86);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 22px 60px rgba(78, 46, 83, 0.08);
}

.specialist-review-manager-copy {
  padding: clamp(26px, 4vw, 46px);
  border-radius: 34px;
}

.specialist-review-manager-copy h1 {
  max-width: 760px;
  margin: 14px 0 0;
  color: var(--text-primary);
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.02;
  letter-spacing: -0.045em;
}

.specialist-review-manager-copy p {
  max-width: 760px;
  margin: 16px 0 0;
  color: var(--text-secondary);
  font-size: 1.04rem;
  line-height: 1.75;
}

.specialist-review-manager-status {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
  min-height: 230px;
  padding: 26px;
  border-radius: 30px;
  background:
    radial-gradient(circle at top right, rgba(191, 159, 214, 0.2), transparent 42%),
    rgba(255, 255, 255, 0.92);
}

.specialist-review-manager-status h2,
.specialist-review-manager-panel h2,
.specialist-review-policy-card h2,
.specialist-review-manager-card h3 {
  margin: 0;
  color: var(--text-primary);
  letter-spacing: -0.04em;
}

.specialist-review-manager-status p,
.specialist-review-manager-panel p,
.specialist-review-policy-card p,
.specialist-review-text {
  color: var(--text-secondary);
  line-height: 1.7;
}

.specialist-review-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.specialist-review-metrics article {
  display: grid;
  gap: 4px;
  min-height: 112px;
  padding: 20px;
  border-radius: 26px;
}

.specialist-review-metrics strong {
  color: var(--text-primary);
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1;
  letter-spacing: -0.04em;
}

.specialist-review-metrics span {
  color: var(--text-secondary);
  font-size: 0.92rem;
  font-weight: 800;
}

.specialist-review-manager-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.34fr);
  gap: 24px;
  align-items: start;
}

.specialist-review-manager-panel,
.specialist-review-policy-card {
  padding: clamp(22px, 3vw, 30px);
  border-radius: 30px;
}

.specialist-review-manager-panel .specialist-workspace-panel-head {
  display: flex;
  gap: 18px;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
}

.specialist-review-manager-panel .specialist-workspace-panel-head h2 {
  margin-top: 10px;
  font-size: clamp(24px, 2.5vw, 34px);
  line-height: 1.12;
}

.specialist-review-manager-panel .specialist-workspace-panel-head p {
  max-width: 720px;
  margin: 8px 0 0;
}

.specialist-review-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}

.specialist-review-tab {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 1px solid rgba(231, 213, 226, 0.9);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text-secondary);
  cursor: pointer;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 800;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.specialist-review-tab:hover,
.specialist-review-tab.is-active {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.36);
  background: rgba(191, 159, 214, 0.16);
  color: #8f5fb1;
}

.specialist-review-list {
  display: grid;
  gap: 16px;
}

.specialist-review-manager-card {
  display: grid;
  gap: 16px;
  padding: 20px;
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.86);
}

.specialist-review-card-top {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  justify-content: space-between;
}

.specialist-review-id {
  display: inline-flex;
  width: fit-content;
  min-height: 28px;
  align-items: center;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(191, 159, 214, 0.14);
  color: #8f5fb1;
  font-size: 0.78rem;
  font-weight: 900;
}

.specialist-review-card-top h3 {
  margin-top: 8px;
  font-size: 1.15rem;
  line-height: 1.25;
}

.specialist-review-status {
  display: inline-flex;
  flex: 0 0 auto;
  width: fit-content;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  padding: 0 11px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.specialist-review-status-new {
  border: 1px solid rgba(181, 123, 190, 0.25);
  background: rgba(191, 159, 214, 0.14);
  color: #8f5fb1;
}

.specialist-review-status-published {
  border: 1px solid rgba(118, 183, 143, 0.32);
  background: rgba(199, 239, 216, 0.64);
  color: #2f7551;
}

.specialist-review-status-private {
  border: 1px solid rgba(214, 167, 91, 0.34);
  background: rgba(255, 235, 196, 0.66);
  color: #9a6a25;
}

.specialist-review-status-moderation {
  border: 1px solid rgba(124, 156, 217, 0.28);
  background: rgba(216, 228, 255, 0.64);
  color: #4c64a3;
}

.specialist-review-text {
  margin: 0;
}

.specialist-review-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.specialist-review-meta-grid div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px;
  border-radius: 18px;
  background: rgba(248, 244, 250, 0.86);
}

.specialist-review-meta-grid dt,
.specialist-review-meta-grid dd {
  margin: 0;
}

.specialist-review-meta-grid dt {
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 900;
}

.specialist-review-meta-grid dd {
  color: var(--text-primary);
  font-size: 0.92rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.specialist-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.specialist-review-actions .button {
  min-height: 42px;
}

.specialist-review-policy-card {
  position: sticky;
  top: 24px;
  background:
    radial-gradient(circle at top right, rgba(191, 159, 214, 0.18), transparent 42%),
    rgba(255, 255, 255, 0.9);
}

.specialist-review-policy-card h2 {
  margin-top: 12px;
  font-size: 1.4rem;
  line-height: 1.18;
}

.specialist-review-policy-card ul {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 18px 0;
  list-style: none;
}

.specialist-review-policy-card li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  color: var(--text-secondary);
  line-height: 1.55;
}

.specialist-review-policy-card li::before {
  content: "✓";
  display: inline-flex;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(199, 239, 216, 0.7);
  color: #2f7551;
  font-size: 0.78rem;
  font-weight: 900;
}

.specialist-review-notice {
  margin-top: 18px;
  border: 1px solid rgba(231, 213, 226, 0.86);
}

/* Safety: public reviews page also keeps its card layout after CSS patches. */
.reviews-v2-page .page-hero-card,
.reviews-v2-principles,
.reviews-v2-card,
.reviews-v2-empty {
  border: 1px solid rgba(231, 213, 226, 0.86);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 20px 54px rgba(78, 46, 83, 0.07);
}

.reviews-v2-page .page-hero-card,
.reviews-v2-principles {
  border-radius: 34px;
}

.reviews-v2-card,
.reviews-v2-empty {
  border-radius: 26px;
}

@media (max-width: 1100px) {
  .specialist-profile-edit-hero,
  .specialist-profile-edit-layout,
  .specialist-review-manager-hero,
  .specialist-review-manager-grid {
    grid-template-columns: 1fr;
  }

  .specialist-profile-edit-sidebar,
  .specialist-review-policy-card {
    position: static;
  }

  .specialist-review-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .specialist-review-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .specialist-profile-edit-hero-copy,
  .specialist-profile-edit-hero-card,
  .specialist-profile-edit-card,
  .specialist-profile-edit-side-card,
  .specialist-review-manager-copy,
  .specialist-review-manager-status,
  .specialist-review-manager-panel,
  .specialist-review-policy-card,
  .specialist-review-manager-card {
    border-radius: 24px;
  }

  .specialist-edit-photo-panel {
    grid-template-columns: 1fr;
  }

  .specialist-edit-form-grid,
  .specialist-edit-choice-grid,
  .specialist-edit-choice-grid-three,
  .specialist-review-metrics,
  .specialist-review-meta-grid {
    grid-template-columns: 1fr;
  }

  .specialist-review-manager-panel .specialist-workspace-panel-head,
  .specialist-review-card-top {
    flex-direction: column;
    align-items: stretch;
  }

  .specialist-review-status {
    align-self: flex-start;
  }
}


/* =========================================================
   ADMIN WORKSPACE STABILIZATION
   Scope: admin.html and admin-* moderation pages only.
   Added as a scoped safety layer so existing cabinet/profile/reviews/request styles stay intact.
========================================================= */

.admin-page,
.admin-application-page,
.admin-blog-page,
.admin-review-page,
.admin-question-page {
  background:
    radial-gradient(circle at top left, rgba(191, 159, 214, 0.16), transparent 34%),
    radial-gradient(circle at top right, rgba(199, 223, 240, 0.22), transparent 34%),
    var(--bg-primary);
}

.admin-page .section,
.admin-application-page .section,
.admin-blog-page .section,
.admin-review-page .section,
.admin-question-page .section {
  padding-top: 44px;
  padding-bottom: 44px;
}

.admin-hero-card,
.admin-application-hero-card,
.admin-blog-hero-card,
.admin-review-hero-card,
.admin-question-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.75fr);
  gap: 24px;
  align-items: stretch;
  padding: clamp(24px, 4vw, 44px);
  border: 1px solid rgba(231, 213, 226, 0.9);
  border-radius: 36px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 238, 244, 0.84)),
    var(--surface-white);
  box-shadow: 0 24px 70px rgba(78, 46, 83, 0.08);
}

.admin-hero-copy,
.admin-application-hero-copy,
.admin-blog-hero-copy,
.admin-review-hero-copy,
.admin-question-hero-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}

.admin-hero-copy h1,
.admin-application-hero-copy h1,
.admin-blog-hero-copy h1,
.admin-review-hero-copy h1,
.admin-question-hero-copy h1 {
  max-width: 820px;
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.04;
  letter-spacing: -0.04em;
}

.admin-hero-copy p,
.admin-application-hero-copy p,
.admin-blog-hero-copy p,
.admin-review-hero-copy p,
.admin-question-hero-copy p {
  max-width: 780px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 1.02rem;
  line-height: 1.75;
}

.admin-hero-actions,
.admin-application-actions,
.admin-blog-hero-actions,
.admin-review-hero-actions,
.admin-question-hero-actions,
.admin-blog-actions,
.admin-review-actions,
.admin-question-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.admin-access-card,
.admin-application-status-card,
.admin-blog-status-card,
.admin-review-status-card,
.admin-question-status-card {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  padding: 22px;
  border: 1px solid rgba(231, 213, 226, 0.88);
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(181, 123, 190, 0.14), transparent 45%),
    rgba(255, 255, 255, 0.82);
  box-shadow: 0 18px 48px rgba(78, 46, 83, 0.06);
}

.admin-access-card h2,
.admin-application-status-card h2,
.admin-blog-status-card h2,
.admin-review-status-card h2,
.admin-question-status-card h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.16;
}

.admin-access-card p,
.admin-application-status-card p,
.admin-blog-status-card p,
.admin-review-status-card p,
.admin-question-status-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.65;
}

.admin-metrics-grid,
.admin-blog-meta-grid,
.admin-review-meta-grid,
.admin-question-meta-grid,
.admin-application-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.admin-metric-card,
.admin-blog-meta-grid div,
.admin-review-meta-grid div,
.admin-question-meta-grid div,
.admin-application-meta-grid div {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 16px;
  border: 1px solid rgba(231, 213, 226, 0.82);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 12px 34px rgba(78, 46, 83, 0.05);
}

.admin-metric-card span,
.admin-blog-meta-grid dt,
.admin-review-meta-grid dt,
.admin-question-meta-grid dt,
.admin-application-meta-grid dt {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}

.admin-metric-card strong,
.admin-blog-meta-grid dd,
.admin-review-meta-grid dd,
.admin-question-meta-grid dd,
.admin-application-meta-grid dd {
  margin: 0;
  color: var(--text-primary);
  font-size: 0.98rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.admin-metric-card strong {
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1;
}

.admin-metric-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.45;
}

.admin-work-grid,
.admin-application-grid,
.admin-blog-grid,
.admin-review-grid,
.admin-question-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.42fr) minmax(300px, 0.72fr);
  gap: 24px;
  align-items: start;
}

.admin-main-panel,
.admin-application-main,
.admin-blog-main,
.admin-review-main,
.admin-question-main,
.admin-side-panel,
.admin-application-side,
.admin-blog-side,
.admin-review-side,
.admin-question-side {
  min-width: 0;
}

.admin-main-panel,
.admin-blog-card,
.admin-review-card,
.admin-question-card,
.admin-application-card,
.admin-detail-card,
.admin-rules-card,
.admin-backend-notice,
.admin-blog-side-card,
.admin-review-side-card,
.admin-question-side-card {
  border: 1px solid rgba(231, 213, 226, 0.88);
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 52px rgba(78, 46, 83, 0.06);
}

.admin-main-panel,
.admin-blog-card,
.admin-review-card,
.admin-question-card,
.admin-application-card {
  padding: clamp(20px, 3vw, 30px);
}

.admin-side-panel,
.admin-application-side,
.admin-blog-side,
.admin-review-side,
.admin-question-side {
  display: grid;
  gap: 18px;
}

.admin-detail-card,
.admin-rules-card,
.admin-backend-notice,
.admin-blog-side-card,
.admin-review-side-card,
.admin-question-side-card {
  display: grid;
  gap: 12px;
  padding: 20px;
}

.admin-detail-card,
.admin-rules-card,
.admin-blog-side-card,
.admin-review-side-card,
.admin-question-side-card {
  position: sticky;
  top: 24px;
}

.admin-rules-card,
.admin-backend-notice,
.admin-application-warning {
  background:
    radial-gradient(circle at top right, rgba(199, 223, 240, 0.18), transparent 42%),
    rgba(255, 255, 255, 0.9);
}

.admin-panel-head,
.admin-card-section-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 20px;
}

.admin-panel-head h2,
.admin-card-section-head h2,
.admin-detail-card h2,
.admin-rules-card h2,
.admin-backend-notice h2,
.admin-application-card h2,
.admin-blog-card h2,
.admin-review-card h2,
.admin-question-card h2,
.admin-blog-side-card h2,
.admin-review-side-card h2,
.admin-question-side-card h2 {
  margin: 8px 0 0;
  color: var(--text-primary);
  font-size: clamp(22px, 2.4vw, 34px);
  line-height: 1.14;
  letter-spacing: -0.02em;
}

.admin-panel-head p,
.admin-card-section-head p,
.admin-detail-card p,
.admin-rules-card p,
.admin-backend-notice p,
.admin-application-card p,
.admin-blog-card p,
.admin-review-card p,
.admin-question-card p,
.admin-blog-side-card p,
.admin-review-side-card p,
.admin-question-side-card p {
  margin: 8px 0 0;
  color: var(--text-secondary);
  line-height: 1.65;
}

.admin-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 18px 0 22px;
}

.admin-filter-btn {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(231, 213, 226, 0.9);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text-secondary);
  cursor: pointer;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 900;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.admin-filter-btn:hover,
.admin-filter-btn.is-active {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.36);
  background: rgba(191, 159, 214, 0.16);
  color: #8f5fb1;
}

.admin-card-list,
.admin-checklist-list,
.admin-document-list,
.admin-blog-checklist,
.admin-review-checklist,
.admin-question-checklist,
.admin-blog-risk-list,
.admin-review-risk-list,
.admin-blog-settings-list,
.admin-readiness-list,
.admin-blog-readiness-list,
.admin-review-readiness-list,
.admin-question-readiness-list,
.admin-audit-list {
  display: grid;
  gap: 14px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.admin-review-card[data-admin-card],
.admin-empty-state,
.admin-check-row,
.admin-blog-check-row,
.admin-review-check-row,
.admin-question-check-row,
.admin-document-row,
.admin-candidate-card,
.admin-public-preview-card,
.admin-blog-material-card,
.admin-blog-preview-box,
.admin-review-quote-box,
.admin-question-thread-box,
.admin-question-hint {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(231, 213, 226, 0.84);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.86);
}

.admin-review-card[data-admin-card] {
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.admin-review-card[data-admin-card]:hover,
.admin-review-card[data-admin-card].is-selected {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.38);
  background:
    radial-gradient(circle at top right, rgba(191, 159, 214, 0.12), transparent 40%),
    rgba(255, 255, 255, 0.95);
  box-shadow: 0 18px 48px rgba(78, 46, 83, 0.08);
}

.admin-card-top,
.admin-blog-post-top {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.admin-type-pill,
.admin-status-pill {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.admin-type-pill {
  border: 1px solid rgba(181, 123, 190, 0.24);
  background: rgba(191, 159, 214, 0.14);
  color: #8f5fb1;
}

.admin-status-pill {
  border: 1px solid rgba(124, 156, 217, 0.26);
  background: rgba(216, 228, 255, 0.64);
  color: #4c64a3;
}

.admin-status-pending {
  border-color: rgba(124, 156, 217, 0.28);
  background: rgba(216, 228, 255, 0.68);
  color: #4c64a3;
}

.admin-status-approved {
  border-color: rgba(118, 183, 143, 0.34);
  background: rgba(199, 239, 216, 0.68);
  color: #2f7551;
}

.admin-status-warning {
  border-color: rgba(214, 167, 91, 0.38);
  background: rgba(255, 235, 196, 0.72);
  color: #9a6a25;
}

.admin-status-danger {
  border-color: rgba(214, 111, 116, 0.36);
  background: rgba(255, 221, 222, 0.76);
  color: #a3474e;
}

.admin-review-status-card h2.is-approved,
.admin-question-status-card h2.is-approved {
  color: #2f7551;
}

.admin-review-status-card h2.is-warning,
.admin-question-status-card h2.is-warning,
.admin-review-status-card h2.is-revision,
.admin-question-status-card h2.is-revision {
  color: #9a6a25;
}

.admin-review-status-card h2.is-private {
  color: #4c64a3;
}

.admin-question-status-card h2.is-danger {
  color: #a3474e;
}

.admin-review-card[data-admin-card] h3,
.admin-blog-material-card h3,
.admin-public-preview-card h3,
.admin-candidate-info h3,
.admin-blog-preview-box h3,
.admin-review-quote-box h3,
.admin-question-thread-box h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 1.16rem;
  line-height: 1.28;
}

.admin-review-card[data-admin-card] p,
.admin-blog-material-card p,
.admin-public-preview-card p,
.admin-candidate-info p,
.admin-blog-preview-box p,
.admin-review-quote-box p,
.admin-question-thread-box p,
.admin-question-hint p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.65;
}

.admin-card-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.admin-card-meta div {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 12px;
  border-radius: 18px;
  background: rgba(248, 244, 250, 0.86);
}

.admin-card-meta dt,
.admin-card-meta dd {
  margin: 0;
}

.admin-card-meta dt {
  color: var(--text-secondary);
  font-size: 0.76rem;
  font-weight: 900;
}

.admin-card-meta dd {
  color: var(--text-primary);
  font-size: 0.92rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.admin-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-card-actions .button,
.admin-blog-actions .button,
.admin-review-actions .button,
.admin-question-actions .button,
.admin-application-actions .button {
  min-height: 42px;
}

.admin-rules-card ul,
.admin-audit-list {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 12px 0 0;
  list-style: none;
}

.admin-rules-card li,
.admin-audit-list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  color: var(--text-secondary);
  line-height: 1.55;
}

.admin-rules-card li::before {
  content: "✓";
  display: inline-flex;
  width: 24px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(199, 239, 216, 0.72);
  color: #2f7551;
  font-size: 0.78rem;
  font-weight: 900;
}

.admin-audit-list li {
  grid-template-columns: 96px minmax(0, 1fr);
  padding: 10px 0;
  border-bottom: 1px solid rgba(231, 213, 226, 0.72);
}

.admin-audit-list li:last-child {
  border-bottom: 0;
}

.admin-audit-list strong {
  color: var(--text-primary);
  font-size: 0.86rem;
}

.admin-audit-list span {
  color: var(--text-secondary);
  line-height: 1.5;
}

.admin-candidate-layout {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

.admin-candidate-photo {
  display: grid;
  width: 112px;
  height: 112px;
  place-items: center;
  border: 1px solid rgba(181, 123, 190, 0.24);
  border-radius: 30px;
  background:
    radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.82), transparent 34%),
    linear-gradient(135deg, rgba(191, 159, 214, 0.22), rgba(199, 223, 240, 0.24));
  color: #8f5fb1;
  font-size: 2.2rem;
  font-weight: 900;
}

.admin-candidate-info,
.admin-candidate-pills {
  display: grid;
  gap: 10px;
}

.admin-candidate-pills {
  display: flex;
  flex-wrap: wrap;
}

.admin-application-meta-grid--compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-check-row,
.admin-blog-check-row,
.admin-review-check-row,
.admin-question-check-row,
.admin-document-row {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}

.admin-check-row.is-done,
.admin-blog-check-row.is-done,
.admin-review-check-row.is-done,
.admin-question-check-row.is-done {
  border-color: rgba(118, 183, 143, 0.32);
  background: rgba(249, 255, 251, 0.88);
}

.admin-check-icon,
.admin-document-row > span:first-child {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(191, 159, 214, 0.14);
  color: #8f5fb1;
  font-size: 0.88rem;
  font-weight: 900;
}

.admin-check-row.is-done .admin-check-icon,
.admin-blog-check-row.is-done .admin-check-icon,
.admin-review-check-row.is-done .admin-check-icon,
.admin-question-check-row.is-done .admin-check-icon {
  background: rgba(199, 239, 216, 0.72);
  color: #2f7551;
}

.admin-check-row strong,
.admin-blog-check-row strong,
.admin-review-check-row strong,
.admin-question-check-row strong,
.admin-document-row strong {
  color: var(--text-primary);
  line-height: 1.25;
}

.admin-check-row p,
.admin-blog-check-row p,
.admin-review-check-row p,
.admin-question-check-row p,
.admin-document-row small {
  margin: 4px 0 0;
  color: var(--text-secondary);
  line-height: 1.5;
}

.admin-document-row small {
  display: block;
}

.admin-decision-options,
.admin-blog-decision-options,
.admin-review-decision-options,
.admin-question-decision-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-review-decision-options,
.admin-question-decision-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-decision-option,
.admin-blog-decision-option,
.admin-review-decision-option,
.admin-question-decision-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-height: 88px;
  padding: 16px;
  border: 1px solid rgba(231, 213, 226, 0.92);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.86);
  color: var(--text-primary);
  cursor: pointer;
  font: inherit;
  text-align: left;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.admin-decision-option:hover,
.admin-blog-decision-option:hover,
.admin-review-decision-option:hover,
.admin-question-decision-option:hover,
.admin-decision-option.is-active,
.admin-blog-decision-option.is-active,
.admin-review-decision-option.is-active,
.admin-question-decision-option.is-active {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.38);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 16px 42px rgba(78, 46, 83, 0.07);
}

.choice-check {
  position: relative;
  display: inline-flex;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(181, 123, 190, 0.32);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.8);
}

.admin-decision-option.is-active .choice-check,
.admin-blog-decision-option.is-active .choice-check,
.admin-review-decision-option.is-active .choice-check,
.admin-question-decision-option.is-active .choice-check {
  border-color: #8f5fb1;
  background: rgba(191, 159, 214, 0.18);
}

.admin-decision-option.is-active .choice-check::after,
.admin-blog-decision-option.is-active .choice-check::after,
.admin-review-decision-option.is-active .choice-check::after,
.admin-question-decision-option.is-active .choice-check::after {
  content: "✓";
  color: #8f5fb1;
  font-size: 0.8rem;
  font-weight: 900;
}

.admin-decision-option strong,
.admin-blog-decision-option strong,
.admin-review-decision-option strong,
.admin-question-decision-option strong {
  display: block;
  color: var(--text-primary);
  font-weight: 900;
  line-height: 1.25;
}

.admin-decision-option small,
.admin-blog-decision-option small,
.admin-review-decision-option small,
.admin-question-decision-option small {
  display: block;
  margin-top: 4px;
  color: var(--text-secondary);
  line-height: 1.45;
}

.admin-comment-field,
.admin-review-comment-label,
.admin-question-comment-label {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  color: var(--text-primary);
  font-size: 0.92rem;
  font-weight: 900;
}

.admin-comment-field textarea,
.admin-review-comment,
.admin-question-comment {
  width: 100%;
  min-height: 132px;
  resize: vertical;
  padding: 14px 16px;
  border: 1px solid rgba(231, 213, 226, 0.94);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--text-primary);
  font: inherit;
  line-height: 1.55;
  outline: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.admin-comment-field textarea:focus,
.admin-review-comment:focus,
.admin-question-comment:focus {
  border-color: rgba(181, 123, 190, 0.42);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 0 0 4px rgba(191, 159, 214, 0.12);
}

.admin-application-actions--bottom {
  margin-top: 18px;
}

.admin-public-preview-card {
  grid-template-columns: minmax(0, 1.1fr) minmax(220px, 0.75fr);
  align-items: center;
}

.admin-blog-material-card,
.admin-blog-preview-box,
.admin-review-quote-box,
.admin-question-thread-box {
  background:
    radial-gradient(circle at top right, rgba(191, 159, 214, 0.1), transparent 42%),
    rgba(255, 255, 255, 0.9);
}

.admin-blog-preview-box blockquote,
.admin-review-quote-box blockquote,
.admin-question-thread-box blockquote {
  margin: 0;
  padding: 16px;
  border-left: 4px solid rgba(181, 123, 190, 0.42);
  border-radius: 18px;
  background: rgba(248, 244, 250, 0.82);
  color: var(--text-primary);
  line-height: 1.7;
}

.admin-blog-risk-list li,
.admin-review-risk-list li,
.admin-blog-settings-list li {
  display: grid;
  gap: 6px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(248, 244, 250, 0.82);
}

.admin-blog-risk-list strong,
.admin-review-risk-list strong,
.admin-blog-settings-list strong {
  color: var(--text-primary);
}

.admin-blog-risk-list span,
.admin-review-risk-list span,
.admin-blog-settings-list span {
  color: var(--text-secondary);
  line-height: 1.5;
}

.admin-readiness-list div,
.admin-blog-readiness-list div,
.admin-review-readiness-list div,
.admin-question-readiness-list div {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  border-radius: 18px;
  background: rgba(248, 244, 250, 0.86);
}

.admin-readiness-list span,
.admin-blog-readiness-list span,
.admin-review-readiness-list span,
.admin-question-readiness-list span {
  color: var(--text-secondary);
  font-size: 0.86rem;
  font-weight: 900;
}

.admin-readiness-list strong,
.admin-blog-readiness-list strong,
.admin-review-readiness-list strong,
.admin-question-readiness-list strong {
  color: var(--text-primary);
  font-size: 0.94rem;
  font-weight: 900;
}

.admin-question-thread-box {
  gap: 18px;
}

.admin-question-thread-box .admin-question-hint {
  border-style: dashed;
  background: rgba(255, 247, 250, 0.82);
}

.blog-public-result-note {
  margin: -4px 0 18px;
  color: var(--text-secondary);
  font-size: 0.92rem;
  font-weight: 900;
}

@media (max-width: 1120px) {
  .admin-hero-card,
  .admin-application-hero-card,
  .admin-blog-hero-card,
  .admin-review-hero-card,
  .admin-question-hero-card,
  .admin-work-grid,
  .admin-application-grid,
  .admin-blog-grid,
  .admin-review-grid,
  .admin-question-grid,
  .admin-public-preview-card {
    grid-template-columns: 1fr;
  }

  .admin-detail-card,
  .admin-rules-card,
  .admin-blog-side-card,
  .admin-review-side-card,
  .admin-question-side-card {
    position: static;
  }

  .admin-metrics-grid,
  .admin-blog-meta-grid,
  .admin-review-meta-grid,
  .admin-question-meta-grid,
  .admin-application-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .admin-page .section,
  .admin-application-page .section,
  .admin-blog-page .section,
  .admin-review-page .section,
  .admin-question-page .section {
    padding-top: 28px;
    padding-bottom: 28px;
  }

  .admin-hero-card,
  .admin-application-hero-card,
  .admin-blog-hero-card,
  .admin-review-hero-card,
  .admin-question-hero-card,
  .admin-main-panel,
  .admin-blog-card,
  .admin-review-card,
  .admin-question-card,
  .admin-application-card,
  .admin-detail-card,
  .admin-rules-card,
  .admin-backend-notice,
  .admin-blog-side-card,
  .admin-review-side-card,
  .admin-question-side-card {
    border-radius: 24px;
  }

  .admin-metrics-grid,
  .admin-blog-meta-grid,
  .admin-review-meta-grid,
  .admin-question-meta-grid,
  .admin-application-meta-grid,
  .admin-application-meta-grid--compact,
  .admin-card-meta,
  .admin-decision-options,
  .admin-blog-decision-options,
  .admin-review-decision-options,
  .admin-question-decision-options {
    grid-template-columns: 1fr;
  }

  .admin-candidate-layout,
  .admin-check-row,
  .admin-blog-check-row,
  .admin-review-check-row,
  .admin-question-check-row,
  .admin-document-row {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .admin-candidate-photo {
    width: 96px;
    height: 96px;
  }

  .admin-card-top,
  .admin-card-actions,
  .admin-hero-actions,
  .admin-application-actions,
  .admin-blog-hero-actions,
  .admin-review-hero-actions,
  .admin-question-hero-actions {
    align-items: stretch;
  }

  .admin-card-actions .button,
  .admin-hero-actions .button,
  .admin-application-actions .button,
  .admin-blog-hero-actions .button,
  .admin-review-hero-actions .button,
  .admin-question-hero-actions .button {
    width: 100%;
  }
}


/* =========================================================
   SPECIALIST CABINET DASHBOARD FIX
   Scope only: specialist-cabinet.html
   Keeps existing workspace styles and adds missing dashboard layout.
========================================================= */

.specialist-dashboard-page {
  --dashboard-card-bg: rgba(255, 255, 255, .94);
}

.specialist-dashboard-page .badge {
  width: fit-content;
}

.specialist-dashboard-hero {
  position: relative;
  overflow: hidden;
}

.specialist-dashboard-hero::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -110px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(181,123,190,.18), rgba(181,123,190,0) 68%);
  pointer-events: none;
}

.specialist-dashboard-hero-copy,
.specialist-dashboard-profile-card {
  position: relative;
  z-index: 1;
}

.specialist-dashboard-actions {
  align-items: center;
}

.specialist-dashboard-route-note {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  max-width: 780px;
  margin-top: 20px;
  padding: 14px 16px;
  border: 1px solid rgba(181,123,190,.16);
  border-radius: 22px;
  background: rgba(255,255,255,.70);
}

.specialist-dashboard-route-note span {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.specialist-dashboard-route-note p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.55;
}

.specialist-dashboard-profile-card {
  min-width: 0;
  padding: 26px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,239,251,.78));
  box-shadow: 0 18px 46px rgba(69,55,84,.07);
}

.specialist-dashboard-profile-top {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.specialist-dashboard-avatar {
  display: inline-flex;
  width: 76px;
  height: 76px;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(135deg, rgba(181,123,190,.22), rgba(244,191,208,.28));
  color: var(--section-color);
  font-size: 24px;
  font-weight: 900;
  letter-spacing: -.05em;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

.specialist-dashboard-profile-card h2 {
  margin: 16px 0 6px;
  color: var(--text-primary);
  font-size: 28px;
  line-height: 1.12;
  letter-spacing: -.055em;
}

.specialist-dashboard-profile-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.55;
}

.specialist-dashboard-readiness {
  display: grid;
  gap: 10px;
  margin-top: 22px;
  padding: 18px;
  border-radius: 24px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(237,221,231,.82);
}

.specialist-dashboard-readiness > div {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: baseline;
}

.specialist-dashboard-readiness span {
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 800;
}

.specialist-dashboard-readiness strong {
  color: var(--section-color);
  font-size: 26px;
  line-height: 1;
}

.specialist-dashboard-readiness i {
  display: block;
  height: 10px;
  overflow: hidden;
  border-radius: var(--radius-pill);
  background: rgba(181,123,190,.12);
}

.specialist-dashboard-readiness i b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--section-color), var(--brand-secondary));
}

.specialist-dashboard-readiness p {
  font-size: 13px;
}

.specialist-dashboard-status-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.specialist-dashboard-status-list div {
  min-width: 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: var(--bg-primary);
}

.specialist-dashboard-status-list span {
  display: block;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 800;
}

.specialist-dashboard-status-list strong {
  display: block;
  margin-top: 6px;
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.45;
}

.specialist-dashboard-metrics-grid {
  align-items: stretch;
}

.specialist-dashboard-today-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .42fr);
  gap: 22px;
  align-items: start;
}

.specialist-dashboard-priority-panel,
.specialist-dashboard-quick-panel,
.specialist-dashboard-checklist-panel,
.specialist-dashboard-blog-panel,
.specialist-dashboard-rules-panel {
  min-width: 0;
}

.specialist-dashboard-task-list {
  display: grid;
  gap: 14px;
}

.specialist-dashboard-task-card {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(237,221,231,.88);
  border-radius: 24px;
  background: rgba(255,255,255,.76);
}

.specialist-dashboard-task-card--hot {
  background: linear-gradient(135deg, rgba(181,123,190,.11), rgba(255,255,255,.90));
  border-color: rgba(181,123,190,.22);
}

.specialist-dashboard-task-icon {
  display: inline-flex;
  width: 54px;
  height: 54px;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.specialist-dashboard-task-card h3 {
  margin: 12px 0 0;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.28;
  letter-spacing: -.04em;
}

.specialist-dashboard-task-card p {
  margin: 10px 0 0;
  color: var(--text-secondary);
  line-height: 1.65;
}

.specialist-dashboard-task-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.specialist-dashboard-quick-panel > h2,
.specialist-dashboard-checklist-panel > h2,
.specialist-dashboard-blog-panel > h2,
.specialist-dashboard-rules-panel > h2 {
  margin: 14px 0 14px;
}

.specialist-dashboard-quick-grid {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.specialist-dashboard-quick-grid a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 4px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(237,221,231,.82);
  border-radius: 18px;
  background: rgba(255,255,255,.74);
  color: var(--text-primary);
  text-decoration: none;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.specialist-dashboard-quick-grid a:hover {
  transform: translateY(-2px);
  border-color: rgba(181,123,190,.28);
  background: rgba(255,255,255,.96);
}

.specialist-dashboard-quick-grid a > span {
  display: inline-flex;
  width: 34px;
  height: 34px;
  grid-row: 1 / span 2;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.specialist-dashboard-quick-grid strong {
  color: var(--text-primary);
  font-size: 15px;
}

.specialist-dashboard-quick-grid small {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.35;
}

.specialist-dashboard-section-grid {
  align-items: stretch;
}

.specialist-dashboard-control-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .46fr) minmax(260px, .38fr);
  gap: 20px;
  align-items: stretch;
}

.specialist-dashboard-checklist {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.specialist-dashboard-checklist p {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 16px;
  border-radius: 18px;
  background: var(--bg-primary);
}

.specialist-dashboard-checklist strong {
  color: var(--text-primary);
  font-size: 15px;
}

.specialist-dashboard-checklist span {
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.55;
}

.specialist-dashboard-mini-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.specialist-dashboard-mini-list a {
  display: grid;
  gap: 6px;
  padding: 16px;
  border: 1px solid rgba(237,221,231,.82);
  border-radius: 18px;
  background: rgba(255,255,255,.74);
  color: var(--text-primary);
  text-decoration: none;
}

.specialist-dashboard-mini-list strong {
  color: var(--text-primary);
  line-height: 1.35;
}

.specialist-dashboard-mini-list span {
  width: fit-content;
  padding: 7px 10px;
  border-radius: var(--radius-pill);
  background: var(--section-color-soft);
  color: var(--section-color);
  font-size: 12px;
  font-weight: 800;
}

.specialist-dashboard-rules-panel {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(248,239,251,.78));
}

.specialist-dashboard-rules-panel p {
  margin: 0 0 18px;
}

.specialist-dashboard-role-card {
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,238,244,.72));
}

.specialist-dashboard-role-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.specialist-dashboard-role-flow p {
  position: relative;
  margin: 0;
  padding: 16px;
  border: 1px solid rgba(237,221,231,.82);
  border-radius: 20px;
  background: rgba(255,255,255,.82);
}

.specialist-dashboard-role-flow span {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  border-radius: 14px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.specialist-dashboard-role-flow strong {
  display: block;
  color: var(--text-primary);
  line-height: 1.35;
}

@media (max-width: 1180px) {
  .specialist-dashboard-control-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .specialist-dashboard-rules-panel {
    grid-column: 1 / -1;
  }

  .specialist-dashboard-role-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .specialist-dashboard-today-grid {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-profile-top {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .specialist-dashboard-avatar {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    font-size: 21px;
  }
}

@media (max-width: 720px) {
  .specialist-dashboard-profile-card {
    padding: 20px;
    border-radius: 24px;
  }

  .specialist-dashboard-route-note,
  .specialist-dashboard-task-card {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-route-note span,
  .specialist-dashboard-task-icon {
    width: 42px;
    height: 42px;
  }

  .specialist-dashboard-task-actions,
  .specialist-dashboard-actions {
    align-items: stretch;
  }

  .specialist-dashboard-task-actions .button,
  .specialist-dashboard-actions .button {
    width: 100%;
  }

  .specialist-dashboard-control-grid,
  .specialist-dashboard-role-flow {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-quick-grid a {
    grid-template-columns: 32px minmax(0, 1fr);
  }
}


/* Cabinet role center — scoped: cabinet.html */
.cabinet-role-page{overflow:hidden}.cabinet-role-hero-section{padding-top:42px}.cabinet-role-hero-card{position:relative;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.42fr);gap:24px;align-items:stretch;padding:clamp(26px,4vw,44px);border:1px solid rgba(237,221,231,.92);border-radius:var(--radius-lg);background:radial-gradient(circle at 12% 10%,rgba(220,184,226,.34),transparent 30%),radial-gradient(circle at 90% 12%,rgba(245,198,216,.28),transparent 32%),rgba(255,255,255,.88);box-shadow:var(--shadow-soft);overflow:hidden}.cabinet-role-hero-card:after{content:'';position:absolute;right:-120px;bottom:-160px;width:330px;height:330px;border-radius:50%;background:rgba(181,123,190,.13);pointer-events:none}.cabinet-role-hero-copy,.cabinet-role-current-card,.cabinet-role-card,.cabinet-role-action-panel,.cabinet-role-flow-main,.cabinet-role-safety-card{min-width:0}.cabinet-role-hero-copy{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center}.cabinet-role-hero-copy h1{max-width:820px;margin:18px 0 0;color:var(--text-primary);font-size:clamp(38px,5vw,68px);line-height:.98;letter-spacing:-.07em}.cabinet-role-hero-copy>p{max-width:720px;margin:22px 0 0;color:var(--text-secondary);font-size:17px;line-height:1.75}.cabinet-role-hero-actions,.cabinet-role-card-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.cabinet-role-hero-actions{margin-top:28px}.cabinet-role-note{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:flex-start;max-width:760px;margin-top:22px;padding:14px 16px;border:1px solid rgba(181,123,190,.16);border-radius:22px;background:rgba(255,255,255,.68)}.cabinet-role-note span,.cabinet-role-icon,.cabinet-role-action-list a>span,.cabinet-role-flow-list article>span{display:inline-flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary));font-weight:900;font-family:Arial,sans-serif}.cabinet-role-note span{width:34px;height:34px;border-radius:50%}.cabinet-role-note p{margin:0;color:var(--text-secondary);font-size:14px;line-height:1.65}.cabinet-role-current-card,.cabinet-role-card,.cabinet-role-action-panel,.cabinet-role-flow-main,.cabinet-role-safety-card{position:relative;z-index:1;border:1px solid rgba(237,221,231,.9);border-radius:var(--radius-lg);background:rgba(255,255,255,.9);box-shadow:0 18px 48px rgba(69,55,84,.06)}.cabinet-role-current-card{display:flex;flex-direction:column;gap:22px;padding:24px}.cabinet-role-current-head{display:grid;grid-template-columns:70px minmax(0,1fr);gap:16px;align-items:center}.cabinet-role-avatar{display:inline-flex;align-items:center;justify-content:center;width:70px;height:70px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#b57bbe,#f0a6c2);box-shadow:0 16px 34px rgba(181,123,190,.22);font-weight:900;letter-spacing:-.04em}.cabinet-role-current-head h2{margin:10px 0 4px;color:var(--text-primary);font-size:25px;line-height:1.15;letter-spacing:-.045em}.cabinet-role-current-head p{margin:0;color:var(--text-secondary);font-size:14px;line-height:1.55}.cabinet-role-status-stack{display:grid;gap:10px}.cabinet-role-status-row{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 16px;border-radius:20px;border:1px solid rgba(237,221,231,.8);background:var(--bg-primary)}.cabinet-role-status-row span{color:var(--text-secondary);font-size:13px}.cabinet-role-status-row strong{color:var(--text-primary);font-size:13px;font-weight:800;text-align:right}.cabinet-role-status-row.is-active strong,.cabinet-role-status-row.is-approved strong{color:#5f8d67}.cabinet-role-status-row.is-demo strong{color:var(--section-color)}.cabinet-role-heading{max-width:790px}.cabinet-role-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:30px}.cabinet-role-card{display:flex;flex-direction:column;gap:16px;padding:24px;overflow:hidden}.cabinet-role-card:after{content:'';position:absolute;inset:auto -60px -90px auto;width:190px;height:190px;border-radius:50%;background:rgba(181,123,190,.08);pointer-events:none}.cabinet-role-card-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.cabinet-role-icon{width:46px;height:46px;border-radius:18px;font-size:15px;letter-spacing:-.04em}.cabinet-role-pill{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:0 12px;border-radius:var(--radius-pill);border:1px solid rgba(181,123,190,.16);background:rgba(181,123,190,.08);color:var(--section-color);font-size:12px;font-weight:800;white-space:nowrap}.cabinet-role-pill.is-active,.cabinet-role-pill.is-approved{color:#5f8d67;background:rgba(131,174,123,.12);border-color:rgba(131,174,123,.2)}.cabinet-role-pill.is-pending{color:#ad7a28;background:rgba(244,179,91,.14);border-color:rgba(244,179,91,.25)}.cabinet-role-pill.is-demo{color:#7f6fb0;background:rgba(127,111,176,.11);border-color:rgba(127,111,176,.2)}.cabinet-role-card h3{margin:0;color:var(--text-primary);font-size:24px;line-height:1.18;letter-spacing:-.045em}.cabinet-role-card p{flex:1;margin:0;color:var(--text-secondary);font-size:15px;line-height:1.7}.cabinet-role-card-actions{position:relative;z-index:1;margin-top:4px}.cabinet-role-link{color:var(--section-color);font-size:14px;font-weight:800;text-decoration:none}.cabinet-role-link:hover{text-decoration:underline}.cabinet-role-actions-grid,.cabinet-role-flow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:stretch}.cabinet-role-action-panel,.cabinet-role-flow-main,.cabinet-role-safety-card{padding:28px}.cabinet-role-action-panel h2,.cabinet-role-flow-main h2,.cabinet-role-safety-card h2{margin:14px 0 0;color:var(--text-primary);font-size:clamp(28px,3vw,42px);line-height:1.08;letter-spacing:-.055em}.cabinet-role-flow-main>p,.cabinet-role-safety-card>p{margin:14px 0 0;color:var(--text-secondary);font-size:15px;line-height:1.7}.cabinet-role-action-list,.cabinet-role-flow-list,.cabinet-role-checks{display:grid;gap:14px;margin-top:24px}.cabinet-role-action-list a,.cabinet-role-flow-list article{display:grid;grid-template-columns:46px minmax(0,1fr);gap:14px;align-items:flex-start;padding:16px;border:1px solid rgba(237,221,231,.85);border-radius:24px;background:var(--bg-primary);text-decoration:none;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.cabinet-role-action-list a:hover,.cabinet-role-flow-list article:hover{transform:translateY(-2px);border-color:rgba(181,123,190,.24);box-shadow:0 16px 36px rgba(69,55,84,.06)}.cabinet-role-action-list a>span,.cabinet-role-flow-list article>span{width:46px;height:46px;border-radius:17px}.cabinet-role-action-list strong,.cabinet-role-flow-list h3{display:block;margin:0;color:var(--text-primary);font-size:17px;line-height:1.35}.cabinet-role-action-list p,.cabinet-role-flow-list p{margin:6px 0 0;color:var(--text-secondary);font-size:14px;line-height:1.65}.cabinet-role-safety-card{background:radial-gradient(circle at 100% 0%,rgba(220,184,226,.2),transparent 34%),rgba(255,255,255,.92)}.cabinet-role-checks p{margin:0;padding:12px 14px;border-radius:18px;background:var(--bg-primary);border:1px solid rgba(237,221,231,.8);color:var(--text-primary);font-weight:700}.cabinet-role-cta-card{align-items:center}@media (max-width:1120px){.cabinet-role-hero-card,.cabinet-role-flow-grid{grid-template-columns:1fr}.cabinet-role-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:760px){.cabinet-role-hero-section{padding-top:24px}.cabinet-role-hero-card,.cabinet-role-current-card,.cabinet-role-card,.cabinet-role-action-panel,.cabinet-role-flow-main,.cabinet-role-safety-card{border-radius:28px}.cabinet-role-hero-card,.cabinet-role-action-panel,.cabinet-role-flow-main,.cabinet-role-safety-card{padding:22px}.cabinet-role-hero-copy h1{font-size:clamp(34px,11vw,46px)}.cabinet-role-hero-actions .button,.cabinet-role-card-actions .button,.cabinet-role-cta-card .button{width:100%}.cabinet-role-grid,.cabinet-role-actions-grid{grid-template-columns:1fr}.cabinet-role-current-head,.cabinet-role-action-list a,.cabinet-role-flow-list article{grid-template-columns:1fr}.cabinet-role-action-list a>span,.cabinet-role-flow-list article>span{width:42px;height:42px}.cabinet-role-status-row{align-items:flex-start;flex-direction:column;gap:6px}.cabinet-role-status-row strong{text-align:left}}

/* =========================================================
   CROSS-PAGE ROLE DASHBOARD CARDS
   Scope: inserted role/status/action routes across client, specialist,
   candidate, blog and admin pages. Does not touch .trust-chip.
========================================================= */
.role-dashboard-section{position:relative;padding-top:0}.role-dashboard-shell,.role-dashboard-strip{position:relative;border:1px solid rgba(237,221,231,.92);border-radius:var(--radius-lg);background:radial-gradient(circle at 8% 10%,rgba(220,184,226,.26),transparent 32%),radial-gradient(circle at 94% 8%,rgba(245,198,216,.18),transparent 30%),rgba(255,255,255,.88);box-shadow:var(--shadow-soft);overflow:hidden}.role-dashboard-shell{padding:clamp(22px,3.4vw,36px)}.role-dashboard-shell::after{content:'';position:absolute;right:-110px;bottom:-150px;width:300px;height:300px;border-radius:999px;background:rgba(181,123,190,.1);pointer-events:none}.role-dashboard-head{position:relative;z-index:1;max-width:860px}.role-dashboard-head h2{margin:14px 0 0;color:var(--text-primary);font-size:clamp(28px,3.2vw,46px);line-height:1.08;letter-spacing:-.055em}.role-dashboard-head p{max-width:760px;margin:14px 0 0;color:var(--text-secondary);font-size:16px;line-height:1.72}.role-dashboard-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:26px}.role-dashboard-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}.role-dashboard-card{position:relative;display:flex;flex-direction:column;min-width:0;min-height:100%;padding:20px;border:1px solid rgba(237,221,231,.88);border-radius:28px;background:rgba(255,255,255,.88);box-shadow:0 14px 34px rgba(69,55,84,.045);overflow:hidden}.role-dashboard-card::after{content:'';position:absolute;right:-62px;bottom:-78px;width:160px;height:160px;border-radius:999px;background:rgba(181,123,190,.07);pointer-events:none}.role-dashboard-card-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.role-dashboard-step,.role-dashboard-strip article>span{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:17px;color:#fff;background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary));font-family:Arial,sans-serif;font-size:14px;font-weight:900;letter-spacing:-.04em;box-shadow:0 12px 24px rgba(181,123,190,.18)}.role-dashboard-pill{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:0 12px;border:1px solid rgba(181,123,190,.16);border-radius:var(--radius-pill);background:rgba(181,123,190,.08);color:var(--section-color);font-size:12px;font-weight:850;white-space:nowrap}.role-dashboard-pill.is-active,.role-dashboard-pill.is-done{color:#5f8d67;border-color:rgba(131,174,123,.22);background:rgba(131,174,123,.12)}.role-dashboard-pill.is-pending{color:#ad7a28;border-color:rgba(244,179,91,.25);background:rgba(244,179,91,.14)}.role-dashboard-pill.is-work{color:#7f6fb0;border-color:rgba(127,111,176,.2);background:rgba(127,111,176,.11)}.role-dashboard-pill.is-demo{color:#9a6276;border-color:rgba(240,166,194,.28);background:rgba(240,166,194,.13)}.role-dashboard-card h3{position:relative;z-index:1;margin:0;color:var(--text-primary);font-size:21px;line-height:1.2;letter-spacing:-.045em}.role-dashboard-card p{position:relative;z-index:1;flex:1;margin:10px 0 0;color:var(--text-secondary);font-size:14px;line-height:1.68}.role-dashboard-link{position:relative;z-index:1;display:inline-flex;width:fit-content;margin-top:18px;color:var(--section-color);font-size:14px;font-weight:850;text-decoration:none}.role-dashboard-link:hover,.role-dashboard-link:focus-visible{text-decoration:underline}.role-dashboard-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px}.role-dashboard-strip--four{grid-template-columns:repeat(4,minmax(0,1fr))}.role-dashboard-strip article{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:flex-start;min-width:0;padding:16px;border:1px solid rgba(237,221,231,.82);border-radius:24px;background:rgba(255,255,255,.86)}.role-dashboard-strip strong{display:block;color:var(--text-primary);font-size:16px;line-height:1.28}.role-dashboard-strip p{margin:6px 0 0;color:var(--text-secondary);font-size:13px;line-height:1.55}@media(max-width:1120px){.role-dashboard-grid,.role-dashboard-grid--three,.role-dashboard-grid--four,.role-dashboard-strip,.role-dashboard-strip--four{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.role-dashboard-shell,.role-dashboard-strip,.role-dashboard-card{border-radius:26px}.role-dashboard-shell{padding:20px}.role-dashboard-grid,.role-dashboard-grid--three,.role-dashboard-grid--four,.role-dashboard-strip,.role-dashboard-strip--four{grid-template-columns:1fr}.role-dashboard-card-top{align-items:flex-start;flex-direction:column}.role-dashboard-strip article{grid-template-columns:1fr}}


/* =========================================================
   AUDITED ADMIN / REQUEST LAYOUT STABILIZATION — 2026-04-22
   Scope: admin moderation pages, request pages, role dashboards.
   Replaces the previous stacked v3-v6 hardfixes with one coherent layer.
========================================================= */

.admin-page,
.admin-application-page,
.admin-blog-page,
.admin-review-page,
.admin-question-page,
.client-requests-page,
.client-request-detail-page,
.specialist-requests-page,
.specialist-request-detail-page,
.cabinet-role-page,
.specialist-dashboard-page,
.become-specialist-page,
.specialist-application-page,
.specialist-blog-page,
.specialist-blog-editor-page {
  overflow-x: clip;
}

.admin-page *,
.admin-application-page *,
.admin-blog-page *,
.admin-review-page *,
.admin-question-page *,
.client-requests-page *,
.client-request-detail-page *,
.specialist-requests-page *,
.specialist-request-detail-page *,
.cabinet-role-page *,
.specialist-dashboard-page * {
  box-sizing: border-box;
}

.admin-page .container,
.admin-application-page .container,
.admin-blog-page .container,
.admin-review-page .container,
.admin-question-page .container,
.client-requests-page .container,
.client-request-detail-page .container,
.specialist-requests-page .container,
.specialist-request-detail-page .container,
.cabinet-role-page .container,
.specialist-dashboard-page .container {
  min-width: 0;
}

.admin-page .section,
.admin-application-page .section,
.admin-blog-page .section,
.admin-review-page .section,
.admin-question-page .section,
.client-requests-page .section,
.client-request-detail-page .section,
.specialist-requests-page .section,
.specialist-request-detail-page .section,
.cabinet-role-page .section,
.specialist-dashboard-page .section {
  padding-top: clamp(34px, 4vw, 58px);
  padding-bottom: clamp(34px, 4vw, 58px);
}

.admin-page .section + .section,
.admin-application-page .section + .section,
.admin-blog-page .section + .section,
.admin-review-page .section + .section,
.admin-question-page .section + .section,
.client-requests-page .section + .section,
.client-request-detail-page .section + .section,
.specialist-requests-page .section + .section,
.specialist-request-detail-page .section + .section,
.cabinet-role-page .section + .section,
.specialist-dashboard-page .section + .section {
  margin-top: 0;
}

.admin-work-grid,
.admin-application-grid,
.admin-blog-grid,
.admin-review-grid,
.admin-question-grid,
.client-requests-layout,
.client-request-detail-layout,
.specialist-request-detail-layout {
  min-width: 0;
  gap: clamp(24px, 3vw, 36px);
  align-items: start;
}

.admin-application-grid,
.admin-blog-grid,
.admin-review-grid,
.admin-question-grid,
.client-request-detail-layout,
.specialist-request-detail-layout {
  grid-template-columns: minmax(0, 1fr) minmax(290px, 360px);
}

.admin-application-main,
.admin-blog-main,
.admin-review-main,
.admin-question-main,
.client-requests-main,
.client-request-detail-main,
.specialist-request-detail-main,
.admin-side-panel,
.admin-application-side,
.admin-blog-side,
.admin-review-side,
.admin-question-side,
.client-requests-side,
.client-request-detail-side,
.specialist-request-detail-sidebar {
  display: grid;
  gap: clamp(20px, 2.6vw, 32px);
  min-width: 0;
  align-content: start;
}

.admin-main-panel,
.admin-application-card,
.admin-blog-card,
.admin-review-card,
.admin-question-card,
.admin-detail-card,
.admin-rules-card,
.admin-backend-notice,
.admin-access-card,
.admin-application-status-card,
.admin-blog-status-card,
.admin-review-status-card,
.admin-question-status-card,
.admin-blog-side-card,
.admin-review-side-card,
.admin-question-side-card,
.client-requests-main,
.client-requests-summary-card,
.client-requests-side-card,
.client-request-card,
.client-request-detail-card,
.client-request-detail-side-card,
.client-request-detail-status-card,
.specialist-request-card,
.specialist-request-detail-status-card,
.specialist-request-detail-card,
.specialist-request-actions-card,
.specialist-workspace-panel,
.cabinet-role-card,
.cabinet-role-current-card,
.cabinet-role-action-panel,
.cabinet-role-flow-main,
.cabinet-role-safety-card,
.specialist-dashboard-profile-card,
.specialist-dashboard-priority-panel,
.specialist-dashboard-quick-panel,
.specialist-dashboard-checklist-panel,
.specialist-dashboard-blog-panel,
.specialist-dashboard-rules-panel,
.specialist-dashboard-role-card {
  min-width: 0;
  max-width: 100%;
}

.admin-main-panel,
.admin-application-card,
.admin-blog-card,
.admin-review-card,
.admin-question-card {
  padding: clamp(22px, 2.8vw, 34px);
}

.admin-detail-card,
.admin-rules-card,
.admin-backend-notice,
.admin-blog-side-card,
.admin-review-side-card,
.admin-question-side-card,
.client-request-detail-card,
.client-request-detail-side-card,
.client-request-detail-status-card {
  padding: clamp(20px, 2.5vw, 28px);
}

.admin-card-section-head {
  display: grid;
  grid-template-columns: 1fr;
  justify-items: start;
  align-items: start;
  gap: 10px;
  min-width: 0;
  margin: 0 0 clamp(18px, 2.2vw, 26px);
}

.admin-card-section-head > .badge,
.admin-card-section-head > span.badge {
  width: fit-content;
  max-width: 100%;
  margin: 0;
}

.admin-card-section-head > div {
  display: grid;
  gap: 8px;
  min-width: 0;
  width: 100%;
}

.admin-card-section-head h2,
.admin-card-section-head h3,
.admin-card-section-head p,
.admin-panel-head h2,
.admin-panel-head p {
  max-width: 100%;
  margin-top: 0;
  overflow-wrap: anywhere;
}

.admin-blog-meta-grid,
.admin-review-meta-grid,
.admin-question-meta-grid,
.admin-application-meta-grid,
.admin-card-meta {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 14px;
  min-width: 0;
}

.admin-blog-meta-grid > div,
.admin-review-meta-grid > div,
.admin-question-meta-grid > div,
.admin-application-meta-grid > div,
.admin-card-meta > div,
.client-request-meta-grid > div,
.client-request-detail-status-grid > div,
.specialist-request-detail-mini-dl > div,
.specialist-workspace-safe-dl > div {
  min-width: 0;
  overflow: hidden;
}

.admin-blog-meta-grid dt,
.admin-review-meta-grid dt,
.admin-question-meta-grid dt,
.admin-application-meta-grid dt,
.admin-card-meta dt,
.admin-blog-meta-grid dd,
.admin-review-meta-grid dd,
.admin-question-meta-grid dd,
.admin-application-meta-grid dd,
.admin-card-meta dd,
.client-request-meta-grid span,
.client-request-meta-grid strong,
.client-request-detail-status-grid span,
.client-request-detail-status-grid strong,
.specialist-request-detail-mini-dl dt,
.specialist-request-detail-mini-dl dd,
.specialist-workspace-safe-dl dt,
.specialist-workspace-safe-dl dd {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.admin-type-pill,
.admin-status-pill,
.client-request-status,
.client-request-type,
.status-pill,
.cabinet-role-pill,
.role-dashboard-pill {
  max-width: 100%;
  min-width: 0;
  height: auto;
  line-height: 1.25;
  text-align: center;
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
}

.admin-checklist-list,
.admin-document-list,
.admin-blog-checklist,
.admin-review-checklist,
.admin-question-checklist,
.admin-blog-risk-list,
.admin-review-risk-list,
.admin-blog-settings-list,
.admin-readiness-list,
.admin-blog-readiness-list,
.admin-review-readiness-list,
.admin-question-readiness-list,
.admin-audit-list,
.client-request-next-grid,
.client-request-timeline,
.specialist-request-card-list,
.specialist-dashboard-task-list,
.specialist-dashboard-quick-grid,
.specialist-dashboard-mini-list,
.cabinet-role-action-list,
.cabinet-role-flow-list {
  min-width: 0;
  gap: clamp(12px, 1.6vw, 18px);
}

.admin-check-row,
.admin-blog-check-row,
.admin-review-check-row,
.admin-question-check-row {
  grid-template-columns: 44px minmax(0, 1fr) max-content;
  gap: 14px 18px;
  align-items: start;
  min-width: 0;
  padding: clamp(16px, 2vw, 20px);
}

.admin-check-row > div,
.admin-blog-check-row > div,
.admin-review-check-row > div,
.admin-question-check-row > div,
.admin-document-row > div,
.specialist-request-card-title {
  min-width: 0;
}

.admin-check-icon,
.admin-document-row > span:first-child {
  width: 42px;
  height: 42px;
  min-width: 42px;
  min-height: 42px;
  flex: 0 0 42px;
  align-self: start;
  line-height: 1;
  white-space: nowrap;
  writing-mode: horizontal-tb;
}

.admin-check-row strong,
.admin-blog-check-row strong,
.admin-review-check-row strong,
.admin-question-check-row strong,
.admin-check-row p,
.admin-blog-check-row p,
.admin-review-check-row p,
.admin-question-check-row p {
  min-width: 0;
  max-width: 100%;
  margin: 0;
  overflow-wrap: anywhere;
}

.admin-check-row .admin-status-pill,
.admin-blog-check-row .admin-status-pill,
.admin-review-check-row .admin-status-pill,
.admin-question-check-row .admin-status-pill {
  justify-self: end;
  align-self: start;
  min-height: 32px;
  max-width: 190px;
  padding: 8px 12px;
}

.admin-document-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) max-content;
  gap: 14px 18px;
  align-items: center;
  min-width: 0;
  width: 100%;
  padding: clamp(16px, 2vw, 20px);
}

.admin-document-row strong,
.admin-document-row small {
  display: block;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  overflow-wrap: anywhere;
}

.admin-document-row .button,
.admin-document-row .admin-document-action {
  width: auto;
  min-width: 136px;
  max-width: 100%;
  min-height: 42px;
  height: auto;
  justify-self: end;
  align-self: center;
  padding: 10px 18px;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
  writing-mode: horizontal-tb;
}

.admin-decision-options,
.admin-blog-decision-options,
.admin-review-decision-options,
.admin-question-decision-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.8vw, 20px);
  align-items: stretch;
  min-width: 0;
  width: 100%;
  margin: clamp(16px, 2vw, 24px) 0 clamp(20px, 2.3vw, 30px);
}

.admin-review-decision-options,
.admin-question-decision-options {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
}

.admin-decision-option,
.admin-blog-decision-option,
.admin-review-decision-option,
.admin-question-decision-option {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 6px 12px;
  align-items: start;
  min-width: 0;
  width: 100%;
  min-height: 104px;
  padding: clamp(16px, 2vw, 22px);
  border-radius: 24px;
  white-space: normal;
  text-align: left;
  overflow: hidden;
}

.admin-decision-option .choice-check,
.admin-blog-decision-option .choice-check,
.admin-review-decision-option .choice-check,
.admin-question-decision-option .choice-check {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
  justify-self: start;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
}

.admin-review-decision-option > span:not(.choice-check),
.admin-question-decision-option > span:not(.choice-check) {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-decision-option > strong,
.admin-blog-decision-option > strong,
.admin-review-decision-option strong,
.admin-question-decision-option strong {
  grid-column: 2;
  grid-row: 1;
  display: block;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.admin-decision-option > small,
.admin-blog-decision-option > small,
.admin-review-decision-option small,
.admin-question-decision-option small {
  grid-column: 2;
  grid-row: 2;
  display: block;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.admin-comment-field,
.admin-review-comment-label,
.admin-question-comment-label {
  display: grid;
  gap: 10px;
  min-width: 0;
  margin-top: clamp(18px, 2vw, 28px);
}

.admin-comment-field textarea,
.admin-review-comment,
.admin-question-comment,
.admin-blog-page textarea,
.admin-application-page textarea,
.admin-review-page textarea,
.admin-question-page textarea {
  width: 100%;
  max-width: 100%;
  min-height: 132px;
  padding: 16px 18px;
  line-height: 1.55;
  resize: vertical;
}

.admin-application-actions,
.admin-application-actions--bottom,
.admin-blog-actions,
.admin-review-actions,
.admin-question-actions,
.admin-card-actions,
.admin-hero-actions,
.admin-blog-hero-actions,
.admin-review-hero-actions,
.admin-question-hero-actions,
.client-requests-hero-actions,
.client-request-actions,
.client-request-detail-actions,
.specialist-request-card-actions,
.specialist-dashboard-actions,
.specialist-dashboard-task-actions,
.cabinet-role-hero-actions,
.cabinet-role-card-actions,
.specialist-blog-editor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 14px;
  align-items: center;
  min-width: 0;
}

.admin-application-actions--bottom,
.admin-blog-actions,
.admin-review-actions,
.admin-question-actions {
  margin-top: clamp(20px, 2.4vw, 32px);
}

.admin-application-actions .button,
.admin-blog-actions .button,
.admin-review-actions .button,
.admin-question-actions .button,
.admin-card-actions .button,
.admin-hero-actions .button,
.admin-blog-hero-actions .button,
.admin-review-hero-actions .button,
.admin-question-hero-actions .button,
.client-request-actions .button,
.client-request-detail-actions .button,
.specialist-request-card-actions .button,
.specialist-dashboard-task-actions .button,
.specialist-dashboard-actions .button,
.cabinet-role-card-actions .button,
.cabinet-role-hero-actions .button,
.specialist-blog-editor-actions .button {
  width: auto;
  max-width: 100%;
  min-width: min(100%, 150px);
  min-height: 44px;
  height: auto;
  padding: 10px 18px;
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
  line-height: 1.25;
}

.admin-blog-preview-box,
.admin-review-quote-box,
.admin-question-thread-box,
.admin-public-preview-card,
.admin-candidate-layout,
.admin-blog-risk-list > *,
.admin-review-risk-list > *,
.admin-blog-settings-list > *,
.admin-readiness-list > *,
.admin-blog-readiness-list > *,
.admin-review-readiness-list > *,
.admin-question-readiness-list > *,
.admin-audit-list > *,
.client-request-next-grid > *,
.client-request-timeline > *,
.specialist-dashboard-task-card,
.specialist-dashboard-quick-grid a,
.specialist-dashboard-mini-list a,
.cabinet-role-action-list a,
.cabinet-role-flow-list article,
.role-dashboard-card,
.role-dashboard-strip > article {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.admin-blog-risk-list > * p,
.admin-review-risk-list > * p,
.admin-blog-settings-list > * dd,
.admin-readiness-list > * strong,
.admin-blog-readiness-list > * strong,
.admin-review-readiness-list > * strong,
.admin-question-readiness-list > * strong,
.admin-audit-list > * span,
.role-dashboard-card h3,
.role-dashboard-card p,
.role-dashboard-link,
.cabinet-role-card h3,
.cabinet-role-card p,
.specialist-dashboard-task-card h3,
.specialist-dashboard-task-card p {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.client-request-detail-hero-card {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
  gap: clamp(24px, 3vw, 38px);
  align-items: stretch;
  min-width: 0;
}

.client-request-detail-status-card {
  align-content: start;
  overflow: hidden;
}

.client-request-detail-status-card h2 {
  margin: 12px 0 0;
  overflow-wrap: anywhere;
}

.client-request-detail-status-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  min-width: 0;
  width: 100%;
}

.client-request-detail-status-grid > div {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
}

.client-request-detail-status-grid strong {
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.25;
}

.role-dashboard-section,
.role-dashboard-section--compact {
  padding-top: clamp(28px, 3.2vw, 44px);
  padding-bottom: clamp(28px, 3.2vw, 44px);
}

.role-dashboard-shell,
.role-dashboard-strip {
  min-width: 0;
  max-width: 100%;
}

.role-dashboard-grid,
.role-dashboard-grid--three,
.role-dashboard-grid--four,
.role-dashboard-strip,
.role-dashboard-strip--four,
.cabinet-role-grid,
.cabinet-role-actions-grid,
.cabinet-role-flow-grid,
.specialist-dashboard-today-grid,
.specialist-dashboard-control-grid,
.specialist-dashboard-role-flow,
.specialist-dashboard-section-grid,
.specialist-workspace-metrics-grid {
  min-width: 0;
  gap: clamp(14px, 1.8vw, 22px);
}

.role-dashboard-card {
  padding: clamp(18px, 2vw, 24px);
}

.role-dashboard-link,
.cabinet-role-link {
  width: fit-content;
  max-width: 100%;
}

.specialist-dashboard-task-card {
  grid-template-columns: 54px minmax(0, 1fr);
}

.specialist-dashboard-quick-grid a,
.cabinet-role-action-list a,
.cabinet-role-flow-list article {
  grid-template-columns: 46px minmax(0, 1fr);
}

.specialist-blog-editor-layout,
.specialist-blog-editor-form,
.specialist-blog-editor-sidebar,
.application-layout,
.application-form-card,
.application-side-card {
  min-width: 0;
}

.specialist-blog-editor-field input,
.specialist-blog-editor-field textarea,
.application-form-card .form-field input:not([type="hidden"]),
.application-form-card .form-field textarea,
.application-form-card .form-field select,
.application-form-card .custom-select__button {
  max-width: 100%;
}

@media (max-width: 1180px) {
  .admin-work-grid,
  .admin-application-grid,
  .admin-blog-grid,
  .admin-review-grid,
  .admin-question-grid,
  .client-requests-layout,
  .client-request-detail-layout,
  .client-request-detail-hero-card,
  .specialist-request-detail-layout,
  .specialist-request-detail-hero,
  .cabinet-role-hero-card,
  .cabinet-role-flow-grid,
  .specialist-dashboard-today-grid {
    grid-template-columns: 1fr;
  }

  .admin-detail-card,
  .admin-rules-card,
  .admin-blog-side-card,
  .admin-review-side-card,
  .admin-question-side-card {
    position: static;
    top: auto;
  }

  .client-requests-side,
  .client-request-detail-side,
  .specialist-request-detail-sidebar,
  .admin-application-side,
  .admin-blog-side,
  .admin-review-side,
  .admin-question-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .admin-page .container,
  .admin-application-page .container,
  .admin-blog-page .container,
  .admin-review-page .container,
  .admin-question-page .container,
  .client-requests-page .container,
  .client-request-detail-page .container,
  .specialist-requests-page .container,
  .specialist-request-detail-page .container,
  .cabinet-role-page .container,
  .specialist-dashboard-page .container {
    width: min(calc(100% - 28px), var(--container));
  }

  .admin-hero-card,
  .admin-application-hero-card,
  .admin-blog-hero-card,
  .admin-review-hero-card,
  .admin-question-hero-card,
  .client-requests-hero-card,
  .client-request-detail-hero-card {
    padding: clamp(22px, 5vw, 30px);
  }

  .admin-check-row,
  .admin-blog-check-row,
  .admin-review-check-row,
  .admin-question-check-row {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .admin-check-row .admin-status-pill,
  .admin-blog-check-row .admin-status-pill,
  .admin-review-check-row .admin-status-pill,
  .admin-question-check-row .admin-status-pill {
    grid-column: 2;
    justify-self: start;
  }

  .admin-document-row {
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: start;
  }

  .admin-document-row .button,
  .admin-document-row .admin-document-action {
    grid-column: 2;
    justify-self: start;
    width: fit-content;
    min-width: 136px;
  }

  .admin-decision-options,
  .admin-blog-decision-options,
  .admin-review-decision-options,
  .admin-question-decision-options,
  .client-request-next-grid,
  .client-request-meta-grid,
  .client-requests-summary-grid,
  .specialist-dashboard-control-grid,
  .specialist-dashboard-role-flow,
  .cabinet-role-grid,
  .cabinet-role-actions-grid,
  .role-dashboard-grid,
  .role-dashboard-grid--three,
  .role-dashboard-grid--four,
  .role-dashboard-strip,
  .role-dashboard-strip--four {
    grid-template-columns: 1fr;
  }

  .client-requests-side,
  .client-request-detail-side,
  .specialist-request-detail-sidebar,
  .admin-application-side,
  .admin-blog-side,
  .admin-review-side,
  .admin-question-side {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .admin-main-panel,
  .admin-application-card,
  .admin-blog-card,
  .admin-review-card,
  .admin-question-card,
  .admin-detail-card,
  .admin-rules-card,
  .admin-backend-notice,
  .admin-blog-side-card,
  .admin-review-side-card,
  .admin-question-side-card,
  .client-requests-main,
  .client-request-card,
  .client-request-detail-card,
  .client-request-detail-side-card,
  .client-request-detail-status-card,
  .specialist-request-card,
  .specialist-request-detail-card,
  .specialist-request-actions-card,
  .cabinet-role-card,
  .cabinet-role-current-card,
  .specialist-dashboard-profile-card {
    padding: 20px;
    border-radius: 24px;
  }

  .admin-check-row,
  .admin-blog-check-row,
  .admin-review-check-row,
  .admin-question-check-row,
  .admin-document-row,
  .admin-candidate-layout,
  .specialist-dashboard-task-card,
  .specialist-dashboard-quick-grid a,
  .cabinet-role-action-list a,
  .cabinet-role-flow-list article {
    grid-template-columns: 1fr;
  }

  .admin-check-row .admin-status-pill,
  .admin-blog-check-row .admin-status-pill,
  .admin-review-check-row .admin-status-pill,
  .admin-question-check-row .admin-status-pill,
  .admin-document-row .button,
  .admin-document-row .admin-document-action {
    grid-column: 1;
    justify-self: start;
  }

  .admin-document-row .button,
  .admin-document-row .admin-document-action,
  .admin-application-actions .button,
  .admin-blog-actions .button,
  .admin-review-actions .button,
  .admin-question-actions .button,
  .admin-card-actions .button,
  .client-request-actions .button,
  .client-request-detail-actions .button,
  .specialist-request-card-actions .button,
  .specialist-dashboard-task-actions .button,
  .specialist-dashboard-actions .button,
  .cabinet-role-card-actions .button,
  .cabinet-role-hero-actions .button,
  .specialist-blog-editor-actions .button {
    width: 100%;
    min-width: 0;
    justify-content: center;
  }

  .role-dashboard-card-top,
  .client-requests-panel-head,
  .client-request-card-top,
  .specialist-request-card-top,
  .cabinet-role-card-top {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Required trust-chip lock */
.trust-chip {
  height: 36px;
  margin-top: 20px;
  padding: 0 14px;
}



/* 14) specialist-reviews.html — make manager flow actionable and keep side stack structured */
.specialist-review-tab {
  gap: 8px;
}

.specialist-review-tab span {
  display: inline-flex;
  min-width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(191, 159, 214, 0.14);
  color: inherit;
  font-size: 0.75rem;
  font-weight: 900;
  line-height: 1;
}

.specialist-review-side-stack {
  display: grid;
  gap: 20px;
}

.specialist-review-detail-card,
.specialist-review-queue-card {
  padding: clamp(22px, 3vw, 30px);
  border: 1px solid rgba(231, 213, 226, 0.86);
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 22px 60px rgba(78, 46, 83, 0.08);
}

.specialist-review-detail-card h2,
.specialist-review-queue-card h2 {
  margin: 12px 0 0;
  color: var(--text-primary);
  font-size: 1.4rem;
  line-height: 1.18;
  letter-spacing: -0.04em;
}

.specialist-review-detail-card p,
.specialist-review-queue-card p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  line-height: 1.7;
}

.specialist-review-detail-head {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  align-items: flex-start;
}

.specialist-review-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0 0;
}

.specialist-review-detail-grid div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px;
  border-radius: 18px;
  background: rgba(248, 244, 250, 0.86);
}

.specialist-review-detail-grid dt,
.specialist-review-detail-grid dd {
  margin: 0;
}

.specialist-review-detail-grid dt {
  color: var(--text-secondary);
  font-size: 0.78rem;
  font-weight: 900;
}

.specialist-review-detail-grid dd {
  color: var(--text-primary);
  font-size: 0.92rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.specialist-review-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 18px;
}

.specialist-review-manager-card {
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.specialist-review-manager-card:hover,
.specialist-review-manager-card.is-selected {
  transform: translateY(-2px);
  border-color: rgba(181, 123, 190, 0.38);
  background: radial-gradient(circle at top right, rgba(191, 159, 214, 0.12), transparent 40%), rgba(255, 255, 255, 0.95);
  box-shadow: 0 18px 48px rgba(78, 46, 83, 0.08);
}

.specialist-review-actions .button {
  min-width: 152px;
}

@media (max-width: 1100px) {
  .specialist-review-detail-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  .specialist-review-detail-card,
  .specialist-review-queue-card {
    border-radius: 24px;
  }

  .specialist-review-detail-grid {
    grid-template-columns: 1fr;
  }

  .specialist-review-detail-head,
  .specialist-review-detail-actions {
    flex-direction: column;
    align-items: stretch;
  }
}


/* 14) specialist blog flow — list, editor, detail */
.specialist-blog-queue-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.specialist-blog-focus-card,
.specialist-blog-empty-state,
.specialist-blog-editor-notice,
.specialist-blog-detail-side-status {
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(237,221,231,.84);
  border-radius: 24px;
  background: rgba(255,255,255,.84);
}

.specialist-blog-focus-card {
  margin-top: 18px;
}

.specialist-blog-focus-card h2,
.specialist-blog-empty-state h3 {
  margin: 0;
  color: var(--text-primary);
}

.specialist-blog-focus-card p,
.specialist-blog-empty-state p,
.specialist-blog-editor-notice {
  color: var(--text-secondary);
  line-height: 1.6;
}

.specialist-blog-focus-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.specialist-blog-focus-meta span,
.specialist-blog-side-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(246,239,249,.92);
  border: 1px solid rgba(181,123,190,.22);
  color: var(--text-primary);
  font-size: .82rem;
  font-weight: 900;
}

.specialist-blog-side-status-pill.status-pill--work { background: rgba(216,228,255,.72); border-color: rgba(124,156,217,.26); color: #4c64a3; }
.specialist-blog-side-status-pill.status-pill--closed { background: rgba(199,239,216,.72); border-color: rgba(118,183,143,.34); color: #2f7551; }
.specialist-blog-side-status-pill.status-pill--admin { background: rgba(255,235,196,.78); border-color: rgba(214,167,91,.38); color: #9a6a25; }

.specialist-blog-editor-notice[hidden] {
  display: none !important;
}

.specialist-blog-editor-field select {
  width: 100%;
  min-height: 54px;
  padding: 14px 16px;
  border: 1px solid rgba(231,213,226,.9);
  border-radius: 22px;
  background: rgba(255,255,255,.88);
  color: var(--text-primary);
  font: inherit;
}

.specialist-blog-detail-body {
  display: grid;
  gap: 0;
}

.specialist-blog-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

@media (max-width: 1180px) {
  .specialist-blog-queue-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .specialist-blog-queue-grid {
    grid-template-columns: 1fr;
  }

  .specialist-blog-detail-actions {
    flex-direction: column;
  }

  .specialist-blog-detail-actions .button,
  .specialist-blog-focus-card .button {
    width: 100%;
  }
}


/* hard-fix: custom select should never show native browser dropdown */
.has-custom-select > select,
.custom-native-select {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  clip-path: inset(50%) !important;
  overflow: hidden !important;
}

.specialist-blog-editor-form .has-custom-select {
  position: relative;
}

.specialist-blog-editor-form .custom-select {
  position: relative;
  width: 100%;
  min-width: 0;
  z-index: 8;
}

.specialist-blog-editor-form .custom-select.is-open {
  z-index: 160;
}

.specialist-blog-editor-form .custom-select__button {
  width: 100%;
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 20px 0 22px;
  border: 1px solid rgba(231, 213, 226, 0.94);
  border-radius: 22px;
  background: rgba(255,255,255,0.92);
  color: var(--text-primary);
  text-align: left;
  cursor: pointer;
}

.specialist-blog-editor-form .custom-select__value {
  overflow: hidden;
  color: var(--text-primary);
  font-size: 15px;
  line-height: 22px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.specialist-blog-editor-form .custom-select__menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  display: none;
  max-height: 282px;
  padding: 8px;
  overflow: auto;
  border: 1px solid rgba(231, 213, 226, 0.94);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(69, 55, 84, 0.10);
}

.specialist-blog-editor-form .custom-select.is-open .custom-select__menu {
  display: grid;
  gap: 4px;
}


/* 16) specialist-public-question-answer — full answer page */
.specialist-public-answer-page .specialist-workspace-hero-copy {
  justify-content: flex-start;
}

.specialist-public-answer-hero,
.specialist-public-answer-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
  gap: 24px;
  align-items: start;
}

.specialist-public-answer-status-card,
.specialist-public-answer-main,
.specialist-public-answer-editor {
  min-width: 0;
}

.specialist-public-answer-status-card,
.specialist-public-answer-main,
.specialist-public-answer-editor {
  padding: 28px;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(237,221,231,.9);
  background: rgba(255,255,255,.9);
  box-shadow: 0 18px 48px rgba(69,55,84,.06);
}

.specialist-public-answer-status-card {
  display: grid;
  gap: 16px;
}

.specialist-public-answer-status-card h2,
.specialist-public-answer-main h2,
.specialist-public-answer-editor h2 {
  margin: 0;
}

.specialist-public-answer-main,
.specialist-public-answer-editor {
  display: grid;
  gap: 18px;
}

.specialist-public-answer-main .specialist-public-detail-meta {
  margin: 0;
}

.specialist-public-upload-panel {
  display: grid;
  gap: 10px;
  padding: 18px;
  border: 1px dashed rgba(181,123,190,.38);
  border-radius: 24px;
  background: rgba(248,239,251,.7);
}

.specialist-public-upload-panel h3,
.specialist-public-upload-panel p {
  margin: 0;
}

.specialist-public-upload-row {
  margin-top: 4px;
}

.specialist-public-upload-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.specialist-public-answer-actions {
  margin-top: 6px;
}

@media (max-width: 1180px) {
  .specialist-public-board-grid--list-only,
  .specialist-public-answer-hero,
  .specialist-public-answer-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .specialist-public-focus-card,
  .specialist-public-answer-status-card,
  .specialist-public-answer-main,
  .specialist-public-answer-editor {
    padding: 20px;
    border-radius: 24px;
  }

  .specialist-public-answer-actions,
  .specialist-public-upload-row {
    align-items: stretch;
  }

  .specialist-public-focus-card .button,
  .specialist-public-answer-actions .button {
    width: 100%;
  }
}


/* 17) specialist-cabinet — keep hero copy pinned to top without touching avatar */
.specialist-cabinet-page .specialist-dashboard-hero,
.specialist-cabinet-page .specialist-workspace-hero {
  align-items: start;
}

.specialist-cabinet-page .specialist-dashboard-hero-copy,
.specialist-cabinet-page .specialist-workspace-hero-copy {
  justify-content: flex-start;
  align-self: start;
}

/* 18) public questions list — keep list wide, no squeezed side work column */
.specialist-public-board-grid {
  grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
}

.specialist-public-list-panel--full {
  min-width: 0;
}

/* 19) public answer page — upload block should match project style */
.specialist-public-upload-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px dashed rgba(181, 123, 190, 0.28);
  border-radius: 24px;
  background: rgba(246, 238, 249, 0.6);
}

.specialist-public-upload-panel h3,
.specialist-public-upload-panel p {
  margin: 0;
}

.specialist-public-upload-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
}

.specialist-public-upload-hint,
.specialist-public-upload-name {
  color: var(--text-secondary);
  font-size: 0.9rem;
  line-height: 1.5;
}

.specialist-public-upload-name {
  width: 100%;
  color: var(--text-primary);
  font-weight: 700;
}

.specialist-public-answer-actions {
  align-items: stretch;
}

.specialist-public-answer-actions .button {
  min-width: 160px;
}

@media (max-width: 1180px) {
  .specialist-public-answer-hero,
  .specialist-public-answer-layout,
  .specialist-public-board-grid {
    grid-template-columns: 1fr;
  }
}


/* 20) hard-fix specialist cabinet hero + redesign role flow */
.specialist-cabinet-page .specialist-dashboard-hero,
.specialist-cabinet-page .specialist-workspace-hero {
  align-items: flex-start !important;
}

.specialist-cabinet-page .specialist-dashboard-hero-copy,
.specialist-cabinet-page .specialist-workspace-hero-copy {
  justify-content: flex-start !important;
  align-self: flex-start !important;
  padding-top: 6px;
}

.specialist-cabinet-page .specialist-dashboard-profile-card {
  align-self: flex-start;
}

.specialist-cabinet-page .specialist-dashboard-role-card {
  grid-template-columns: 1fr !important;
  gap: 28px;
  align-items: flex-start;
  padding: 30px;
}

.specialist-cabinet-page .specialist-dashboard-role-card > div:first-child {
  max-width: 980px;
}

.specialist-cabinet-page .specialist-dashboard-role-flow {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

.specialist-cabinet-page .specialist-dashboard-role-flow::before {
  content: "";
  position: absolute;
  left: 7%;
  right: 7%;
  top: 30px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(191,159,214,.18), rgba(181,123,190,.36), rgba(191,159,214,.18));
}

.specialist-cabinet-page .specialist-dashboard-role-flow p {
  position: relative;
  z-index: 1;
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 156px;
  padding: 18px 16px 20px;
  border: 1px solid rgba(237,221,231,.9);
  border-radius: 28px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 16px 34px rgba(69,55,84,.05);
}

.specialist-cabinet-page .specialist-dashboard-role-flow span {
  width: 44px;
  height: 44px;
  margin: 0;
  border-radius: 16px;
  font-size: 1rem;
}

.specialist-cabinet-page .specialist-dashboard-role-flow strong {
  font-size: clamp(1.2rem, 1.5vw, 1.55rem);
  line-height: 1.28;
  overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
  .specialist-cabinet-page .specialist-dashboard-role-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .specialist-cabinet-page .specialist-dashboard-role-flow::before {
    display: none;
  }
}

@media (max-width: 720px) {
  .specialist-cabinet-page .specialist-dashboard-role-card {
    padding: 22px;
  }

  .specialist-cabinet-page .specialist-dashboard-role-flow {
    grid-template-columns: 1fr;
  }

  .specialist-cabinet-page .specialist-dashboard-role-flow p {
    min-height: 0;
  }
}

/* 21) specialist public answer page — enforce styled upload + tighter hero */
.specialist-public-answer-page .specialist-public-answer-hero {
  align-items: flex-start;
}

.specialist-public-answer-page .specialist-public-answer-hero-copy {
  justify-content: flex-start;
  align-self: flex-start;
}

.specialist-public-answer-page .specialist-public-answer-hero-copy h1 {
  max-width: 980px;
  font-size: clamp(3rem, 5vw, 5rem);
  line-height: .98;
  letter-spacing: -.06em;
}

.specialist-public-answer-page .specialist-public-answer-hero-copy > p {
  max-width: 780px;
}

.specialist-public-answer-page .specialist-public-file-control {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
}

.specialist-public-answer-page .specialist-public-file-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.specialist-public-answer-page .specialist-public-file-button {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  border: 1px solid rgba(181, 123, 190, 0.25);
  border-radius: 999px;
  background: rgba(191, 159, 214, 0.16);
  color: #8f5fb1;
  cursor: pointer;
  font-weight: 800;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.specialist-public-answer-page .specialist-public-file-button:hover {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.42);
  background: rgba(191, 159, 214, 0.24);
}

.specialist-public-answer-page .specialist-public-upload-hint,
.specialist-public-answer-page .specialist-public-upload-name {
  color: var(--text-secondary);
  font-size: .92rem;
  line-height: 1.5;
}

.specialist-public-answer-page .specialist-public-upload-name {
  width: 100%;
  color: var(--text-primary);
  font-weight: 700;
}

/* 23) blog public feed — fix collapsed result line + working publication pills */
.blog-public-head {
  align-items: start;
}

.blog-public-head > div {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.blog-public-head .badge,
.blog-public-head h2,
.blog-public-head p {
  margin: 0;
}

.blog-public-filter-row {
  margin-top: 22px;
}

.blog-public-result-note {
  margin: 10px 0 18px;
  line-height: 1.45;
}

.blog-public-post-top {
  align-items: flex-start;
}

.blog-public-post-top .status-pill {
  width: fit-content;
  white-space: nowrap;
  flex: 0 0 auto;
}

.status-pill--success {
  color: #15803D;
  border-color: rgba(34,197,94,.28);
  background: rgba(34,197,94,.11);
}

/* 24) specialist cabinet — premium role route redesign */
.specialist-dashboard-role-section {
  padding-top: 8px;
}

.specialist-dashboard-role-showcase {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(440px, .98fr);
  gap: 28px;
  padding: clamp(26px, 3.6vw, 40px);
  border: 1px solid rgba(237,221,231,.92);
  border-radius: 40px;
  background:
    radial-gradient(circle at 6% 10%, rgba(220,184,226,.18), transparent 26%),
    radial-gradient(circle at 92% 12%, rgba(191,216,255,.16), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,239,251,.84));
  box-shadow: 0 22px 52px rgba(69,55,84,.06);
  overflow: hidden;
}

.specialist-dashboard-role-showcase::after {
  content: "";
  position: absolute;
  right: -120px;
  bottom: -140px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: rgba(181,123,190,.08);
  pointer-events: none;
}

.specialist-dashboard-role-intro,
.specialist-dashboard-role-stage-grid {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.specialist-dashboard-role-intro {
  display: grid;
  align-content: start;
  gap: 16px;
  max-width: 760px;
}

.specialist-dashboard-role-intro .badge,
.specialist-dashboard-role-intro h2,
.specialist-dashboard-role-intro p {
  margin: 0;
}

.specialist-dashboard-role-intro h2 {
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.02;
  letter-spacing: -.06em;
}

.specialist-dashboard-role-intro > p {
  max-width: 720px;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.72;
}

.specialist-dashboard-role-summary {
  display: grid;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin-top: 4px;
  padding: 18px 20px;
  border: 1px solid rgba(181,123,190,.16);
  border-radius: 24px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 14px 32px rgba(69,55,84,.04);
}

.specialist-dashboard-role-summary-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(131,174,123,.22);
  background: rgba(131,174,123,.12);
  color: #5f8d67;
  font-size: 12px;
  font-weight: 900;
}

.specialist-dashboard-role-summary strong {
  color: var(--text-primary);
  font-size: 16px;
  line-height: 1.58;
}

.specialist-dashboard-role-stage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

.specialist-dashboard-role-stage {
  position: relative;
  display: grid;
  align-content: start;
  gap: 14px;
  min-height: 220px;
  padding: 22px 22px 24px;
  border: 1px solid rgba(237,221,231,.9);
  border-radius: 32px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 16px 38px rgba(69,55,84,.05);
  overflow: hidden;
}

.specialist-dashboard-role-stage::after {
  content: "";
  position: absolute;
  right: -52px;
  bottom: -68px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(181,123,190,.07);
  pointer-events: none;
}

.specialist-dashboard-role-stage span,
.specialist-dashboard-role-stage strong,
.specialist-dashboard-role-stage p {
  position: relative;
  z-index: 1;
  margin: 0;
}

.specialist-dashboard-role-stage span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 18px;
  background: rgba(191,159,214,.16);
  color: var(--section-color);
  font-family: Arial, sans-serif;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -.03em;
}

.specialist-dashboard-role-stage strong {
  max-width: 14ch;
  color: var(--text-primary);
  font-size: clamp(26px, 2.4vw, 36px);
  line-height: 1.04;
  letter-spacing: -.06em;
}

.specialist-dashboard-role-stage p {
  max-width: 28ch;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.7;
}

.specialist-dashboard-role-stage.is-client {
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(242,247,255,.86));
}

.specialist-dashboard-role-stage.is-application {
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,239,251,.86));
}

.specialist-dashboard-role-stage.is-moderation {
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,236,.88));
}

.specialist-dashboard-role-stage.is-approved {
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(240,250,244,.9));
}

@media (max-width: 1180px) {
  .specialist-dashboard-role-showcase {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .specialist-dashboard-role-showcase {
    padding: 22px;
    border-radius: 30px;
  }

  .specialist-dashboard-role-stage-grid {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-role-stage {
    min-height: 0;
    padding: 20px;
    border-radius: 26px;
  }

  .specialist-dashboard-role-stage strong {
    max-width: none;
    font-size: clamp(24px, 9vw, 34px);
  }

  .specialist-dashboard-role-stage p {
    max-width: none;
  }
}

/* 25) specialist cabinet — extra polish for role route showcase */
.specialist-dashboard-role-showcase--polished {
  isolation: isolate;
  grid-template-columns: minmax(0, 0.92fr) minmax(520px, 1.08fr);
  gap: clamp(26px, 4vw, 48px);
  padding: clamp(34px, 4.8vw, 58px);
  border-radius: 46px;
  background:
    radial-gradient(circle at 8% 4%, rgba(181,123,190,.24), transparent 26%),
    radial-gradient(circle at 92% 8%, rgba(132,181,255,.18), transparent 24%),
    radial-gradient(circle at 70% 92%, rgba(131,174,123,.15), transparent 28%),
    linear-gradient(140deg, rgba(255,255,255,.98), rgba(250,243,249,.94) 56%, rgba(255,248,253,.86));
  box-shadow: 0 30px 80px rgba(69,55,84,.08);
}

.specialist-dashboard-role-showcase--polished::before {
  content: "";
  position: absolute;
  inset: 18px;
  z-index: 0;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 34px;
  pointer-events: none;
}

.specialist-dashboard-role-aura {
  position: absolute;
  inset: auto -90px -130px auto;
  z-index: 0;
  width: 390px;
  height: 390px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(181,123,190,.18), transparent 66%);
  filter: blur(2px);
  pointer-events: none;
}

.specialist-dashboard-role-intro--polished {
  gap: 20px;
  align-content: center;
  min-height: 100%;
}

.specialist-dashboard-role-intro--polished .badge {
  width: fit-content;
  box-shadow: 0 10px 22px rgba(181,123,190,.08);
}

.specialist-dashboard-role-intro--polished h2 {
  max-width: 780px;
  font-size: clamp(38px, 4.6vw, 62px);
  line-height: .98;
  letter-spacing: -.075em;
}

.specialist-dashboard-role-intro--polished > p {
  max-width: 680px;
  font-size: 18px;
  line-height: 1.72;
}

.specialist-dashboard-role-summary--polished {
  width: 100%;
  max-width: 620px;
  gap: 18px;
  padding: 22px;
  border-radius: 30px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(251,246,253,.88));
  border-color: rgba(181,123,190,.18);
  box-shadow: 0 20px 42px rgba(69,55,84,.06);
}

.specialist-dashboard-role-summary--polished strong {
  display: block;
  margin-top: 12px;
  font-size: 17px;
  line-height: 1.62;
}

.specialist-dashboard-role-summary-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.specialist-dashboard-role-summary-stats span {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 14px 12px;
  border: 1px solid rgba(237,221,231,.72);
  border-radius: 22px;
  background: rgba(255,255,255,.76);
}

.specialist-dashboard-role-summary-stats b {
  color: var(--section-color);
  font-size: 25px;
  line-height: 1;
  letter-spacing: -.04em;
}

.specialist-dashboard-role-summary-stats small {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.25;
  font-weight: 800;
}

.specialist-dashboard-role-stage-grid--polished {
  position: relative;
  gap: 20px;
}

.specialist-dashboard-role-stage-grid--polished::before {
  content: "";
  position: absolute;
  inset: 50% 8% auto 8%;
  z-index: 0;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(181,123,190,.30), transparent);
  transform: translateY(-50%);
  pointer-events: none;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage {
  min-height: 236px;
  gap: 12px;
  padding: 24px;
  border-radius: 34px;
  border-color: rgba(237,221,231,.86);
  box-shadow: 0 22px 46px rgba(69,55,84,.06);
  transform: translateZ(0);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage:hover {
  transform: translateY(-4px);
  border-color: rgba(181,123,190,.26);
  box-shadow: 0 28px 58px rgba(69,55,84,.09);
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 7px;
  background: linear-gradient(90deg, rgba(181,123,190,.38), rgba(244,191,208,.34));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage::after {
  right: -70px;
  bottom: -82px;
  width: 190px;
  height: 190px;
  background: radial-gradient(circle, rgba(181,123,190,.13), transparent 68%);
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage span {
  width: 54px;
  height: 54px;
  border-radius: 20px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(181,123,190,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 12px 22px rgba(181,123,190,.08);
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage small {
  position: relative;
  z-index: 1;
  width: fit-content;
  min-height: 26px;
  padding: 6px 10px 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage strong {
  max-width: 15ch;
  font-size: clamp(28px, 2.55vw, 40px);
  letter-spacing: -.07em;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage p {
  max-width: 32ch;
  font-size: 15px;
  line-height: 1.65;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-client::before {
  background: linear-gradient(90deg, rgba(114,161,231,.34), rgba(181,123,190,.22));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-application::before {
  background: linear-gradient(90deg, rgba(181,123,190,.38), rgba(244,191,208,.32));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-moderation::before {
  background: linear-gradient(90deg, rgba(230,178,103,.36), rgba(181,123,190,.22));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-approved::before {
  background: linear-gradient(90deg, rgba(104,180,131,.34), rgba(181,123,190,.22));
}

@media (max-width: 1180px) {
  .specialist-dashboard-role-showcase--polished {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-role-stage-grid--polished::before {
    display: none;
  }
}

@media (max-width: 760px) {
  .specialist-dashboard-role-showcase--polished {
    padding: 22px;
    border-radius: 32px;
  }

  .specialist-dashboard-role-summary-stats {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage {
    min-height: 0;
    padding: 22px;
  }
}

/* 25) specialist cabinet — extra polish for role route showcase */
.specialist-dashboard-role-showcase--polished {
  isolation: isolate;
  grid-template-columns: minmax(0, 0.92fr) minmax(520px, 1.08fr);
  gap: clamp(26px, 4vw, 48px);
  padding: clamp(34px, 4.8vw, 58px);
  border-radius: 46px;
  background:
    radial-gradient(circle at 8% 4%, rgba(181,123,190,.24), transparent 26%),
    radial-gradient(circle at 92% 8%, rgba(132,181,255,.18), transparent 24%),
    radial-gradient(circle at 70% 92%, rgba(131,174,123,.15), transparent 28%),
    linear-gradient(140deg, rgba(255,255,255,.98), rgba(250,243,249,.94) 56%, rgba(255,248,253,.86));
  box-shadow: 0 30px 80px rgba(69,55,84,.08);
}

.specialist-dashboard-role-showcase--polished::before {
  content: "";
  position: absolute;
  inset: 18px;
  z-index: 0;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 34px;
  pointer-events: none;
}

.specialist-dashboard-role-aura {
  position: absolute;
  inset: auto -90px -130px auto;
  z-index: 0;
  width: 390px;
  height: 390px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(181,123,190,.18), transparent 66%);
  filter: blur(2px);
  pointer-events: none;
}

.specialist-dashboard-role-intro--polished {
  gap: 20px;
  align-content: center;
  min-height: 100%;
}

.specialist-dashboard-role-intro--polished .badge {
  width: fit-content;
  box-shadow: 0 10px 22px rgba(181,123,190,.08);
}

.specialist-dashboard-role-intro--polished h2 {
  max-width: 780px;
  font-size: clamp(38px, 4.6vw, 62px);
  line-height: .98;
  letter-spacing: -.075em;
}

.specialist-dashboard-role-intro--polished > p {
  max-width: 680px;
  font-size: 18px;
  line-height: 1.72;
}

.specialist-dashboard-role-summary--polished {
  width: 100%;
  max-width: 620px;
  gap: 18px;
  padding: 22px;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(251,246,253,.88));
  border-color: rgba(181,123,190,.18);
  box-shadow: 0 20px 42px rgba(69,55,84,.06);
}

.specialist-dashboard-role-summary--polished strong {
  display: block;
  margin-top: 12px;
  font-size: 17px;
  line-height: 1.62;
}

.specialist-dashboard-role-summary-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.specialist-dashboard-role-summary-stats span {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 14px 12px;
  border: 1px solid rgba(237,221,231,.72);
  border-radius: 22px;
  background: rgba(255,255,255,.76);
}

.specialist-dashboard-role-summary-stats b {
  color: var(--section-color);
  font-size: 25px;
  line-height: 1;
  letter-spacing: -.04em;
}

.specialist-dashboard-role-summary-stats small {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.25;
  font-weight: 800;
}

.specialist-dashboard-role-stage-grid--polished {
  position: relative;
  gap: 20px;
}

.specialist-dashboard-role-stage-grid--polished::before {
  content: "";
  position: absolute;
  inset: 50% 8% auto 8%;
  z-index: 0;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(181,123,190,.30), transparent);
  transform: translateY(-50%);
  pointer-events: none;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage {
  min-height: 236px;
  gap: 12px;
  padding: 24px;
  border-radius: 34px;
  border-color: rgba(237,221,231,.86);
  box-shadow: 0 22px 46px rgba(69,55,84,.06);
  transform: translateZ(0);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage:hover {
  transform: translateY(-4px);
  border-color: rgba(181,123,190,.26);
  box-shadow: 0 28px 58px rgba(69,55,84,.09);
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 7px;
  background: linear-gradient(90deg, rgba(181,123,190,.38), rgba(244,191,208,.34));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage::after {
  right: -70px;
  bottom: -82px;
  width: 190px;
  height: 190px;
  background: radial-gradient(circle, rgba(181,123,190,.13), transparent 68%);
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage span {
  width: 54px;
  height: 54px;
  border-radius: 20px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(181,123,190,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 12px 22px rgba(181,123,190,.08);
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage small {
  position: relative;
  z-index: 1;
  width: fit-content;
  min-height: 26px;
  padding: 6px 10px 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage strong {
  max-width: 15ch;
  font-size: clamp(28px, 2.55vw, 40px);
  letter-spacing: -.07em;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage p {
  max-width: 32ch;
  font-size: 15px;
  line-height: 1.65;
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-client::before {
  background: linear-gradient(90deg, rgba(114,161,231,.34), rgba(181,123,190,.22));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-application::before {
  background: linear-gradient(90deg, rgba(181,123,190,.38), rgba(244,191,208,.32));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-moderation::before {
  background: linear-gradient(90deg, rgba(230,178,103,.36), rgba(181,123,190,.22));
}

.specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-approved::before {
  background: linear-gradient(90deg, rgba(104,180,131,.34), rgba(181,123,190,.22));
}

@media (max-width: 1180px) {
  .specialist-dashboard-role-showcase--polished {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-role-stage-grid--polished::before {
    display: none;
  }
}

@media (max-width: 760px) {
  .specialist-dashboard-role-showcase--polished {
    padding: 22px;
    border-radius: 32px;
  }

  .specialist-dashboard-role-summary-stats {
    grid-template-columns: 1fr;
  }

  .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage {
    min-height: 0;
    padding: 22px;
  }
}

/* =========================================================
   FINAL HOTFIX: public blog spacing + specialist cabinet role section
========================================================= */
.blog-public-feed-shell {
  overflow: visible;
}

.blog-public-head {
  align-items: start;
  margin-bottom: 0;
}

.blog-public-head > div {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.blog-public-head h2,
.blog-public-head .badge {
  margin: 0;
}

.blog-public-filter-row {
  margin-top: 24px;
  margin-bottom: 12px;
}

.blog-public-result-note {
  display: block;
  margin: 0 0 24px !important;
  line-height: 1.45;
}

.blog-public-post-top {
  align-items: flex-start;
}

.blog-public-post-top .status-pill,
.blog-public-post-card .status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.status-pill--success {
  color: #15803D;
  border-color: rgba(34,197,94,.28);
  background: rgba(34,197,94,.11);
}

.specialist-cabinet-page .specialist-dashboard-role-showcase--polished {
  position: relative;
  isolation: isolate;
  display: grid !important;
  grid-template-columns: minmax(0, 0.96fr) minmax(560px, 1.04fr);
  gap: clamp(28px, 4vw, 50px);
  align-items: stretch;
  padding: clamp(32px, 4.6vw, 54px);
  border: 1px solid rgba(233, 220, 231, 0.86);
  border-radius: 42px;
  background:
    radial-gradient(circle at 8% 4%, rgba(181,123,190,.14), transparent 24%),
    radial-gradient(circle at 92% 8%, rgba(132,181,255,.10), transparent 22%),
    linear-gradient(140deg, rgba(255,255,255,.98), rgba(251,245,250,.95) 58%, rgba(255,249,253,.92));
  box-shadow: 0 24px 64px rgba(69,55,84,.07);
  overflow: hidden;
}

.specialist-cabinet-page .specialist-dashboard-role-showcase--polished::before,
.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished::before {
  display: none !important;
}

.specialist-cabinet-page .specialist-dashboard-role-aura {
  inset: auto -110px -160px auto;
  width: 360px;
  height: 360px;
  background: radial-gradient(circle, rgba(181,123,190,.12), transparent 68%);
}

.specialist-cabinet-page .specialist-dashboard-role-intro--polished {
  display: grid !important;
  align-content: start;
  gap: 22px;
  min-width: 0;
  padding-top: 6px;
}

.specialist-cabinet-page .specialist-dashboard-role-intro--polished h2 {
  max-width: 720px;
  margin: 0;
  font-size: clamp(38px, 4.8vw, 64px);
  line-height: .98;
  letter-spacing: -.075em;
}

.specialist-cabinet-page .specialist-dashboard-role-intro--polished > p {
  max-width: 680px;
  margin: 0;
  font-size: 18px;
  line-height: 1.7;
}

.specialist-cabinet-page .specialist-dashboard-role-summary--polished {
  display: grid;
  gap: 18px;
  width: 100%;
  max-width: 620px;
  padding: 22px;
  border-radius: 30px;
  border: 1px solid rgba(181,123,190,.16);
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(251,246,253,.88));
  box-shadow: 0 18px 40px rgba(69,55,84,.05);
}

.specialist-cabinet-page .specialist-dashboard-role-summary-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(181,123,190,.10);
  color: var(--section-color);
  font-size: 12px;
  font-weight: 900;
}

.specialist-cabinet-page .specialist-dashboard-role-summary--polished strong {
  display: block;
  margin-top: 10px;
  font-size: 17px;
  line-height: 1.6;
}

.specialist-cabinet-page .specialist-dashboard-role-summary-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.specialist-cabinet-page .specialist-dashboard-role-summary-stats span {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 14px 12px;
  border-radius: 20px;
  border: 1px solid rgba(237,221,231,.72);
  background: rgba(255,255,255,.78);
}

.specialist-cabinet-page .specialist-dashboard-role-summary-stats b {
  color: var(--section-color);
  font-size: 25px;
  line-height: 1;
  letter-spacing: -.04em;
}

.specialist-cabinet-page .specialist-dashboard-role-summary-stats small {
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.25;
  font-weight: 800;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
  min-width: 0;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage {
  position: relative;
  display: grid !important;
  align-content: start;
  gap: 14px;
  min-height: 252px;
  padding: 26px;
  border-radius: 34px;
  border: 1px solid rgba(237,221,231,.86);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(250,244,250,.90));
  box-shadow: 0 18px 38px rgba(69,55,84,.05);
  overflow: hidden;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage::after {
  display: none;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 7px;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 20px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(181,123,190,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 10px 20px rgba(181,123,190,.07);
  color: var(--section-color);
  font-size: 16px;
  font-weight: 900;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage small {
  display: inline-flex;
  width: fit-content;
  min-height: 26px;
  padding: 6px 10px 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage strong {
  max-width: 14ch;
  margin: 0;
  font-size: clamp(30px, 2.7vw, 42px);
  line-height: .98;
  letter-spacing: -.075em;
  overflow-wrap: anywhere;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage p {
  max-width: 30ch;
  margin: 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.65;
}

.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-client::before {
  background: linear-gradient(90deg, rgba(114,161,231,.34), rgba(181,123,190,.20));
}
.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-application::before {
  background: linear-gradient(90deg, rgba(181,123,190,.36), rgba(244,191,208,.30));
}
.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-moderation::before {
  background: linear-gradient(90deg, rgba(230,178,103,.32), rgba(181,123,190,.20));
}
.specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage.is-approved::before {
  background: linear-gradient(90deg, rgba(104,180,131,.32), rgba(181,123,190,.20));
}

@media (max-width: 1180px) {
  .specialist-cabinet-page .specialist-dashboard-role-showcase--polished {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .specialist-cabinet-page .specialist-dashboard-role-showcase--polished {
    padding: 22px;
    border-radius: 30px;
  }

  .specialist-cabinet-page .specialist-dashboard-role-summary-stats,
  .specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished {
    grid-template-columns: 1fr;
  }

  .specialist-cabinet-page .specialist-dashboard-role-stage-grid--polished .specialist-dashboard-role-stage {
    min-height: 0;
    padding: 22px;
  }
}

/* =========================================================
   DECKS NEXT STEP — polished library + workbench flow
   Scope: specialist-decks.html, deck-session.html only
========================================================= */
.deck-library-page [hidden],
.deck-workbench-page [hidden] {
  display: none !important;
}

.deck-library-page .specialist-workspace-hero,
.deck-workbench-page .specialist-workspace-hero {
  position: relative;
  overflow: hidden;
  align-items: start;
  background:
    radial-gradient(circle at 12% 8%, rgba(181,123,190,.18), transparent 28%),
    radial-gradient(circle at 90% 12%, rgba(114,161,231,.12), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(250,244,250,.9));
}

.deck-library-page .specialist-workspace-hero::after,
.deck-workbench-page .specialist-workspace-hero::after {
  content: "";
  position: absolute;
  right: -110px;
  bottom: -150px;
  width: 330px;
  height: 330px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(181,123,190,.15), transparent 68%);
  pointer-events: none;
}

.deck-library-page .specialist-workspace-hero-copy,
.deck-workbench-page .specialist-workspace-hero-copy,
.deck-library-status,
.deck-workbench-linked-request {
  position: relative;
  z-index: 1;
}

.deck-library-status,
.deck-workbench-linked-request {
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(10px);
}

.deck-library-feature-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 22px;
}

.deck-library-feature-card {
  position: relative;
  overflow: hidden;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(237,221,231,.88);
  border-radius: 26px;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(250,244,250,.82));
  box-shadow: 0 16px 34px rgba(69,55,84,.05);
}

.deck-library-feature-card::after {
  content: "";
  position: absolute;
  right: -44px;
  bottom: -54px;
  width: 132px;
  height: 132px;
  border-radius: 50%;
  background: rgba(181,123,190,.10);
  pointer-events: none;
}

.deck-library-feature-card > span {
  display: inline-flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border-radius: 15px;
  background: rgba(248,239,251,.92);
  color: var(--brand-primary);
  font-weight: 900;
}

.deck-library-feature-card strong {
  display: block;
  margin-top: 12px;
  color: var(--text-primary);
  font-size: 18px;
  line-height: 1.25;
}

.deck-library-feature-card p {
  margin: 8px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.6;
}

.deck-library-feature-card .text-link {
  position: relative;
  z-index: 1;
  display: inline-flex;
  margin-top: 12px;
}

.deck-library-feature-card.is-primary {
  background:
    radial-gradient(circle at 96% 10%, rgba(114,161,231,.12), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,239,251,.92));
  border-color: rgba(181,123,190,.22);
}

.deck-library-page .deck-library-filter-panel {
  position: sticky;
  top: 118px;
  align-self: start;
  background: rgba(255,255,255,.94);
}

.deck-library-page .deck-library-search {
  min-height: 52px;
  border-radius: 20px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
}

.deck-library-page .deck-library-filter {
  min-height: 38px;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.deck-library-page .deck-library-filter:hover {
  transform: translateY(-1px);
}

.deck-library-page .deck-library-card {
  position: relative;
  overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.deck-library-page .deck-library-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: linear-gradient(180deg, rgba(181,123,190,.48), rgba(244,191,208,.22));
  opacity: .75;
}

.deck-library-page .deck-library-card:hover {
  transform: translateY(-3px);
  border-color: rgba(181,123,190,.24);
  box-shadow: 0 24px 54px rgba(69,55,84,.09);
}

.deck-library-page .deck-library-card-visual {
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
}

.deck-library-page .deck-library-card-visual::after {
  content: "";
  position: absolute;
  inset: auto -35px -45px auto;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background: rgba(181,123,190,.11);
}

.deck-library-page .deck-library-card .specialist-workspace-card-actions {
  margin-top: 2px;
}

.deck-library-empty {
  display: grid;
  place-items: center;
  gap: 10px;
  min-height: 220px;
  margin-top: 18px;
  padding: 28px;
  border: 1px dashed rgba(181,123,190,.34);
  border-radius: 30px;
  background: rgba(248,239,251,.52);
  text-align: center;
}

.deck-library-empty span {
  display: inline-grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border-radius: 22px;
  background: #fff;
  color: var(--brand-primary);
  font-weight: 900;
}

.deck-library-empty h3,
.deck-library-empty p {
  margin: 0;
}

.deck-library-empty p {
  color: var(--text-secondary);
}

.deck-workbench-page .deck-workbench-layout {
  grid-template-columns: minmax(320px, 430px) minmax(0, 1fr);
  gap: 26px;
}

.deck-workbench-page .deck-workbench-setup {
  position: sticky;
  top: 118px;
  align-self: start;
  background: rgba(255,255,255,.94);
}

.deck-workbench-setup-lead {
  margin: -8px 0 2px;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.7;
}

.deck-workbench-page .deck-workbench-table {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%, rgba(181,123,190,.10), transparent 30%),
    rgba(255,255,255,.94);
}

.deck-workbench-page .deck-workbench-selected-deck {
  display: flex;
  align-items: center;
  min-height: 56px;
  margin: 0 0 18px;
  border-color: rgba(114,161,231,.22);
  background: linear-gradient(180deg, rgba(240,246,255,.92), rgba(248,239,251,.78));
  color: var(--text-primary);
}

.deck-workbench-page .deck-workbench-card {
  min-height: 360px;
  border-color: rgba(237,221,231,.9);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(252,247,253,.92));
  box-shadow: 0 20px 42px rgba(69,55,84,.07);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.deck-workbench-page .deck-workbench-card:hover {
  transform: translateY(-3px);
  border-color: rgba(181,123,190,.24);
  box-shadow: 0 26px 56px rgba(69,55,84,.10);
}

.deck-workbench-page .deck-workbench-card-face,
.deck-workbench-page .deck-workbench-card-back {
  min-height: 210px;
  border-radius: 26px;
}

.deck-workbench-page .deck-workbench-card-face.has-image {
  background: rgba(255,255,255,.96);
}

.deck-workbench-page .deck-workbench-card h3 {
  font-size: 20px;
  line-height: 1.22;
}

.deck-workbench-save-feedback {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 50px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(104,180,131,.24);
  background: linear-gradient(180deg, rgba(244,252,247,.98), rgba(233,247,238,.92));
  color: #2f7551;
  font-weight: 800;
  line-height: 1.45;
}

.deck-workbench-save-feedback::before {
  content: "";
  flex: 0 0 12px;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #68b483;
  box-shadow: 0 0 0 6px rgba(104,180,131,.12);
}

.deck-workbench-page .deck-workbench-notes-grid {
  align-items: stretch;
}

.deck-workbench-page .deck-workbench-textarea {
  min-height: 190px;
}

@media (max-width: 1180px) {
  .deck-library-feature-row,
  .deck-workbench-page .deck-workbench-layout {
    grid-template-columns: 1fr;
  }

  .deck-library-page .deck-library-filter-panel,
  .deck-workbench-page .deck-workbench-setup {
    position: static;
  }
}

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

  .deck-library-page .deck-library-card {
    grid-template-columns: 1fr;
  }

  .deck-library-page .deck-library-card-visual {
    min-height: 160px;
  }
}

/* =========================================================
   BLOG FINAL POLISH — cards, meta row, filters, feed heading
   Scoped only to blog.html public blog area.
========================================================= */
.blog-public-page {
  --blog-card-radius: 34px;
  --blog-card-shadow: 0 24px 58px rgba(69, 55, 84, 0.07);
}

.blog-public-feed-shell {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 3.8vw, 48px) !important;
  border-radius: 42px !important;
  background:
    radial-gradient(circle at 8% 4%, rgba(181, 123, 190, 0.14), transparent 28%),
    radial-gradient(circle at 94% 8%, rgba(199, 223, 240, 0.18), transparent 26%),
    linear-gradient(145deg, rgba(255,255,255,0.98), rgba(255,247,250,0.86)) !important;
}

.blog-public-head {
  display: grid !important;
  grid-template-columns: minmax(0, 0.95fr) minmax(320px, 0.7fr) !important;
  gap: clamp(26px, 5vw, 84px) !important;
  align-items: start !important;
  margin-bottom: 26px !important;
}

.blog-public-head > div {
  display: grid !important;
  gap: 16px !important;
  align-content: start !important;
}

.blog-public-head .badge {
  width: fit-content !important;
  margin: 0 !important;
}

.blog-public-head h2 {
  max-width: 590px !important;
  margin: 0 !important;
  color: var(--text-primary) !important;
  font-size: clamp(42px, 5vw, 64px) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.075em !important;
  text-wrap: balance;
}

.blog-public-head p {
  max-width: 470px !important;
  margin: 16px 0 0 !important;
  color: var(--text-secondary) !important;
  font-size: 17px !important;
  line-height: 1.72 !important;
  text-align: left !important;
}

.blog-public-filter-row {
  width: fit-content;
  max-width: 100%;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 12px !important;
  padding: 8px !important;
  border: 1px solid rgba(237, 221, 231, 0.9);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 14px 30px rgba(69,55,84,.04);
}

.blog-public-filter-row .pill-button {
  min-height: 46px !important;
  padding: 0 22px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--text-secondary) !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em;
  box-shadow: none !important;
}

.blog-public-filter-row .pill-button:hover {
  color: var(--brand-primary) !important;
  background: rgba(248, 239, 251, 0.95) !important;
  transform: translateY(-1px);
}

.blog-public-filter-row .pill-button.is-active {
  color: #fff !important;
  border-color: rgba(181, 123, 190, 0.98) !important;
  background: linear-gradient(135deg, #B57BBE, #AA73BA) !important;
  box-shadow: 0 14px 26px rgba(181, 123, 190, 0.22) !important;
}

.blog-public-result-note {
  width: fit-content;
  min-height: 38px;
  display: inline-flex !important;
  align-items: center;
  margin: 0 0 26px !important;
  padding: 0 16px;
  border: 1px solid rgba(237, 221, 231, 0.88);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}

.blog-public-cards-grid {
  align-items: stretch !important;
  gap: clamp(18px, 2vw, 24px) !important;
  margin-top: 0 !important;
}

.blog-public-post-card {
  position: relative;
  min-height: 0 !important;
  display: grid !important;
  grid-template-rows: auto auto auto auto minmax(24px, 1fr) auto !important;
  align-content: start !important;
  gap: 0 !important;
  padding: 28px !important;
  overflow: hidden;
  border-radius: var(--blog-card-radius) !important;
  border: 1px solid rgba(237, 221, 231, 0.95) !important;
  background:
    radial-gradient(circle at 100% 100%, rgba(181,123,190,.12), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(253,247,251,.88)) !important;
  box-shadow: 0 16px 42px rgba(69,55,84,.045);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.blog-public-post-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 6px;
  background: linear-gradient(90deg, rgba(181,123,190,.32), rgba(199,223,240,.30), rgba(241,211,223,.34));
  pointer-events: none;
}

.blog-public-post-card:hover {
  transform: translateY(-4px);
  border-color: rgba(181, 123, 190, 0.26) !important;
  box-shadow: var(--blog-card-shadow);
}

.blog-public-post-top {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  min-width: 0;
}

.blog-public-post-top .badge,
.blog-public-post-top .status-pill {
  flex: 0 0 auto;
  max-width: 100%;
  white-space: nowrap;
}

.blog-public-post-card h3 {
  margin: 24px 0 0 !important;
  color: var(--text-primary) !important;
  font-size: clamp(24px, 2.25vw, 30px) !important;
  line-height: 1.13 !important;
  letter-spacing: -0.055em !important;
  text-wrap: balance;
}

.blog-public-post-card p {
  max-width: 32ch;
  margin: 18px 0 0 !important;
  color: var(--text-secondary) !important;
  font-size: 16px !important;
  line-height: 1.68 !important;
}

.blog-public-post-meta {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 24px 0 0 !important;
  min-width: 0;
  overflow: visible;
}

.blog-public-post-meta span {
  flex: 0 0 auto !important;
  min-height: 38px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(237, 221, 231, 0.72) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.68) !important;
  color: var(--text-secondary) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.blog-public-post-card .text-link {
  width: 100%;
  min-height: 54px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  align-self: end;
  margin: 24px 0 0 !important;
  padding: 0 22px !important;
  border: 1px solid rgba(237, 221, 231, 0.95);
  border-radius: 999px;
  background: rgba(255,255,255,.84);
  color: var(--brand-primary) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  box-shadow: 0 12px 26px rgba(69,55,84,.04);
}

.blog-public-post-card .text-link::after {
  content: "→";
  margin-left: 10px;
  transition: transform .18s ease;
}

.blog-public-post-card .text-link:hover {
  background: rgba(248,239,251,.98);
  border-color: rgba(181,123,190,.30);
}

.blog-public-post-card .text-link:hover::after {
  transform: translateX(3px);
}

.blog-public-post-card[hidden] {
  display: none !important;
}

@media (max-width: 1260px) {
  .blog-public-head {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .blog-public-head p {
    max-width: 720px !important;
    margin-top: 0 !important;
  }

  .blog-public-cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 820px) {
  .blog-public-filter-row {
    width: 100%;
    border-radius: 28px;
  }

  .blog-public-filter-row .pill-button {
    flex: 1 1 calc(50% - 10px);
  }

  .blog-public-cards-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 520px) {
  .blog-public-post-top,
  .blog-public-post-meta {
    flex-wrap: wrap !important;
  }

  .blog-public-post-card {
    padding: 22px !important;
  }
}

/* =========================================================
   BLOG HERO + FILTER RE-POLISH — text card and softer active state
   Scoped only to blog.html public blog area.
========================================================= */
.blog-public-page .blog-public-head {
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 0.62fr) !important;
  align-items: center !important;
  gap: clamp(34px, 6vw, 96px) !important;
  margin-bottom: 28px !important;
}

.blog-public-page .blog-public-head > div {
  gap: 18px !important;
}

.blog-public-page .blog-public-head h2 {
  max-width: 560px !important;
  font-size: clamp(48px, 5.4vw, 72px) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.08em !important;
}

.blog-public-page .blog-public-head p {
  position: relative;
  max-width: 430px !important;
  margin: 0 !important;
  padding: 26px 28px 26px 30px !important;
  border: 1px solid rgba(237, 221, 231, 0.82);
  border-radius: 30px;
  background:
    radial-gradient(circle at 88% 8%, rgba(199,223,240,.20), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.82), rgba(255,247,250,.64));
  color: rgba(110, 94, 121, 0.94) !important;
  font-size: 17px !important;
  line-height: 1.72 !important;
  text-align: left !important;
  box-shadow: 0 18px 38px rgba(69, 55, 84, 0.045);
}

.blog-public-page .blog-public-head p::before {
  content: "";
  position: absolute;
  left: 0;
  top: 28px;
  bottom: 28px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(181,123,190,.76), rgba(199,223,240,.75));
}

.blog-public-page .blog-public-filter-row {
  margin: 0 0 14px !important;
  padding: 7px !important;
  gap: 6px !important;
  border-color: rgba(237, 221, 231, 0.88) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,247,250,.72)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 18px 40px rgba(69,55,84,.055) !important;
}

.blog-public-page .blog-public-filter-row .pill-button {
  position: relative;
  min-height: 48px !important;
  padding: 0 26px !important;
  color: rgba(93, 78, 107, 0.70) !important;
  border-color: transparent !important;
  background: transparent !important;
  font-weight: 900 !important;
  transition: color .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.blog-public-page .blog-public-filter-row .pill-button:hover {
  color: #7f5794 !important;
  background: rgba(248, 239, 251, 0.72) !important;
  box-shadow: inset 0 0 0 1px rgba(181,123,190,.08) !important;
}

.blog-public-page .blog-public-filter-row .pill-button.is-active {
  color: #ffffff !important;
  border-color: rgba(181,123,190,.22) !important;
  background:
    radial-gradient(circle at 22% 20%, rgba(255,255,255,.35), transparent 30%),
    linear-gradient(135deg, #C08BCA 0%, #AD73BB 50%, #9B67B4 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.30),
    0 16px 30px rgba(174, 123, 196, 0.24) !important;
}

.blog-public-page .blog-public-filter-row .pill-button.is-active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 8px;
  width: 18px;
  height: 3px;
  border-radius: 999px;
  background: rgba(255,255,255,.58);
  transform: translateX(-50%);
}

.blog-public-page .blog-public-result-note {
  margin-top: 2px !important;
  border-color: rgba(237, 221, 231, 0.72) !important;
  background: rgba(255,255,255,.82) !important;
}

@media (max-width: 1260px) {
  .blog-public-page .blog-public-head {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    align-items: start !important;
  }

  .blog-public-page .blog-public-head p {
    max-width: 720px !important;
  }
}

@media (max-width: 720px) {
  .blog-public-page .blog-public-head p {
    padding: 22px 22px 22px 24px !important;
    border-radius: 24px;
  }

  .blog-public-page .blog-public-filter-row {
    border-radius: 28px !important;
  }

  .blog-public-page .blog-public-filter-row .pill-button {
    min-height: 46px !important;
    padding: 0 18px !important;
  }
}

/* =========================================================
   BLOG PUBLIC FINAL OVERRIDE — moved text card + pastel sort
   Added for actual style(265).css. Scope: blog.html only.
========================================================= */

body.blog-public-page .blog-public-feed-shell,
.blog-public-page .blog-public-feed-shell {
  overflow: hidden !important;
  padding: clamp(32px, 3.8vw, 46px) !important;
  border-radius: 42px !important;
}

body.blog-public-page .blog-public-feed-shell .section-head.blog-public-head,
.blog-public-page .blog-public-feed-shell .section-head.blog-public-head {
  width: 100% !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, 610px) minmax(320px, 430px) !important;
  column-gap: clamp(44px, 6vw, 86px) !important;
  row-gap: 20px !important;
  align-items: start !important;
  justify-content: space-between !important;
  margin: 0 0 0 !important;
}

body.blog-public-page .blog-public-head > div,
.blog-public-page .blog-public-head > div {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  max-width: 610px !important;
  display: grid !important;
  gap: 16px !important;
  align-content: start !important;
}

body.blog-public-page .blog-public-head h2,
.blog-public-page .blog-public-head h2 {
  max-width: 600px !important;
  margin: 0 !important;
  font-size: clamp(48px, 5.15vw, 72px) !important;
  line-height: 0.99 !important;
  letter-spacing: -0.07em !important;
  text-align: left !important;
  text-wrap: balance;
}

body.blog-public-page .blog-public-head > p,
.blog-public-page .blog-public-head > p {
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: start !important;
  position: relative !important;
  width: min(100%, 430px) !important;
  max-width: 430px !important;
  min-height: 160px !important;
  margin: 62px 0 0 !important;
  padding: 26px 30px 26px 36px !important;
  transform: none !important;
  border: 1px solid rgba(233, 216, 236, 0.96) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 92% 10%, rgba(199, 223, 240, 0.22), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,0.92), rgba(253,246,252,0.96)) !important;
  color: rgba(123, 106, 135, 0.94) !important;
  font-size: 17px !important;
  line-height: 1.72 !important;
  text-align: left !important;
  box-shadow: 0 18px 44px rgba(93, 71, 110, 0.055) !important;
}

body.blog-public-page .blog-public-head > p::before,
.blog-public-page .blog-public-head > p::before {
  content: "" !important;
  position: absolute !important;
  left: 18px !important;
  top: 24px !important;
  bottom: 24px !important;
  width: 4px !important;
  height: auto !important;
  margin: 0 !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(230, 199, 241, 0.95), rgba(201, 224, 246, 0.82)) !important;
  transform: none !important;
}

body.blog-public-page .blog-public-filter-row,
.blog-public-page .blog-public-filter-row {
  width: fit-content !important;
  max-width: 100% !important;
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 34px 0 0 !important;
  padding: 8px !important;
  border: 1px solid rgba(232, 213, 236, 0.96) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(253,247,252,0.92)) !important;
  box-shadow: 0 14px 34px rgba(93, 71, 110, 0.055), inset 0 1px 0 rgba(255,255,255,0.85) !important;
}

body.blog-public-page .blog-public-filter-row .pill-button,
.blog-public-page .blog-public-filter-row .pill-button {
  position: relative !important;
  min-height: 52px !important;
  padding: 0 28px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: rgba(132, 116, 145, 0.88) !important;
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  box-shadow: none !important;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease !important;
}

body.blog-public-page .blog-public-filter-row .pill-button:hover,
.blog-public-page .blog-public-filter-row .pill-button:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(216, 188, 226, 0.75) !important;
  background: rgba(250, 238, 252, 0.82) !important;
  color: #a169b0 !important;
  box-shadow: inset 0 0 0 1px rgba(181,123,190,.06) !important;
}

body.blog-public-page .blog-public-filter-row .pill-button.is-active,
.blog-public-page .blog-public-filter-row .pill-button.is-active {
  color: #8e58a2 !important;
  border-color: rgba(219, 183, 232, 0.90) !important;
  background: linear-gradient(135deg, #f5dcfa 0%, #ead7f8 52%, #f9e9f5 100%) !important;
  box-shadow: 0 10px 22px rgba(181, 123, 190, 0.13), inset 0 1px 0 rgba(255,255,255,0.70) !important;
}

body.blog-public-page .blog-public-filter-row .pill-button.is-active::after,
.blog-public-page .blog-public-filter-row .pill-button.is-active::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 8px !important;
  width: 28px !important;
  height: 3px !important;
  margin: 0 !important;
  border-radius: 999px !important;
  background: rgba(177, 116, 196, 0.55) !important;
  transform: translateX(-50%) !important;
}

body.blog-public-page .blog-public-result-note,
.blog-public-page .blog-public-result-note {
  width: fit-content !important;
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  margin: 14px 0 26px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(232, 213, 236, 0.86) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.82) !important;
  color: rgba(132, 116, 145, 0.86) !important;
  font-size: 13px !important;
  line-height: 18px !important;
  font-weight: 700 !important;
}

@media (max-width: 1120px) {
  body.blog-public-page .blog-public-feed-shell .section-head.blog-public-head,
  .blog-public-page .blog-public-feed-shell .section-head.blog-public-head {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  body.blog-public-page .blog-public-head > div,
  .blog-public-page .blog-public-head > div,
  body.blog-public-page .blog-public-head > p,
  .blog-public-page .blog-public-head > p {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-self: start !important;
    max-width: 720px !important;
  }

  body.blog-public-page .blog-public-head > p,
  .blog-public-page .blog-public-head > p {
    width: 100% !important;
    margin-top: 6px !important;
  }
}

@media (max-width: 760px) {
  body.blog-public-page .blog-public-feed-shell,
  .blog-public-page .blog-public-feed-shell {
    padding: 24px !important;
    border-radius: 30px !important;
  }

  body.blog-public-page .blog-public-head h2,
  .blog-public-page .blog-public-head h2 {
    font-size: 38px !important;
    line-height: 1.05 !important;
  }

  body.blog-public-page .blog-public-head > p,
  .blog-public-page .blog-public-head > p {
    width: 100% !important;
    min-height: auto !important;
    padding: 22px 24px 22px 30px !important;
    font-size: 15px !important;
  }

  body.blog-public-page .blog-public-filter-row,
  .blog-public-page .blog-public-filter-row {
    width: 100% !important;
    border-radius: 28px !important;
  }

  body.blog-public-page .blog-public-filter-row .pill-button,
  .blog-public-page .blog-public-filter-row .pill-button {
    flex: 1 1 auto !important;
    min-height: 48px !important;
    padding: 0 18px !important;
  }
}


/* =========================================================
   BLOG CURRENT HOTFIX — result note below filters
   Base: user's current style(269).css
========================================================= */
body.blog-public-page .blog-public-filter-row,
.blog-public-page .blog-public-filter-row {
  display: flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 34px 0 0 !important;
}

body.blog-public-page .blog-public-result-note,
.blog-public-page .blog-public-result-note {
  display: flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  clear: both !important;
  margin: 14px 0 30px !important;
}

body.blog-public-page .blog-public-filter-row + .blog-public-result-note,
.blog-public-page .blog-public-filter-row + .blog-public-result-note {
  display: flex !important;
  margin-top: 14px !important;
}

body.blog-public-page .blog-public-feed-shell > .blog-public-result-note,
.blog-public-page .blog-public-feed-shell > .blog-public-result-note {
  display: flex !important;
}

/* =========================================================
   DONATE BUTTON ALIGN FIX — scoped only to donate.html
   Keeps the current style and only aligns the option buttons.
========================================================= */
.donate-v2-options-grid {
  align-items: stretch !important;
}

.donate-v2-option-card {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

.donate-v2-option-card .button {
  align-self: stretch !important;
  margin-top: auto !important;
}

@media (max-width: 980px) {
  .donate-v2-option-card {
    min-height: 0 !important;
  }
}


/* =========================================================
   DONATE SECTION REDESIGN — donate.html only
   Rebuilds support options into a richer, livelier block.
========================================================= */
.donate-v2-methods-section {
  position: relative;
  padding-block: clamp(56px, 7vw, 96px) !important;
  overflow: hidden;
}

.donate-v2-methods-section::before {
  content: "";
  position: absolute;
  inset: 18px max(16px, calc((100vw - 1440px) / 2));
  z-index: 0;
  border-radius: 46px;
  background:
    radial-gradient(circle at 12% 18%, rgba(203, 176, 221, .20), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(194, 222, 245, .20), transparent 30%),
    radial-gradient(circle at 52% 105%, rgba(247, 221, 232, .38), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(252,247,252,.88));
  border: 1px solid rgba(230, 213, 232, .82);
  box-shadow: 0 28px 76px rgba(70, 55, 84, .07);
}

.donate-v2-methods-section > .container {
  position: relative;
  z-index: 1;
}

.donate-v2-methods-section .section-head {
  max-width: none !important;
  display: grid !important;
  grid-template-columns: minmax(0, .78fr) minmax(300px, .56fr) !important;
  align-items: end !important;
  gap: clamp(24px, 5vw, 72px) !important;
  margin-bottom: 32px !important;
}

.donate-v2-methods-section .section-head .badge {
  width: fit-content;
  margin-bottom: 14px;
  background: rgba(255,255,255,.78) !important;
  border-color: rgba(220, 192, 226, .9) !important;
  color: rgba(168, 99, 187, .95) !important;
  box-shadow: 0 10px 24px rgba(181, 123, 190, .08);
}

.donate-v2-methods-section .section-head h2 {
  max-width: 760px !important;
  margin: 0 !important;
  color: #453659 !important;
  font-size: clamp(34px, 4.6vw, 66px) !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
}

.donate-v2-methods-section .section-head p {
  max-width: 460px !important;
  margin: 0 !important;
  padding: 22px 24px 22px 28px !important;
  border: 1px solid rgba(227, 207, 230, .85);
  border-radius: 28px;
  background: rgba(255,255,255,.70);
  color: rgba(118, 101, 132, .88) !important;
  font-size: 16px !important;
  line-height: 1.78 !important;
  box-shadow: 0 16px 34px rgba(70,55,84,.045);
  position: relative;
}

.donate-v2-methods-section .section-head p::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 22px;
  bottom: 22px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(191, 135, 207, .55), rgba(191, 215, 247, .58));
}

.donate-v2-options-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2.2vw, 28px) !important;
  align-items: stretch !important;
  margin-top: 0 !important;
}

.donate-v2-option-card {
  --donate-card-accent: rgba(186, 124, 199, .70);
  --donate-card-soft: rgba(248, 239, 251, .86);
  position: relative !important;
  min-height: 340px !important;
  height: auto !important;
  display: grid !important;
  grid-template-rows: auto auto 1fr auto !important;
  gap: 0 !important;
  align-items: start !important;
  padding: 30px !important;
  overflow: hidden !important;
  border: 1px solid rgba(231, 213, 232, .92) !important;
  border-radius: 34px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(253,248,252,.93)) padding-box,
    linear-gradient(135deg, rgba(211, 180, 224, .45), rgba(246, 218, 229, .35), rgba(198, 222, 247, .36)) border-box !important;
  box-shadow:
    0 18px 44px rgba(70, 55, 84, .055),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
  transform: translateY(0);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}

.donate-v2-option-card::before {
  content: "";
  position: absolute;
  inset: -1px -1px auto -1px;
  height: 7px;
  border-radius: 34px 34px 0 0;
  background: linear-gradient(90deg, rgba(218, 190, 229, .65), rgba(194, 218, 245, .55), rgba(248, 214, 228, .60));
  opacity: .78;
}

.donate-v2-option-card::after {
  content: "♡";
  position: absolute;
  right: 26px;
  top: 24px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.68);
  color: rgba(185, 119, 199, .34);
  font-size: 22px;
  font-weight: 800;
  box-shadow: inset 0 0 0 1px rgba(223, 198, 229, .48);
}

.donate-v2-option-card:hover {
  transform: translateY(-6px);
  border-color: rgba(210, 176, 220, .95) !important;
  box-shadow:
    0 26px 64px rgba(70, 55, 84, .10),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.donate-v2-option-card.is-featured {
  --donate-card-accent: rgba(183, 116, 196, .86);
  --donate-card-soft: rgba(250, 241, 252, .94);
  border-color: rgba(203, 160, 215, .88) !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(216, 188, 231, .32), transparent 26%),
    radial-gradient(circle at 86% 95%, rgba(247, 216, 228, .42), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,1), rgba(253,247,252,.96)) !important;
  box-shadow:
    0 24px 66px rgba(181, 123, 190, .14),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.donate-v2-option-card.is-featured::before {
  height: 8px;
  background: linear-gradient(90deg, rgba(214, 181, 229, .92), rgba(188, 155, 213, .78), rgba(248, 211, 229, .72));
  opacity: 1;
}

.donate-v2-option-card.is-featured::after {
  content: "★";
  color: rgba(183, 116, 196, .55);
}

.donate-v2-option-amount {
  min-height: 54px !important;
  width: fit-content !important;
  padding: 0 24px !important;
  border: 1px solid rgba(218, 192, 226, .82) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.84), rgba(248,239,251,.92)) !important;
  color: rgba(174, 103, 190, .94) !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: -.02em !important;
  box-shadow: 0 10px 22px rgba(181, 123, 190, .075), inset 0 1px 0 rgba(255,255,255,.9);
}

.donate-v2-option-card h3 {
  margin: 24px 0 12px !important;
  max-width: 260px !important;
  color: #31263f !important;
  font-size: clamp(23px, 2vw, 30px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.035em !important;
}

.donate-v2-option-card p {
  max-width: 340px !important;
  margin: 0 !important;
  color: rgba(118, 101, 132, .83) !important;
  font-size: 16px !important;
  line-height: 1.68 !important;
}

.donate-v2-option-card .button {
  min-height: 56px !important;
  width: 100% !important;
  align-self: end !important;
  justify-self: stretch !important;
  margin-top: 28px !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  box-shadow: none !important;
  transform: none !important;
}

.donate-v2-option-card .button-secondary {
  color: rgba(172, 94, 188, .90) !important;
  border-color: rgba(224, 204, 230, .96) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(253,248,252,.92)) !important;
}

.donate-v2-option-card .button-primary {
  color: #fff !important;
  border-color: rgba(193, 132, 207, .78) !important;
  background:
    linear-gradient(135deg, rgba(205, 151, 217, .94), rgba(180, 122, 197, .92)) !important;
  box-shadow: 0 14px 26px rgba(181, 123, 190, .22) !important;
}

.donate-v2-option-card .button:hover {
  transform: translateY(-2px) !important;
}

.donate-v2-notice {
  margin-top: 24px !important;
  border-radius: 28px !important;
  border-color: rgba(188, 215, 247, .78) !important;
  background:
    linear-gradient(135deg, rgba(235, 244, 255, .85), rgba(255, 249, 252, .92)) !important;
  box-shadow: 0 16px 36px rgba(70, 55, 84, .055);
}

@media (max-width: 980px) {
  .donate-v2-methods-section .section-head {
    grid-template-columns: 1fr !important;
    align-items: start !important;
  }

  .donate-v2-methods-section .section-head p {
    max-width: none !important;
  }

  .donate-v2-options-grid {
    grid-template-columns: 1fr !important;
  }

  .donate-v2-option-card {
    min-height: 0 !important;
  }
}

@media (max-width: 640px) {
  .donate-v2-methods-section::before {
    inset: 10px 10px;
    border-radius: 30px;
  }

  .donate-v2-methods-section .section-head h2 {
    font-size: 32px !important;
  }

  .donate-v2-option-card {
    padding: 24px !important;
    border-radius: 28px !important;
  }

  .donate-v2-option-card::before {
    border-radius: 28px 28px 0 0;
  }

  .donate-v2-option-card::after {
    right: 20px;
    top: 20px;
  }
}


/* =========================================================
   DONATE METHODS HEADER FIX — donate.html only
   Fixes broken grid placement: badge/title on left, text card on right.
========================================================= */
.donate-v2-methods-section {
  padding-block: clamp(52px, 6.2vw, 86px) !important;
}

.donate-v2-methods-section::before {
  inset: 14px max(14px, calc((100vw - 1440px) / 2)) !important;
  border-radius: 42px !important;
}

.donate-v2-methods-section .section-head,
.donate-v2-methods-section .section-head.section-head-compact {
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .62fr) !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  column-gap: clamp(34px, 6vw, 92px) !important;
  row-gap: 16px !important;
  max-width: 1100px !important;
  margin: 0 auto 38px !important;
  padding: 0 !important;
  text-align: left !important;
}

.donate-v2-methods-section .section-head .badge {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: end !important;
  justify-self: start !important;
  margin: 0 !important;
}

.donate-v2-methods-section .section-head h2 {
  grid-column: 1 !important;
  grid-row: 2 !important;
  max-width: 650px !important;
  margin: 0 !important;
  font-size: clamp(38px, 4.2vw, 60px) !important;
  line-height: .98 !important;
  letter-spacing: -.06em !important;
  text-wrap: balance;
}

.donate-v2-methods-section .section-head p {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  justify-self: stretch !important;
  max-width: 440px !important;
  min-height: 150px !important;
  margin: 0 !important;
  padding: 25px 28px 25px 34px !important;
  border-radius: 30px !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.82), rgba(253,247,252,.72)) !important;
  border: 1px solid rgba(225, 205, 230, .86) !important;
  box-shadow:
    0 22px 52px rgba(70, 55, 84, .06),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
  color: rgba(115, 98, 129, .90) !important;
  font-size: 17px !important;
  line-height: 1.72 !important;
}

.donate-v2-options-grid {
  max-width: 1100px !important;
  margin: 0 auto !important;
}

@media (max-width: 980px) {
  .donate-v2-methods-section .section-head,
  .donate-v2-methods-section .section-head.section-head-compact {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    max-width: 680px !important;
    margin-bottom: 28px !important;
  }

  .donate-v2-methods-section .section-head .badge,
  .donate-v2-methods-section .section-head h2,
  .donate-v2-methods-section .section-head p {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  .donate-v2-methods-section .section-head p {
    max-width: none !important;
    min-height: 0 !important;
  }
}

@media (max-width: 640px) {
  .donate-v2-methods-section {
    padding-block: 42px !important;
  }

  .donate-v2-methods-section .section-head h2 {
    font-size: 34px !important;
  }

  .donate-v2-methods-section .section-head p {
    padding: 22px 22px 22px 30px !important;
    border-radius: 24px !important;
    font-size: 15px !important;
  }
}

/* =========================================================
   DONATE HERO SIZE FIX — donate.html only
   Normalizes the first donate block so the title/card do not feel oversized.
========================================================= */
.donate-v2-hero-section {
  padding-top: clamp(24px, 3vw, 34px) !important;
}

.donate-v2-hero-section > .container {
  max-width: 1180px !important;
}

.donate-v2-hero-shell {
  grid-template-columns: minmax(0, 1.04fr) minmax(380px, .86fr) !important;
  align-items: center !important;
  gap: clamp(26px, 4vw, 46px) !important;
  padding: clamp(28px, 3.2vw, 42px) !important;
  border-radius: 36px !important;
}

.donate-v2-hero-copy {
  justify-content: center !important;
}

.donate-v2-hero-copy h1 {
  max-width: 650px !important;
  margin: 16px 0 18px !important;
  font-size: clamp(42px, 3.65vw, 58px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.055em !important;
  text-wrap: balance;
}

.donate-v2-hero-copy > p {
  max-width: 610px !important;
  font-size: 16px !important;
  line-height: 1.78 !important;
}

.donate-v2-hero-actions {
  margin-top: 24px !important;
}

.donate-v2-hero-note {
  max-width: 560px !important;
  margin-top: 18px !important;
  padding: 15px 17px !important;
  border-radius: 20px !important;
}

.donate-v2-card-preview {
  align-self: center !important;
  min-height: 0 !important;
  height: auto !important;
  padding: clamp(22px, 2.3vw, 30px) !important;
  border-radius: 30px !important;
}

.donate-v2-preview-body {
  display: grid !important;
  grid-template-columns: 152px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 18px !important;
  margin-top: 18px !important;
}

.donate-v2-preview-image {
  flex: none !important;
  width: 152px !important;
  height: 210px !important;
}

.donate-v2-preview-copy h2 {
  font-size: clamp(26px, 2.35vw, 34px) !important;
  line-height: 1.05 !important;
}

.donate-v2-card-preview blockquote,
.donate-v2-preview-question {
  margin-top: 16px !important;
  padding: 18px 20px !important;
  border-radius: 20px !important;
}

@media (max-width: 980px) {
  .donate-v2-hero-shell {
    grid-template-columns: 1fr !important;
  }

  .donate-v2-card-preview {
    width: 100% !important;
  }
}

@media (max-width: 640px) {
  .donate-v2-hero-shell {
    padding: 24px !important;
    border-radius: 28px !important;
  }

  .donate-v2-hero-copy h1 {
    font-size: 36px !important;
  }

  .donate-v2-preview-body {
    grid-template-columns: 1fr !important;
  }

  .donate-v2-preview-image {
    width: min(180px, 100%) !important;
    height: 248px !important;
    margin: 0 auto !important;
  }
}

/* =========================================================
   DONATE LOWER METHODS SIZE FIX — donate.html only
   Makes the lower donate section more compact and balanced.
========================================================= */
.donate-v2-methods-section {
  padding-block: clamp(34px, 4.2vw, 58px) !important;
}

.donate-v2-methods-section::before {
  inset: 10px max(18px, calc((100vw - 1280px) / 2)) !important;
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 10% 18%, rgba(191, 158, 224, .15), transparent 28%),
    radial-gradient(circle at 88% 8%, rgba(200, 224, 249, .16), transparent 26%),
    linear-gradient(145deg, rgba(255,255,255,.94), rgba(251,246,252,.90)) !important;
}

.donate-v2-methods-section .section-head,
.donate-v2-methods-section .section-head.section-head-compact {
  grid-template-columns: minmax(0, .95fr) minmax(300px, .44fr) !important;
  column-gap: clamp(28px, 4.4vw, 68px) !important;
  row-gap: 12px !important;
  max-width: 1040px !important;
  margin: 0 auto 24px !important;
}

.donate-v2-methods-section .section-head .badge {
  font-size: 13px !important;
  min-height: 30px !important;
  padding: 0 16px !important;
}

.donate-v2-methods-section .section-head h2 {
  max-width: 610px !important;
  font-size: clamp(34px, 3.55vw, 50px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.055em !important;
}

.donate-v2-methods-section .section-head p {
  max-width: 360px !important;
  min-height: 0 !important;
  padding: 20px 22px 20px 28px !important;
  border-radius: 24px !important;
  font-size: 15px !important;
  line-height: 1.58 !important;
  box-shadow:
    0 16px 36px rgba(70, 55, 84, .05),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
}

.donate-v2-methods-section .section-head p::before {
  left: 14px !important;
  top: 18px !important;
  bottom: 18px !important;
}

.donate-v2-options-grid {
  max-width: 1040px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2.2vw, 26px) !important;
}

.donate-v2-option-card {
  min-height: 0 !important;
  padding: 26px 28px 28px !important;
  border-radius: 28px !important;
}

.donate-v2-option-card::before {
  height: 5px !important;
}

.donate-v2-option-card::after {
  right: 20px !important;
  top: 20px !important;
  width: 34px !important;
  height: 34px !important;
  font-size: 18px !important;
}

.donate-v2-option-amount {
  min-height: 48px !important;
  padding: 0 22px !important;
  font-size: 21px !important;
}

.donate-v2-option-card h3 {
  margin-top: 22px !important;
  font-size: clamp(24px, 2.2vw, 30px) !important;
  line-height: 1.04 !important;
}

.donate-v2-option-card p {
  margin-top: 12px !important;
  min-height: 74px !important;
  font-size: 15px !important;
  line-height: 1.52 !important;
}

.donate-v2-option-card .button {
  min-height: 48px !important;
  margin-top: 22px !important;
  border-radius: 999px !important;
}

.donate-v2-option-card.is-featured {
  transform: translateY(-4px) !important;
}

@media (max-width: 980px) {
  .donate-v2-methods-section .section-head,
  .donate-v2-methods-section .section-head.section-head-compact {
    grid-template-columns: 1fr !important;
    max-width: 720px !important;
    margin-bottom: 22px !important;
  }

  .donate-v2-methods-section .section-head p {
    max-width: none !important;
  }

  .donate-v2-options-grid {
    grid-template-columns: 1fr !important;
    max-width: 560px !important;
  }

  .donate-v2-option-card.is-featured {
    transform: none !important;
  }
}


/* =========================================================
   DONATE METHODS REAL SIZE FIX — donate.html only
   Final override: normal section width, smaller title, equal compact cards.
========================================================= */
.donate-v2-methods-section {
  padding-block: 38px !important;
  overflow: visible !important;
}

.donate-v2-methods-section::before {
  inset: 0 max(16px, calc((100vw - 1180px) / 2)) !important;
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 12% 20%, rgba(197, 164, 219, .14), transparent 28%),
    radial-gradient(circle at 88% 12%, rgba(198, 222, 247, .14), transparent 26%),
    linear-gradient(145deg, rgba(255,255,255,.95), rgba(252,247,252,.88)) !important;
  box-shadow: 0 18px 48px rgba(70, 55, 84, .055) !important;
}

.donate-v2-methods-section > .container {
  max-width: 1080px !important;
  width: calc(100% - 48px) !important;
  margin-inline: auto !important;
}

.donate-v2-methods-section .section-head,
.donate-v2-methods-section .section-head.section-head-compact {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px) !important;
  align-items: end !important;
  gap: 22px 54px !important;
  max-width: 100% !important;
  margin: 0 0 26px !important;
  padding: 0 !important;
}

.donate-v2-methods-section .section-head .badge {
  grid-column: 1 !important;
  grid-row: 1 !important;
  min-height: 32px !important;
  padding: 0 18px !important;
  font-size: 13px !important;
}

.donate-v2-methods-section .section-head h2 {
  grid-column: 1 !important;
  grid-row: 2 !important;
  max-width: 620px !important;
  margin: 0 !important;
  font-size: clamp(30px, 3.1vw, 44px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.042em !important;
  text-wrap: balance !important;
}

.donate-v2-methods-section .section-head p {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: end !important;
  max-width: 360px !important;
  min-height: 0 !important;
  padding: 18px 20px 18px 28px !important;
  border-radius: 24px !important;
  font-size: 14px !important;
  line-height: 1.56 !important;
}

.donate-v2-methods-section .section-head p::before {
  left: 13px !important;
  top: 16px !important;
  bottom: 16px !important;
  width: 4px !important;
}

.donate-v2-options-grid {
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 22px !important;
  margin: 0 !important;
  align-items: stretch !important;
}

.donate-v2-option-card,
.donate-v2-option-card.is-featured {
  min-height: 270px !important;
  height: auto !important;
  padding: 24px 26px !important;
  border-radius: 28px !important;
  display: flex !important;
  flex-direction: column !important;
  transform: none !important;
}

.donate-v2-option-card::before,
.donate-v2-option-card.is-featured::before {
  height: 5px !important;
  border-radius: 28px 28px 0 0 !important;
}

.donate-v2-option-card::after {
  right: 20px !important;
  top: 19px !important;
  width: 34px !important;
  height: 34px !important;
  font-size: 18px !important;
}

.donate-v2-option-amount {
  min-height: 46px !important;
  padding: 0 22px !important;
  font-size: 20px !important;
}

.donate-v2-option-card h3 {
  margin: 20px 0 10px !important;
  max-width: 230px !important;
  font-size: clamp(22px, 2vw, 28px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.03em !important;
}

.donate-v2-option-card p {
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

.donate-v2-option-card .button {
  margin-top: auto !important;
  min-height: 48px !important;
  width: 100% !important;
}

@media (max-width: 980px) {
  .donate-v2-methods-section {
    padding-block: 32px !important;
  }

  .donate-v2-methods-section::before {
    inset: 0 16px !important;
  }

  .donate-v2-methods-section > .container {
    width: calc(100% - 40px) !important;
  }

  .donate-v2-methods-section .section-head,
  .donate-v2-methods-section .section-head.section-head-compact {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .donate-v2-methods-section .section-head .badge,
  .donate-v2-methods-section .section-head h2,
  .donate-v2-methods-section .section-head p {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  .donate-v2-methods-section .section-head p {
    max-width: 100% !important;
  }

  .donate-v2-options-grid {
    grid-template-columns: 1fr !important;
    max-width: 560px !important;
    margin-inline: auto !important;
  }

  .donate-v2-option-card,
  .donate-v2-option-card.is-featured {
    min-height: 0 !important;
  }
}

@media (max-width: 640px) {
  .donate-v2-methods-section > .container {
    width: calc(100% - 28px) !important;
  }

  .donate-v2-methods-section::before {
    inset: 0 10px !important;
    border-radius: 28px !important;
  }

  .donate-v2-methods-section .section-head h2 {
    font-size: 30px !important;
  }

  .donate-v2-option-card,
  .donate-v2-option-card.is-featured {
    padding: 22px !important;
  }
}


/* =========================================================
   DONATE FINAL SPACING + TYPE FIX — donate.html only
   Separates hero/methods sections and normalizes methods title size.
========================================================= */
.donate-v2-hero-section {
  padding-bottom: 34px !important;
}

.donate-v2-methods-section {
  margin-top: 34px !important;
  padding-block: 44px 50px !important;
}

.donate-v2-methods-section::before {
  inset: 0 max(24px, calc((100vw - 1180px) / 2)) !important;
  border-radius: 34px !important;
}

.donate-v2-methods-section > .container {
  max-width: 1120px !important;
  width: calc(100% - 64px) !important;
}

.donate-v2-methods-section .section-head,
.donate-v2-methods-section .section-head.section-head-compact {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px) !important;
  align-items: center !important;
  gap: 18px 42px !important;
  margin-bottom: 28px !important;
}

.donate-v2-methods-section .section-head h2 {
  max-width: 670px !important;
  font-size: clamp(32px, 2.55vw, 40px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.035em !important;
}

.donate-v2-methods-section .section-head p {
  align-self: center !important;
  max-width: 340px !important;
  padding: 18px 20px 18px 28px !important;
  font-size: 14px !important;
  line-height: 1.52 !important;
}

.donate-v2-options-grid {
  gap: 24px !important;
}

.donate-v2-option-card,
.donate-v2-option-card.is-featured {
  min-height: 250px !important;
  padding: 24px 26px 22px !important;
}

.donate-v2-option-card h3 {
  margin-top: 18px !important;
  font-size: clamp(21px, 1.75vw, 26px) !important;
  line-height: 1.08 !important;
}

.donate-v2-option-card p {
  font-size: 13.5px !important;
  line-height: 1.5 !important;
}

.donate-v2-option-card .button {
  min-height: 46px !important;
}

@media (max-width: 980px) {
  .donate-v2-hero-section {
    padding-bottom: 26px !important;
  }

  .donate-v2-methods-section {
    margin-top: 26px !important;
    padding-block: 36px 42px !important;
  }

  .donate-v2-methods-section > .container {
    width: calc(100% - 44px) !important;
  }

  .donate-v2-methods-section .section-head,
  .donate-v2-methods-section .section-head.section-head-compact {
    grid-template-columns: 1fr !important;
    align-items: start !important;
  }

  .donate-v2-methods-section .section-head h2 {
    max-width: 720px !important;
  }

  .donate-v2-methods-section .section-head p {
    max-width: 560px !important;
  }
}

@media (max-width: 640px) {
  .donate-v2-methods-section > .container {
    width: calc(100% - 28px) !important;
  }

  .donate-v2-methods-section .section-head h2 {
    font-size: 30px !important;
  }
}

/* =========================================================
   DONATE HOVER + CARD GAP FIX — donate.html only
   Makes method cards lift on hover and gives text/button more air.
========================================================= */
.donate-v2-option-card,
.donate-v2-option-card.is-featured {
  display: flex !important;
  flex-direction: column !important;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease !important;
  will-change: transform !important;
}

.donate-v2-option-card:hover,
.donate-v2-option-card.is-featured:hover {
  transform: translateY(-10px) !important;
  box-shadow: 0 28px 58px rgba(95, 70, 111, .13) !important;
  border-color: rgba(190, 139, 204, .55) !important;
}

.donate-v2-option-card p {
  margin-bottom: 22px !important;
}

.donate-v2-option-card .button {
  margin-top: auto !important;
}

.donate-v2-option-card.is-featured p {
  margin-bottom: 30px !important;
}

.donate-v2-option-card.is-featured .button {
  margin-top: auto !important;
}

@media (prefers-reduced-motion: reduce) {
  .donate-v2-option-card:hover,
  .donate-v2-option-card.is-featured:hover {
    transform: none !important;
  }
}

/* =========================================================
   MOBILE ONLY HEADER — logo left + burger right
   Desktop header stays unchanged. On mobile/tablet the old
   utility row, ordinary nav and CTA are hidden behind burger.
========================================================= */
.mobile-menu-toggle,
.mobile-menu-panel {
  display: none;
}

@media (max-width: 980px) {
  :root {
    --fixed-header-space: 92px !important;
  }

  body.mobile-menu-lock {
    overflow: hidden;
  }

  .site-header {
    padding: 8px 8px 0 !important;
  }

  .site-header .header-shell,
  .site-header > .container,
  .site-header .container {
    width: min(calc(100% - 16px), 720px) !important;
    max-width: 720px !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    border: 1px solid rgba(232, 211, 231, .92) !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 18px 44px rgba(78, 56, 87, .08) !important;
  }

  .site-header .utility-bar {
    display: none !important;
  }

  .site-header .main-bar {
    height: 72px !important;
    min-height: 72px !important;
    background: transparent !important;
  }

  .site-header .main-inner {
    width: calc(100% - 28px) !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 48px !important;
    grid-template-areas: "brand burger" !important;
    align-items: center !important;
    justify-items: stretch !important;
    column-gap: 12px !important;
    row-gap: 0 !important;
  }

  .site-header .brand {
    grid-area: brand !important;
    width: 172px !important;
    height: 54px !important;
    justify-self: start !important;
    justify-content: flex-start !important;
  }

  .site-header .brand img {
    width: 172px !important;
    height: 54px !important;
    object-fit: contain !important;
  }

  .site-header .main-nav,
  .site-header .header-cta {
    display: none !important;
  }

  .mobile-menu-toggle {
    grid-area: burger !important;
    width: 48px !important;
    height: 48px !important;
    display: inline-flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    justify-self: end !important;
    padding: 0 !important;
    border: 1px solid rgba(219, 192, 226, .96);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(247,238,249,.94));
    box-shadow: 0 10px 24px rgba(181, 123, 190, .13);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

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

  .mobile-menu-toggle.is-active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }

  .mobile-menu-toggle.is-active span:nth-child(2) {
    opacity: 0;
    width: 0;
  }

  .mobile-menu-toggle.is-active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  .mobile-menu-panel {
    display: block !important;
    max-height: 0;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
    border-top: 1px solid rgba(232, 211, 231, .8);
    background:
      radial-gradient(circle at 14% 0%, rgba(200, 158, 214, .16), transparent 34%),
      radial-gradient(circle at 92% 18%, rgba(196, 220, 248, .16), transparent 32%),
      linear-gradient(180deg, rgba(255,255,255,.96), rgba(253,247,252,.97));
    transition: max-height .28s ease, opacity .2s ease;
  }

  .site-header.is-mobile-menu-open .mobile-menu-panel {
    max-height: calc(100dvh - 92px);
    opacity: 1;
    pointer-events: auto;
    overflow-y: auto;
  }

  .mobile-menu-panel-inner {
    padding: 14px;
    display: grid;
    gap: 12px;
  }

  .mobile-menu-links {
    display: grid;
    gap: 8px;
  }

  .mobile-menu-link,
  .mobile-menu-service-link,
  .mobile-menu-account {
    min-height: 46px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid rgba(232, 211, 231, .86);
    border-radius: 18px;
    background: rgba(255, 255, 255, .78);
    color: var(--text-primary) !important;
    font-size: 14px;
    line-height: 1.25;
    text-align: left;
    box-shadow: none;
  }

  .mobile-menu-link::after,
  .mobile-menu-service-link::after {
    content: "→";
    color: var(--brand-primary);
    font-weight: 700;
  }

  .mobile-menu-link--cta {
    justify-content: center;
    min-height: 48px;
    margin-top: 4px;
    border-color: rgba(181, 123, 190, .42);
    background: linear-gradient(135deg, rgba(194, 139, 207, .95), rgba(178, 112, 190, .92));
    color: #fff !important;
    font-weight: 700;
    box-shadow: 0 14px 28px rgba(181, 123, 190, .20);
  }

  .mobile-menu-link--cta::after {
    content: "";
  }

  .mobile-menu-service {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .mobile-menu-service-link {
    min-height: 42px;
    justify-content: center;
    font-size: 13px;
    color: var(--text-secondary) !important;
  }

  .mobile-menu-service-link::after {
    content: "";
  }

  .mobile-menu-bottom {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
  }

  .mobile-menu-lang {
    height: 40px !important;
    justify-self: start;
    background: rgba(255,255,255,.88) !important;
  }

  .mobile-menu-account {
    min-width: 0 !important;
    height: 44px !important;
    justify-content: flex-start;
    padding: 6px 12px 6px 6px !important;
    color: var(--text-secondary) !important;
  }

  .mobile-menu-account::after {
    content: "";
  }
}

@media (max-width: 520px) {
  :root {
    --fixed-header-space: 88px !important;
  }

  .site-header .header-shell,
  .site-header > .container,
  .site-header .container {
    width: calc(100% - 12px) !important;
    border-radius: 22px !important;
  }

  .site-header .main-bar,
  .site-header .main-inner {
    height: 68px !important;
    min-height: 68px !important;
  }

  .site-header .brand {
    width: 154px !important;
    height: 48px !important;
  }

  .site-header .brand img {
    width: 154px !important;
    height: 48px !important;
  }

  .mobile-menu-toggle {
    width: 46px !important;
    height: 46px !important;
    border-radius: 17px;
  }

  .mobile-menu-service,
  .mobile-menu-bottom {
    grid-template-columns: 1fr;
  }

  .mobile-menu-lang,
  .mobile-menu-account {
    justify-self: stretch;
    width: 100%;
  }
}


/* ===== MOBILE FOOTER REDESIGN: compact logo + clean link cards ===== */
@media (max-width: 720px) {
  .footer-section {
    padding: 28px 0 18px !important;
  }

  .footer-card {
    min-height: 0 !important;
    padding: 18px 14px 14px !important;
    border-radius: 28px !important;
    background:
      radial-gradient(circle at 12% 0%, rgba(205, 165, 222, .16), transparent 34%),
      radial-gradient(circle at 92% 18%, rgba(196, 222, 250, .16), transparent 32%),
      linear-gradient(180deg, rgba(255,255,255,.96), rgba(253,247,252,.94)) !important;
    box-shadow: 0 18px 44px rgba(102, 74, 116, .08) !important;
  }

  .footer-main {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    align-items: stretch !important;
  }

  .footer-brand {
    max-width: none !important;
    display: grid !important;
    justify-items: start !important;
    gap: 10px !important;
    padding: 16px !important;
    border: 1px solid rgba(231, 210, 235, .88) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .70) !important;
  }

  .footer-brand img {
    width: 172px !important;
    height: auto !important;
    max-height: 58px !important;
    object-fit: contain !important;
  }

  .footer-brand p {
    margin: 0 !important;
    max-width: none !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
    color: rgba(96, 76, 108, .78) !important;
  }

  .footer-links {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    align-items: stretch !important;
  }

  .footer-links div {
    min-width: 0 !important;
    display: grid !important;
    gap: 6px !important;
    padding: 14px !important;
    border: 1px solid rgba(231, 210, 235, .86) !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .76) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.72) !important;
  }

  .footer-links h3 {
    margin: 0 0 4px !important;
    font-size: 17px !important;
    line-height: 1.15 !important;
    color: var(--text-primary) !important;
  }

  .footer-links a {
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 16px !important;
    background: rgba(251, 244, 252, .78) !important;
    color: rgba(96, 76, 108, .86) !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
  }

  .footer-links a::after {
    content: "→";
    flex: 0 0 auto;
    color: rgba(181, 123, 190, .9);
    font-weight: 700;
  }

  .footer-bottom {
    margin-top: 12px !important;
    padding: 14px !important;
    border: 1px solid rgba(231, 210, 235, .82) !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .72) !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    color: rgba(96, 76, 108, .66) !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
  }

  .footer-bottom span {
    display: block !important;
  }

  .footer-bottom div {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .footer-bottom a {
    min-height: 34px !important;
    display: flex !important;
    align-items: center !important;
    padding: 8px 10px !important;
    border-radius: 14px !important;
    background: rgba(251, 244, 252, .66) !important;
    color: rgba(96, 76, 108, .78) !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
  }
}

@media (min-width: 721px) and (max-width: 980px) {
  .footer-section {
    padding: 34px 0 22px !important;
  }

  .footer-card {
    padding: 24px !important;
    border-radius: 30px !important;
  }

  .footer-main {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }

  .footer-brand {
    max-width: none !important;
  }

  .footer-links {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .footer-links div {
    padding: 16px !important;
    border: 1px solid rgba(231, 210, 235, .82) !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.70) !important;
  }

  .footer-links h3 {
    font-size: 18px !important;
  }

  .footer-links a {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }
}


/* ===== STYLE 294 FINAL HOTFIX — admin, request detail, direction visuals ===== */

/* admin.html: empty-state must stay hidden while cards exist */
.admin-empty-state[hidden],
[hidden].admin-empty-state {
  display: none !important;
}

/* specialist-request-detail.html: make the status summary cleaner and higher */
.specialist-request-detail-status-card {
  display: grid;
  align-content: start;
  gap: 0;
}

.specialist-request-detail-status-card > .status-pill {
  justify-self: start;
  margin: 0 0 18px !important;
}

.specialist-request-detail-status-card h2 {
  margin: 0 0 22px !important;
  align-self: start;
}

.specialist-request-detail-status-card .specialist-request-detail-mini-dl {
  margin-top: 0 !important;
}

/* specialist-request-detail.html: checkmark + ethics text in one row on desktop */
.specialist-request-ethics-strip {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 14px;
}

.specialist-request-ethics-strip > span {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--section-color);
  font-size: 18px;
  line-height: 1;
}

.specialist-request-ethics-strip > p {
  margin: 0;
  min-width: 0;
}

/* direction detail pages: enlarge illustration inside the opened direction */
.direction-detail-page .direction-detail-image-card {
  width: min(100%, 570px) !important;
  height: 430px !important;
  padding: 24px 24px 0 !important;
}

.direction-detail-page .direction-detail-image-card img {
  width: min(100%, 430px) !important;
  transform: translateY(2px) !important;
}

@media (max-width: 1260px) {
  .direction-detail-page .direction-detail-image-card {
    max-width: 560px !important;
  }
}

@media (max-width: 980px) {
  .direction-detail-page .direction-detail-image-card {
    height: 380px !important;
  }

  .direction-detail-page .direction-detail-image-card img {
    width: min(100%, 360px) !important;
  }
}

@media (max-width: 720px) {
  .specialist-request-ethics-strip {
    align-items: flex-start;
  }

  .direction-detail-page .direction-detail-image-card {
    height: 320px !important;
    padding: 20px 18px 0 !important;
  }

  .direction-detail-page .direction-detail-image-card img {
    width: min(100%, 300px) !important;
  }
}

/* ===== END STYLE 294 FINAL HOTFIX ===== */


/* ===== DIRECTION DETAIL IMAGE REAL SIZE FIX =====
   The previous hotfix changed transform only to translateY(), while an earlier
   rule kept the image absolutely positioned at top/left: 50%. Because of that
   only the lower-right part of the image was visible and the illustration
   looked small. This block is intentionally last and targets only opened
   direction pages: direction-psychology / direction-coaching / direction-tarot.
*/
.direction-detail-page .direction-detail-visual {
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.direction-detail-page .direction-detail-image-card {
  position: relative !important;
  width: min(100%, 620px) !important;
  height: 500px !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden !important;
}

.direction-detail-page .direction-detail-image-card img {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: min(152%, 820px) !important;
  max-width: none !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: translate(-50%, -50%) scale(1.08) !important;
  transform-origin: center center !important;
  opacity: 0.98 !important;
}

@media (max-width: 1180px) {
  .direction-detail-page .direction-detail-image-card {
    height: 430px !important;
  }

  .direction-detail-page .direction-detail-image-card img {
    width: min(148%, 720px) !important;
  }
}

@media (max-width: 980px) {
  .direction-detail-page .direction-detail-image-card {
    width: min(100%, 560px) !important;
    height: 380px !important;
  }

  .direction-detail-page .direction-detail-image-card img {
    width: min(145%, 620px) !important;
    transform: translate(-50%, -50%) scale(1.02) !important;
  }
}

@media (max-width: 720px) {
  .direction-detail-page .direction-detail-image-card {
    width: 100% !important;
    height: 300px !important;
  }

  .direction-detail-page .direction-detail-image-card img {
    width: min(150%, 500px) !important;
    transform: translate(-50%, -50%) scale(1) !important;
  }
}

/* ===== END DIRECTION DETAIL IMAGE REAL SIZE FIX ===== */

/* =========================================================
   FINAL QA SPACING PASS — badges, labels, headings, text
   Keeps existing design, only separates elements that were visually stuck.
========================================================= */
:where(.badge, .badge-soft, .badge-blue, .trust-chip, .account-chip, .status-pill, .info-pill, .filter-pill, .tag, .meta-pill, .small-pill, .route-pill, .blog-chip, .hero-badge, .section-badge) {
  line-height: 1.18;
  vertical-align: middle;
}

:where(.badge, .badge-soft, .badge-blue, .trust-chip, .account-chip, .status-pill, .info-pill, .filter-pill, .tag, .meta-pill, .small-pill, .route-pill, .blog-chip, .hero-badge, .section-badge) + :where(h1, h2, h3, h4, .section-title, .hero-title, .page-title) {
  margin-top: 14px !important;
}

:where(h1, h2, h3, h4, .section-title, .hero-title, .page-title) + :where(p, .lead, .section-lead, .hero-lead, .muted-text, .card-text) {
  margin-top: 12px !important;
}

:where(p, .lead, .section-lead, .hero-lead, .muted-text, .card-text) + :where(.button-row, .hero-actions, .actions-row, .filter-row, .tab-row, .tag-row, .meta-row, .chips-row) {
  margin-top: 22px !important;
}

:where(.tag-row, .meta-row, .chips-row, .badge-row, .preview-top-badges, .questions-filter-row, .blog-filter-row, .admin-filter-row) {
  gap: 12px !important;
  row-gap: 12px !important;
}

:where(.badge-row, .meta-row, .chips-row, .tag-row) + :where(h2, h3, h4, p, .card-title, .card-text) {
  margin-top: 16px !important;
}

:where(.form-group, .field-group, .input-group) > :where(label, .form-label) + :where(input, textarea, select, .custom-select, .select-shell) {
  margin-top: 8px !important;
}

:where(.form-group, .field-group, .input-group) + :where(.form-group, .field-group, .input-group) {
  margin-top: 18px !important;
}

:where(.card, .soft-card, .admin-card, .admin-detail-card, .support-card, .request-card, .blog-card, .specialist-card, .cabinet-card) > :where(.badge, .status-pill, .trust-chip, .account-chip):first-child + :where(h2, h3, h4, p) {
  margin-top: 14px !important;
}

@media (max-width: 720px) {
  :where(.badge, .badge-soft, .badge-blue, .trust-chip, .account-chip, .status-pill, .info-pill, .filter-pill, .tag, .meta-pill, .small-pill, .route-pill, .blog-chip, .hero-badge, .section-badge) + :where(h1, h2, h3, h4, .section-title, .hero-title, .page-title) {
    margin-top: 12px !important;
  }

  :where(h1, h2, h3, h4, .section-title, .hero-title, .page-title) + :where(p, .lead, .section-lead, .hero-lead, .muted-text, .card-text) {
    margin-top: 10px !important;
  }

  :where(.tag-row, .meta-row, .chips-row, .badge-row, .preview-top-badges, .questions-filter-row, .blog-filter-row, .admin-filter-row) {
    gap: 10px !important;
    row-gap: 10px !important;
  }
}


/* =========================================================
   FINAL DEEP SCREENS — specialist request + public answer
   Scoped only to the two working pages. Does not touch global layout.
========================================================= */
.specialist-deep-page,
.specialist-request-detail-page {
  --deep-line: rgba(237, 221, 231, 0.96);
  --deep-card: rgba(255, 255, 255, 0.88);
  --deep-soft: rgba(181, 123, 190, 0.085);
  --deep-blue: rgba(79, 137, 255, 0.10);
}

.specialist-deep-hero,
.specialist-request-detail-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.58fr);
  gap: clamp(20px, 3.2vw, 42px);
  align-items: stretch;
  border: 1px solid var(--deep-line);
  border-radius: clamp(30px, 3.2vw, 44px);
  padding: clamp(28px, 4.8vw, 62px);
  background:
    radial-gradient(circle at 9% 8%, rgba(220,184,226,.28), transparent 31%),
    radial-gradient(circle at 86% 0%, rgba(201,226,255,.24), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(255,247,252,.74));
  box-shadow: 0 26px 70px rgba(69,55,84,.055);
  overflow: hidden;
}

.specialist-deep-hero::after,
.specialist-request-detail-hero::after {
  content: '';
  position: absolute;
  right: -110px;
  bottom: -140px;
  width: 340px;
  height: 340px;
  border-radius: 999px;
  border: 1px solid rgba(237,221,231,.82);
  background: rgba(255,255,255,.36);
  pointer-events: none;
}

.specialist-deep-hero-copy,
.specialist-request-detail-hero .specialist-workspace-hero-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 330px;
}

.specialist-deep-hero-copy .badge,
.specialist-request-detail-hero .badge {
  width: fit-content;
  margin-bottom: 18px;
}

.specialist-deep-hero-copy h1,
.specialist-request-detail-hero .specialist-workspace-hero-copy h1 {
  max-width: 820px;
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(42px, 5.1vw, 74px);
  line-height: .98;
  letter-spacing: -.075em;
}

.specialist-deep-hero-copy > p,
.specialist-request-detail-hero .specialist-workspace-hero-copy > p {
  max-width: 760px;
  margin: 22px 0 0;
  color: var(--text-secondary);
  font-size: clamp(17px, 1.35vw, 22px);
  line-height: 1.72;
}

.specialist-deep-actions,
.specialist-request-detail-hero .specialist-workspace-actions {
  margin-top: 28px;
}

.specialist-deep-status-card,
.specialist-request-detail-status-card {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-self: center;
  min-height: 300px;
  padding: clamp(24px, 2.8vw, 36px);
  border: 1px solid rgba(237,221,231,.95);
  border-radius: 34px;
  background:
    radial-gradient(circle at 100% 0%, rgba(201,226,255,.20), transparent 36%),
    rgba(255,255,255,.90);
  box-shadow: 0 22px 48px rgba(69,55,84,.075);
}

.specialist-deep-status-card > .badge,
.specialist-request-detail-status-card > .status-pill,
.specialist-request-detail-status-card > .badge {
  align-self: flex-start;
  margin-bottom: 18px;
}

.specialist-deep-status-card h2,
.specialist-request-detail-status-card h2 {
  margin: 0 0 18px;
  color: var(--text-primary);
  font-size: clamp(31px, 3vw, 46px);
  line-height: 1.08;
  letter-spacing: -.06em;
}

.specialist-deep-status-card p {
  margin: 0 0 20px;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.65;
}

.specialist-request-flow-section {
  padding-top: clamp(18px, 2.4vw, 34px);
}

.specialist-request-flow-shell {
  padding: clamp(22px, 3vw, 34px);
}

.specialist-request-flow-head {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(320px, .72fr);
  column-gap: 28px;
  align-items: end;
  max-width: none;
}

.specialist-request-flow-head .badge {
  grid-column: 1 / -1;
  width: fit-content;
}

.specialist-request-flow-head h2 {
  max-width: 620px;
  margin-top: 14px;
}

.specialist-request-flow-head p {
  max-width: 650px;
  margin: 0;
}

.specialist-request-flow-strip {
  margin-top: 24px;
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 0;
}

.specialist-request-flow-strip article,
.specialist-public-answer-route-card {
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.specialist-request-flow-strip article:hover,
.specialist-public-answer-route-card:hover {
  transform: translateY(-5px);
  border-color: rgba(181,123,190,.28);
  box-shadow: 0 18px 42px rgba(69,55,84,.08);
}

.specialist-request-detail-layout,
.specialist-public-answer-layout--polished {
  align-items: start;
}

.specialist-request-detail-card,
.specialist-request-detail-sidebar > article,
.specialist-deep-card {
  border: 1px solid var(--deep-line);
  background:
    radial-gradient(circle at 100% 0%, rgba(201,226,255,.10), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,247,252,.78));
  box-shadow: 0 18px 45px rgba(69,55,84,.045);
}

.specialist-request-detail-card .badge + h2,
.specialist-public-answer-card-head .badge + h2,
.specialist-public-answer-editor-head .badge + h2 {
  margin-top: 14px;
}

.specialist-request-problem-box,
.specialist-public-answer-box,
.specialist-public-upload-panel--polished,
.specialist-public-ethics-note--polished {
  border-radius: 26px;
  border: 1px solid rgba(237,221,231,.72);
  background: rgba(255,250,253,.78);
}

.specialist-request-ethics-strip {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 14px;
}

.specialist-request-ethics-strip > span {
  flex: 0 0 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  color: var(--section-color);
  background: rgba(181,123,190,.10);
  font-size: 15px;
  line-height: 1;
}

.specialist-request-ethics-strip > p {
  margin: 0;
  line-height: 1.55;
}

.specialist-public-answer-hero-section {
  padding-top: clamp(58px, 7vw, 112px);
}

.specialist-public-answer-route-section {
  padding-top: 22px;
}

.specialist-public-answer-route-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.specialist-public-answer-route-card {
  min-height: 166px;
  padding: 22px;
  border: 1px solid rgba(237,221,231,.9);
  border-radius: 30px;
  background:
    radial-gradient(circle at 100% 0%, rgba(201,226,255,.12), transparent 36%),
    rgba(255,255,255,.88);
  box-shadow: 0 14px 34px rgba(69,55,84,.04);
}

.specialist-public-answer-route-card > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 18px;
  color: var(--section-color);
  background: rgba(181,123,190,.10);
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 900;
}

.specialist-public-answer-route-card h3 {
  margin: 18px 0 0;
  color: var(--text-primary);
  font-size: 21px;
  line-height: 1.2;
  letter-spacing: -.045em;
}

.specialist-public-answer-route-card p {
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.65;
}

.specialist-public-answer-layout--polished {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 470px);
  gap: clamp(18px, 3vw, 34px);
}

.specialist-public-answer-card-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 22px;
}

.specialist-public-answer-side-note {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: var(--radius-pill);
  color: var(--accent-blue);
  background: rgba(79,137,255,.10);
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.specialist-public-answer-main .specialist-public-detail-meta {
  margin: 22px 0;
}

.specialist-public-answer-box {
  padding: clamp(18px, 2.3vw, 26px);
}

.specialist-public-answer-box + .specialist-public-answer-box {
  margin-top: 18px;
}

.specialist-public-answer-box h3,
.specialist-public-upload-panel--polished h3 {
  margin: 0 0 12px;
  color: var(--text-primary);
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: -.045em;
}

.specialist-public-answer-box p,
.specialist-public-upload-panel--polished p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.7;
}

.specialist-public-dialog-list {
  display: grid;
  gap: 12px;
}

.specialist-public-dialog-item {
  padding: 16px 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(237,221,231,.68);
}

.specialist-public-dialog-item span {
  display: block;
  color: var(--section-color);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .055em;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.specialist-public-answer-editor--polished {
  position: sticky;
  top: 116px;
}

.specialist-public-answer-editor-head p {
  margin: 12px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.65;
}

.specialist-public-answer-field--polished {
  margin-top: 20px;
}

.specialist-public-answer-field--polished textarea {
  min-height: 250px;
  padding: 22px;
  border-radius: 28px;
  line-height: 1.65;
  resize: vertical;
}

.specialist-public-upload-panel--polished {
  margin-top: 20px;
  padding: 20px;
}

.specialist-public-ethics-note--polished {
  margin: 20px 0 0;
  padding: 18px 20px;
  background: linear-gradient(135deg, rgba(255,244,226,.92), rgba(255,250,244,.78));
}

.specialist-public-answer-feedback {
  margin: 16px 0 0;
  padding: 14px 16px;
  border-radius: 20px;
  color: #417a4b;
  background: rgba(131,174,123,.14);
  border: 1px solid rgba(131,174,123,.22);
  font-weight: 800;
}

.specialist-public-answer-feedback[hidden] {
  display: none !important;
}

.specialist-public-answer-actions--polished {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}

.specialist-public-answer-actions--polished .button-primary {
  grid-column: 1 / -1;
}

@media (max-width: 1120px) {
  .specialist-deep-hero,
  .specialist-request-detail-hero,
  .specialist-public-answer-layout--polished,
  .specialist-request-flow-head {
    grid-template-columns: 1fr;
  }

  .specialist-deep-status-card,
  .specialist-request-detail-status-card,
  .specialist-public-answer-editor--polished {
    position: relative;
    top: auto;
    align-self: stretch;
  }

  .specialist-public-answer-route-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .specialist-deep-hero,
  .specialist-request-detail-hero {
    padding: 22px;
    border-radius: 30px;
  }

  .specialist-deep-hero-copy,
  .specialist-request-detail-hero .specialist-workspace-hero-copy {
    min-height: 0;
  }

  .specialist-deep-hero-copy h1,
  .specialist-request-detail-hero .specialist-workspace-hero-copy h1 {
    font-size: clamp(34px, 12vw, 48px);
  }

  .specialist-deep-actions,
  .specialist-request-detail-hero .specialist-workspace-actions,
  .specialist-public-answer-actions--polished {
    grid-template-columns: 1fr;
  }

  .specialist-public-answer-card-head {
    flex-direction: column;
  }

  .specialist-public-answer-side-note {
    white-space: normal;
  }
}

/* =========================================================
   ABOUT PAGE — product identity / client presentation page
   Scoped only to about.html
========================================================= */
.about-page {
  position: relative;
  overflow: hidden;
}

.about-page::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 740px;
  pointer-events: none;
  background:
    radial-gradient(circle at 14% 14%, rgba(181, 123, 190, 0.16), transparent 34%),
    radial-gradient(circle at 88% 8%, rgba(241, 211, 223, 0.72), transparent 32%),
    linear-gradient(180deg, rgba(255, 247, 250, 0.9), rgba(255,255,255,0));
  z-index: -1;
}

.about-hero-section {
  padding-top: 52px;
}

.about-hero-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.78fr);
  gap: 34px;
  align-items: stretch;
  padding: 38px;
  min-height: 560px;
  border: 1px solid rgba(174, 123, 196, 0.18);
  border-radius: 42px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.98), rgba(248, 239, 251, 0.72)),
    radial-gradient(circle at 100% 0%, rgba(241, 211, 223, 0.85), transparent 42%);
  box-shadow: 0 24px 80px rgba(69, 55, 84, 0.08);
  overflow: hidden;
}

.about-hero-card::before,
.about-hero-card::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}

.about-hero-card::before {
  width: 220px;
  height: 220px;
  right: 28%;
  top: -92px;
  background: rgba(199, 223, 240, 0.45);
  filter: blur(2px);
}

.about-hero-card::after {
  width: 120px;
  height: 120px;
  left: 42%;
  bottom: 34px;
  border: 1px solid rgba(174, 123, 196, 0.22);
}

.about-hero-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  max-width: 720px;
}

.about-hero-copy .badge {
  margin-bottom: 20px;
}

.about-hero-copy h1 {
  margin: 0;
  max-width: 760px;
  color: var(--text-primary);
  font-size: clamp(38px, 5.1vw, 74px);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.about-hero-copy p {
  margin: 24px 0 0;
  max-width: 650px;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.75;
}

.about-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.about-hero-points {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.about-hero-points span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  color: var(--section-color);
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(174, 123, 196, 0.16);
  font-size: 12px;
  line-height: 1.35;
  box-shadow: 0 12px 28px rgba(69, 55, 84, 0.05);
}

.about-hero-visual {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  min-height: 480px;
  border-radius: 36px;
  background:
    radial-gradient(circle at 50% 44%, rgba(255,255,255,0.98), rgba(248,239,251,0.56) 52%, rgba(255,255,255,0.72)),
    linear-gradient(145deg, rgba(255,255,255,0.82), rgba(255,247,250,0.64));
  border: 1px solid rgba(174, 123, 196, 0.14);
  overflow: hidden;
}

.about-hero-visual::before {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  border-radius: 999px;
  border: 1px dashed rgba(174, 123, 196, 0.22);
}

.about-hero-visual::after {
  content: "";
  position: absolute;
  width: 470px;
  height: 470px;
  border-radius: 999px;
  border: 1px solid rgba(181, 123, 190, 0.08);
}

.about-orbit-card-main {
  position: relative;
  z-index: 2;
  width: min(78%, 300px);
  min-height: 260px;
  padding: 28px 24px;
  border-radius: 34px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(174, 123, 196, 0.16);
  box-shadow: 0 24px 70px rgba(69, 55, 84, 0.10);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.about-orbit-card-main img {
  width: min(190px, 82%);
  height: auto;
  object-fit: contain;
  margin-bottom: 18px;
}

.about-orbit-card-main strong {
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.2;
}

.about-orbit-card-main p {
  margin: 10px 0 0;
  max-width: 220px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.55;
}

.about-floating-chip {
  position: absolute;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  color: var(--section-color);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(174, 123, 196, 0.18);
  box-shadow: 0 18px 42px rgba(69, 55, 84, 0.08);
  font-size: 13px;
  line-height: 1.25;
  white-space: nowrap;
}

.about-chip-one { top: 16%; left: 9%; }
.about-chip-two { top: 17%; right: 7%; }
.about-chip-three { bottom: 16%; left: 7%; }
.about-chip-four { bottom: 14%; right: 9%; }

.about-mission-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) repeat(3, minmax(0, 0.62fr));
  gap: 18px;
  align-items: stretch;
}

.about-mission-card,
.about-metric-card,
.about-route-step,
.about-role-card,
.about-module-card,
.about-trust-card,
.about-cta-card {
  border: 1px solid rgba(174, 123, 196, 0.14);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 18px 48px rgba(69, 55, 84, 0.055);
}

.about-mission-card-wide {
  padding: 32px;
  border-radius: 34px;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.95), rgba(248,239,251,0.74));
}

.about-mission-card .badge {
  margin-bottom: 18px;
}

.about-mission-card h2 {
  margin: 0;
  max-width: 680px;
  font-size: clamp(26px, 3vw, 42px);
  line-height: 1.12;
  letter-spacing: -0.035em;
}

.about-mission-card p {
  margin: 18px 0 0;
  max-width: 760px;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.about-metric-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 250px;
  padding: 24px;
  border-radius: 30px;
}

.about-metric-card > span {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  color: var(--section-color);
  background: var(--section-color-soft);
  font-size: 13px;
  font-weight: 700;
}

.about-metric-card strong {
  display: block;
  margin-top: auto;
  color: var(--text-primary);
  font-size: 19px;
  line-height: 1.25;
}

.about-metric-card p {
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.65;
}

.about-section-head {
  max-width: 760px;
  margin-bottom: 28px;
}

.about-section-head .badge {
  margin-bottom: 16px;
}

.about-section-head h2 {
  margin-top: 0;
}

.about-route-timeline {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.about-route-timeline::before {
  content: "";
  position: absolute;
  top: 36px;
  left: 7%;
  right: 7%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(174,123,196,0.32), transparent);
}

.about-route-step {
  position: relative;
  z-index: 1;
  min-height: 260px;
  padding: 24px;
  border-radius: 30px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.about-route-step:hover,
.about-role-card:hover,
.about-module-card:hover {
  transform: translateY(-4px);
  border-color: rgba(174, 123, 196, 0.28);
  box-shadow: 0 24px 64px rgba(69, 55, 84, 0.08);
}

.about-route-step > span {
  display: inline-flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  color: #fff;
  background: linear-gradient(135deg, var(--brand-primary), var(--section-color));
  box-shadow: 0 16px 34px rgba(174, 123, 196, 0.22);
  font-weight: 700;
}

.about-route-step h3 {
  margin: 28px 0 10px;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.25;
}

.about-route-step p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.7;
}

.about-roles-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: 28px;
  align-items: start;
}

.about-roles-intro {
  position: sticky;
  top: 130px;
  padding: 30px;
  border-radius: 34px;
  border: 1px solid rgba(174, 123, 196, 0.14);
  background: linear-gradient(135deg, rgba(248,239,251,0.9), rgba(255,255,255,0.92));
}

.about-roles-intro .badge {
  margin-bottom: 18px;
}

.about-roles-intro h2 {
  margin: 0;
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.12;
  letter-spacing: -0.035em;
}

.about-roles-intro p {
  margin: 18px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.75;
}

.about-roles-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.about-role-card {
  position: relative;
  min-height: 380px;
  padding: 24px;
  border-radius: 34px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.about-role-card::before {
  content: "";
  position: absolute;
  inset: auto -30px -64px auto;
  width: 160px;
  height: 160px;
  border-radius: 999px;
  background: rgba(248, 239, 251, 0.9);
}

.about-role-icon {
  display: inline-flex;
  width: 58px;
  height: 58px;
  margin-bottom: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 22px;
  color: var(--section-color);
  background: var(--section-color-soft);
  border: 1px solid rgba(174, 123, 196, 0.14);
  font-size: 22px;
}

.about-role-card .badge {
  margin-bottom: 18px;
}

.about-role-card h3 {
  position: relative;
  margin: 0;
  color: var(--text-primary);
  font-size: 23px;
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.about-role-card p {
  position: relative;
  margin: 14px 0 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.75;
}

.about-trust-card {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 28px;
  align-items: center;
  padding: 34px;
  border-radius: 40px;
  background:
    radial-gradient(circle at 0% 0%, rgba(199, 223, 240, 0.42), transparent 38%),
    linear-gradient(135deg, rgba(255,255,255,0.96), rgba(255,247,250,0.8));
}

.about-trust-copy .badge {
  margin-bottom: 18px;
}

.about-trust-copy h2 {
  margin: 0;
  font-size: clamp(28px, 3.3vw, 48px);
  line-height: 1.08;
  letter-spacing: -0.04em;
}

.about-trust-copy p {
  margin: 18px 0 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.about-trust-list {
  display: grid;
  gap: 12px;
}

.about-trust-list article {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: start;
  padding: 18px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(174, 123, 196, 0.12);
}

.about-trust-list article > span {
  display: inline-flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  color: var(--section-color);
  background: var(--section-color-soft);
  font-size: 12px;
  font-weight: 700;
}

.about-trust-list h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 1.25;
}

.about-trust-list p {
  margin: 7px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.65;
}

.about-modules-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.about-module-card {
  display: flex;
  flex-direction: column;
  min-height: 220px;
  padding: 24px;
  border-radius: 30px;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.about-module-card > span {
  display: inline-flex;
  align-self: flex-start;
  min-height: 30px;
  padding: 0 12px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--section-color);
  background: var(--section-color-soft);
  border: 1px solid rgba(174, 123, 196, 0.16);
  font-size: 12px;
  line-height: 1.2;
}

.about-module-card strong {
  margin-top: auto;
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.2;
}

.about-module-card p {
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.65;
}

.about-cta-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  padding: 34px;
  border-radius: 40px;
  background:
    radial-gradient(circle at 90% 10%, rgba(248,239,251,1), transparent 42%),
    linear-gradient(135deg, rgba(255,255,255,0.98), rgba(241,211,223,0.5));
}

.about-cta-card .badge {
  margin-bottom: 18px;
}

.about-cta-card h2 {
  margin: 0;
  max-width: 790px;
  font-size: clamp(26px, 3.2vw, 44px);
  line-height: 1.1;
  letter-spacing: -0.04em;
}

.about-cta-card p {
  margin: 16px 0 0;
  max-width: 730px;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.about-cta-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 230px;
}

.about-cta-actions .button {
  width: 100%;
}

@media (max-width: 1260px) {
  .about-hero-card {
    grid-template-columns: 1fr;
  }

  .about-hero-copy {
    max-width: 920px;
  }

  .about-hero-visual {
    min-height: 420px;
  }

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

  .about-mission-card-wide {
    grid-column: 1 / -1;
  }

  .about-roles-layout,
  .about-trust-card {
    grid-template-columns: 1fr;
  }

  .about-roles-intro {
    position: relative;
    top: auto;
  }
}

@media (max-width: 980px) {
  .about-hero-section {
    padding-top: 34px;
  }

  .about-hero-card,
  .about-trust-card,
  .about-cta-card {
    padding: 26px;
    border-radius: 34px;
  }

  .about-hero-copy h1 {
    font-size: clamp(34px, 8vw, 58px);
  }

  .about-hero-copy p {
    font-size: 15px;
  }

  .about-route-timeline,
  .about-roles-grid,
  .about-modules-grid {
    grid-template-columns: 1fr 1fr;
  }

  .about-route-timeline::before {
    display: none;
  }

  .about-route-step,
  .about-role-card,
  .about-module-card {
    min-height: auto;
  }

  .about-cta-card {
    grid-template-columns: 1fr;
  }

  .about-cta-actions {
    flex-direction: row;
    flex-wrap: wrap;
    min-width: 0;
  }

  .about-cta-actions .button {
    width: auto;
  }
}

@media (max-width: 720px) {
  .about-hero-card {
    min-height: auto;
    padding: 22px;
    border-radius: 28px;
  }

  .about-hero-copy .badge,
  .about-mission-card .badge,
  .about-section-head .badge,
  .about-roles-intro .badge,
  .about-trust-copy .badge,
  .about-cta-card .badge {
    margin-bottom: 14px;
  }

  .about-hero-copy h1,
  .about-mission-card h2,
  .about-roles-intro h2,
  .about-trust-copy h2,
  .about-cta-card h2 {
    letter-spacing: -0.035em;
  }

  .about-hero-actions,
  .about-cta-actions {
    width: 100%;
    flex-direction: column;
  }

  .about-hero-actions .button,
  .about-cta-actions .button {
    width: 100%;
  }

  .about-hero-points {
    gap: 8px;
  }

  .about-hero-points span {
    flex: 1 1 100%;
    justify-content: center;
  }

  .about-hero-visual {
    min-height: 330px;
    border-radius: 26px;
  }

  .about-hero-visual::before {
    width: 250px;
    height: 250px;
  }

  .about-hero-visual::after {
    width: 320px;
    height: 320px;
  }

  .about-orbit-card-main {
    width: min(86%, 250px);
    min-height: 220px;
    padding: 22px 18px;
  }

  .about-orbit-card-main img {
    width: min(160px, 82%);
  }

  .about-floating-chip {
    min-height: 34px;
    padding: 0 12px;
    font-size: 11px;
  }

  .about-chip-one { top: 8%; left: 7%; }
  .about-chip-two { top: 8%; right: 6%; }
  .about-chip-three { bottom: 7%; left: 7%; }
  .about-chip-four { bottom: 7%; right: 6%; }

  .about-mission-grid,
  .about-route-timeline,
  .about-roles-grid,
  .about-modules-grid {
    grid-template-columns: 1fr;
  }

  .about-mission-card-wide,
  .about-roles-intro,
  .about-trust-card,
  .about-cta-card {
    padding: 22px;
    border-radius: 28px;
  }

  .about-metric-card,
  .about-route-step,
  .about-role-card,
  .about-module-card {
    padding: 20px;
    border-radius: 24px;
  }

  .about-metric-card {
    min-height: 190px;
  }

  .about-trust-list article {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   ABOUT PAGE — final visual polish for mission cards + orbit links
   Keeps changes scoped only to about.html
========================================================= */
.about-page .about-floating-chip {
  text-decoration: none;
  cursor: pointer;
  pointer-events: auto;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.about-page .about-floating-chip:hover,
.about-page .about-floating-chip:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(174, 123, 196, 0.34);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 22px 52px rgba(69, 55, 84, 0.12);
}

.about-page .about-mission-grid {
  align-items: stretch;
}

.about-page .about-metric-card {
  position: relative;
  min-height: 245px;
  padding: 26px 24px 24px;
  justify-content: flex-start;
  overflow: hidden;
}

.about-page .about-metric-card::after {
  content: "";
  position: absolute;
  right: -36px;
  bottom: -46px;
  width: 150px;
  height: 150px;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(248, 239, 251, 0.98), rgba(248, 239, 251, 0.32) 54%, transparent 70%);
  pointer-events: none;
}

.about-page .about-metric-card > span {
  margin-bottom: 38px;
  box-shadow: 0 12px 30px rgba(174, 123, 196, 0.12);
}

.about-page .about-metric-card strong {
  position: relative;
  z-index: 1;
  margin-top: 0;
  max-width: 190px;
  font-size: 22px;
}

.about-page .about-metric-card p {
  position: relative;
  z-index: 1;
  max-width: 230px;
  margin-top: 12px;
}

.about-page .about-mission-card-wide {
  min-height: 245px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (max-width: 1260px) {
  .about-page .about-metric-card,
  .about-page .about-mission-card-wide {
    min-height: 220px;
  }

  .about-page .about-metric-card > span {
    margin-bottom: 22px;
  }
}

@media (max-width: 720px) {
  .about-page .about-hero-visual {
    min-height: 360px;
  }

  .about-page .about-floating-chip {
    min-height: 36px;
    padding: 0 14px;
  }

  .about-page .about-metric-card,
  .about-page .about-mission-card-wide {
    min-height: auto;
  }

  .about-page .about-metric-card > span {
    margin-bottom: 18px;
  }
}

/* =========================================================
   About page polish: filled mission cards + clickable orbit
========================================================= */
.about-page .about-hero-visual,
.about-page .about-hero-visual::before,
.about-page .about-hero-visual::after {
  pointer-events: none;
}

.about-page .about-orbit-card-main,
.about-page .about-floating-chip {
  pointer-events: auto;
}

.about-page .about-floating-chip {
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease, background 0.24s ease;
}

.about-page .about-floating-chip:hover,
.about-page .about-floating-chip:focus-visible {
  transform: translateY(-3px);
  background: rgba(255, 255, 255, 0.98);
  border-color: rgba(188, 120, 200, 0.36);
  box-shadow: 0 22px 52px rgba(69, 55, 84, 0.13);
  outline: none;
}

.about-page .about-metric-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  min-height: 0;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 20px;
  background:
    radial-gradient(circle at 80% 10%, rgba(230, 243, 255, 0.42), transparent 34%),
    radial-gradient(circle at 16% 78%, rgba(248, 228, 255, 0.44), transparent 36%),
    rgba(255, 255, 255, 0.9);
}

.about-page .about-metric-card::after {
  content: "";
  position: absolute;
  inset: auto 18px 18px 18px;
  height: 76px;
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(248, 239, 251, 0.72), rgba(244, 249, 255, 0.62));
  opacity: 0.82;
  z-index: -1;
}

.about-page .about-metric-card-top {
  display: grid;
  gap: 12px;
}

.about-page .about-metric-card-top > span {
  display: inline-flex;
  width: 46px;
  height: 46px;
  align-items: center;
  justify-content: center;
  border-radius: 17px;
  color: var(--section-color);
  background: var(--section-color-soft);
  font-size: 13px;
  font-weight: 700;
}

.about-page .about-metric-card strong {
  margin-top: 8px;
  font-size: 22px;
  line-height: 1.18;
}

.about-page .about-metric-card p {
  margin: 0;
  font-size: 14px;
  line-height: 1.62;
}

.about-page .about-metric-details {
  margin-top: auto;
  display: grid;
  gap: 8px;
}

.about-page .about-metric-details span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  width: max-content;
  max-width: 100%;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--section-color);
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(174, 123, 196, 0.16);
  box-shadow: 0 10px 24px rgba(69, 55, 84, 0.045);
  font-size: 12px;
  line-height: 1.25;
}

.about-page .about-mission-grid {
  align-items: stretch;
}

@media (max-width: 1180px) {
  .about-page .about-mission-grid {
    grid-template-columns: minmax(0, 1fr) repeat(3, minmax(0, 0.78fr));
  }

  .about-page .about-metric-card strong {
    font-size: 20px;
  }
}

@media (max-width: 980px) {
  .about-page .about-metric-card {
    min-height: auto;
  }

  .about-page .about-metric-details {
    display: flex;
    flex-wrap: wrap;
  }
}

.about-page .about-hero-card::before,
.about-page .about-hero-card::after,
.about-page .about-mission-card::before,
.about-page .about-mission-card::after,
.about-page .about-metric-card::before,
.about-page .about-metric-card::after {
  pointer-events: none;
}

/* =========================================================
   ABOUT PAGE — normal premium mission block
   Scoped only to about.html. Fixes broken huge/empty card layout.
========================================================= */
.about-page .about-mission-section {
  padding-top: 54px;
}

.about-page .about-mission-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(360px, 0.86fr) !important;
  grid-template-areas:
    "intro metric-one"
    "intro metric-two"
    "intro metric-three" !important;
  gap: 18px !important;
  align-items: stretch !important;
}

.about-page .about-mission-card-wide {
  grid-area: intro;
  position: relative;
  min-height: 520px !important;
  padding: clamp(30px, 3.2vw, 48px) !important;
  border-radius: 38px !important;
  overflow: hidden;
  display: flex !important;
  flex-direction: column;
  justify-content: center !important;
  border: 1px solid rgba(174, 123, 196, 0.16) !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(245, 224, 252, 0.88), transparent 34%),
    radial-gradient(circle at 94% 96%, rgba(225, 241, 255, 0.82), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,0.98), rgba(252, 247, 252, 0.9)) !important;
  box-shadow: 0 24px 74px rgba(69, 55, 84, 0.075) !important;
}

.about-page .about-mission-card-wide::before {
  content: "";
  position: absolute;
  right: -72px;
  bottom: -84px;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  border: 1px solid rgba(174, 123, 196, 0.18);
  background: rgba(255, 255, 255, 0.34);
  pointer-events: none;
}

.about-page .about-mission-card-wide::after {
  content: "";
  position: absolute;
  left: 38px;
  bottom: 38px;
  width: 76px;
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(188, 120, 200, 0.72), rgba(207, 224, 247, 0.88));
  pointer-events: none;
}

.about-page .about-mission-card-wide .badge {
  position: relative;
  z-index: 1;
  width: max-content;
  max-width: 100%;
  margin-bottom: 30px !important;
}

.about-page .about-mission-card-wide h2 {
  position: relative;
  z-index: 1;
  max-width: 720px !important;
  margin: 0 !important;
  font-size: clamp(34px, 3.55vw, 58px) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.055em !important;
}

.about-page .about-mission-card-wide p {
  position: relative;
  z-index: 1;
  max-width: 640px !important;
  margin: 28px 0 42px !important;
  color: var(--text-secondary) !important;
  font-size: 16px !important;
  line-height: 1.72 !important;
}

.about-page .about-metric-card:nth-child(2) { grid-area: metric-one; }
.about-page .about-metric-card:nth-child(3) { grid-area: metric-two; }
.about-page .about-metric-card:nth-child(4) { grid-area: metric-three; }

.about-page .about-metric-card {
  position: relative;
  min-height: 0 !important;
  padding: 22px !important;
  border-radius: 30px !important;
  display: grid !important;
  grid-template-rows: 1fr auto;
  gap: 18px !important;
  overflow: hidden !important;
  isolation: isolate;
  border: 1px solid rgba(174, 123, 196, 0.15) !important;
  background:
    radial-gradient(circle at 94% 12%, rgba(225, 241, 255, 0.62), transparent 36%),
    radial-gradient(circle at 0% 100%, rgba(248, 228, 255, 0.45), transparent 38%),
    rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 18px 48px rgba(69, 55, 84, 0.055) !important;
}

.about-page .about-metric-card::before {
  content: "";
  position: absolute;
  inset: 14px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  pointer-events: none;
  z-index: -1;
}

.about-page .about-metric-card::after {
  display: none !important;
}

.about-page .about-metric-card-top {
  position: relative;
  min-height: auto !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) !important;
  grid-template-areas:
    "num title"
    "num text" !important;
  column-gap: 18px !important;
  row-gap: 8px !important;
  align-content: start !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.about-page .about-metric-card-top::after {
  display: none !important;
}

.about-page .about-metric-card-top > span {
  grid-area: num;
  align-self: start;
  justify-self: start;
  width: 50px !important;
  height: 50px !important;
  margin: 0 !important;
  border-radius: 18px !important;
  color: var(--section-color) !important;
  background: linear-gradient(145deg, rgba(248, 239, 251, 1), rgba(238, 247, 255, 0.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(174, 123, 196, 0.12), 0 12px 28px rgba(69, 55, 84, 0.055) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.about-page .about-metric-card strong {
  grid-area: title;
  margin: 2px 0 0 !important;
  max-width: none !important;
  color: var(--text-primary) !important;
  font-size: clamp(20px, 1.65vw, 26px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.034em !important;
}

.about-page .about-metric-card p {
  grid-area: text;
  max-width: 430px !important;
  margin: 0 !important;
  color: var(--text-secondary) !important;
  font-size: 13.5px !important;
  line-height: 1.58 !important;
}

.about-page .about-metric-details {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px !important;
  margin: 0 !important;
}

.about-page .about-metric-details span {
  display: inline-flex !important;
  align-items: center;
  min-height: 30px !important;
  width: auto !important;
  max-width: 100%;
  padding: 0 11px !important;
  border-radius: 999px !important;
  color: var(--section-color) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  border: 1px solid rgba(174, 123, 196, 0.14) !important;
  box-shadow: none !important;
  font-size: 11.5px !important;
  line-height: 1.2 !important;
}

@media (max-width: 1180px) {
  .about-page .about-mission-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "intro"
      "metric-one"
      "metric-two"
      "metric-three" !important;
  }

  .about-page .about-mission-card-wide {
    min-height: auto !important;
  }
}

@media (max-width: 720px) {
  .about-page .about-mission-section {
    padding-top: 30px;
  }

  .about-page .about-mission-card-wide {
    padding: 24px !important;
    border-radius: 28px !important;
  }

  .about-page .about-mission-card-wide .badge {
    margin-bottom: 20px !important;
  }

  .about-page .about-mission-card-wide h2 {
    font-size: clamp(29px, 10vw, 43px) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.04em !important;
  }

  .about-page .about-mission-card-wide p {
    margin: 20px 0 34px !important;
    font-size: 14px !important;
  }

  .about-page .about-metric-card {
    padding: 20px !important;
    border-radius: 24px !important;
  }

  .about-page .about-metric-card-top {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    column-gap: 14px !important;
  }

  .about-page .about-metric-card-top > span {
    width: 44px !important;
    height: 44px !important;
    border-radius: 16px !important;
  }

  .about-page .about-metric-card strong {
    font-size: 20px !important;
  }

  .about-page .about-metric-card p {
    font-size: 13px !important;
  }
}

/* =========================================================
   FINAL POLISH — landing + about product presentation
   Scoped to index.html and about.html only. No header about link.
========================================================= */

/* Home hero: denser, stronger hierarchy, still pastel */
.hero-section .hero-card {
  position: relative;
  overflow: hidden;
  padding: clamp(28px, 4vw, 48px) !important;
  border: 1px solid rgba(237, 221, 231, 0.92);
  background:
    radial-gradient(circle at 12% 10%, rgba(245, 224, 252, 0.54), transparent 32%),
    radial-gradient(circle at 92% 8%, rgba(225, 241, 255, 0.64), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(252, 247, 252, 0.9));
  box-shadow: 0 28px 80px rgba(69, 55, 84, 0.075);
}

.hero-section .hero-grid {
  align-items: center !important;
  gap: clamp(24px, 4vw, 54px) !important;
}

.hero-section .hero-copy h1 {
  max-width: 820px;
  margin-top: 18px;
  letter-spacing: -0.072em;
}

.hero-section .hero-lead {
  max-width: 680px;
  margin-top: 20px;
}

.hero-section .hero-actions {
  margin-top: 24px;
}

.hero-section .hero-note {
  max-width: 640px;
  margin-top: 18px;
}

.hero-section .hero-preview-final {
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 90% 4%, rgba(225, 241, 255, 0.58), transparent 34%),
    radial-gradient(circle at 12% 100%, rgba(248, 228, 255, 0.54), transparent 34%),
    rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 22px 64px rgba(69, 55, 84, 0.07) !important;
}

.home-route-card,
.index-flow-card,
.direction-card,
.specialist-card,
.review-card {
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.home-route-card:hover,
.index-flow-card:hover,
.direction-card:hover,
.specialist-card:hover,
.review-card:hover {
  transform: translateY(-4px);
  border-color: rgba(181, 123, 190, 0.24);
  box-shadow: 0 24px 58px rgba(69, 55, 84, 0.09);
}

/* Home roles + trust section */
.home-platform-section {
  padding-top: 34px;
}

.home-platform-card {
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 4vw, 46px);
  border: 1px solid rgba(237, 221, 231, 0.9);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 8% 12%, rgba(248, 228, 255, 0.58), transparent 32%),
    radial-gradient(circle at 92% 8%, rgba(225, 241, 255, 0.62), transparent 34%),
    rgba(255, 255, 255, 0.88);
  box-shadow: var(--shadow-soft);
}

.home-platform-card::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -120px;
  width: 280px;
  height: 280px;
  border-radius: 999px;
  border: 1px solid rgba(174, 123, 196, 0.12);
  background: rgba(255, 255, 255, 0.28);
  pointer-events: none;
}

.home-platform-head {
  position: relative;
  z-index: 1;
  max-width: 870px;
}

.home-platform-head .badge {
  margin-bottom: 16px;
}

.home-platform-head h2 {
  margin: 0;
  max-width: 820px;
  color: var(--text-primary);
  font-size: clamp(34px, 4.2vw, 62px);
  line-height: 1.03;
  letter-spacing: -0.066em;
}

.home-platform-head p {
  max-width: 720px;
  margin: 18px 0 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.76;
}

.home-platform-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 30px;
}

.home-platform-role-card {
  position: relative;
  min-height: 280px;
  padding: 24px;
  border: 1px solid rgba(237, 221, 231, 0.88);
  border-radius: 32px;
  background:
    radial-gradient(circle at 92% 8%, rgba(225, 241, 255, 0.48), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(252, 247, 252, 0.78));
  box-shadow: 0 18px 48px rgba(69, 55, 84, 0.055);
  overflow: hidden;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.home-platform-role-card:hover {
  transform: translateY(-5px);
  border-color: rgba(181, 123, 190, 0.24);
  box-shadow: 0 26px 64px rgba(69, 55, 84, 0.09);
}

.home-platform-role-card::after {
  content: "";
  position: absolute;
  right: -72px;
  bottom: -86px;
  width: 190px;
  height: 190px;
  border-radius: 999px;
  background: rgba(181, 123, 190, 0.075);
  pointer-events: none;
}

.home-platform-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin-bottom: 18px;
  border-radius: 18px;
  color: var(--section-color);
  background: linear-gradient(145deg, rgba(248, 239, 251, 1), rgba(238, 247, 255, 0.96));
  box-shadow: inset 0 0 0 1px rgba(174, 123, 196, 0.12), 0 12px 30px rgba(69, 55, 84, 0.055);
  font-size: 18px;
  font-weight: 900;
}

.home-platform-role-card .badge {
  margin-bottom: 16px;
}

.home-platform-role-card h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: 25px;
  line-height: 1.16;
  letter-spacing: -0.045em;
}

.home-platform-role-card p {
  margin: 14px 0 0;
  color: var(--text-secondary);
  font-size: 14.5px;
  line-height: 1.72;
}

.home-trust-strip {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 18px;
}

.home-trust-strip > div {
  min-height: 100px;
  padding: 18px 20px;
  border: 1px solid rgba(207, 224, 247, 0.86);
  border-radius: 24px;
  background: rgba(244, 249, 255, 0.68);
}

.home-trust-strip strong {
  display: block;
  color: var(--text-primary);
  font-size: 17px;
  line-height: 1.25;
}

.home-trust-strip span {
  display: block;
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: 13.5px;
  line-height: 1.55;
}

/* About: premium presentation block instead of empty tiles */
.about-page .about-hero-section {
  padding-top: 38px;
}

.about-page .about-hero-card {
  min-height: auto !important;
  padding: clamp(28px, 4vw, 48px) !important;
  border-radius: 42px !important;
}

.about-page .about-hero-copy h1 {
  max-width: 760px;
  margin-top: 18px;
  letter-spacing: -0.07em;
}

.about-page .about-hero-copy p {
  max-width: 680px;
}

.about-page .about-product-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1.05fr);
  gap: 22px;
  align-items: stretch;
  padding: clamp(24px, 3.5vw, 42px);
  border: 1px solid rgba(237, 221, 231, 0.92);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 8% 12%, rgba(248, 228, 255, 0.6), transparent 34%),
    radial-gradient(circle at 90% 6%, rgba(225, 241, 255, 0.7), transparent 35%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(252, 247, 252, 0.88));
  box-shadow: 0 28px 76px rgba(69, 55, 84, 0.075);
  overflow: hidden;
}

.about-page .about-product-card::before {
  content: "";
  position: absolute;
  left: -86px;
  bottom: -120px;
  width: 290px;
  height: 290px;
  border-radius: 999px;
  border: 1px solid rgba(174, 123, 196, 0.12);
  background: rgba(255, 255, 255, 0.32);
  pointer-events: none;
}

.about-page .about-product-copy,
.about-page .about-product-steps {
  position: relative;
  z-index: 1;
}

.about-page .about-product-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 520px;
  padding: clamp(18px, 2vw, 24px);
}

.about-page .about-product-copy .badge {
  width: max-content;
  max-width: 100%;
  margin-bottom: 18px;
}

.about-page .about-product-copy h2 {
  max-width: 720px;
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(36px, 4.6vw, 68px);
  line-height: 1.01;
  letter-spacing: -0.07em;
}

.about-page .about-product-copy p {
  max-width: 650px;
  margin: 22px 0 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.74;
}

.about-product-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

.about-product-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.about-product-proof span,
.about-product-tags span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(174, 123, 196, 0.15);
  background: rgba(255, 255, 255, 0.74);
  color: var(--section-color);
  font-size: 12px;
  line-height: 1.2;
}

.about-product-steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.about-product-step {
  position: relative;
  min-height: 158px;
  padding: 22px 22px 22px 96px;
  border: 1px solid rgba(237, 221, 231, 0.86);
  border-radius: 30px;
  background:
    radial-gradient(circle at 96% 10%, rgba(225, 241, 255, 0.56), transparent 36%),
    rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 46px rgba(69, 55, 84, 0.055);
  overflow: hidden;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.about-product-step:hover {
  transform: translateY(-4px);
  border-color: rgba(181, 123, 190, 0.24);
  box-shadow: 0 26px 62px rgba(69, 55, 84, 0.08);
}

.about-product-step-number {
  position: absolute;
  left: 22px;
  top: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 18px;
  color: var(--section-color);
  background: linear-gradient(145deg, rgba(248, 239, 251, 1), rgba(238, 247, 255, 0.96));
  font-size: 13px;
  font-weight: 800;
}

.about-product-step-icon {
  position: absolute;
  right: 18px;
  top: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: var(--section-color);
  border: 1px solid rgba(174, 123, 196, 0.15);
  background: rgba(255, 255, 255, 0.7);
}

.about-product-step h3 {
  max-width: 440px;
  margin: 0;
  color: var(--text-primary);
  font-size: 23px;
  line-height: 1.15;
  letter-spacing: -0.044em;
}

.about-product-step p {
  max-width: 540px;
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: 13.8px;
  line-height: 1.58;
}

.about-product-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.about-page .about-role-card,
.about-page .about-module-card,
.about-page .about-trust-list article,
.about-page .about-route-step {
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.about-page .about-role-card:hover,
.about-page .about-module-card:hover,
.about-page .about-trust-list article:hover,
.about-page .about-route-step:hover {
  transform: translateY(-4px);
  border-color: rgba(181, 123, 190, 0.24);
  box-shadow: 0 24px 58px rgba(69, 55, 84, 0.085);
}

@media (max-width: 1180px) {
  .about-page .about-product-card {
    grid-template-columns: 1fr;
  }

  .about-page .about-product-copy {
    min-height: auto;
  }
}

@media (max-width: 980px) {
  .hero-section .hero-card,
  .home-platform-card,
  .about-page .about-product-card {
    border-radius: 34px;
  }

  .home-platform-grid,
  .home-trust-strip {
    grid-template-columns: 1fr;
  }

  .home-platform-role-card {
    min-height: auto;
  }
}

@media (max-width: 720px) {
  .hero-section .hero-card,
  .home-platform-card,
  .about-page .about-hero-card,
  .about-page .about-product-card {
    padding: 22px !important;
    border-radius: 28px !important;
  }

  .hero-section .hero-copy h1,
  .about-page .about-hero-copy h1,
  .about-page .about-product-copy h2,
  .home-platform-head h2 {
    letter-spacing: -0.045em;
  }

  .home-platform-section {
    padding-top: 24px;
  }

  .home-platform-role-card,
  .home-trust-strip > div {
    border-radius: 24px;
  }

  .about-page .about-product-copy {
    padding: 0;
  }

  .about-page .about-product-copy h2 {
    font-size: clamp(32px, 10vw, 46px);
  }

  .about-page .about-product-actions .button {
    width: 100%;
  }

  .about-product-step {
    min-height: auto;
    padding: 20px;
  }

  .about-product-step-number {
    position: static;
    margin-bottom: 16px;
  }

  .about-product-step-icon {
    right: 16px;
    top: 16px;
  }

  .about-product-step h3 {
    padding-right: 44px;
    font-size: 21px;
  }
}

/* =========================================================
   DECK CUSTOM LIBRARY + RANDOM SESSION FLOW
   Scope: specialist-decks.html, deck-session.html only
========================================================= */
.deck-library-page .deck-add-form {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(181, 123, 190, 0.22);
  border-radius: 28px;
  background:
    radial-gradient(circle at 100% 0%, rgba(181, 123, 190, 0.12), transparent 34%),
    rgba(255, 255, 255, 0.9);
  box-shadow: 0 18px 38px rgba(69, 55, 84, 0.06);
}

.deck-library-page .deck-add-form-head {
  display: grid;
  gap: 10px;
}

.deck-library-page .deck-add-form-head h3,
.deck-library-page .deck-add-form-head p {
  margin: 0;
}

.deck-library-page .deck-add-form-head h3 {
  color: var(--text-primary);
  font-size: 20px;
  line-height: 1.25;
}

.deck-library-page .deck-add-form-head p {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.65;
}

.deck-library-page .deck-add-form label {
  display: grid;
  gap: 8px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

.deck-library-page .deck-add-form input,
.deck-library-page .deck-add-form select,
.deck-library-page .deck-add-form textarea {
  width: 100%;
  border: 1px solid var(--border-default);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.86);
  color: var(--text-primary);
  font: inherit;
  outline: none;
  padding: 13px 14px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.deck-library-page .deck-add-form input,
.deck-library-page .deck-add-form select {
  min-height: 48px;
}

.deck-library-page .deck-add-form textarea {
  min-height: 130px;
  resize: vertical;
}

.deck-library-page .deck-add-form input:focus,
.deck-library-page .deck-add-form select:focus,
.deck-library-page .deck-add-form textarea:focus {
  border-color: rgba(181, 123, 190, 0.55);
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.12);
  background: #fff;
}

.deck-library-page .deck-add-form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.deck-library-page .deck-add-form .button {
  width: 100%;
  justify-content: center;
}

.deck-library-page .deck-add-feedback {
  min-height: 44px;
  padding: 12px 14px;
  border: 1px solid rgba(104, 180, 131, 0.24);
  border-radius: 16px;
  background: rgba(233, 247, 238, 0.82);
  color: #2f7551;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.45;
}

.deck-library-page .deck-library-card-custom::before {
  background: linear-gradient(180deg, rgba(114, 161, 231, 0.54), rgba(181, 123, 190, 0.28));
}

.deck-library-page .deck-library-custom-visual {
  background:
    radial-gradient(circle at 50% 30%, rgba(114, 161, 231, 0.18), transparent 38%),
    linear-gradient(145deg, rgba(248, 239, 251, 0.96), rgba(240, 246, 255, 0.94));
}

.deck-library-page .deck-library-custom-visual span {
  color: #3b68c5;
}

.deck-workbench-page .deck-workbench-deck-option-random {
  border-color: rgba(181, 123, 190, 0.38);
  background:
    radial-gradient(circle at 96% 10%, rgba(114, 161, 231, 0.14), transparent 36%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 239, 251, 0.88));
}

.deck-workbench-page .deck-workbench-deck-option-random .deck-workbench-deck-option-mark {
  background: linear-gradient(135deg, rgba(181, 123, 190, 0.24), rgba(114, 161, 231, 0.18));
}

.deck-workbench-page .deck-workbench-deck-option-random.is-active {
  border-color: rgba(181, 123, 190, 0.58);
  box-shadow: 0 16px 36px rgba(181, 123, 190, 0.12);
}

@media (max-width: 760px) {
  .deck-library-page .deck-add-form-row {
    grid-template-columns: 1fr;
  }
}

/* MAIN HERO — align left copy to top only */
.hero-section .hero-grid {
  align-items: start !important;
}

/* DECK SESSION — make open/closed mode text real badges */
.deck-workbench-page .deck-workbench-choice[data-mode="open"] strong,
.deck-workbench-page .deck-workbench-choice[data-mode="closed"] strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 13px;
  line-height: 1;
  font-weight: 800;
  white-space: nowrap;
}

.deck-workbench-page .deck-workbench-choice[data-mode="open"] strong,
.deck-library-page .deck-library-card-badges .badge-green {
  color: #2f7551;
  background: rgba(233, 247, 238, 0.88);
  border: 1px solid rgba(104, 180, 131, 0.28);
}

.deck-workbench-page .deck-workbench-choice[data-mode="closed"] strong {
  color: #9a6a19;
  background: rgba(255, 246, 224, 0.92);
  border: 1px solid rgba(245, 158, 11, 0.24);
}

/* Deck session — backend notice must not be squeezed into a side column */
.deck-workbench-page .deck-workbench-backend-notice {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(190px, max-content) minmax(0, 1fr) !important;
  gap: 14px 24px !important;
  align-items: start !important;
  padding: 24px 28px !important;
}

.deck-workbench-page .deck-workbench-backend-notice > span,
.deck-workbench-page .deck-workbench-backend-notice > p {
  min-width: 0 !important;
  max-width: none !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  white-space: normal !important;
}

.deck-workbench-page .deck-workbench-backend-notice > p {
  line-height: 1.7 !important;
}

@media (max-width: 760px) {
  .deck-workbench-page .deck-workbench-backend-notice {
    grid-template-columns: 1fr !important;
    padding: 22px !important;
  }
}

/* DECK LIBRARY — rebuild bottom safety/backend block */
.deck-library-page .deck-library-bottom-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 22px !important;
  align-items: stretch !important;
}

.deck-library-page .deck-library-rules,
.deck-library-page .deck-library-backend-notice {
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 28px !important;
  border-radius: 30px !important;
}

.deck-library-page .deck-library-backend-notice {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 14% 8%, rgba(181, 123, 190, 0.14), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(248, 239, 251, 0.72)) !important;
}

.deck-library-page .deck-library-backend-notice > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: flex-start !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 9px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(181, 123, 190, 0.24) !important;
  background: rgba(248, 239, 251, 0.92) !important;
  color: var(--section-color) !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.deck-library-page .deck-library-backend-notice > p {
  width: 100% !important;
  max-width: 640px !important;
  margin: 0 !important;
  color: var(--text-secondary) !important;
  font-size: 16px !important;
  line-height: 1.72 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

.deck-library-page .deck-library-backend-notice > p::before {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin: 0 0 16px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(181, 123, 190, 0.68), rgba(114, 161, 231, 0.36));
}

@media (max-width: 980px) {
  .deck-library-page .deck-library-bottom-grid {
    grid-template-columns: 1fr !important;
  }
}


/* DECK LIBRARY — workflow cards, one random-session CTA and polished custom fields */
.deck-library-page .deck-library-mode-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
  gap: 18px;
  margin: 0 0 26px;
}

.deck-library-page .deck-library-mode-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 16px;
  min-height: 220px;
  padding: 24px;
  border: 1px solid rgba(237, 221, 231, 0.92);
  border-radius: 32px;
  background:
    radial-gradient(circle at 98% 92%, rgba(181, 123, 190, 0.12), transparent 30%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(255, 247, 250, 0.86));
  box-shadow: 0 22px 50px rgba(69, 55, 84, 0.07);
}

.deck-library-page .deck-library-mode-card-primary {
  background:
    radial-gradient(circle at 96% 18%, rgba(114, 161, 231, 0.16), transparent 34%),
    radial-gradient(circle at 96% 92%, rgba(181, 123, 190, 0.14), transparent 32%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(248, 239, 251, 0.90));
  border-color: rgba(181, 123, 190, 0.28);
}

.deck-library-page .deck-library-mode-index {
  display: inline-grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 18px;
  background: rgba(248, 239, 251, 0.94);
  color: var(--brand-primary);
  font-weight: 900;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.deck-library-page .deck-library-mode-copy {
  position: relative;
  z-index: 1;
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.deck-library-page .deck-library-mode-copy h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.18;
  letter-spacing: -0.04em;
}

.deck-library-page .deck-library-mode-copy p {
  max-width: 620px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.75;
}

.deck-library-page .deck-library-mode-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin-top: auto;
  padding-top: 8px;
}

.deck-library-page .deck-library-mode-actions > span {
  max-width: 360px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.55;
}

.deck-library-page .deck-library-card .specialist-workspace-card-actions {
  display: none !important;
}

.deck-library-page .deck-library-card-badges .badge,
.deck-library-page .deck-add-form .badge,
.deck-library-page .deck-library-mode-copy .badge {
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
}

.deck-library-page .deck-add-form label {
  position: relative;
}

.deck-library-page .deck-add-form input,
.deck-library-page .deck-add-form textarea,
.deck-library-page .deck-add-form .custom-select__button {
  min-height: 56px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

.deck-library-page .deck-add-form textarea {
  min-height: 142px;
}

.deck-library-page .deck-add-form select {
  display: none !important;
}

.deck-library-page .deck-add-custom-select {
  z-index: 20;
}

.deck-library-page .deck-add-custom-select.is-open {
  z-index: 90;
}

.deck-library-page .deck-add-custom-select .custom-select__button {
  min-height: 56px;
  padding: 0 20px;
  border: 1px solid rgba(237, 221, 231, 0.98);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.96);
  color: var(--text-primary);
}

.deck-library-page .deck-add-custom-select.is-open .custom-select__button,
.deck-library-page .deck-add-custom-select .custom-select__button:focus-visible {
  border-color: rgba(181, 123, 190, 0.45);
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.10);
}

.deck-library-page .deck-add-custom-select .custom-select__menu {
  z-index: 200;
  padding: 10px;
  border-radius: 24px;
  border-color: rgba(237, 221, 231, 0.98);
  background: rgba(255, 255, 255, 0.985);
  box-shadow: 0 22px 56px rgba(69, 55, 84, 0.13);
}

.deck-library-page .deck-add-custom-select .custom-select__option {
  min-height: 46px;
  border-radius: 16px;
  padding: 11px 14px;
  font-weight: 700;
}

.deck-library-page .deck-add-custom-select .custom-select__option:hover,
.deck-library-page .deck-add-custom-select .custom-select__option.is-selected {
  background: rgba(248, 239, 251, 0.96);
  color: var(--brand-primary);
}

.deck-library-page .deck-add-custom-field:focus-within {
  z-index: 100;
}

@media (max-width: 1100px) {
  .deck-library-page .deck-library-mode-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .deck-library-page .deck-library-mode-card {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .deck-library-page .deck-library-mode-actions .button {
    width: 100%;
    justify-content: center;
  }
}


/* VRO backend step: client requests API state */
.client-requests-backend-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 20px 0 18px;
  padding: 18px 20px;
  border: 1px solid rgba(196, 145, 165, 0.26);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255, 246, 250, 0.94), rgba(247, 251, 255, 0.9));
  box-shadow: 0 16px 42px rgba(160, 116, 137, 0.08);
}

.client-requests-backend-state strong {
  display: block;
  margin-bottom: 6px;
  color: var(--color-ink, #3f3941);
  font-size: 16px;
}

.client-requests-backend-state p {
  margin: 0;
  color: var(--color-muted, #7b717b);
  line-height: 1.55;
}

.client-requests-backend-state[data-state="success"] {
  border-color: rgba(129, 184, 152, 0.32);
}

.client-requests-backend-state[data-state="error"] {
  border-color: rgba(202, 105, 127, 0.34);
  background: linear-gradient(135deg, rgba(255, 244, 247, 0.96), rgba(255, 250, 252, 0.92));
}

.client-requests-backend-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.client-request-card.is-backend-card {
  animation: vroBackendCardIn 0.32s ease both;
}

@keyframes vroBackendCardIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 700px) {
  .client-requests-backend-state {
    align-items: flex-start;
    flex-direction: column;
  }

  .client-requests-backend-actions {
    justify-content: flex-start;
  }
}

/* VRO backend step: client request detail API state */
.client-request-detail-backend-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 8px 0 18px;
  padding: 20px 22px;
  border: 1px solid rgba(196, 145, 165, 0.26);
  border-radius: 26px;
  background: linear-gradient(135deg, rgba(255, 246, 250, 0.96), rgba(247, 251, 255, 0.92));
  box-shadow: 0 16px 42px rgba(160, 116, 137, 0.08);
}

.client-request-detail-backend-state strong {
  display: block;
  margin-bottom: 6px;
  color: var(--color-ink, #3f3941);
  font-size: 17px;
}

.client-request-detail-backend-state p {
  margin: 0;
  color: var(--color-muted, #7b717b);
  line-height: 1.55;
}

.client-request-detail-backend-state[data-state="success"] {
  border-color: rgba(129, 184, 152, 0.32);
}

.client-request-detail-backend-state[data-state="error"] {
  border-color: rgba(202, 105, 127, 0.34);
  background: linear-gradient(135deg, rgba(255, 244, 247, 0.96), rgba(255, 250, 252, 0.92));
}

.client-request-detail-backend-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.client-request-detail-mini-dl {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.client-request-detail-mini-dl > div {
  display: grid;
  gap: 5px;
  padding: 14px 16px;
  border: 1px solid rgba(196, 145, 165, 0.18);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.58);
}

.client-request-detail-mini-dl span {
  color: var(--color-muted, #7b717b);
  font-size: 13px;
}

.client-request-detail-mini-dl strong {
  color: var(--color-ink, #3f3941);
  line-height: 1.35;
}

.client-request-timeline small {
  display: block;
  margin-top: 5px;
  color: var(--color-muted, #7b717b);
  font-size: 12px;
  line-height: 1.45;
}

.client-request-detail-inline-state {
  margin-top: 16px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(129, 184, 152, 0.28);
  background: rgba(247, 255, 250, 0.8);
  color: var(--color-ink, #3f3941);
  font-weight: 700;
}

.client-request-detail-inline-state[data-state="error"] {
  border-color: rgba(202, 105, 127, 0.34);
  background: rgba(255, 244, 247, 0.86);
}

@media (max-width: 700px) {
  .client-request-detail-backend-state {
    align-items: flex-start;
    flex-direction: column;
  }

  .client-request-detail-backend-actions {
    justify-content: flex-start;
  }
}

/* VRO backend step: specialist requests API state */
.specialist-requests-backend-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 18px 0 20px;
  padding: 18px 20px;
  border: 1px solid rgba(196, 145, 165, 0.26);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255, 246, 250, 0.94), rgba(247, 251, 255, 0.9));
  box-shadow: 0 16px 42px rgba(160, 116, 137, 0.08);
}

.specialist-requests-backend-state strong {
  display: block;
  margin-bottom: 6px;
  color: var(--color-ink, #3f3941);
  font-size: 16px;
}

.specialist-requests-backend-state p {
  margin: 0;
  color: var(--color-muted, #7b717b);
  line-height: 1.55;
}

.specialist-requests-backend-state[data-state="success"] {
  border-color: rgba(129, 184, 152, 0.32);
}

.specialist-requests-backend-state[data-state="error"] {
  border-color: rgba(202, 105, 127, 0.34);
  background: linear-gradient(135deg, rgba(255, 244, 247, 0.96), rgba(255, 250, 252, 0.92));
}

.specialist-requests-backend-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.specialist-request-card.is-backend-card {
  animation: vroBackendSpecialistCardIn 0.32s ease both;
}

@keyframes vroBackendSpecialistCardIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 700px) {
  .specialist-requests-backend-state {
    align-items: flex-start;
    flex-direction: column;
  }

  .specialist-requests-backend-actions {
    justify-content: flex-start;
  }
}

/* =========================================================
   Backend connection patch: specialist request detail
   Scoped only to specialist-request-detail.html
========================================================= */
.specialist-request-detail-page .vro-detail-notice {
  width: min(1120px, calc(100% - 32px));
  margin: 18px auto 0;
  padding: 18px 20px;
  border: 1px solid rgba(188, 121, 196, 0.22);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 18px 50px rgba(103, 69, 119, 0.08);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.specialist-request-detail-page .vro-detail-notice__copy {
  display: grid;
  gap: 6px;
  color: var(--text-muted, #8a7897);
}

.specialist-request-detail-page .vro-detail-notice__copy strong {
  color: var(--text-main, #3f3150);
  font-size: 1rem;
}

.specialist-request-detail-page .vro-detail-notice__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.specialist-request-detail-page .vro-detail-notice--success {
  border-color: rgba(133, 197, 151, 0.35);
  background: linear-gradient(135deg, rgba(247, 255, 249, 0.95), rgba(255, 255, 255, 0.86));
}

.specialist-request-detail-page .vro-detail-notice--error,
.specialist-request-detail-page .vro-detail-notice--auth {
  border-color: rgba(225, 143, 196, 0.36);
  background: linear-gradient(135deg, rgba(255, 247, 252, 0.96), rgba(255, 255, 255, 0.86));
}

.specialist-request-detail-page .vro-detail-notice--loading {
  border-color: rgba(158, 183, 226, 0.36);
  background: linear-gradient(135deg, rgba(247, 250, 255, 0.96), rgba(255, 255, 255, 0.86));
}

@media (max-width: 720px) {
  .specialist-request-detail-page .vro-detail-notice {
    align-items: flex-start;
    flex-direction: column;
  }

  .specialist-request-detail-page .vro-detail-notice__actions {
    justify-content: flex-start;
  }
}


/* =========================================================
   V Resurse Ok — backend admin queue patch
   Scoped only to admin.html dynamic backend states.
========================================================= */
.admin-backend-state {
  display: grid;
  gap: 12px;
  padding: 22px;
  border: 1px solid rgba(181, 123, 190, 0.18);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 246, 250, 0.86));
  box-shadow: 0 18px 46px rgba(78, 46, 83, 0.07);
}

.admin-backend-state strong {
  color: #4d3c56;
  font-size: 1.02rem;
}

.admin-backend-state p {
  margin: 0;
  color: #8d7d99;
  line-height: 1.6;
}

.admin-backend-state-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.admin-audit-mini {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(181, 123, 190, 0.14);
}

.admin-audit-mini h3 {
  margin: 0 0 10px;
  color: #4d3c56;
  font-size: 0.98rem;
}

.admin-audit-mini ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.admin-audit-mini li {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border: 1px solid rgba(181, 123, 190, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.66);
}

.admin-audit-mini li strong {
  color: #5c4868;
  font-size: 0.82rem;
}

.admin-audit-mini li span,
.admin-audit-mini p {
  margin: 0;
  color: #9a8aa5;
  font-size: 0.78rem;
}

.admin-card-actions .button:disabled {
  cursor: progress;
  opacity: 0.62;
}

/* =========================================================
   Backend public Q&A connection — scoped additions
   Added for questions.html / question-detail.html API rendering
========================================================= */
.question-full-card--backend-state {
  display: grid;
  gap: 18px;
  border-style: dashed;
}

.question-full-card--backend-state[data-state="loading"] {
  opacity: .86;
}

.question-full-card--backend-state[data-state="error"] {
  border-color: rgba(209, 105, 127, .38);
  background: linear-gradient(135deg, rgba(255, 246, 248, .96), rgba(255, 255, 255, .96));
}

.question-full-card--backend .question-answer--waiting {
  background: linear-gradient(135deg, rgba(247, 239, 250, .72), rgba(255, 255, 255, .92));
}

.question-detail-v2-related-card {
  min-height: 100%;
}

/* =========================================================
   Admin dev cleanup tools — backend delete controls
========================================================= */
.admin-cleanup-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 18px 0 22px;
  padding: 16px 18px;
  border: 1px solid rgba(188, 127, 204, 0.24);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255, 246, 251, 0.92), rgba(246, 238, 255, 0.72));
  box-shadow: 0 14px 34px rgba(90, 53, 98, 0.07);
}

.admin-cleanup-copy {
  min-width: 0;
}

.admin-cleanup-copy strong {
  display: block;
  margin-bottom: 4px;
  color: #4b3557;
  font-size: 15px;
  font-weight: 700;
}

.admin-cleanup-copy p {
  margin: 0;
  color: #957ca3;
  font-size: 14px;
  line-height: 1.45;
}

.admin-cleanup-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.button.button-danger,
.admin-cleanup-actions .button-danger {
  border-color: rgba(218, 104, 138, 0.35);
  color: #b34d72;
  background: rgba(255, 244, 248, 0.95);
}

.button.button-danger:hover,
.admin-cleanup-actions .button-danger:hover {
  border-color: rgba(190, 72, 112, 0.58);
  color: #8f3156;
  background: rgba(255, 235, 243, 0.98);
}

@media (max-width: 760px) {
  .admin-cleanup-panel {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-cleanup-actions {
    justify-content: flex-start;
  }

  .admin-cleanup-actions .button {
    width: 100%;
  }
}


/* =========================================================
   V Resurse Ok — backend blog MVP patch
   Scoped helpers for backend-connected blog/admin states.
========================================================= */

.vro-dev-auth-card {
  border: 1px solid rgba(201, 122, 205, 0.24);
  background: linear-gradient(135deg, rgba(255, 247, 252, 0.96), rgba(247, 253, 255, 0.94));
}

.specialist-blog-editor-notice.is-success,
.specialist-blog-editor-notice.is-error {
  display: block;
  margin-top: 12px;
  padding: 14px 16px;
  border-radius: 18px;
  font-size: 14px;
  line-height: 1.6;
}

.specialist-blog-editor-notice.is-success {
  border: 1px solid rgba(188, 105, 194, 0.24);
  background: rgba(252, 242, 255, 0.88);
  color: #6f3f78;
}

.specialist-blog-editor-notice.is-error {
  border: 1px solid rgba(218, 93, 112, 0.28);
  background: rgba(255, 241, 244, 0.92);
  color: #8b3340;
}

.specialist-blog-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

.specialist-blog-detail-side-status {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.specialist-blog-detail-side-status span {
  display: inline-flex;
  width: fit-content;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(201, 122, 205, 0.22);
  background: rgba(255, 248, 252, 0.86);
  color: #7f638a;
  font-size: 13px;
}

.blog-public-post-card h3 {
  line-height: 1.35;
}

.blog-public-post-card p {
  line-height: 1.65;
}

/* =========================================================
   Backend reviews connection patch
   Scope: client-request-detail.html, specialist-reviews.html, admin-review-moderation.html
========================================================= */
.client-request-review-card form,
.client-request-review-form {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.client-request-review-form label {
  display: grid;
  gap: 8px;
  font-weight: 700;
  color: var(--color-ink, #4b3946);
}

.client-request-review-form select,
.client-request-review-form textarea {
  width: 100%;
  border: 1px solid rgba(131, 91, 107, 0.22);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.82);
  padding: 14px 16px;
  font: inherit;
  color: var(--color-ink, #4b3946);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.client-request-review-form textarea {
  resize: vertical;
  min-height: 118px;
}

.client-request-review-card.is-muted {
  opacity: 0.82;
}

.client-request-detail-inline-state[data-state="success"],
.client-request-detail-inline-state[data-state="loading"],
.client-request-detail-inline-state[data-state="error"] {
  margin-top: 12px;
  border-radius: 18px;
  padding: 12px 14px;
  font-weight: 700;
}

.client-request-detail-inline-state[data-state="success"] {
  background: rgba(117, 178, 132, 0.18);
  color: #3f744e;
}

.client-request-detail-inline-state[data-state="loading"] {
  background: rgba(188, 154, 112, 0.16);
  color: #7a5b32;
}

.client-request-detail-inline-state[data-state="error"] {
  background: rgba(199, 98, 98, 0.14);
  color: #9a4545;
}

.specialist-reviews-backend-state,
.specialist-reviews-hero-connected {
  position: relative;
  overflow: hidden;
}

.specialist-reviews-actions {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.specialist-review-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 24px;
}

.specialist-review-stats-grid div,
.specialist-reviews-note,
.specialist-reviews-empty,
.specialist-review-backend-card {
  border: 1px solid rgba(131, 91, 107, 0.16);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 18px 50px rgba(91, 64, 77, 0.08);
}

.specialist-review-stats-grid div {
  padding: 18px;
  display: grid;
  gap: 4px;
}

.specialist-review-stats-grid strong {
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  line-height: 1;
}

.specialist-review-stats-grid span,
.specialist-review-backend-card dt {
  color: rgba(75, 57, 70, 0.68);
  font-size: 0.88rem;
}

.specialist-reviews-note,
.specialist-reviews-empty {
  padding: 18px 20px;
  margin-bottom: 18px;
}

.specialist-reviews-backend-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.specialist-review-backend-card {
  padding: 22px;
  display: grid;
  gap: 16px;
}

.specialist-review-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.specialist-review-status {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 0.82rem;
  font-weight: 800;
}

.specialist-review-status.is-published {
  background: rgba(117, 178, 132, 0.18);
  color: #3f744e;
}

.specialist-review-status.is-moderation {
  background: rgba(188, 154, 112, 0.16);
  color: #7a5b32;
}

.specialist-review-status.is-hidden,
.specialist-review-status.is-rejected {
  background: rgba(199, 98, 98, 0.12);
  color: #9a4545;
}

.specialist-review-backend-card p {
  margin: 0;
  line-height: 1.75;
}

.specialist-review-backend-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.specialist-review-backend-card div:has(> dt) {
  border-radius: 18px;
  background: rgba(255, 246, 249, 0.72);
  padding: 12px;
}

.specialist-review-backend-card dt,
.specialist-review-backend-card dd {
  margin: 0;
}

.specialist-review-backend-card dd {
  font-weight: 800;
}

@media (max-width: 760px) {
  .specialist-review-stats-grid,
  .specialist-reviews-backend-grid,
  .specialist-review-backend-card dl {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   Client cabinet — static HTML version
   No full-page JS replacement. JS only fills backend data.
========================================================= */
.client-cabinet-page {
  background:
    radial-gradient(circle at 14% 8%, rgba(174, 123, 196, 0.08), transparent 34%),
    radial-gradient(circle at 88% 12%, rgba(199, 223, 240, 0.14), transparent 34%);
}

.client-cabinet-hero-section {
  padding-top: 56px;
}

.client-cabinet-hero-card,
.client-cabinet-panel,
.client-cabinet-stat-card {
  border: 1px solid var(--border-default);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: var(--shadow-soft);
}

.client-cabinet-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 28px;
  align-items: stretch;
  border-radius: 34px;
  padding: clamp(24px, 4vw, 42px);
}

.client-cabinet-hero-copy h1 {
  max-width: 760px;
  margin: 20px 0 14px;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.05;
  letter-spacing: -0.035em;
  color: var(--text-primary);
}

.client-cabinet-hero-copy p {
  max-width: 760px;
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.75;
  font-size: 17px;
}

.client-cabinet-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.client-cabinet-profile-card {
  display: grid;
  align-content: start;
  gap: 16px;
  border: 1px solid rgba(174, 123, 196, 0.14);
  border-radius: 28px;
  background: rgba(255, 247, 250, 0.78);
  padding: 22px;
}

.client-cabinet-avatar {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: linear-gradient(135deg, var(--brand-primary), var(--brand-soft-blue));
  color: #ffffff;
  font-weight: 900;
  box-shadow: 0 14px 28px rgba(174, 123, 196, 0.16);
}

.client-cabinet-profile-card h2 {
  margin: 10px 0 4px;
  font-size: 22px;
  color: var(--text-primary);
}

.client-cabinet-profile-card p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.client-cabinet-profile-meta {
  display: grid;
  gap: 10px;
  margin: 0;
}

.client-cabinet-profile-meta div,
.client-cabinet-request-meta div {
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
  padding: 12px;
}

.client-cabinet-profile-meta dt,
.client-cabinet-profile-meta dd,
.client-cabinet-request-meta dt,
.client-cabinet-request-meta dd {
  margin: 0;
}

.client-cabinet-profile-meta dt,
.client-cabinet-request-meta dt {
  color: var(--text-secondary);
  font-size: 12px;
  margin-bottom: 5px;
}

.client-cabinet-profile-meta dd,
.client-cabinet-request-meta dd {
  color: var(--text-primary);
  font-weight: 800;
}

.client-cabinet-stats-section {
  padding-top: 24px;
}

.client-cabinet-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.client-cabinet-stat-card {
  border-radius: 28px;
  padding: 20px;
}

.client-cabinet-stat-card span {
  display: block;
  color: var(--brand-primary);
  font-weight: 800;
  line-height: 1.45;
  margin-bottom: 8px;
}

.client-cabinet-stat-card strong {
  display: block;
  color: var(--text-primary);
  font-size: 34px;
  line-height: 1;
}

.client-cabinet-main-section {
  padding-top: 28px;
}

.client-cabinet-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 20px;
  align-items: start;
}

.client-cabinet-panel {
  border-radius: 30px;
  padding: clamp(20px, 3vw, 28px);
}

.client-cabinet-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.client-cabinet-panel-head-column {
  display: grid;
  justify-content: stretch;
  gap: 10px;
}

.client-cabinet-panel-head h2 {
  margin: 12px 0 8px;
  color: var(--text-primary);
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.15;
}

.client-cabinet-panel-head p {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.65;
}

.client-cabinet-request-list,
.client-cabinet-shortcuts {
  display: grid;
  gap: 14px;
}

.client-cabinet-request-card,
.client-cabinet-empty-card,
.client-cabinet-shortcut {
  border: 1px solid rgba(174, 123, 196, 0.14);
  border-radius: 24px;
  background: rgba(255, 247, 250, 0.64);
}

.client-cabinet-request-card,
.client-cabinet-empty-card {
  padding: 18px;
}

.client-cabinet-request-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.client-cabinet-request-card h3,
.client-cabinet-empty-card h3 {
  margin: 10px 0 0;
  color: var(--text-primary);
  font-size: 20px;
}

.client-cabinet-request-card p,
.client-cabinet-empty-card p {
  color: var(--text-secondary);
  line-height: 1.65;
}

.client-cabinet-request-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0 0;
}

.client-cabinet-shortcut {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  padding: 16px;
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.client-cabinet-shortcut:hover {
  transform: translateY(-1px);
  background: rgba(248, 239, 251, 0.86);
  border-color: rgba(174, 123, 196, 0.24);
}

.client-cabinet-shortcut span {
  grid-row: span 2;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: var(--section-color-soft);
  color: var(--section-color);
  font-weight: 900;
}

.client-cabinet-shortcut strong {
  color: var(--text-primary);
}

.client-cabinet-shortcut small {
  color: var(--text-secondary);
  line-height: 1.55;
}

.client-cabinet-empty-card.is-error {
  background: rgba(239, 68, 68, 0.08);
  border-color: rgba(239, 68, 68, 0.16);
}

@media (max-width: 980px) {
  .client-cabinet-hero-card,
  .client-cabinet-layout {
    grid-template-columns: 1fr;
  }

  .client-cabinet-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .client-cabinet-actions,
  .client-cabinet-panel-head,
  .client-cabinet-request-top {
    flex-direction: column;
    align-items: stretch;
  }

  .client-cabinet-stats-grid,
  .client-cabinet-request-meta {
    grid-template-columns: 1fr;
  }

  .client-cabinet-shortcut {
    grid-template-columns: 1fr;
  }
}


/* Notification bell alignment fix */
.utility-actions {
  gap: 12px;
  justify-content: flex-end;
  flex: 0 0 auto;
}

.utility-actions .notification-host {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

.utility-actions .notification-host[hidden] {
  display: none !important;
}

.utility-actions .notification-chip {
  vertical-align: middle;
}

.utility-actions .account-chip {
  margin: 0;
}


/* =========================================================
   Notifications page — stable styles
   ========================================================= */
.notifications-page {
  min-height: 60vh;
}

.notifications-page-section {
  padding: 56px 0 88px;
}

.notifications-page-card {
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 10% 10%, rgba(201, 122, 205, 0.10), transparent 30%),
    rgba(255, 255, 255, 0.84);
  padding: clamp(24px, 4vw, 42px);
  box-shadow: var(--shadow-soft);
}

.notifications-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 26px;
}

.notifications-page-head h1 {
  margin: 14px 0 0;
  color: var(--text-primary);
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.06;
  letter-spacing: -0.04em;
}

.notifications-page-head p {
  max-width: 720px;
  margin: 16px 0 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.7;
}

.notifications-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 20px;
}

.notifications-filter,
.notifications-action-btn {
  min-height: 40px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.78);
  color: var(--text-secondary);
  padding: 0 16px;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.notifications-filter:hover,
.notifications-action-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(181, 123, 190, 0.38);
  background: rgba(248, 238, 244, 0.92);
}

.notifications-action-btn:disabled {
  opacity: 0.55;
  cursor: default;
  transform: none;
}

.notifications-action-danger {
  color: #b34a6a;
  border-color: rgba(227, 122, 150, 0.24);
}

.notifications-action-danger:hover {
  border-color: rgba(227, 122, 150, 0.38);
  background: rgba(255, 241, 245, 0.95);
}

.notifications-filter.is-active {
  color: var(--brand-primary);
  background: var(--section-color-soft);
  border-color: rgba(181, 123, 190, 0.36);
}

.notifications-actions-spacer {
  flex: 1;
}

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

.notifications-item {
  display: grid;
  gap: 10px;
  padding: 18px;
  border: 1px solid rgba(201, 122, 205, 0.14);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.86);
}

.notifications-item.is-unread {
  border-color: rgba(201, 122, 205, 0.28);
  background:
    radial-gradient(circle at 10% 10%, rgba(145, 211, 231, 0.12), transparent 32%),
    rgba(255, 248, 252, 0.92);
}

.notifications-item-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.notifications-item-title {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.notifications-dot {
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  border-radius: 50%;
  background: #c875ce;
  box-shadow: 0 0 0 5px rgba(201, 122, 205, 0.12);
}

.notifications-item:not(.is-unread) .notifications-dot {
  opacity: 0.35;
}

.notifications-item-title strong {
  color: var(--text-primary);
  line-height: 1.4;
}

.notifications-date {
  color: var(--text-secondary);
  font-size: 12px;
  white-space: nowrap;
}

.notifications-body {
  margin: 0;
  color: var(--text-secondary);
  line-height: 1.6;
}

.notifications-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.notifications-empty {
  padding: 28px;
  border: 1px dashed rgba(201, 122, 205, 0.24);
  border-radius: 24px;
  color: var(--text-secondary);
  text-align: center;
  background: rgba(255, 255, 255, 0.64);
}

@media (max-width: 760px) {
  .notifications-page-section {
    padding: 32px 0 64px;
  }

  .notifications-page-card {
    padding: 20px;
    border-radius: 26px;
  }

  .notifications-page-head {
    display: grid;
    margin-bottom: 20px;
  }

  .notifications-page-head h1 {
    font-size: 34px;
  }

  .notifications-actions-spacer {
    display: none;
  }

  .notifications-action-btn,
  .notifications-filter {
    width: 100%;
  }

  .notifications-item {
    padding: 15px;
  }

  .notifications-item-top {
    display: grid;
  }

  .notifications-item-actions .button {
    width: 100%;
  }
}

/* =========================================================
   Notifications dropdown + mobile menu link — stable styles
   ========================================================= */
.notification-host {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.notification-host[hidden],
.notification-chip[hidden],
[data-notification-mobile-link][hidden] {
  display: none !important;
}

.notification-chip {
  position: relative;
  min-width: 42px;
  height: 38px;
  border: 1px solid rgba(201, 122, 205, 0.24);
  border-radius: 999px;
  background:
    radial-gradient(circle at 16% 18%, rgba(255, 255, 255, 0.88), transparent 38%),
    linear-gradient(135deg, rgba(255, 246, 253, 0.98), rgba(246, 229, 250, 0.94));
  color: #8c5c98;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  font: inherit;
  box-shadow: 0 12px 28px rgba(126, 88, 132, 0.08);
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.notification-chip:hover {
  transform: translateY(-1px);
  border-color: rgba(201, 122, 205, 0.38);
}

.notification-chip svg {
  width: 18px;
  height: 18px;
  display: block;
}

.notification-count {
  position: absolute;
  right: -5px;
  top: -6px;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 999px;
  display: none;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #c55fc4, #e08bce);
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  border: 2px solid #ffffff;
  box-sizing: border-box;
}

.notification-count.is-visible {
  display: inline-flex;
}

.notification-dropdown {
  position: fixed;
  z-index: 10020;
  width: min(380px, calc(100vw - 24px));
  border: 1px solid rgba(201, 122, 205, 0.18);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 24px 70px rgba(81, 55, 88, 0.18);
  overflow: hidden;
  animation: notificationMenuIn 0.16s ease-out both;
}

.notification-dropdown[hidden] {
  display: none !important;
}

@keyframes notificationMenuIn {
  from {
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.notification-dropdown-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px 10px;
  background:
    radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.72), transparent 34%),
    linear-gradient(135deg, rgba(255, 246, 253, 0.96), rgba(244, 235, 249, 0.90));
  border-bottom: 1px solid rgba(201, 122, 205, 0.12);
}

.notification-dropdown-title {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.notification-dropdown-title strong {
  color: #44364f;
  font-size: 15px;
}

.notification-dropdown-title span {
  color: #9b7fa1;
  font-size: 12px;
}

.notification-dropdown-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.notification-read-all,
.notification-clear-all,
.notification-all-link {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border: 1px solid rgba(201, 122, 205, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.76);
  color: #8c5c98;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 0.16s ease, background 0.16s ease;
}


.notification-clear-all {
  color: #b34a6a;
  border-color: rgba(227, 122, 150, 0.22);
}

.notification-clear-all:hover {
  background: rgba(255, 241, 245, 0.95);
}

.notification-read-all:hover,
.notification-clear-all:hover,
.notification-all-link:hover {
  background: rgba(249, 238, 250, 0.92);
  transform: translateY(-1px);
}

.notification-read-all:disabled,
.notification-clear-all:disabled {
  opacity: 0.55;
  cursor: default;
  transform: none;
}

.notification-list {
  max-height: min(440px, 62vh);
  overflow: auto;
  padding: 8px;
  display: grid;
  gap: 8px;
}

.notification-item {
  position: relative;
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 20px;
  border: 1px solid rgba(201, 122, 205, 0.12);
  background: rgba(255, 248, 252, 0.64);
}

.notification-item.is-unread {
  background:
    radial-gradient(circle at 12% 10%, rgba(145, 211, 231, 0.15), transparent 34%),
    rgba(255, 248, 252, 0.88);
  border-color: rgba(201, 122, 205, 0.22);
}

.notification-item-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.notification-item-title {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.notification-dot {
  flex: 0 0 9px;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #c875ce;
  box-shadow: 0 0 0 4px rgba(201, 122, 205, 0.12);
}

.notification-item:not(.is-unread) .notification-dot {
  opacity: 0.28;
}

.notification-item-title strong {
  color: #44364f;
  font-size: 14px;
  line-height: 1.35;
}

.notification-date {
  color: #a08aa5;
  font-size: 11px;
  white-space: nowrap;
}

.notification-body {
  color: #7e6b84;
  line-height: 1.5;
  font-size: 13px;
  margin: 0 0 0 17px;
}

.notification-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: 17px;
}

.notification-action {
  border: 1px solid rgba(201, 122, 205, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: #8c5c98;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 7px 10px;
  text-decoration: none;
  cursor: pointer;
}

.notification-action:hover {
  background: rgba(249, 238, 250, 0.92);
}

.notification-empty,
.notification-error {
  padding: 18px;
  border-radius: 20px;
  background: rgba(255, 248, 252, 0.68);
  color: #806f86;
  line-height: 1.5;
}

.notification-error {
  color: #984247;
  background: rgba(199, 98, 98, 0.10);
}

@media (max-width: 980px) {
  .mobile-menu-notifications {
    position: relative;
  }

  .mobile-menu-notifications .mobile-menu-notification-count {
    margin-left: auto;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    display: none;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #c55fc4, #e08bce);
    color: #ffffff;
    font-size: 12px;
    font-weight: 900;
    box-shadow: 0 8px 18px rgba(197, 95, 196, 0.18);
  }

  .mobile-menu-notifications .mobile-menu-notification-count.is-visible {
    display: inline-flex;
  }
}

@media (max-width: 560px) {
  .notification-dropdown {
    border-radius: 22px;
  }

  .notification-dropdown-head {
    display: grid;
  }

  .notification-dropdown-head-actions,
  .notification-read-all,
  .notification-clear-all,
  .notification-all-link,
  .notification-actions .notification-action {
    width: 100%;
  }

  .notification-item-top {
    display: grid;
  }

  .notification-body,
  .notification-actions {
    margin-left: 0;
  }
}

/* VRO patch — backend state for admin specialist application detail */
.admin-application-backend-state {
  margin-top: 16px;
  border-radius: 22px;
  padding: 14px 16px;
  font-weight: 800;
  line-height: 1.55;
  border: 1px solid rgba(201, 122, 205, .16);
  background: rgba(255, 255, 255, .72);
  color: var(--text-muted, #806f86);
}

.admin-application-backend-state[data-state="loading"] {
  background: rgba(188, 154, 112, .14);
  border-color: rgba(188, 154, 112, .2);
  color: #80603a;
}

.admin-application-backend-state[data-state="success"] {
  background: rgba(117, 178, 132, .15);
  border-color: rgba(117, 178, 132, .22);
  color: #3f744e;
}

.admin-application-backend-state[data-state="error"] {
  background: rgba(199, 98, 98, .12);
  border-color: rgba(199, 98, 98, .2);
  color: #984247;
}

.admin-application-backend-state[data-state="empty"] {
  background: rgba(145, 211, 231, .14);
  border-color: rgba(145, 211, 231, .24);
  color: #527988;
}

.admin-document-row .admin-document-action:disabled {
  opacity: .62;
  cursor: default;
}

/* ===== Admin specialist documents backend view ===== */
.admin-document-group-title {
  margin: 14px 0 8px;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 18px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.admin-document-row-file .admin-document-action {
  text-decoration: none;
}

/* specialist-request-detail.html: backend save button for private specialist notes */
.specialist-request-notes-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.specialist-request-notes-actions .button {
  min-width: 170px;
}

@media (max-width: 640px) {
  .specialist-request-notes-actions {
    justify-content: stretch;
  }

  .specialist-request-notes-actions .button {
    width: 100%;
  }
}

/* Client request dialog */
.client-request-dialog-card {
  display: grid;
  gap: 18px;
}

.client-request-dialog-list {
  display: grid;
  gap: 12px;
}

.client-request-dialog-message {
  max-width: 88%;
  padding: 14px 16px;
  border: 1px solid var(--stroke);
  border-radius: 22px;
  background: var(--surface-soft);
}

.client-request-dialog-message--client {
  justify-self: end;
  background: var(--primary-pale);
  border-color: rgba(181, 123, 190, 0.32);
}

.client-request-dialog-message--specialist {
  justify-self: start;
  background: var(--surface);
}

.client-request-dialog-message span,
.client-request-dialog-form span {
  display: block;
  margin-bottom: 8px;
  color: var(--text-soft);
  font-size: 14px;
}

.client-request-dialog-message p,
.client-request-dialog-empty {
  margin: 0;
  color: var(--text);
  line-height: 1.55;
}

.client-request-dialog-form {
  display: grid;
  gap: 14px;
  padding-top: 4px;
}

.client-request-dialog-form label {
  display: grid;
  gap: 8px;
}

.client-request-dialog-form textarea {
  width: 100%;
  min-height: 120px;
  resize: vertical;
  border: 1px solid var(--stroke);
  border-radius: 22px;
  padding: 16px 18px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  outline: none;
}

.client-request-dialog-form textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.12);
}

.client-request-dialog-form .button {
  justify-self: start;
}

@media (max-width: 768px) {
  .client-request-dialog-message {
    max-width: 100%;
  }

  .client-request-dialog-form .button {
    width: 100%;
  }
}


/* VRO support backend state */
.support-form-notice[data-state="loading"] {
  border-color: rgba(92, 112, 255, 0.28);
}
.support-form-notice[data-state="success"] {
  border-color: rgba(66, 160, 115, 0.32);
}
.support-form-notice[data-state="error"] {
  border-color: rgba(190, 75, 75, 0.34);
}
.support-form-card button[disabled] {
  opacity: 0.7;
  cursor: wait;
}

/* =========================================================
   Admin queue empty-state hard fix
   Keeps “Черга порожня” hidden whenever JS says it is hidden.
========================================================= */
.admin-empty-state[hidden],
[hidden].admin-empty-state,
.admin-empty-state[aria-hidden="true"] {
  display: none !important;
}

.admin-card-list [data-admin-card][hidden] {
  display: none !important;
}

/* VRO support history patch */
.support-my-tickets-section {
  padding-top: 0;
}

.support-my-tickets-card {
  border: 1px solid rgba(190, 126, 202, 0.24);
  border-radius: 32px;
  padding: clamp(22px, 4vw, 34px);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(250, 242, 252, 0.78));
  box-shadow: 0 22px 70px rgba(78, 41, 94, 0.08);
}

.support-my-tickets-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}

.support-my-tickets-head h2 {
  margin: 10px 0 8px;
  color: var(--violet-deep, #2d2144);
}

.support-my-tickets-head p {
  margin: 0;
  max-width: 720px;
  color: var(--muted, #9b83a8);
  line-height: 1.6;
}

.support-my-tickets-list {
  display: grid;
  gap: 14px;
}

.support-my-empty {
  border: 1px dashed rgba(190, 126, 202, 0.32);
  border-radius: 24px;
  padding: 22px;
  color: var(--muted, #9b83a8);
  background: rgba(255, 255, 255, 0.72);
}

.support-my-empty[data-state="error"] {
  border-color: rgba(220, 90, 120, 0.34);
  color: #b94a69;
  background: rgba(255, 245, 248, 0.78);
}

.support-my-ticket-card {
  border: 1px solid rgba(190, 126, 202, 0.22);
  border-radius: 24px;
  padding: 18px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 16px 40px rgba(78, 41, 94, 0.06);
}

.support-my-ticket-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.support-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 13px;
  border-radius: 999px;
  font-size: 0.88rem;
  color: #8a5eb5;
  background: rgba(190, 126, 202, 0.13);
  border: 1px solid rgba(190, 126, 202, 0.24);
}

.support-status-pill[data-status="new"] {
  color: #8060b1;
  background: rgba(190, 126, 202, 0.13);
}

.support-status-pill[data-status="in_progress"] {
  color: #9b6a08;
  background: rgba(255, 189, 89, 0.18);
  border-color: rgba(255, 189, 89, 0.38);
}

.support-status-pill[data-status="resolved"],
.support-status-pill[data-status="closed"] {
  color: #16824c;
  background: rgba(86, 205, 140, 0.16);
  border-color: rgba(86, 205, 140, 0.34);
}

.support-status-pill[data-status="archived"] {
  color: #7d7488;
  background: rgba(130, 118, 145, 0.12);
  border-color: rgba(130, 118, 145, 0.24);
}

.support-ticket-id {
  color: var(--muted, #9b83a8);
  font-size: 0.88rem;
}

.support-my-ticket-card h3 {
  margin: 0 0 10px;
  color: var(--violet-deep, #2d2144);
}

.support-my-ticket-card p {
  margin: 0;
  color: var(--muted, #9b83a8);
  line-height: 1.55;
}

.support-my-ticket-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
  color: var(--violet-deep, #2d2144);
  font-size: 0.9rem;
}

.support-my-ticket-meta span {
  border-radius: 16px;
  padding: 8px 10px;
  background: rgba(247, 239, 249, 0.82);
}

@media (max-width: 720px) {
  .support-my-tickets-head {
    flex-direction: column;
  }

  .support-my-tickets-head .button {
    width: 100%;
  }
}

/* Support ticket dialog — user and admin */
.support-ticket-dialog,
.admin-support-thread {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(90, 65, 120, 0.12);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.66);
}

.support-ticket-dialog h4,
.admin-support-thread h4 {
  margin: 0 0 12px;
  font-size: 15px;
  color: var(--color-text, #3d3048);
}

.support-ticket-messages,
.admin-support-messages {
  display: grid;
  gap: 10px;
}

.support-ticket-message,
.admin-support-message {
  padding: 12px 14px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(90, 65, 120, 0.09);
  box-shadow: 0 10px 26px rgba(58, 42, 72, 0.05);
}

.support-ticket-message[data-role="admin"],
.admin-support-message[data-role="admin"] {
  background: linear-gradient(135deg, rgba(255, 239, 246, 0.95), rgba(245, 240, 255, 0.92));
}

.support-ticket-message-head,
.admin-support-message-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
  font-size: 12px;
  color: rgba(61, 48, 72, 0.62);
}

.support-ticket-message-head strong,
.admin-support-message-head strong {
  color: var(--color-text, #3d3048);
}

.support-ticket-message p,
.admin-support-message p {
  margin: 0;
  line-height: 1.55;
  white-space: pre-wrap;
}

.support-ticket-reply-form,
.admin-support-reply {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.support-ticket-reply-form textarea,
.admin-support-reply textarea {
  width: 100%;
  min-height: 86px;
  resize: vertical;
  border: 1px solid rgba(90, 65, 120, 0.16);
  border-radius: 18px;
  padding: 12px 14px;
  font: inherit;
  line-height: 1.5;
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-text, #3d3048);
  outline: none;
}

.support-ticket-reply-form textarea:focus,
.admin-support-reply textarea:focus {
  border-color: rgba(176, 104, 148, 0.42);
  box-shadow: 0 0 0 4px rgba(176, 104, 148, 0.1);
}

.support-ticket-reply-error,
.admin-support-reply-error,
.support-ticket-closed-hint {
  margin: 0;
  font-size: 13px;
  color: #9b4764;
}

.admin-support-reply .button,
.support-ticket-reply-form .button {
  justify-self: start;
}

@media (max-width: 640px) {
  .support-ticket-message-head,
  .admin-support-message-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }
}

/* =========================================================
   CLIENT PROFILE PATCH — avatar + client profile editor
   ========================================================= */

.client-cabinet-avatar.has-image {
  overflow: hidden;
  background: #fff;
  color: transparent;
  padding: 0;
}

.client-cabinet-avatar.has-image img,
.client-profile-avatar.has-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}

.client-cabinet-profile-edit-link {
  display: inline-flex;
  width: fit-content;
  margin-top: 10px;
  font-size: 14px;
}

.client-profile-section {
  padding-top: 34px;
}

.client-profile-card {
  border: 1px solid rgba(225, 194, 219, 0.92);
  border-radius: 34px;
  background:
    radial-gradient(circle at 12% 0%, rgba(244, 230, 247, 0.72), transparent 34%),
    linear-gradient(135deg, #ffffff 0%, #fff8fc 100%);
  box-shadow: 0 24px 70px rgba(86, 61, 124, 0.08);
  padding: clamp(24px, 4vw, 42px);
}

.client-profile-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 28px;
}

.client-profile-head h1 {
  margin: 16px 0 12px;
  color: var(--text-primary);
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.client-profile-head p {
  max-width: 780px;
  margin: 0;
  color: var(--text-secondary);
  font-size: 17px;
  line-height: 1.7;
}

.client-profile-grid {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.client-profile-avatar-card,
.client-profile-form {
  border: 1px solid rgba(225, 194, 219, 0.84);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.76);
  padding: 22px;
}

.client-profile-avatar-card {
  display: grid;
  justify-items: center;
  gap: 16px;
  text-align: center;
}

.client-profile-avatar {
  width: 140px;
  height: 140px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(181, 123, 190, 0.26);
  border-radius: 42px;
  background: linear-gradient(135deg, var(--brand-primary), var(--brand-soft-blue));
  color: #ffffff;
  font-size: 44px;
  font-weight: 900;
  box-shadow: 0 18px 38px rgba(174, 123, 196, 0.18);
}

.client-profile-avatar-button {
  position: relative;
  width: 100%;
  cursor: pointer;
}

.client-profile-avatar-button input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.client-profile-avatar-note {
  margin: 0;
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.55;
}

.client-profile-form {
  display: grid;
  gap: 18px;
}

.client-profile-form .form-field {
  display: grid;
  gap: 8px;
}

.client-profile-form .form-field span {
  color: var(--text-primary);
  font-weight: 800;
}

.client-profile-form input,
.client-profile-form select {
  width: 100%;
  min-height: 56px;
  border: 1px solid rgba(225, 194, 219, 0.95);
  border-radius: 22px;
  background: #ffffff;
  color: var(--text-primary);
  font: inherit;
  outline: none;
  padding: 0 18px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.client-profile-form input:focus,
.client-profile-form select:focus {
  border-color: rgba(181, 123, 190, 0.78);
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.12);
}

.client-profile-form .custom-select {
  position: relative;
  width: 100%;
}

.client-profile-form .custom-select__button {
  min-height: 56px;
  border: 1px solid rgba(225, 194, 219, 0.95);
  border-radius: 22px;
  background: #ffffff;
  padding: 0 18px;
  color: var(--text-primary);
  font: inherit;
}

.client-profile-form .custom-select.is-open .custom-select__button,
.client-profile-form .custom-select__button:focus-visible {
  border-color: rgba(181, 123, 190, 0.78);
  box-shadow: 0 0 0 4px rgba(181, 123, 190, 0.12);
}

.client-profile-form .custom-select__menu {
  z-index: 220;
  border-color: rgba(225, 194, 219, 0.95);
  border-radius: 22px;
}

.client-profile-form .custom-select__option {
  border-radius: 16px;
}

.client-profile-form .custom-select__option.is-selected,
.client-profile-form .custom-select__option:hover {
  background: rgba(181, 123, 190, 0.12);
  color: var(--brand-primary);
}

.client-profile-form input[readonly] {
  color: var(--text-secondary);
  background: rgba(255, 247, 250, 0.76);
}

.client-profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 6px;
}

.client-profile-state {
  min-height: 24px;
  margin: 0;
  color: var(--text-secondary);
  font-weight: 700;
}

.client-profile-state[data-state="success"] {
  color: #098b47;
}

.client-profile-state[data-state="error"] {
  color: #c84f6a;
}

.client-profile-state[data-state="loading"] {
  color: var(--brand-primary);
}

@media (max-width: 900px) {
  .client-profile-head,
  .client-profile-grid {
    grid-template-columns: 1fr;
  }

  .client-profile-head {
    display: grid;
  }

  .client-profile-head > .button {
    width: fit-content;
  }
}

@media (max-width: 620px) {
  .client-profile-card {
    padding: 20px;
    border-radius: 28px;
  }

  .client-profile-avatar-card,
  .client-profile-form {
    padding: 18px;
    border-radius: 24px;
  }

  .client-profile-avatar {
    width: 116px;
    height: 116px;
    border-radius: 34px;
    font-size: 38px;
  }

  .client-profile-actions .button,
  .client-profile-avatar-button {
    width: 100%;
  }
}

/* === VRO admin final polish patch === */
.admin-queue-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0 12px;
}

.admin-queue-summary article {
  border: 1px solid rgba(184, 122, 197, 0.22);
  border-radius: 24px;
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(252, 244, 255, 0.84));
  box-shadow: 0 14px 34px rgba(79, 43, 86, 0.07);
}

.admin-queue-summary span {
  display: block;
  color: var(--muted, #9b7f9d);
  font-size: 0.82rem;
  line-height: 1.35;
  margin-bottom: 6px;
}

.admin-queue-summary strong {
  display: block;
  color: var(--ink, #2d2140);
  font-size: clamp(1.45rem, 3vw, 2.1rem);
  line-height: 1;
}

.admin-filter-row {
  align-items: stretch;
}

.admin-filter-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
}

.admin-filter-btn span {
  position: relative;
  z-index: 1;
}

.admin-filter-count {
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(184, 122, 197, 0.13);
  color: #9f55b8;
  font-size: 0.78rem;
  line-height: 1;
}

.admin-filter-btn.is-active .admin-filter-count {
  background: rgba(255, 255, 255, 0.52);
  color: inherit;
}

.admin-cleanup-panel {
  margin: 14px 0 20px;
  border: 1px solid rgba(184, 122, 197, 0.22);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 12px 30px rgba(79, 43, 86, 0.06);
  overflow: hidden;
}

.admin-cleanup-panel summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 18px;
  color: var(--ink, #2d2140);
}

.admin-cleanup-panel summary::-webkit-details-marker {
  display: none;
}

.admin-cleanup-panel summary::after {
  content: '+';
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(184, 122, 197, 0.12);
  color: #9f55b8;
  flex: 0 0 auto;
}

.admin-cleanup-panel[open] summary::after {
  content: '−';
}

.admin-cleanup-panel summary span {
  font-weight: 700;
}

.admin-cleanup-panel summary small {
  color: var(--muted, #9b7f9d);
  font-size: 0.82rem;
  line-height: 1.35;
  font-weight: 500;
  margin-right: auto;
}

.admin-cleanup-panel .admin-cleanup-actions {
  padding: 0 18px 18px;
}

.admin-review-card[data-admin-card] {
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.admin-review-card[data-admin-card]:focus-visible {
  outline: 3px solid rgba(184, 122, 197, 0.25);
  outline-offset: 4px;
}

.admin-card-top {
  gap: 10px;
  flex-wrap: wrap;
}

.admin-card-actions {
  gap: 10px;
}

.admin-card-actions .button {
  min-height: 42px;
}

.admin-empty-state[hidden],
.admin-empty-state[aria-hidden="true"] {
  display: none !important;
}

@media (max-width: 920px) {
  .admin-queue-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .admin-queue-summary {
    grid-template-columns: 1fr;
  }

  .admin-cleanup-panel summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-cleanup-panel summary::after {
    position: absolute;
    right: 18px;
  }

  .admin-filter-btn {
    width: 100%;
  }
}

/* =========================================================
   CLIENT UI POLISH FIX — cabinet/profile layout cleanup
   Keeps backend/avatar logic untouched. Fixes cramped desktop/tablet
   layout, clipped client cabinet heading and oversized profile editor.
   ========================================================= */

.client-cabinet-page,
.client-profile-page {
  overflow-x: hidden;
}

.client-cabinet-page .container,
.client-profile-page .container {
  width: min(calc(100% - 32px), var(--container));
}

.client-cabinet-hero-section,
.client-profile-section {
  padding-top: clamp(24px, 4vw, 48px);
}

.client-cabinet-hero-card {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  align-items: center;
  gap: clamp(18px, 3vw, 32px);
  padding: clamp(22px, 4vw, 40px);
}

.client-cabinet-hero-copy,
.client-cabinet-profile-card,
.client-cabinet-panel,
.client-cabinet-stat-card,
.client-profile-card,
.client-profile-form,
.client-profile-avatar-card {
  min-width: 0;
}

.client-cabinet-hero-copy h1 {
  max-width: 680px;
  font-size: clamp(36px, 4.8vw, 54px);
  overflow-wrap: anywhere;
}

.client-cabinet-hero-copy p {
  max-width: 700px;
}

.client-cabinet-profile-card {
  width: 100%;
  max-width: 360px;
  justify-self: end;
  gap: 14px;
}

.client-cabinet-avatar {
  flex: 0 0 auto;
}

.client-cabinet-profile-meta {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.client-cabinet-profile-meta dd,
.client-cabinet-request-meta dd {
  overflow-wrap: anywhere;
}

.client-cabinet-actions .button {
  white-space: normal;
  text-align: center;
}

.client-profile-card {
  width: 100%;
  max-width: 1080px;
}

.client-profile-head {
  align-items: center;
}

.client-profile-head h1 {
  font-size: clamp(34px, 4.6vw, 50px);
}

.client-profile-grid {
  grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
  gap: clamp(16px, 2.4vw, 24px);
}

.client-profile-avatar-card {
  align-self: start;
  padding: clamp(18px, 2.6vw, 24px);
}

.client-profile-avatar {
  width: 118px;
  height: 118px;
  border-radius: 34px;
  font-size: 38px;
}

.client-profile-avatar-button {
  min-height: 52px;
  justify-content: center;
  text-align: center;
}

.client-profile-avatar-note {
  max-width: 260px;
}

.client-profile-form {
  gap: 16px;
}

.client-profile-form input,
.client-profile-form select,
.client-profile-form .custom-select__button {
  min-height: 54px;
  border-radius: 20px;
}

@media (max-width: 1180px) {
  .client-cabinet-hero-card {
    grid-template-columns: 1fr;
  }

  .client-cabinet-profile-card {
    max-width: none;
    justify-self: stretch;
    grid-template-columns: 76px minmax(0, 1fr);
    align-items: start;
  }

  .client-cabinet-profile-meta {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .client-cabinet-page .container,
  .client-profile-page .container {
    width: min(calc(100% - 24px), var(--container));
  }

  .client-cabinet-hero-card,
  .client-profile-card {
    border-radius: 26px;
  }

  .client-cabinet-hero-copy h1 {
    font-size: clamp(32px, 11vw, 42px);
    line-height: 1.06;
    letter-spacing: -0.045em;
  }

  .client-cabinet-profile-card {
    grid-template-columns: 64px minmax(0, 1fr);
    padding: 18px;
    border-radius: 24px;
  }

  .client-cabinet-avatar {
    width: 64px;
    height: 64px;
    border-radius: 20px;
  }

  .client-cabinet-profile-meta {
    grid-template-columns: 1fr;
  }

  .client-profile-head {
    align-items: stretch;
  }

  .client-profile-head h1 {
    font-size: clamp(34px, 10vw, 44px);
  }

  .client-profile-grid {
    grid-template-columns: 1fr;
  }

  .client-profile-avatar-card {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
    text-align: left;
  }

  .client-profile-avatar {
    grid-row: span 2;
    width: 92px;
    height: 92px;
    border-radius: 28px;
    font-size: 30px;
  }

  .client-profile-avatar-button,
  .client-profile-avatar-note {
    width: 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .client-cabinet-hero-card,
  .client-cabinet-panel,
  .client-cabinet-stat-card,
  .client-profile-card,
  .client-profile-avatar-card,
  .client-profile-form {
    padding: 16px;
  }

  .client-cabinet-profile-card,
  .client-profile-avatar-card {
    grid-template-columns: 1fr;
    text-align: center;
    justify-items: center;
  }

  .client-cabinet-profile-card > div,
  .client-profile-avatar-note {
    text-align: center;
  }
}

/* =========================================================
   VRO_FRONTEND_FINAL_POLISH_PASS
   Safe scoped frontend polish before MVP demo.
   Scope: target MVP pages only. Backend/JS logic untouched.
========================================================= */

.index-page,
.cabinet-page,
.client-cabinet-page,
.client-profile-page,
.client-request-detail-page,
.specialist-workspace-page,
.specialist-cabinet-page,
.specialist-requests-page,
.specialist-request-detail-page,
.specialist-profile-edit-page,
.specialists-page,
.specialist-profile-page,
.admin-page,
.support-page,
.notifications-page,
.auth-native-main,
.page-shell {
  max-width: 100%;
  overflow-x: clip;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

.site-header,
.site-header *,
.footer-section,
.footer-section *,
.cabinet-page *,
.client-profile-page *,
.client-request-detail-page *,
.specialist-workspace-page *,
.specialist-cabinet-page *,
.specialist-requests-page *,
.specialist-request-detail-page *,
.specialist-profile-edit-page *,
.specialists-page *,
.specialist-profile-page *,
.admin-page *,
.support-page *,
.notifications-page * {
  min-width: 0;
}

.site-header img,
.footer-section img,
.client-cabinet-avatar img,
.client-profile-avatar img,
.specialist-dashboard-avatar img,
.specialist-edit-avatar img,
.profile-avatar img,
.avatar-mini img {
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

.badge,
.status-pill,
.admin-type-pill,
.admin-status-pill,
.role-dashboard-pill,
.trust-chip,
.specialist-dashboard-role-summary-pill,
.notifications-filter,
.notifications-action-btn,
.notification-action,
.notification-read-all,
.notification-clear-all,
.notification-all-link {
  width: fit-content;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

.button,
.text-link,
.role-dashboard-link,
.profile-actions a,
.client-cabinet-actions .button,
.specialist-workspace-actions .button,
.specialist-request-card-actions .button,
.admin-hero-actions .button,
.support-hero-actions .button,
.support-form-actions .button,
.notifications-item-actions .button {
  max-width: 100%;
  white-space: normal;
  text-align: center;
}

.form-field input,
.form-field textarea,
.form-field select,
.custom-select,
.custom-select__button,
.client-profile-form input,
.client-profile-form select,
.support-form-card input,
.support-form-card textarea,
.support-form-card select,
.specialist-edit-field input,
.specialist-edit-field textarea,
.specialist-edit-field select,
.client-request-dialog-form textarea,
.client-request-review-form textarea,
.client-request-review-form select {
  max-width: 100%;
}

.client-cabinet-empty-card,
.client-request-detail-backend-state,
.client-request-dialog-empty,
.specialist-request-empty,
.admin-empty-state,
.support-my-empty,
.notifications-empty {
  border: 1px dashed rgba(201, 122, 205, 0.24);
  border-radius: 24px;
  background:
    radial-gradient(circle at 12% 10%, rgba(201, 122, 205, 0.08), transparent 34%),
    rgba(255, 255, 255, 0.72);
  color: var(--text-secondary);
  line-height: 1.6;
}

.client-cabinet-empty-card,
.specialist-request-empty,
.admin-empty-state,
.support-my-empty,
.notifications-empty {
  padding: clamp(18px, 3vw, 28px);
}

/* Header: keep desktop composition but stop the 981–1180px squeeze. */
@media (min-width: 981px) and (max-width: 1180px) {
  .site-header .header-shell,
  .site-header > .container,
  .site-header .container {
    width: min(calc(100% - 18px), 1100px) !important;
  }

  .utility-inner,
  .main-inner {
    width: calc(100% - 44px) !important;
  }

  .main-inner {
    grid-template-columns: 210px minmax(0, 1fr) 150px !important;
    column-gap: 16px !important;
  }

  .brand,
  .brand img {
    width: 205px !important;
    height: 62px !important;
  }

  .main-nav {
    gap: 14px !important;
    font-size: 13px !important;
  }

  .header-cta {
    width: 150px !important;
    padding-inline: 14px !important;
  }
}

/* Shared hero/cards: prevents clipped headings and crushed side panels. */
.page-hero-card,
.client-cabinet-hero-card,
.client-profile-card,
.client-request-detail-hero-card,
.client-request-detail-card,
.client-request-detail-side-card,
.client-request-detail-status-card,
.specialist-workspace-hero,
.specialist-request-dashboard-hero,
.specialist-request-detail-hero,
.specialist-request-detail-card,
.specialist-request-detail-status-card,
.specialist-request-actions-card,
.specialist-profile-edit-hero,
.specialist-profile-edit-card,
.specialist-dashboard-hero,
.specialist-dashboard-profile-card,
.specialist-dashboard-task-card,
.specialist-dashboard-quick-panel,
.specialist-dashboard-priority-panel,
.specialist-dashboard-rules-panel,
.specialist-dashboard-blog-panel,
.profile-hero-card,
.profile-summary-card,
.profile-format-card,
.admin-hero-card,
.admin-main-panel,
.admin-side-panel,
.admin-detail-card,
.admin-rules-card,
.support-hero-card,
.support-form-card,
.support-ticket-card,
.support-topic-card,
.support-faq-card,
.support-my-tickets-card,
.notifications-page-card {
  overflow: hidden;
}

.page-hero-copy h1,
.hero-copy h1,
.client-cabinet-hero-copy h1,
.client-profile-head h1,
.client-request-detail-hero-card h1,
.specialist-workspace-hero-copy h1,
.specialist-profile-edit-hero-copy h1,
.specialist-dashboard-hero-copy h1,
.profile-hero-copy h1,
.admin-hero-copy h1,
.support-hero-copy h1,
.notifications-page-head h1 {
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.client-cabinet-actions,
.client-profile-actions,
.client-request-detail-actions,
.profile-actions,
.specialist-workspace-actions,
.specialist-dashboard-actions,
.specialist-dashboard-task-actions,
.specialist-request-card-actions,
.specialist-request-sidebar-actions,
.admin-hero-actions,
.admin-filter-row,
.support-hero-actions,
.support-form-actions,
.notifications-toolbar,
.notifications-item-actions,
.specialists-filter-row,
.specialists-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

/* Client request detail: dynamic backend content can be long. */
.client-request-detail-layout {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  align-items: start;
}

.client-request-detail-side {
  min-width: 0;
}

.client-request-detail-card p,
.client-request-detail-side-card p,
.client-request-dialog-message p,
.client-request-timeline span,
.client-request-detail-mini-dl strong,
.client-request-detail-status-grid strong {
  overflow-wrap: anywhere;
}

.client-request-dialog-list,
.client-request-timeline,
.specialist-request-timeline,
.support-my-tickets-list,
.notifications-list {
  max-width: 100%;
}

.client-request-dialog-message {
  max-width: min(88%, 720px);
}

/* Specialist request/list polish. */
.specialist-request-board-grid,
.specialist-request-info-grid,
.specialist-request-metrics-grid,
.specialist-workspace-metrics-grid,
.specialist-dashboard-metrics-grid,
.specialist-dashboard-control-grid,
.specialist-dashboard-today-grid,
.specialist-dashboard-section-grid,
.specialist-dashboard-role-stage-grid,
.role-dashboard-grid,
.admin-metrics-grid,
.support-topic-grid,
.support-choice-grid,
.notifications-page-shell {
  min-width: 0;
}

.specialist-request-filter-panel,
.specialist-request-list-panel,
.specialist-request-card,
.role-dashboard-card,
.admin-metric-card,
.support-choice-card,
.notifications-item {
  min-width: 0;
  overflow: hidden;
}

.specialist-request-filter-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.specialist-request-filter-group button,
.admin-filter-btn,
.notifications-filter,
.notifications-action-btn {
  min-width: 0;
}

.specialist-request-card-title,
.specialist-request-card p,
.specialist-workspace-safe-dl dd,
.specialist-request-detail-safe-dl dd,
.admin-metric-card strong,
.admin-card-list,
.support-topic-card p,
.notifications-body {
  overflow-wrap: anywhere;
}

/* Specialist public catalogue/profile: keep toolbar and cards even. */
.specialists-toolbar {
  justify-content: space-between;
}

.specialists-filter-row {
  flex: 1 1 520px;
}

.specialists-count {
  flex: 0 0 auto;
}

.specialists-dynamic-list,
.specialist-publications-grid,
.profile-metrics,
.profile-tags,
.profile-chips {
  min-width: 0;
}

.profile-avatar,
.profile-summary-card,
.profile-format-card,
.direction-specialist-banner,
.format-option {
  min-width: 0;
}

/* Admin/support/notifications: stable controls and non-sticky side on shorter screens. */
.admin-work-grid,
.support-form-layout,
.support-faq-layout {
  align-items: start;
}

.admin-detail-card,
.admin-rules-card {
  top: 14px;
}

.support-form-notice,
.support-my-empty,
.notifications-empty,
.client-request-detail-inline-state {
  overflow-wrap: anywhere;
}

.notifications-page-card {
  width: 100%;
}

.notifications-page-head > div,
.notifications-item-title,
.notification-dropdown-title {
  min-width: 0;
}

.notifications-date,
.notification-date {
  flex: 0 0 auto;
}

@media (max-width: 980px) {
  .page-hero-card,
  .client-request-detail-hero-card,
  .client-request-detail-layout,
  .specialist-request-dashboard-hero,
  .specialist-request-detail-hero,
  .specialist-request-detail-layout,
  .specialist-profile-edit-hero,
  .specialist-profile-edit-layout,
  .specialist-dashboard-hero,
  .specialist-dashboard-control-grid,
  .profile-hero-grid,
  .admin-hero-card,
  .admin-work-grid,
  .support-hero-card,
  .support-form-layout,
  .support-faq-layout,
  .choose-format-card,
  .cta-card {
    grid-template-columns: 1fr !important;
  }

  .admin-detail-card,
  .admin-rules-card {
    position: static;
  }

  .specialists-toolbar,
  .notifications-page-head {
    align-items: stretch;
  }

  .specialists-count,
  .notifications-page-head .button {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .section,
  .client-cabinet-hero-section,
  .client-profile-section,
  .client-request-detail-hero-section,
  .client-request-detail-section,
  .specialist-workspace-hero-section,
  .specialist-request-dashboard-section,
  .specialist-request-detail-section,
  .specialist-profile-edit-main-section,
  .specialists-list-section,
  .admin-hero-section,
  .admin-work-section,
  .support-hero-section,
  .support-form-section,
  .notifications-page-section {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }

  .container,
  .client-cabinet-page .container,
  .client-profile-page .container,
  .client-request-detail-page .container,
  .specialist-workspace-page .container,
  .specialists-page .container,
  .specialist-profile-page .container,
  .admin-page .container,
  .support-page .container,
  .notifications-page .container {
    width: min(calc(100% - 24px), var(--container)) !important;
  }

  .page-hero-card,
  .client-cabinet-hero-card,
  .client-profile-card,
  .client-request-detail-hero-card,
  .client-request-detail-card,
  .client-request-detail-side-card,
  .client-request-detail-status-card,
  .specialist-workspace-hero,
  .specialist-workspace-panel,
  .specialist-workspace-status-card,
  .specialist-request-dashboard-hero,
  .specialist-request-filter-panel,
  .specialist-request-list-panel,
  .specialist-request-card,
  .specialist-request-detail-hero,
  .specialist-request-detail-card,
  .specialist-request-detail-status-card,
  .specialist-request-actions-card,
  .specialist-profile-edit-hero,
  .specialist-profile-edit-card,
  .specialist-dashboard-hero,
  .specialist-dashboard-profile-card,
  .specialist-dashboard-task-card,
  .specialist-dashboard-quick-panel,
  .specialist-dashboard-priority-panel,
  .specialist-dashboard-rules-panel,
  .specialist-dashboard-blog-panel,
  .profile-hero-card,
  .profile-summary-card,
  .profile-format-card,
  .admin-hero-card,
  .admin-main-panel,
  .admin-detail-card,
  .admin-rules-card,
  .admin-backend-notice,
  .support-hero-card,
  .support-form-card,
  .support-ticket-card,
  .support-topic-card,
  .support-faq-intro,
  .support-faq-card,
  .support-my-tickets-card,
  .notifications-page-card,
  .notifications-item {
    border-radius: 24px !important;
    padding: 18px !important;
  }

  .client-cabinet-actions,
  .client-profile-actions,
  .client-request-detail-actions,
  .specialist-workspace-actions,
  .specialist-dashboard-actions,
  .specialist-request-card-actions,
  .specialist-request-sidebar-actions,
  .admin-hero-actions,
  .support-hero-actions,
  .support-form-actions,
  .notifications-toolbar,
  .notifications-item-actions,
  .cta-actions,
  .hero-actions,
  .page-hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    width: 100%;
  }

  .client-cabinet-actions .button,
  .client-profile-actions .button,
  .client-request-detail-actions .button,
  .specialist-workspace-actions .button,
  .specialist-dashboard-actions .button,
  .specialist-request-card-actions .button,
  .specialist-request-sidebar-actions .button,
  .admin-hero-actions .button,
  .support-hero-actions .button,
  .support-form-actions .button,
  .notifications-toolbar button,
  .notifications-item-actions .button,
  .hero-actions .button,
  .page-hero-actions .button,
  .cta-actions .button {
    width: 100% !important;
  }

  .client-request-dialog-message {
    max-width: 100%;
  }

  .client-request-detail-status-grid,
  .client-request-detail-mini-dl,
  .specialist-request-detail-mini-dl,
  .specialist-workspace-safe-dl,
  .admin-metrics-grid,
  .specialist-request-metrics-grid,
  .specialist-workspace-metrics-grid,
  .specialist-dashboard-metrics-grid,
  .support-form-grid,
  .support-topic-grid,
  .support-choice-grid,
  .profile-metrics,
  .format-options {
    grid-template-columns: 1fr !important;
  }

  .client-request-detail-status-grid > div,
  .client-request-detail-mini-dl > div,
  .specialist-workspace-safe-dl > div,
  .admin-metric-card,
  .support-choice-card {
    min-height: 0;
  }

  .notifications-item-top,
  .notification-item-top {
    display: grid !important;
    gap: 8px;
  }

  .notifications-date,
  .notification-date {
    white-space: normal;
  }
}

@media (max-width: 560px) {
  .footer-main,
  .footer-links,
  .footer-bottom,
  .footer-bottom div {
    min-width: 0;
  }

  .notification-dropdown {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-height: calc(100dvh - 110px);
  }

  .notification-dropdown-head-actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .notification-read-all,
  .notification-clear-all,
  .notification-all-link {
    width: 100%;
  }
}

@media (max-width: 430px) {
  .site-header .brand {
    width: 136px !important;
  }

  .site-header .brand img {
    width: 136px !important;
  }

  .mobile-menu-link,
  .mobile-menu-service-link,
  .mobile-menu-account {
    border-radius: 16px;
    padding: 11px 12px;
  }

  .container,
  .client-cabinet-page .container,
  .client-profile-page .container,
  .client-request-detail-page .container,
  .specialist-workspace-page .container,
  .specialists-page .container,
  .specialist-profile-page .container,
  .admin-page .container,
  .support-page .container,
  .notifications-page .container {
    width: min(calc(100% - 18px), var(--container)) !important;
  }

  .page-hero-card,
  .client-cabinet-hero-card,
  .client-profile-card,
  .client-request-detail-card,
  .client-request-detail-side-card,
  .specialist-workspace-panel,
  .specialist-request-card,
  .specialist-profile-edit-card,
  .admin-main-panel,
  .support-form-card,
  .notifications-page-card {
    padding: 16px !important;
  }

  .badge,
  .status-pill,
  .admin-type-pill,
  .admin-status-pill,
  .trust-chip {
    font-size: 12px;
    line-height: 1.25;
  }

  .button,
  .auth-native-submit,
  .notifications-filter,
  .notifications-action-btn {
    min-height: 46px;
  }
}

/* VRO ADMIN CLEANUP LAYOUT FIX START */
.admin-cleanup-panel {
  display: block !important;
  align-items: initial !important;
  justify-content: initial !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.admin-cleanup-panel summary {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 32px !important;
  align-items: center !important;
  gap: 14px !important;
  position: relative !important;
  padding: 16px 18px !important;
}

.admin-cleanup-panel summary span {
  display: block !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
  min-width: max-content !important;
}

.admin-cleanup-panel summary small {
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  line-height: 1.35 !important;
}

.admin-cleanup-panel summary::after {
  position: static !important;
  justify-self: end !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
}

.admin-cleanup-panel .admin-cleanup-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  padding: 0 18px 18px !important;
}

.admin-cleanup-panel .admin-cleanup-actions .button {
  min-height: 46px !important;
  white-space: normal !important;
  text-align: center !important;
}

@media (max-width: 700px) {
  .admin-cleanup-panel summary {
    grid-template-columns: minmax(0, 1fr) 32px !important;
    align-items: start !important;
  }

  .admin-cleanup-panel summary span {
    grid-column: 1 !important;
    grid-row: 1 !important;
    white-space: normal !important;
    min-width: 0 !important;
  }

  .admin-cleanup-panel summary small {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    padding-right: 44px !important;
  }

  .admin-cleanup-panel summary::after {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  .admin-cleanup-panel .admin-cleanup-actions {
    justify-content: stretch !important;
  }

  .admin-cleanup-panel .admin-cleanup-actions .button {
    width: 100% !important;
  }
}
/* VRO ADMIN CLEANUP LAYOUT FIX END */

/* VRO AUTH DEMO CLEANUP START */
.auth-native-demo,
.auth-native-footer,
[data-demo-login] {
  display: none !important;
}
/* VRO AUTH DEMO CLEANUP END */

/* VRO PASSWORD CHANGE START */
.password-change-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at top left, rgba(255, 214, 229, 0.65), transparent 34rem),
    radial-gradient(circle at bottom right, rgba(224, 236, 255, 0.65), transparent 30rem),
    var(--page-bg, #fff8f5);
}

.password-change-shell {
  width: min(100%, 760px);
  margin: 0 auto;
  padding: 56px 18px;
}

.password-change-card {
  border: 1px solid rgba(98, 63, 75, 0.12);
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 24px 60px rgba(70, 44, 53, 0.12);
  padding: clamp(22px, 4vw, 38px);
}

.password-change-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  color: inherit;
  text-decoration: none;
  opacity: 0.78;
}

.password-change-back:hover {
  opacity: 1;
}

.password-change-head {
  margin-bottom: 24px;
}

.password-change-head h1 {
  margin: 8px 0 10px;
}

.password-change-form {
  display: grid;
  gap: 18px;
}

.password-change-form .form-field {
  display: grid;
  gap: 8px;
}

.password-change-form input {
  width: 100%;
  min-height: 48px;
}

.password-change-form small {
  opacity: 0.72;
}

.password-change-message {
  min-height: 22px;
  font-size: 0.95rem;
}

.password-change-message.is-error {
  color: #a13a45;
}

.password-change-message.is-success {
  color: #357248;
}

.password-entry-card {
  margin-top: 24px;
  padding: 20px;
  border-radius: 22px;
  border: 1px solid rgba(98, 63, 75, 0.12);
  background: rgba(255, 255, 255, 0.72);
}

.password-entry-card h2 {
  margin: 0 0 8px;
}

.password-entry-card p {
  margin: 0 0 14px;
  opacity: 0.76;
}

@media (max-width: 520px) {
  .password-change-shell {
    padding: 28px 14px;
  }

  .password-change-card {
    border-radius: 22px;
    padding: 20px;
  }
}
/* VRO PASSWORD CHANGE END */



/* VRO PASSWORD ENTRY CARD REAL FIX START */
.password-entry-card {
  width: min(100% - 48px, 1120px) !important;
  max-width: 1120px !important;
  margin: 28px auto 42px !important;
  padding: 28px 34px !important;

  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 24px !important;

  border-radius: 28px !important;
  border: 1px solid rgba(214, 181, 208, 0.7) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(250, 230, 247, 0.75), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,0.98), rgba(255,248,253,0.94)) !important;
  box-shadow: 0 18px 46px rgba(80, 48, 77, 0.08) !important;
}

.password-entry-card__content {
  min-width: 0 !important;
}

.password-entry-card__eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  height: 28px !important;
  padding: 0 12px !important;
  margin: 0 0 12px !important;

  border-radius: 999px !important;
  background: rgba(196, 136, 204, 0.13) !important;
  color: #a367b2 !important;

  font-size: 0.88rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

.password-entry-card h2 {
  margin: 0 0 8px !important;
  padding: 0 !important;

  font-size: 2rem !important;
  line-height: 1.15 !important;
  font-weight: 600 !important;
  color: #31243f !important;
}

.password-entry-card p {
  margin: 0 !important;
  padding: 0 !important;

  max-width: 680px !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
  color: rgba(74, 56, 86, 0.68) !important;
}

.password-entry-card__actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

.password-entry-card a.button,
.password-entry-card .button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-width: 170px !important;
  height: 50px !important;
  padding: 0 24px !important;

  border: 0 !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #c47ace, #af63bf) !important;
  color: #fff !important;

  font-size: 0.98rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;

  box-shadow: 0 16px 30px rgba(178, 99, 191, 0.24) !important;
  cursor: pointer !important;
}

.password-entry-card a.button:hover,
.password-entry-card .button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 20px 38px rgba(178, 99, 191, 0.3) !important;
}

@media (max-width: 900px) {
  .password-entry-card {
    width: min(100% - 32px, 720px) !important;
    grid-template-columns: 1fr !important;
    align-items: start !important;
    padding: 24px !important;
    margin-top: 24px !important;
  }

  .password-entry-card__actions {
    justify-content: flex-start !important;
  }
}

@media (max-width: 560px) {
  .password-entry-card {
    width: calc(100% - 24px) !important;
    padding: 20px !important;
    border-radius: 22px !important;
  }

  .password-entry-card h2 {
    font-size: 1.55rem !important;
  }

  .password-entry-card a.button,
  .password-entry-card .button {
    width: 100% !important;
  }
}
/* VRO PASSWORD ENTRY CARD REAL FIX END */

/* VRO NETLIFY SPECIALISTS HEADER FIX */
.specialists-page main,
body.specialists-page main {
  padding-top: var(--fixed-header-space, 150px) !important;
}

@media (max-width: 980px) {
  .specialists-page main,
  body.specialists-page main {
    padding-top: 116px !important;
  }
}