/* Composition for the customer terms at /sivut/ehdot/ and its immutable copies.
   Loads AFTER assets/brand.css and assets/sivut-ember.css and adds nothing to the identity:
   the header, the footer, the button, the eyebrow and every token come from those two. What is
   here is the one thing the storefront sheet has no shape for, a long reading document, plus the
   print rules that make it saveable on paper.

   Ground: the page is night (html.ground-night) so the chrome matches /sivut/, and the document
   itself is a paper band (data-ground="paper"), which is the same idiom the pricing band uses.

   Two rules earn their place beyond the reading column:
   1. A hairline above every heading. It is the storefront's own block idiom (.package,
      .zero-build), so eleven terms read as eleven blocks rather than as one wall.
   2. @media print. The page is night, and a browser prints no background by default: without
      this block a printed copy would be light text on white paper, which is a blank sheet. The
      terms must be reproducible on paper, so the ground flips to ink on white for print and the
      two navigation lines (the save hint, the back link) come out. */

.terms-doc {
  background: var(--bg); color: var(--ink);
  padding: 83px 64px 76px;
}

/* One reading column, and every hairline ends where it ends. The band is full width because the
   paper ground is, but a rule drawn to the far edge of a 1440 screen above a 65ch paragraph lines
   up with nothing, which the ember sheet already learned once on the pricing band. 46rem is a
   little wider than the text measure, exactly as a card's rule is wider than the sentence in it. */
.terms-head, .term, .terms-identity { max-width: 46rem; }

/* The document head: what this is, which version, from when, and how to keep it. */
.terms-doc h1 { font-size: clamp(38px, 3.7vw, 54px); letter-spacing: -.055em; line-height: 1.03; }
.terms-head .eyebrow { color: var(--ink-mute); }
.terms-date {
  margin-top: 22px;
  font: 500 12px/1.5 var(--label);
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-mute);
}
/* Only the immutable copies carry the frozen line; the change line rides on every page of a
   version that changed a term, current copy and frozen copy alike. */
.terms-frozen, .terms-changes { margin-top: 12px; font-size: 14px; line-height: 1.6; color: var(--ink-mute); }
.terms-save { margin-top: 26px; font-size: 14px; line-height: 1.65; max-width: 54ch; }

/* One term, one block. */
.term { border-top: 1px solid #AAA397; padding-top: 20px; margin-top: 44px; }
.term h2 { font-size: 23px; letter-spacing: -.03em; }
.term p { margin-top: 16px; font-size: 15px; line-height: 1.7; }
.term-list { margin: 20px 0 0; padding-left: 20px; }
.term-list li { font-size: 15px; line-height: 1.7; max-width: 65ch; }
.term-list li + li { margin-top: 14px; }
.term-list strong { font-weight: 600; }

/* The supplier block, at the foot of the document where the law asks for it to be readable. */
.terms-identity { border-top: 1px solid #AAA397; padding-top: 20px; margin-top: 52px; }
.terms-identity h2 { font-size: 23px; letter-spacing: -.03em; }
.terms-identity p { margin-top: 16px; font-size: 15px; line-height: 1.7; }
.terms-identity a { text-decoration: underline; text-underline-offset: 4px; }
.terms-back { margin-top: 26px; font-size: 14px; }
.terms-identity .terms-back a { display: inline-flex; align-items: center; min-height: 44px; }

/* The footer on this page carries no invite band, so the rule that band drew moves here. */
.footer-alone { border-top: 1px solid var(--night-line-2); }

@media (max-width: 1100px) and (min-width: 701px) {
  .terms-doc { padding: 64px 40px 60px; }
}

@media (max-width: 700px) {
  .terms-doc { padding: 44px 26px 44px; }
  .terms-doc h1 { font-size: 36px; }
  .terms-head .eyebrow { font-size: 9px; }
  .terms-date { font-size: 10px; }
  .terms-save { font-size: 14px; }
  .term { margin-top: 36px; }
  .term h2 { font-size: 21px; }
  .term-list { padding-left: 18px; }
  .terms-identity { margin-top: 44px; }
  .terms-identity h2 { font-size: 21px; }
}

@page { margin: 18mm; }

@media print {
  /* The whole page flips to ink on white: a night ground prints as nothing. */
  html.ground-night, .terms-doc[data-ground="paper"] {
    --bg: #fff; --bg-1: #fff;
    --line: rgba(0, 0, 0, .2); --line-2: rgba(0, 0, 0, .35);
    --ink: #000; --ink-body: #111; --ink-mute: #333; --ink-dim: #444;
    --accent: #000; --accent-text: #000;
  }
  body { background: #fff; color: #000; font-size: 10.5pt; }
  .header { height: auto; margin: 0 0 14pt; }
  .header nav, .skip-link, .terms-save, .terms-back { display: none; }
  .terms-doc { background: #fff; color: #000; padding: 0; }
  .term, .terms-identity { break-inside: avoid; page-break-inside: avoid; }
  .term h2, .terms-identity h2 { break-after: avoid; page-break-after: avoid; }
  .term p, .term-list li, .terms-identity p { font-size: 10.5pt; line-height: 1.5; max-width: none; }
  .footer { padding: 14pt 0 0; }
  .footer-details { display: block; gap: 0; color: #333; }
  .footer-details a { min-height: 0; display: block; }
  a { text-decoration: none; color: #000; }
}
