/*
 * CyberSpace Groups 4.2.0 — universal landing appearance system.
 * Six layout systems x twelve accessible semantic palettes.
 */

/* Studio appearance picker ------------------------------------------------ */
body.csg-lb-studio-active .csg-lb-appearance,
body.csg-lb-studio-active .csg-lb-question-guide {
  margin: 0 0 18px !important;
  border: 1px solid #e7dfeb !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 10px 28px rgba(57, 32, 68, .06) !important;
  color: #2f2634 !important;
}

body.csg-lb-studio-active .csg-lb-appearance {
  padding: 16px !important;
}

body.csg-lb-studio-active .csg-lb-appearance > header {
  display: flex !important;
  align-items: center !important;
  gap: 11px !important;
  margin: 0 0 16px !important;
}

body.csg-lb-studio-active .csg-lb-appearance > header > span {
  display: grid !important;
  width: 38px !important;
  height: 38px !important;
  flex: 0 0 38px !important;
  place-items: center !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #f3e8ff, #e0f2fe) !important;
  color: #681292 !important;
  font-size: 18px !important;
}

body.csg-lb-studio-active .csg-lb-appearance > header div {
  display: grid !important;
  gap: 2px !important;
}

body.csg-lb-studio-active .csg-lb-appearance > header strong {
  font-size: 15px !important;
  line-height: 1.3 !important;
}

