:root {
  --bg: #f5f7fb;
  --white: #ffffff;
  --text: #080b12;
  --muted: #677285;
  --muted2: #8a94a6;
  --line: #e4eaf2;
  --blue: #1268ff;
  --blue2: #0047c7;
  --blue-soft: #eaf2ff;
  --black: #05070b;
  --shadow: 0 16px 44px rgba(18, 32, 56, .08);
  --shadow2: 0 28px 70px rgba(18, 32, 56, .12);
  --radius-xl: 32px;
  --radius-lg: 22px;
  --radius-md: 16px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Inter, Arial, sans-serif;
  background:
    radial-gradient(circle at 8% 0%, rgba(18,104,255,.08), transparent 28%),
    radial-gradient(circle at 92% 8%, rgba(18,104,255,.06), transparent 30%),
    var(--bg);
  color: var(--text);
}

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

p {
  color: var(--muted);
  line-height: 1.6;
}

h1,
h2,
h3 {
  margin: 0;
}

h1 {
  font-size: clamp(38px, 5.7vw, 70px);
  line-height: .96;
  letter-spacing: -2.8px;
}

h2 {
  font-size: clamp(28px, 3.5vw, 44px);
  line-height: 1;
  letter-spacing: -1.4px;
}

h3 {
  letter-spacing: -.5px;
}

.header {
  width: min(1180px, calc(100% - 28px));
  margin: 16px auto;
  padding: 12px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 18px;
  align-items: center;
  background: rgba(255,255,255,.92);
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--shadow);
  position: sticky;
  top: 12px;
  z-index: 20;
}

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

.logo-mark {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: var(--black);
  color: white;
  font-weight: 950;
  font-size: 20px;
}

.logo strong {
  display: block;
  font-size: 18px;
}

.logo small {
  display: block;
  color: var(--muted2);
  font-size: 12px;
  margin-top: 2px;
}

.nav {
  justify-self: center;
  display: flex;
  gap: 6px;
  padding: 5px;
  border-radius: 999px;
  background: #f0f4fa;
}

.nav a {
  color: var(--muted);
  font-size: 14px;
  font-weight: 750;
  padding: 9px 13px;
  border-radius: 999px;
}

.nav a:hover {
  background: white;
  color: var(--text);
}

.header-btn {
  padding: 12px 17px;
  border-radius: 16px;
  background: var(--blue);
  color: white;
  font-weight: 850;
}

.btn {
  min-height: 54px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 17px;
  border: 0;
  font-weight: 900;
  cursor: pointer;
}

.primary {
  background: var(--blue);
  color: white;
  box-shadow: 0 14px 28px rgba(18,104,255,.22);
}

.primary:hover {
  background: var(--blue2);
}

.secondary {
  background: white;
  color: var(--text);
  border: 1px solid var(--line);
}

.full {
  width: 100%;
}

.kicker,
.badge {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue2);
  border: 1px solid #d7e6ff;
  font-size: 13px;
  font-weight: 900;
  margin-bottom: 16px;
}

.kicker.light {
  background: rgba(255,255,255,.18);
  color: white;
  border-color: rgba(255,255,255,.25);
}

.hero,
.section,
.custom,
.page-hero,
.checkout,
.footer,
.project-shell,
.project-info-layout,
.project-note,
.custom-hero-clean,
.custom-detail-section,
.process-clean,
.examples-clean,
.final-cta-clean,
.success-banner {
  width: min(1180px, calc(100% - 28px));
  margin-left: auto;
  margin-right: auto;
}

/* Главная */

.hero {
  margin-top: 42px;
  margin-bottom: 22px;
  display: grid;
  grid-template-columns: 1.18fr .82fr;
  gap: 22px;
}

.hero-content,
.hero-card,
.section,
.custom,
.page-hero,
.checkout-box,
.custom-copy,
.custom-side-card,
.custom-detail-section,
.process-clean,
.examples-clean,
.final-cta-clean,
.success-banner,
.project-main-card,
.project-price-card,
.project-info-block,
.project-note {
  background: rgba(255,255,255,.96);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  border-radius: var(--radius-xl);
}

.hero-content {
  padding: clamp(28px, 5vw, 58px);
}

.hero-content p {
  max-width: 720px;
  font-size: 19px;
}

.hero-actions,
.custom-actions,
.checkout-actions,
.project-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.stats,
.custom-points {
  margin-top: 36px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.stats div,
.custom-points div {
  padding: 16px;
  border-radius: 20px;
  background: #f5f8fd;
  border: 1px solid var(--line);
}

.stats b,
.custom-points b {
  display: block;
  font-size: 20px;
}

.stats span,
.custom-points span {
  display: block;
  margin-top: 5px;
  color: var(--muted2);
  font-size: 13px;
}

.hero-card {
  padding: 26px;
  background: var(--black);
  color: white;
}

.card-top {
  display: flex;
  gap: 10px;
  color: #d6deec;
}

.card-top span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #27d17f;
}

.preview-card {
  margin: 26px 0;
  padding: 26px;
  border-radius: 28px;
  background: white;
  color: var(--text);
}

.preview-card small {
  color: var(--blue);
  font-weight: 900;
}

.preview-card h3 {
  margin-top: 10px;
  font-size: 28px;
}

.preview-price {
  margin-top: 20px;
  font-size: 32px;
  font-weight: 950;
}

.mini-steps {
  display: grid;
  gap: 10px;
}

.mini-steps div {
  padding: 15px;
  border-radius: 18px;
  display: flex;
  gap: 12px;
  background: rgba(255,255,255,.08);
}

.mini-steps b {
  color: #70a7ff;
}

.features,
.grid,
.order-types,
.service-grid {
  width: min(1180px, calc(100% - 28px));
  margin: 22px auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.features div,
.project-card,
.order-types div,
.service-grid div {
  background: white;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  border-radius: var(--radius-lg);
  padding: 24px;
}

.features span,
.order-types span,
.service-grid span {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: var(--blue-soft);
  margin-bottom: 15px;
  font-size: 22px;
}

.features b,
.order-types b,
.service-grid b {
  display: block;
  font-size: 20px;
}

.section,
.custom,
.page-hero,
.custom-detail-section,
.process-clean,
.examples-clean,
.final-cta-clean {
  margin-top: 26px;
  margin-bottom: 26px;
  padding: clamp(24px, 4vw, 38px);
}

.page-hero {
  text-align: center;
  padding-top: 58px;
  padding-bottom: 58px;
}

.page-hero p {
  max-width: 720px;
  margin: 0 auto;
  font-size: 18px;
}

.section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 18px;
  margin-bottom: 24px;
}

.section-head a {
  color: var(--blue);
  font-weight: 900;
}

/* Каталог */

.project-card {
  min-height: 330px;
  display: flex;
  flex-direction: column;
  transition: .16s ease;
}

.project-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow2);
}

.meta {
  color: var(--blue);
  font-size: 13px;
  font-weight: 950;
  margin-bottom: 14px;
}

.project-card h3 {
  font-size: 22px;
  line-height: 1.08;
}

.project-card p {
  flex: 1;
}

.chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 16px 0 4px;
}

.chips span {
  padding: 8px 10px;
  border-radius: 999px;
  background: #f1f5fb;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}

.project-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 18px;
}

.project-bottom b {
  font-size: 24px;
}

.project-bottom a {
  min-height: 42px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  border-radius: 14px;
  background: var(--black);
  color: white;
  font-weight: 900;
}

.catalog-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-bottom: 22px;
}

.catalog-head b {
  display: block;
  font-size: 22px;
}

.catalog-head span {
  display: block;
  margin-top: 5px;
  color: var(--muted);
}

.catalog-head em {
  padding: 10px 13px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue2);
  font-style: normal;
  font-weight: 900;
}

/* Страница проекта */

.project-shell {
  margin-top: 42px;
  margin-bottom: 22px;
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 22px;
  align-items: start;
}

.project-main-card {
  padding: clamp(28px, 4vw, 46px);
}

.project-topline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.project-topline a {
  color: var(--blue);
  font-weight: 900;
}

.project-topline span {
  padding: 9px 12px;
  border-radius: 999px;
  background: #f1f5fb;
  color: var(--muted);
  font-size: 13px;
  font-weight: 850;
}

.project-lead {
  max-width: 760px;
  font-size: 19px;
  margin: 20px 0 0;
}

.project-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 24px;
}

.project-tags span {
  padding: 9px 12px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue2);
  font-size: 13px;
  font-weight: 900;
}

.project-price-card {
  padding: 24px;
  position: sticky;
  top: 104px;
}

.price-head {
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.price-head span {
  display: block;
  color: var(--muted);
  font-weight: 850;
  margin-bottom: 6px;
}

.price-head b {
  display: block;
  font-size: 42px;
  letter-spacing: -1.4px;
}

.price-head p {
  margin-bottom: 0;
  font-size: 14px;
}

.order-form-clean {
  display: grid;
  gap: 14px;
}

.project-info-layout {
  margin-top: 0;
  margin-bottom: 22px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.project-info-block {
  padding: 24px;
}

.project-info-block h2 {
  font-size: 26px;
  margin-bottom: 14px;
}

.project-info-block ul {
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  line-height: 1.85;
}

.project-info-block p {
  margin-bottom: 0;
}

.project-note {
  margin-top: 0;
  margin-bottom: 34px;
  padding: 18px 20px;
  background: #fff7df;
  border-color: #f1dda5;
  color: #725817;
  line-height: 1.55;
}

/* Процесс */

.blue-section,
.process-clean {
  background: linear-gradient(135deg, #0b63ff, #003aa3);
  color: white;
  border: 0;
}

.blue-section p,
.process-clean p {
  color: rgba(255,255,255,.78);
}

.steps,
.process-grid-clean {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 26px;
}

.steps div,
.process-grid-clean div {
  padding: 22px;
  border-radius: 22px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.16);
}

.steps b,
.process-grid-clean b {
  display: block;
  font-size: 24px;
  margin-bottom: 14px;
}

/* Формы */

label {
  display: grid;
  gap: 8px;
  font-weight: 850;
  font-size: 14px;
}

input,
textarea,
select {
  width: 100%;
  min-height: 50px;
  padding: 13px 14px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: #f9fbfe;
  color: var(--text);
  font: inherit;
  outline: none;
}

input:focus,
textarea:focus,
select:focus {
  background: white;
  border-color: #8ab6ff;
  box-shadow: 0 0 0 4px rgba(18,104,255,.10);
}

textarea {
  min-height: 112px;
  resize: vertical;
}

.small-note {
  margin: 0;
  color: var(--muted2);
  font-size: 13px;
}

.checks {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.checks label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px;
  border-radius: 16px;
  background: #f6f9fe;
  border: 1px solid var(--line);
}

.checks input {
  width: 18px;
  min-height: 18px;
  accent-color: var(--blue);
}

/* Индивидуальный заказ */

.success-banner {
  margin-top: 22px;
  margin-bottom: -12px;
  padding: 18px 20px;
  background: #eafaf1;
  color: #116b34;
}

.success-banner span {
  display: block;
  margin-top: 5px;
}

.custom-hero-clean {
  margin-top: 42px;
  margin-bottom: 26px;
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 22px;
}

.custom-copy {
  padding: clamp(28px, 5vw, 58px);
}

.custom-copy p {
  max-width: 720px;
  font-size: 19px;
}

.custom-side-card {
  padding: 30px;
  background: var(--black);
  color: white;
}

.custom-side-card h3 {
  font-size: 30px;
  margin-bottom: 24px;
}

.side-list {
  display: grid;
  gap: 14px;
}

.side-list div {
  padding: 18px;
  border-radius: 20px;
  background: rgba(255,255,255,.08);
}

.side-list b {
  display: block;
  margin-bottom: 6px;
  font-size: 18px;
}

.side-list span {
  color: rgba(255,255,255,.72);
}

.examples-clean {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 24px;
  align-items: center;
}

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

.examples-list-clean div {
  padding: 16px 18px;
  border-radius: 18px;
  background: #f6f9fe;
  border: 1px solid var(--line);
  font-weight: 850;
}

.final-cta-clean {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: center;
  background: linear-gradient(135deg, rgba(18,104,255,.10), rgba(255,255,255,.96));
}

.request-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: none;
}

.request-modal:target {
  display: block;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(5,7,11,.58);
}

.request-box {
  position: fixed;
  left: 50%;
  top: 50%;
  width: min(820px, calc(100% - 28px));
  max-height: 88vh;
  overflow-y: auto;
  transform: translate(-50%, -50%);
  padding: clamp(22px, 4vw, 34px);
  border-radius: 30px;
  background: white;
  box-shadow: 0 34px 110px rgba(0,0,0,.24);
}

.request-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 20px;
}

.modal-x {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: #f1f5fb;
  color: var(--text);
  font-size: 30px;
}

.request-form {
  display: grid;
  gap: 14px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

/* Checkout */

.checkout {
  margin-top: 54px;
  margin-bottom: 54px;
  width: min(760px, calc(100% - 28px));
}

.checkout-box {
  padding: clamp(26px, 5vw, 42px);
}

.checkout-list {
  display: grid;
  gap: 10px;
  margin: 24px 0;
}

.checkout-list p {
  margin: 0;
  padding: 16px;
  border-radius: 18px;
  background: #f6f9fe;
  border: 1px solid var(--line);
}

.checkout-list span {
  display: block;
  color: var(--muted2);
  font-size: 13px;
  font-weight: 850;
}

.checkout-list b {
  color: var(--text);
}

.payment-note {
  margin: 22px 0;
  padding: 18px;
  border-radius: 20px;
  background: #fff7df;
  border: 1px solid #f1dda5;
  color: #725817;
}

/* FAQ */

.faq-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.faq-grid details {
  padding: 18px 20px;
  border-radius: 20px;
  background: #f8fbff;
  border: 1px solid var(--line);
}

.faq-grid summary {
  cursor: pointer;
  font-weight: 900;
}

/* Footer */

.footer {
  margin-top: 36px;
  margin-bottom: 24px;
  padding: 24px 0;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 20px;
  color: var(--muted);
}

.footer b {
  display: block;
  color: var(--text);
  margin-bottom: 5px;
}

.footer p {
  max-width: 480px;
  margin: 0;
  font-size: 14px;
}

/* Tablet */

@media (max-width: 980px) {
  .header {
    grid-template-columns: 1fr auto;
  }

  .nav {
    grid-column: 1 / -1;
    justify-self: stretch;
    overflow-x: auto;
  }

  .hero,
  .project-shell,
  .custom-hero-clean,
  .examples-clean {
    grid-template-columns: 1fr;
  }

  .project-price-card {
    position: static;
  }

  .project-info-layout,
  .grid,
  .features,
  .order-types,
  .service-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .steps,
  .process-grid-clean {
    grid-template-columns: repeat(2, 1fr);
  }

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

/* Mobile */

@media (max-width: 640px) {
  .header {
    width: calc(100% - 20px);
    margin: 10px auto;
    padding: 10px;
    border-radius: 20px;
  }

  .logo-mark {
    width: 40px;
    height: 40px;
  }

  .logo small {
    display: none;
  }

  .header-btn {
    padding: 10px 13px;
    font-size: 14px;
  }

  .nav {
    gap: 4px;
    padding: 4px;
  }

  .nav a {
    padding: 8px 10px;
    font-size: 13px;
    white-space: nowrap;
  }

  .hero,
  .features,
  .section,
  .custom,
  .page-hero,
  .checkout,
  .footer,
  .project-shell,
  .project-info-layout,
  .project-note,
  .custom-hero-clean,
  .custom-detail-section,
  .process-clean,
  .examples-clean,
  .final-cta-clean,
  .success-banner {
    width: calc(100% - 20px);
  }

  .hero,
  .project-shell,
  .custom-hero-clean {
    margin-top: 24px;
    gap: 14px;
  }

  .hero-content,
  .hero-card,
  .section,
  .custom,
  .page-hero,
  .checkout-box,
  .project-main-card,
  .project-price-card,
  .project-info-block,
  .project-note,
  .custom-copy,
  .custom-side-card,
  .custom-detail-section,
  .process-clean,
  .examples-clean,
  .final-cta-clean {
    border-radius: 24px;
  }

  .hero-content,
  .custom-copy,
  .project-main-card,
  .project-price-card {
    padding: 24px 20px;
  }

  h1 {
    font-size: 38px;
    letter-spacing: -1.8px;
  }

  h2 {
    font-size: 30px;
    letter-spacing: -1px;
  }

  .hero-content p,
  .custom-copy p,
  .page-hero p,
  .project-lead {
    font-size: 16px;
  }

  .hero-actions,
  .custom-actions,
  .project-actions {
    flex-direction: column;
  }

  .btn {
    width: 100%;
  }

  .stats,
  .custom-points,
  .grid,
  .features,
  .order-types,
  .service-grid,
  .steps,
  .process-grid-clean,
  .project-info-layout,
  .faq-grid,
  .checks,
  .form-row {
    grid-template-columns: 1fr;
  }

  .section-head,
  .catalog-head,
  .final-cta-clean {
    align-items: flex-start;
    flex-direction: column;
  }

  .project-card {
    min-height: auto;
  }

  .project-bottom {
    flex-direction: column;
    align-items: stretch;
  }

  .project-bottom a {
    justify-content: center;
  }

  .request-box {
    left: 10px;
    right: 10px;
    bottom: 0;
    top: auto;
    width: auto;
    max-height: 92vh;
    transform: none;
    border-radius: 24px 24px 0 0;
  }

  .footer {
    flex-direction: column;
  }
}

.price-benefits {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}

.price-benefits div {
  padding: 14px;
  border-radius: 16px;
  background: #f6f9fe;
  border: 1px solid var(--line);
}

.price-benefits b {
  display: block;
  font-size: 14px;
  margin-bottom: 5px;
}

.price-benefits span {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.modal-project-summary {
  margin-bottom: 18px;
  padding: 16px;
  border-radius: 18px;
  background: #f6f9fe;
  border: 1px solid var(--line);
  display: grid;
  gap: 6px;
}

.modal-project-summary span {
  color: var(--blue);
  font-size: 13px;
  font-weight: 900;
}

.modal-project-summary b {
  font-size: 18px;
  line-height: 1.25;
}

.modal-project-summary em {
  color: var(--text);
  font-style: normal;
  font-size: 24px;
  font-weight: 950;
}

.catalog-section .grid {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.catalog-filters {
  margin-bottom: 24px;
  padding: 18px;
  border-radius: 24px;
  background: #f6f9fe;
  border: 1px solid var(--line);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 14px;
  align-items: end;
}

.catalog-filters label {
  display: grid;
  gap: 8px;
}

.catalog-filters label span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.filter-actions {
  display: flex;
  gap: 10px;
}

.filter-actions .btn {
  min-height: 50px;
  white-space: nowrap;
}

.empty-catalog {
  padding: 34px;
  border-radius: 24px;
  background: #f8fbff;
  border: 1px solid var(--line);
  text-align: center;
}

.empty-catalog h3 {
  font-size: 26px;
  margin-bottom: 10px;
}

.empty-catalog p {
  margin-bottom: 20px;
}

@media (max-width: 980px) {
  .catalog-filters {
    grid-template-columns: 1fr 1fr;
  }

  .filter-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .catalog-filters {
    grid-template-columns: 1fr;
    padding: 14px;
    border-radius: 20px;
  }

  .filter-actions {
    flex-direction: column;
  }

  .filter-actions .btn {
    width: 100%;
  }
}

.catalog-hero-new {
  width: min(1180px, calc(100% - 28px));
  margin: 42px auto 22px;
  padding: clamp(28px, 5vw, 52px);
  border-radius: var(--radius-xl);
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,255,255,.86)),
    radial-gradient(circle at 90% 10%, rgba(18,104,255,.12), transparent 34%);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  display: grid;
  grid-template-columns: 1fr 220px;
  gap: 24px;
  align-items: center;
}

.catalog-hero-new p {
  max-width: 720px;
  font-size: 18px;
  margin-bottom: 0;
}

.catalog-hero-card {
  padding: 24px;
  border-radius: 26px;
  background: var(--black);
  color: white;
  text-align: center;
}

.catalog-hero-card b {
  display: block;
  font-size: 52px;
  line-height: 1;
  letter-spacing: -2px;
}

.catalog-hero-card span {
  display: block;
  margin-top: 8px;
  color: rgba(255,255,255,.72);
}

.catalog-wrap {
  width: min(1180px, calc(100% - 28px));
  margin: 22px auto 34px;
  display: grid;
  grid-template-columns: 310px 1fr;
  gap: 22px;
  align-items: start;
}

.catalog-filter-card {
  position: sticky;
  top: 104px;
  padding: 22px;
  border-radius: 28px;
  background: white;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  display: grid;
  gap: 14px;
}

.filter-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}

.filter-title b {
  font-size: 24px;
  letter-spacing: -.7px;
}

.filter-title a {
  color: var(--blue);
  font-weight: 900;
  font-size: 14px;
}

.catalog-filter-card label {
  display: grid;
  gap: 8px;
}

.catalog-filter-card label span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.search-label input {
  background: #fff;
}

.active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding-top: 6px;
}

