/* Brand panels share the same primary action and spacing. */
.platforms .platform {
  display: flex;
  flex-direction: column;
  min-height: 432px;
  padding-bottom: 32px;
}

.platforms .platform-content {
  padding: 32px 32px 0;
}

.platforms .case-entry {
  position: static;
  align-self: center;
  justify-content: space-between;
  flex-shrink: 0;
  min-width: 260px;
  min-height: 56px;
  margin: 28px auto 0;
  padding: 0 26px;
  gap: 28px;
  border: 1px solid #ffffffb3;
  border-radius: 999px;
  background: #fffffff2;
  color: #143b32;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  box-shadow: 0 4px 14px #001c2310;
  transform: none;
  transition: background .2s, box-shadow .2s, transform .2s;
}

.platforms .doubao .case-entry { color: #0b4689; }
.platforms .workbuddy .case-entry { color: #075e55; }
.platforms .qwen .case-entry { color: #145638; }

.platforms .case-entry:hover {
  background: #fff;
  box-shadow: 0 8px 20px #001c2326;
  transform: translateY(-2px);
}

.platforms .case-entry:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 5px;
}

/* One shared OpenAI region, immediately after the three office platforms. */
.platforms .platform.openai {
  --glow: #7883dc;
  background: radial-gradient(ellipse at 90% 8%, #8584d32b, transparent 56%), linear-gradient(125deg, #101721 0%, #25334d 58%, #424e82 100%);
}
.openai-content {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  align-items: center;
  gap: 40px;
  min-height: 400px;
  padding: 76px 56px 24px;
}
.platform.openai h2 { font-size: clamp(34px, 3.8vw, 50px); line-height: 1.3; letter-spacing: -1.3px; margin-bottom: 21px; }
.platform.openai h2 span { display: block; white-space: normal; margin: 0; }
.openai-copy > p { margin: 0; color: #e0e6f0; font-size: 15px; line-height: 1.9; }
.openai-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 27px; }
.openai-action { display: inline-flex; align-items: center; justify-content: space-between; min-height: 52px; padding: 0 22px; gap: 25px; border: 1px solid #ffffffe0; border-radius: 999px; background: #fff; color: #263247; font-size: 14px; font-weight: 550; line-height: 1.5; }
.openai-action-secondary { background: #ffffff0a; border-color: #ffffff66; color: #fff; }
.openai-action:hover { background: #eef1ff; color: #203758; }
.openai-action:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
.openai-brand-pair { display: flex; align-items: center; justify-content: center; gap: 24px; padding-bottom: 6px; }
.openai-brand { text-align: center; }
.openai-brand-icon { display: grid; place-items: center; width: 96px; height: 96px; }
.openai-brand-icon img { display: block; width: 96px; height: 96px; object-fit: contain; }
.openai-chatgpt-icon img { box-sizing: border-box; width: 80px; height: 80px; padding: 14px; border-radius: 20px; background: #fff; }
.openai-brand > span { display: block; margin-top: 14px; color: #e6e9f3; font-size: 16px; }
.openai-brand-divider { color: #c4cae575; font-size: 24px; font-weight: 300; margin-top: -28px; }
@media (min-width: 701px) and (max-width: 1100px) {
  .openai-content { grid-template-columns: minmax(0, 1fr) 204px; gap: 24px; padding: 72px 36px 24px; }
  .platform.openai h2 { font-size: 34px; }
  .openai-brand-pair { gap: 6px; }
  .openai-brand-icon { width: 82px; height: 82px; }
  .openai-brand-icon img { width: 82px; height: 82px; }
  .openai-chatgpt-icon img { width: 70px; height: 70px; padding: 12px; border-radius: 18px; }
  .openai-brand > span { font-size: 14px; }
  .openai-brand-divider { font-size: 18px; }
}

@media (max-width: 700px) {
  .platforms .platform {
    min-height: 0;
    padding-bottom: 28px;
  }

  .platforms .platform-content { padding: 48px 22px 0; }

  .platforms .case-entry {
    width: min(280px, calc(100% - 44px));
    min-width: 0;
    min-height: 52px;
    margin-top: 26px;
    padding: 0 22px;
    gap: 16px;
    font-size: 15px;
  }

  .openai-content { grid-template-columns: minmax(0, 1fr); gap: 26px; min-height: 0; padding: 64px 24px 0; }
  .openai-brand-pair { grid-row: 1; gap: 22px; padding: 0; }
  .platform.openai h2 { font-size: clamp(23px, 6.7vw, 32px); letter-spacing: -.6px; }
  .openai-copy > p { font-size: 14px; }
  .openai-actions { display: grid; grid-template-columns: minmax(0, 1fr); margin-top: 24px; }
  .openai-action { width: 100%; min-height: 50px; }
}

@media (prefers-reduced-motion: reduce) {
  .platforms .case-entry,
  .platforms .case-entry:hover { transform: none; }
}
