body {
  overflow-x: hidden;
  color: var(--sc-color-ink);
  background: var(--sc-color-canvas);
}

main.flex-grow {
  background:
    radial-gradient(circle at 50% 4%, var(--sc-color-brand-50), transparent 30rem),
    linear-gradient(180deg, var(--sc-color-canvas), var(--sc-color-surface));
}

.studio-wrap {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: var(--sc-space-12) var(--sc-space-5) var(--sc-space-16);
}

.studio-heading {
  max-width: 52rem;
  margin: 0 auto var(--sc-space-8);
  text-align: center;
}

.studio-eyebrow,
.section-kicker {
  margin: 0 0 var(--sc-space-3);
  color: var(--sc-color-brand-700);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.studio-heading h1 {
  margin: 0 0 var(--sc-space-4);
  color: var(--sc-color-ink);
  font-size: clamp(2.625rem, 6vw, 4.75rem);
  line-height: 1;
  letter-spacing: -.055em;
}

.studio-heading > p:last-child {
  margin: 0;
  color: var(--sc-color-muted);
  font-size: clamp(1rem, 2vw, 1.1875rem);
  line-height: 1.7;
}

.studio-shell {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
}

.studio-shell .model-workspace {
  width: 100%;
  min-height: 0;
}

.studio-shell .model-workspace__heading,
.studio-shell .model-workspace__form {
  width: 100%;
  max-width: none;
}

.studio-shell .model-workspace__form {
  grid-template-columns: 1fr;
  align-items: start;
}

.studio-shell .model-workspace__references,
.studio-shell .model-workspace__prompt-field,
.studio-shell .model-workspace__model-field,
.studio-shell .model-workspace__toolbar,
.studio-shell [data-workspace-status],
.studio-shell .studio-handoff__direct {
  width: 100%;
}

.studio-shell .model-workspace__model-field {
  max-width: none;
}

.studio-shell .model-workspace__toolbar {
  justify-content: flex-start;
}

.pollo-body {
  color: var(--sc-color-ink);
  background: var(--sc-color-surface);
}

.pollo-section,
.feature-stack {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding: var(--sc-space-16) var(--sc-space-5);
}

.pollo-section.soft {
  width: 100%;
  background: var(--sc-color-surface-muted);
}

.pollo-section.soft > .section-inner {
  width: min(100%, 1180px);
  margin: 0 auto;
}

.section-kicker--center {
  text-align: center;
}

.section-title {
  max-width: 52rem;
  margin: 0 auto var(--sc-space-4);
  color: var(--sc-color-ink);
  font-size: clamp(2rem, 4vw, 3.375rem);
  line-height: 1.08;
  letter-spacing: -.045em;
  text-align: center;
}

.section-lead {
  max-width: 46rem;
  margin: 0 auto;
  color: var(--sc-color-muted);
  font-size: 1.0625rem;
  line-height: 1.7;
  text-align: center;
}

.section-title--left,
.section-lead--left {
  margin-left: 0;
  text-align: left;
}

.model-cloud {
  margin-top: var(--sc-space-8);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sc-space-3);
}

.model-pill {
  min-height: var(--sc-control-height);
  padding: 0 var(--sc-space-4);
  display: inline-flex;
  align-items: center;
  gap: var(--sc-space-2);
  border: 1px solid var(--sc-color-border);
  border-radius: var(--sc-radius-pill);
  color: var(--sc-color-ink);
  background: var(--sc-color-surface);
  box-shadow: var(--sc-shadow-sm);
  font-size: .8125rem;
  font-weight: 750;
  text-decoration: none;
}

.model-pill:hover,
.model-pill:focus-visible {
  border-color: var(--sc-color-brand-300);
  color: var(--sc-color-brand-800);
  background: var(--sc-color-brand-50);
}

.model-pill:focus-visible,
.feature-cta:focus-visible,
.pollo-cta a:focus-visible {
  outline: 3px solid var(--sc-color-brand-200);
  outline-offset: 3px;
}

.model-dot {
  width: .5rem;
  height: .5rem;
  border-radius: var(--sc-radius-pill);
  background: var(--sc-color-brand-500);
}

.feature-stack {
  display: grid;
  gap: var(--sc-space-8);
}

.feature-row {
  min-height: 30rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--sc-color-border);
  border-radius: var(--sc-radius-xl);
  background: var(--sc-color-surface-muted);
}

.feature-row.reverse .feature-copy { order: 2; }
.feature-row.reverse .feature-media { order: 1; }