.active-filters > span {
  width: 100%;
  color: var(--muted2);
  font-size: 12px;
  font-weight: 900;
}

.active-filters em {
  padding: 7px 9px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue2);
  font-style: normal;
  font-size: 12px;
  font-weight: 900;
}

.catalog-results {
  min-width: 0;
}

.catalog-results-head {
  margin-bottom: 18px;
  padding: 20px 22px;
  border-radius: 24px;
  background: white;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
}

.catalog-results-head b {
  display: block;
  font-size: 24px;
  letter-spacing: -.7px;
}

.catalog-results-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.catalog-results-head em {
  padding: 10px 13px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue2);
  font-style: normal;
  font-weight: 950;
  white-space: nowrap;
}

.catalog-grid-new {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}

.catalog-grid-new .project-card {
  min-height: 340px;
}

.empty-catalog {
  padding: 34px;
  border-radius: 28px;
  background: white;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  text-align: center;
}

.empty-catalog h3 {
  font-size: 26px;
  margin-bottom: 10px;
}

.empty-catalog p {
  margin-bottom: 20px;
}

@media (max-width: 980px) {
  .catalog-hero-new {
    grid-template-columns: 1fr;
  }

  .catalog-hero-card {
    text-align: left;
  }

  .catalog-wrap {
    grid-template-columns: 1fr;
  }

  .catalog-filter-card {
    position: static;
  }

  .catalog-filter-card {
    grid-template-columns: repeat(2, 1fr);
  }

  .filter-title,
  .search-label,
  .catalog-filter-card .full,
  .active-filters {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .catalog-hero-new,
  .catalog-wrap {
    width: calc(100% - 20px);
  }

  .catalog-hero-new {
    margin-top: 24px;
    padding: 24px 20px;
    border-radius: 24px;
  }

  .catalog-hero-card b {
    font-size: 42px;
  }

  .catalog-filter-card {
    grid-template-columns: 1fr;
    border-radius: 24px;
    padding: 18px;
  }

  .filter-title,
  .search-label,
  .catalog-filter-card .full,
  .active-filters {
    grid-column: auto;
  }

  .catalog-results-head {
    align-items: flex-start;
    flex-direction: column;
    border-radius: 24px;
  }

  .catalog-grid-new {
    grid-template-columns: 1fr;
  }
}

.home-hero-v2 {
  width: min(1180px, calc(100% - 28px));
  margin: 42px auto 22px;
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 22px;
  align-items: stretch;
}

.home-hero-copy,
.home-hero-visual {
  min-height: 620px;
  border-radius: var(--radius-xl);
  border: 1px solid var(--line);
  box-shadow: var(--shadow2);
}

.home-hero-copy {
  padding: clamp(30px, 5vw, 58px);
  background:
    linear-gradient(135deg, rgba(255,255,255,.97), rgba(255,255,255,.88)),
    radial-gradient(circle at 90% 8%, rgba(18,104,255,.13), transparent 34%);
  animation: softAppear .55s ease both;
}

.home-hero-copy p {
  max-width: 760px;
  font-size: 19px;
  margin-bottom: 0;
}

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

.home-hero-stats {
  margin-top: 42px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.home-hero-stats div {
  padding: 16px;
  border-radius: 20px;
  background: #f5f8fd;
  border: 1px solid var(--line);
}

.home-hero-stats b {
  display: block;
  font-size: 22px;
}

.home-hero-stats span {
  display: block;
  margin-top: 5px;
  color: var(--muted2);
  font-size: 13px;
}

.home-hero-visual {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 70% 20%, rgba(18,104,255,.36), transparent 30%),
    linear-gradient(135deg, #05070b, #111827);
  color: white;
  animation: softAppear .7s ease both;
}

.home-hero-visual::before {
  content: "";
  position: absolute;
  inset: 26px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.10);
}

.visual-center {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 210px;
  height: 210px;
  transform: translate(-50%, -50%);
  border-radius: 42px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 24px;
  backdrop-filter: blur(10px);
}

.visual-logo {
  width: 62px;
  height: 62px;
  border-radius: 20px;
  background: white;
  color: var(--black);
  display: grid;
  place-items: center;
  font-size: 30px;
  font-weight: 950;
}

.visual-center b {
  margin-top: 12px;
  font-size: 22px;
}

.visual-center span {
  color: rgba(255,255,255,.68);
  font-size: 13px;
}

.floating-card {
  position: absolute;
  width: 245px;
  padding: 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.94);
  color: var(--text);
  box-shadow: 0 24px 70px rgba(0,0,0,.26);
  animation: floatCard 4.8s ease-in-out infinite;
}

.floating-card small {
  display: block;
  color: var(--blue);
  font-weight: 950;
  margin-bottom: 8px;
}

.floating-card b {
  display: block;
  line-height: 1.15;
  font-size: 18px;
}

.floating-card span {
  display: inline-flex;
  margin-top: 14px;
  padding: 7px 10px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue2);
  font-weight: 950;
  font-size: 13px;
}

.card-a {
  left: 28px;
  top: 58px;
}

.card-b {
  right: 28px;
  top: 210px;
  animation-delay: .7s;
}

.card-c {
  left: 68px;
  bottom: 70px;
  animation-delay: 1.2s;
}

.format-strip {
  width: min(1180px, calc(100% - 28px));
  margin: 22px auto;
  padding: 14px;
  display: flex;
  gap: 10px;
  overflow-x: auto;
  border-radius: 24px;
  background: white;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

.format-strip a {
  white-space: nowrap;
  padding: 12px 15px;
  border-radius: 999px;
  background: #f3f6fb;
  color: var(--text);
  font-weight: 850;
}

.format-strip a:hover {
  background: var(--blue);
  color: white;
}

.popular-section .grid {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

@keyframes floatCard {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-12px) rotate(-1deg);
  }
}

@keyframes softAppear {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .floating-card,
  .home-hero-copy,
  .home-hero-visual {
    animation: none;
  }
}

@media (max-width: 980px) {
  .home-hero-v2 {
    grid-template-columns: 1fr;
  }

  .home-hero-copy,
  .home-hero-visual {
    min-height: auto;
  }

  .home-hero-visual {
    min-height: 520px;
  }
}

@media (max-width: 640px) {
  .home-hero-v2,
  .format-strip {
    width: calc(100% - 20px);
  }

  .home-hero-v2 {
    margin-top: 24px;
    gap: 14px;
  }

  .home-hero-copy,
  .home-hero-visual {
    border-radius: 24px;
  }

  .home-hero-copy {
    padding: 26px 20px;
  }

  .home-hero-actions {
    flex-direction: column;
  }

  .home-hero-stats {
    grid-template-columns: 1fr;
    margin-top: 28px;
  }

  .home-hero-visual {
    min-height: 560px;
  }

  .floating-card {
    width: 230px;
  }

  .card-a {
    left: 18px;
    top: 38px;
  }

  .card-b {
    right: 18px;
    top: 190px;
  }

  .card-c {
    left: 28px;
    bottom: 44px;
  }

  .visual-center {
    width: 180px;
    height: 180px;
  }
}

.logo-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 17px;
  background: linear-gradient(135deg, #05070b, #182237);
  box-shadow: 0 12px 28px rgba(18, 32, 56, .18);
  overflow: hidden;
}

.logo-mark svg {
  width: 36px;
  height: 36px;
  display: block;
}

.logo strong {
  font-size: 19px;
  letter-spacing: -.5px;
}

.logo small {
  font-size: 12px;
}

@media (max-width: 640px) {
  .logo-mark {
    width: 42px;
    height: 42px;
    border-radius: 15px;
  }

  .logo-mark svg {
    width: 32px;
    height: 32px;
  }
}

.logo-w {
  width: 50px;
  height: 50px;
  border-radius: 18px;
  background: transparent;
  box-shadow: 0 14px 32px rgba(18, 32, 56, .20);
}

.logo-w svg {
  width: 50px;
  height: 50px;
  display: block;
}

@media (max-width: 640px) {
  .logo-w {
    width: 44px;
    height: 44px;
    border-radius: 16px;
  }

  .logo-w svg {
    width: 44px;
    height: 44px;
  }
}