body.csg-lb-studio-active .csg-lb-appearance > header small,
body.csg-lb-studio-active .csg-lb-appearance__note {
  color: #736979 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

body.csg-lb-studio-active .csg-lb-appearance fieldset {
  min-width: 0 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
}

body.csg-lb-studio-active .csg-lb-appearance legend {
  width: 100% !important;
  margin: 0 0 9px !important;
  padding: 0 !important;
  color: #493a50 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

body.csg-lb-studio-active .csg-lb-layout-choices {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice {
  position: relative !important;
  display: grid !important;
  min-width: 0 !important;
  min-height: 92px !important;
  grid-template-columns: 54px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px !important;
  border: 1px solid #e5dce9 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: #392e3e !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice:hover {
  border-color: #bda5ca !important;
  background: #fdfbfe !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice.is-active {
  border-color: #681292 !important;
  background: #faf5ff !important;
  box-shadow: 0 0 0 2px rgba(104, 18, 146, .12) !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice > span:nth-child(2) {
  display: grid !important;
  min-width: 0 !important;
  gap: 3px !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice strong {
  font-size: 12px !important;
  line-height: 1.2 !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice small {
  color: #766b7c !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice > b {
  position: absolute !important;
  top: 6px !important;
  right: 7px !important;
  display: none !important;
  color: #681292 !important;
  font-size: 12px !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice.is-active > b {
  display: block !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview {
  display: grid !important;
  width: 54px !important;
  height: 52px !important;
  grid-template-columns: repeat(2, 1fr) !important;
  grid-template-rows: repeat(2, 1fr) !important;
  gap: 3px !important;
  padding: 6px !important;
  border-radius: 10px !important;
  background: #f1ecf4 !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview i {
  display: block !important;
  border-radius: 3px !important;
  background: #9d77ad !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview--classic i:first-child,
body.csg-lb-studio-active .csg-lb-layout-choice__preview--editorial i:first-child {
  grid-column: 1 / -1 !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview--bento i:first-child {
  grid-row: 1 / -1 !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview--split {
  grid-template-rows: 1fr !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview--split i:nth-child(3) {
  display: none !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview--floating i {
  border-radius: 7px !important;
  box-shadow: 0 3px 6px rgba(70, 45, 82, .22) !important;
  transform: translateY(-2px) !important;
}

body.csg-lb-studio-active .csg-lb-layout-choice__preview--outline i {
  border: 2px solid #795389 !important;
  background: transparent !important;
}

body.csg-lb-studio-active .csg-lb-palette-choices {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.csg-lb-studio-active .csg-lb-palette-choice {
  display: grid !important;
  min-width: 0 !important;
  min-height: 65px !important;
  justify-items: center !important;
  align-content: center !important;
  gap: 5px !important;
  padding: 7px 4px !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: #5f5365 !important;
  cursor: pointer !important;
}

body.csg-lb-studio-active .csg-lb-palette-choice:hover,
body.csg-lb-studio-active .csg-lb-palette-choice.is-active {
  border-color: #d6c8dc !important;
  background: #faf7fb !important;
}

body.csg-lb-studio-active .csg-lb-palette-choice.is-active {
  box-shadow: 0 0 0 2px rgba(104, 18, 146, .12) !important;
}

body.csg-lb-studio-active .csg-lb-palette-choice > span {
  display: block !important;
  width: 30px !important;
  height: 30px !important;
  border: 3px solid #fff !important;
  border-radius: 50% !important;
  background: var(--csg-swatch) !important;
  box-shadow: 0 0 0 1px rgba(38, 28, 43, .18), 0 4px 9px rgba(38, 28, 43, .13) !important;
}

body.csg-lb-studio-active .csg-lb-palette-choice small {
  display: -webkit-box !important;
  min-height: 24px !important;
  overflow: hidden !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
  text-align: center !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.csg-lb-studio-active .csg-lb-appearance__note {
  margin: -2px 0 0 !important;
  padding: 9px 11px !important;
  border-radius: 10px !important;
  background: #f7f4f8 !important;
}

body.csg-lb-studio-active .csg-lb-question-guide {
  overflow: hidden !important;
}

body.csg-lb-studio-active .csg-lb-question-guide summary {
  display: grid !important;
  min-height: 58px !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 1px 10px !important;
  padding: 12px 14px !important;
  list-style: none !important;
  cursor: pointer !important;
}

body.csg-lb-studio-active .csg-lb-question-guide summary::-webkit-details-marker {
  display: none !important;
}

body.csg-lb-studio-active .csg-lb-question-guide summary > span {
  display: grid !important;
  width: 32px !important;
  height: 32px !important;
  grid-row: 1 / span 2 !important;
  place-items: center !important;
  border-radius: 10px !important;
  background: #eaf7f5 !important;
  color: #0f766e !important;
  font-weight: 900 !important;
}

body.csg-lb-studio-active .csg-lb-question-guide summary strong {
  font-size: 13px !important;
}

body.csg-lb-studio-active .csg-lb-question-guide summary small {
  color: #786d7d !important;
  font-size: 10px !important;
}

body.csg-lb-studio-active .csg-lb-question-guide ol {
  display: grid !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 0 14px 14px !important;
  list-style: none !important;
}

body.csg-lb-studio-active .csg-lb-question-guide li {
  display: grid !important;
  grid-template-columns: 25px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 9px !important;
}

body.csg-lb-studio-active .csg-lb-question-guide li > span {
  display: grid !important;
  width: 25px !important;
  height: 25px !important;
  place-items: center !important;
  border-radius: 8px !important;
  background: #f1ebf4 !important;
  color: #681292 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

body.csg-lb-studio-active .csg-lb-question-guide li p {
  margin: 2px 0 0 !important;
  color: #514656 !important;
  font-size: 12px !important;
  line-height: 1.48 !important;
}

body.csg-lb-studio-active :is(.csg-lb-layout-choice, .csg-lb-palette-choice, .csg-lb-question-guide summary):focus-visible {
  outline: 3px solid #1d4ed8 !important;
  outline-offset: 2px !important;
}

/* Semantic palette tokens ---------------------------------------------- */
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="cyberspace"] {
  --csg-theme-accent: #6d28d9; --csg-theme-accent-2: #0f766e; --csg-theme-soft: #f5f0fa;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #fbf9fc; --csg-theme-ink: #2a1f30;
  --csg-theme-muted: #6f6475; --csg-theme-line: #e6dce9; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(109,40,217,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="teal"] {
  --csg-theme-accent: #0f766e; --csg-theme-accent-2: #155e75; --csg-theme-soft: #eaf7f5;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #f6fbfa; --csg-theme-ink: #123b39;
  --csg-theme-muted: #526f6c; --csg-theme-line: #cfe7e3; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(15,118,110,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="trust"] {
  --csg-theme-accent: #1d4ed8; --csg-theme-accent-2: #0369a1; --csg-theme-soft: #eef4ff;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #f8faff; --csg-theme-ink: #172554;
  --csg-theme-muted: #586584; --csg-theme-line: #d6e2fb; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(29,78,216,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="cobalt"] {
  --csg-theme-accent: #3730a3; --csg-theme-accent-2: #6d28d9; --csg-theme-soft: #f0f0ff;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #f9f9ff; --csg-theme-ink: #25205b;
  --csg-theme-muted: #625f80; --csg-theme-line: #dddafa; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(55,48,163,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="mint"] {
  --csg-theme-accent: #047857; --csg-theme-accent-2: #0f766e; --csg-theme-soft: #eaf8f1;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #f7fcf9; --csg-theme-ink: #143d31;
  --csg-theme-muted: #557167; --csg-theme-line: #cfe9dd; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(4,120,87,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="emerald"] {
  --csg-theme-accent: #166534; --csg-theme-accent-2: #3f6212; --csg-theme-soft: #edf7ed;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #f8fcf7; --csg-theme-ink: #193a25;
  --csg-theme-muted: #587061; --csg-theme-line: #d4e7d5; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(22,101,52,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="coral"] {
  --csg-theme-accent: #c2410c; --csg-theme-accent-2: #be123c; --csg-theme-soft: #fff2ec;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #fffaf8; --csg-theme-ink: #4b251a;
  --csg-theme-muted: #7b6259; --csg-theme-line: #f2d8cc; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(194,65,12,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="amber"] {
  --csg-theme-accent: #a16207; --csg-theme-accent-2: #92400e; --csg-theme-soft: #fff7df;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #fffcf6; --csg-theme-ink: #493310;
  --csg-theme-muted: #77684b; --csg-theme-line: #eadcb9; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(161,98,7,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="rose"] {
  --csg-theme-accent: #be123c; --csg-theme-accent-2: #9f1239; --csg-theme-soft: #fff0f3;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #fff9fa; --csg-theme-ink: #4c1d2a;
  --csg-theme-muted: #7d5b65; --csg-theme-line: #f1d3dc; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(190,18,60,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="plum"] {
  --csg-theme-accent: #7e22ce; --csg-theme-accent-2: #a21caf; --csg-theme-soft: #f8effd;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #fcf9fe; --csg-theme-ink: #3d1f50;
  --csg-theme-muted: #715f7b; --csg-theme-line: #e8d8f0; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(126,34,206,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="copper"] {
  --csg-theme-accent: #9a3412; --csg-theme-accent-2: #7c2d12; --csg-theme-soft: #f9f0eb;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #fcf9f7; --csg-theme-ink: #43271d;
  --csg-theme-muted: #745f57; --csg-theme-line: #ead9d1; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(154,52,18,.18);
}
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-palette="graphite"] {
  --csg-theme-accent: #334155; --csg-theme-accent-2: #475569; --csg-theme-soft: #f0f3f6;
  --csg-theme-surface: #ffffff; --csg-theme-surface-2: #f8fafc; --csg-theme-ink: #182230;
  --csg-theme-muted: #5e6877; --csg-theme-line: #dce2e8; --csg-theme-on: #ffffff; --csg-theme-glow: rgba(51,65,85,.18);
}

/* Palette application: Studio and public rendering --------------------- */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] > :is(section, .csg-lb-public-posts),
.csg-lp-section[data-csg-palette] {
  background: var(--csg-theme-surface-2) !important;
  color: var(--csg-theme-ink) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-intro, .csg-lb-lead, .csg-lb-final-cta
),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-intro__card, .csg-lp-leadmagnet__card, .csg-lp-final-cta__card
) {
  background: linear-gradient(135deg, var(--csg-theme-accent), var(--csg-theme-accent-2)) !important;
  color: var(--csg-theme-on) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-intro, .csg-lb-lead, .csg-lb-final-cta
) :is(h1, h2, h3, p),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-intro__card, .csg-lp-leadmagnet__card, .csg-lp-final-cta__card
) :is(h1, h2, h3, p) {
  color: var(--csg-theme-on) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-intro__title, .csg-lb-qual__card-title, .csg-lb-problem__title, .csg-lb-benefits__title,
  .csg-lb-preview-section__title, .csg-lb-usecases__title, .csg-lb-pricing__title,
  .csg-lb-lead__title, .csg-lb-faq-section__title, .csg-lb-final-cta__title,
  .csg-lb-public-posts__head h2
),
.csg-lp-section[data-csg-palette] :is(h1, h2, h3, h4) {
  color: var(--csg-theme-ink) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-intro__desc, .csg-lb-problem__desc, .csg-lb-benefits__desc, .csg-lb-usecases__desc,
  .csg-lb-pricing__desc, .csg-lb-lead__desc, .csg-lb-final-cta__desc, .csg-lb-public-posts__head p
),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-intro__desc, .csg-lp-problem__desc, .csg-lp-benefits__desc, .csg-lp-usecases__desc,
  .csg-lp-pricing__desc, .csg-lp-leadmagnet__desc, .csg-lp-final-cta__desc, .csg-lp-featured__head p
) {
  color: var(--csg-theme-muted) !important;
}

/* Gradient content keeps its on-accent text; Editorial intentionally
 * overrides this later when it turns these cards into a plain surface. */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-intro, .csg-lb-lead, .csg-lb-final-cta
) :is(h1, h2, h3, p),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-intro__card, .csg-lp-leadmagnet__card, .csg-lp-final-cta__card
) :is(h1, h2, h3, p) {
  color: var(--csg-theme-on) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-problem__card, .csg-lb-benefits__card, .csg-lb-preview-section__col,
  .csg-lb-usecases__card, .csg-lb-pricing__plan, .csg-lb-faq-item, .csg-lb-qual__card,
  .csg-lb-public-posts__selected-item, .csg-lb-public-posts__choice
),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-problem__card, .csg-lp-benefit-card, .csg-lp-preview__col, .csg-lp-usecase-card,
  .csg-lp-plan-card, .csg-lp-faq-item, .csg-lp-crosslinks, .csg-lp-post-card,
  .csg-lp-qual-card, .csg-lpf-post
) {
  border-color: var(--csg-theme-line) !important;
  background: var(--csg-theme-surface) !important;
  color: var(--csg-theme-ink) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-btn-cta--primary, .csg-lb-preview-section__video-btn, .csg-lb-pricing__plan-btn,
  .csg-lb-lead__btn, .csg-lb-final-cta__btn
),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-btn--primary, .csg-lp-preview__video-btn, .csg-lp-plan-card__btn,
  .csg-lp-leadmagnet__submit, .csg-lp-final-cta__btn
) {
  border-color: var(--csg-theme-accent) !important;
  background: var(--csg-theme-accent) !important;
  color: var(--csg-theme-on) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-problem__card-icon, .csg-lb-benefits__card-type, .csg-lb-usecases__step-num,
  .csg-lb-public-posts__number
),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-problem__card-icon, .csg-lp-usecase-card__step-num, .csg-lp-featured__eyebrow
) {
  color: var(--csg-theme-accent) !important;
}

.csg-lp-featured[data-csg-palette] .csg-lpf-post {
  border-color: var(--csg-theme-line) !important;
  background: var(--csg-theme-surface) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(
  .csg-lb-intro__badge, .csg-lb-preview-section__chip--active, .csg-lb-usecases__card-phase,
  .csg-lb-pricing__info-badge, .csg-lb-lead__badge
),
.csg-lp-section[data-csg-palette] :is(
  .csg-lp-badge, .csg-lp-preview__chip--active, .csg-lp-usecase-card__phase,
  .csg-lp-pricing__info-badge, .csg-lp-leadmagnet__badge-tag, .csg-lp-featured__eyebrow
) {
  border-color: var(--csg-theme-line) !important;
  background: var(--csg-theme-soft) !important;
  color: var(--csg-theme-accent) !important;
}

body.csg-lb-studio-active .csg-lb-section-shell[data-csg-palette] :is(a, button):focus-visible,
.csg-lp-section[data-csg-palette] :is(a, button, input):focus-visible {
  outline: 3px solid var(--csg-theme-accent) !important;
  outline-offset: 3px !important;
}

/* Six layout systems ---------------------------------------------------- */

/* 1. Classic intentionally keeps the proven baseline geometry. */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="classic"] > :is(section, .csg-lb-public-posts),
.csg-lp-section[data-csg-layout="classic"] {
  --csg-section-radius: 18px;
}

/* 2. Bento: asymmetric, modular blocks. */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="bento"] > :is(section, .csg-lb-public-posts),
.csg-lp-section[data-csg-layout="bento"] {
  padding: clamp(28px, 4vw, 58px) !important;
  border: 1px solid var(--csg-theme-line) !important;
  border-radius: 28px !important;
  background: var(--csg-theme-soft) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="bento"] :is(
  .csg-lb-problem__grid, .csg-lb-benefits__grid, .csg-lb-preview-section__grid3,
  .csg-lb-pricing__plans, .csg-lp-problem__grid, .csg-lp-benefits__grid,
  .csg-lp-preview__grid3, .csg-lp-pricing__grid
) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="bento"] :is(
  .csg-lb-qual__grid, .csg-lp-qualification__grid, .csg-lp-featured__list
) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="bento"] :is(
  .csg-lb-problem__grid, .csg-lb-benefits__grid, .csg-lp-problem__grid, .csg-lp-benefits__grid
) > :first-child {
  grid-column: 1 / -1 !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="bento"] :is(
  .csg-lb-problem__card, .csg-lb-benefits__card, .csg-lb-preview-section__col,
  .csg-lb-usecases__card, .csg-lb-pricing__plan, .csg-lb-faq-item,
  .csg-lb-qual__card,
  .csg-lp-problem__card, .csg-lp-benefit-card, .csg-lp-preview__col,
  .csg-lp-usecase-card, .csg-lp-plan-card, .csg-lp-faq-item, .csg-lp-post-card,
  .csg-lp-qual-card, .csg-lpf-post
) {
  border-radius: 20px !important;
  box-shadow: none !important;
}

/* 3. Editorial: typographic hierarchy, left rule, calm surfaces. */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="editorial"] > :is(section, .csg-lb-public-posts),
.csg-lp-section[data-csg-layout="editorial"] {
  padding: clamp(34px, 5vw, 72px) clamp(22px, 6vw, 84px) !important;
  border-left: 5px solid var(--csg-theme-accent) !important;
  border-radius: 0 20px 20px 0 !important;
  background: var(--csg-theme-surface-2) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="editorial"] :is(
  .csg-lb-intro__title, .csg-lb-problem__title, .csg-lb-benefits__title,
  .csg-lb-preview-section__title, .csg-lb-usecases__title, .csg-lb-pricing__title,
  .csg-lb-faq-section__title, .csg-lb-final-cta__title, .csg-lb-public-posts__head h2,
  .csg-lp-intro__title, .csg-lp-problem__title, .csg-lp-benefits__title,
  .csg-lp-preview__title, .csg-lp-usecases__title, .csg-lp-pricing__title,
  .csg-lp-faq-section__title, .csg-lp-final-cta__title, .csg-lp-featured__head h2
) {
  max-width: 920px !important;
  margin-inline: 0 !important;
  font-family: ui-serif, Georgia, Cambria, "Times New Roman", serif !important;
  font-weight: 650 !important;
  letter-spacing: -.035em !important;
  text-align: left !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="editorial"] :is(
  .csg-lb-intro, .csg-lb-lead, .csg-lb-final-cta,
  .csg-lp-intro__card, .csg-lp-leadmagnet__card, .csg-lp-final-cta__card
) {
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--csg-theme-ink) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="editorial"] :is(
  .csg-lb-intro, .csg-lb-lead, .csg-lb-final-cta,
  .csg-lp-intro__card, .csg-lp-leadmagnet__card, .csg-lp-final-cta__card
) :is(h1, h2, h3, p) {
  color: var(--csg-theme-ink) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="editorial"] :is(
  .csg-lb-problem__desc, .csg-lb-benefits__desc, .csg-lb-usecases__desc,
  .csg-lb-pricing__desc, .csg-lp-problem__desc, .csg-lp-benefits__desc,
  .csg-lp-usecases__desc, .csg-lp-pricing__desc
) {
  max-width: 760px !important;
  margin-inline: 0 !important;
  text-align: left !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="editorial"] :is(
  .csg-lb-problem__card, .csg-lb-benefits__card, .csg-lb-usecases__card,
  .csg-lb-pricing__plan, .csg-lp-problem__card, .csg-lp-benefit-card,
  .csg-lp-usecase-card, .csg-lp-plan-card
) {
  border-width: 0 0 1px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* 4. Split: content organized into two strong zones. */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="split"] > :is(section, .csg-lb-public-posts),
