.voices-page { --voice-ink:#103e7b; --voice-teal:#1bb8c2; --voice-coral:#ed7548; --voice-gold:#f2b746; color:#18222d; background:#f8f6f1; padding:clamp(2.2rem,5vw,5rem); font-family:"Carlito",Arial,sans-serif; }
.voices-hero { max-width:1160px; margin:0 auto clamp(2rem,5vw,4.5rem); border-bottom:3px solid var(--voice-ink); padding-bottom:clamp(1.5rem,3vw,2.5rem); }
.voices-kicker { margin:0 0 1rem; color:var(--voice-teal); font:700 .9rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.18em; text-transform:uppercase; }
.voices-hero > div { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr); align-items:end; gap:clamp(2rem,5vw,5rem); }
.voices-hero h1 { margin:0; color:var(--voice-ink); font:800 clamp(4rem,11vw,9rem)/.82 "Arial Narrow",Impact,sans-serif; letter-spacing:-.055em; text-transform:uppercase; }
.voices-hero > div > p { margin:0 0 .45rem; border-left:6px solid var(--voice-gold); padding:.5rem 0 .5rem 1.35rem; color:#64707b; font:italic 1.35rem/1.48 Georgia,serif; }
.voice-index { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem; max-width:1160px; margin:0 auto clamp(2.5rem,6vw,5.5rem); }
.voice-index button { display:flex; align-items:center; gap:.75rem; min-height:3.35rem; width:100%; border:1px solid #a9c9cc; padding:.65rem .85rem; color:var(--voice-ink); background:#fff; font:700 1rem/1.2 "Carlito",Arial,sans-serif; text-align:left; cursor:pointer; }
.voice-index button:hover,.voice-index button:focus-visible { border-color:var(--voice-teal); box-shadow:0 7px 22px rgba(16,62,123,.11); }
.voice-index span,.voice-number { color:var(--voice-coral); font:700 .8rem/1 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.1em; }
.foreword-list { max-width:1160px; margin:0 auto; }
.foreword-entry { display:grid; grid-template-columns:minmax(14rem,17rem) minmax(0,1fr); gap:clamp(2rem,5vw,5rem); border-top:1px solid #a9c9cc; padding:clamp(2.5rem,6vw,5.5rem) 0; scroll-margin-top:5rem; }
.foreword-entry:first-child { border-top:0; }
.foreword-entry aside { position:relative; align-self:start; text-align:center; }
.voice-number { display:block; margin-bottom:.9rem; }
.voice-portrait { display:block; width:clamp(10rem,18vw,13.75rem); aspect-ratio:1; margin:0 auto 1.2rem; border:7px solid #e5f1ee; border-radius:50%; object-fit:cover; box-shadow:0 14px 34px rgba(16,62,123,.13); }
.foreword-entry h2 { margin:0; color:var(--voice-ink); font:700 1.15rem/1.3 "Carlito",Arial,sans-serif; }
.voice-copy { max-width:47rem; }
.voice-copy p { margin:0 0 1.25em; font-size:1.15rem; line-height:1.68; }
.voice-copy p:first-child::first-letter { float:left; margin:.08em .1em 0 0; color:var(--voice-coral); font:700 3.5em/.72 Georgia,serif; }
.voice-copy .voice-attribution { margin-top:2rem; border-left:4px solid var(--voice-gold); padding:.75rem 0 .75rem 1rem; color:var(--voice-ink); font-weight:700; line-height:1.45; }
.reflections-hero h1 { font-size:clamp(3.3rem,8vw,7rem); line-height:.9; }
.reflection-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.35rem; max-width:1160px; margin:0 auto; }
.reflection-card { position:relative; overflow:hidden; border:1px solid #b8d3d3; border-top:8px solid var(--voice-teal); padding:clamp(1.5rem,3vw,2.25rem); background:#fff; box-shadow:0 10px 30px rgba(16,62,123,.07); }
.reflection-card:nth-child(3n+2) { border-top-color:var(--voice-coral); }
.reflection-card:nth-child(3n) { border-top-color:var(--voice-gold); }
.reflection-card-wide { grid-column:1/-1; }
.reflection-card header { display:flex; align-items:baseline; gap:1rem; margin-bottom:1.2rem; }
.reflection-card header span { color:var(--voice-coral); font:700 .8rem/1 ui-monospace,SFMono-Regular,Menlo,monospace; }
.reflection-card h2 { margin:0; color:var(--voice-ink); font:800 1.55rem/1.1 "Arial Narrow","Carlito",sans-serif; }
.reflection-card .voice-copy { max-width:none; }
.reflection-card .voice-copy p { font-size:1.08rem; }
.reflection-card .voice-copy p:first-child::first-letter { float:none; margin:0; color:inherit; font:inherit; }
@media (max-width:800px) { .voices-page{padding:1.5rem 1rem 3rem}.voices-hero>div,.foreword-entry{grid-template-columns:1fr}.voices-hero>div{gap:1.5rem}.voices-hero h1{font-size:clamp(3.5rem,20vw,6rem)}.reflections-hero h1{font-size:clamp(2.7rem,14vw,4.8rem)}.voice-index{grid-template-columns:1fr}.foreword-entry{gap:1.5rem}.foreword-entry aside{text-align:left}.voice-portrait{margin-left:0}.reflection-grid{grid-template-columns:1fr}.reflection-card-wide{grid-column:auto} }
@media print { .voices-page{padding:.4in;background:#fff}.voice-index{display:none}.foreword-entry,.reflection-card{break-inside:avoid;box-shadow:none}.reflection-grid{display:block}.reflection-card{margin-bottom:.2in} }