/* ===== Abso info / policy pages (Contact, FAQ, Shipping, Refunds, Privacy, Terms) ===== */

.legal-main {
  background: var(--cream);
  padding-top: calc(var(--nav-h, 72px) + clamp(40px, 7vh, 80px));
  padding-bottom: clamp(70px, 11vh, 150px);
  min-height: 70vh;
}

/* header */
.legal-head {
  max-width: 820px;
  margin: 0 auto;
  padding: 0 var(--pad) clamp(28px, 5vh, 56px);
}
.legal-crumb {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-44, rgba(28, 22, 15, 0.44));
  text-decoration: none;
}
.legal-head .eye {
  display: block;
  margin: 22px 0 14px;
}
.legal-head h1 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(38px, 6vw, 78px);
  line-height: 1.02;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.legal-intro {
  font-family: var(--sans);
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.6;
  color: rgba(28, 22, 15, 0.7);
  max-width: 60ch;
  margin-top: 18px;
}
.legal-updated {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--ink-44, rgba(28, 22, 15, 0.45));
  margin-top: 20px;
}

/* reading column */
.legal {
  max-width: 780px;
  margin: 0 auto;
  padding: 0 var(--pad);
  font-family: var(--sans);
}
.legal h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(23px, 2.7vw, 31px);
  line-height: 1.15;
  color: var(--ink);
  margin: 42px 0 12px;
}
.legal h2:first-child { margin-top: 0; }
.legal h3 {
  font-family: var(--sans);
  font-weight: 600;
  font-size: 16px;
  color: var(--ink);
  margin: 26px 0 8px;
}
.legal p,
.legal li {
  font-size: 15.5px;
  line-height: 1.72;
  color: rgba(28, 22, 15, 0.8);
}
.legal p { margin: 0 0 15px; }
.legal ul { margin: 0 0 18px; padding-left: 20px; }
.legal li { margin: 7px 0; }
.legal strong { color: var(--ink); font-weight: 600; }
.legal a { color: var(--solar); text-decoration: underline; text-underline-offset: 2px; }
.legal hr { border: none; border-top: 1px solid rgba(28, 22, 15, 0.1); margin: 40px 0; }

/* placeholder marker for fields the operator must confirm */
.legal mark {
  background: rgba(223, 109, 9, 0.14);
  color: #9a4d06;
  padding: 1px 5px;
  border-radius: 3px;
  font-family: var(--mono);
  font-size: 0.85em;
}

/* plain-language summary box (top of Refund page etc.) */
.legal-summary {
  background: #fffdfa;
  border: 1px solid rgba(28, 22, 15, 0.1);
  border-radius: 12px;
  padding: 22px 24px;
  margin: 0 auto 34px;
  max-width: 780px;
}
.legal-summary > :first-child { margin-top: 0; }
.legal-summary h2 { font-size: 19px; margin: 0 0 10px; }
.legal-summary ul { margin: 0; }

/* table of contents (long pages) */
.legal-toc {
  max-width: 780px;
  margin: 0 auto 38px;
  padding: 18px 22px;
  border: 1px solid rgba(28, 22, 15, 0.1);
  border-radius: 12px;
  background: #fffdfa;
}
.legal-toc h2 { font-size: 13px; font-family: var(--mono); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-44, rgba(28,22,15,.5)); margin: 0 0 12px; }
.legal-toc ol { margin: 0; padding-left: 18px; columns: 2; column-gap: 28px; }
.legal-toc li { font-size: 13.5px; margin: 5px 0; }
.legal-toc a { color: rgba(28, 22, 15, 0.72); text-decoration: none; }
.legal-toc a:hover { color: var(--solar); }
@media (max-width: 620px) { .legal-toc ol { columns: 1; } }

/* FAQ accordion (native details/summary, no JS) */
.faq-acc { max-width: 820px; margin: 0 auto; padding: 0 var(--pad); }
.faq-cat {
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--solar);
  margin: 44px 0 6px;
}
.faq-cat:first-child { margin-top: 0; }
.faq-d { border-top: 1px solid rgba(28, 22, 15, 0.12); }
.faq-d:last-child { border-bottom: 1px solid rgba(28, 22, 15, 0.12); }
.faq-d summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 2px;
  font-family: var(--serif);
  font-size: clamp(18px, 2vw, 22px);
  color: var(--ink);
}
.faq-d summary::-webkit-details-marker { display: none; }
.faq-d summary::after {
  content: "+";
  font-family: var(--sans);
  font-size: 22px;
  color: var(--solar);
  transition: transform 0.3s ease;
  flex: 0 0 auto;
}
.faq-d[open] summary::after { content: "−"; }
.faq-d .faq-body {
  padding: 0 2px 22px;
  font-family: var(--sans);
  font-size: 15.5px;
  line-height: 1.72;
  color: rgba(28, 22, 15, 0.8);
  max-width: 68ch;
}
.faq-d .faq-body a { color: var(--solar); text-decoration: underline; }

/* contact page */
.contact-grid {
  max-width: 820px;
  margin: 0 auto;
  padding: 0 var(--pad);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}
@media (max-width: 640px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-card {
  background: #fffdfa;
  border: 1px solid rgba(28, 22, 15, 0.1);
  border-radius: 12px;
  padding: 24px 26px;
}
.contact-card .ck {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--solar);
}
.contact-card h3 { font-family: var(--serif); font-weight: 400; font-size: 24px; color: var(--ink); margin: 8px 0 6px; }
.contact-card p { font-family: var(--sans); font-size: 15px; line-height: 1.6; color: rgba(28, 22, 15, 0.78); margin: 0 0 4px; }
.contact-card a { color: var(--solar); text-decoration: none; font-weight: 500; }
.contact-card a:hover { text-decoration: underline; }
.contact-legalbar {
  max-width: 820px;
  margin: 34px auto 0;
  padding: 18px var(--pad) 0;
  border-top: 1px solid rgba(28, 22, 15, 0.1);
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.7;
  color: rgba(28, 22, 15, 0.55);
}