.csg-lp-section[data-csg-layout="split"] {
  padding: clamp(30px, 4.5vw, 62px) !important;
  border-radius: 24px !important;
  background: linear-gradient(90deg, var(--csg-theme-soft) 0 38%, var(--csg-theme-surface) 38% 100%) !important;
  box-shadow: inset 0 0 0 1px var(--csg-theme-line) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="split"] :is(
  .csg-lb-qual__grid, .csg-lb-preview-section__grid3, .csg-lb-faq-section__grid,
  .csg-lp-qualification__grid, .csg-lp-preview__grid3, .csg-lp-faq-section__grid
) {
  display: grid !important;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) !important;
  gap: clamp(18px, 3vw, 42px) !important;
  align-items: stretch !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="split"] :is(
  .csg-lb-preview-section__col:last-child, .csg-lp-preview__col:last-child
) {
  grid-column: 2 !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="split"] :is(
  .csg-lb-problem__grid, .csg-lb-benefits__grid, .csg-lb-pricing__plans,
  .csg-lp-problem__grid, .csg-lp-benefits__grid, .csg-lp-pricing__grid
) {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* 5. Floating: light, open, layered without overlapping copy. */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="floating"] > :is(section, .csg-lb-public-posts),
.csg-lp-section[data-csg-layout="floating"] {
  position: relative !important;
  padding: clamp(34px, 5vw, 72px) !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.75) !important;
  border-radius: 30px !important;
  background:
    radial-gradient(circle at 8% 14%, var(--csg-theme-glow), transparent 30%),
    radial-gradient(circle at 92% 80%, var(--csg-theme-glow), transparent 28%),
    var(--csg-theme-surface-2) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="floating"] :is(
  .csg-lb-problem__card, .csg-lb-benefits__card, .csg-lb-preview-section__col,
  .csg-lb-usecases__card, .csg-lb-pricing__plan, .csg-lb-faq-item, .csg-lb-qual__card,
  .csg-lp-problem__card, .csg-lp-benefit-card, .csg-lp-preview__col,
  .csg-lp-usecase-card, .csg-lp-plan-card, .csg-lp-faq-item, .csg-lp-post-card,
  .csg-lp-qual-card, .csg-lpf-post
) {
  border-color: rgba(255,255,255,.85) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: 0 18px 42px var(--csg-theme-glow) !important;
  backdrop-filter: blur(10px) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="floating"] :is(
  .csg-lb-problem__grid, .csg-lb-benefits__grid, .csg-lb-pricing__plans,
  .csg-lp-problem__grid, .csg-lp-benefits__grid, .csg-lp-pricing__grid
) > :nth-child(even) {
  transform: translateY(10px) !important;
}

