*{box-sizing:border-box}
:root{--ink:#24463f;--muted:#64756d;--paper:#f6f4ed;--green:#d4ddbb;--lilac:#ded8e8;--line:#e5e8de;--white:#fffef9}
html{background:var(--paper)}
body{margin:0;color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55}
a{color:inherit;text-underline-offset:4px}a:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.site-header,header,.site-footer,footer{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:0 clamp(20px,4vw,56px)}
.site-header,header{min-height:76px;background:var(--paper)}
.brand{font-size:clamp(19px,2vw,23px);font-weight:750;letter-spacing:-.04em;text-decoration:none;white-space:nowrap}
.brand span{display:none}
nav,.site-footer div,footer div{display:flex;align-items:center;gap:clamp(14px,2.2vw,30px)}
nav a,.site-footer,footer{font-size:14px;font-weight:600}
nav a,.site-footer a,footer a{text-decoration:none}
nav a:hover,.site-footer a:hover,footer a:hover{text-decoration:underline}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.home-page{min-height:100svh;display:flex;flex-direction:column}
.home-main{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr;flex:1;min-height:620px}.home-promise{grid-column:1/-1;text-align:center;padding:18px 20px;background:var(--paper)}.home-promise h1{font-size:clamp(18px,2.1vw,26px);font-weight:650;letter-spacing:-.035em;margin:0;line-height:1.25}
.home-module{display:grid;place-items:center;min-width:0;padding:40px 24px}
.coordinates{background:var(--green)}.openings{background:var(--lilac)}
.module-inner{text-align:center;max-width:480px}
.module-number{display:block;font-size:12px;font-weight:700;letter-spacing:.18em;margin-bottom:22px;color:#50695c}
.home-module h2{font-size:clamp(44px,6.8vw,100px);font-weight:700;letter-spacing:-.075em;line-height:1.04;margin:0}
.home-module p{font-size:clamp(16px,1.5vw,20px);margin:22px 0 0;color:#4e675a}
.openings .module-number,.openings p{color:#625a70}
.site-footer,footer{min-height:70px;background:var(--paper);border-top:1px solid var(--line);color:var(--muted)}
main:not(.home-main){max-width:880px;margin:0 auto;padding:clamp(48px,7vw,92px) 28px 100px}
.document{max-width:880px}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 18px}
h1{font-size:clamp(46px,6vw,72px);letter-spacing:-.065em;line-height:1.08;margin:0 0 24px}h2{font-size:clamp(23px,3vw,30px);line-height:1.2;letter-spacing:-.04em;margin:42px 0 12px}
p{margin:14px 0}.lead{font-size:clamp(18px,2vw,22px);color:var(--muted);max-width:650px}.meta{font-size:14px;color:var(--muted)}
.document ul{padding-left:24px}.document li{margin:10px 0}
.button{display:inline-block;background:var(--ink);color:var(--white);padding:14px 22px;border-radius:12px;text-decoration:none;font-weight:650;margin:20px 0 0}.button:hover{background:#385c50}
.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:48px 0 20px}.card{padding:28px;background:var(--green);border-radius:18px}.card:nth-child(2){background:var(--lilac)}.card h2{margin:0 0 10px;font-size:23px}.card p{margin-bottom:0}.note{background:var(--lilac);border-radius:16px;padding:18px 24px;margin:24px 0}
@media(max-width:700px){.site-header,header{min-height:68px}.home-main{grid-template-columns:1fr;grid-template-rows:auto 1fr 1fr;min-height:500px}.home-promise{padding:15px 18px}.home-promise h1{font-size:18px}.home-module{min-height:260px}.home-module h2{font-size:clamp(46px,13vw,74px)}.home-module p{margin-top:14px}.module-number{margin-bottom:13px}.site-footer,footer{padding-top:16px;padding-bottom:16px;min-height:64px;flex-wrap:wrap;justify-content:center;text-align:center;gap:8px}.support-grid{grid-template-columns:1fr}main:not(.home-main){padding:42px 22px 80px}}
@media(max-height:690px) and (min-width:701px){.home-main{min-height:500px}}

/* Precise SVG boards for the two home page exercises. */
.home-module{padding:34px clamp(20px,3vw,46px)}
.module-inner{width:100%;max-width:590px;text-align:left}
.home-module h2{font-size:clamp(42px,4.7vw,68px);margin:0 0 clamp(22px,3vw,36px)}
.module-detail{display:grid;grid-template-columns:minmax(0,245px) minmax(0,1fr);align-items:center;gap:clamp(20px,2.3vw,34px)}
.module-description,.home-module p.module-description{font-size:clamp(17px,1.35vw,19px);line-height:1.55;margin:0;max-width:260px;color:var(--ink)}
.openings p.module-description{color:#453f50}
.board-demo{width:100%;max-width:245px;padding:13px 13px 8px;background:rgba(255,255,255,.44);border:1px solid rgba(36,70,63,.12);border-radius:18px;box-shadow:0 14px 28px rgba(37,53,38,.08)}
.demo-prompt{display:block;text-align:center;height:29px;font-size:16px;font-weight:750;letter-spacing:-.02em}
.board-svg{display:block;width:100%;height:auto;overflow:visible}
.board-label{fill:#455c4c;font:700 12px ui-sans-serif,system-ui,sans-serif}
.chess-piece{font:27px "Apple Symbols","Segoe UI Symbol","Arial Unicode MS",serif}
.chess-piece.dark{fill:#253c30;stroke:#f4f1e7;stroke-width:.5px;paint-order:stroke fill}
.chess-piece.light{fill:#fffdf5;stroke:#263e33;stroke-width:1.6px;paint-order:stroke fill}
.coordinate-flash,.coordinate-ring{animation:coordinateCue 3s ease-in-out infinite}
.white-move-square{animation:whiteCue 6s ease-in-out infinite}
.black-move-square{animation:blackCue 6s ease-in-out infinite}
.opening-notation span{color:#776d87}
@keyframes coordinateCue{0%,15%,82%,100%{opacity:0}35%,65%{opacity:1}}
@keyframes whiteCue{0%,10%,48%,100%{opacity:0}20%,40%{opacity:.9}}
@keyframes blackCue{0%,45%,90%,100%{opacity:0}58%,80%{opacity:.9}}
@media(max-width:1050px) and (min-width:701px){.module-detail{grid-template-columns:1fr;justify-items:center}.module-inner{text-align:center}.module-description,.home-module p.module-description{max-width:330px}.home-main{min-height:850px}.home-module{padding:36px 24px}}
@media(max-width:700px){.home-module{padding:32px 24px 40px}.module-inner{text-align:center}.home-module h2{font-size:clamp(45px,12vw,66px);margin-bottom:20px}.module-detail{grid-template-columns:1fr;justify-items:center;gap:18px}.board-demo{max-width:220px}.module-description,.home-module p.module-description{font-size:16px;max-width:335px}.home-main{min-height:0}.home-module{min-height:0}}
@media(prefers-reduced-motion:reduce){.coordinate-flash,.coordinate-ring,.white-move-square,.black-move-square{animation:none}.coordinate-flash,.coordinate-ring{opacity:1}.white-move-square,.black-move-square{opacity:.55}}