/* The papers of a sponsor's thank-you letter (/thanks/..., step 6) and of the club's profile (/profile, step 7), the Sponsorship plan,
   22 Oct 2026. Only these two pages ask for this file (src/pages/pages.mjs, styles), so no other page carries it: with it in the
   site's one stylesheet the Arabic Events page went past its budget by 1 KB (scripts/speedtest.cjs). It uses the site's colours and
   faces (site.css). */
/* ---------- a sponsor's thank-you letter (22 Oct 2026, the Sponsorship plan's step 6; src/js/thanks.js) ----------
   Two papers, English then Arabic, the way the club's own papers are made: on a phone each is the width of the screen; printed, each
   is one A4 page with nothing of the site around it (thanks.js puts .is-letter on the page). */
.wrap--letter { max-width: calc(820px + 2 * var(--gut)); }
.letter { background: var(--card); color: var(--ink); border-radius: var(--r); box-shadow: var(--shadow); padding: clamp(20px, 5vw, 56px); margin: 0 0 24px; }
.letter[lang="ar"] { font-family: var(--f-ar); }
.letter__marks { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 16px; border-bottom: 2px solid var(--wine); }
.letter__mark svg { display: block; width: clamp(96px, 24vw, 150px); height: auto; }
.letter__logo { width: clamp(64px, 16vw, 96px); height: clamp(64px, 16vw, 96px); object-fit: contain; border-radius: 14px; border: 1px solid var(--hair); background: #fff; flex: none; }
.letter__logo--none { display: inline-grid; place-items: center; font-weight: 700; font-size: 26px; color: var(--wine); background: var(--rose-2); border-color: var(--rose); }
.letter__from { margin: 14px 0 0 !important; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
.letter__date { margin: 4px 0 18px !important; font-size: 13px; color: var(--ink-3); }
.letter__h { font-size: clamp(24px, 6vw, 34px); line-height: 1.2; color: var(--wine-2); margin: 0 0 12px; overflow-wrap: anywhere; }
.letter[lang="ar"] .letter__h, .letter[lang="ar"] .letter__h2 { font-family: var(--f-ar-h); }
.letter p { margin: 0 0 12px; }
.letter__big { font-size: clamp(18px, 4.4vw, 22px); line-height: 1.5; padding: 14px 18px; border-inline-start: 4px solid var(--wine); background: var(--rose-2); border-radius: var(--r-s); margin: 18px 0 !important; }
.letter__big .num { font-size: 1.25em; color: var(--wine); }
.letter__h2 { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--wine); margin: 22px 0 8px; }
.letter[lang="ar"] .letter__h2 { letter-spacing: 0; text-transform: none; font-size: 17px; }
.letter__how { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.45; }
.letter__how th, .letter__how td { text-align: start; padding: 8px 6px; border-bottom: 1px solid var(--hair); vertical-align: top; }
.letter__how thead th { font-size: 12px; color: var(--ink-3); font-weight: 600; }
.letter__how .n { text-align: end; white-space: nowrap; font-weight: 700; width: 1%; padding-inline-start: 14px; }
.letter__how td .letter__tag { margin-top: 5px; }
.letter__how tfoot th, .letter__how tfoot td { border-bottom: 0; font-weight: 700; color: var(--wine-2); }
.letter__tag { display: inline-block; font-size: 12px; line-height: 1.35; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.letter__tag--counted { background: var(--ok-bg); color: var(--ok); }
.letter__tag--estimated { background: var(--warn-bg); color: var(--warn); }
.letter__tag--typed { background: var(--rose-2); color: var(--wine-2); }
.letter__note { font-size: 13px; line-height: 1.55; color: var(--ink-2); margin-top: 10px !important; }
.letter__stats { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: 15px; }
.letter__stats li { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px dashed var(--hair); padding: 5px 0; }
.letter__stats b { white-space: nowrap; }
.letter__photos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 18px 0; }
.letter__photos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-s); display: block; }
.letter__close { font-weight: 600; margin-top: 18px !important; }
.letter__sign { margin-top: 18px !important; line-height: 1.6; }
.letter__site { color: var(--wine); unicode-bidi: isolate; }
.letter-acts { display: grid; justify-items: center; gap: 6px; margin: 8px 0 32px; text-align: center; }
@media print {
  @page { size: A4; margin: 14mm; }
  html.is-letter body { background: #fff !important; }
  html.is-letter :is(.skip, .banner, .testcopy, .top, .sheet, .foot, .letter-acts) { display: none !important; }
  html.is-letter main .sec { padding: 0 !important; }
  html.is-letter .wrap--letter { max-width: none; padding: 0; }
  .letter { box-shadow: none; border-radius: 0; padding: 0; margin: 0; break-after: page; font-size: 10.5pt; line-height: 1.4; }
  .letter:last-of-type { break-after: auto; }
  .letter__how tr, .letter__photos, .letter__stats li { break-inside: avoid; }
  /* one A4 page each: the type and the spaces of a printed letter, the photos in one row, each tag beside its words */
  .letter__marks { padding-bottom: 8px; }
  .letter__mark svg { width: 34mm; }
  .letter__logo { width: 20mm; height: 20mm; }
  .letter__from, .letter__date { font-size: 9pt; }
  .letter__date { margin-bottom: 10px !important; }
  .letter__h { font-size: 20pt; margin-bottom: 6px; }
  .letter p { margin-bottom: 6px; }
  .letter__big { font-size: 13pt; padding: 8px 12px; margin: 10px 0 !important; }
  .letter__h2 { margin: 12px 0 4px; font-size: 10pt; }
  .letter[lang="ar"] .letter__h2 { font-size: 12pt; }
  .letter__how { font-size: 9.5pt; }
  .letter__how th, .letter__how td { padding: 4px; }
  .letter__how td br { display: none; }
  .letter__how td .letter__tag { margin: 0; margin-inline-start: 6px; }
  .letter__tag { font-size: 8pt; padding: 0 6px; }
  .letter__note { font-size: 8.5pt; margin-top: 6px !important; }
  .letter__stats { font-size: 10pt; gap: 0; }
  .letter__stats li { padding: 2px 0; }
  .letter__photos { grid-template-columns: repeat(4, 1fr); gap: 4px; margin: 10px 0; }
  .letter__close { margin-top: 10px !important; }
  .letter__sign { margin-top: 8px !important; }
}

/* ---------- the club's profile for companies (22 Oct 2026, the Sponsorship plan's step 7; src/js/profile.js) ----------
   The letter's papers (above), with parts of its own: the club's mark and the university's at equal weight, the goals, the numbers,
   the partners' logos and recent activities; printed, one A4 page each. */
.prof__marks { align-items: flex-end; }
.prof__ku { width: auto; height: clamp(64px, 17vw, 96px); flex: none; }
.prof__line { font-size: 18px; color: var(--wine-2); font-weight: 600; }
.prof__goals { margin: 0; padding-inline-start: 22px; display: grid; gap: 8px; }
.prof__goals b { color: var(--wine-2); }
.prof__nums { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; }
.prof__nums li { display: grid; gap: 2px; align-content: start; padding: 12px; background: var(--rose-2); border-radius: var(--r-s); }
.prof__nums b { font-size: 26px; line-height: 1.1; color: var(--wine); }
.prof__nums span { font-size: 13px; line-height: 1.35; color: var(--ink-2); }
.prof__sp { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 12px; }
.prof__sp li { display: grid; justify-items: center; align-content: start; gap: 6px; text-align: center; font-size: 12px; line-height: 1.3; overflow-wrap: anywhere; }
.prof__sp img, .prof__ini { width: 56px; height: 56px; object-fit: contain; border-radius: 12px; border: 1px solid var(--hair); background: #fff; }
.prof__ini { display: grid; place-items: center; font-weight: 700; color: var(--wine); background: var(--rose-2); }
.prof__acts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.prof__acts li { display: grid; gap: 4px; align-content: start; font-size: 13px; line-height: 1.35; }
.prof__acts img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--r-s); background: var(--paper-2); }
.prof__acts small { color: var(--ink-3); }
.prof__mail { color: var(--wine); font-weight: 600; }
.prof__soc { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 14px; }
@media print {
  /* one A4 page a language with the most it holds (the goals, five numbers, 18 partners, six activities): smaller type and spaces,
     a partner's or an activity's name on two lines at most, the activities' pictures in a row */
  .prof { font-size: 9.5pt; line-height: 1.35; }
  .prof .letter__mark svg { width: 30mm; }
  .prof__ku { height: 17mm; }
  .prof .letter__from, .prof .letter__date { font-size: 8.5pt; }
  .prof .letter__date { margin-bottom: 6px !important; }
  .prof .letter__h { font-size: 17pt; margin-bottom: 2px; }
  .prof__line { font-size: 10.5pt; margin-bottom: 4px !important; }
  .prof p { margin-bottom: 4px; }
  .prof .letter__h2 { margin: 8px 0 3px; font-size: 9.5pt; }
  .prof[lang="ar"] .letter__h2 { font-size: 11pt; }
  .prof__goals { gap: 1px; font-size: 9pt; line-height: 1.3; }
  .prof__nums { grid-template-columns: repeat(5, 1fr); gap: 4px; }
  .prof__nums li { padding: 4px 6px; }
  .prof__nums b { font-size: 14pt; }
  .prof__nums span { font-size: 7.5pt; line-height: 1.25; }
  .prof .letter__note { font-size: 7.5pt; margin-top: 3px !important; }
  .prof__sp { grid-template-columns: repeat(9, 1fr); gap: 3px 6px; }
  .prof__sp img, .prof__ini { width: 10mm; height: 10mm; border-radius: 6px; }
  .prof__sp li { font-size: 6pt; line-height: 1.2; gap: 2px; }
  .prof__sp li > span:last-child, .prof__acts b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .prof__acts { grid-template-columns: repeat(6, 1fr); gap: 4px; }
  .prof__acts li { font-size: 6.5pt; line-height: 1.25; gap: 1px; }
  .prof__acts img { aspect-ratio: 4 / 3; border-radius: 4px; }
  .prof__soc { font-size: 8.5pt; }
}