/* 6. Outline: expressive, high-contrast geometry. */
body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="outline"] > :is(section, .csg-lb-public-posts),
.csg-lp-section[data-csg-layout="outline"] {
  padding: clamp(28px, 4vw, 58px) !important;
  border: 3px solid var(--csg-theme-ink) !important;
  border-radius: 18px !important;
  background: var(--csg-theme-surface) !important;
  box-shadow: 8px 8px 0 var(--csg-theme-accent) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="outline"] :is(
  .csg-lb-problem__card, .csg-lb-benefits__card, .csg-lb-preview-section__col,
  .csg-lb-usecases__card, .csg-lb-pricing__plan, .csg-lb-faq-item, .csg-lb-qual__card,
  .csg-lp-problem__card, .csg-lp-benefit-card, .csg-lp-preview__col,
  .csg-lp-usecase-card, .csg-lp-plan-card, .csg-lp-faq-item, .csg-lp-post-card,
  .csg-lp-qual-card, .csg-lpf-post
) {
  border: 2px solid var(--csg-theme-ink) !important;
  border-radius: 12px !important;
  box-shadow: 4px 4px 0 var(--csg-theme-line) !important;
}

:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout="outline"] :is(
  .csg-lb-btn-cta, .csg-lb-preview-section__video-btn, .csg-lb-pricing__plan-btn,
  .csg-lb-lead__btn, .csg-lb-final-cta__btn, .csg-lp-btn, .csg-lp-preview__video-btn,
  .csg-lp-plan-card__btn, .csg-lp-leadmagnet__submit, .csg-lp-final-cta__btn
) {
  min-height: 48px !important;
  border: 2px solid var(--csg-theme-ink) !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 var(--csg-theme-ink) !important;
  font-weight: 850 !important;
}

