/* Peña's Landscape Services: legal.css (/privacy/ and /sms-terms/)
   Owned by the legal-backend group. Loaded after site.css through {% block css %}.
   Long-form prose: 36em column (about 70 characters of 17px Inter), numbered serif H2s, anchor
   table of contents (collapsed under 560, open card 560 to 1023, sticky side column from 1024).
   Tokens and breakpoints from design-system.md only. */

/* ===== Hero: no photo, no CTA; the H1 is short, so the lede carries the width ===== */
.legal-hero .hero--inner__grid{padding-bottom:40px}
.legal-hero .lede{margin-bottom:0}
.legal-hero .eyebrow{text-wrap:balance;align-items:flex-start}
.legal-hero .eyebrow::before{margin-top:.825em} /* rule sits on the first line when the brand wraps at 360 */
.legal__date{margin:22px 0 0}
@media (min-width:768px){.legal-hero .hero--inner__grid{padding-bottom:56px}}
@media (min-width:1024px){.legal-hero .hero--inner__grid{padding-bottom:72px}}

/* ===== Layout ===== */
.legal{padding-top:48px}
.legal__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:48px}
@media (min-width:768px){.legal{padding-top:64px}}
@media (min-width:1024px){
  .legal{padding-top:88px}
  .legal__grid{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:64px;align-items:start}
}
@media (min-width:1180px){.legal__grid{grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:96px}}

/* ===== Table of contents ===== */
.toc{background:var(--white);border:1px solid var(--line);border-top:3px solid var(--brass);padding:20px 20px 12px;min-width:0}
@media (min-width:480px){.toc{padding:24px 26px 14px}}
.toc__k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--brass-ink);margin:0 0 6px}
.toc ol{display:grid;grid-template-columns:minmax(0,1fr)}
@media (min-width:560px) and (max-width:1023px){.toc ol{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}}
.toc li{border-top:1px solid var(--line)}
.toc li:first-child{border-top:0}
@media (min-width:560px) and (max-width:1023px){.toc li:nth-child(2){border-top:0}}
.toc a{display:flex;align-items:baseline;gap:14px;min-height:44px;padding:10px 0;text-decoration:none;color:var(--ink);font-size:15px;line-height:1.35}
.toc a:hover span:last-child{color:var(--brass-ink);text-decoration:underline;text-decoration-color:var(--brass);text-underline-offset:3px}
.toc__n{font-family:var(--serif);font-weight:600;font-size:17px;color:var(--brass-ink);font-variant-numeric:lining-nums;flex:none;width:22px}
@media (min-width:1024px){.toc{position:sticky;top:100px;max-height:calc(100vh - 124px);overflow-y:auto}}

/* Phone disclosure (under 560) vs the open card (560 and up). */
.toc--d{display:none}
@media (min-width:560px){.toc--m{display:none}.toc--d{display:block}}
.toc--m{padding-top:0;padding-bottom:0}
.toc--m[open]{padding-bottom:12px}
.toc__sum{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;min-height:52px}
.toc__sum::-webkit-details-marker{display:none}
.toc__sum .toc__k{margin:0}
.toc__count{font-size:12px;letter-spacing:.12em;color:var(--muted);font-weight:500}
.toc__sum::after{content:"+";margin-left:auto;font-size:26px;line-height:1;color:var(--brass-ink);transition:transform .3s var(--ease)}
.toc--m[open] .toc__sum::after{transform:rotate(45deg)}
.toc--m[open] .toc__sum{border-bottom:1px solid var(--line)}
@media (prefers-reduced-motion:reduce){.toc__sum::after{transition:none}}

/* ===== Prose column ===== */
.legal__body.prose{max-width:36em}
.legal__sec{padding-top:40px;margin-top:40px;border-top:1px solid var(--line)}
.legal__sec:first-child{padding-top:0;margin-top:0;border-top:0}
@media (min-width:1024px){.legal__sec{padding-top:48px;margin-top:48px}}
.legal__body .legal__n{font-family:var(--serif);font-weight:600;font-size:20px;line-height:1;color:var(--brass-ink);font-variant-numeric:lining-nums;margin:0 0 10px;display:flex;align-items:center;gap:14px}
.legal__n::after{content:"";width:34px;height:1px;background:var(--brass)}
.legal__body h2{font-size:clamp(30px,3.6vw,40px);color:var(--green);margin:0 0 .5em;text-wrap:balance}
.legal__body p{font-size:17px;line-height:1.7}
.legal__body p:last-child{margin-bottom:0}
.legal__body a{color:var(--brass-ink);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px}
.legal__body a:hover{text-decoration-color:var(--brass)}
.legal__body .link{text-decoration:none}
/* Inline links in list items (tel: in "Your choices"): vertical padding grows the tap area to 44px
   without moving the text (padding on an inline box does not change line layout). */
.legal__body li a:not(.link){padding-block:12px}
.legal__list{margin:4px 0 1em}
.legal__list li{font-size:17px;line-height:1.6}
.legal__list li::before{margin-top:9px}
.legal__list:last-child{margin-bottom:0}

/* ===== Contact block (privacy) ===== */
.legal__addr{font-style:normal;display:grid;gap:2px;padding:18px 20px;background:var(--cream);border-left:3px solid var(--brass);font-size:17px;line-height:1.6}
.legal__addr span:first-child{font-family:var(--serif);font-weight:600;font-size:22px;color:var(--green);line-height:1.25;margin-bottom:4px}
.legal__addr a{display:inline-flex;align-items:center;min-height:44px}
