/* ==========================================================================
   devanshi jain — text pages (terms and conditions)
   Titled sections that open and close. The bars come from page.css.
   ========================================================================== */

:root { --rule: #e4e4e2; --measure: 38em; /* comfortable line length for long reading */ }

/* page.css draws the fixed logo + title bar and the footer; the sections scroll between them */
p, h2, ul { margin: 0; padding: 0; }
a { color: inherit; }

/* the sections */
.lg-list { padding: var(--fade) var(--side); max-width: calc(var(--measure) + 2 * var(--side) + 4em); }
.lg-item { border-bottom: 1px solid var(--rule); }
.lg-item:first-child { border-top: 1px solid var(--rule); }
.lg-item__title {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  min-height: 48px; padding: 10px 0; cursor: pointer; list-style: none;
  color: var(--ink); letter-spacing: 0.02em;
  -webkit-user-select: none; user-select: none; touch-action: manipulation;
}
.lg-item__title::-webkit-details-marker { display: none; }
.lg-item__mark { flex: none; width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 1; stroke-linecap: round; transition: transform .35s ease; }
.lg-item[open] .lg-item__mark { transform: rotate(45deg); }          /* + turns into × */
@media (hover: hover) { .lg-item__title:hover { color: #1f201f; } }
@media (hover: none) { .lg-item__title:active { opacity: .55; } }

.lg-item__body { max-width: var(--measure); padding: 4px 0 28px; }
.lg-item[open] .lg-item__body { animation: lg-open .45s ease both; }
@keyframes lg-open { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.lg-item__body p + p, .lg-item__body p + ul, .lg-item__body ul + p, .lg-item__body ul + ul { margin-top: .9em; }
.lg-sub { font-size: 1em; font-weight: 700; color: var(--ink); margin: 1.4em 0 .3em; letter-spacing: 0.02em; }
.lg-item__body > .lg-sub:first-child { margin-top: 0; }
.lg-item__body ul { list-style: none; }
.lg-item__body li { position: relative; padding-left: 1.2em; }
.lg-item__body li + li { margin-top: .35em; }
.lg-item__body li::before { content: "–"; position: absolute; left: 0; }
.lg-item__body b { font-weight: 700; }
.lg-item__body a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

@media (prefers-reduced-motion: reduce) { .lg-item[open] .lg-item__body { animation: none; } .lg-item__mark { transition: none; } }

/* phones */
@media (max-width: 719px) {
  .lg-item__title { min-height: 46px; }
}