.logo-image-wrap {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.logo-image-wrap img {
  width: 54px;
  height: 54px;
  display: block;
}

.visual-logo-img {
  width: 86px;
  height: 86px;
  display: block;
  margin-bottom: 12px;
  filter: drop-shadow(0 14px 26px rgba(18, 104, 255, .24));
}

.footer-brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.footer-brand img {
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
}

@media (max-width: 640px) {
  .logo-image-wrap,
  .logo-image-wrap img {
    width: 46px;
    height: 46px;
  }

  .visual-logo-img {
    width: 74px;
    height: 74px;
  }

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

.small-float-card {
  width: 205px;
  padding: 15px;
}

.small-float-card b {
  font-size: 16px;
}

.small-float-card span {
  margin-top: 10px;
  font-size: 12px;
}

.card-d {
  right: 38px;
  bottom: 42px;
  animation-delay: .3s;
}

.card-e {
  left: 28px;
  top: 238px;
  animation-delay: 1.5s;
}

.card-f {
  right: 72px;
  top: 48px;
  animation-delay: 2s;
}

.card-g {
  left: 210px;
  bottom: 34px;
  animation-delay: 2.4s;
}

.visual-bottom-panel {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 24px;
  padding: 16px 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.visual-bottom-panel b {
  display: block;
  color: white;
  margin-bottom: 4px;
}

.visual-bottom-panel span {
  color: rgba(255,255,255,.66);
  font-size: 13px;
}

.visual-bottom-panel a {
  color: white;
  font-weight: 950;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .home-hero-visual {
    min-height: 650px;
  }

  .card-g {
    left: 250px;
  }
}

@media (max-width: 640px) {
  .home-hero-visual {
    min-height: 720px;
  }

  .floating-card {
    width: 215px;
  }

  .small-float-card {
    width: 190px;
  }

  .card-a {
    left: 16px;
    top: 28px;
  }

  .card-f {
    right: 16px;
    top: 102px;
  }

  .card-e {
    left: 18px;
    top: 230px;
  }

  .card-b {
    right: 14px;
    top: 292px;
  }

  .card-c {
    left: 20px;
    bottom: 150px;
  }

  .card-d {
    right: 16px;
    bottom: 116px;
  }

  .card-g {
    display: none;
  }

  .visual-center {
    top: 52%;
  }

  .visual-bottom-panel {
    left: 16px;
    right: 16px;
    bottom: 16px;
    align-items: flex-start;
    flex-direction: column;
  }
}

.checkout-success {
  text-align: left;
}

.success-icon {
  width: 64px;
  height: 64px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  background: #eafaf1;
  color: #11823b;
  font-size: 34px;
  font-weight: 950;
  margin-bottom: 18px;
  border: 1px solid #bdeccd;
}

.checkout-main-text {
  max-width: 620px;
  font-size: 18px;
  margin-top: 14px;
}

.payment-note b {
  color: #5c430c;
}

.checkout-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 22px 0;
}

.checkout-steps div {
  padding: 16px;
  border-radius: 18px;
  background: #f6f9fe;
  border: 1px solid var(--line);
}

.checkout-steps b {
  display: block;
  color: var(--blue);
  font-size: 20px;
  margin-bottom: 8px;
}

.checkout-steps span {
  color: var(--muted);
  line-height: 1.45;
}

@media (max-width: 640px) {
  .checkout-steps {
    grid-template-columns: 1fr;
  }
}

.hero-clear-list {
  margin-top: 26px;
  display: grid;
  gap: 10px;
  max-width: 720px;
}

.hero-clear-list div {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 13px 14px;
  border-radius: 17px;
  background: #f6f9fe;
  border: 1px solid var(--line);
}

.hero-clear-list b {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 10px;
  background: var(--blue);
  color: white;
  font-size: 14px;
}

.hero-clear-list span {
  color: var(--text);
  font-weight: 800;
}

.what-is-washproject {
  width: min(1180px, calc(100% - 28px));
  margin: 22px auto;
  padding: clamp(24px, 4vw, 38px);
  border-radius: var(--radius-xl);
  background: white;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 24px;
  align-items: center;
}

.what-is-washproject p {
  max-width: 620px;
  font-size: 17px;
}

.what-is-grid {
  display: grid;
  gap: 12px;
}

.what-is-grid div {
  padding: 18px;
  border-radius: 20px;
  background: #f6f9fe;
  border: 1px solid var(--line);
}

.what-is-grid b {
  display: block;
  font-size: 18px;
  margin-bottom: 6px;
}

.what-is-grid span {
  color: var(--muted);
  line-height: 1.45;
}

@media (max-width: 980px) {
  .what-is-washproject {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .what-is-washproject {
    width: calc(100% - 20px);
    border-radius: 24px;
  }

  .hero-clear-list div {
    align-items: flex-start;
  }
}

.clean-hero .home-hero-copy p {
  max-width: 680px;
}

.simple-hero-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.simple-hero-tags span {
  padding: 10px 12px;
  border-radius: 999px;
  background: #f3f6fb;
  border: 1px solid var(--line);
  color: var(--text);
  font-size: 14px;
  font-weight: 850;
}

.simple-explain {
  width: min(1180px, calc(100% - 28px));
  margin: 22px auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.simple-explain div {
  padding: 20px;
  border-radius: 24px;
  background: white;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

.simple-explain b {
  display: block;
  font-size: 19px;
  margin-bottom: 6px;
}

.simple-explain span {
  color: var(--muted);
  line-height: 1.45;
}

@media (max-width: 980px) {
  .simple-explain {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .simple-explain {
    width: calc(100% - 20px);
  }

  .simple-hero-tags {
    margin-top: 22px;
  }
}

.mobile-hero-preview {
  display: none;
}

@media (max-width: 640px) {
  .mobile-hero-preview {
    display: block;
    margin-top: 22px;
    padding: 16px;
    border-radius: 22px;
    background: #f6f9fe;
    border: 1px solid var(--line);
  }

  .mobile-preview-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
  }

  .mobile-preview-head b {
    font-size: 16px;
  }

  .mobile-preview-head a {
    color: var(--blue);
    font-weight: 900;
    font-size: 13px;
    white-space: nowrap;
  }

  .mobile-preview-cards {
    display: grid;
    gap: 10px;
  }

  .mobile-preview-cards a {
    padding: 14px;
    border-radius: 18px;
    background: white;
    border: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
  }

  .mobile-preview-cards span {
    color: var(--text);
    font-weight: 850;
    line-height: 1.25;
  }

  .mobile-preview-cards b {
    color: var(--blue);
    font-size: 15px;
    white-space: nowrap;
  }

  .mobile-hero-links {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    margin-top: 12px;
    padding-bottom: 2px;
  }

  .mobile-hero-links a {
    padding: 9px 11px;
    border-radius: 999px;
    background: var(--blue-soft);
    color: var(--blue2);
    font-size: 13px;
    font-weight: 900;
    white-space: nowrap;
  }

  /* На телефоне чуть уменьшим пустоту первого экрана */
  .clean-hero .home-hero-copy {
    padding-bottom: 20px;
  }

  .simple-hero-tags {
    gap: 8px;
  }

  .simple-hero-tags span {
    font-size: 13px;
    padding: 9px 10px;
  }
}

@media (max-width: 640px) {
  .mobile-hero-preview {
    display: block;
    margin-top: 22px;
    padding: 18px;
    border-radius: 26px;
    background:
      radial-gradient(circle at 88% 0%, rgba(255,255,255,.32), transparent 34%),
      linear-gradient(135deg, #0b63ff, #003aa3);
    border: 0;
    box-shadow: 0 22px 50px rgba(18,104,255,.26);
    color: white;
    overflow: hidden;
    position: relative;
  }

  .mobile-hero-preview::after {
    content: "";
    position: absolute;
    width: 160px;
    height: 160px;
    right: -70px;
    bottom: -70px;
    border-radius: 50%;
    border: 28px solid rgba(255,255,255,.10);
  }

  .mobile-showcase-top {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 16px;
  }

  .mobile-showcase-top span {
    display: block;
    color: rgba(255,255,255,.72);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 5px;
  }

  .mobile-showcase-top b {
    display: block;
    max-width: 220px;
    color: white;
    font-size: 20px;
    line-height: 1.08;
    letter-spacing: -.5px;
  }

  .mobile-showcase-top img {
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    filter: drop-shadow(0 12px 24px rgba(0,0,0,.20));
  }

  .mobile-price-row {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }

  .mobile-price-row a {
    padding: 12px 10px;
    border-radius: 18px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.18);
    color: white;
    text-align: center;
    backdrop-filter: blur(8px);
  }

  .mobile-price-row small {
    display: block;
    color: rgba(255,255,255,.72);
    font-size: 11px;
    font-weight: 850;
    margin-bottom: 5px;
  }

  .mobile-price-row b {
    display: block;
    color: white;
    font-size: 15px;
    line-height: 1.1;
  }

  .mobile-showcase-note {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 14px;
  }

  .mobile-showcase-note span {
    padding: 8px 9px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.88);
    font-size: 12px;
    font-weight: 850;
  }

  .simple-hero-tags {
    display: none;
  }
}

@media (max-width: 640px) {
  .mobile-study-img {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 330px;
    display: block;
    margin: 4px auto 14px;
    filter: drop-shadow(0 16px 30px rgba(0,0,0,.16));
  }

  .mobile-price-row {
    margin-top: 6px;
  }
}

.compact-types {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 980px) {
  .compact-types {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .compact-types {
    grid-template-columns: 1fr;
  }
}

.footer-seo-links {
  width: min(1180px, calc(100% - 28px));
  margin: -12px auto 24px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.footer-seo-links a {
  padding: 9px 11px;
  border-radius: 999px;
  background: #f1f5fb;
  color: var(--muted);
  font-size: 13px;
  font-weight: 850;
}

.footer-seo-links a:hover {
  background: var(--blue-soft);
  color: var(--blue2);
}

.seo-hero .seo-actions {
  margin-top: 26px;
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.seo-text p {
  max-width: 860px;
  font-size: 17px;
}

@media (max-width: 640px) {
  .footer-seo-links {
    width: calc(100% - 20px);
  }

  .seo-hero .seo-actions {
    flex-direction: column;
  }
}

.trust-page {
  width: min(1180px, calc(100% - 28px));
  margin: 26px auto;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 18px;
}

.trust-card,
.legal-card {
  background: white;
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow);
}

.trust-card {
  padding: 26px;
}

.main-trust-card {
  grid-row: span 2;
}

.trust-card h2,
.trust-card h3 {
  margin-bottom: 14px;
}

.trust-card ul {
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  line-height: 1.8;
}

.trust-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 22px;
}

.trust-link {
  color: var(--blue);
  font-weight: 900;
}

.legal-page {
  width: min(920px, calc(100% - 28px));
  margin: 26px auto;
}

.legal-card {
  padding: clamp(24px, 4vw, 42px);
}

.legal-card h2 {
  font-size: 26px;
  margin: 26px 0 10px;
}

.legal-card h2:first-child {
  margin-top: 0;
}

.legal-card p {
  font-size: 16px;
}

.legal-note {
  margin-top: 28px;
  padding: 14px;
  border-radius: 16px;
  background: #f6f9fe;
  border: 1px solid var(--line);
}

.footer-doc-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.footer-doc-links a {
  color: var(--blue);
  font-size: 13px;
  font-weight: 850;
}

@media (max-width: 760px) {
  .trust-page {
    width: calc(100% - 20px);
    grid-template-columns: 1fr;
  }

  .main-trust-card {
    grid-row: auto;
  }

  .legal-page {
    width: calc(100% - 20px);
  }

  .trust-actions {
    flex-direction: column;
  }

  .trust-actions .btn {
    width: 100%;
  }
}

/* Premium command-room hero */
.studio-hero,
.studio-hero *,
.studio-transition,
.studio-transition * {
  letter-spacing: 0;
}

.home-hero-v2.studio-hero {
  width: min(1180px, calc(100% - 28px));
  min-height: 640px;
  margin: 28px auto 0;
  padding: 16px;
  gap: 16px;
  align-items: stretch;
  border-radius: 34px;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(116deg, rgba(5,5,6,.98) 0%, rgba(9,11,15,.98) 44%, rgba(21,24,29,.96) 100%),
    repeating-linear-gradient(90deg, rgba(216,181,109,.11) 0 1px, transparent 1px 96px),
    repeating-linear-gradient(0deg, rgba(127,231,255,.08) 0 1px, transparent 1px 88px);
  border: 1px solid rgba(216,181,109,.22);
  box-shadow: 0 34px 110px rgba(0,0,0,.30);
}

.home-hero-v2.studio-hero::before,
.home-hero-v2.studio-hero::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: -1;
}

.home-hero-v2.studio-hero::before {
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0%, rgba(241,212,147,.10) 46%, transparent 58%),
    linear-gradient(154deg, rgba(127,231,255,.10) 0%, transparent 31%),
    linear-gradient(24deg, transparent 64%, rgba(216,181,109,.14) 100%);
  opacity: .72;
  animation: studioLightPass 8s ease-in-out infinite;
}

.home-hero-v2.studio-hero::after {
  inset: 16px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 26px;
}

.studio-hero .home-hero-copy,
.studio-hero .home-hero-visual {
  min-height: auto;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 26px;
  box-shadow: none;
  animation: studioSceneIn .7s cubic-bezier(.2,.78,.18,1) both;
}

.studio-hero-copy {
  padding: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #f3efe5;
  background:
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.018)),
    linear-gradient(180deg, rgba(5,5,6,.74), rgba(5,5,6,.26));
}

.studio-kicker {
  width: fit-content;
  margin-bottom: 24px;
  background: rgba(216,181,109,.10);
  color: #f1d493;
  border-color: rgba(216,181,109,.34);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}

.studio-hero h1 {
  max-width: 760px;
  color: #f3efe5;
  font-size: 58px;
  line-height: .98;
  letter-spacing: 0;
}

.studio-hero-copy p,
.clean-hero .studio-hero-copy p {
  max-width: 640px;
  margin: 24px 0 0;
  color: rgba(243,239,229,.78);
  font-size: 19px;
  line-height: 1.62;
}

.studio-hero-actions {
  margin-top: 34px;
}

.studio-hero .btn {
  min-height: 56px;
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}

.studio-hero .studio-primary {
  color: #090a0c;
  background: linear-gradient(135deg, #f1d493, #d8b56d 52%, #a9853d);
  box-shadow: 0 18px 48px rgba(216,181,109,.24);
}

.studio-hero .studio-primary::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-120%) skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.36), transparent);
  transition: transform .55s ease;
}

.studio-hero .studio-primary:hover::after,
.studio-hero .studio-primary:focus-visible::after {
  transform: translateX(120%) skewX(-18deg);
}

.studio-hero .studio-secondary {
  color: #f3efe5;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(243,239,229,.22);
}

.studio-hero .studio-secondary:hover,
.studio-hero .studio-secondary:focus-visible {
  color: #f1d493;
  border-color: rgba(241,212,147,.50);
  background: rgba(241,212,147,.07);
}

.hero-micro-cta {
  min-height: 56px;
  display: inline-flex;
  align-items: center;
  color: rgba(241,212,147,.92);
  font-weight: 900;
  text-decoration: none;
  border-bottom: 1px solid rgba(241,212,147,.38);
  transition: color .22s ease, border-color .22s ease, transform .22s ease;
}

.hero-micro-cta:hover,
.hero-micro-cta:focus-visible {
  color: #fff4c8;
  border-color: rgba(255,244,200,.72);
  transform: translateY(-1px);
}

.studio-proof {
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  max-width: 690px;
}

.studio-proof span {
  min-height: 68px;
  padding: 15px;
  border-radius: 16px;
  color: rgba(243,239,229,.70);
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.09);
}

.studio-proof b {
  display: block;
  margin-bottom: 5px;
  color: #f3efe5;
  font-size: 18px;
}

.studio-command {
  position: relative;
  overflow: hidden;
  padding: 26px;
  color: #f3efe5;
  background:
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.035)),
    linear-gradient(135deg, rgba(127,231,255,.10), transparent 42%),
    linear-gradient(315deg, rgba(216,181,109,.16), transparent 48%);
  animation-delay: .08s;
}

.studio-command::before {
  content: "";
  position: absolute;
  left: 26px;
  right: 26px;
  top: 92px;
  height: 1px;
  background: linear-gradient(90deg, rgba(216,181,109,.75), rgba(127,231,255,.45), transparent);
  transform-origin: left;
  animation: studioTrace .95s .35s cubic-bezier(.2,.78,.18,1) both;
}

.studio-command-top {
  position: relative;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 34px;
}

.studio-command-top span {
  color: #7fe7ff;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-command-top b {
  max-width: 210px;
  text-align: right;
  color: #f1d493;
  font-size: 22px;
  line-height: 1.1;
}

.command-flow {
  position: relative;
  z-index: 3;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
  list-style: none;
  counter-reset: none;
}

.command-flow li {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 14px;
  align-items: start;
  padding: 16px;
  border-radius: 18px;
  background: #090a0c;
  border: 1px solid rgba(255,255,255,.09);
  opacity: 0;
  transform: translateY(16px);
  animation: studioStepIn .6s cubic-bezier(.2,.78,.18,1) both;
}

.command-flow li:nth-child(1) {
  animation-delay: .30s;
}

.command-flow li:nth-child(2) {
  animation-delay: .42s;
}

.command-flow li:nth-child(3) {
  animation-delay: .54s;
}

.command-flow li:nth-child(4) {
  animation-delay: .66s;
}

.command-flow li > span {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #050506;
  background: linear-gradient(135deg, #f1d493, #d8b56d);
  font-weight: 950;
}

.command-flow b {
  display: block;
  color: #f3efe5;
  font-size: 18px;
  line-height: 1.2;
}

.command-flow p {
  margin: 6px 0 0;
  color: rgba(243,239,229,.66);
  font-size: 14px;
  line-height: 1.48;
}

.showroom-cards {
  position: absolute;
  z-index: 1;
  left: 36px;
  right: 36px;
  bottom: 26px;
  min-height: 150px;
  pointer-events: none;
}

.showroom-card {
  position: absolute;
  width: 245px;
  padding: 16px;
  border-radius: 18px;
  color: #f3efe5;
  background:
    linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.045)),
    linear-gradient(180deg, rgba(5,5,6,.72), rgba(5,5,6,.46));
  border: 1px solid rgba(216,181,109,.22);
  box-shadow: 0 22px 60px rgba(0,0,0,.26);
  opacity: 0;
  transform: translateY(24px);
  animation: showroomRise .75s .82s cubic-bezier(.2,.78,.18,1) both;
}

.showroom-card small {
  display: block;
  color: rgba(127,231,255,.84);
  font-size: 12px;
  font-weight: 900;
  margin-bottom: 8px;
}

.showroom-card b {
  display: block;
  font-size: 17px;
  line-height: 1.2;
}

.showroom-card span {
  display: inline-flex;
  margin-top: 12px;
  padding: 7px 9px;
  border-radius: 999px;
  color: #050506;
  background: #f1d493;
  font-size: 12px;
  font-weight: 950;
}

.showroom-card-main {
  left: 0;
  bottom: 0;
}

.showroom-card-secondary {
  right: 0;
  bottom: 44px;
  animation-delay: .94s;
}

.showroom-card-tertiary {
  left: 31%;
  bottom: 86px;
  width: 220px;
  animation-delay: 1.06s;
}

.studio-transition {
  width: min(1180px, calc(100% - 28px));
  margin: 14px auto 22px;
  display: grid;
  grid-template-columns: 1.1fr 1fr 1.15fr;
  gap: 12px;
}