.feature-copy {
  padding: clamp(var(--sc-space-8), 6vw, var(--sc-space-16));
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.feature-copy h3 {
  margin: 0 0 var(--sc-space-4);
  color: var(--sc-color-ink);
  font-size: clamp(2rem, 4vw, 3.125rem);
  line-height: 1.08;
  letter-spacing: -.04em;
}

.feature-copy p {
  margin: 0 0 var(--sc-space-6);
  color: var(--sc-color-muted);
  line-height: 1.75;
}

.feature-cta,
.pollo-cta a {
  width: fit-content;
  min-height: var(--sc-control-height);
  padding: 0 var(--sc-space-4);
  display: inline-flex;
  align-items: center;
  gap: var(--sc-space-2);
  border-radius: var(--sc-radius-md);
  color: var(--sc-color-surface);
  background: var(--sc-color-brand-700);
  font-size: .8125rem;
  font-weight: 800;
  text-decoration: none;
}

.feature-cta:hover,
.pollo-cta a:hover { background: var(--sc-color-brand-800); }

.feature-media {
  min-height: 22rem;
  position: relative;
  overflow: hidden;
  background: var(--sc-color-brand-50);
}

.feature-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.compare-badges {
  position: absolute;
  inset: var(--sc-space-4) var(--sc-space-4) auto;
  display: flex;
  justify-content: space-between;
  gap: var(--sc-space-3);
}

.compare-badges span {
  padding: var(--sc-space-2) var(--sc-space-3);
  border-radius: var(--sc-radius-pill);
  color: var(--sc-color-surface);
  background: color-mix(in srgb, var(--sc-color-ink) 70%, transparent);
  font-size: .6875rem;
  font-weight: 800;
}

.audience-grid,
.steps-grid,
.trust-grid {
  margin-top: var(--sc-space-8);
  display: grid;
  gap: var(--sc-space-4);
}

.audience-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.steps-grid,
.trust-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.audience-card,
.step-card,
.trust-card {
  padding: var(--sc-space-6);
  border: 1px solid var(--sc-color-border);
  border-radius: var(--sc-radius-lg);
  background: var(--sc-color-surface);
  box-shadow: var(--sc-shadow-sm);
}

.audience-icon,
.step-num {
  width: 2.75rem;
  height: 2.75rem;
  margin-bottom: var(--sc-space-6);
  display: grid;
  place-items: center;
  border-radius: var(--sc-radius-md);
  color: var(--sc-color-brand-800);
  background: var(--sc-color-brand-50);
  font-weight: 800;
}

.step-num {
  border-radius: var(--sc-radius-pill);
  color: var(--sc-color-surface);
  background: var(--sc-color-brand-700);
  font-size: .8125rem;
}

.audience-card h3,
.step-card h3,
.trust-card h3 {
  margin: 0 0 var(--sc-space-3);
  color: var(--sc-color-ink);
  font-size: 1.0625rem;
}

.audience-card p,
.step-card p,
.trust-card p {
  margin: 0;
  color: var(--sc-color-muted);
  font-size: .875rem;
  line-height: 1.65;
}

.faq-list {
  max-width: 54rem;
  margin: var(--sc-space-8) auto 0;
  border-top: 1px solid var(--sc-color-border);
}

.faq-list details {
  padding: 0;
  border-bottom: 1px solid var(--sc-color-border);
}

.faq-list summary {
  min-height: var(--sc-control-height);
  padding: var(--sc-space-3) 0;
  display: flex;
  justify-content: space-between;
  gap: var(--sc-space-4);
  color: var(--sc-color-ink);
  cursor: pointer;
  font-weight: 750;
}

.faq-list summary::after { content: '+'; color: var(--sc-color-brand-700); font-size: 1.25rem; }
.faq-list details[open] summary::after { content: '−'; }
.faq-list p { margin: 0; padding: 0 0 var(--sc-space-4); color: var(--sc-color-muted); line-height: 1.7; }

.pollo-cta {
  width: min(calc(100% - 2 * var(--sc-space-5)), 1120px);
  margin: var(--sc-space-12) auto;
  padding: clamp(var(--sc-space-8), 7vw, var(--sc-space-16));
  border: 1px solid var(--sc-color-brand-200);
  border-radius: var(--sc-radius-xl);
  background: var(--sc-color-brand-50);
  box-shadow: var(--sc-shadow-md);
  text-align: center;
}

.pollo-cta h2 {
  max-width: 45rem;
  margin: 0 auto var(--sc-space-4);
  color: var(--sc-color-ink);
  font-size: clamp(2rem, 4vw, 3.25rem);
  line-height: 1.08;
  letter-spacing: -.045em;
}

.pollo-cta p {
  max-width: 40rem;
  margin: 0 auto;
  color: var(--sc-color-muted);
  line-height: 1.7;
}

.pollo-cta a { margin-top: var(--sc-space-6); }

@media (max-width: 860px) {
  .audience-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .feature-row { grid-template-columns: 1fr; }
  .feature-row.reverse .feature-copy,
  .feature-row.reverse .feature-media { order: initial; }
  .feature-media { min-height: 20rem; }
  .steps-grid,
  .trust-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .studio-wrap { padding: var(--sc-space-10) var(--sc-space-3) var(--sc-space-12); }
  .studio-heading h1 { font-size: 36px; }
  .studio-shell .model-workspace__form { grid-template-columns: 1fr; }
  .pollo-section,
  .feature-stack { padding: var(--sc-space-12) var(--sc-space-4); }
  .audience-grid { grid-template-columns: 1fr; }
  .feature-copy { padding: var(--sc-space-6); }
  .feature-media { min-height: 18rem; }
  .pollo-cta { width: calc(100% - 2 * var(--sc-space-3)); margin: var(--sc-space-10) auto; }
}

@media (prefers-reduced-motion: reduce) {
  .feature-cta,
  .pollo-cta a,
  .model-pill { transition: none; }
}
