/* WeatherPred case study; typography and colors inherit the personal site. */
.project-links { display:flex; flex-wrap:wrap; gap:12px 22px; margin:24px 0 0; font-family:var(--mono); font-size:12px; }
.project-links a { text-underline-offset:5px; }
.project-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; border-top:1px solid var(--ink); border-bottom:1px solid var(--rule); padding:25px 0; margin:0 0 28px; }
.project-summary strong { display:block; font-family:var(--display); font-size:clamp(30px,4vw,48px); line-height:1.1; letter-spacing:-.04em; }
.project-summary span { display:block; font-family:var(--mono); font-size:10.5px; line-height:1.7; color:var(--ink-soft); margin-top:8px; max-width:26ch; }
.project-note { border-left:3px solid var(--accent); background:var(--wash); padding:18px 20px; margin:8px 0 24px; }
.project-note p:last-child { margin-bottom:0; }
.pipeline { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--rule); border:1px solid var(--rule); margin:12px 0 26px; }
.pipeline div { background:var(--paper); padding:20px; font-size:14px; }
.pipeline small { display:block; font-family:var(--mono); color:var(--accent-text); margin-bottom:8px; }
.calculator { border:1px solid var(--rule); padding:24px; margin:10px 0 26px; }
.calculator label { display:block; margin:0 0 22px; font-size:15px; }
.calculator label span { float:right; font-family:var(--mono); }
.calculator input { display:block; width:100%; margin:14px 0 0; accent-color:var(--accent); }
.calc-results { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; border-top:1px solid var(--rule); padding-top:20px; }
.calc-results strong { display:block; font:600 26px var(--display); }
.calc-results small { display:block; color:var(--ink-soft); font-family:var(--mono); font-size:10px; margin-top:7px; }
.formula { background:var(--wash); border-left:2px solid var(--accent); padding:16px 20px; overflow-x:auto; margin:16px 0 24px; font-family:var(--mono); font-size:14px; }
.article-body { max-width:920px; margin:0 auto; padding:35px 0 70px; }
.article-body h2 { font-family:var(--display); font-size:25px; line-height:1.2; margin:55px 0 20px; border-top:1px solid var(--rule); padding-top:25px; }
.article-body h3 { font-family:var(--display); font-size:19px; margin-top:30px; }
.article-body p,.article-body li { max-width:76ch; font-size:16.5px; line-height:1.8; }
.article-body a { text-underline-offset:4px; overflow-wrap:anywhere; }
.article-body code { font: .85em var(--mono); background:var(--wash); padding:2px 4px; overflow-wrap:anywhere; }
.article-body table { border-collapse:collapse; width:100%; font-size:14px; margin:22px 0; }
.article-body th,.article-body td { text-align:left; border-bottom:1px solid var(--rule); padding:12px 14px 12px 0; vertical-align:top; }
.article-body th { font-family:var(--mono); font-size:12px; }
.math-block { display:block; overflow-x:auto; background:var(--wash); border-left:2px solid var(--accent); padding:18px 20px; margin:24px 0; }
.math-block math { min-width:max-content; margin:0; }
.article-body math { font-size:1.06em; }
.contents { columns:2; font-family:var(--mono); font-size:12px; padding:22px 0 0; }
.contents a { display:block; break-inside:avoid; margin:0 0 12px; line-height:1.6; }
@media(max-width:700px){.project-summary{gap:18px;grid-template-columns:1fr 1fr}.project-summary>div:last-child{grid-column:span 2}.pipeline{grid-template-columns:1fr 1fr}.calc-results{grid-template-columns:1fr}.calculator{padding:18px}.contents{columns:1}.article-body table{font-size:12px}.article-body th,.article-body td{padding-right:8px}.math-block{padding:16px 12px}.project-links{gap:12px 16px}.article-body{padding-top:18px}}