.studio-transition-item {
  min-height: 104px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 22px;
  color: #f3efe5;
  background: linear-gradient(135deg, #0b0d10, #15181d);
  border: 1px solid rgba(216,181,109,.18);
  box-shadow: 0 18px 54px rgba(0,0,0,.13);
}

.studio-transition-item.is-primary {
  color: #050506;
  background: linear-gradient(135deg, #f1d493, #d8b56d);
  border-color: rgba(169,133,61,.38);
}

.studio-transition-item span {
  display: block;
  margin-bottom: 7px;
  color: inherit;
  opacity: .70;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-transition-item b {
  font-size: 19px;
  line-height: 1.22;
}

.studio-transition a:hover,
.studio-transition a:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(241,212,147,.48);
}

@keyframes studioSceneIn {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes studioTrace {
  from {
    transform: scaleX(0);
    opacity: 0;
  }
  to {
    transform: scaleX(1);
    opacity: 1;
  }
}

@keyframes studioStepIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes showroomRise {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes studioLightPass {
  0%, 100% {
    opacity: .54;
    transform: translateX(-3%);
  }
  50% {
    opacity: .88;
    transform: translateX(3%);
  }
}

@media (max-width: 980px) {
  .home-hero-v2.studio-hero {
    min-height: auto;
    grid-template-columns: 1fr;
  }

  .studio-hero h1 {
    font-size: 52px;
  }

  .studio-command {
    min-height: 600px;
  }

  .showroom-cards {
    display: none;
  }
}

@media (max-width: 768px) {
  .home-hero-v2.studio-hero,
  .studio-transition {
    width: calc(100vw - 24px);
  }

  .home-hero-v2.studio-hero {
    margin: 18px 12px 0;
    padding: 10px;
    border-radius: 26px;
  }

  .studio-hero-copy {
    padding: 34px 24px;
  }

  .studio-hero h1 {
    font-size: 44px;
    line-height: 1.02;
  }

  .studio-hero-copy p,
  .clean-hero .studio-hero-copy p {
    font-size: 17px;
  }

  .studio-proof {
    grid-template-columns: 1fr;
    margin-top: 26px;
  }

  .studio-command {
    min-height: auto;
    padding: 20px;
  }

  .studio-command::before,
  .showroom-cards {
    display: none;
  }

  .studio-command-top {
    margin-bottom: 18px;
  }

  .command-flow li {
    grid-template-columns: 48px 1fr;
    padding: 14px;
  }

  .studio-transition {
    grid-template-columns: 1fr;
    margin: 12px 12px 22px;
  }

  .studio-transition-item {
    min-height: 88px;
  }
}

@media (max-width: 430px) {
  .home-hero-v2.studio-hero,
  .studio-transition {
    width: calc(100vw - 20px);
    margin-left: 10px;
    margin-right: 10px;
  }

  .studio-hero-copy,
  .studio-command {
    border-radius: 20px;
  }

  .studio-hero-copy {
    padding: 28px 18px;
  }

  .studio-kicker {
    margin-bottom: 18px;
  }

  .studio-hero h1 {
    font-size: 26px;
  }

  .studio-hero-copy p,
  .clean-hero .studio-hero-copy p {
    font-size: 14px;
  }

  .studio-hero-actions {
    flex-direction: column;
    margin-top: 26px;
  }

  .studio-hero .btn {
    width: 100%;
    min-height: 54px;
    padding: 0 16px;
    text-align: center;
  }

  .studio-proof span {
    min-height: auto;
  }

  .studio-command-top {
    flex-direction: column;
  }

  .studio-command-top b {
    max-width: none;
    text-align: left;
  }

  .command-flow li {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

@media (max-width: 390px) {
  .studio-hero h1 {
    font-size: 24px;
  }

  .studio-hero-copy p,
  .clean-hero .studio-hero-copy p {
    font-size: 15px;
  }

  .studio-transition-item b {
    font-size: 18px;
  }
}

@media (max-width: 360px) {
  .home-hero-v2.studio-hero {
    padding: 8px;
  }

  .studio-hero-copy {
    padding: 24px 16px;
  }

  .studio-hero h1 {
    font-size: 23px;
  }

  .command-flow b {
    font-size: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero-v2.studio-hero::before,
  .studio-hero .home-hero-copy,
  .studio-hero .home-hero-visual,
  .studio-command::before,
  .command-flow li,
  .showroom-card,
  .studio-hero .studio-primary::after {
    animation: none;
    transition: none;
  }

  .command-flow li,
  .showroom-card {
    opacity: 1;
    transform: none;
  }
}

/* Premium responsive header */
.site-header,
.site-header *,
.primary-nav,
.primary-nav * {
  letter-spacing: 0;
}

.site-header {
  width: min(1180px, calc(100% - 28px));
  margin: 16px auto 28px;
  padding: 10px;
  grid-template-columns: minmax(245px, auto) minmax(0, 1fr) auto;
  gap: 14px;
  color: #f3efe5;
  background:
    linear-gradient(135deg, rgba(5,5,6,.92), rgba(17,19,24,.88)),
    linear-gradient(90deg, rgba(216,181,109,.08), transparent 45%, rgba(127,231,255,.06));
  border: 1px solid rgba(216,181,109,.18);
  border-radius: 24px;
  box-shadow: 0 22px 70px rgba(0,0,0,.20);
  backdrop-filter: blur(16px);
}

.site-header .logo {
  min-width: 0;
  color: #f3efe5;
}

.site-header .logo strong {
  color: #f3efe5;
  font-size: 18px;
  line-height: 1.05;
}

.site-header .logo small {
  color: rgba(243,239,229,.58);
}

.site-header .logo-image-wrap {
  box-shadow: 0 14px 34px rgba(0,0,0,.26);
}

.primary-nav {
  justify-self: center;
  display: flex;
  gap: 4px;
  padding: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
}

.primary-nav a {
  color: rgba(243,239,229,.72);
  padding: 10px 13px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 850;
  white-space: nowrap;
  transition: color .18s ease, background .18s ease, transform .18s ease;
}

.primary-nav a:hover,
.primary-nav a:focus-visible {
  color: #f3efe5;
  background: rgba(255,255,255,.10);
}

.primary-nav a:focus-visible,
.site-header .header-btn:focus-visible,
.mobile-menu-toggle:focus-visible {
  outline: 2px solid rgba(241,212,147,.86);
  outline-offset: 3px;
}

.site-header .header-btn {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border-radius: 15px;
  color: #050506;
  background: linear-gradient(135deg, #f1d493, #d8b56d 55%, #a9853d);
  border: 1px solid rgba(241,212,147,.34);
  box-shadow: 0 16px 36px rgba(216,181,109,.16);
  font-weight: 950;
  transition: transform .18s ease, box-shadow .18s ease;
}

.site-header .header-btn:hover,
.site-header .header-btn:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 20px 44px rgba(216,181,109,.22);
}

.mobile-menu-toggle,
.nav-mobile-cta {
  display: none;
}

@media (max-width: 1080px) {
  .site-header {
    grid-template-columns: minmax(220px, auto) minmax(0, 1fr) auto;
    gap: 10px;
  }

  .primary-nav a {
    padding: 9px 10px;
    font-size: 13px;
  }
}

@media (max-width: 768px) {
  .site-header {
    width: calc(100vw - 20px);
    margin: 10px 10px 18px;
    padding: 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    border-radius: 22px;
    top: 8px;
  }

  .site-header .logo {
    gap: 10px;
    min-width: 0;
  }

  .site-header .logo strong {
    font-size: 18px;
  }

  .site-header .logo small {
    display: block;
    max-width: 230px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
  }

  .site-header .logo-image-wrap,
  .site-header .logo-image-wrap img {
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
  }

  .mobile-menu-toggle {
    width: 46px;
    height: 46px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(243,239,229,.16);
    border-radius: 15px;
    background: rgba(255,255,255,.055);
    color: #f3efe5;
    cursor: pointer;
  }

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

  .site-header.is-menu-open .mobile-menu-toggle span:first-child {
    transform: translateY(4px) rotate(45deg);
  }

  .site-header.is-menu-open .mobile-menu-toggle span:last-child {
    transform: translateY(-4px) rotate(-45deg);
  }

  .site-header .header-btn {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 48px;
  }

  .primary-nav {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 10px);
    z-index: 30;
    display: grid;
    gap: 8px;
    padding: 12px;
    border-radius: 22px;
    background:
      linear-gradient(145deg, rgba(5,5,6,.98), rgba(18,20,25,.98)),
      linear-gradient(90deg, rgba(216,181,109,.10), transparent);
    border: 1px solid rgba(216,181,109,.22);
    box-shadow: 0 26px 70px rgba(0,0,0,.34);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
  }

  .site-header.is-menu-open .primary-nav {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .primary-nav a {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    border-radius: 15px;
    color: rgba(243,239,229,.84);
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.08);
  }

  .primary-nav a:hover,
  .primary-nav a:focus-visible {
    color: #f3efe5;
    background: rgba(255,255,255,.10);
  }

  .nav-mobile-cta {
    display: flex;
    color: #050506 !important;
    background: linear-gradient(135deg, #f1d493, #d8b56d) !important;
    border-color: rgba(241,212,147,.35) !important;
    font-weight: 950;
  }
}

@media (max-width: 430px) {
  .site-header {
    padding: 10px;
  }

  .site-header .logo small {
    display: none;
  }

  .site-header .logo strong {
    font-size: 17px;
  }

  .site-header .logo-image-wrap,
  .site-header .logo-image-wrap img,
  .mobile-menu-toggle {
    width: 42px;
    height: 42px;
  }
}

@media (max-width: 360px) {
  .site-header {
    width: calc(100vw - 16px);
    margin-left: 8px;
    margin-right: 8px;
  }

  .site-header .logo strong {
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .primary-nav,
  .primary-nav a,
  .site-header .header-btn,
  .mobile-menu-toggle span {
    transition: none;
  }
}

/* Academic support positioning */
.academic-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.academic-proof span {
  min-height: auto;
  padding: 10px 12px;
  border-radius: 999px;
  color: rgba(243,239,229,.86);
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(216,181,109,.18);
  font-size: 14px;
  font-weight: 850;
}

.academic-dashboard {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.academic-dashboard .studio-command-top {
  margin-bottom: 0;
}

.academic-dashboard-note {
  position: relative;
  z-index: 3;
  padding: 16px 17px;
  border-radius: 18px;
  background: rgba(5,5,6,.58);
  border: 1px solid rgba(216,181,109,.18);
}

.academic-dashboard-note b {
  display: block;
  color: #f3efe5;
  font-size: 18px;
  line-height: 1.2;
}

.academic-dashboard-note p {
  margin: 7px 0 0;
  color: rgba(243,239,229,.66);
  font-size: 14px;
  line-height: 1.45;
}

.academic-workflow {
  position: relative;
  z-index: 3;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  list-style: none;
}

.academic-workflow li {
  min-height: 106px;
  padding: 14px;
  display: grid;
  grid-template-columns: 42px 1fr;
  column-gap: 12px;
  align-items: start;
  border-radius: 18px;
  color: #f3efe5;
  background:
    linear-gradient(145deg, rgba(255,255,255,.070), rgba(255,255,255,.025)),
    #090a0c;
  border: 1px solid rgba(255,255,255,.09);
  opacity: 0;
  transform: translateY(14px);
  animation: studioStepIn .58s cubic-bezier(.2,.78,.18,1) both;
}

.academic-workflow li:nth-child(1) {
  animation-delay: .24s;
}

.academic-workflow li:nth-child(2) {
  animation-delay: .32s;
}

.academic-workflow li:nth-child(3) {
  animation-delay: .40s;
}

.academic-workflow li:nth-child(4) {
  animation-delay: .48s;
}

.academic-workflow li:nth-child(5) {
  animation-delay: .56s;
}

.academic-workflow li:nth-child(6) {
  animation-delay: .64s;
}

.academic-workflow li:nth-child(7) {
  animation-delay: .72s;
}

.academic-workflow li > span {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  grid-row: span 2;
  border-radius: 13px;
  color: #050506;
  background: linear-gradient(135deg, #f1d493, #d8b56d);
  font-size: 13px;
  font-weight: 950;
}

.academic-workflow b {
  display: block;
  color: #f3efe5;
  font-size: 17px;
  line-height: 1.16;
}

.academic-workflow small {
  display: block;
  margin-top: 5px;
  color: rgba(243,239,229,.62);
  font-size: 12px;
  line-height: 1.35;
}

.academic-workflow li:last-child {
  grid-column: 1 / -1;
  min-height: 86px;
  grid-template-columns: 42px 1fr;
}

.academic-dashboard-footer {
  position: relative;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.academic-dashboard-footer span {
  padding: 8px 10px;
  border-radius: 999px;
  color: rgba(243,239,229,.78);
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.09);
  font-size: 12px;
  font-weight: 850;
}

.academic-transition .studio-transition-item {
  min-height: 116px;
}

.request-placeholder {
  width: min(1180px, calc(100% - 28px));
  margin: 22px auto;
  display: grid;
  grid-template-columns: 1fr .92fr;
  gap: 16px;
  padding: 16px;
  border-radius: 30px;
  color: #f3efe5;
  background:
    linear-gradient(135deg, rgba(5,5,6,.96), rgba(17,19,24,.94)),
    linear-gradient(90deg, rgba(216,181,109,.10), transparent 42%, rgba(127,231,255,.07));
  border: 1px solid rgba(216,181,109,.18);
  box-shadow: 0 24px 76px rgba(0,0,0,.18);
}

.request-placeholder-copy,
.request-placeholder-card {
  padding: clamp(22px, 4vw, 34px);
  border-radius: 22px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.08);
}

.request-placeholder h2 {
  max-width: 620px;
  color: #f3efe5;
  font-size: 38px;
  line-height: 1.04;
}

.request-placeholder p {
  max-width: 680px;
  margin: 18px 0 0;
  color: rgba(243,239,229,.72);
  font-size: 17px;
}

.request-placeholder-card b {
  display: block;
  color: #f1d493;
  font-size: 20px;
}

.request-placeholder-card ul {
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
  list-style: none;
}

.request-placeholder-card li {
  position: relative;
  padding-left: 25px;
  color: rgba(243,239,229,.78);
  line-height: 1.45;
}

.request-placeholder-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .58em;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #d8b56d;
  box-shadow: 0 0 0 4px rgba(216,181,109,.12);
}

.request-placeholder-card > span {
  display: block;
  margin-top: 18px;
  padding: 12px 14px;
  border-radius: 16px;
  color: rgba(243,239,229,.68);
  background: rgba(5,5,6,.44);
  border: 1px solid rgba(255,255,255,.08);
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 980px) {
  .academic-workflow {
    grid-template-columns: 1fr;
  }

  .academic-workflow li,
  .academic-workflow li:last-child {
    min-height: auto;
    grid-column: auto;
  }

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

@media (max-width: 768px) {
  .request-placeholder {
    width: calc(100vw - 24px);
    margin: 14px 12px 22px;
    padding: 10px;
    border-radius: 26px;
  }

  .request-placeholder h2 {
    font-size: 32px;
  }
}

@media (max-width: 430px) {
  .academic-proof {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .academic-proof span {
    border-radius: 14px;
    text-align: center;
    font-size: 13px;
  }

  .academic-dashboard-note {
    padding: 14px;
  }

  .academic-workflow li {
    grid-template-columns: 38px 1fr;
    padding: 13px;
  }

  .academic-workflow li > span {
    width: 36px;
    height: 36px;
  }

  .request-placeholder {
    width: calc(100vw - 20px);
    margin-left: 10px;
    margin-right: 10px;
  }

  .request-placeholder-copy,
  .request-placeholder-card {
    padding: 20px 16px;
    border-radius: 20px;
  }

  .request-placeholder h2 {
    font-size: 27px;
  }

  .request-placeholder p {
    font-size: 15px;
  }
}

@media (max-width: 360px) {
  .academic-proof {
    grid-template-columns: 1fr;
  }

  .request-placeholder h2 {
    font-size: 25px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .academic-workflow li {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

/* Hero visual art direction: Obsidian Project Control Room */
:root {
  --hero-progress: .32;
}

.home-hero-v2.production-hero {
  --px: 0px;
  --py: 0px;
  --px-soft: 0px;
  --py-soft: 0px;
  --px-deep: 0px;
  --py-deep: 0px;
  --px-reverse: 0px;
  --py-reverse: 0px;
  --tilt-x: 0deg;
  --tilt-y: 0deg;
  width: min(1220px, calc(100% - 28px));
  min-height: clamp(690px, calc(100vh - 118px), 820px);
  margin-top: 22px;
  padding: clamp(12px, 1.45vw, 18px);
  gap: clamp(12px, 1.45vw, 18px);
  grid-template-columns: minmax(0, .96fr) minmax(500px, 1.04fr);
  perspective: 1200px;
  background:
    linear-gradient(116deg, rgba(4,5,7,.98), rgba(10,12,16,.98) 48%, rgba(21,23,28,.96)),
    linear-gradient(90deg, rgba(216,181,109,.12), transparent 32%, rgba(127,231,255,.10) 68%, transparent),
    repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 112px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.028) 0 1px, transparent 1px 96px);
  border-color: rgba(241,212,147,.25);
  box-shadow:
    0 38px 120px rgba(0,0,0,.36),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.home-hero-v2.production-hero::before {
  background:
    linear-gradient(105deg, transparent 0%, rgba(241,212,147,.10) 42%, transparent 55%),
    linear-gradient(148deg, rgba(127,231,255,.10) 0%, transparent 36%),
    linear-gradient(26deg, transparent 58%, rgba(216,181,109,.15) 100%);
  opacity: .82;
  animation: productionAmbient 9s ease-in-out infinite;
}

.home-hero-v2.production-hero::after {
  inset: 14px;
  border-radius: 28px;
  border-color: rgba(255,255,255,.075);
  box-shadow: inset 0 0 0 1px rgba(216,181,109,.08);
}

.production-noise,
.production-beam {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

.production-noise {
  opacity: .24;
  background:
    repeating-linear-gradient(115deg, rgba(255,255,255,.035) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 5px);
  mix-blend-mode: overlay;
}

.production-beam {
  width: 42%;
  left: -18%;
  background: linear-gradient(90deg, transparent, rgba(241,212,147,.10), rgba(127,231,255,.09), transparent);
  transform: skewX(-16deg);
  animation: productionBeam 7.5s 1.15s ease-in-out infinite;
}

.production-copy,
.production-room {
  position: relative;
  z-index: 2;
}

.production-copy {
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.018)),
    linear-gradient(180deg, rgba(5,5,7,.82), rgba(5,5,7,.34));
  translate: var(--px-reverse) var(--py-soft);
  transition: translate .22s ease;
}

.production-copy::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(140deg, rgba(241,212,147,.10), transparent 34%),
    linear-gradient(24deg, transparent 62%, rgba(127,231,255,.075));
  opacity: .82;
}

.production-copy > * {
  position: relative;
  z-index: 1;
}

.production-hero .studio-hero-actions {
  opacity: 0;
  transform: translateY(14px);
  animation: productionCtaIn .68s 1.08s cubic-bezier(.2,.78,.18,1) both;
}

.production-room {
  display: block;
  min-height: 620px;
  padding: 18px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.028)),
    linear-gradient(137deg, rgba(127,231,255,.11), transparent 36%),
    linear-gradient(315deg, rgba(216,181,109,.18), transparent 48%),
    rgba(5,6,8,.78);
  transform-style: preserve-3d;
}

.production-room.studio-command::before {
  display: none;
}

.production-room::after {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: 22px;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow:
    inset 0 0 34px rgba(127,231,255,.055),
    inset 0 0 48px rgba(216,181,109,.055);
}

.production-room-depth {
  position: absolute;
  inset: 26px;
  pointer-events: none;
  opacity: .75;
  background:
    linear-gradient(90deg, transparent 0 12%, rgba(127,231,255,.10) 12.2%, transparent 12.4% 100%),
    linear-gradient(0deg, transparent 0 18%, rgba(216,181,109,.10) 18.2%, transparent 18.4% 100%);
  transform: translate3d(var(--px-deep), var(--py-deep), -20px);
}

.mission-status-rail {
  position: absolute;
  top: 18px;
  left: 18px;
  right: 18px;
  z-index: 8;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mission-status-rail span {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  color: rgba(243,239,229,.78);
  background: rgba(5,6,8,.66);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  opacity: 0;
  animation: statusIgnite .5s var(--delay, .35s) ease both;
}

.mission-status-rail span:nth-child(2) {
  --delay: .52s;
}

.mission-status-rail span:nth-child(3) {
  --delay: .69s;
}

.mission-status-rail i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #7fe7ff;
  box-shadow: 0 0 0 5px rgba(127,231,255,.10), 0 0 16px rgba(127,231,255,.55);
}

.control-panel {
  position: relative;
  height: calc(100% - 48px);
  min-height: 554px;
  margin-top: 48px;
  padding: 60px 18px 18px;
  border-radius: 24px;
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.025)),
    linear-gradient(180deg, rgba(5,6,8,.78), rgba(5,6,8,.42));
  border: 1px solid rgba(216,181,109,.20);
  box-shadow:
    0 28px 84px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.08);
  transform: rotateX(var(--tilt-y)) rotateY(var(--tilt-x));
  transform-style: preserve-3d;
  transition: transform .18s ease, border-color .22s ease, box-shadow .22s ease;
}

.production-room:hover .control-panel {
  border-color: rgba(241,212,147,.34);
  box-shadow:
    0 34px 96px rgba(0,0,0,.31),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.scan-beam {
  position: absolute;
  top: -20%;
  bottom: -20%;
  width: 28%;
  left: -34%;
  z-index: 7;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), rgba(127,231,255,.09), transparent);
  filter: blur(1px);
  transform: skewX(-14deg);
  animation: controlScan 5.4s 1.15s ease-in-out infinite;
}

.control-top {
  position: relative;
  z-index: 8;
  margin-bottom: 0;
  align-items: center;
}

.control-top b {
  max-width: 230px;
}

.mission-lines {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  transform: translate3d(var(--px-soft), var(--py-soft), 0);
}

.mission-line {
  --angle: 0deg;
  --delay: .48s;
  position: absolute;
  height: 1px;
  width: 190px;
  background: linear-gradient(90deg, rgba(241,212,147,.80), rgba(127,231,255,.42), transparent);
  transform: rotate(var(--angle)) scaleX(0);
  transform-origin: left center;
  animation: missionLineDraw .82s var(--delay) cubic-bezier(.2,.78,.18,1) both;
}

.line-a {
  top: 45%;
  left: 50%;
  --angle: -150deg;
  --delay: .30s;
}

.line-b {
  top: 45%;
  left: 50%;
  --angle: -32deg;
  --delay: .40s;
}

.line-c {
  top: 51%;
  left: 50%;
  --angle: 166deg;
  --delay: .50s;
}

.line-d {
  top: 52%;
  left: 50%;
  --angle: 20deg;
  --delay: .60s;
}

.line-e {
  top: 58%;
  left: 50%;
  width: 130px;
  --angle: 90deg;
  --delay: .70s;
}

.project-core {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 6;
  width: 238px;
  min-height: 220px;
  padding: 22px;
  border-radius: 24px;
  color: #f3efe5;
  background:
    linear-gradient(150deg, rgba(255,255,255,.16), rgba(255,255,255,.045)),
    linear-gradient(180deg, rgba(7,8,10,.92), rgba(7,8,10,.62));
  border: 1px solid rgba(241,212,147,.25);
  box-shadow:
    0 26px 76px rgba(0,0,0,.34),
    0 0 42px rgba(216,181,109,.12),
    inset 0 1px 0 rgba(255,255,255,.10);
  transform: translate(-50%, -50%) translate3d(var(--px), var(--py), 40px);
  transition: transform .18s ease, border-color .22s ease;
}

.project-core::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(115deg, rgba(241,212,147,.28), transparent 28%, rgba(127,231,255,.18) 70%, transparent);
  opacity: .54;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  padding: 1px;
}

.project-core span,
.project-artefact span {
  display: block;
  color: #7fe7ff;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.project-core b {
  display: block;
  margin-top: 10px;
  color: #f3efe5;
  font-size: 25px;
  line-height: 1.05;
}

.project-core p {
  max-width: 154px;
  margin: 12px 0 0;
  color: rgba(243,239,229,.68);
  font-size: 13px;
  line-height: 1.46;
}

.project-progress {
  position: absolute;
  right: 16px;
  bottom: 16px;
  width: 62px;
  height: 62px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background:
    radial-gradient(circle at center, rgba(5,6,8,.94) 0 56%, transparent 57%),
    conic-gradient(from -90deg, #f1d493 0 82%, rgba(255,255,255,.12) 82% 100%);
  box-shadow: 0 0 24px rgba(216,181,109,.13);
}

.project-progress strong {
  display: block;
  color: #f1d493;
  font-size: 22px;
  line-height: 1;
}

.project-progress small {
  display: block;
  margin-top: 1px;
  color: rgba(243,239,229,.66);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.mission-workflow {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mission-workflow .mission-card {
  --card-x: var(--px-soft);
  --card-y: var(--py-soft);
  --delay: .38s;
  position: absolute;
  width: 172px;
  min-height: 94px;
  padding: 13px;
  display: grid;
  grid-template-columns: 38px 1fr;
  column-gap: 10px;
  align-items: start;
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.035)),
    rgba(7,8,10,.82);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 18px 52px rgba(0,0,0,.24);
  opacity: 0;
  transform: translate3d(var(--card-x), calc(var(--card-y) + 24px), 0) scale(.95);
  animation: missionCardRise .74s var(--delay) cubic-bezier(.2,.78,.18,1) both;
  transition: border-color .22s ease, box-shadow .22s ease;
}

.mission-workflow .mission-card:hover {
  border-color: rgba(241,212,147,.34);
  box-shadow: 0 24px 70px rgba(0,0,0,.32), 0 0 32px rgba(216,181,109,.10);
}

.mission-workflow .mission-card > span {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  font-size: 12px;
  background:
    linear-gradient(135deg, #f1d493, #d8b56d),
    #d8b56d;
  box-shadow: 0 0 0 5px rgba(216,181,109,.10);
}

.mission-workflow .mission-card b {
  font-size: 15px;
}

.mission-workflow .mission-card small {
  font-size: 11px;
  line-height: 1.3;
}

.card-topic {
  top: 104px;
  left: 12px;
  --card-x: var(--px-reverse);
  --card-y: var(--py-soft);
}

.card-requirements {
  top: 108px;
  right: 12px;
  --delay: .48s;
  --card-x: var(--px-soft);
  --card-y: var(--py-reverse);
}

.card-plan {
  top: 258px;
  left: -2px;
  --delay: .58s;
  --card-x: var(--px-deep);
  --card-y: var(--py-soft);
}

.card-text {
  top: 262px;
  right: -2px;
  --delay: .68s;
  --card-x: var(--px-reverse);
  --card-y: var(--py-deep);
}

.card-format {
  bottom: 124px;
  left: 24px;
  --delay: .78s;
  --card-x: var(--px-soft);
  --card-y: var(--py-reverse);
}

.card-slides {
  bottom: 124px;
  right: 24px;
  --delay: .88s;
  --card-x: var(--px-deep);
  --card-y: var(--py-soft);
}

.card-revision {
  bottom: 62px;
  left: calc(50% - 118px);
  width: 236px;
  min-height: 82px;
  --delay: .98s;
  --card-x: var(--px-reverse);
  --card-y: var(--py-reverse);
}

.artefact-grid {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
}

.project-artefact {
  position: absolute;
  width: 150px;
  padding: 13px;
  border-radius: 18px;
  color: #f3efe5;
  background:
    linear-gradient(150deg, rgba(255,255,255,.13), rgba(255,255,255,.035)),
    rgba(5,6,8,.72);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 54px rgba(0,0,0,.22);
  opacity: 0;
  animation: artefactRise .72s var(--delay, .78s) cubic-bezier(.2,.78,.18,1) both;
}

.project-artefact b {
  display: block;
  margin-top: 8px;
  color: #f3efe5;
  font-size: 14px;
  line-height: 1.1;
}

.document-fragment {
  top: 182px;
  left: calc(50% - 74px);
  --delay: .72s;
  transform: translate3d(var(--px-soft), var(--py-reverse), 0) rotate(-4deg);
}

.document-fragment i {
  display: block;
  height: 6px;
  margin-top: 9px;
  border-radius: 999px;
  background: rgba(243,239,229,.18);
}

.document-fragment i:nth-of-type(2) {
  width: 72%;
}

.document-fragment i:nth-of-type(3) {
  width: 54%;
}

.slide-preview {
  right: 42px;
  bottom: 232px;
  --delay: .88s;
  transform: translate3d(var(--px-deep), var(--py-soft), 0) rotate(3deg);
}

.slide-bars {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px;
  margin-top: 12px;
  align-items: end;
  height: 42px;
}

.slide-bars i {
  display: block;
  border-radius: 8px 8px 4px 4px;
  background: linear-gradient(180deg, #7fe7ff, rgba(127,231,255,.20));
}

.slide-bars i:nth-child(1) {
  height: 24px;
}

.slide-bars i:nth-child(2) {
  height: 38px;
  background: linear-gradient(180deg, #f1d493, rgba(216,181,109,.22));
}

.slide-bars i:nth-child(3) {
  height: 30px;
}

.revision-check {
  left: 42px;
  bottom: 230px;
  --delay: .96s;
  transform: translate3d(var(--px-reverse), var(--py-deep), 0) rotate(-2deg);
}

.revision-check small {
  display: block;
  position: relative;
  margin-top: 8px;
  padding-left: 17px;
  color: rgba(243,239,229,.68);
  font-size: 11px;
}

.revision-check small::before {
  content: "";
  position: absolute;
  left: 0;
  top: .35em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #f1d493;
  box-shadow: 0 0 0 4px rgba(216,181,109,.12);
}

.mission-footer {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 26px;
  z-index: 8;
  justify-content: center;
}

.production-transition {
  position: relative;
  margin-top: 4px;
  padding-top: 30px;
}

.production-transition-line {
  position: absolute;
  left: 50%;
  top: -50px;
  width: 1px;
  height: 76px;
  pointer-events: none;
  transform: translateX(-50%) scaleY(var(--hero-progress, .32));
  transform-origin: top center;
  background: linear-gradient(180deg, rgba(127,231,255,.85), rgba(241,212,147,.75), transparent);
  box-shadow: 0 0 18px rgba(127,231,255,.18);
}

.production-transition::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  top: 28px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(241,212,147,.35), rgba(127,231,255,.22), transparent);
}

@keyframes productionAmbient {
  0%, 100% {
    opacity: .62;
    transform: translateX(-2%);
  }
  50% {
    opacity: .90;
    transform: translateX(2%);
  }
}

@keyframes productionBeam {
  0%, 28% {
    transform: translateX(0) skewX(-16deg);
    opacity: 0;
  }
  46% {
    opacity: .76;
  }
  74%, 100% {
    transform: translateX(340%) skewX(-16deg);
    opacity: 0;
  }
}

@keyframes productionCtaIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes statusIgnite {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes controlScan {
  0%, 18% {
    left: -34%;
    opacity: 0;
  }
  35% {
    opacity: .70;
  }
  62%, 100% {
    left: 108%;
    opacity: 0;
  }
}

@keyframes missionLineDraw {
  from {
    opacity: 0;
    transform: rotate(var(--angle)) scaleX(0);
  }
  to {
    opacity: .86;
    transform: rotate(var(--angle)) scaleX(1);
  }
}

@keyframes missionCardRise {
  from {
    opacity: 0;
    filter: blur(5px);
    transform: translate3d(var(--card-x), calc(var(--card-y) + 28px), 0) scale(.94);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(var(--card-x), var(--card-y), 0) scale(1);
  }
}

@keyframes artefactRise {
  from {
    opacity: 0;
    filter: blur(5px);
  }
  to {
    opacity: .88;
    filter: blur(0);
  }
}

@media (max-width: 1080px) {
  .home-hero-v2.production-hero {
    grid-template-columns: minmax(0, 1fr) minmax(470px, .98fr);
  }

  .mission-workflow .mission-card {
    width: 160px;
  }

  .card-revision {
    left: calc(50% - 108px);
    width: 216px;
  }
}

@media (max-width: 980px) {
  .home-hero-v2.production-hero {
    min-height: auto;
    grid-template-columns: 1fr;
  }

  .production-copy {
    translate: none;
  }

  .production-room {
    min-height: auto;
    padding: 16px;
  }

  .production-room-depth,
  .mission-lines,
  .scan-beam {
    display: none;
  }

  .mission-status-rail {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    margin-bottom: 12px;
  }

  .control-panel {
    height: auto;
    min-height: 0;
    margin-top: 0;
    padding: 18px;
    display: grid;
    gap: 14px;
    transform: none;
  }

  .control-top {
    align-items: flex-start;
  }

  .project-core {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    min-height: 176px;
    transform: none;
  }

  .mission-workflow {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .mission-workflow .mission-card,
  .mission-workflow .mission-card:last-child {
    position: relative;
    inset: auto;
    width: auto;
    min-height: 98px;
    transform: none;
  }

  .card-revision {
    grid-column: 1 / -1;
  }

  .artefact-grid {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .project-artefact {
    position: relative;
    inset: auto;
    width: auto;
    transform: none;
  }

  .mission-footer {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    margin-top: 12px;
  }
}

@media (max-width: 768px) {
  .home-hero-v2.production-hero {
    min-height: auto;
  }

  .production-room {
    padding: 12px;
  }

  .control-panel {
    padding: 15px;
    border-radius: 22px;
  }

  .project-core {
    padding: 18px;
  }

  .project-core b {
    max-width: 68%;
    font-size: 23px;
  }

  .mission-workflow .mission-card {
    min-height: 92px;
  }

  .production-transition {
    padding-top: 22px;
  }
}

@media (max-width: 520px) {
  .mission-workflow,
  .artefact-grid {
    grid-template-columns: 1fr;
  }

  .project-progress {
    position: static;
    margin-top: 16px;
  }
}

@media (max-width: 430px) {
  .home-hero-v2.production-hero {
    min-height: auto;
  }

  .mission-status-rail span {
    min-height: 31px;
    font-size: 10px;
  }

  .control-top {
    gap: 10px;
  }

  .project-core {
    min-height: auto;
    border-radius: 20px;
  }

  .project-core b {
    max-width: none;
    font-size: 21px;
  }

  .mission-workflow .mission-card {
    grid-template-columns: 36px 1fr;
    min-height: auto;
    padding: 12px;
    border-radius: 16px;
  }

  .project-artefact {
    padding: 12px;
    border-radius: 16px;
  }

  .mission-footer {
    justify-content: flex-start;
  }

  .production-transition-line {
    top: -38px;
    height: 58px;
  }
}

@media (max-width: 360px) {
  .production-room {
    padding: 10px;
  }

  .control-panel {
    padding: 12px;
  }

  .mission-status-rail {
    gap: 6px;
  }

  .mission-status-rail span {
    padding: 7px 8px;
  }

  .mission-workflow .mission-card b {
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero-v2.production-hero::before,
  .production-beam,
  .production-copy,
  .production-room,
  .control-panel,
  .scan-beam,
  .mission-status-rail span,
  .mission-line,
  .mission-workflow .mission-card,
  .project-artefact,
  .production-hero .studio-hero-actions {
    animation: none;
    transition: none;
    transform: none;
    translate: none;
  }

  .mission-status-rail span,
  .mission-workflow .mission-card,
  .project-artefact,
  .production-hero .studio-hero-actions {
    opacity: 1;
    filter: none;
  }

  .project-core {
    transform: translate(-50%, -50%);
  }

  .production-transition-line {
    transform: translateX(-50%);
  }
}

@media (max-width: 980px) and (prefers-reduced-motion: reduce) {
  .project-core {
    transform: none;
  }
}

/* P0 header and mobile hero correction */
.site-header {
  align-items: center;
}

.site-header .logo small {
  max-width: 265px;
}

.site-header .header-btn {
  white-space: nowrap;
}

@media (max-width: 768px) {
  .site-header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  .site-header .header-btn {
    display: none;
  }

  .site-header .logo small {
    max-width: 220px;
  }
}

.home-hero-v2.production-hero,
.production-hero .studio-hero-copy,
.production-hero .home-hero-visual {
  min-width: 0;
}

.production-hero .studio-hero-copy h1,
.production-hero .studio-hero-copy p,
.production-hero .studio-hero-actions,
.production-hero .academic-proof {
  max-width: 100%;
}

.production-hero .studio-hero-copy h1 {
  overflow-wrap: normal;
  word-break: normal;
  text-wrap: balance;
}

.control-panel::before,
.control-panel::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: 1;
}

.control-panel::before {
  left: 50%;
  top: 52%;
  width: 390px;
  height: 390px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle, rgba(241,212,147,.18) 0 2px, transparent 3px 100%),
    radial-gradient(circle, rgba(127,231,255,.10), transparent 58%);
  box-shadow:
    0 0 0 1px rgba(241,212,147,.06),
    0 0 0 86px rgba(255,255,255,.018),
    0 0 0 172px rgba(127,231,255,.012);
  opacity: .74;
}

.control-panel::after {
  inset: 18px 20px;
  border-radius: 22px;
  background:
    linear-gradient(112deg, transparent 0 38%, rgba(255,255,255,.07) 45%, transparent 54%),
    linear-gradient(180deg, transparent, rgba(127,231,255,.045) 62%, transparent);
  opacity: .55;
}

.scan-beam {
  width: 18%;
  background: linear-gradient(90deg, transparent, rgba(241,212,147,.12), rgba(255,255,255,.08), transparent);
  filter: blur(.6px);
  opacity: .86;
}

.control-top span,
.project-core span,
.project-artefact span {
  letter-spacing: .02em;
}

.control-top span {
  max-width: 245px;
  line-height: 1.18;
}

.project-core {
  width: 286px;
  min-height: 244px;
  padding: 26px;
  z-index: 7;
}

.project-core b {
  font-size: 29px;
}

.project-core p {
  max-width: 184px;
}

.project-progress {
  width: 70px;
  height: 70px;
  right: 18px;
  bottom: 18px;
}

.project-progress strong {
  font-size: 25px;
}

.mission-line {
  width: 220px;
  opacity: .78;
}

.line-a {
  top: 44%;
  --angle: -154deg;
}

.line-b {
  top: 43%;
  --angle: -28deg;
}

.line-c {
  top: 53%;
  --angle: 170deg;
}

.line-d {
  top: 51%;
  --angle: 18deg;
}

.line-e {
  top: 58%;
  width: 150px;
}

.mission-workflow .mission-card {
  --card-r: 0deg;
  width: 156px;
  min-height: 88px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.115), rgba(255,255,255,.028)),
    rgba(7,8,10,.80);
  transform: translate3d(var(--card-x), calc(var(--card-y) + 24px), 0) rotate(var(--card-r)) scale(.95);
}

.mission-workflow .mission-card:hover {
  transform: translate3d(var(--card-x), calc(var(--card-y) - 3px), 0) rotate(var(--card-r)) scale(1.02);
}

.card-topic {
  top: 112px;
  left: 18px;
  --card-r: -2.5deg;
}

.card-requirements {
  top: 112px;
  right: 36px;
  --card-r: 2deg;
}

.card-plan {
  top: 268px;
  left: -6px;
  --card-r: -1deg;
}

.card-text {
  top: 238px;
  right: -8px;
  --card-r: 1.4deg;
}

.card-format {
  bottom: 112px;
  left: 42px;
  --card-r: 2deg;
}

.card-slides {
  bottom: 138px;
  right: 34px;
  --card-r: -2deg;
}

.card-revision {
  bottom: 50px;
  left: calc(50% - 104px);
  width: 208px;
  --card-r: .8deg;
}

.document-fragment {
  top: 194px;
}

.slide-preview {
  right: 36px;
  bottom: 242px;
}

.revision-check {
  left: 42px;
  bottom: 242px;
}

@keyframes missionCardRise {
  from {
    opacity: 0;
    filter: blur(5px);
    transform: translate3d(var(--card-x), calc(var(--card-y) + 30px), 0) rotate(var(--card-r)) scale(.92);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(var(--card-x), var(--card-y), 0) rotate(var(--card-r)) scale(1);
  }
}

@media (max-width: 1080px) {
  .mission-workflow .mission-card {
    width: 150px;
  }

  .project-core {
    width: 266px;
  }
}

@media (max-width: 768px) {
  .home-hero-v2.production-hero {
    width: calc(100% - 20px);
    margin: 16px 10px 0;
    padding: 10px;
    gap: 10px;
    overflow: visible;
  }

  .production-copy {
    overflow: visible;
  }

  .production-hero .studio-hero-copy {
    padding: clamp(24px, 5vw, 34px) clamp(18px, 5vw, 28px);
  }

  .production-hero .studio-hero-copy h1 {
    font-size: clamp(34px, 6.3vw, 48px);
    line-height: 1.04;
  }

  .production-hero .studio-hero-copy p,
  .production-hero.clean-hero .studio-hero-copy p {
    font-size: clamp(15px, 2.3vw, 17px);
    line-height: 1.56;
  }

  .production-hero .studio-hero-actions {
    opacity: 1;
    transform: none;
    animation: none;
  }

  .production-room {
    padding: 10px;
  }

  .mission-status-rail {
    gap: 7px;
  }

  .mission-status-rail span {
    min-height: 30px;
    padding: 7px 9px;
    font-size: 10px;
  }

  .control-panel {
    padding: 14px;
    gap: 10px;
  }

  .control-panel::before,
  .control-panel::after,
  .artefact-grid,
  .mission-footer {
    display: none;
  }

  .control-top {
    display: grid;
    gap: 8px;
  }

  .control-top b {
    max-width: none;
    text-align: left;
    font-size: 20px;
  }

  .project-core {
    width: auto;
    min-height: 150px;
    padding: 18px;
    border-radius: 20px;
  }

  .project-core b {
    max-width: calc(100% - 70px);
    font-size: 23px;
  }

  .project-core p {
    max-width: calc(100% - 70px);
    font-size: 12px;
  }

  .project-progress {
    position: absolute;
    right: 14px;
    top: 16px;
    bottom: auto;
    width: 50px;
    height: 50px;
  }

  .project-progress strong {
    font-size: 20px;
  }

  .mission-workflow {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .mission-workflow .mission-card,
  .mission-workflow .mission-card:last-child {
    min-height: 64px;
    grid-column: auto;
    grid-template-columns: 36px 1fr;
    padding: 10px;
    transform: none;
  }
}

@media (max-width: 430px) {
  .home-hero-v2.production-hero {
    width: calc(100% - 16px);
    margin-left: 8px;
    margin-right: 8px;
    padding: 8px;
  }

  .production-hero .studio-hero-copy {
    padding: 24px 16px;
  }

  .production-hero .studio-hero-copy h1 {
    font-size: clamp(28px, 8.15vw, 34px);
    line-height: 1.06;
  }

  .production-hero .studio-hero-copy p,
  .production-hero.clean-hero .studio-hero-copy p {
    font-size: 15px;
    line-height: 1.55;
  }

  .production-hero .studio-hero-actions {
    gap: 10px;
    margin-top: 24px;
    opacity: 1;
    transform: none;
    animation: none;
  }

  .production-hero .academic-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .production-hero .academic-proof span {
    min-width: 0;
    padding: 12px 10px;
    font-size: 12px;
    line-height: 1.2;
  }

  .mission-status-rail span:nth-child(3) {
    display: none;
  }

  .project-core {
    padding: 16px;
    min-height: 130px;
  }

  .project-core b {
    font-size: 21px;
  }

  .project-core p {
    margin-top: 8px;
    font-size: 11px;
    line-height: 1.38;
  }

  .mission-workflow .mission-card {
    grid-template-columns: 34px 1fr;
    min-height: 54px;
  }

  .mission-workflow .mission-card > span {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  .mission-workflow .mission-card small {
    display: none;
  }
}

@media (max-width: 360px) {
  .production-hero .studio-hero-copy h1 {
    font-size: 27px;
  }

  .production-hero .academic-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .project-core p {
    max-width: none;
  }

  .project-progress {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mission-workflow .mission-card,
  .mission-workflow .mission-card:hover {
    transform: none;
  }
}

/* Premium academic homepage funnel */
.funnel-section,
.funnel-section * {
  letter-spacing: 0;
}

.funnel-section {
  width: min(1180px, calc(100% - 28px));
  margin: 24px auto;
  color: #f3efe5;
  position: relative;
}

.funnel-head {
  max-width: 760px;
  margin-bottom: 22px;
}

.funnel-head h2 {
  margin: 12px 0 0;
  color: #f3efe5;
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.02;
}

.funnel-head p {
  max-width: 720px;
  margin: 16px 0 0;
  color: rgba(243,239,229,.70);
  font-size: 17px;
  line-height: 1.58;
}

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

.funnel-card,
.included-panel,
.included-list li,
.process-timeline li,
.trust-grid article,
.funnel-faq details {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.024)),
    linear-gradient(180deg, rgba(7,8,10,.88), rgba(7,8,10,.58));
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 18px 54px rgba(0,0,0,.16);
}

.funnel-card::before,
.included-panel::before,
.trust-grid article::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(120deg, rgba(241,212,147,.12), transparent 34%, rgba(127,231,255,.065));
  opacity: .68;
}

.funnel-card {
  min-height: 206px;
  padding: 22px;
}

.funnel-card > *,
.included-panel > *,
.trust-grid article > * {
  position: relative;
  z-index: 1;
}

.funnel-card span,
.process-timeline span,
.included-list span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #090a0c;
  background: linear-gradient(135deg, #f1d493, #d8b56d);
  font-size: 13px;
  font-weight: 950;
  box-shadow: 0 0 0 6px rgba(216,181,109,.10);
}

.funnel-card h3 {
  margin: 22px 0 0;
  color: #f3efe5;
  font-size: 22px;
  line-height: 1.12;
}

.funnel-card p,
.trust-grid p {
  margin: 11px 0 0;
  color: rgba(243,239,229,.66);
  font-size: 14px;
  line-height: 1.52;
}

.path-card-grid,
.process-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.path-card,
.process-flow-card,
.revision-panel {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  background:
    radial-gradient(circle at 82% 12%, rgba(241,212,147,.14), transparent 32%),
    linear-gradient(145deg, rgba(255,255,255,.090), rgba(255,255,255,.022)),
    rgba(7,8,10,.82);
  border: 1px solid rgba(255,255,255,.095);
  box-shadow: 0 22px 64px rgba(0,0,0,.20);
}

.path-card::before,
.process-flow-card::before,
.revision-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(241,212,147,.13), transparent 34%, rgba(127,231,255,.045)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.028) 0 1px, transparent 1px 96px);
  opacity: .62;
}

.path-card {
  min-height: 310px;
  padding: 26px;
  display: flex;
  flex-direction: column;
}

.path-card > *,
.process-flow-card > *,
.revision-panel > * {
  position: relative;
  z-index: 1;
}

.path-card > span,
.process-flow-card > span {
  width: fit-content;
  min-width: 46px;
  height: 34px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: #090a0c;
  background: linear-gradient(135deg, #f1d493, #d8b56d);
  font-size: 12px;
  font-weight: 950;
}

.path-card h3,
.process-flow-card h3 {
  margin: 28px 0 0;
  color: #f3efe5;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.04;
}

.path-card p {
  margin: 14px 0 0;
  color: rgba(243,239,229,.68);
  font-size: 15px;
  line-height: 1.56;
}

.path-card a {
  width: fit-content;
  min-height: 46px;
  margin-top: auto;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  color: #090a0c;
  background: linear-gradient(135deg, #f1d493, #d8b56d 55%, #a9853d);
  font-weight: 950;
  text-decoration: none;
  box-shadow: 0 18px 42px rgba(216,181,109,.16);
}

.process-flow-grid {
  grid-template-columns: .9fr 1.1fr;
}

.process-flow-card {
  min-height: 286px;
  padding: 24px;
}

.process-flow-card h3 {
  max-width: 460px;
  margin-top: 16px;
  font-size: clamp(26px, 3vw, 40px);
}

.compact-flow {
  margin-top: 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.compact-flow::before {
  top: 37px;
}

.compact-flow li {
  min-height: 128px;
}

.process-flow-card:nth-child(2) .compact-flow {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.revision-panel {
  padding: clamp(24px, 4vw, 42px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: end;
  background:
    radial-gradient(circle at 18% 16%, rgba(127,231,255,.10), transparent 30%),
    radial-gradient(circle at 88% 70%, rgba(241,212,147,.18), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.088), rgba(255,255,255,.022)),
    rgba(7,8,10,.86);
}

.revision-panel h2 {
  max-width: 780px;
  margin: 12px 0 0;
  color: #f3efe5;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1.02;
}

.revision-panel p {
  max-width: 700px;
  margin: 16px 0 0;
  color: rgba(243,239,229,.70);
  font-size: 17px;
  line-height: 1.58;
}

.revision-panel .btn {
  min-width: 238px;
  color: #090a0c;
  background: linear-gradient(135deg, #f1d493, #d8b56d 55%, #a9853d);
  box-shadow: 0 18px 44px rgba(216,181,109,.18);
}

.included-layout {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 14px;
  align-items: stretch;
}

.included-panel {
  min-height: 330px;
  padding: clamp(24px, 4vw, 38px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background:
    radial-gradient(circle at 78% 20%, rgba(127,231,255,.16), transparent 32%),
    radial-gradient(circle at 12% 82%, rgba(216,181,109,.18), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.090), rgba(255,255,255,.020)),
    #07080a;
}

.included-panel span,
.trust-grid span {
  color: #7fe7ff;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}

.included-panel b {
  display: block;
  max-width: 420px;
  margin-top: 14px;
  color: #f3efe5;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.02;
}

.included-panel p {
  max-width: 520px;
  margin: 16px 0 0;
  color: rgba(243,239,229,.70);
  font-size: 16px;
  line-height: 1.56;
}

.included-list,
.process-timeline {
  margin: 0;
  padding: 0;
  list-style: none;
}

.included-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.included-list li {
  min-height: 158px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.included-list b {
  display: block;
  color: #f3efe5;
  font-size: 19px;
  line-height: 1.22;
}

.process-section {
  padding-top: 8px;
}

.process-timeline {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  position: relative;
}

.process-timeline::before {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  top: 45px;
  height: 1px;
  background: linear-gradient(90deg, rgba(127,231,255,.55), rgba(241,212,147,.50), transparent);
  pointer-events: none;
}

.process-timeline li {
  min-height: 170px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.process-timeline b {
  position: relative;
  z-index: 1;
  color: #f3efe5;
  font-size: 17px;
  line-height: 1.22;
}

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

.trust-grid article {
  min-height: 214px;
  padding: 22px;
}

.trust-grid b {
  display: block;
  margin-top: 14px;
  color: #f3efe5;
  font-size: 22px;
  line-height: 1.12;
}

.trust-grid a {
  position: relative;
  z-index: 1;
  display: inline-flex;
  margin-top: 18px;
  color: #f1d493;
  font-weight: 950;
}

.funnel-faq {
  grid-template-columns: 1fr 1fr;
}

.funnel-faq details {
  padding: 20px;
  color: #f3efe5;
  background:
    linear-gradient(145deg, rgba(255,255,255,.080), rgba(255,255,255,.020)),
    rgba(7,8,10,.78);
}

.funnel-faq summary {
  color: #f3efe5;
  font-size: 18px;
  line-height: 1.24;
}

.funnel-faq p {
  margin: 12px 0 0;
  color: rgba(243,239,229,.66);
  line-height: 1.52;
}

.funnel-request {
  margin-top: 26px;
  margin-bottom: 18px;
}

.funnel-request .request-placeholder-card .btn {
  width: fit-content;
  min-height: 52px;
  margin-top: 20px;
  color: #090a0c;
  background: linear-gradient(135deg, #f1d493, #d8b56d 55%, #a9853d);
  box-shadow: 0 18px 44px rgba(216,181,109,.18);
}

@media (max-width: 1080px) {
  .process-timeline {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .path-card-grid,
  .process-flow-grid,
  .process-flow-card:nth-child(2) .compact-flow {
    grid-template-columns: 1fr;
  }

  .process-timeline::before {
    display: none;
  }
}

@media (max-width: 768px) {
  .funnel-section {
    width: calc(100% - 20px);
    margin: 18px 10px;
  }

  .funnel-head {
    margin-bottom: 16px;
  }

  .funnel-head h2 {
    font-size: clamp(28px, 8vw, 42px);
  }

  .funnel-head p {
    font-size: 15px;
  }

  .funnel-card-grid,
  .included-layout,
  .path-card-grid,
  .process-flow-grid,
  .trust-grid,
  .funnel-faq {
    grid-template-columns: 1fr;
  }

  .included-list,
  .process-timeline {
    grid-template-columns: 1fr 1fr;
  }

  .funnel-card,
  .trust-grid article,
  .path-card,
  .process-flow-card {
    min-height: auto;
    padding: 18px;
  }

  .path-card a {
    margin-top: 20px;
  }

  .revision-panel {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 24px 20px;
  }

  .revision-panel .btn {
    width: 100%;
  }

  .included-panel {
    min-height: 260px;
    padding: 24px 20px;
  }

  .included-list li,
  .process-timeline li {
    min-height: 132px;
    padding: 16px;
  }
}

@media (max-width: 430px) {
  .funnel-section {
    width: calc(100% - 16px);
    margin-left: 8px;
    margin-right: 8px;
  }

  .funnel-card-grid,
  .path-card-grid,
  .included-list,
  .process-timeline,
  .process-flow-grid,
  .trust-grid,
  .funnel-faq {
    gap: 9px;
  }

  .included-list,
  .process-timeline {
    grid-template-columns: 1fr;
  }

  .funnel-card h3,
  .trust-grid b {
    font-size: 20px;
  }

  .funnel-request .request-placeholder-card .btn {
    width: 100%;
  }
}

/* Hero v29 cinematic polish */
.home-hero-v2.production-hero {
  background:
    radial-gradient(circle at 78% 24%, rgba(241,212,147,.18), transparent 30%),
    radial-gradient(circle at 92% 66%, rgba(127,231,255,.07), transparent 28%),
    linear-gradient(116deg, rgba(4,5,7,.99), rgba(10,12,16,.98) 46%, rgba(20,19,22,.97)),
    linear-gradient(90deg, rgba(216,181,109,.10), transparent 33%, rgba(127,231,255,.055) 72%, transparent),
    repeating-linear-gradient(90deg, rgba(255,255,255,.032) 0 1px, transparent 1px 128px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.024) 0 1px, transparent 1px 104px);
}

.production-room {
  isolation: isolate;
  background:
    radial-gradient(circle at 50% 48%, rgba(241,212,147,.16), transparent 28%),
    radial-gradient(circle at 78% 34%, rgba(127,231,255,.07), transparent 27%),
    linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.025)),
    linear-gradient(315deg, rgba(216,181,109,.16), transparent 50%),
    rgba(5,6,8,.84);
}

.production-room.studio-command::before {
  content: "";
  display: block;
  position: absolute;
  inset: 18px 22px;
  z-index: 0;
  pointer-events: none;
  border-radius: 26px;
  background:
    linear-gradient(90deg, transparent 0 17%, rgba(241,212,147,.11) 17.2% 17.35%, transparent 17.55% 100%),
    linear-gradient(90deg, transparent 0 73%, rgba(255,255,255,.08) 73.15% 73.25%, transparent 73.5% 100%),
    linear-gradient(0deg, transparent 0 22%, rgba(241,212,147,.08) 22.15% 22.3%, transparent 22.5% 100%),
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.07), transparent 36%);
  opacity: .72;
  transform: translate3d(var(--px-deep), var(--py-deep), -30px);
}

.production-room::after {
  z-index: 9;
  box-shadow:
    inset 0 0 42px rgba(241,212,147,.07),
    inset 0 0 76px rgba(0,0,0,.22);
}

.control-panel {
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 48%, rgba(241,212,147,.12), transparent 32%),
    linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.024)),
    linear-gradient(180deg, rgba(5,6,8,.86), rgba(5,6,8,.45));
}

.control-panel::before {
  width: 470px;
  height: 470px;
  opacity: .58;
  background:
    radial-gradient(circle, rgba(241,212,147,.18) 0 2px, transparent 3px 100%),
    radial-gradient(circle, rgba(241,212,147,.11), transparent 60%);
  box-shadow:
    0 0 0 1px rgba(241,212,147,.08),
    0 0 0 92px rgba(241,212,147,.018),
    0 0 0 182px rgba(255,255,255,.012);
}

.room-depth-stack,
.orbit-paths {
  position: absolute;
  inset: 0;
  pointer-events: none;
  transform-style: preserve-3d;
}

.room-depth-stack {
  z-index: 3;
  opacity: .86;
  transform: translate3d(var(--px-deep), var(--py-deep), -42px);
}

.room-sheet {
  position: absolute;
  display: block;
  border-radius: 22px;
  border: 1px solid rgba(241,212,147,.12);
  background:
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.012)),
    linear-gradient(180deg, rgba(241,212,147,.07), transparent);
  box-shadow: 0 22px 70px rgba(0,0,0,.22);
}

.sheet-a {
  width: 250px;
  height: 330px;
  left: 52px;
  top: 112px;
  transform: rotate(-9deg) skewY(-2deg);
  opacity: .36;
}

.sheet-b {
  width: 220px;
  height: 290px;
  right: 34px;
  top: 78px;
  transform: rotate(8deg) skewY(2deg);
  opacity: .28;
}

.sheet-c {
  width: 310px;
  height: 205px;
  left: calc(50% - 154px);
  bottom: 54px;
  transform: rotate(2deg);
  opacity: .25;
}

.orbit-paths {
  z-index: 4;
  transform: translate3d(var(--px-soft), var(--py-soft), 0);
}

.orbit-paths span {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  border-radius: 50%;
  border: 1px solid rgba(241,212,147,.16);
  border-left-color: rgba(127,231,255,.08);
  border-bottom-color: transparent;
  transform: translate(-50%, -50%) rotate(var(--orbit-r, 0deg));
  opacity: 0;
  animation: orbitReveal .9s .72s ease both, orbitDrift 12s 1.55s linear infinite;
}

.orbit-paths span:nth-child(1) {
  width: 390px;
  height: 188px;
  --orbit-r: -13deg;
}

.orbit-paths span:nth-child(2) {
  width: 440px;
  height: 238px;
  --orbit-r: 18deg;
  animation-delay: .86s, 1.7s;
}

.orbit-paths span:nth-child(3) {
  width: 322px;
  height: 302px;
  --orbit-r: 49deg;
  opacity: .42;
  animation-delay: 1s, 1.9s;
}

.scan-beam {
  width: 14%;
  background: linear-gradient(90deg, transparent, rgba(241,212,147,.18), rgba(255,255,255,.12), transparent);
  mix-blend-mode: screen;
}

.control-top span,
.project-core span,
.project-artefact span,
.presentation-artifact span {
  color: rgba(241,212,147,.82);
  letter-spacing: 0;
  text-transform: none;
}

.mission-status-rail span {
  color: rgba(243,239,229,.74);
  text-transform: none;
  letter-spacing: 0;
  background: rgba(5,6,8,.70);
  border-color: rgba(241,212,147,.13);
}

.mission-status-rail i {
  background: #f1d493;
  box-shadow: 0 0 0 5px rgba(216,181,109,.10), 0 0 16px rgba(216,181,109,.45);
}

.mission-line {
  width: 250px;
  background: linear-gradient(90deg, rgba(241,212,147,.86), rgba(241,212,147,.28), transparent);
  opacity: .76;
  filter: drop-shadow(0 0 5px rgba(241,212,147,.10));
}

.line-a {
  top: 43%;
  left: 51%;
  --angle: -158deg;
}

.line-b {
  top: 42%;
  left: 51%;
  --angle: -24deg;
}

.line-c {
  top: 55%;
  left: 49%;
  --angle: 174deg;
}

.line-d {
  top: 51%;
  left: 52%;
  --angle: 14deg;
}

.line-e {
  top: 60%;
  left: 50%;
  width: 168px;
}

.project-core {
  left: 52%;
  width: clamp(300px, 25vw, 338px);
  min-height: 278px;
  padding: 30px;
  z-index: 9;
  border-radius: 28px;
  background:
    radial-gradient(circle at 72% 76%, rgba(241,212,147,.18), transparent 30%),
    linear-gradient(150deg, rgba(255,255,255,.18), rgba(255,255,255,.045)),
    linear-gradient(180deg, rgba(7,8,10,.96), rgba(7,8,10,.66));
  border-color: rgba(241,212,147,.34);
  box-shadow:
    0 38px 110px rgba(0,0,0,.44),
    0 0 64px rgba(216,181,109,.16),
    inset 0 1px 0 rgba(255,255,255,.14);
  transform: translate(-50%, -50%) translate3d(var(--px), var(--py), 74px) rotate(-1deg);
}

.project-core::after {
  content: "";
  position: absolute;
  inset: 13px;
  pointer-events: none;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.07);
  background:
    linear-gradient(90deg, rgba(241,212,147,.14), transparent 1px) 0 0 / 44px 100%,
    linear-gradient(180deg, transparent 0 67%, rgba(255,255,255,.06) 67.2%, transparent 67.6%);
  opacity: .36;
}

.project-core b {
  max-width: 210px;
  font-size: 33px;
}

.project-core p {
  max-width: 210px;
  color: rgba(243,239,229,.72);
}

.project-progress {
  width: 78px;
  height: 78px;
  right: 22px;
  bottom: 22px;
  box-shadow: 0 0 34px rgba(216,181,109,.18);
}

.mission-workflow .mission-card {
  --card-r: 0deg;
  --card-z: 0px;
  --card-scale: 1;
  width: 158px;
  min-height: 88px;
  z-index: 5;
  transform-style: preserve-3d;
  background:
    linear-gradient(145deg, rgba(255,255,255,.115), rgba(255,255,255,.024)),
    rgba(7,8,10,.78);
  border-color: rgba(241,212,147,.12);
  box-shadow:
    0 18px 58px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.07);
  transform: translate3d(var(--card-x), calc(var(--card-y) + 24px), var(--card-z)) rotate(var(--card-r)) scale(calc(var(--card-scale) * .95));
  animation-name: missionCardRiseV29;
}

