/* Variant B only. The preserved page, shared hero and shared runtime are untouched. */
.publication-experiment .experiment-section { margin-top: 64px; scroll-margin-top: 100px; }
.publication-experiment .experiment-heading { margin-bottom: 30px; }
.publication-experiment .experiment-heading h2 { margin: 0; font-size: clamp(32px,3.25vw,44px); line-height: 1.12; letter-spacing: -.04em; }
.publication-experiment .experiment-heading--split { display: flex; justify-content: space-between; align-items: end; gap: 24px; }
.publication-experiment .experiment-heading--split > p { margin: 0; color: #756a86; font-size: 15px; }
.publication-experiment .release-case { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: 36px; align-items: center; padding: 44px 44px 30px; border-radius: 30px; background: #14231c; color: #f2f6ee; overflow: hidden; }
.publication-experiment .release-case__copy { padding-bottom: 14px; }
.publication-experiment .release-case > * { min-width: 0; }
.publication-experiment .release-case .eyebrow { color: #c5e8aa; }
.publication-experiment .release-case h2 { margin: 18px 0 24px; font-size: clamp(36px,3.6vw,50px); line-height: 1.08; letter-spacing: -.04em; }
.publication-experiment .release-case__copy > p:not(.eyebrow) { max-width: 450px; color: #bdcabe; font-size: 16px; line-height: 1.7; }
.publication-experiment .release-stores { display: flex; flex-wrap: wrap; gap: 12px; margin: 26px 0 22px; }
.publication-experiment .release-stores a { display: flex; justify-content: space-between; gap: 26px; align-items: center; padding: 13px 18px; min-height: 50px; border: 1px solid #64795b; border-radius: 16px; color: #edf8e6; font-weight: 600; font-size: 14px; transition: background .2s; }
.publication-experiment .release-stores a:hover { background: #293e2d; }
.publication-experiment .release-case__link { display: inline-block; color: #c6d5c0; font-size: 13px; line-height: 1.6; text-decoration: underline; text-underline-offset: 4px; }
.publication-experiment .release-case__visual { position: relative; height: 465px; min-width: 0; }
.publication-experiment .release-halo { position: absolute; width: 360px; height: 360px; left: 50%; top: 48%; transform: translate(-50%,-50%); border: 1px solid #667953; border-radius: 50%; box-shadow: 0 0 0 34px #40543820, 0 0 0 70px #40543810; }
.publication-experiment .release-phone { position: absolute; width: 160px; height: auto; border: 5px solid #344235; border-radius: 30px; box-shadow: 0 24px 42px #040d084a; }
.publication-experiment .release-phone--left { left: 0; top: 55px; transform: rotate(-7deg); }
.publication-experiment .release-phone--right { right: 0; top: 64px; transform: rotate(7deg); }
.publication-experiment .release-phone--center { left: 50%; top: 0; width: 194px; transform: translateX(-50%); z-index: 1; border-color: #65775a; }
.publication-experiment .release-status { position: absolute; z-index: 2; left: 50%; bottom: 4px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 9px; white-space: nowrap; padding: 12px 20px; border: 1px solid #687d5b; background: #24342a; border-radius: 99px; color: #d4f4bb; font-size: 13px; box-shadow: 0 10px 25px #07100940; }
.publication-experiment .release-status i { width: 7px; height: 7px; border-radius: 50%; background: #c5f692; }
.publication-experiment .visual-process { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 26px; }
.publication-experiment .visual-process article { min-width: 0; }
.publication-experiment .visual-step-art { display: grid; place-items: center; position: relative; height: 194px; margin-bottom: 20px; background: #f1ecfa; border-radius: 24px; }
.publication-experiment .visual-step-art img { width: 185px; height: 185px; object-fit: contain; }
.publication-experiment .visual-process article:nth-child(2) .visual-step-art { background: #f6eef4; }
.publication-experiment .visual-process article:nth-child(3) .visual-step-art { background: #e9f1f7; }
.publication-experiment .visual-process article:nth-child(4) .visual-step-art { background: #edf3ee; }
.publication-experiment .visual-step-number { position: absolute; z-index: 1; left: 18px; top: 15px; color: #8e77b0; font-size: 12px; font-weight: 700; }
.publication-experiment .visual-process h3 { margin: 0 0 10px; font-size: 26px; line-height: 1.2; letter-spacing: -.03em; }
.publication-experiment .visual-process p { max-width: 250px; margin: 0; color: #70667c; font-size: 15px; line-height: 1.6; }
.publication-experiment .visual-plans { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.publication-experiment .visual-plan { display: flex; flex-direction: column; min-width: 0; padding: 18px 26px 26px; border: 1px solid #e2dbe9; border-radius: 26px; background: #fff; }
.publication-experiment .visual-plan--2 { background: #eee7fa; border-color: #d6c5f0; }
.publication-experiment .visual-plan--3 { background: #f4f0eb; border-color: #e9e1d7; }
.publication-experiment .visual-plan-art { height: 188px; display: grid; place-items: center; }
.publication-experiment .visual-plan-art img { width: 210px; height: 188px; object-fit: contain; }
.publication-experiment .visual-plan-copy { display: flex; flex-direction: column; flex: 1; }
.publication-experiment .visual-plan h3 { margin: 12px 0 10px; font-size: 32px; line-height: 1.1; letter-spacing: -.04em; }
.publication-experiment .visual-plan p { margin: 0 0 18px; color: #766a80; font-size: 15px; line-height: 1.6; }
.publication-experiment .visual-plan ul { display: grid; gap: 10px; list-style: none; margin: 0 0 24px; padding: 0; color: #60556c; font-size: 14px; line-height: 1.5; }
.publication-experiment .visual-plan li { display: grid; grid-template-columns: 14px minmax(0,1fr); gap: 8px; }
.publication-experiment .visual-plan li::before { content: '✓'; color: #8761c7; }
.publication-experiment .visual-plan .pill-button { width: 100%; margin-top: auto; padding-left: 18px; gap: 12px; }
.publication-experiment .release-promise { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; gap: 28px; align-items: center; padding: 32px 36px; border-radius: 24px; border: 1px solid #ded6e9; background: #f6f2fb; }
.publication-experiment .release-promise__icon { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 20px; background: #e3d7f5; color: #8056ba; font-size: 30px; }
.publication-experiment .release-promise h2 { margin: 0 0 12px; font-size: 29px; letter-spacing: -.03em; line-height: 1.15; }
.publication-experiment .release-promise h2 br { display: none; }
.publication-experiment .release-promise p { max-width: 760px; margin: 0; color: #756980; font-size: 15px; line-height: 1.65; }
.publication-experiment .release-promise > a { color: #7350a8; font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.publication-experiment .experiment-tasks { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding: 24px 4px 0; font-size: 13px; color: #786888; }
.publication-experiment .experiment-tasks a { text-decoration: underline; text-underline-offset: 4px; color: #674697; }
.publication-experiment .visual-cta { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); align-items: center; gap: 28px; padding: 42px 52px; border-radius: 30px; background: #7650cb; color: #fff; }
.publication-experiment .visual-cta > * { min-width: 0; }
.publication-experiment .visual-cta .eyebrow { color: #ded1f7; }
.publication-experiment .visual-cta h2 { margin: 0 0 20px; font-size: clamp(34px,3.5vw,48px); line-height: 1.1; letter-spacing: -.045em; }
.publication-experiment .visual-cta p:not(.eyebrow) { margin: 0 0 26px; color: #e8ddf9; font-size: 16px; line-height: 1.6; }
.publication-experiment .visual-cta img { width: 280px; height: auto; justify-self: center; }
.publication-experiment .visual-cta .pill-button { min-width: 250px; }
.publication-experiment .experiment-footnote { font-size: 12px; color: #8b7b9b; margin: 20px 0 38px; }
.publication-experiment .experiment-footnote a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1050px) {
  .publication-experiment .release-case { gap: 24px; padding: 34px 30px 24px; }
  .publication-experiment .release-case__visual { height: 365px; }
  .publication-experiment .release-phone { width: 116px; border-radius: 24px; }
  .publication-experiment .release-phone--center { width: 150px; }
  .publication-experiment .release-phone--left { top: 50px; }
  .publication-experiment .release-phone--right { top: 58px; }
  .publication-experiment .release-halo { width: 260px; height: 260px; }
  .publication-experiment .visual-process { gap: 22px; }
  .publication-experiment .visual-step-art { height: 158px; }
  .publication-experiment .visual-step-art img { width: 145px; height: 145px; }
  .publication-experiment .visual-process h3 { font-size: 22px; }
  .publication-experiment .visual-plans { gap: 16px; }
  .publication-experiment .visual-plan { padding: 14px 20px 22px; }
  .publication-experiment .visual-plan h3 { font-size: 28px; }
  .publication-experiment .visual-plan-art { height: 165px; }
  .publication-experiment .visual-plan-art img { width: 180px; height: 165px; }
  .publication-experiment .release-promise { grid-template-columns: 52px minmax(0,1fr); gap: 22px; padding: 28px; }
  .publication-experiment .release-promise__icon { width: 52px; height: 52px; }
  .publication-experiment .release-promise > a { grid-column: 2; }
}
@media (max-width: 820px) {
  .publication-experiment .release-case { grid-template-columns: minmax(0,1fr); }
  .publication-experiment .release-case h2 br { display: none; }
  .publication-experiment .release-case__copy > p:not(.eyebrow) { max-width: 620px; }
  .publication-experiment .release-case__visual { width: 400px; max-width: 100%; height: 405px; justify-self: center; }
  .publication-experiment .release-phone { width: 135px; }
  .publication-experiment .release-phone--center { width: 170px; }
  .publication-experiment .visual-process { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px 22px; }
  .publication-experiment .visual-step-art { height: 180px; }
  .publication-experiment .visual-step-art img { width: 175px; height: 175px; }
  .publication-experiment .visual-plans { grid-template-columns: 1fr; }
  .publication-experiment .visual-plan { flex-direction: row; align-items: center; gap: 26px; padding: 26px; }
  .publication-experiment .visual-plan-art { width: 190px; height: 200px; flex: 0 0 auto; }
  .publication-experiment .visual-plan-art img { width: 190px; height: 190px; }
  .publication-experiment .visual-plan .pill-button { max-width: 330px; }
  .publication-experiment .experiment-heading--split { align-items: start; }
  .publication-experiment .visual-cta { padding: 34px; }
  .publication-experiment .visual-cta img { width: 230px; }
}
@media (max-width: 600px) {
  .publication-experiment .experiment-section { margin-top: 44px; }
  .publication-experiment .experiment-heading { margin-bottom: 24px; }
  .publication-experiment .experiment-heading--split { display: block; }
  .publication-experiment .experiment-heading--split > p { margin-top: 14px; }
  .publication-experiment .experiment-heading--split > p br { display: none; }
  .publication-experiment .release-case { padding: 28px 24px 24px; gap: 16px; border-radius: 24px; }
  .publication-experiment .release-case h2 { font-size: 36px; }
  .publication-experiment .release-case h2 br { display: block; }
  .publication-experiment .release-case__visual { height: 344px; }
  .publication-experiment .release-phone { width: 107px; border-width: 4px; border-radius: 20px; }
  .publication-experiment .release-phone--center { width: 140px; }
  .publication-experiment .release-phone--left { top: 46px; }
  .publication-experiment .release-phone--right { top: 56px; }
  .publication-experiment .release-halo { width: 240px; height: 240px; box-shadow: 0 0 0 25px #40543820; }
  .publication-experiment .release-status { bottom: 4px; font-size: 12px; padding: 10px 16px; }
  .publication-experiment .release-stores a { gap: 15px; font-size: 13px; padding: 12px 15px; }
  .publication-experiment .visual-process { gap: 28px 18px; }
  .publication-experiment .visual-step-art { height: 146px; margin-bottom: 16px; border-radius: 20px; }
  .publication-experiment .visual-step-art img { width: 135px; height: 135px; }
  .publication-experiment .visual-step-number { left: 12px; top: 10px; font-size: 10px; }
  .publication-experiment .visual-process h3 { font-size: 21px; }
  .publication-experiment .visual-process p { font-size: 15px; }
  .publication-experiment .visual-plan { flex-direction: column; align-items: stretch; gap: 4px; padding: 18px 26px 26px; }
  .publication-experiment .visual-plan-art { width: 100%; height: 165px; }
  .publication-experiment .visual-plan-art img { width: 195px; height: 165px; }
  .publication-experiment .visual-plan h3 { font-size: 32px; }
  .publication-experiment .visual-plan .pill-button { max-width: none; }
  .publication-experiment .release-promise { grid-template-columns: 1fr; gap: 18px; padding: 26px; }
  .publication-experiment .release-promise h2 { font-size: 28px; }
  .publication-experiment .release-promise h2 br { display: block; }
  .publication-experiment .release-promise > a { grid-column: auto; }
  .publication-experiment .experiment-tasks { gap: 14px 22px; padding: 24px 6px 0; font-size: 14px; }
  .publication-experiment .experiment-tasks > span { flex-basis: 100%; }
  .publication-experiment .visual-cta { grid-template-columns: 1fr; gap: 20px; padding: 30px 26px 14px; border-radius: 24px; }
  .publication-experiment .visual-cta .pill-button { width: 100%; min-width: 0; }
  .publication-experiment .visual-cta img { width: 210px; justify-self: end; }
}
@media (prefers-reduced-motion: reduce) {
  .publication-experiment .release-stores a { transition: none; }
}
@media (max-width: 360px) {
  .publication-experiment .release-case h2 { font-size: 30px; }
}