/* Styles for the "Everything we are and offer" section (home page, collapsed) and what-we-offer.html.
   Uses the home page's existing tokens (--panel, --line, --text, --muted, --gold) with safe fallbacks. */
.wwo-home,
.wwo-sec,
.wwo-hero {
  --wwo-panel: var(--panel, #182123);
  --wwo-line: var(--line, #354143);
  --wwo-text: var(--text, #f3f2ec);
  --wwo-muted: var(--muted, #b7bdb9);
  --wwo-gold: var(--gold, #d5b779);
}
.wwo-home { padding-top: 28px; padding-bottom: 12px; }
.wwo-details { border: 1px solid var(--wwo-line); background: var(--wwo-panel); }
.wwo-details > summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  align-items: baseline;
  justify-content: space-between;
  padding: 18px 20px;
  color: var(--wwo-text);
}
.wwo-details > summary::-webkit-details-marker { display: none; }
.wwo-details > summary::after {
  content: "+";
  font-size: 1.4rem;
  line-height: 1;
  color: var(--wwo-gold);
  margin-left: auto;
}
.wwo-details[open] > summary::after { content: "\2013"; }
.wwo-details > summary:focus-visible { outline: 2px solid var(--wwo-gold); outline-offset: 2px; }
.wwo-sum-title { margin: 0; font-size: 1.15rem; font-weight: 700; color: var(--wwo-text); }
.wwo-sum-meta { font-size: .85rem; color: var(--wwo-muted); }
.wwo-body { padding: 4px 20px 24px; color: var(--wwo-text); line-height: 1.6; font-size: .96rem; border-top: 1px solid var(--wwo-line); overflow-wrap: anywhere; }
.wwo-body h3 { margin: 28px 0 8px; font-size: 1.15rem; color: var(--wwo-gold); }
.wwo-body h4 { margin: 20px 0 6px; font-size: 1rem; color: var(--wwo-text); }
.wwo-count { font-weight: 400; color: var(--wwo-muted); font-size: .85rem; }
.wwo-home-link { margin: 12px 0 0; font-size: .95rem; }
.wwo-home-link a, .wwo-body a, .wwo-sec a { color: var(--wwo-gold); }
.wwo-body p { margin: 0 0 .8em; }
.wwo-table th, .wwo-table td { overflow-wrap: normal; }
.wwo-table-pct th:not(:first-child), .wwo-table-pct td:not(:last-child) { white-space: nowrap; }
.wwo-list { margin: 8px 0 12px; padding-left: 1.2em; }
.wwo-list li { margin: 0 0 6px; }
.wwo-cols { columns: 2 340px; column-gap: 36px; }
.wwo-cols li { break-inside: avoid; }
.wwo-fine { color: var(--wwo-muted); font-size: .88rem; }
.wwo-big { font-size: 1.1rem; }
.wwo-q h4, .wwo-q h3 { margin: 18px 0 4px; }
.wwo-q p { margin: 0; color: var(--wwo-muted); }

/* status chips */
.wwo-st { display: inline-block; padding: 1px 9px; border: 1px solid currentColor; border-radius: 999px; font-size: .74rem; font-weight: 700; white-space: nowrap; vertical-align: baseline; }
.wwo-st-available { color: #7bc67e; }
.wwo-st-beta { color: #e8c26a; }
.wwo-st-in-development { color: #75b7ff; }
.wwo-st-planned { color: #c9b6e4; }
.wwo-st-gone, .wwo-st-idea { color: var(--wwo-muted); }
.wwo-test { font-size: .78rem; color: var(--wwo-muted); white-space: nowrap; }
.wwo-table .wwo-test { white-space: normal; display: block; margin-top: 4px; }
.wwo-test-yes { color: #7bc67e; }
.wwo-test-partly { color: #e8c26a; }

/* tables */
.wwo-tablewrap { overflow-x: auto; margin: 10px 0 18px; }
.wwo-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.wwo-table th, .wwo-table td { text-align: left; vertical-align: top; padding: 9px 10px; border-bottom: 1px solid var(--wwo-line); }
.wwo-table thead th { color: var(--wwo-gold); font-size: .8rem; letter-spacing: .04em; }
.wwo-table tbody th { font-weight: 600; color: var(--wwo-text); }
.wwo-table td { color: var(--wwo-muted); }
.wwo-total th, .wwo-total td { color: var(--wwo-text); font-weight: 700; border-top: 2px solid var(--wwo-line); }

/* page-only */
.wwo-hero .lead { max-width: 62ch; }
.wwo-sec { padding: 8px 0 18px; color: var(--wwo-text); line-height: 1.6; }
.wwo-sec h2 { margin: 32px 0 10px; }
.wwo-sec h3 { margin: 26px 0 6px; }
.wwo-sec p, .wwo-sec li { max-width: 80ch; }
.wwo-sec .wwo-tablewrap, .wwo-sec .wwo-table { max-width: none; }
.wwo-jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.wwo-jump a { border: 1px solid var(--wwo-line); padding: 6px 12px; text-decoration: none; font-size: .88rem; border-radius: 999px; }

@media (max-width: 640px) {
  .wwo-details > summary { padding: 16px; }
  .wwo-body { padding: 4px 16px 20px; }
  .wwo-cols { columns: 1; }
  .wwo-table thead { display: none; }
  .wwo-table, .wwo-table tbody, .wwo-table tr, .wwo-table th, .wwo-table td { display: block; width: 100%; }
  .wwo-table tr { padding: 10px 0; border-bottom: 1px solid var(--wwo-line); }
  .wwo-table th, .wwo-table td { border: 0; padding: 2px 0; }
  .wwo-table td[data-label]::before { content: attr(data-label) ": "; color: var(--wwo-text); font-weight: 600; }
}