.mission-workflow .mission-card:hover {
  border-color: rgba(241,212,147,.38);
  box-shadow: 0 28px 82px rgba(0,0,0,.36), 0 0 38px rgba(216,181,109,.12);
  transform: translate3d(var(--card-x), calc(var(--card-y) - 5px), calc(var(--card-z) + 22px)) rotate(var(--card-r)) scale(calc(var(--card-scale) * 1.03));
}

.mission-workflow .mission-card > span {
  background:
    linear-gradient(135deg, #f1d493, #b99653),
    #d8b56d;
  color: #090806;
  box-shadow: 0 0 0 5px rgba(216,181,109,.09);
}

.card-topic {
  top: 94px;
  left: 28px;
  z-index: 8;
  --card-r: -5deg;
  --card-z: 38px;
  --card-scale: 1.03;
}

.card-requirements {
  top: 128px;
  right: 8px;
  z-index: 4;
  opacity: .88;
  --card-r: 5deg;
  --card-z: -12px;
  --card-scale: .92;
}

.card-plan {
  top: 292px;
  left: -10px;
  z-index: 4;
  opacity: .86;
  --card-r: -3deg;
  --card-z: -18px;
  --card-scale: .9;
}

.card-text {
  top: 236px;
  right: -16px;
  z-index: 7;
  --card-r: 4deg;
  --card-z: 24px;
  --card-scale: .96;
}

.card-format {
  bottom: 100px;
  left: 26px;
  z-index: 4;
  opacity: .84;
  --card-r: 3deg;
  --card-z: -22px;
  --card-scale: .88;
}

.card-slides {
  bottom: 158px;
  right: 34px;
  z-index: 7;
  --card-r: -4deg;
  --card-z: 28px;
  --card-scale: .96;
}

.card-revision {
  bottom: 34px;
  left: calc(50% - 128px);
  width: 256px;
  z-index: 8;
  --card-r: 1.8deg;
  --card-z: 34px;
  --card-scale: 1.02;
}

.card-delivery {
  bottom: 38px;
  right: 18px;
  width: 164px;
  z-index: 5;
  opacity: .82;
  --card-r: -4deg;
  --card-z: 8px;
  --card-scale: .84;
}

.project-artefact {
  border-color: rgba(241,212,147,.11);
  background:
    linear-gradient(150deg, rgba(255,255,255,.12), rgba(255,255,255,.026)),
    rgba(5,6,8,.68);
}

.document-fragment {
  top: 172px;
  left: calc(50% - 92px);
  z-index: 5;
  opacity: .58;
  transform: translate3d(var(--px-soft), var(--py-reverse), -16px) rotate(-9deg);
}

.slide-preview {
  right: 98px;
  bottom: 118px;
  z-index: 4;
  opacity: .48;
  transform: translate3d(var(--px-deep), var(--py-soft), -20px) rotate(6deg);
}

.revision-check {
  left: 36px;
  bottom: 232px;
  z-index: 6;
  transform: translate3d(var(--px-reverse), var(--py-deep), 18px) rotate(-6deg);
}

.presentation-artifact {
  width: 236px;
  right: 18px;
  bottom: 56px;
  z-index: 7;
  padding: 16px;
  border-radius: 22px;
  opacity: 0;
  background:
    radial-gradient(circle at 78% 20%, rgba(241,212,147,.18), transparent 31%),
    linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.035)),
    rgba(7,8,10,.82);
  border-color: rgba(241,212,147,.20);
  box-shadow:
    0 30px 92px rgba(0,0,0,.34),
    0 0 36px rgba(216,181,109,.12);
  transform: translate3d(var(--px-deep), var(--py-soft), 44px) rotateY(-8deg) rotateZ(3deg);
  animation: artefactRise .72s 1.05s cubic-bezier(.2,.78,.18,1) both;
}

