/* Spectrum — full-bleed colour bands mixed from the palette. */
:root { --t-font-display: "Albert Sans", system-ui, sans-serif; --t-font-body: "Albert Sans", system-ui, sans-serif; --t-max: 1080px; --t-radius: 22px; --t-radius-sm: 12px; }

/* hero: six paint-swatch bands stacked behind (the Spectrum signature), the identity on a solid accent panel for contrast */
.t-hero--bands { background: linear-gradient(to bottom, color-mix(in srgb, var(--t-accent) 10%, var(--t-bg)) 0 16.6%, color-mix(in srgb, var(--t-accent2) 25%, var(--t-bg)) 16.6% 33.3%, color-mix(in srgb, var(--t-accent) 25%, var(--t-bg)) 33.3% 50%, color-mix(in srgb, var(--t-accent2) 45%, var(--t-bg)) 50% 66.6%, color-mix(in srgb, var(--t-accent) 45%, var(--t-bg)) 66.6% 83.3%, color-mix(in srgb, var(--t-accent2) 70%, var(--t-accent)) 83.3% 100%); padding-block: clamp(32px, 6vw, 72px); }
.t-hero--bands .t-hero__inner { background: var(--t-accent); color: var(--t-on-accent); border-radius: var(--t-radius); padding: clamp(24px, 4vw, 44px); gap: 24px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.5); position: relative; }
.t-hero--bands .t-hero__inner::before { content: ""; position: absolute; top: -14px; inset-inline-start: 24px; height: 28px; width: 180px; border-radius: 6px; background: linear-gradient(90deg, var(--t-bg) 0 16.6%, color-mix(in srgb, var(--t-accent2) 40%, var(--t-bg)) 16.6% 33.3%, color-mix(in srgb, var(--t-accent) 40%, var(--t-bg)) 33.3% 50%, var(--t-accent2) 50% 66.6%, color-mix(in srgb, var(--t-accent) 70%, var(--t-accent2)) 66.6% 83.3%, var(--t-on-accent) 83.3% 100%); box-shadow: 0 6px 16px -8px rgba(0,0,0,.5); }
.t-hero--bands .t-eyebrow, .t-hero--bands .t-tagline, .t-hero--bands .t-meta, .t-hero--bands .t-stats span { color: var(--t-on-accent); opacity: .85; }
.t-hero--bands .t-stats strong { color: var(--t-on-accent); font-weight: 800; }
.t-hero--bands .t-photo { width: clamp(112px, 16vw, 160px); border-radius: var(--t-radius); box-shadow: 0 0 0 5px color-mix(in srgb, var(--t-on-accent) 35%, transparent); }
.t-hero--bands .t-name { font-weight: 800; font-size: clamp(2.4rem, 6vw, 4rem); letter-spacing: -0.03em; }
.t-hero--bands .btn-primary { --bs-btn-bg: var(--t-on-accent); --bs-btn-color: var(--t-accent); --bs-btn-border-color: var(--t-on-accent); --bs-btn-hover-bg: var(--t-on-accent); --bs-btn-hover-color: var(--t-accent); --bs-btn-hover-border-color: var(--t-on-accent); --bs-btn-active-bg: var(--t-on-accent); --bs-btn-active-color: var(--t-accent); }
.t-hero--bands .btn-outline-primary { --bs-btn-color: var(--t-on-accent); --bs-btn-border-color: var(--t-on-accent); --bs-btn-hover-bg: rgba(255,255,255,.14); --bs-btn-hover-color: var(--t-on-accent); --bs-btn-hover-border-color: var(--t-on-accent); }
.t-hero--bands .t-link { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.35); color: var(--t-on-accent); }
.t-hero--bands .t-link:hover { color: var(--t-on-accent); border-color: var(--t-on-accent); }
.t-hero--bands .t-link__handle { color: var(--t-on-accent); opacity: .8; }
.btn { --bs-btn-font-weight: 800; }

/* bands: each section is full-bleed with its own tint; content on a rounded container */
.t-layout { width: 100%; padding-block: 0; }
.t-main { gap: 0; }
.t-section { padding: clamp(32px, 5vw, 64px) var(--t-gutter); background: var(--band, var(--t-bg)); }
.t-section > * { width: min(100%, var(--t-max)); margin-inline: auto; }
.t-section:nth-child(6n+1) { --band: color-mix(in srgb, var(--t-accent) 10%, var(--t-bg)); }
.t-section:nth-child(6n+2) { --band: color-mix(in srgb, var(--t-accent2) 16%, var(--t-bg)); }
.t-section:nth-child(6n+3) { --band: var(--t-surface); }
.t-section:nth-child(6n+4) { --band: color-mix(in srgb, var(--t-accent) 18%, var(--t-bg)); }
.t-section:nth-child(6n+5) { --band: color-mix(in srgb, var(--t-accent2) 9%, var(--t-bg)); }
.t-section:nth-child(6n) { --band: var(--t-surface2); }
.t-section__title { font-weight: 800; letter-spacing: -0.02em; font-size: clamp(1.5rem, 2.8vw, 2.2rem); display: flex; align-items: center; gap: 12px; }
.t-section__title::before { content: ""; width: 18px; height: 18px; border-radius: 50%; background: var(--t-accent); flex: none; }
.t-section:nth-child(even) .t-section__title::before { background: var(--t-accent2); }
.t-section--summary .t-section__title { display: none; }
.t-summary { font-size: clamp(1.3rem, 2.6vw, 1.9rem); font-weight: 500; max-width: 40ch; line-height: 1.3; }
.card { border: 0; background: var(--t-surface); box-shadow: 0 12px 30px -24px rgba(0,0,0,.35); }
.t-timeline__body { background: var(--t-surface); border-radius: var(--t-radius-sm); padding: 14px 16px; }
.t-chip { background: var(--t-surface); border: 0; font-weight: 600; padding-inline-start: 8px; }
.t-chip::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--t-accent); }
.t-chips li:nth-child(3n) .t-chip::before, .t-chips li:nth-child(3n)::before { background: var(--t-accent2); }
.t-quote { background: var(--t-surface); border: 0; }
.t-link { border: 0; background: var(--t-surface); }
.t-footer { border: 0; }