/* Universal safety for all variants ------------------------------------ */
:is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout] :is(h1, h2, h3, h4, p, li, a, button, span) {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

.csg-lp-section[data-csg-layout] :is(a, button, input) {
  min-height: 44px !important;
}

@container csgLandingMain (max-width: 760px) {
  body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout] > :is(section, .csg-lb-public-posts) {
    padding: 28px 18px !important;
    border-radius: 20px !important;
  }

  body.csg-lb-studio-active :is(.csg-lb-section-shell)[data-csg-layout] :is(
    .csg-lb-problem__grid, .csg-lb-benefits__grid, .csg-lb-preview-section__grid3,
    .csg-lb-pricing__plans, .csg-lb-qual__grid, .csg-lb-faq-section__grid
  ) {
    grid-template-columns: 1fr !important;
  }

  body.csg-lb-studio-active :is(.csg-lb-section-shell)[data-csg-layout] :is(
    .csg-lb-problem__grid, .csg-lb-benefits__grid
  ) > :first-child,
  body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="split"] .csg-lb-preview-section__col:last-child {
    grid-column: auto !important;
  }

  body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="split"] > :is(section, .csg-lb-public-posts) {
    background: linear-gradient(180deg, var(--csg-theme-soft) 0 26%, var(--csg-theme-surface) 26% 100%) !important;
  }

  body.csg-lb-studio-active .csg-lb-section-shell[data-csg-layout="floating"] :is(
    .csg-lb-problem__grid, .csg-lb-benefits__grid, .csg-lb-pricing__plans
  ) > :nth-child(even) {
    transform: none !important;
  }
}