.presentation-artifact b {
  font-size: 17px;
}

.presentation-frame {
  position: relative;
  height: 112px;
  margin-top: 13px;
  overflow: hidden;
  border-radius: 16px;
  background:
    linear-gradient(90deg, rgba(241,212,147,.16), transparent 1px) 0 0 / 26px 100%,
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03)),
    rgba(5,6,8,.66);
  border: 1px solid rgba(255,255,255,.09);
}

.presentation-frame::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 18px;
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 36% 32%, #f1d493 0 18%, transparent 19%),
    linear-gradient(135deg, rgba(241,212,147,.36), rgba(241,212,147,.08));
  box-shadow: 0 0 32px rgba(216,181,109,.18);
}

.presentation-frame i {
  position: absolute;
  right: 16px;
  display: block;
  height: 7px;
  border-radius: 999px;
  background: rgba(243,239,229,.24);
}

.presentation-frame i:nth-child(1) {
  top: 24px;
  width: 88px;
}

.presentation-frame i:nth-child(2) {
  top: 45px;
  width: 112px;
  background: rgba(241,212,147,.38);
}

.presentation-frame i:nth-child(3) {
  top: 66px;
  width: 70px;
}

.mobile-workflow-compact {
  display: none;
}

@keyframes orbitReveal {
  from {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(var(--orbit-r)) scale(.92);
  }
  to {
    opacity: .58;
    transform: translate(-50%, -50%) rotate(var(--orbit-r)) scale(1);
  }
}

