/* Sequoia /learn guides: one small stylesheet, no JS, no web fonts. */
:root { --paper:#F6F6F1; --ink:#0E1A14; --muted:#5A665F; --line:#DFE2D8; --g:#1F5B43; --soft:#ECEDE6; }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--paper); color:var(--ink); font:400 18px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
.wrap { max-width:680px; margin:0 auto; padding:20px 20px 56px; }
a { color:var(--g); text-underline-offset:3px; }
a:focus-visible { outline:2px solid var(--g); outline-offset:2px; border-radius:3px; }
.top { display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding-bottom:14px; margin-bottom:28px; border-bottom:1px solid var(--line); font-size:15px; }
.top a { text-decoration:none; }
.top .home { font-weight:700; color:var(--ink); letter-spacing:.01em; }
.crumbs { font-size:14px; color:var(--muted); margin:0 0 14px; }
.crumbs a { color:var(--muted); }
h1 { font-size:clamp(28px,6.4vw,38px); line-height:1.15; letter-spacing:-.01em; margin:0 0 14px; font-weight:800; text-wrap:balance; }
h2 { font-size:24px; line-height:1.25; margin:44px 0 12px; font-weight:700; text-wrap:balance; }
h3 { font-size:19px; line-height:1.3; margin:30px 0 8px; font-weight:700; }
p, ul, ol { margin:0 0 16px; }
ul, ol { padding-left:24px; }
li { margin:0 0 10px; }
li > ul { margin-top:10px; }
.meta { color:var(--muted); font-size:14.5px; line-height:1.5; margin:0 0 26px; }
.lede { font-size:20px; line-height:1.55; }
.ui { font-weight:600; }
.steps { list-style:none; counter-reset:s; padding:0; }
.steps > li { counter-increment:s; position:relative; padding:0 0 6px 46px; margin:0 0 22px; }
.steps > li::before { content:counter(s); position:absolute; left:0; top:1px; width:30px; height:30px; border-radius:50%; background:var(--g); color:var(--paper); font:700 15px/30px -apple-system,system-ui,sans-serif; text-align:center; }
.steps.go7 { counter-reset:s 6; }
figure { margin:14px 0 18px; }
figure img { display:block; width:100%; max-width:270px; height:auto; border:1px solid var(--line); border-radius:22px; background:#fff; }
figcaption { color:var(--muted); font-size:14px; line-height:1.45; margin-top:8px; max-width:420px; }
.box { background:var(--soft); border-radius:16px; padding:18px 20px 6px; margin:32px 0; }
.box h2, .box h3 { margin-top:0; }
.limits { border-left:4px solid var(--g); border-radius:4px 16px 16px 4px; }
.tag { display:inline-block; font-size:13px; font-weight:600; line-height:1.3; padding:3px 10px; border-radius:99px; background:var(--soft); color:var(--muted); margin:0 0 10px; }
.tag.ok { background:var(--g); color:var(--paper); }
.offer { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:16px 0; margin:28px 0; }
.offer p { margin:0; }
.sources { font-size:15px; color:var(--muted); }
.sources a { color:var(--muted); overflow-wrap:anywhere; }
.next { list-style:none; padding:0; }
.next li { border-top:1px solid var(--line); padding:14px 0; margin:0; }
.next a { font-weight:700; text-decoration:none; }
.next p { margin:4px 0 0; color:var(--muted); font-size:15.5px; }
footer { margin-top:52px; padding-top:16px; border-top:1px solid var(--line); color:var(--muted); font-size:14px; line-height:1.6; }
footer a { color:var(--muted); }
footer p { margin:0 0 8px; }
@media (max-width:420px) { body { font-size:17px; } .steps > li { padding-left:40px; } figure img { max-width:240px; } }

/* ---- the homepage's look (VP Panel, 14.11): same paper, rounded card blocks, green accents, deep-green offer banner.
   Overrides only; the guides' markup and wording stay as written. ---- */
.top { align-items:center; border-bottom:0; padding-bottom:0; margin-bottom:34px; }
.top .home { display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:17px; letter-spacing:-.01em; color:var(--ink); }
.top .home::before { content:""; width:22px; height:22px; background:url(/assets/icons/app-icon-tree-green.svg) center/contain no-repeat; border-radius:6px; }
.top a:last-child { padding:9px 15px; border-radius:20px; background:var(--soft); color:var(--ink); font-weight:600; font-size:14px; }
.crumbs a { color:var(--g); text-decoration:none; }
h1 { font-weight:900; letter-spacing:-.03em; line-height:1.08; }
h2 { font-weight:800; letter-spacing:-.02em; }
.box { border-radius:24px; padding:20px 22px 8px; }
.limits { border-left:0; border-radius:24px; box-shadow:inset 4px 0 0 var(--g); }
.steps > li::before { border-radius:10px; }
figure img { border-radius:26px; box-shadow:0 14px 30px -20px rgba(14,26,20,.45); }
.offer { border:0; border-radius:28px; padding:22px 22px; color:#F6F6F1; background:radial-gradient(120% 90% at 85% 0%, #24493C, #0B2E22); box-shadow:0 18px 36px -22px rgba(14,26,20,.6); }
.offer a { color:#BFE3CE; font-weight:700; }
.next { display:grid; gap:10px; }
.next li { border-top:0; background:var(--soft); border-radius:22px; padding:16px 20px; }
.next a { color:var(--ink); } .next a::after { content:" ›"; color:var(--g); }
.tag { border-radius:10px; }
