/* Elendil — shared site styles (homepage + subpages). Monochrome, per DESIGN.md.
   Hand-written CSS because this repo has no Tailwind build step; values are
   literal DESIGN.md tokens. Headings (h2/h3) inherit Newsreader from the base layer. */
:root{
  --el-ink:#1a1b1e;--el-porcelain:#f7f7f4;--el-near-black:#1f2023;
  --el-line:rgba(247,247,244,0.12);--el-line-faint:rgba(247,247,244,0.07);
  --el-t100:#f7f7f4;--el-t72:rgba(247,247,244,0.72);--el-t55:rgba(247,247,244,0.55);--el-t45:rgba(247,247,244,0.45);
  --el-sans:"Inter",ui-sans-serif,system-ui,sans-serif;--el-serif:"Newsreader",Georgia,"Times New Roman",serif;
}
.el-wrap{margin-inline:auto;width:100%;max-width:80rem;padding-inline:1.25rem}
@media(min-width:640px){.el-wrap{padding-inline:2rem}}
@media(min-width:1024px){.el-wrap{padding-inline:2.5rem}}
@media(min-width:1536px){.el-wrap{max-width:88rem}}
.el-section{padding-block:clamp(4.5rem,11vh,8rem);border-top:1px solid var(--el-line-faint);position:relative;z-index:1;background:var(--el-ink);scroll-margin-top:4rem}
/* floating jump-nav — persistent, top-right, hidden on mobile */
.el-nav{position:fixed;top:1.15rem;right:1.15rem;z-index:50;display:flex;align-items:center;gap:1.5rem;padding:.65rem 1.15rem;background:rgba(26,27,30,0.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--el-line-faint)}
.el-nav a{font-family:var(--el-sans);font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--el-t55);text-decoration:none;transition:color .15s;white-space:nowrap}
.el-nav a:hover{color:var(--el-t100)}
@media(max-width:768px){.el-nav{display:none}}
/* light sections — dark hero -> light body -> dark CTA. Re-scopes the --el-* tokens to the DESIGN.md light theme. */
.el-section.is-light{--el-ink:#f7f7f4;--el-line:#d8d7d2;--el-line-faint:#e8e7e2;--el-t100:#1f2023;--el-t72:rgba(31,32,35,0.78);--el-t55:rgba(31,32,35,0.6);--el-t45:rgba(31,32,35,0.5)}
.el-section.is-light .el-strip span.is-loop{background:#1a1b1e;color:#f7f7f4}
.el-eyebrow{font-size:.75rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--el-t55);margin:0 0 1.75rem}
.el-h2{font-family:var(--el-serif);font-size:clamp(1.9rem,3.6vw,2.75rem);line-height:1.1;letter-spacing:-.015em;font-weight:400;color:var(--el-t100);margin:0;max-width:26ch}
.el-h2.is-wide{max-width:32ch}
.el-h2 em{font-style:italic}
.el-lead{font-size:1.0625rem;line-height:1.7;color:var(--el-t72);margin:1.5rem 0 0;max-width:46rem}
/* hairline-divided card grids (1px gap reveals the line color behind ink cells) */
.el-grid{margin:2.75rem 0 0;display:grid;gap:1px;background:var(--el-line);border:1px solid var(--el-line)}
.el-grid-2{grid-template-columns:repeat(2,1fr)}
.el-grid-3{grid-template-columns:repeat(3,1fr)}
.el-cell{background:var(--el-ink);padding:1.75rem 1.5rem}
.el-cell.lg{padding:2rem 1.75rem}
.el-idx{font-family:var(--el-sans);font-size:.6875rem;letter-spacing:.16em;color:var(--el-t45);font-variant-numeric:tabular-nums}
.el-card-title{font-family:var(--el-sans);font-size:1.0625rem;font-weight:500;color:var(--el-t100);letter-spacing:normal;line-height:1.3;margin:.85rem 0 .55rem}
.el-cell p{font-size:.9375rem;line-height:1.55;color:var(--el-t72);margin:0}
/* learning-loop strip — quiet visual cue echoing the data flow */
.el-strip{margin:2.5rem 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--el-line);border:1px solid var(--el-line)}
.el-strip span{background:var(--el-ink);padding:1.1rem 1rem;font-family:var(--el-sans);font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--el-t72);text-align:center}
.el-strip span.is-loop{background:var(--el-porcelain);color:var(--el-near-black);font-weight:500}
/* founders */
.el-founder-top{display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap}
.el-founder-name{font-family:var(--el-serif);font-size:1.5rem;line-height:1.1;color:var(--el-t100)}
.el-founder-role{font-family:var(--el-sans);font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--el-t55);font-weight:500}
.el-founder-cred{font-size:.9375rem;line-height:1.55;color:var(--el-t72);margin:.85rem 0 0}
.el-founder-link{display:inline-block;margin-top:1.1rem;font-family:var(--el-sans);font-size:.8125rem;letter-spacing:.04em;color:var(--el-t55);text-decoration:none;transition:color .15s}
.el-founder-link:hover{color:var(--el-t100)}
/* testimonials */
.el-quote{font-family:var(--el-serif);font-size:1.0625rem;line-height:1.5;color:var(--el-t100);margin:0}
.el-attr{margin:1.35rem 0 0}
.el-attr .role{display:block;font-family:var(--el-sans);font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--el-t100);font-weight:500}
.el-attr .firm{display:block;font-family:var(--el-sans);font-size:.8125rem;color:var(--el-t55);margin-top:.3rem}
/* our story (long-form editorial) */
.el-story{max-width:42rem;margin:2.75rem 0 0}
.el-story+.el-story{margin-top:3.5rem;padding-top:3.5rem;border-top:1px solid var(--el-line)}
.el-story-name{font-family:var(--el-serif);font-size:1.5rem;line-height:1.15;color:var(--el-t100);margin:0 0 .25rem}
.el-story-role{font-family:var(--el-sans);font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--el-t55);font-weight:500;margin:0 0 1.85rem}
.el-story p{font-size:1.0625rem;line-height:1.72;color:var(--el-t72);margin:0 0 1.15rem}
.el-story p.em{color:var(--el-t100)}
.el-story p.muted{color:var(--el-t55);font-style:italic}
.el-fig{margin:2.5rem 0;border:1px solid var(--el-line)}
.el-fig img{display:block;width:100%;height:auto}
.el-fig.on-dark{background:#0b0b0e}
.el-fig.on-light{background:#fff}
/* page header (subpages) */
.el-pagehead{background:var(--el-ink);padding-block:1.75rem}
/* cta + buttons */
.el-cta-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.75rem;margin-top:2.5rem}
.el-btn{display:inline-flex;align-items:center;height:2.75rem;padding:0 1.75rem;background:var(--el-porcelain);color:var(--el-near-black);font-family:var(--el-sans);font-size:.75rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;transition:opacity .15s}
.el-btn:hover{opacity:.85}
.el-link{font-family:var(--el-sans);font-size:.875rem;letter-spacing:.04em;color:var(--el-t55);text-decoration:none;text-transform:uppercase;transition:color .15s}
.el-link:hover{color:var(--el-t100)}
/* footer */
.el-footer{background:var(--el-ink);border-top:1px solid var(--el-line);padding-block:2.75rem}
.el-footer-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem 1.5rem}
.el-footer-row+.el-footer-row{margin-top:1rem}
.el-footer-brand{font-family:var(--el-sans);font-size:.875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--el-t72);font-weight:500}
.el-footer-meta{font-family:var(--el-sans);font-size:.8125rem;letter-spacing:.02em;color:var(--el-t45)}
/* responsive */
@media(max-width:720px){.el-grid-2{grid-template-columns:1fr}.el-grid-3{grid-template-columns:1fr}.el-strip{grid-template-columns:1fr 1fr}}