/* ---------- an event's page for companies (round 2 for the Sponsorship team, 22 Oct 2026, item 4; src/js/sponsor.js) ----------
   One paper, in the language the site is read in: what a café asked before saying yes (the dates, how many come, what we ask and
   what they get, the booth), then who to call. */
.brief__poster { width: 72px; height: 72px; object-fit: cover; border-radius: 12px; border: 1px solid var(--hair); flex: none; }
.brief__when { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 4px; font-size: 17px; }
.brief__when .num { color: var(--ink-2); margin-inline-start: 6px; white-space: nowrap; }
.brief__typed { white-space: pre-line; overflow-wrap: anywhere; }
.brief__where { font-weight: 600; }
.brief__chips { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.brief__chips li { padding: 6px 12px; border-radius: 999px; background: var(--rose-2); color: var(--wine-2); font-weight: 600; font-size: 15px; }
.brief__list { margin: 0 0 12px; padding-inline-start: 20px; display: grid; gap: 6px; }
.brief__sp .evsp { margin: 0; }
.brief__who { font-size: 18px; margin-bottom: 8px !important; }
.brief__who .num { margin-inline-start: 8px; }
.brief__go { display: flex; flex-wrap: wrap; gap: 8px; }
.brief__more { margin-bottom: 6px !important; }