/* =====================================================================
   LARA — CONTENT PAGES  (legal.html · help.html)
   Quiet reading pages in the landing's language: cream ground, white
   cards, green only for accents. Tokens from styles.css only.
   ===================================================================== */
/* the hidden attribute must win over any display rule below */
[hidden]{ display:none !important; }
body.pg-body{ background:var(--stone); color:var(--ink); }
.sr-only{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
:focus-visible{ outline:2px solid var(--green-600); outline-offset:2px; }
.skip{ position:absolute; inset-inline-start:12px; inset-block-start:-60px; z-index:500; padding:8px 16px; border-radius:12px; background:var(--green-800); color:#fff; }
.skip:focus{ inset-block-start:12px; }

/* ---------- header ---------- */
.ph{ position:sticky; top:0; z-index:50; background:rgba(251,248,242,.86); -webkit-backdrop-filter:blur(16px) saturate(1.4); backdrop-filter:blur(16px) saturate(1.4); border-bottom:1px solid rgba(30,40,36,.06); padding-top:env(safe-area-inset-top,0px); }
.ph__in{ display:flex; align-items:center; gap:20px; width:min(1120px,100%); margin-inline:auto; height:68px; padding-inline:clamp(16px,4vw,32px); }
.ph__brand{ display:inline-flex; align-items:center; gap:8px; font-size:18px; font-weight:700; font-variation-settings:"wght" 700; }
.ph__brand svg{ width:26px; height:26px; color:var(--green-700); }
.ph__nav{ display:flex; gap:4px; margin-inline:auto; }
.ph__nav a{ padding:8px 16px; border-radius:var(--r-pill); font-size:14px; color:var(--ink-2); transition:background .2s, color .2s; }
.ph__nav a:hover{ background:rgba(30,40,36,.05); color:var(--ink); }
.ph__nav a[aria-current="page"]{ color:var(--green-800); font-weight:600; background:var(--green-tint); }
.ph__cta{ display:inline-flex; align-items:center; min-height:40px; padding-inline:16px; border-radius:var(--r-pill); background:var(--green-700); color:#F6FAF6; font-size:14px; font-weight:600; transition:background .2s; }
.ph__cta:hover{ background:var(--green-900); }

/* ---------- hero band ---------- */
.pband{ position:relative; overflow:hidden; padding-block:clamp(48px,8vw,88px) clamp(36px,6vw,56px); padding-inline:clamp(16px,4vw,32px); text-align:center; }
.pband::before{ content:""; position:absolute; inset-inline:10%; inset-block-end:-40%; height:90%; background:radial-gradient(50% 50% at 50% 50%, rgba(var(--wg-rgb,47,107,82),.2), transparent 70%); filter:blur(20px); pointer-events:none; }
.pband > *{ position:relative; }
.pband__eyebrow{ display:inline-flex; align-items:center; gap:8px; padding:8px 16px; border-radius:var(--r-pill); background:rgba(255,255,255,.75); border:1px solid rgba(30,40,36,.07); font-size:12px; color:var(--ink-2); }
.pband__eyebrow::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--green-600); }
.pband h1{ margin-top:16px; font-size:clamp(28px,4.4vw,44px); font-weight:800; font-variation-settings:"wght" 800; letter-spacing:normal; line-height:1.35; text-wrap:balance; }
.pband p{ margin:12px auto 0; max-width:58ch; font-size:16px; line-height:1.9; color:var(--ink-3); text-wrap:balance; }

.pwrap{ width:min(1120px,100%); margin-inline:auto; padding-inline:clamp(16px,4vw,32px); padding-block:0 clamp(64px,10vw,120px); }

/* ---------- legal: toc + article ---------- */
.legal{ display:grid; grid-template-columns:240px minmax(0,1fr); gap:40px; align-items:start; }
.toc{ position:sticky; top:92px; padding:16px; border-radius:20px; background:var(--paper); border:1px solid rgba(30,40,36,.075); }
.toc b{ display:block; font-size:12px; font-weight:600; color:var(--ink-4); margin-bottom:8px; padding-inline:8px; }
.toc a{ display:block; padding:8px 8px; border-radius:10px; font-size:13px; color:var(--ink-2); transition:background .2s, color .2s; }
.toc a:hover{ background:var(--green-tint-2); color:var(--ink); }
.toc a.is-on{ background:var(--green-tint); color:var(--green-800); font-weight:600; }
.prose{ background:var(--paper); border:1px solid rgba(30,40,36,.075); border-radius:28px; padding:clamp(24px,5vw,56px); box-shadow:var(--sh-xs); }
.prose section + section{ margin-top:48px; padding-top:40px; border-top:1px solid var(--line); }
.prose h2{ font-size:clamp(22px,2.6vw,28px); font-weight:800; font-variation-settings:"wght" 800; letter-spacing:normal; scroll-margin-top:96px; }
.prose .upd{ display:block; margin-top:8px; font-size:13px; color:var(--ink-4); }
.prose h3{ margin-top:28px; font-size:16px; font-weight:700; font-variation-settings:"wght" 700; color:var(--green-800); scroll-margin-top:96px; }
.prose p, .prose li{ font-size:16px; line-height:2.1; color:var(--ink-2); }
.prose p{ margin-top:8px; }
.prose ul{ margin-top:8px; padding-inline-start:4px; list-style:none; display:flex; flex-direction:column; gap:8px; }
.prose li{ position:relative; padding-inline-start:20px; }
.prose li::before{ content:""; position:absolute; inset-inline-start:4px; inset-block-start:16px; width:6px; height:6px; border-radius:50%; background:var(--green-400); }
.prose .note{ margin-top:16px; padding:16px 16px; border-radius:16px; background:var(--green-tint-2); border:1px solid var(--green-line); font-size:14px; line-height:2; color:var(--ink); }

/* ---------- help: search, faq, contact ---------- */
.hsearch{ display:flex; align-items:center; gap:8px; width:min(560px,100%); margin:24px auto 0; padding-inline:16px; min-height:54px; border-radius:var(--r-pill); background:var(--paper); border:1px solid rgba(30,40,36,.09); box-shadow:var(--sh-md); }
.hsearch:focus-within{ border-color:rgba(var(--green-rgb),.45); box-shadow:var(--sh-md), 0 0 0 4px rgba(var(--green-rgb),.09); }
.hsearch svg{ width:20px; height:20px; color:var(--ink-4); flex:none; }
.hsearch input{ flex:1; min-width:0; border:0; outline:0; background:none; font:inherit; font-size:var(--t-input); min-height:44px; }

.hcats{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:48px; }
.hcat{ display:flex; flex-direction:column; gap:8px; text-align:start; font:inherit; color:inherit; cursor:pointer; padding:16px; border-radius:20px; background:var(--paper); border:1px solid rgba(30,40,36,.075); box-shadow:var(--sh-xs); transition:transform .25s var(--ease), box-shadow .25s, border-color .25s; }
.hcat:hover{ transform:translateY(-3px); box-shadow:var(--sh-md); border-color:var(--green-line); }
.hcat[aria-pressed="true"]{ border-color:var(--green-600); box-shadow:0 0 0 3px rgba(var(--green-rgb),.1); }
.hcat[aria-pressed="true"] i{ background:var(--green-700); border-color:var(--green-700); color:#F6FAF6; }
.hcat i{ width:38px; height:38px; border-radius:12px; display:grid; place-items:center; background:var(--green-tint-2); border:1px solid var(--green-line); color:var(--green-700); font-style:normal; margin-bottom:8px; }
.hcat i svg{ width:19px; height:19px; }
.hcat b{ font-size:16px; font-weight:600; }
.hcat span{ font-size:13px; line-height:1.8; color:var(--ink-3); }

.hsec{ scroll-margin-top:96px; }
.hsec + .hsec{ margin-top:clamp(56px,8vw,88px); }
.hsec__head{ display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:12px; margin-bottom:20px; }
.hsec__head h2{ font-size:clamp(22px,2.8vw,30px); font-weight:800; font-variation-settings:"wght" 800; letter-spacing:normal; }
.hsec__head p{ font-size:14px; color:var(--ink-3); }

.faq{ display:flex; flex-direction:column; gap:8px; }
.faq details{ background:var(--paper); border:1px solid rgba(30,40,36,.075); border-radius:18px; transition:border-color .2s, box-shadow .2s; }
.faq details[open]{ border-color:var(--green-line); box-shadow:var(--sh-sm); }
.faq summary{ display:flex; align-items:center; gap:16px; padding:16px 20px; cursor:pointer; list-style:none; font-size:16px; font-weight:600; min-height:44px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:""; width:22px; height:22px; flex:none; margin-inline-start:auto; border-radius:50%; background:var(--green-tint-2)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6B52' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/12px no-repeat; transition:transform .25s var(--ease); }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq summary em{ font-style:normal; font-size:12px; font-weight:500; padding:2px 8px; border-radius:var(--r-pill); background:var(--cream); color:var(--ink-3); }
.faq .a{ padding:0 20px 20px; font-size:16px; line-height:2.05; color:var(--ink-2); }
.faq .a a{ color:var(--green-700); text-decoration:underline; text-underline-offset:4px; }
.faq__none{ padding:36px; text-align:center; color:var(--ink-3); background:var(--paper); border-radius:18px; border:1px dashed var(--line-strong); }

.support{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:20px; align-items:start; }
.sform{ background:var(--paper); border:1px solid rgba(30,40,36,.075); border-radius:26px; padding:clamp(20px,3vw,30px); box-shadow:var(--sh-xs); }
.sform .row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.fld{ display:flex; flex-direction:column; gap:8px; margin-top:16px; min-width:0; }
.row .fld{ margin-top:0; }
.row + .fld, .fld + .row{ margin-top:16px; }
.fld label{ font-size:13px; font-weight:600; color:var(--ink-2); }
.fld label small{ font-weight:400; color:var(--ink-4); }
.fld input, .fld select, .fld textarea{ width:100%; min-height:48px; padding:12px 16px; border-radius:14px; background:var(--paper-warm); border:1px solid var(--line-2); font:inherit; font-size:var(--t-input); color:var(--ink); outline:0; transition:border-color .2s, box-shadow .2s; }
.fld textarea{ resize:vertical; min-height:130px; line-height:1.9; }
.fld input:focus, .fld select:focus, .fld textarea:focus{ border-color:var(--green-600); background:var(--paper); box-shadow:0 0 0 4px rgba(var(--green-rgb),.09); }
.fld [aria-invalid="true"]{ border-color:var(--coral); box-shadow:0 0 0 4px rgba(var(--coral-rgb),.1); }
.fld .err{ font-size:var(--t-caption); color:var(--coral-ink); }
.fld .cnt{ font-size:12px; color:var(--ink-4); text-align:end; }
.fld select{ appearance:none; -webkit-appearance:none; padding-inline-end:38px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2368736D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-size:16px; background-position:left 14px center; }
.ltr{ direction:ltr; text-align:right; }
.sform__foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; }
.sform__foot p{ font-size:12px; color:var(--ink-4); }
.pbtn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding-inline:24px; border-radius:var(--r-pill); background:var(--green-700); color:#F6FAF6; font-size:16px; font-weight:600; box-shadow:0 12px 26px -18px rgba(var(--green-rgb),.8); transition:background .2s, transform .2s; }
.pbtn:hover{ background:var(--green-900); transform:translateY(-1px); }
.pbtn[disabled]{ opacity:.6; transform:none; }
.sent{ display:flex; flex-direction:column; align-items:center; gap:8px; padding:28px 8px; text-align:center; }
.sent i{ width:56px; height:56px; border-radius:50%; display:grid; place-items:center; background:var(--green-700); color:#fff; font-style:normal; animation:pop .45s var(--ease); }
.sent i svg{ width:26px; height:26px; }
@keyframes pop{ from{ transform:scale(.6); opacity:0; } to{ transform:none; opacity:1; } }
.sent b{ font-size:18px; font-weight:700; }
.sent p{ font-size:14px; color:var(--ink-3); line-height:1.9; }
.sent button{ margin-top:8px; font-size:14px; color:var(--green-700); text-decoration:underline; text-underline-offset:4px; }

.chan{ display:flex; flex-direction:column; gap:8px; }
.chan a, .chan div{ display:flex; align-items:center; gap:16px; padding:16px 16px; border-radius:18px; background:var(--paper); border:1px solid rgba(30,40,36,.075); box-shadow:var(--sh-xs); transition:border-color .2s; }
.chan a:hover{ border-color:var(--green-line); }
.chan i{ width:40px; height:40px; flex:none; border-radius:12px; display:grid; place-items:center; background:var(--green-tint-2); color:var(--green-700); font-style:normal; }
.chan i svg{ width:19px; height:19px; }
.chan b{ display:block; font-size:14px; font-weight:600; }
.chan span{ display:block; font-size:13px; color:var(--ink-3); margin-top:2px; }
.chan .hours{ background:var(--green-tint-2); border-color:var(--green-line); }

/* ---------- footer ---------- */
.pf{ border-top:1px solid rgba(30,40,36,.07); background:var(--cream); }
.pf__in{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; width:min(1120px,100%); margin-inline:auto; padding:24px clamp(16px,4vw,32px) calc(24px + env(safe-area-inset-bottom,0px)); font-size:13px; color:var(--ink-3); }
.pf__in nav{ display:flex; flex-wrap:wrap; gap:16px; }
.pf__in a:hover{ color:var(--green-700); }

/* ---------- responsive ---------- */
@media (max-width:900px){
  .legal{ grid-template-columns:1fr; }
  .toc{ position:static; display:flex; gap:4px; overflow-x:auto; padding:8px; border-radius:var(--r-pill); scrollbar-width:none; }
  .toc b{ display:none; }
  .toc a{ flex:none; border-radius:var(--r-pill); }
  .hcats{ grid-template-columns:repeat(2,1fr); }
  .support{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .ph__nav{ display:none; }
  .ph__in{ justify-content:space-between; }
  .sform .row{ grid-template-columns:1fr; }
  .hcats{ gap:8px; }
  .hcat{ padding:16px; }
}
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; scroll-behavior:auto !important; } }


@media (pointer: coarse){
  .ph__nav a, .pf__in a{ min-height:44px; display:inline-flex; align-items:center; }
  .toc a{ min-height:44px; display:flex; align-items:center; }
  .faq summary{ min-height:52px; }
}
.support:has(> .sform[hidden]){ grid-template-columns:1fr; max-width:560px; }