/* Satellite use of the established amara.gmbh visual system.
   Domain copy and site-specific accent/illustration remain independent. */
:root,
html[data-theme="light"] {
  --paper: #e4ded2;
  --paper-deep: #d7cfc1;
  --ink: #3a3027;
  --muted: #6f6559;
  --line: rgba(58, 48, 39, 0.18);
  --line-strong: rgba(58, 48, 39, 0.3);
  --paper-glass: rgba(228, 222, 210, 0.78);
  --nav-scrolled: rgba(228, 222, 210, 0.92);
  --page-effects:
    linear-gradient(180deg, rgba(228, 222, 210, 0.94), rgba(215, 207, 193, 0.94)),
    radial-gradient(circle at 82% 18%, rgba(47, 146, 123, 0.12), transparent 28%),
    radial-gradient(circle at 16% 78%, rgba(195, 93, 42, 0.10), transparent 26%);
  --logo-filter: none;
}

html[data-theme="dark"] {
  --paper: #1c1611;
  --paper-deep: #241d17;
  --ink: #ded8cc;
  --muted: #b8b2a4;
  --line: rgba(222, 216, 204, 0.16);
  --line-strong: rgba(222, 216, 204, 0.34);
  --paper-glass: rgba(28, 22, 17, 0.72);
  --nav-scrolled: rgba(28, 22, 17, 0.92);
  --page-effects:
    linear-gradient(180deg, rgba(28, 22, 17, 0.96), rgba(36, 29, 23, 0.96)),
    radial-gradient(circle at 80% 18%, rgba(47, 146, 123, 0.16), transparent 30%),
    radial-gradient(circle at 18% 72%, rgba(120, 160, 255, 0.10), transparent 28%);
  --logo-filter: invert(91%) sepia(7%) saturate(420%) hue-rotate(354deg) brightness(95%) contrast(88%);
}

body { color: var(--ink); }
.page-glow { background: var(--page-effects); opacity: 1; }
a { text-decoration-thickness: 0.08em; text-underline-offset: 0.12em; }

.topbar,
.home-breathe-page .topbar {
  min-height: 72px;
  padding: 0 max(28px, calc((100vw - 1240px) / 2));
  gap: 0;
  background: var(--nav-scrolled);
  border-bottom: 1px solid var(--line);
}
.topbar .brand :is(img, .flat-logo) { width: 166px; color: var(--ink); filter: none; }
.topbar .nav-actions { gap: 18px; }
.topbar .nav-actions a { font-size: var(--type-normal); }
.topbar .theme-toggle {
  display: inline-flex;
  width: 36px;
  min-width: 36px;
  height: 30px;
  min-height: 30px;
  padding: 0;
  flex: 0 0 36px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--paper-glass);
  color: var(--ink);
  font-size: var(--type-normal);
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}
.topbar .theme-toggle:hover { border-color: var(--line-strong); }

.footer {
  width: min(1240px, calc(100% - 56px));
  margin-inline: auto;
  min-height: 180px;
  padding: 36px 0;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  gap: 18px 32px;
  align-items: start;
}
.footer > p {
  grid-column: 1;
  grid-row: 1;
  max-width: 760px;
  color: var(--muted);
}
.footer-links {
  grid-column: 2;
  grid-row: 1;
  justify-content: end;
  align-self: start;
  gap: 22px;
}
.footer-family-links {
  grid-column: 1 / -1;
  grid-row: 2;
  display: flex;
  flex: none;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start !important;
  gap: 16px;
  width: 100%;
  margin: 0;
  padding: 20px 0 0;
  border-top: 1px solid var(--line);
}
.footer-family-links .family-site-link {
  display: inline-flex;
  width: 112px;
  min-height: 0;
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 4px;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 180ms ease, opacity 180ms ease;
}
.footer-family-links .family-site-link:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}
.footer-family-links .family-site-link:hover:not(:focus-visible) {
  outline: none;
}
.footer-family-links .family-site-logo {
  display: block;
  width: 112px !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  color: var(--ink);
  filter: none !important;
}

@media (min-width: 761px) and (max-width: 1200px) {
  .topbar .theme-toggle { width: 40px; min-width: 40px; height: 38px; min-height: 38px; flex-basis: 40px; }
}

@media (max-width: 760px) {
  .topbar,
  .home-breathe-page .topbar { padding-inline: 16px; min-height: 78px; }
  .topbar .brand :is(img, .flat-logo) { width: 166px; }
  .topbar .theme-toggle { width: 40px; min-width: 40px; height: 40px; min-height: 40px; flex-basis: 40px; }
  .footer {
    width: calc(100% - 32px);
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    gap: 18px;
  }
  .footer > p { grid-column: 1; grid-row: 1; }
  .footer-links { grid-column: 1; grid-row: 2; justify-content: flex-start; }
  .footer-family-links { grid-column: 1; grid-row: 3; gap: 12px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .footer-family-links .family-site-link,
  .topbar .theme-toggle { transition: none; }
}