@keyframes orbitDrift {
  to {
    transform: translate(-50%, -50%) rotate(calc(var(--orbit-r) + 360deg));
  }
}

@keyframes missionCardRiseV29 {
  from {
    opacity: 0;
    filter: blur(6px);
    transform: translate3d(var(--card-x), calc(var(--card-y) + 34px), calc(var(--card-z) - 24px)) rotate(var(--card-r)) scale(calc(var(--card-scale) * .88));
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(var(--card-x), var(--card-y), var(--card-z)) rotate(var(--card-r)) scale(var(--card-scale));
  }
}

@media (max-width: 1080px) {
  .project-core {
    width: 292px;
  }

  .presentation-artifact {
    width: 214px;
    right: 10px;
  }
}

@media (max-width: 980px) and (min-width: 769px) {
  .room-depth-stack,
  .orbit-paths {
    display: none;
  }

  .mission-workflow .mission-card,
  .mission-workflow .mission-card:hover {
    position: relative;
    inset: auto;
    width: auto;
    opacity: 1;
    transform: none;
  }

  .project-artefact,
  .presentation-artifact {
    position: relative;
    inset: auto;
    width: auto;
    opacity: 1;
    transform: none;
  }

  .presentation-frame {
    height: 92px;
  }
}

@media (max-width: 768px) {
  .production-hero .studio-hero-copy h1 {
    font-size: clamp(32px, 5.8vw, 43px);
    line-height: 1.05;
  }

  .room-depth-stack,
  .orbit-paths,
  .mission-lines,
  .scan-beam,
  .artefact-grid,
  .mission-footer,
  .control-panel::before,
  .control-panel::after {
    display: none;
  }

  .production-room {
    min-height: 0;
    padding: 10px;
    background:
      linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.022)),
      radial-gradient(circle at 50% 18%, rgba(241,212,147,.12), transparent 35%),
      rgba(5,6,8,.86);
  }

  .production-room.studio-command::before {
    display: none;
  }

  .mission-status-rail span {
    text-transform: none;
  }

  .control-panel {
    padding: 15px;
    min-height: 0;
    gap: 12px;
  }

  .project-core,
  .project-core:hover {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    min-height: 136px;
    padding: 18px;
    transform: none;
  }

  .project-core::after {
    inset: 10px;
  }

  .project-core b {
    max-width: calc(100% - 66px);
    font-size: 23px;
  }

  .project-core p {
    max-width: calc(100% - 66px);
  }

  .project-progress {
    position: absolute;
    right: 14px;
    top: 16px;
    bottom: auto;
    width: 52px;
    height: 52px;
  }

  .mission-workflow {
    display: none;
  }

  .mobile-workflow-compact {
    display: grid;
    grid-template-columns: auto 18px auto 18px auto 18px auto;
    align-items: center;
    gap: 6px;
    padding: 13px;
    border-radius: 18px;
    color: rgba(243,239,229,.82);
    background:
      linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.025)),
      rgba(7,8,10,.74);
    border: 1px solid rgba(241,212,147,.14);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
  }

  .mobile-workflow-compact span {
    min-width: 0;
    font-size: 12px;
    font-weight: 850;
    line-height: 1.15;
    text-align: center;
  }

  .mobile-workflow-compact i {
    display: block;
    height: 1px;
    background: linear-gradient(90deg, rgba(241,212,147,.70), rgba(241,212,147,.10));
  }
}

@media (max-width: 520px) {
  .production-hero .studio-hero-copy h1 {
    font-size: clamp(28px, 7.4vw, 32px);
    line-height: 1.065;
    text-wrap: balance;
  }

  .production-hero .studio-hero-actions {
    margin-top: 20px;
  }

  .production-hero .academic-proof {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .production-hero .academic-proof span {
    padding: 10px 9px;
    font-size: 11px;
  }

  .production-hero .academic-proof span:nth-child(n+5) {
    display: none;
  }

  .mission-status-rail {
    gap: 6px;
  }

  .mission-status-rail span {
    min-height: 28px;
    padding: 7px 8px;
    font-size: 10px;
  }

  .control-top b {
    font-size: 18px;
  }

  .project-core {
    min-height: 124px;
    padding: 16px;
  }

  .project-core b {
    font-size: 21px;
  }

  .project-core p {
    margin-top: 8px;
    font-size: 11px;
    line-height: 1.38;
  }

  .mobile-workflow-compact {
    grid-template-columns: 1fr 14px 1fr 14px 1fr 14px 1fr;
    gap: 4px;
    padding: 11px 9px;
    border-radius: 16px;
  }

  .mobile-workflow-compact span {
    font-size: 11px;
  }
}

@media (max-width: 390px) {
  .production-hero .studio-hero-copy h1 {
    font-size: clamp(27px, 7.25vw, 30px);
  }

  .production-hero .studio-hero-copy p,
  .production-hero.clean-hero .studio-hero-copy p {
    font-size: 14px;
  }

  .production-room {
    padding: 8px;
  }

  .control-panel {
    padding: 12px;
  }

  .mobile-workflow-compact {
    grid-template-columns: 1fr 10px 1fr 10px 1fr 10px 1fr;
  }

  .mobile-workflow-compact span {
    font-size: 10px;
  }
}

@media (max-width: 360px) {
  .production-hero .studio-hero-copy h1 {
    font-size: 26px;
  }

  .production-hero .academic-proof span {
    font-size: 10.5px;
  }

  .mission-status-rail span:nth-child(2) {
    display: none;
  }

  .project-core p {
    max-width: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .orbit-paths span,
  .presentation-artifact,
  .mission-workflow .mission-card {
    animation: none;
  }

  .orbit-paths span {
    opacity: .36;
  }

  .project-core,
  .presentation-artifact,
  .mission-workflow .mission-card,
  .mission-workflow .mission-card:hover {
    transform: none;
  }
}

@media (min-width: 981px) {
  .production-hero .studio-hero-copy h1 {
    max-width: 560px;
    font-size: clamp(46px, 3.55vw, 54px);
    line-height: 1.06;
  }

  .production-hero.clean-hero .studio-hero-copy p {
    max-width: 520px;
  }
}

/* Hero v30 bespoke artifact pass */
body:has(.production-hero) {
  background:
    radial-gradient(circle at 50% -12%, rgba(216,181,109,.20), transparent 31%),
    radial-gradient(circle at 8% 20%, rgba(58,66,74,.34), transparent 30%),
    radial-gradient(circle at 94% 10%, rgba(29,43,56,.36), transparent 34%),
    linear-gradient(180deg, #07090d 0%, #10131a 42%, #080a0f 100%);
}

.home-hero-v2.production-hero {
  box-shadow:
    0 42px 140px rgba(0,0,0,.52),
    0 0 0 1px rgba(241,212,147,.08),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.home-hero-v2.production-hero::before {
  background:
    radial-gradient(circle at 76% 34%, rgba(241,212,147,.16), transparent 28%),
    linear-gradient(105deg, transparent 0%, rgba(241,212,147,.08) 42%, transparent 55%),
    linear-gradient(148deg, rgba(127,231,255,.045) 0%, transparent 34%),
    linear-gradient(26deg, transparent 58%, rgba(216,181,109,.14) 100%);
}

.production-room {
  background:
    radial-gradient(circle at 50% 48%, rgba(241,212,147,.20), transparent 26%),
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.07), transparent 24%),
    linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.022)),
    linear-gradient(315deg, rgba(216,181,109,.18), transparent 54%),
    rgba(5,6,8,.88);
}

.control-panel {
  background:
    radial-gradient(circle at 50% 49%, rgba(241,212,147,.13), transparent 31%),
    radial-gradient(circle at 20% 76%, rgba(255,255,255,.035), transparent 26%),
    linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.022)),
    linear-gradient(180deg, rgba(5,6,8,.90), rgba(5,6,8,.50));
}

.artifact-stage {
  position: absolute;
  inset: 36px 8px 18px;
  z-index: 4;
  width: calc(100% - 16px);
  height: calc(100% - 54px);
  pointer-events: none;
  overflow: visible;
  transform: translate3d(var(--px-soft), var(--py-soft), 8px);
  opacity: .95;
}

.artifact-stage path {
  vector-effect: non-scaling-stroke;
}

.artifact-orbit {
  fill: none;
  stroke: rgba(241,212,147,.62);
  stroke-width: 1;
  stroke-dasharray: 720;
  stroke-dashoffset: 720;
  opacity: .68;
  animation: artifactPathDraw 1.3s .42s cubic-bezier(.2,.78,.18,1) forwards;
}

.artifact-orbit.orbit-soft {
  opacity: .34;
  animation-delay: .64s;
}

.artifact-route {
  fill: none;
  stroke: rgba(241,212,147,.50);
  stroke-width: 1.2;
  stroke-dasharray: 260;
  stroke-dashoffset: 260;
  opacity: .52;
  animation: artifactRouteDraw .9s .82s cubic-bezier(.2,.78,.18,1) forwards;
}

.route-b {
  animation-delay: .96s;
}

.route-c {
  animation-delay: 1.1s;
}

.artifact-docs path {
  fill: rgba(255,255,255,.055);
  stroke: rgba(241,212,147,.13);
  stroke-width: 1;
  opacity: .52;
  transform-origin: center;
}

.artifact-docs path:nth-child(1) {
  transform: translate3d(var(--px-deep), var(--py-reverse), 0);
}

.artifact-docs path:nth-child(2) {
  transform: translate3d(var(--px-reverse), var(--py-soft), 0);
  opacity: .42;
}

.artifact-docs path:nth-child(3) {
  transform: translate3d(var(--px-soft), var(--py-deep), 0);
  opacity: .35;
}

.artifact-slide path:first-child {
  fill: rgba(255,255,255,.045);
  stroke: rgba(241,212,147,.18);
  stroke-width: 1;
}

.artifact-slide path:not(:first-child) {
  fill: none;
  stroke: rgba(241,212,147,.36);
  stroke-width: 5;
  stroke-linecap: round;
  opacity: .72;
}

