/* Preview-only typography. The normal homepage is unchanged without ?style=a-d. */
html[data-design-style] #idleCopy {
  padding: 0 5%;
  gap: clamp(5px, .55vw, 10px);
}
html[data-design-style] #idleCopy .eyebrow {
  display: block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(7px, .52vw, 10px);
  line-height: 1.4;
  font-weight: 400;
  letter-spacing: .32em;
  color: #c6b886;
}
html[data-design-style] #idleCopy h1 {
  margin: 0;
  font-size: calc(var(--preview-title-size, 34px) * 1.12);
  line-height: 1.12;
  font-weight: 400;
  letter-spacing: .015em;
}
html[data-design-style] #idleCopy h1 .hero-line { display: block; }
html[data-design-style] #idleHint {
  max-width: 100%;
  margin: 3px 0 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(10px, .7vw, 13px);
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: .045em;
  color: #aaa594;
}
html[data-design-style] #idleCopy .quiet-line { margin: 3px 0 0; }

/* A: classical, cinematic, warm gold. */
html[data-design-style="a"] #idleCopy h1 {
  font-family: Georgia, 'Times New Roman', serif;
  color: #d7c397;
  text-shadow: 0 0 32px #d7b15c13;
}
html[data-design-style="a"] #idleCopy .quiet-line {
  width: 1px;
  height: calc(var(--preview-line-size, 23px) * .72);
  background: linear-gradient(#c5aa69a6, transparent);
}

/* B: restrained contemporary type and a single-line headline. */
html[data-design-style="b"] #idleCopy { gap: clamp(8px, .8vw, 15px); }
html[data-design-style="b"] #idleCopy .eyebrow { color: #a59c83; letter-spacing: .24em; }
html[data-design-style="b"] #idleCopy h1 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(var(--preview-title-size, 34px) * 1.25);
  font-weight: 300;
  letter-spacing: -.045em;
  color: #e8e6de;
  text-shadow: none;
}
html[data-design-style="b"] #idleHint { color: #96958e; letter-spacing: .025em; }
html[data-design-style="b"] #idleCopy .quiet-line { display: none; }

/* C: editorial typography within the existing preview area. */
html[data-design-style="c"] #idleCopy {
  align-items: flex-start;
  text-align: left;
  padding-right: 4%;
  padding-left: 13%;
  gap: clamp(7px, .65vw, 12px);
}
html[data-design-style="c"] #idleCopy .eyebrow { font-size: clamp(7px, .49vw, 10px); letter-spacing: .25em; }
html[data-design-style="c"] #idleCopy h1 {
  font-family: Palatino, 'Palatino Linotype', 'Book Antiqua', Georgia, serif;
  font-size: calc(var(--preview-title-size, 34px) * 1.13);
  line-height: 1.08;
  letter-spacing: -.025em;
  color: #e0cfad;
  text-shadow: none;
}
html[data-design-style="c"] #idleCopy h1 .hero-line + .hero-line {
  font-size: .91em;
  font-style: italic;
  color: #bfa46f;
}
html[data-design-style="c"] #idleHint { color: #a59c8c; letter-spacing: .025em; }
html[data-design-style="c"] #idleCopy .quiet-line {
  width: 36px;
  height: 1px;
  background: #bfa46f8c;
  order: -1;
  margin-bottom: 2px;
}

/* D: quiet cosmic lettering, with a small cyan horizon. */
html[data-design-style="d"] #idleCopy { gap: clamp(8px, .75vw, 14px); }
html[data-design-style="d"] #idleCopy .eyebrow { color: #87b9bf; font-size: clamp(7px, .49vw, 10px); letter-spacing: .38em; }
html[data-design-style="d"] #idleCopy h1 {
  font-family: 'Segoe UI Light', 'Segoe UI', Arial, sans-serif;
  font-size: calc(var(--preview-title-size, 34px) * .98);
  line-height: 1.32;
  font-weight: 300;
  letter-spacing: .19em;
  color: #d7d4bd;
  text-shadow: 0 0 22px #80c8d112;
}
html[data-design-style="d"] #idleHint { color: #94a8a7; font-size: clamp(9px, .65vw, 12px); letter-spacing: .09em; }
html[data-design-style="d"] #idleCopy .quiet-line {
  width: 72px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #72c6d2a6, transparent);
  box-shadow: 0 0 7px #72c6d214;
}

@media (max-width: 650px) and (orientation: portrait) {
  html[data-design-style] #idleCopy { gap: 5px; padding: 0 5%; }
  html[data-design-style] #idleCopy .eyebrow { font-size: 7px; line-height: 1.3; letter-spacing: .23em; }
  html[data-design-style] #idleCopy h1 { font-size: 20px; line-height: 1.12; }
  html[data-design-style] #idleHint { margin-top: 1px; font-size: 9px; line-height: 1.4; letter-spacing: .01em; }
  html[data-design-style] #idleCopy .quiet-line { display: none; }
  html[data-design-style="b"] #idleCopy { gap: 9px; }
  html[data-design-style="b"] #idleCopy h1 { font-size: clamp(24px, 6.4vw, 33px); letter-spacing: -.045em; }
  html[data-design-style="c"] #idleCopy { align-items: flex-start; padding-left: 11%; padding-right: 5%; }
  html[data-design-style="c"] #idleCopy h1 { font-size: 21px; line-height: 1.08; letter-spacing: -.03em; }
  html[data-design-style="d"] #idleCopy { gap: 6px; }
  html[data-design-style="d"] #idleCopy h1 { font-size: 18px; line-height: 1.25; letter-spacing: .14em; }
  html[data-design-style="d"] #idleCopy .eyebrow { letter-spacing: .28em; }
  html[data-design-style="d"] #idleHint { font-size: 8px; }
}

/* Preserve legibility in a short landscape preview or a 320 px portrait. */
html[data-design-style] #idleCopy[data-copy-density="compact"] { gap: 4px; }
html[data-design-style] #idleCopy[data-copy-density="compact"] .eyebrow { font-size: 6px; line-height: 1.4; }
html[data-design-style] #idleCopy[data-copy-density="compact"] h1 { font-size: 18px; line-height: 1.12; }
html[data-design-style="b"] #idleCopy[data-copy-density="compact"] h1 { font-size: 24px; }
html[data-design-style="d"] #idleCopy[data-copy-density="compact"] h1 { font-size: 16px; line-height: 1.25; }
html[data-design-style] #idleCopy[data-copy-density="compact"] #idleHint { font-size: 8px; line-height: 1.35; margin-top: 0; }
html[data-design-style] #idleCopy[data-copy-density="compact"] .quiet-line { display: none; }