/* Home page only (index.html, en/index.html) – builds on site.css tokens */

/* hero copy */
.hero .lead { margin-bottom: 1rem; color: var(--on-dark); }
.hero-text { color: var(--on-dark-muted); max-width: 52ch; margin: 0 0 .85rem; }
.hero .btn-row { margin-top: 1.6rem; }

/* about: the drop-cap paragraph is a single line, keep the cap inside it */
.prose .drop { display: flow-root; }

/* what is hypnosis */
.hypno-section { overflow: hidden; }
.hypno-section .bgimg { position: absolute; inset: 0; opacity: .3; }
.hypno-section .bgimg img { width: 100%; height: 100%; object-fit: cover; }
.hypno-section .wrap { position: relative; }
.hypno-intro { margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.hypno-intro .callout { margin-top: 0; color: #fff; }
.hypno-intro p:not(.lead):not(.callout) { color: var(--on-dark-muted); }
.hypno-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.hcard { background: rgba(23, 11, 33, .62); border: 1px solid rgba(255, 255, 255, .1); border-radius: 24px; padding: clamp(1.6rem, 3vw, 2.4rem); backdrop-filter: blur(6px); }
.hcard-gold { background: linear-gradient(135deg, rgba(226, 178, 92, .22), rgba(91, 42, 134, .35)); border-color: rgba(226, 178, 92, .4); }
.hcard h3 { font-size: clamp(1.6rem, 2.6vw, 2rem); margin-bottom: .9rem; }
.hcard h3 span { display: block; margin-top: .35rem; font-size: clamp(1.02rem, 1.5vw, 1.18rem); font-style: italic; font-weight: 400; color: var(--gold-soft); line-height: 1.35; }
.hcard-lead { font-family: var(--serif); font-size: 1.15rem; line-height: 1.45; color: #fff; padding-bottom: 1rem; border-bottom: 1px solid rgba(226, 178, 92, .3); }
.hcard p:not(.hcard-lead) { color: var(--on-dark-muted); }
.hcard p:last-child { margin-bottom: 0; }

/* how I work: four longer steps in two columns */
.steps-long { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.steps-long h3 { font-size: 1.22rem; }
.steps li p + p { margin-top: .7rem; }

/* support topics */
.support { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.support article { background: var(--card); border: 1px solid var(--line); border-radius: 22px; padding: 1.6rem 1.6rem 1.5rem; }
.support article > h3::before, .support-wide h3::before { content: ""; display: block; width: 34px; height: 3px; border-radius: 3px; background: var(--gold); margin-bottom: .9rem; }
.support p { color: var(--muted); margin: 0; }
.support .support-wide { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 4vw, 3rem); background: var(--plum); border-color: transparent; color: var(--on-dark); padding: clamp(1.6rem, 3.2vw, 2.4rem); }
.support-wide h3, .support-wide h4 { color: #fff; }
.support-wide p { color: var(--on-dark-muted); }
.support-sub { display: grid; gap: 1.2rem; align-content: start; padding-left: clamp(1.5rem, 3vw, 2.5rem); border-left: 1px solid rgba(226, 178, 92, .35); }
.support-sub h4 { font-size: 1.15rem; color: var(--gold-soft); margin-bottom: .35rem; }

/* footer identity line */
.foot-id strong { color: var(--on-dark); }

@media (max-width: 920px) {
  .hero-text { max-width: none; }
  .hypno-cards, .support, .support .support-wide { grid-template-columns: 1fr; }
  .support-sub { padding-left: 0; border-left: 0; padding-top: 1.2rem; border-top: 1px solid rgba(226, 178, 92, .35); }
}