/* The experiment keeps the existing article-footer placement and product typefaces. */
.cta-experiment { margin-top:64px; }
.cta-experiment>.guide-consultation { margin-top:0; }
.cta-banner { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); grid-template-areas:"copy art" "action art"; column-gap:40px; align-items:center; min-width:0; padding:44px; border-radius:28px; background:var(--lavender-light); border:1px solid var(--line); overflow:hidden; }
.cta-banner-copy { grid-area:copy; min-width:0; }
.cta-banner-conversion { grid-area:action; min-width:0; }
.cta-banner-eyebrow { color:var(--accent-deep); font-size:11px; font-weight:750; letter-spacing:.06em; line-height:1.6; text-transform:uppercase; }
.cta-banner h2 { max-width:21ch; margin:18px 0 20px; font:750 clamp(29px,3.1vw,42px)/1.16 var(--display); letter-spacing:-.035em; text-wrap:balance; }
.cta-banner-body { max-width:54ch; color:#4e485b; font-size:16px; line-height:1.8; text-wrap:pretty; }
.cta-banner-actions { display:flex; align-items:center; flex-wrap:wrap; gap:16px 20px; margin-top:28px; }
.cta-banner-actions>span { font-size:12px; line-height:1.7; color:var(--muted); }
.cta-banner-button { gap:16px; min-height:52px; max-width:100%; font-size:15px; }
.cta-banner-button svg { flex:none; }
.cta-banner-details { display:inline-flex; align-items:center; gap:12px; min-height:44px; margin-top:14px; color:var(--accent-deep); font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.cta-art { grid-area:art; min-width:0; position:relative; height:302px; font-family:var(--display); }
.cta-art-kicker { display:block; color:var(--muted); font-size:11px; font-weight:650; letter-spacing:.04em; text-transform:uppercase; }
.cta-banner--diary { background:#302242; color:#fff; border-color:transparent; }
.cta-banner--diary .cta-banner-eyebrow { color:#d4c7f0; }
.cta-banner--diary .cta-banner-body,.cta-banner--diary .cta-banner-actions>span { color:#ddd5e8; }
.cta-banner--diary .cta-banner-details { color:#e2d5ff; }
.cta-banner--diary :focus-visible { outline-color:var(--yellow); }
.cta-paper { position:relative; width:calc(100% - 32px); max-width:260px; margin:4px auto 0; padding:22px; border-radius:18px; background:#fff; color:var(--ink); box-shadow:0 12px 24px #00000014; transform:rotate(-3deg); }
.cta-paper-line { display:flex; align-items:center; gap:10px; margin-top:19px; font-size:13px; }
.cta-paper-line i { width:9px; height:9px; flex:none; border-radius:50%; background:var(--lavender); box-shadow:0 0 0 4px var(--lavender-light); }
.cta-art-connector { text-align:center; margin:12px 0; color:#bca7dd; font-size:23px; }
.cta-art-result { display:flex; align-items:center; justify-content:center; gap:10px; width:calc(100% - 24px); max-width:290px; margin:auto; padding:16px 12px; border:1px solid #7c659b; border-radius:14px; background:#49365f; color:#fff; font-size:14px; font-weight:650; }
.cta-art-result svg { color:var(--yellow); flex:none; }
.cta-art-step { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:17px; color:#e2d5ff; font-size:12px; }
.cta-step-dot { width:6px; height:6px; background:var(--yellow); border-radius:50%; }
.cta-banner--rhythm { background:var(--lavender); }
.cta-clock { position:absolute; top:38px; left:50%; width:200px; transform:translateX(-50%); color:#b6a4d6; }
.cta-rhythm-card { position:absolute; padding:15px 18px; border-radius:16px; background:#fff; box-shadow:0 3px 4px #21163904,0 12px 24px #2116390a; }
.cta-rhythm-card span { display:block; color:var(--muted); font-size:11px; }
.cta-rhythm-card strong { display:block; margin-top:6px; font-size:14px; font-weight:650; }
.cta-rhythm-card--work { top:15px; left:0; }
.cta-rhythm-card--road { top:103px; right:0; }
.cta-rhythm-card--home { top:196px; left:16px; }
.cta-rhythm-caption { position:absolute; bottom:0; right:0; color:var(--accent-deep); font-size:11px; }
.cta-banner--plate { background:#faf7ef; border-color:#eee7d9; }
.cta-plate { width:240px; max-width:100%; margin:28px auto 0; filter:drop-shadow(0 12px 20px #4633200b); }
.cta-plate svg { display:block; width:100%; height:auto; }
.cta-plate-note { position:absolute; padding:10px 14px; background:#fff; border-radius:999px; font-size:12px; box-shadow:0 2px 10px #46332008; }
.cta-plate-note--food { top:12px; left:0; }
.cta-plate-note--portion { right:0; bottom:45px; }
.cta-plate-note--satiety { left:0; bottom:15px; color:var(--accent-deep); }
.cta-banner--support { background:var(--white); }
.cta-art--support>img { display:block; width:240px; height:302px; max-width:100%; object-fit:cover; margin:auto; border-radius:22px; outline:1px solid #0000001a; outline-offset:-1px; }
.cta-author-note { position:absolute; bottom:15px; right:0; max-width:100%; padding:14px 18px; background:var(--white); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); }
.cta-author-note strong { display:block; color:var(--ink); font-size:16px; }
.cta-author-note>span { display:block; margin-top:5px; color:var(--muted); font-size:11px; }
.cta-support-note { position:absolute; top:20px; left:0; display:flex; align-items:center; gap:7px; max-width:100%; padding:10px 12px; background:var(--lavender-light); color:var(--accent-deep); border:1px solid var(--line); border-radius:12px; font-size:11px; }
.cta-support-note svg { flex:none; }
@media(max-width:1000px) and (min-width:901px) {
  .cta-banner { padding:32px; gap:24px; }
  .cta-banner h2 { font-size:34px; }
}
@media(max-width:900px) {
  .cta-banner { grid-template-columns:minmax(0,1fr); grid-template-areas:"copy" "art" "action"; padding:30px; gap:28px; }
  .cta-banner-copy { max-width:620px; }
  .cta-banner h2 { font-size:34px; max-width:23ch; }
  .cta-art { width:min(100%,340px); margin-inline:auto; }
  .cta-banner-actions { margin-top:0; }
}
@media(max-width:760px) {
  .cta-experiment { margin-top:44px; }
  .cta-banner { padding:26px 22px; border-radius:24px; gap:28px; }
  .cta-banner h2 { font-size:28px; margin:14px 0 16px; }
  .cta-banner-body { font-size:15px; }
  .cta-banner-actions { align-items:stretch; flex-direction:column; gap:12px; margin-top:0; }
  .cta-banner-button { justify-content:space-between; width:100%; padding-inline:16px; text-align:left; }
  .cta-banner-actions>span { font-size:11px; }
  .cta-art { height:200px; }
  .cta-paper { padding:16px 20px; }
  .cta-paper-line { font-size:12px; margin-top:16px; }
  .cta-paper-line~.cta-paper-line { display:none; }
  .cta-art-connector { margin:7px 0; font-size:19px; }
  .cta-art-result { padding:12px; }
  .cta-art-step { margin-top:12px; }
  .cta-art-result { font-size:12px; }
  .cta-rhythm-card { padding:13px 15px; }
  .cta-rhythm-card strong { font-size:13px; }
  .cta-clock { width:150px; top:6px; }
  .cta-rhythm-card--work { top:0; }
  .cta-rhythm-card--road { top:62px; }
  .cta-rhythm-card--home { top:126px; left:0; }
  .cta-rhythm-caption { font-size:10px; }
  .cta-plate { width:160px; margin-top:12px; }
  .cta-plate-note { font-size:10px; padding:9px 11px; }
  .cta-plate-note--food { top:0; }
  .cta-plate-note--satiety { bottom:0; }
  .cta-plate-note--portion { bottom:25px; }
  .cta-art--support { height:200px; }
  .cta-art--support>img { width:160px; height:200px; border-radius:16px; }
  .cta-author-note { bottom:5px; padding:11px 13px; }
  .cta-author-note strong { font-size:14px; }
  .cta-author-note>span { font-size:10px; }
  .cta-support-note { display:none; }
}
@media(max-width:380px) { .cta-banner h2 { font-size:26px; } }
@media(prefers-reduced-motion:reduce) {
  .cta-banner * { transition:none!important; }
}