.project-core {
  left: 49%;
  top: 51%;
  width: clamp(344px, 30vw, 386px);
  min-height: 336px;
  padding: 34px 34px 30px;
  border-radius: 34px 22px 40px 24px;
  clip-path: polygon(0 7%, 82% 0, 100% 16%, 100% 90%, 14% 100%, 0 82%);
  background:
    radial-gradient(circle at 77% 74%, rgba(241,212,147,.24), transparent 28%),
    linear-gradient(150deg, rgba(255,255,255,.20), rgba(255,255,255,.050)),
    linear-gradient(180deg, rgba(7,8,10,.98), rgba(7,8,10,.70));
  border-color: rgba(241,212,147,.42);
  box-shadow:
    0 48px 130px rgba(0,0,0,.52),
    0 0 82px rgba(216,181,109,.20),
    inset 0 1px 0 rgba(255,255,255,.15);
  transform: translate(-50%, -50%) translate3d(var(--px), var(--py), 92px) rotate(-2deg);
}

.project-core > span,
.project-core > b,
.project-core > p,
.project-progress {
  position: relative;
  z-index: 3;
}

.project-core b {
  max-width: 238px;
  font-size: 37px;
}

.project-core p {
  max-width: 236px;
  font-size: 14px;
}

.project-progress {
  right: 26px;
  bottom: 28px;
  width: 84px;
  height: 84px;
}

.final-artifact-chrome {
  position: absolute;
  inset: 18px;
  z-index: 1;
  pointer-events: none;
  border-radius: 26px 16px 32px 18px;
  background:
    linear-gradient(90deg, rgba(241,212,147,.13), transparent 1px) 0 0 / 48px 100%,
    linear-gradient(180deg, transparent 0 67%, rgba(255,255,255,.065) 67.2%, transparent 67.6%),
    radial-gradient(circle at 79% 77%, rgba(241,212,147,.14), transparent 24%);
  opacity: .64;
}

.final-artifact-chrome i {
  position: absolute;
  display: block;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(241,212,147,.46), transparent);
}

.final-artifact-chrome i:nth-child(1) {
  left: 34px;
  right: 116px;
  top: 62%;
}

.final-artifact-chrome i:nth-child(2) {
  left: 34px;
  right: 150px;
  top: 71%;
  opacity: .62;
}

.final-artifact-chrome i:nth-child(3) {
  left: 34px;
  right: 188px;
  top: 80%;
  opacity: .42;
}

.final-artifact-chrome span {
  position: absolute;
  right: 36px;
  bottom: 32px;
  width: 92px;
  height: 92px;
  display: block;
  border-radius: 50%;
  border: 1px solid rgba(241,212,147,.18);
  background: radial-gradient(circle, rgba(241,212,147,.10), transparent 58%);
}

.mission-workflow .mission-card {
  border-radius: 18px 14px 22px 14px;
  clip-path: polygon(0 0, 86% 0, 100% 18%, 100% 100%, 12% 100%, 0 84%);
}

.card-topic {
  top: 88px;
  left: 38px;
  z-index: 8;
  --card-scale: .98;
}

.card-requirements {
  top: 114px;
  right: 8px;
  z-index: 3;
  opacity: .72;
  --card-scale: .84;
  --card-z: -36px;
}

.card-plan {
  top: 302px;
  left: -18px;
  z-index: 3;
  opacity: .68;
  --card-scale: .82;
  --card-z: -40px;
}

.card-text {
  top: 250px;
  right: -24px;
  z-index: 5;
  opacity: .78;
  --card-scale: .88;
  --card-z: -10px;
}

.card-format {
  bottom: 94px;
  left: 20px;
  z-index: 4;
  opacity: .70;
  --card-scale: .82;
  --card-z: -34px;
}

.card-slides {
  bottom: 188px;
  right: 26px;
  z-index: 6;
  opacity: .86;
  --card-scale: .92;
  --card-z: 18px;
}

.card-revision {
  bottom: 26px;
  left: calc(50% - 102px);
  width: 204px;
  z-index: 5;
  opacity: .82;
  --card-scale: .88;
  --card-z: -8px;
}

.card-delivery {
  bottom: 40px;
  right: 14px;
  width: 168px;
  z-index: 4;
  opacity: .78;
  --card-scale: .82;
  --card-z: -18px;
}

.presentation-artifact {
  right: 10px;
  bottom: 62px;
  width: 252px;
  opacity: .82;
  z-index: 6;
  transform: translate3d(var(--px-deep), var(--py-soft), 34px) rotateY(-10deg) rotateZ(4deg);
}

.document-fragment {
  top: 148px;
  left: calc(50% - 86px);
  opacity: .38;
  z-index: 3;
}

.slide-preview {
  opacity: .24;
  z-index: 2;
}

.revision-check {
  left: 28px;
  bottom: 238px;
  opacity: .74;
}

.mission-lines {
  opacity: .56;
}

.orbit-paths {
  opacity: .78;
}

.production-transition-line {
  background: linear-gradient(180deg, rgba(241,212,147,.90), rgba(241,212,147,.32), transparent);
}

@keyframes artifactPathDraw {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes artifactRouteDraw {
  to {
    stroke-dashoffset: 0;
  }
}

@media (max-width: 1080px) {
  .project-core {
    width: 326px;
    min-height: 306px;
    padding: 30px;
  }

  .project-core b {
    font-size: 33px;
  }

  .presentation-artifact {
    width: 220px;
  }
}

@media (max-width: 768px) {
  body:has(.production-hero) {
    background:
      radial-gradient(circle at 50% -8%, rgba(216,181,109,.18), transparent 34%),
      radial-gradient(circle at 94% 4%, rgba(38,48,58,.34), transparent 32%),
      linear-gradient(180deg, #080a0f 0%, #10131a 48%, #080a0f 100%);
  }

  .artifact-stage,
  .final-artifact-chrome {
    display: none;
  }

  .project-core,
  .project-core:hover {
    position: relative;
    left: auto;
    top: auto;
    clip-path: none;
    border-radius: 22px;
    width: auto;
    min-height: 132px;
    padding: 18px;
    transform: none;
  }

  .project-core b {
    font-size: 23px;
  }

  .project-core p {
    font-size: 12px;
  }
}

@media (max-width: 430px) {
  .production-hero .studio-hero-copy {
    padding-top: 22px;
    padding-bottom: 22px;
  }

  .production-hero .studio-hero-actions {
    margin-top: 18px;
  }

  .project-core {
    min-height: 118px;
  }

  .project-core p {
    max-width: none;
  }

  .project-progress {
    display: none;
  }

  .mobile-workflow-compact {
    margin-top: -2px;
  }
}

@media (max-width: 390px) {
  .production-hero .studio-hero-copy h1 {
    font-size: clamp(26px, 7vw, 29px);
  }

  .production-hero .studio-hero-copy p,
  .production-hero.clean-hero .studio-hero-copy p {
    line-height: 1.48;
  }
}

@media (prefers-reduced-motion: reduce) {
  .artifact-orbit,
  .artifact-route {
    animation: none;
    stroke-dashoffset: 0;
  }

  .artifact-stage,
  .artifact-docs path {
    transform: none;
  }
}

/* Hero v31 short viewport and motion polish */
.home-hero-v2.production-hero {
  animation: v31HeroShellIn .72s cubic-bezier(.18,.72,.2,1) both;
}

.production-copy {
  animation: v31PanelIn .76s .08s cubic-bezier(.18,.72,.2,1) both;
}

.production-room {
  animation: v31PanelIn .82s .14s cubic-bezier(.18,.72,.2,1) both;
}

.production-hero .studio-kicker,
.production-hero .studio-hero-copy h1,
.production-hero .studio-hero-copy p {
  opacity: 0;
  animation: v31TextIn .62s var(--v31-delay, .32s) cubic-bezier(.18,.72,.2,1) both;
}

.production-hero .studio-kicker {
  --v31-delay: .26s;
}

.production-hero .studio-hero-copy h1 {
  --v31-delay: .38s;
}

.production-hero .studio-hero-copy p {
  --v31-delay: .52s;
}

.production-hero .studio-hero-actions {
  animation: v31CtaIn .58s .70s cubic-bezier(.18,.72,.2,1) both;
}

.production-hero .academic-proof span {
  opacity: 0;
  animation: v31ProofIn .46s calc(.82s + var(--proof-delay, 0s)) cubic-bezier(.18,.72,.2,1) both;
}

.production-hero .academic-proof span:nth-child(2) {
  --proof-delay: .04s;
}

.production-hero .academic-proof span:nth-child(3) {
  --proof-delay: .08s;
}

.production-hero .academic-proof span:nth-child(4) {
  --proof-delay: .12s;
}

.production-hero .academic-proof span:nth-child(5) {
  --proof-delay: .16s;
}

.production-hero .academic-proof span:nth-child(6) {
  --proof-delay: .20s;
}

.scan-beam {
  animation-duration: 4.8s;
  animation-delay: .78s;
}

.production-beam {
  animation-duration: 6.8s;
  animation-delay: .72s;
}

.artifact-orbit {
  animation-duration: 1.55s;
  animation-delay: .50s;
  animation-timing-function: cubic-bezier(.18,.72,.2,1);
}

.artifact-orbit.orbit-soft {
  animation-delay: .66s;
}

.artifact-route {
  animation-duration: 1.05s;
  animation-delay: .92s;
  animation-timing-function: cubic-bezier(.18,.72,.2,1);
}

.route-b {
  animation-delay: 1.04s;
}

.route-c {
  animation-delay: 1.16s;
}

@media (min-width: 769px) {
  .control-panel {
    animation: v31ArtifactShellIn .82s .20s cubic-bezier(.18,.72,.2,1) both;
  }

  .artifact-stage {
    opacity: 0;
    animation: v31ArtifactStageIn 1.08s .46s cubic-bezier(.18,.72,.2,1) both;
  }

  .project-core {
    opacity: 0;
    animation: v31CoreIn .86s .68s cubic-bezier(.18,.72,.2,1) both;
  }

  .mission-workflow .mission-card {
    animation-name: v31MissionCardRise;
    animation-duration: .68s;
    animation-timing-function: cubic-bezier(.18,.72,.2,1);
  }

  .presentation-artifact {
    animation: v31PresentationIn .70s 1.02s cubic-bezier(.18,.72,.2,1) both;
  }
}

@media (min-width: 981px) and (max-height: 820px) {
  .site-header {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px;
    top: 8px;
  }

  .home-hero-v2.production-hero {
    width: min(1180px, calc(100% - 56px));
    min-height: 0;
    height: calc(100vh - 116px);
    max-height: 650px;
    margin-top: 14px;
    padding: 10px;
    gap: 10px;
    grid-template-columns: minmax(0, .92fr) minmax(460px, 1.08fr);
  }

  .production-hero .studio-hero-copy {
    padding: 26px 32px;
    justify-content: center;
  }

  .production-hero .studio-kicker {
    margin-bottom: 18px;
  }

  .production-hero .studio-hero-copy h1 {
    max-width: 520px;
    font-size: clamp(38px, 3.15vw, 43px);
    line-height: 1.055;
  }

  .production-hero .studio-hero-copy p,
  .production-hero.clean-hero .studio-hero-copy p {
    max-width: 500px;
    margin-top: 18px;
    font-size: 16px;
    line-height: 1.50;
  }

  .production-hero .studio-hero-actions {
    margin-top: 22px;
    gap: 12px;
  }

  .production-hero .btn {
    min-height: 50px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .production-hero .academic-proof {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
  }

  .production-hero .academic-proof span {
    min-height: 38px;
    padding: 9px 12px;
    font-size: 13px;
  }

  .production-room {
    min-height: 0;
    padding: 10px;
  }

  .mission-status-rail {
    top: 12px;
    left: 12px;
    right: 12px;
    gap: 6px;
  }

  .mission-status-rail span {
    min-height: 28px;
    padding: 6px 8px;
    font-size: 10px;
  }

  .control-panel {
    height: calc(100% - 38px);
    min-height: 0;
    margin-top: 38px;
    padding: 42px 12px 12px;
    border-radius: 20px;
  }

  .control-top b {
    max-width: 210px;
    font-size: 18px;
  }

  .artifact-stage {
    inset: 24px 4px 10px;
    width: calc(100% - 8px);
    height: calc(100% - 34px);
  }

  .project-core {
    width: 300px;
    min-height: 258px;
    padding: 26px;
  }

  .project-core b {
    max-width: 200px;
    font-size: 30px;
  }

  .project-core p {
    max-width: 188px;
    font-size: 12.5px;
    line-height: 1.42;
  }

  .project-progress {
    right: 22px;
    bottom: 24px;
    width: 68px;
    height: 68px;
  }

  .project-progress strong {
    font-size: 23px;
  }

  .mission-workflow .mission-card {
    width: 136px;
    min-height: 74px;
    padding: 10px;
    grid-template-columns: 32px 1fr;
    column-gap: 8px;
  }

  .mission-workflow .mission-card > span {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    font-size: 10px;
  }

  .mission-workflow .mission-card b {
    font-size: 13px;
  }

  .mission-workflow .mission-card small {
    font-size: 10px;
    line-height: 1.22;
  }

  .card-topic {
    top: 72px;
    left: 28px;
  }

  .card-requirements {
    top: 92px;
    right: 4px;
  }

  .card-plan {
    top: 238px;
    left: -14px;
  }

  .card-text {
    top: 206px;
    right: -18px;
  }

  .card-format {
    bottom: 72px;
    left: 16px;
  }

  .card-slides {
    right: 22px;
    bottom: 132px;
  }

  .card-revision {
    bottom: 16px;
    left: calc(50% - 92px);
    width: 184px;
  }

  .document-fragment {
    top: 120px;
  }

  .revision-check {
    left: 22px;
    bottom: 188px;
  }

  .presentation-artifact {
    right: 6px;
    bottom: 36px;
    width: 210px;
    padding: 13px;
  }

  .presentation-frame {
    height: 86px;
    margin-top: 10px;
  }

  .mission-footer {
    left: 22px;
    right: 22px;
    bottom: 18px;
  }
}

@media (min-width: 981px) and (max-height: 720px) {
  .production-hero .studio-hero-copy h1 {
    font-size: clamp(36px, 2.95vw, 40px);
  }

  .production-hero .studio-hero-copy p,
  .production-hero.clean-hero .studio-hero-copy p {
    margin-top: 14px;
    font-size: 15px;
  }

  .production-hero .studio-hero-actions {
    margin-top: 18px;
  }

  .production-hero .academic-proof {
    margin-top: 14px;
  }
}

@keyframes v31HeroShellIn {
  from {
    opacity: 0;
    filter: blur(8px);
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
  }
}

@keyframes v31PanelIn {
  from {
    opacity: 0;
    filter: blur(6px);
  }
  to {
    opacity: 1;
    filter: blur(0);
  }
}

@keyframes v31TextIn {
  from {
    opacity: 0;
    filter: blur(4px);
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
  }
}

@keyframes v31CtaIn {
  from {
    opacity: 0;
    filter: blur(3px);
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
  }
}

@keyframes v31ProofIn {
  from {
    opacity: 0;
    filter: blur(3px);
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
  }
}

@keyframes v31ArtifactShellIn {
  from {
    opacity: 0;
    filter: blur(7px);
    transform: rotateX(calc(var(--tilt-y) - .8deg)) rotateY(calc(var(--tilt-x) + .8deg)) scale(.985);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: rotateX(var(--tilt-y)) rotateY(var(--tilt-x)) scale(1);
  }
}

@keyframes v31ArtifactStageIn {
  from {
    opacity: 0;
    filter: blur(8px);
  }
  to {
    opacity: .95;
    filter: blur(0);
  }
}

@keyframes v31CoreIn {
  from {
    opacity: 0;
    filter: blur(8px);
    transform: translate(-50%, -50%) translate3d(var(--px), calc(var(--py) + 24px), 60px) rotate(-3.5deg) scale(.965);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translate(-50%, -50%) translate3d(var(--px), var(--py), 92px) rotate(-2deg) scale(1);
  }
}

@keyframes v31MissionCardRise {
  from {
    opacity: 0;
    filter: blur(5px);
    transform: translate3d(var(--card-x), calc(var(--card-y) + 22px), calc(var(--card-z) - 18px)) rotate(var(--card-r)) scale(calc(var(--card-scale) * .90));
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(var(--card-x), var(--card-y), var(--card-z)) rotate(var(--card-r)) scale(var(--card-scale));
  }
}

@keyframes v31PresentationIn {
  from {
    opacity: 0;
    filter: blur(6px);
    transform: translate3d(var(--px-deep), calc(var(--py-soft) + 18px), 20px) rotateY(-10deg) rotateZ(4deg) scale(.96);
  }
  to {
    opacity: .82;
    filter: blur(0);
    transform: translate3d(var(--px-deep), var(--py-soft), 34px) rotateY(-10deg) rotateZ(4deg) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero-v2.production-hero,
  .production-copy,
  .production-room,
  .production-hero .studio-kicker,
  .production-hero .studio-hero-copy h1,
  .production-hero .studio-hero-copy p,
  .production-hero .studio-hero-actions,
  .production-hero .academic-proof span,
  .control-panel,
  .artifact-stage,
  .project-core,
  .mission-workflow .mission-card,
  .presentation-artifact {
    animation: none;
    opacity: 1;
    filter: none;
  }
}

/* P1 launch accessibility polish */
.btn:focus-visible,
.header-btn:focus-visible,
.nav-mobile-cta:focus-visible,
.primary-nav a:focus-visible,
.mobile-menu-toggle:focus-visible,
.hero-micro-cta:focus-visible,
.path-card a:focus-visible,
.revision-panel .btn:focus-visible,
.studio-transition a:focus-visible,
.request-placeholder-card .btn:focus-visible {
  outline: 2px solid rgba(244, 216, 151, .96);
  outline-offset: 4px;
  box-shadow:
    0 0 0 6px rgba(244, 216, 151, .14),
    0 0 34px rgba(216, 181, 109, .22);
}

.btn:focus-visible,
.header-btn:focus-visible,
.nav-mobile-cta:focus-visible,
.primary-nav a:focus-visible,
.hero-micro-cta:focus-visible,
.path-card a:focus-visible,
.studio-transition a:focus-visible {
  text-decoration: none;
}

.mobile-menu-toggle:focus-visible {
  background: rgba(241, 212, 147, .10);
  border-color: rgba(241, 212, 147, .38);
}