/* Tutor Tree — home. */
.hero{padding-block-start:var(--s6)}
.hero__in{display:grid;gap:var(--s6);align-items:center;padding-block-end:var(--s7)}
.hero h1{font-size:var(--t-display);line-height:.96;letter-spacing:-.035em;max-inline-size:11ch;margin-block-end:var(--s5)}
.hero h1 .u{background:linear-gradient(var(--brass),var(--brass)) 0 90%/100% .09em no-repeat}
.hero .lead{margin-block-end:var(--s6)}
.hero__fine{margin-block-start:var(--s5);color:var(--muted);font-size:1rem}
.hero__fig{margin:0}
.hero__fig img{inline-size:100%;aspect-ratio:5/4;object-fit:cover}
.hero__fig figcaption{margin-block-start:var(--s2);font-family:var(--f-serif);font-size:1.0625rem;color:var(--muted);text-align:end}
@media (min-width:1100px){.hero__in{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s8)}.hero__fig{margin-inline-end:calc(var(--gutter) * -1)}.hero{padding-block-start:var(--s7)}}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0;border-block-start:2px solid var(--ink)}
.stats div{display:flex;flex-direction:column-reverse;justify-content:flex-end;padding:var(--s4) var(--s4) var(--s5) 0;border-block-end:1px solid var(--line)}
.stats dd{margin:0;font-family:var(--f-serif);font-weight:500;font-size:clamp(2.5rem,1.8rem + 2.4vw,3.75rem);line-height:1.05;letter-spacing:-.03em;color:var(--brand)}
.stats dt{color:var(--muted);font-size:1rem}
@media (min-width:768px){.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.stats div{border-block-end:0;padding-inline-end:var(--s5)}.stats div+div{padding-inline-start:var(--s5);border-inline-start:1px solid var(--line)}}

.approach__in{display:grid;gap:var(--s7)}
.approach__ill{max-inline-size:520px;margin-block-start:var(--s6)}
.trunk{list-style:none;padding:0;position:relative;display:grid;gap:var(--s3)}
.trunk::before{content:"";position:absolute;inset-block:32px;inset-inline-start:27px;inline-size:2px;background:var(--brand)}
.trunk li{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);gap:var(--s5);align-items:start;padding-block:var(--s3)}
.trunk__n{display:grid;place-items:center;inline-size:56px;block-size:56px;border:2px solid var(--brand);border-radius:50%;background:var(--leaf);font-family:var(--f-serif);font-weight:600;font-size:1.25rem;color:var(--brand);position:relative}
.trunk h3{margin-block:var(--s2) var(--s2);font-size:var(--t-h3)}
.trunk p{color:var(--ink);max-inline-size:52ch}
@media (min-width:900px){.approach__in{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s9);align-items:start}.trunk li{padding-block:var(--s5)}}

.sgrid{display:grid;gap:var(--s5)}
@media (min-width:640px){.sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.sgrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6)}}
.scard{display:grid;grid-template-rows:auto 1fr;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none}
.scard__ph{display:block;border-block-end:3px solid var(--brass)}
.scard__ph img{inline-size:100%;aspect-ratio:4/3;object-fit:cover}
.scard__b{display:grid;align-content:start;gap:var(--s2);padding:var(--s5)}
.scard h3{font-size:var(--t-h3)}
.scard__s{color:var(--muted)}
.scard__w{margin-block-start:var(--s2);font-weight:600;color:var(--brand)}
.scard:hover{border-color:var(--brand);background:#fff}
.scard:hover h3{color:var(--brand);text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:2px}

.afterl__in{display:grid;gap:var(--s7);align-items:center}
.afterl__ph img{inline-size:100%;aspect-ratio:4/5;object-fit:cover;max-block-size:560px}
.afterl__copy .lead{margin-block-start:var(--s4)}
.note{position:relative;margin-block-start:var(--s7);padding:var(--s6) var(--s6) var(--s5);background:#fffefa;border:1px solid var(--line-strong);border-inline-start:6px solid var(--brass);max-inline-size:640px;display:grid;gap:var(--s3)}
.note__k{font-size:.875rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--muted)}
.note__t{font-family:var(--f-serif);font-size:1.3125rem;line-height:1.5}
.note__s{font-family:var(--f-serif);font-style:italic;color:var(--brand)}
.note .note__tag{position:absolute;inset-block-start:-15px;inset-inline-end:var(--s5)}
@media (min-width:900px){.afterl__in{grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:var(--s9)}}

