/* Design tokens live in style.css (global). Homepage section styling only here. */

/* --- shared section scaffolding --- */
.alted-section { padding: 3.5rem 0; }
.alted-container { max-width: var(--alted-max); margin: 0 auto; padding: 0 1.25rem; }
.alted-kicker { text-transform: uppercase; letter-spacing: .12em; font-weight: 600; color: var(--alted-brand); font-size: .85rem; margin: 0 0 .75rem; }
.alted-btn { display: inline-block; background: var(--alted-brand); color: #fff; padding: .7rem 1.4rem; border-radius: 999px; text-decoration: none; font-weight: 600; }
.alted-btn:hover { background: var(--alted-brand-dark); color: #fff; }
.alted-btn-secondary { background: transparent; color: var(--alted-brand); border: 2px solid var(--alted-brand); }
.alted-btn-secondary:hover { background: var(--alted-accent-bg); color: var(--alted-brand-dark); }

/* --- hero --- */
.alted-hero { background: var(--alted-bg-alt); padding: 4.5rem 0 3rem; }
.alted-hero-title { font-size: clamp(1.8rem, 4.5vw, 3rem); line-height: 1.15; max-width: 20ch; margin: 0 0 1rem; }
.alted-hero-text { font-size: 1.15rem; max-width: 55ch; margin: 0 0 1.5rem; }
.alted-hero-cta { display: flex; gap: .75rem; }
.alted-numbers { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1.5rem; list-style: none; margin: 3rem 0 0; padding: 0; }
.alted-numbers li { border-top: 3px solid var(--alted-brand); padding-top: .6rem; }
.alted-num { display: block; font-size: 1.9rem; font-weight: 700; }
.alted-num-label { color: var(--alted-muted); font-size: .95rem; }

/* --- strands --- */
.alted-strands .alted-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.5rem; }
.alted-strand { border: 1px solid #E8E4DE; border-radius: 10px; padding: 1.5rem; background: var(--alted-bg); }
.alted-strand h3 a { color: var(--alted-ink); text-decoration: none; }
.alted-strand h3 a:hover { color: var(--alted-brand); }
.alted-more { font-weight: 600; text-decoration: none; }

/* --- quote --- */
.alted-quote { background: var(--alted-accent-bg); }
.alted-quote blockquote { max-width: 60ch; margin: 0 auto; font-size: clamp(1.15rem, 2.4vw, 1.5rem); line-height: 1.5; }
.alted-quote cite { display: block; margin-top: 1rem; font-size: 1rem; color: var(--alted-muted); font-style: normal; }