/* About, contact and legal pages (about.html, contact.html, privacy.html, terms.html, gift-terms.html). Loaded after site.css. */

/* ---------- shared ---------- */
.page-hero .updated{margin-top:16px;font:500 12.5px/1.4 var(--mono);color:var(--muted)}
.page-hero .art.gift-art{max-height:300px}
.fine{margin-top:18px;font-size:13.5px;color:var(--muted)}
.section .stats{margin-bottom:0}

/* ---------- legal pages ---------- */
.article-layout>*{min-width:0} /* wide tables scroll inside .table-wrap on phones */
.legal .prose h3{font-size:18px}
.prose code{font:500 13.5px/1.4 var(--mono);background:#f1f1ef;color:var(--ink);padding:2px 6px;border-radius:6px;white-space:nowrap}
.prose blockquote.consent{font:400 15.5px/1.6 var(--sans);font-style:normal;color:var(--ink-2);background:#fff;border:1px solid var(--line);border-left:3px solid var(--orange);border-radius:10px;padding:14px 18px}
.prose .keypoints a{color:#fff}
.related-legal{padding-top:18px;border-top:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.legal-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.prose ol>li::marker{font-weight:600}

/* ---------- about ---------- */
.about-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:40px;margin-top:56px;align-items:start}
.about-copy p{font-size:17px;line-height:1.65;color:var(--ink-2)}
.about-copy p+p{margin-top:14px}

.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;counter-reset:none}
.steps.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.steps li{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 18px 22px;display:flex;flex-direction:column;gap:8px}
.section.white .steps li{background:#fafaf9}
.steps .n{width:32px;height:32px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;font:600 14px/1 var(--sans);margin-bottom:6px}
.steps h3{font-size:17px;font-weight:500;letter-spacing:-.015em;line-height:1.3}
.steps p{font-size:14px;line-height:1.55;color:var(--ink-2)}
.steps a{color:var(--orange-d);text-decoration:underline;text-underline-offset:3px}

.pay-box{background:#151515;color:#e9e9e9;border-radius:24px;padding:40px 44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:36px;align-items:center}
.pay-box h2{font-size:clamp(28px,3.2vw,40px);font-weight:500;letter-spacing:-.03em;line-height:1.1;color:#fff}
.pay-box h2 .serif{color:#ff8a8f}
.pay-box p{font-size:16px;line-height:1.6;color:#cfcfcf}
.pay-box p+p{margin-top:12px}
.pay-box .eyebrow{background:#262626;border-color:#333;color:#ddd}

.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:20px}
.about-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px 30px 32px}
.about-card h2{font-size:clamp(24px,2.6vw,32px);font-weight:500;letter-spacing:-.03em;line-height:1.1}
.about-card p{margin-top:12px;font-size:15.5px;line-height:1.6;color:var(--ink-2)}
.about-card .hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.about-card.gift{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:24px;align-items:center;background:var(--orange-soft);border-color:#ffd0d2}
.about-card.gift img{width:100%;height:auto}
.about-card.gift .btn{margin-top:20px}

/* ---------- contact ---------- */
.contact-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:28px}
.contact-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px 22px;display:flex;flex-direction:column;gap:10px}
.contact-card.main{border-color:var(--orange);box-shadow:0 14px 34px rgba(237,28,36,.08)}
.contact-card .ci{width:40px;height:40px;border-radius:12px;background:#f4f4f3;display:grid;place-items:center;font-size:18px;color:var(--ink)}
.contact-card.main .ci{background:var(--orange);color:#fff}
.contact-card h3{font-size:19px;font-weight:500;letter-spacing:-.02em}
.contact-card p{font-size:14.5px;line-height:1.55;color:var(--ink-2);flex:1}
.contact-card .btn{align-self:flex-start;margin-top:6px;white-space:normal;text-align:left}

.contact-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:40px;align-items:start}
.contact-split .sub a{color:var(--orange-d);text-decoration:underline;text-underline-offset:3px}
.faq{background:#fff;border:1px solid var(--line);border-radius:18px;padding:6px 22px}
.faq details{border-bottom:1px solid var(--line)}
.faq details:last-child{border-bottom:0}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;padding:16px 0;font-size:16px;font-weight:500;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;color:var(--muted);font-size:20px;line-height:1;transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details>div{padding:0 0 18px}
.faq p{font-size:15px;line-height:1.6;color:var(--ink-2)}
.faq a{color:var(--orange-d);text-decoration:underline;text-underline-offset:3px}
.faq summary:focus-visible{outline:2px solid var(--orange);outline-offset:4px;border-radius:6px}

.more-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:40px}
.more-links a{display:flex;flex-direction:column;gap:4px;padding:18px 20px;background:#fff;border:1px solid var(--line);border-radius:14px;transition:border-color .2s,transform .3s var(--ease)}
.more-links a:hover{border-color:#cfcfcb;transform:translateY(-2px)}
.more-links b{font-weight:500;font-size:16px;color:var(--ink)}
.more-links b::after{content:" →";color:var(--orange)}
.more-links span{font-size:14px;line-height:1.5;color:var(--ink-2)}

/* ---------- responsive ---------- */
@media (max-width:1023px){
  .steps,.steps.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-split,.contact-split{grid-template-columns:1fr;gap:20px}
  .about-grid{grid-template-columns:1fr}
  .pay-box{grid-template-columns:1fr;gap:18px;padding:32px 28px}
  .contact-cards{grid-template-columns:1fr}
  .more-links{grid-template-columns:1fr}
  /* legal pages: keep the contents list on small screens, above the text */
  .legal .toc{display:block;position:static;margin-bottom:28px;padding:16px 18px;background:#fff;border:1px solid var(--line);border-radius:14px}
  .legal .toc:empty{display:none}
  .legal .toc a{padding:5px 0 5px 12px}
}
@media (max-width:640px){
  .steps,.steps.four{grid-template-columns:1fr}
  .about-split{margin-top:40px}
  .about-card{padding:24px 20px}
  .about-card.gift{grid-template-columns:1fr}
  .about-card.gift img{max-width:260px}
  .pay-box{padding:26px 20px;border-radius:18px}
  .faq{padding:4px 16px}
  .page-hero .art.gift-art{max-height:200px}
}
@media (prefers-reduced-motion:reduce){.more-links a,.faq summary::after{transition:none}}