:root{color-scheme:light;font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#283741;background:#e9e8df;line-height:1.75}
a{color:#14546b;text-underline-offset:3px}a:focus-visible,button:focus-visible{outline:3px solid #bd8441;outline-offset:3px}
.frame{width:min(1080px,calc(100% - 32px));margin:34px auto;background:#fff8e8;border-radius:19px;border:1px solid #d4c09d;box-shadow:0 25px 65px #24384618;overflow:hidden}
.hero{padding:32px clamp(22px,5vw,68px);background:linear-gradient(112deg,#223b48,#3b6268);color:#fff}
.hero-copy h1{margin:4px 0 15px;font:760 clamp(1.55rem,3vw,2.5rem)/1.22 system-ui;color:#fff}
.hero-copy p{max-width:850px;color:#fcf1de}
.hero img{display:block;width:min(100%,460px);height:auto;max-height:320px;object-fit:cover;border-radius:15px}
.roles{padding:22px clamp(22px,5vw,65px);background:#f1e4cd;border-bottom:1px solid #d5be9b}
.roles h2{font-size:1.25rem;margin:0 0 12px;color:#523d21}
.role-list{display:flex;flex-wrap:wrap;gap:9px}
.role-list a{padding:9px 13px;border-radius:8px;background:#fff8eb;border:1px solid #cbaa78;text-decoration:none;font-weight:650;color:#35434e}
.reading{padding:28px clamp(22px,5vw,68px) 44px}.reading>section{margin:22px 0;padding:16px 22px;background:#fffdf8;border:1px solid #e1d4bb;border-radius:12px}
.reading h2{margin:0 0 11px;font-size:1.35rem;color:#304d5a}.reading h3{color:#345868}
.reading .promo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.reading .promo article{overflow:hidden;background:#fff;border:1px solid #dfcbb0;border-radius:12px}
.reading .promo img{display:block;max-width:100%;width:100%;max-height:230px;object-fit:cover}
.reading .promo .inside{padding:14px 19px}.reading .promo p{margin:.4rem 0}
.reading .feedback{background:#f5e9d6}.reading .feedback button{background:#fff8ec;border:1px solid #b89d6e;padding:10px 14px;border-radius:9px;margin:4px;color:#3b4346;font-weight:650;cursor:pointer}
.reading .feedback button[aria-pressed="true"]{outline:3px solid #cc9a4d}.reading .feedback button:disabled{opacity:.55;cursor:default}
footer{padding:18px 30px;background:#2a4651;color:#fbefda;text-align:center}
[dir=rtl]{direction:rtl}
@media(max-width:760px){.frame{width:calc(100% - 16px);margin:8px auto}.reading{padding:12px 13px 30px}.reading>section{padding:15px}.hero{padding:25px 17px}.roles{padding:17px 15px}.reading .promo{grid-template-columns:1fr}}

/* 2026-10-14 verified mobile contrast: hero CTA on the dark background */
.hero a,.hero a:visited{color:#ffe8b0;text-decoration:underline;text-underline-offset:3px}
.hero a:hover{color:#fff4d8}