/* Design System - High Intensity Visual Layer */
.ds {
  --ds-accent: #0f766e;
  --ds-accent-strong: #0b5e57;
  --ds-text: #1f2937;
  --ds-muted: #4b5563;
  --ds-surface: #ffffff;
  --ds-surface-alt: #f6faf9;
  --ds-border: #dbe5e3;
  --ds-card-shadow: 0 10px 28px rgba(15, 118, 110, 0.08);
  --ds-btn-height: 46px;
  --ds-btn-radius: 12px;
  --ds-btn-weight: 700;
  --ds-content-width: 1040px;
  --ds-section-gap: 5.6em;
  --ds-page-gradient: linear-gradient(180deg, #f2fbf9 0%, #ffffff 22%, #f7fbfb 100%);
  --ds-hero-gradient: radial-gradient(1300px 420px at 50% -6%, rgba(15, 118, 110, 0.22), rgba(255, 255, 255, 0));
  --ds-section-tint: rgba(15, 118, 110, 0.04);
  --ds-primary-gradient: linear-gradient(120deg, #0f766e, #0b5e57);
  --ds-secondary-fill: rgba(15, 118, 110, 0.12);
  --ds-ghost-border: rgba(15, 118, 110, 0.42);
  --ds-focus-ring: 0 0 0 3px rgba(15, 118, 110, 0.22);
  --ds-heading-font: Raleway, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-body-font: Lato, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-card-lift: translateY(-4px);
  --ds-card-round: 16px;
  --ds-section-overlay-opacity: 0.18;
  --ds-reading-width: 72ch;
}

.ds::before,
.ds::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

.ds::before {
  background: var(--ds-page-gradient);
}

.ds::after {
  opacity: 0.33;
  background-image: radial-gradient(circle at 1px 1px, rgba(0, 0, 0, 0.06) 1px, transparent 0);
  background-size: 22px 22px;
}

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

.ds.ds-theme-universal,
.ds.ds-theme-classic {
  --ds-accent: #0f766e;
  --ds-accent-strong: #0b5e57;
  --ds-text: #1f2937;
  --ds-muted: #4b5563;
  --ds-surface: #ffffff;
  --ds-surface-alt: #f6faf9;
  --ds-border: #dbe5e3;
  --ds-card-shadow: 0 12px 30px rgba(15, 118, 110, 0.1);
  --ds-btn-height: 46px;
  --ds-btn-radius: 12px;
  --ds-btn-weight: 700;
  --ds-page-gradient: linear-gradient(180deg, #f2fbf9 0%, #ffffff 22%, #f7fbfb 100%);
  --ds-hero-gradient: radial-gradient(1300px 420px at 50% -6%, rgba(15, 118, 110, 0.22), rgba(255, 255, 255, 0));
  --ds-section-tint: rgba(15, 118, 110, 0.04);
  --ds-primary-gradient: linear-gradient(120deg, #0f766e, #0b5e57);
  --ds-secondary-fill: rgba(15, 118, 110, 0.12);
  --ds-ghost-border: rgba(15, 118, 110, 0.42);
  --ds-focus-ring: 0 0 0 3px rgba(15, 118, 110, 0.22);
  --ds-heading-font: Raleway, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-body-font: Lato, Helvetica, Tahoma, Geneva, Arial, sans-serif;
}

.ds.ds-theme-consulting {
  --ds-accent: #1d4ed8;
  --ds-accent-strong: #1e40af;
  --ds-text: #0f172a;
  --ds-muted: #475569;
  --ds-surface: #ffffff;
  --ds-surface-alt: #f8fbff;
  --ds-border: #dbe7f7;
  --ds-card-shadow: 0 14px 36px rgba(30, 64, 175, 0.11);
  --ds-btn-height: 46px;
  --ds-btn-radius: 10px;
  --ds-btn-weight: 700;
  --ds-page-gradient: linear-gradient(180deg, #f5f9ff 0%, #ffffff 26%, #f8fbff 100%);
  --ds-hero-gradient: radial-gradient(1300px 430px at 50% -6%, rgba(29, 78, 216, 0.18), rgba(255, 255, 255, 0));
  --ds-section-tint: rgba(29, 78, 216, 0.045);
  --ds-primary-gradient: linear-gradient(120deg, #1d4ed8, #1e40af);
  --ds-secondary-fill: rgba(29, 78, 216, 0.11);
  --ds-ghost-border: rgba(29, 78, 216, 0.48);
  --ds-focus-ring: 0 0 0 3px rgba(29, 78, 216, 0.24);
  --ds-heading-font: Lato, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-body-font: Raleway, Helvetica, Tahoma, Geneva, Arial, sans-serif;
}

.ds.ds-theme-product {
  --ds-accent: #2563eb;
  --ds-accent-strong: #1d4ed8;
  --ds-text: #111827;
  --ds-muted: #6b7280;
  --ds-surface: #ffffff;
  --ds-surface-alt: #f8fbff;
  --ds-border: #e5e7eb;
  --ds-card-shadow: 0 16px 38px rgba(17, 24, 39, 0.12);
  --ds-btn-height: 48px;
  --ds-btn-radius: 999px;
  --ds-btn-weight: 800;
  --ds-page-gradient: linear-gradient(180deg, #f4f8ff 0%, #ffffff 24%, #f8fbff 100%);
  --ds-hero-gradient: radial-gradient(1280px 440px at 50% -4%, rgba(37, 99, 235, 0.26), rgba(255, 255, 255, 0));
  --ds-section-tint: rgba(37, 99, 235, 0.05);
  --ds-primary-gradient: linear-gradient(120deg, #2563eb, #1d4ed8);
  --ds-secondary-fill: rgba(37, 99, 235, 0.12);
  --ds-ghost-border: rgba(37, 99, 235, 0.46);
  --ds-focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.25);
  --ds-heading-font: Raleway, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-body-font: Lato, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-card-round: 18px;
  --ds-card-lift: translateY(-5px);
}

.ds.ds-theme-creative,
.ds.ds-theme-lp {
  --ds-accent: #d9480f;
  --ds-accent-strong: #c2410c;
  --ds-text: #1f1720;
  --ds-muted: #5b4753;
  --ds-surface: #ffffff;
  --ds-surface-alt: #fff7f2;
  --ds-border: #f3d7c8;
  --ds-card-shadow: 0 18px 42px rgba(217, 72, 15, 0.16);
  --ds-btn-height: 50px;
  --ds-btn-radius: 999px;
  --ds-btn-weight: 800;
  --ds-page-gradient: linear-gradient(180deg, #fff1e8 0%, #fffdfb 28%, #fff7f2 100%);
  --ds-hero-gradient: radial-gradient(1180px 460px at 50% -8%, rgba(217, 72, 15, 0.28), rgba(255, 255, 255, 0));
  --ds-section-tint: rgba(217, 72, 15, 0.06);
  --ds-primary-gradient: linear-gradient(120deg, #d9480f, #c2410c);
  --ds-secondary-fill: rgba(217, 72, 15, 0.13);
  --ds-ghost-border: rgba(217, 72, 15, 0.5);
  --ds-focus-ring: 0 0 0 3px rgba(217, 72, 15, 0.25);
  --ds-heading-font: Lato, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-body-font: Raleway, Helvetica, Tahoma, Geneva, Arial, sans-serif;
  --ds-card-round: 20px;
  --ds-card-lift: translateY(-5px);
  --ds-section-overlay-opacity: 0.22;
}

.ds.ds-medium-showcase {
  --ds-content-width: 1040px;
  --ds-section-gap: 5.6em;
}

.ds.ds-medium-landing {
  --ds-content-width: 980px;
  --ds-section-gap: 6.2em;
  --ds-section-overlay-opacity: 0.28;
}

.ds.ds-bg-balanced::after {
  opacity: 0.22;
}

.ds.ds-bg-rich::after {
  opacity: 0.37;
}

.ds.ds-font-universal,
.ds.ds-font-product {
  font-family: var(--ds-body-font);
}

.ds.ds-font-consulting,
.ds.ds-font-creative {
  font-family: var(--ds-body-font);
}

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

.ds h1,
.ds h2,
.ds h3,
.ds h4,
.ds .hero-title,
.ds .kg-title {
  font-family: var(--ds-heading-font);
  letter-spacing: -0.012em;
  line-height: 1.22;
}

.ds p,
.ds li,
.ds .hero-sub,
.ds .hero-lead,
.ds .kg-sub,
.ds .contact-note,
.ds .note {
  color: var(--ds-muted);
  line-height: 1.82;
  text-wrap: pretty;
  overflow-wrap: anywhere;
}

.ds strong {
  color: var(--ds-text);
  font-weight: 700;
}

.ds .ds-section > p,
.ds .section > p,
.ds .ds-card > p,
.ds .card > p,
.ds .mini-card > p,
.ds .feature > p,
.ds .note-block > p,
.ds .callout > p,
.ds .contact-box > p {
  max-width: var(--ds-reading-width);
}

.ds .ds-section.center > p,
.ds .section.center > p,
.ds .center .hero-lead,
.ds .center .note,
.ds .center .contact-lead {
  margin-inline: auto;
}

.ds .ds-hero,
.ds .hero-section,
.ds .kg-hero {
  padding: 82px 20px;
  margin: 0 0 2.4em;
  border: 1px solid color-mix(in srgb, var(--ds-accent) 22%, white);
  border-radius: 24px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--ds-section-tint) 75%, white) 0%, rgba(255, 255, 255, 0) 62%),
    var(--ds-hero-gradient),
    var(--ds-surface-alt);
  box-shadow: var(--ds-card-shadow);
  position: relative;
  overflow: hidden;
}

.ds .ds-hero::before,
.ds .hero-section::before,
.ds .kg-hero::before,
.ds .ds-highlight-band::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 6px;
  background: var(--ds-primary-gradient);
}

.ds .ds-highlight-band {
  position: relative;
  overflow: hidden;
}

.ds .ds-section,
.ds .section {
  max-width: var(--ds-content-width);
  margin: 0 auto var(--ds-section-gap);
  padding: 0 20px;
  position: relative;
}

.ds .ds-section::before,
.ds .section::before {
  content: "";
  position: absolute;
  inset: -0.65rem -0.5rem;
  background: color-mix(in srgb, var(--ds-section-tint) 70%, transparent);
  border-radius: calc(var(--ds-card-round) + 4px);
  opacity: var(--ds-section-overlay-opacity);
  z-index: -1;
}

.ds .ds-section.center,
.ds .section.center {
  text-align: center;
}

.ds .ds-surface-alt,
.ds .light-bg,
.ds .highlight-box {
  background: color-mix(in srgb, var(--ds-surface-alt) 72%, white);
  border: 1px solid color-mix(in srgb, var(--ds-border) 86%, white);
  border-radius: calc(var(--ds-card-round) + 2px);
  box-shadow: var(--ds-card-shadow);
  padding: clamp(1rem, 2.2vw, 1.8rem);
}

.ds h2,
.ds h3 {
  position: relative;
  margin-bottom: 0.58em;
}

.ds h2::after,
.ds h3::after {
  content: "";
  display: block;
  width: 56px;
  height: 4px;
  border-radius: 999px;
  background: var(--ds-primary-gradient);
  margin-top: 0.48em;
}

.ds .center h2::after,
.ds .center h3::after {
  margin-left: auto;
  margin-right: auto;
}

.ds .accent {
  color: var(--ds-accent);
}

.ds .em-key {
  color: var(--ds-accent-strong);
  font-weight: 600;
}

.ds .em-strong {
  color: inherit;
  font-weight: 700;
}

.ds .em-note {
  display: inline-block;
  color: var(--ds-text);
  background: color-mix(in srgb, var(--ds-secondary-fill) 56%, #ffffff);
  border: 1px solid color-mix(in srgb, var(--ds-border) 82%, #ffffff);
  border-radius: 10px;
  padding: 0.3em 0.62em;
}

.ds .em-key .em-strong,
.ds .em-strong .em-key {
  color: inherit;
  font-weight: inherit;
}

.ds .ds-grid,
.ds .card-grid,
.ds .card-grid-1col,
.ds .card-grid-2col,
.ds .card-grid-3col,
.ds .kg-value-grid,
.ds .kg-game-grid,
.ds .flow-grid,
.ds .pricing-grid {
  display: grid;
  gap: 18px;
  align-items: stretch;
}

.ds .ds-grid > *,
.ds .card-grid > *,
.ds .card-grid-1col > *,
.ds .card-grid-2col > *,
.ds .card-grid-3col > *,
.ds .kg-value-grid > *,
.ds .kg-game-grid > *,
.ds .flow-grid > *,
.ds .pricing-grid > * {
  min-width: 0;
}

.ds .ds-grid-1,
.ds .card-grid-1col {
  grid-template-columns: 1fr;
}

.ds .ds-grid-2,
.ds .card-grid-2col,
.ds .step-grid,
.ds .target-grid {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.ds .ds-grid-3,
.ds .card-grid,
.ds .card-grid-3col,
.ds .kg-value-grid,
.ds .kg-game-grid,
.ds .flow-grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

/* KobitDeskAI LP: connected arrow flow */
.ds .flow-grid.flow-grid-arrow {
  display: flex;
  align-items: stretch;
  flex-wrap: nowrap;
  gap: 0;
  max-width: var(--ds-content-width);
  margin-inline: auto;
}

.ds .flow-grid.flow-grid-arrow .flow-card {
  flex: 1 1 0;
  position: relative;
  min-height: 100%;
  margin-left: -18px;
  border-radius: 0;
  box-shadow: none;
  padding: 0.95em 1em 0.95em 1.7em;
  clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 50%, calc(100% - 28px) 100%, 0 100%, 18px 50%);
  transition: none;
}

.ds .flow-grid.flow-grid-arrow .flow-card:first-child {
  margin-left: 0;
  padding-left: 1.05em;
  clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 50%, calc(100% - 28px) 100%, 0 100%);
}

.ds .flow-grid.flow-grid-arrow .flow-card::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: color-mix(in srgb, var(--ds-border) 85%, #ffffff);
  transform: skewX(-34deg);
}

.ds .flow-grid.flow-grid-arrow .flow-card:first-child::before {
  display: none;
}

.ds .flow-grid.flow-grid-arrow .flow-card:hover {
  transform: none;
  box-shadow: none;
}

.ds .flow-grid.flow-grid-arrow .flow-num {
  margin-bottom: 0.3em;
}

.ds .flow-grid.flow-grid-arrow .flow-body h4 {
  margin: 0;
  line-height: 1.25;
}

.ds .flow-grid.flow-grid-arrow .flow-body p {
  margin: 0.15em 0 0;
  line-height: 1.35;
}

.ds .flow-grid.flow-grid-arrow .flow-card:last-child {
  clip-path: polygon(0 0, 100% 0, 100% 50%, 100% 100%, 0 100%, 18px 50%);
}

/* Card grid balancing by item count:
 * 1 => centered single card
 * 2 => 2 columns
 * 3 => 3 columns
 * 4 => 2x2
 * 5 => 3 + 2 (bottom row centered)
 */
.ds .ds-grid > :first-child:nth-last-child(1),
.ds .card-grid > :first-child:nth-last-child(1),
.ds .kg-value-grid > :first-child:nth-last-child(1),
.ds .kg-game-grid > :first-child:nth-last-child(1),
.ds .flow-grid > :first-child:nth-last-child(1),
.ds .pricing-grid > :first-child:nth-last-child(1) {
  justify-self: center;
  width: min(640px, 100%);
}

.ds .ds-grid:has(> :first-child:nth-last-child(1)),
.ds .card-grid:has(> :first-child:nth-last-child(1)),
.ds .kg-value-grid:has(> :first-child:nth-last-child(1)),
.ds .kg-game-grid:has(> :first-child:nth-last-child(1)),
.ds .flow-grid:has(> :first-child:nth-last-child(1)),
.ds .pricing-grid:has(> :first-child:nth-last-child(1)) {
  grid-template-columns: minmax(280px, 640px);
  justify-content: center;
}

.ds .ds-grid:has(> :first-child:nth-last-child(2)),
.ds .card-grid:has(> :first-child:nth-last-child(2)),
.ds .kg-value-grid:has(> :first-child:nth-last-child(2)),
.ds .kg-game-grid:has(> :first-child:nth-last-child(2)),
.ds .flow-grid:has(> :first-child:nth-last-child(2)),
.ds .pricing-grid:has(> :first-child:nth-last-child(2)) {
  grid-template-columns: repeat(2, minmax(280px, 1fr));
}

.ds .ds-grid:has(> :first-child:nth-last-child(3)),
.ds .card-grid:has(> :first-child:nth-last-child(3)),
.ds .kg-value-grid:has(> :first-child:nth-last-child(3)),
.ds .kg-game-grid:has(> :first-child:nth-last-child(3)),
.ds .flow-grid:has(> :first-child:nth-last-child(3)),
.ds .pricing-grid:has(> :first-child:nth-last-child(3)) {
  grid-template-columns: repeat(3, minmax(220px, 1fr));
}

.ds .ds-grid:has(> :first-child:nth-last-child(4)),
.ds .card-grid:has(> :first-child:nth-last-child(4)),
.ds .kg-value-grid:has(> :first-child:nth-last-child(4)),
.ds .kg-game-grid:has(> :first-child:nth-last-child(4)),
.ds .flow-grid:has(> :first-child:nth-last-child(4)),
.ds .pricing-grid:has(> :first-child:nth-last-child(4)) {
  grid-template-columns: repeat(2, minmax(260px, 1fr));
}

.ds .ds-grid:has(> :first-child:nth-last-child(5)),
.ds .card-grid:has(> :first-child:nth-last-child(5)),
.ds .kg-value-grid:has(> :first-child:nth-last-child(5)),
.ds .kg-game-grid:has(> :first-child:nth-last-child(5)),
.ds .flow-grid:has(> :first-child:nth-last-child(5)),
.ds .pricing-grid:has(> :first-child:nth-last-child(5)) {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.ds .ds-grid:has(> :first-child:nth-last-child(5)) > *,
.ds .card-grid:has(> :first-child:nth-last-child(5)) > *,
.ds .kg-value-grid:has(> :first-child:nth-last-child(5)) > *,
.ds .kg-game-grid:has(> :first-child:nth-last-child(5)) > *,
.ds .flow-grid:has(> :first-child:nth-last-child(5)) > *,
.ds .pricing-grid:has(> :first-child:nth-last-child(5)) > * {
  grid-column: span 2;
}

.ds .ds-grid:has(> :first-child:nth-last-child(5)) > :nth-child(4),
.ds .card-grid:has(> :first-child:nth-last-child(5)) > :nth-child(4),
.ds .kg-value-grid:has(> :first-child:nth-last-child(5)) > :nth-child(4),
.ds .kg-game-grid:has(> :first-child:nth-last-child(5)) > :nth-child(4),
.ds .flow-grid:has(> :first-child:nth-last-child(5)) > :nth-child(4),
.ds .pricing-grid:has(> :first-child:nth-last-child(5)) > :nth-child(4) {
  grid-column: 2 / span 2;
}

.ds .ds-grid:has(> :first-child:nth-last-child(5)) > :nth-child(5),
.ds .card-grid:has(> :first-child:nth-last-child(5)) > :nth-child(5),
.ds .kg-value-grid:has(> :first-child:nth-last-child(5)) > :nth-child(5),
.ds .kg-game-grid:has(> :first-child:nth-last-child(5)) > :nth-child(5),
.ds .flow-grid:has(> :first-child:nth-last-child(5)) > :nth-child(5),
.ds .pricing-grid:has(> :first-child:nth-last-child(5)) > :nth-child(5) {
  grid-column: 4 / span 2;
}

.ds .ds-card,
.ds .card,
.ds .mini-card,
.ds .feature,
.ds .flow-card,
.ds .pricing-card,
.ds .kg-value-card,
.ds .kg-game-card,
.ds .contact-box,
.ds .callout,
.ds .note-block {
  background: var(--ds-surface);
  border: 1px solid color-mix(in srgb, var(--ds-border) 85%, white);
  border-radius: var(--ds-card-round);
  box-shadow: var(--ds-card-shadow);
  padding: 1.45em;
  display: flex;
  flex-direction: column;
  gap: 0.65em;
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.ds .ds-card h3,
.ds .ds-card h4,
.ds .card h3,
.ds .card h4,
.ds .mini-card h3,
.ds .mini-card h4,
.ds .feature h3,
.ds .feature h4 {
  margin-bottom: 0.2em;
}

.ds .ds-card ul,
.ds .card ul,
.ds .mini-card ul,
.ds .feature ul {
  margin: 0.15em 0 0;
  padding-left: 1.15em;
}

.ds .ds-card li + li,
.ds .card li + li,
.ds .mini-card li + li,
.ds .feature li + li {
  margin-top: 0.32em;
}

.ds .ds-card:hover,
.ds .card:hover,
.ds .mini-card:hover,
.ds .feature:hover,
.ds .flow-card:hover,
.ds .pricing-card:hover,
.ds .kg-value-card:hover,
.ds .kg-game-card:hover,
.ds .contact-box:hover,
.ds .callout:hover,
.ds .note-block:hover {
  transform: var(--ds-card-lift);
  border-color: color-mix(in srgb, var(--ds-accent) 26%, var(--ds-border));
  box-shadow: 0 24px 48px color-mix(in srgb, var(--ds-accent) 18%, transparent);
}

.ds .card.emphasis,
.ds .ds-card-emphasis,
.ds .pricing-card.featured,
.ds .ds-card-compare,
.ds .comparison-card {
  border-width: 2px;
  border-color: color-mix(in srgb, var(--ds-accent) 42%, var(--ds-border));
  box-shadow: 0 26px 54px color-mix(in srgb, var(--ds-accent) 22%, transparent);
}

.ds .ds-figure,
.ds .explain-figure,
.ds .pain-figure,
.ds .figure-link,
.ds .kg-hero-cover {
  margin: 0 auto 1.3em;
  max-width: var(--ds-content-width);
  text-align: center;
}

.ds img {
  display: block;
  max-width: 100%;
  height: auto;
}

.ds .figure-link {
  display: inline-block;
}

.ds .ds-image-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  max-width: var(--ds-content-width);
  margin: 0 auto 1.4em;
}

.ds .ds-image-grid > .explain-figure,
.ds .ds-image-grid > .pain-figure,
.ds .ds-image-grid > figure,
.ds .ds-image-grid > div {
  margin: 0;
}

.ds .image-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  align-items: stretch;
}

.ds .image-gallery .image-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

.ds .ds-figure img,
.ds .explain-figure img,
.ds .pain-figure img,
.ds .feature img,
.ds .kg-hero-cover img {
  border-radius: calc(var(--ds-card-round) - 2px);
  border: 1px solid color-mix(in srgb, var(--ds-border) 90%, white);
  box-shadow: var(--ds-card-shadow);
}

.ds .ds-figure img,
.ds .explain-figure img {
  margin-inline: auto;
  max-width: min(920px, 100%);
}

.ds .explain-figure.small img {
  max-width: min(760px, 100%);
}

.ds .pain-figure img {
  margin-inline: auto;
  max-width: min(960px, 100%);
}

.ds .feature img,
.ds .kg-hero-cover img {
  margin-inline: auto;
}

.ds .pain-figure figcaption {
  margin-top: 0.65em;
  color: var(--ds-muted);
  text-align: center;
}

.ds .lp-screen-grid {
  align-items: stretch;
}

.ds .lp-screen-card {
  margin: 0;
  gap: 0.9em;
  justify-content: space-between;
}

.ds .lp-screen-card img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: calc(var(--ds-card-round) - 4px);
  border: 1px solid color-mix(in srgb, var(--ds-border) 88%, white);
}

.ds .lp-screen-card figcaption {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.55;
  color: var(--ds-muted);
}

.ds .flow-num,
.ds .step-num,
.ds .step-badge,
.ds .ds-badge,
.ds .kicker,
.ds .kg-tag,
.ds .kg-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 999px;
  font-weight: 700;
  line-height: 1;
  padding: 7px 11px;
  background: color-mix(in srgb, var(--ds-accent) 14%, #ffffff);
  color: var(--ds-accent);
  border: 1px solid color-mix(in srgb, var(--ds-accent) 24%, #ffffff);
}

.ds .ds-cta,
.ds .hero-actions,
.ds .hero-actions-2,
.ds .contact-actions,
.ds .contact-actions-2,
.ds .cta-3,
.ds .callout-actions,
.ds .kg-cta-row,
.ds .ds-cta-zone {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: stretch;
}

.ds .ds-cta-zone {
  padding: 10px 0;
  border-top: 1px dashed color-mix(in srgb, var(--ds-accent) 24%, transparent);
}

.ds .center .ds-cta,
.ds .center .hero-actions,
.ds .center .hero-actions-2,
.ds .center .contact-actions,
.ds .center .contact-actions-2,
.ds .center .cta-3,
.ds .center .callout-actions,
.ds .center .kg-cta-row,
.ds .center .ds-cta-zone,
.ds .contact-box .contact-actions,
.ds .contact-box .contact-actions-2 {
  justify-content: center;
}

.ds .ds-btn,
.ds .button-primary,
.ds .button-secondary,
.ds .button-soft,
.ds .button-ghost,
.ds .kg-btn,
.ds .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--ds-btn-height);
  padding: 0 20px;
  border-radius: var(--ds-btn-radius);
  font-weight: var(--ds-btn-weight);
  border: 1px solid transparent;
  text-decoration: none;
  line-height: 1;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.ds .ds-btn:focus-visible,
.ds .button-primary:focus-visible,
.ds .button-secondary:focus-visible,
.ds .button-soft:focus-visible,
.ds .button-ghost:focus-visible,
.ds .kg-btn:focus-visible,
.ds .btn-primary:focus-visible {
  outline: none;
  box-shadow: var(--ds-focus-ring);
}

.ds .ds-btn:hover,
.ds .button-primary:hover,
.ds .button-secondary:hover,
.ds .button-soft:hover,
.ds .button-ghost:hover,
.ds .kg-btn:hover,
.ds .btn-primary:hover {
  transform: translateY(-1px);
}

.ds .ds-btn-primary,
.ds .button-primary,
.ds .kg-btn-primary,
.ds .btn-primary {
  color: #ffffff;
  background: var(--ds-primary-gradient);
  border-color: transparent;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--ds-accent) 38%, transparent);
}

.ds .ds-cta-strong .ds-btn-primary,
.ds.ds-cta-strong .ds-btn-primary,
.ds.ds-cta-strong .button-primary,
.ds.ds-cta-strong .kg-btn-primary,
.ds.ds-cta-strong .btn-primary {
  box-shadow: 0 16px 34px color-mix(in srgb, var(--ds-accent) 45%, transparent);
  transform: translateY(0);
}

.ds .ds-btn-primary:hover,
.ds .button-primary:hover,
.ds .kg-btn-primary:hover,
.ds .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 34px color-mix(in srgb, var(--ds-accent) 48%, transparent);
}

.ds .ds-btn-secondary,
.ds .button-secondary,
.ds .ds-btn-soft,
.ds .button-soft {
  color: var(--ds-accent-strong);
  background: var(--ds-secondary-fill);
  border-color: color-mix(in srgb, var(--ds-accent) 28%, white);
}

.ds .ds-btn-secondary:hover,
.ds .button-secondary:hover,
.ds .ds-btn-soft:hover,
.ds .button-soft:hover {
  background: color-mix(in srgb, var(--ds-secondary-fill) 70%, white);
  border-color: color-mix(in srgb, var(--ds-accent) 38%, white);
}

.ds .ds-btn-ghost,
.ds .button-ghost,
.ds .kg-btn-ghost {
  color: var(--ds-accent-strong);
  background: transparent;
  border-color: var(--ds-ghost-border);
}

.ds .ds-btn-ghost:hover,
.ds .button-ghost:hover,
.ds .kg-btn-ghost:hover {
  background: color-mix(in srgb, var(--ds-accent) 10%, white);
  border-color: color-mix(in srgb, var(--ds-accent) 48%, white);
}

form[name],
form .form-field {
  color: var(--ds-text, #1f2937);
}

form[name] {
  margin: 0;
}

form .form-field {
  margin: 0 0 1.1rem;
}

form .form-label {
  display: block;
  margin-bottom: 0.48rem;
  color: var(--ds-text, #1f2937);
  font-weight: 700;
  letter-spacing: -0.01em;
}

form .form-data {
  margin: 0;
}

form .form-input-wrapper {
  margin: 0;
}

form input[type="text"],
form input[type="email"],
form input[type="tel"],
form input[type="number"],
form input[type="url"],
form select,
form textarea {
  width: 100%;
  min-height: 48px;
  padding: 0.75rem 0.95rem;
  border: 1px solid color-mix(in srgb, var(--ds-border, #dbe5e3) 85%, white);
  border-radius: 12px;
  background: #fff;
  color: var(--ds-text, #1f2937);
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.05);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

form textarea {
  min-height: 160px;
  resize: vertical;
}

form input::placeholder,
form textarea::placeholder {
  color: color-mix(in srgb, var(--ds-muted, #4b5563) 72%, white);
}

form input:focus-visible,
form select:focus-visible,
form textarea:focus-visible {
  outline: none;
  border-color: color-mix(in srgb, var(--ds-accent, #0f766e) 45%, var(--ds-border, #dbe5e3));
  box-shadow: var(--ds-focus-ring, 0 0 0 3px rgba(15, 118, 110, 0.22));
}

form .form-errors {
  margin-top: 0.45rem;
  color: #b91c1c;
  font-size: 0.93rem;
  line-height: 1.5;
}

form .form-group.has-errors {
  margin-inline: 0;
  border: 1px solid rgba(185, 28, 28, 0.22);
  background: rgba(185, 28, 28, 0.04);
  border-radius: 12px;
}

form .buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 0.95rem;
}

form .buttons .button,
form .buttons button,
form .buttons input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--ds-btn-height, 46px);
  padding: 0 20px;
  border-radius: var(--ds-btn-radius, 12px);
  border: 1px solid transparent;
  color: #fff;
  background: var(--ds-primary-gradient, linear-gradient(120deg, #0f766e, #0b5e57));
  font-weight: var(--ds-btn-weight, 700);
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--ds-accent, #0f766e) 38%, transparent);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

form .buttons .button:hover,
form .buttons button:hover,
form .buttons input[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 30px color-mix(in srgb, var(--ds-accent, #0f766e) 45%, transparent);
}

form .buttons .button:focus-visible,
form .buttons button:focus-visible,
form .buttons input[type="submit"]:focus-visible {
  outline: none;
  box-shadow: var(--ds-focus-ring, 0 0 0 3px rgba(15, 118, 110, 0.22));
}

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

.ds .faq-item,
.ds .ds-faq-item {
  border: 1px solid color-mix(in srgb, var(--ds-border) 85%, white);
  border-radius: calc(var(--ds-card-round) - 2px);
  background: var(--ds-surface);
  padding: 1em 1.2em;
  box-shadow: var(--ds-card-shadow);
}

.ds .ds-contact,
.ds .contact-section {
  max-width: var(--ds-content-width);
  margin: 0 auto var(--ds-section-gap);
  padding: 0 20px;
}

.ds .biblio-lp section,
.ds .kg-lp .kg-section {
  max-width: var(--ds-content-width);
  margin: 0 auto 2em;
  padding: 0 20px;
}

.ds .biblio-lp .hero,
.ds .kg-lp .kg-hero {
  text-align: center;
  padding: 2em 1.5em;
  border-radius: calc(var(--ds-card-round) + 2px);
  background: var(--ds-surface-alt);
  border: 1px solid color-mix(in srgb, var(--ds-border) 88%, white);
  box-shadow: var(--ds-card-shadow);
}

.ds.ds-motion-mid [data-aos] {
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.ds.ds-home-premium {
  --ds-home-hero-maxw: 1180px;
  --ds-home-hero-pad-y: clamp(64px, 10vw, 112px);
  --ds-home-title-size: clamp(34px, 6vw, 64px);
  --ds-home-sub-size: clamp(16px, 2vw, 20px);
}

.ds.ds-home-premium .ds-section {
  margin-bottom: clamp(56px, 8vw, 96px);
}

.ds.ds-home-premium .ds-home-hero {
  max-width: var(--ds-home-hero-maxw);
  margin: 0 auto clamp(28px, 4vw, 42px);
  padding: var(--ds-home-hero-pad-y) clamp(20px, 5vw, 56px);
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  gap: clamp(24px, 4vw, 44px);
  align-items: center;
  border-radius: 30px;
  border: 1px solid color-mix(in srgb, var(--ds-accent) 18%, white);
  background:
    radial-gradient(120% 130% at 0% 0%, color-mix(in srgb, var(--ds-accent) 14%, white) 0%, rgba(255, 255, 255, 0) 55%),
    linear-gradient(145deg, color-mix(in srgb, var(--ds-surface-alt) 88%, white), color-mix(in srgb, var(--ds-surface) 96%, white));
  box-shadow: 0 16px 34px color-mix(in srgb, var(--ds-accent) 12%, transparent);
  position: relative;
  overflow: hidden;
}

.ds.ds-home-premium .ds-home-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.035;
  background-image: radial-gradient(circle at 1px 1px, #000 1px, transparent 0);
  background-size: 18px 18px;
}

.ds.ds-home-premium .ds-home-hero-main,
.ds.ds-home-premium .ds-home-hero-visual {
  position: relative;
  z-index: 1;
}

.ds.ds-home-premium .ds-home-eyebrow {
  margin: 0 0 8px;
  font-size: 0.82rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ds-accent) 70%, #1f2937);
}

.ds.ds-home-premium .ds-home-hero h1 {
  margin: 0;
  font-size: var(--ds-home-title-size);
  line-height: 1.08;
  letter-spacing: -0.02em;
}

.ds.ds-home-premium .ds-home-lead {
  margin: 16px 0 0;
  font-size: var(--ds-home-sub-size);
  line-height: 1.7;
  color: color-mix(in srgb, var(--ds-muted) 90%, #111827);
  max-width: 46ch;
}

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

.ds.ds-home-premium .ds-home-hero-actions .ds-btn {
  min-height: 48px;
  padding-inline: 1.35em;
  box-shadow: 0 12px 24px color-mix(in srgb, var(--ds-accent) 22%, transparent);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ds.ds-home-premium .ds-home-hero-actions .ds-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 30px color-mix(in srgb, var(--ds-accent) 28%, transparent);
}

.ds.ds-home-premium .ds-home-hero-actions .ds-btn:focus-visible {
  outline: none;
  box-shadow: var(--ds-focus-ring), 0 0 0 2px #fff inset;
}

.ds.ds-home-premium .ds-home-hero-visual {
  display: grid;
  place-items: center;
}

.ds.ds-home-premium .ds-home-hero-visual img {
  width: min(100%, 290px);
  height: auto;
  filter: drop-shadow(0 22px 34px rgba(15, 23, 42, 0.12));
}

.ds.ds-home-premium .ds-home-trust-strip {
  max-width: var(--ds-home-hero-maxw);
  margin: 0 auto clamp(56px, 8vw, 96px);
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.ds.ds-home-premium .ds-home-trust-item {
  border: 1px solid color-mix(in srgb, var(--ds-border) 86%, white);
  border-radius: 16px;
  background: color-mix(in srgb, var(--ds-surface) 95%, white);
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ds-accent) 9%, transparent);
  padding: 18px 18px 16px;
}

.ds.ds-home-premium .ds-home-trust-item h3 {
  margin: 0;
  font-size: 1rem;
}

.ds.ds-home-premium .ds-home-trust-item p {
  margin: 8px 0 0;
  line-height: 1.6;
  font-size: 0.94rem;
}

.ds.ds-home-premium .ds-home-value-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.ds.ds-home-premium .ds-home-value-grid .ds-card {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--ds-border) 88%, white);
  box-shadow: 0 14px 28px color-mix(in srgb, var(--ds-accent) 9%, transparent);
}

.ds.ds-home-premium.ds-home-motion-medium [data-aos^="fade"] {
  transform: translateY(16px);
}

@keyframes ds-home-hero-rise {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ds.ds-home-premium .ds-home-hero {
  animation: ds-home-hero-rise 0.6s ease-out both;
}

.ds.ds-home-premium .ds-home-hero-visual {
  animation: ds-home-hero-rise 0.7s ease-out 0.12s both;
}

.ds.ds-about-premium {
  --ds-about-hero-maxw: 1120px;
  --ds-about-section-gap: clamp(56px, 8vw, 92px);
  --ds-about-title-size: clamp(32px, 5.2vw, 56px);
}

.ds.ds-about-premium .ds-section {
  margin-bottom: var(--ds-about-section-gap);
}

.ds.ds-about-premium .ds-about-hero {
  max-width: var(--ds-about-hero-maxw);
  margin: 0 auto var(--ds-about-section-gap);
  padding: clamp(58px, 9vw, 96px) clamp(20px, 5vw, 52px);
  border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--ds-accent) 18%, white);
  background:
    radial-gradient(120% 140% at 0% 0%, color-mix(in srgb, var(--ds-accent) 12%, white), rgba(255, 255, 255, 0) 58%),
    linear-gradient(140deg, color-mix(in srgb, var(--ds-surface-alt) 90%, white), color-mix(in srgb, var(--ds-surface) 96%, white));
  box-shadow: 0 14px 30px color-mix(in srgb, var(--ds-accent) 11%, transparent);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.ds.ds-about-premium .ds-about-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.03;
  background-image: radial-gradient(circle at 1px 1px, #000 1px, transparent 0);
  background-size: 20px 20px;
}

.ds.ds-about-premium .ds-about-eyebrow {
  margin: 0 0 8px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.8rem;
  color: color-mix(in srgb, var(--ds-accent) 70%, #1f2937);
}

.ds.ds-about-premium .ds-about-hero h1 {
  margin: 0;
  font-size: var(--ds-about-title-size);
  line-height: 1.1;
}

.ds.ds-about-premium .ds-about-hero > p {
  margin: 16px auto 0;
  max-width: 58ch;
}

.ds.ds-about-premium .ds-about-mission {
  max-width: var(--ds-content-width);
  margin: 0 auto var(--ds-about-section-gap);
  padding: clamp(26px, 4vw, 38px) clamp(20px, 4vw, 34px);
  border-left: 4px solid color-mix(in srgb, var(--ds-accent) 70%, #0f766e);
  border-radius: 0 18px 18px 0;
  background: linear-gradient(120deg, color-mix(in srgb, var(--ds-section-tint) 85%, white), color-mix(in srgb, var(--ds-surface-alt) 92%, white));
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ds-accent) 9%, transparent);
}

.ds.ds-about-premium .ds-about-mission h2 {
  margin: 0 0 14px;
}

.ds.ds-about-premium .ds-about-mission-lead {
  margin: 0;
  font-size: clamp(1.05rem, 1.5vw, 1.22rem);
  line-height: 1.9;
  max-width: 64ch;
}

.ds.ds-about-premium .ds-about-mission-note {
  margin: 12px 0 0;
  font-size: 0.95rem;
  color: color-mix(in srgb, var(--ds-muted) 88%, #1f2937);
}

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

.ds.ds-about-premium .ds-about-hero-actions .ds-btn {
  min-height: 48px;
  box-shadow: 0 12px 24px color-mix(in srgb, var(--ds-accent) 22%, transparent);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ds.ds-about-premium .ds-about-hero-actions .ds-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 17px 28px color-mix(in srgb, var(--ds-accent) 26%, transparent);
}

.ds.ds-about-premium .ds-about-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.ds.ds-about-premium .ds-about-meta-grid .ds-card {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--ds-border) 88%, white);
  box-shadow: 0 12px 24px color-mix(in srgb, var(--ds-accent) 8%, transparent);
}

.ds.ds-about-premium .ds-about-services-grid > .ds-card.service {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.ds.ds-about-premium .ds-about-services-grid > .ds-card.service p {
  margin: 0;
}

.ds.ds-about-premium .ds-about-services-grid > .ds-card.service h3 {
  margin-bottom: 0.85rem;
}

.ds.ds-about-premium .ds-about-services-grid > .ds-card.service > p {
  line-height: 1.78;
}

.ds.ds-about-premium .ds-about-service-points {
  margin-top: auto !important;
  padding-top: 0.95rem;
  font-size: 0.95rem;
  line-height: 1.65;
  color: color-mix(in srgb, var(--ds-muted) 90%, #1f2937);
  border-top: 1px solid color-mix(in srgb, var(--ds-border) 88%, white);
}

.ds.ds-about-premium .ds-about-services-grid > .ds-card.service ul,
.ds.ds-about-premium .ds-about-services-grid > .ds-card.service li {
  margin-top: auto;
  list-style: none;
}

.ds.ds-about-premium .ds-about-jks {
  max-width: var(--ds-content-width);
  margin-inline: auto;
}

.ds.ds-about-premium .ds-about-company {
  border: 1px solid color-mix(in srgb, var(--ds-border) 88%, white);
  border-radius: 16px;
  background: color-mix(in srgb, var(--ds-surface) 96%, white);
  box-shadow: 0 12px 24px color-mix(in srgb, var(--ds-accent) 8%, transparent);
  padding: clamp(18px, 3vw, 26px);
}

.ds.ds-about-premium .ds-about-company dl {
  margin: 0;
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 10px 14px;
}

.ds.ds-about-premium .ds-about-company dt {
  font-weight: 700;
  color: color-mix(in srgb, var(--ds-text) 94%, #111827);
}

.ds.ds-about-premium .ds-about-company dd {
  margin: 0;
}

@keyframes ds-about-hero-rise {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ds.ds-about-premium .ds-about-hero {
  animation: ds-about-hero-rise 0.6s ease-out both;
}

@media (max-width: 820px) {
  .ds.ds-about-premium .ds-about-meta-grid {
    grid-template-columns: 1fr;
  }

  .ds.ds-about-premium .ds-about-company dl {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .ds.ds-about-premium .ds-about-company dt {
    margin-top: 8px;
  }

  .ds.ds-about-premium .ds-about-hero-actions {
    flex-direction: column;
  }

  .ds.ds-home-premium .ds-home-hero {
    grid-template-columns: 1fr;
    padding-inline: 18px;
    border-radius: 22px;
  }

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

  .ds.ds-home-premium .ds-home-trust-strip,
  .ds.ds-home-premium .ds-home-value-grid {
    grid-template-columns: 1fr;
  }

  .ds .ds-hero,
  .ds .hero-section,
  .ds .kg-hero {
    padding-top: 66px;
    padding-bottom: 58px;
    border-radius: 20px;
  }

  .ds .ds-section,
  .ds .section,
  .ds .ds-contact,
  .ds .contact-section,
  .ds .biblio-lp section,
  .ds .kg-lp .kg-section {
    padding-left: 16px;
    padding-right: 16px;
    margin-bottom: 4.6em;
  }

  .ds .ds-grid,
  .ds .card-grid,
  .ds .card-grid-1col,
  .ds .card-grid-2col,
  .ds .card-grid-3col,
  .ds .step-grid,
  .ds .target-grid,
  .ds .ds-grid-2,
  .ds .ds-grid-3,
  .ds .kg-value-grid,
  .ds .kg-game-grid,
  .ds .flow-grid,
  .ds .pricing-grid,
  .ds .ds-grid:has(> :first-child:nth-last-child(1)),
  .ds .ds-grid:has(> :first-child:nth-last-child(2)),
  .ds .ds-grid:has(> :first-child:nth-last-child(3)),
  .ds .ds-grid:has(> :first-child:nth-last-child(4)),
  .ds .ds-grid:has(> :first-child:nth-last-child(5)),
  .ds .card-grid:has(> :first-child:nth-last-child(1)),
  .ds .card-grid:has(> :first-child:nth-last-child(2)),
  .ds .card-grid:has(> :first-child:nth-last-child(3)),
  .ds .card-grid:has(> :first-child:nth-last-child(4)),
  .ds .card-grid:has(> :first-child:nth-last-child(5)),
  .ds .kg-value-grid:has(> :first-child:nth-last-child(1)),
  .ds .kg-value-grid:has(> :first-child:nth-last-child(2)),
  .ds .kg-value-grid:has(> :first-child:nth-last-child(3)),
  .ds .kg-value-grid:has(> :first-child:nth-last-child(4)),
  .ds .kg-value-grid:has(> :first-child:nth-last-child(5)),
  .ds .kg-game-grid:has(> :first-child:nth-last-child(1)),
  .ds .kg-game-grid:has(> :first-child:nth-last-child(2)),
  .ds .kg-game-grid:has(> :first-child:nth-last-child(3)),
  .ds .kg-game-grid:has(> :first-child:nth-last-child(4)),
  .ds .kg-game-grid:has(> :first-child:nth-last-child(5)),
  .ds .flow-grid:has(> :first-child:nth-last-child(1)),
  .ds .flow-grid:has(> :first-child:nth-last-child(2)),
  .ds .flow-grid:has(> :first-child:nth-last-child(3)),
  .ds .flow-grid:has(> :first-child:nth-last-child(4)),
  .ds .flow-grid:has(> :first-child:nth-last-child(5)),
  .ds .pricing-grid:has(> :first-child:nth-last-child(1)),
  .ds .pricing-grid:has(> :first-child:nth-last-child(2)),
  .ds .pricing-grid:has(> :first-child:nth-last-child(3)),
  .ds .pricing-grid:has(> :first-child:nth-last-child(4)),
  .ds .pricing-grid:has(> :first-child:nth-last-child(5)) {
    grid-template-columns: 1fr !important;
  }

  .ds .ds-grid > *,
  .ds .card-grid > *,
  .ds .card-grid-1col > *,
  .ds .card-grid-2col > *,
  .ds .card-grid-3col > *,
  .ds .step-grid > *,
  .ds .target-grid > *,
  .ds .kg-value-grid > *,
  .ds .kg-game-grid > *,
  .ds .flow-grid > *,
  .ds .pricing-grid > * {
    grid-column: auto !important;
    justify-self: stretch !important;
  }

  .ds .flow-grid.flow-grid-arrow .flow-card {
    margin-left: 0;
    border-radius: var(--ds-card-round);
    clip-path: none;
    padding: 1.15em 1.2em;
  }

  .ds .flow-grid.flow-grid-arrow {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ds .flow-grid.flow-grid-arrow .flow-card::before {
    display: none;
  }

  .ds .ds-image-grid {
    grid-template-columns: 1fr;
  }

  .ds .image-gallery {
    grid-template-columns: 1fr;
  }

  .ds .ds-btn,
  .ds .button-primary,
  .ds .button-secondary,
  .ds .button-soft,
  .ds .button-ghost,
  .ds .kg-btn,
  .ds .btn-primary {
    width: 100%;
  }

  form .form-field {
    margin-bottom: 1.25rem;
  }

  form .buttons .button,
  form .buttons button,
  form .buttons input[type="submit"] {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ds.ds-about-premium .ds-about-hero {
    animation: none !important;
  }

  .ds.ds-home-premium .ds-home-hero,
  .ds.ds-home-premium .ds-home-hero-visual {
    animation: none !important;
  }

  .ds *,
  .ds *::before,
  .ds *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .ds .ds-card:hover,
  .ds .card:hover,
  .ds .mini-card:hover,
  .ds .feature:hover,
  .ds .flow-card:hover,
  .ds .pricing-card:hover,
  .ds .kg-value-card:hover,
  .ds .kg-game-card:hover,
  .ds .contact-box:hover,
  .ds .callout:hover,
  .ds .note-block:hover,
  .ds .ds-btn:hover,
  .ds .button-primary:hover,
  .ds .button-secondary:hover,
  .ds .button-soft:hover,
  .ds .button-ghost:hover,
  .ds .kg-btn:hover,
  .ds .btn-primary:hover,
  form .buttons .button:hover,
  form .buttons button:hover,
  form .buttons input[type="submit"]:hover {
    transform: none !important;
  }
}

/* Survey Q3: align options in 3x2 grid and keep start position consistent */
#survey-form .checkboxes.survey-issues-field {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem 1rem;
  margin-top: 0.4rem;
}

#survey-form .checkboxes.survey-issues-field input[type="checkbox"] {
  display: none !important;
}

#survey-form .checkboxes.survey-issues-field label {
  display: block !important;
  margin: 0 !important;
  padding: 0.18rem 0 0.18rem 1.8rem !important;
  border: 1px solid #d9e1ec;
  border-radius: 8px;
  min-height: 2.6rem;
  position: relative;
  background: transparent !important;
  line-height: 1.35;
  cursor: pointer;
  overflow-wrap: anywhere;
}

#survey-form .checkboxes.survey-issues-field label::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  width: 0.95rem;
  height: 0.95rem;
  border: 1px solid #7c8798;
  border-radius: 3px;
  background: #fff;
}

#survey-form .checkboxes.survey-issues-field input[type="checkbox"]:checked + label {
  border-color: #2563eb;
  background: #f8fbff !important;
  font-weight: 600;
  color: #0f172a;
}

#survey-form .checkboxes.survey-issues-field input[type="checkbox"]:checked + label::before {
  border-color: #2563eb;
  background: #2563eb;
  box-shadow: inset 0 0 0 2px #fff;
}

@media (max-width: 980px) {
  #survey-form .checkboxes.survey-issues-field {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  #survey-form .checkboxes.survey-issues-field {
    grid-template-columns: 1fr;
  }
}

/* Global header override: replace Helium logo and remove SNS icons */
#g-navigation .g-logo.g-logo-helium {
  display: inline-block;
  width: 180px;
  height: 42px;
  min-height: 42px;
  background: url("/user/images/g5_helium/KobitLogo_S.png") no-repeat left center;
  background-size: contain;
  font-size: 0 !important;
  color: transparent !important;
}

#g-navigation .g-logo.g-logo-helium svg,
#g-navigation .g-logo.g-logo-helium img {
  display: none !important;
}

#g-navigation .g-logo.g-logo-helium::after {
  content: none !important;
}

#g-navigation .g-social,
#g-navigation .g-social-header {
  display: none !important;
}

#g-navigation .g-grid > .g-block:last-child {
  display: block !important;
}