@media (max-width: 780px) {
  .csg-lp-section[data-csg-layout] {
    padding: 28px 18px !important;
    border-radius: 20px !important;
  }

  .csg-lp-section[data-csg-layout] :is(
    .csg-lp-problem__grid, .csg-lp-benefits__grid, .csg-lp-preview__grid3,
    .csg-lp-pricing__grid, .csg-lp-qualification__grid, .csg-lp-faq-section__grid,
    .csg-lp-featured__list
  ) {
    grid-template-columns: 1fr !important;
  }

  .csg-lp-section[data-csg-layout] :is(.csg-lp-problem__grid, .csg-lp-benefits__grid) > :first-child,
  .csg-lp-section[data-csg-layout="split"] .csg-lp-preview__col:last-child {
    grid-column: auto !important;
  }

  .csg-lp-section[data-csg-layout="split"] {
    background: linear-gradient(180deg, var(--csg-theme-soft) 0 26%, var(--csg-theme-surface) 26% 100%) !important;
  }

  .csg-lp-section[data-csg-layout="floating"] :is(
    .csg-lp-problem__grid, .csg-lp-benefits__grid, .csg-lp-pricing__grid
  ) > :nth-child(even) {
    transform: none !important;
  }
}

@media (max-width: 520px) {
  body.csg-lb-studio-active .csg-lb-layout-choices {
    grid-template-columns: 1fr !important;
  }

  body.csg-lb-studio-active .csg-lb-palette-choices {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(.csg-lb-section-shell, .csg-lp-section)[data-csg-layout] *,
  body.csg-lb-studio-active .csg-lb-appearance * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}