/*
Theme Name: SG Handwerk
Description: Block-Theme für die Website der SG Handwerk Magdeburg. Konzeption, Gestaltung und Umsetzung: Adrian Schaefer.
Author: Adrian Schaefer
Version: 0.71.0
Requires at least: 6.6
Requires PHP: 8.1
Text Domain: sg-handwerk
License: GPL-2.0-or-later
*/

/* ---------------------------------------------------------------------------
   1. Tokens. Colours, sizes and spacing come from theme.json presets; the
   values below complete them. No other stylesheet sets a fixed colour.
   --------------------------------------------------------------------------- */

/* Metric-matched fallbacks: line breaks stay put while the web fonts load. */
@font-face { font-family: "SGH Text Fallback"; src: local("Arial"), local("ArialMT"); size-adjust: 92.87%; ascent-override: 110.26%; descent-override: 43.07%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Semi Condensed Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"); font-weight: 700; size-adjust: 83.71%; ascent-override: 119.46%; descent-override: 23.89%; line-gap-override: 0%; }

:root {
  color-scheme: light;
  --sgh-ink-2: #3D4152;
  --sgh-line-strong: #7C7F8F;
  --sgh-on-brand: #FFFFFF;
  --sgh-on-brand-2: #C9CBF2;
  --sgh-on-brand-line: rgb(255 255 255 / .24);
  --sgh-brand-press: #0B0B8C;
  --sgh-focus: #B35C00;
  --sgh-danger: #B42318;
  --sgh-success: #0E7646;
  --sgh-info: var(--wp--custom--color--link);
  --sgh-on-brand-tint: #ECECFA; /* surface on club blue when pointed at, in both schemes */
  --sgh-shadow: 0 12px 32px rgb(20 21 31 / .14);
  --sgh-hair: 1px solid var(--wp--preset--color--line);
  --sgh-rule: 1px solid var(--wp--preset--color--ink);
  --sgh-brandline: 4px solid var(--wp--preset--color--brand);
  --sgh-gutter: clamp(1.25rem, .6rem + 2.8vw, 3rem);
  --sgh-measure: 42rem;
  --sgh-contour-on-paper: var(--wp--custom--color--link); /* contour lines on paper (light: club blue, dark: #9AA2FF) */
  --sgh-contour-quiet: .16;
  --sgh-h-control: 2.75rem;
  --sgh-h-bar: 3rem;
  --sgh-dur-1: 120ms;
  --sgh-dur-2: 180ms;
  --sgh-ease: cubic-bezier(.2, .7, .2, 1);
}
@media (prefers-reduced-motion: reduce) { :root { --sgh-dur-1: 0ms; --sgh-dur-2: 0ms; } }

/* Dark appearance after the device setting: only token values change. Club blue stays the
   colour of bands, footer and buttons, a little deeper on large surfaces so they do not glare
   against the dark page; blue text becomes lighter to stay readable. Logos keep a light
   surface, because many of them are dark marks on a transparent ground. */
:root { --sgh-logo-surface: #FFFFFF; --sgh-logo-ink: #14151F; --sgh-brand-surface: var(--wp--preset--color--brand); --sgh-accent: var(--wp--preset--color--brand); --sgh-accent-surface: var(--wp--preset--color--brand); }
@media (prefers-color-scheme: dark) {
  :root:not([data-scheme="light"]) {
    color-scheme: dark;
    --wp--preset--color--paper: #0E0F1A;
    --wp--preset--color--surface: #161827;
    --wp--preset--color--tint: #1C1F33;
    --wp--preset--color--line: #2A2D42;
    --wp--preset--color--muted: #9A9DAE;
    --wp--preset--color--ink: #ECEDF3;
    --wp--custom--color--link: #9AA2FF;
    --sgh-ink-2: #C4C6D2;
    --sgh-line-strong: #6C7088;
    --sgh-focus: #F0A43A;
    --sgh-danger: #FB6957;
    --sgh-success: #3FBF7F;
    --sgh-brand-press: #3F47E0;
    --sgh-shadow: 0 12px 32px rgb(0 0 0 / .55);
    --sgh-brand-surface: #0C0C8E;
    --sgh-accent: #7C84FF;
    --sgh-accent-surface: #3F47E0;
    --sgh-logo-surface: #EDEDE8;
  }
}
/* The same values when the visitor chooses dark in the footer switch (inc/scheme.php). */
:root[data-scheme="dark"] {
  color-scheme: dark;
  --wp--preset--color--paper: #0E0F1A;
  --wp--preset--color--surface: #161827;
  --wp--preset--color--tint: #1C1F33;
  --wp--preset--color--line: #2A2D42;
  --wp--preset--color--muted: #9A9DAE;
  --wp--preset--color--ink: #ECEDF3;
  --wp--custom--color--link: #9AA2FF;
  --sgh-ink-2: #C4C6D2;
  --sgh-line-strong: #6C7088;
  --sgh-focus: #F0A43A;
  --sgh-danger: #FB6957;
  --sgh-success: #3FBF7F;
  --sgh-brand-press: #3F47E0;
  --sgh-shadow: 0 12px 32px rgb(0 0 0 / .55);
  --sgh-brand-surface: #0C0C8E;
  --sgh-accent: #7C84FF;
  --sgh-accent-surface: #3F47E0;
  --sgh-logo-surface: #EDEDE8;
}
:root[data-scheme="light"] { color-scheme: light; }

/* ---------------------------------------------------------------------------
   2. Base
   --------------------------------------------------------------------------- */
a[href^="mailto:"] { white-space: nowrap; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 2rem; }
body { margin: 0; -webkit-font-smoothing: antialiased; font-variant-numeric: tabular-nums; }
img { max-width: 100%; height: auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); border: 0; white-space: nowrap; }
a { text-decoration-color: var(--sgh-line-strong); text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color var(--sgh-dur-1) var(--sgh-ease), text-decoration-color var(--sgh-dur-1) var(--sgh-ease); }
a:hover { text-decoration-color: currentColor; text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--sgh-focus); outline-offset: 3px; }
.sgh-masthead, .sgh-footer, .sgh-ref-band { --sgh-focus: var(--sgh-on-brand); }
strong, b { font-weight: 700; }
.wp-site-blocks > *, .sgh-home > *, .sgh-home .wp-block-post-content > *, .sgh-team-page > *, .sgh-team-page .wp-block-post-content > *, .sgh-contact-page > *, .sgh-contact-page .wp-block-post-content > * { margin-block-start: 0; }
.wp-site-blocks { background: var(--wp--preset--color--paper); }

/* German titles break at word boundaries, with language-aware hyphenation. */
/* Headings break between words and are balanced over their lines; only long compounds
   ("Herrenmannschaft") may be hyphenated, short words like "letzten" stay whole. */
.wp-site-blocks .wp-block-post-title, .wp-site-blocks .wp-block-post-title a, h1, h2, h3 { word-break: normal; overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 12 5 5; -webkit-hyphenate-limit-before: 5; -webkit-hyphenate-limit-after: 5; text-wrap: balance; }
h1, h2, h3, h4 { font-variant-numeric: tabular-nums; text-wrap: balance; }
.wp-block-image .wp-element-caption, .wp-block-video .wp-element-caption, .wp-block-gallery .wp-element-caption { text-align: left; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
p { text-wrap: pretty; }

/* ---------------------------------------------------------------------------
   3. Layout
   --------------------------------------------------------------------------- */
.sgh-shell { width: min(1240px, 100% - 2 * var(--sgh-gutter)); margin-inline: auto; }
.sgh-reading { width: min(var(--sgh-measure), 100% - 2 * var(--sgh-gutter)); margin-inline: auto; overflow-wrap: anywhere; }
.sgh-shell .sgh-reading { width: min(var(--sgh-measure), 100%); }
.sgh-reading { margin-left: max(var(--sgh-gutter), (100% - 1240px) / 2); margin-right: auto; }
.sgh-shell .sgh-reading { margin-left: 0; }
.sgh-section { padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--80); }
.sgh-page-content { padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--90); }
.sgh-page-content > .wp-block-post-title, .sgh-section > h1, .sgh-section > .wp-block-query-title { margin-block: 0 var(--wp--preset--spacing--50); }
/* Contour lines in the page head of section pages (main with the class sgh-head-lines, set in the templates
   verein-breit, verein-mit-seitentitel, home, kontakt-inhalt and sponsoren). Rings around a small pitch, drawn with the
   same calculation as the footer lines (assets/head-contours.svg); hairlines in the link colour at 16 %, fading out
   towards the title and the lead. This is the page's one line area between header and footer, never over a photo. */
.wp-site-blocks:has(> main.sgh-head-lines) { overflow-x: clip; }
main.sgh-head-lines { position: relative; isolation: isolate; }
main.sgh-head-lines::before {
  content: ""; position: absolute; z-index: -1; top: 0; left: calc(50% - 50vw); right: calc(50% - 50vw); height: 30rem; pointer-events: none;
  background: var(--sgh-contour-on-paper); opacity: var(--sgh-contour-quiet);
  -webkit-mask-image: url("assets/head-contours.svg"), linear-gradient(to right, transparent 22%, #000 62%), linear-gradient(#000 40%, transparent);
          mask-image: url("assets/head-contours.svg"), linear-gradient(to right, transparent 22%, #000 62%), linear-gradient(#000 40%, transparent);
  -webkit-mask-size: 1600px 640px, 100% 100%, 100% 100%; mask-size: 1600px 640px, 100% 100%, 100% 100%;
  -webkit-mask-position: right -4rem top -8rem, 0 0, 0 0; mask-position: right -4rem top -8rem, 0 0, 0 0;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-composite: source-in, source-in; mask-composite: intersect;
}
@media (max-width: 599px) {
  main.sgh-head-lines::before {
    height: 16rem;
    -webkit-mask-position: right -16rem top -13rem, 0 0, 0 0; mask-position: right -16rem top -13rem, 0 0, 0 0;
    -webkit-mask-image: url("assets/head-contours.svg"), linear-gradient(to right, transparent 30%, #000 85%), linear-gradient(#000 30%, transparent);
            mask-image: url("assets/head-contours.svg"), linear-gradient(to right, transparent 30%, #000 85%), linear-gradient(#000 30%, transparent);
  }
}
/* Space before the sponsor band and footer; core removes the last child's bottom margin. */
main.sgh-home, main.sgh-team-page, main.sgh-contact-page, main.sgh-single { padding-bottom: var(--wp--preset--spacing--80); }
main.sgh-single { overflow-x: clip; }

/* ---------------------------------------------------------------------------
   4. Shared parts: labels, section bars, lead, links, buttons
   --------------------------------------------------------------------------- */
.sgh-label, .sgh-kicker, .sgh-ref-label, h2.sgh-ref-label, h2.sgh-label, h3.sgh-label {
  margin: 0 0 .75rem; font-family: var(--wp--preset--font-family--heading); font-size: var(--wp--preset--font-size--label);
  font-weight: 700; line-height: 1.3; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--custom--color--link); -webkit-hyphens: manual; hyphens: manual;
}
.sgh-bar, .sgh-editorial-sectionhead, .sgh-section-heading {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem 1rem; min-height: var(--sgh-h-bar); padding-block: .5rem;
  margin: 0 0 var(--wp--preset--spacing--50); border-top: var(--sgh-rule); border-bottom: var(--sgh-hair);
}
.sgh-bar > *, .sgh-editorial-sectionhead > *, .sgh-section-heading > *, .sgh-bar > .sgh-label { margin: 0; }
.sgh-bar { align-items: baseline; align-content: center; }
.sgh-editorial-sectionhead h2, .sgh-section-heading h2, .sgh-bar h2 {
  font-size: var(--wp--preset--font-size--label); letter-spacing: .1em; text-transform: uppercase; line-height: 1.3;
}
.sgh-bar-aside { margin: 0; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-count, .sgh-n { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--wp--custom--color--link); }
.sgh-lead { max-width: 34em; font-size: var(--wp--preset--font-size--lead); line-height: 1.5; color: var(--sgh-ink-2); }
.sgh-small { font-size: var(--wp--preset--font-size--meta); line-height: 1.6; color: var(--wp--preset--color--muted); }
.sgh-text-link { font-size: var(--wp--preset--font-size--meta); font-weight: 600; }
.sgh-text-link a, .sgh-back a { text-decoration: none; }
.sgh-text-link a:hover, .sgh-back a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.sgh-back { margin: 0 0 var(--wp--preset--spacing--50); font-size: var(--wp--preset--font-size--meta); font-weight: 600; }
.sgh-added-context { color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--meta); }
:is(h2, h3, h4).sgh-added-context { color: inherit; font-size: revert-layer; }
/* A note that opens a page (Turniere, Formulare, Freundschaftsspiele) is that page's lead and looks like .sgh-lead. */
.sgh-page-content > .wp-block-post-content > p.sgh-added-context:first-child { max-width: 34em; font-size: var(--wp--preset--font-size--lead); line-height: 1.5; color: var(--sgh-ink-2); }
/* Standalone text links: larger tap area without moving the layout (at least 44px on touch screens). */
.sgh-text-link a, .sgh-sponsors-label a, .sgh-club-links a, .sgh-back a { display: inline-block; padding-block: 8px; margin-block: -8px; }
@media (pointer: coarse) { .sgh-text-link a, .sgh-sponsors-label a, .sgh-club-links a, .sgh-back a { padding-block: 13px; margin-block: -13px; } }

/* Buttons: primary in club blue, secondary with a thin frame, square corners. */
.wp-block-button__link { min-height: var(--sgh-h-control); display: inline-flex; align-items: center; transition: background-color var(--sgh-dur-1) var(--sgh-ease), color var(--sgh-dur-1) var(--sgh-ease); }
.wp-block-button__link:hover { background: var(--sgh-brand-press); color: var(--sgh-on-brand); }
.wp-block-button.is-style-outline .wp-block-button__link { padding: calc(.8125rem - 1px) calc(1.25rem - 1px); border: 1px solid var(--sgh-line-strong); background: transparent; color: var(--wp--custom--color--link); }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--tint); color: var(--wp--custom--color--link); }

/* Fact sheet: table block style for teams, match data and contact details. */
.is-style-sgh-steckbrief table, .sgh-team-info table { width: 100%; border-collapse: collapse; }
.is-style-sgh-steckbrief tr, .sgh-team-info tr { border-bottom: var(--sgh-hair); }
.is-style-sgh-steckbrief tr:first-child, .sgh-team-info tr:first-child { border-top: var(--sgh-rule); }
.is-style-sgh-steckbrief th, .sgh-team-info th {
  width: 9.5rem; padding: .8rem 1rem .8rem 0; border: 0; text-align: left; vertical-align: top;
  font: 700 var(--wp--preset--font-size--label)/1.6 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted);
}
.is-style-sgh-steckbrief td, .sgh-team-info td { padding: .8rem 0; border: 0; text-align: left; vertical-align: top; }
.is-style-sgh-steckbrief figcaption, .sgh-team-info figcaption { margin-top: .5rem; text-align: left; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-team-info caption { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }

/* Ordered steps: numbers 01, 02 … in the display face. */
.is-style-sgh-schritte, .sgh-steps { margin: 0; padding: 0; list-style: none; counter-reset: sgh-step; border-top: var(--sgh-rule); }
.is-style-sgh-schritte > li, .sgh-steps > li { counter-increment: sgh-step; }
.is-style-sgh-schritte > li::before, .sgh-steps > li::before {
  content: counter(sgh-step, decimal-leading-zero); font: 700 2.75rem/1 var(--wp--preset--font-family--heading);
  font-variant-numeric: tabular-nums; color: var(--wp--custom--color--link);
}

/* Questions and answers. */
.wp-block-details { margin: 0; border-bottom: var(--sgh-hair); }
.wp-block-details:first-of-type { border-top: var(--sgh-hair); }
.wp-block-details > summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 3.5rem; padding-block: .75rem; font-weight: 600; cursor: pointer; list-style: none; }
.wp-block-details > summary::-webkit-details-marker { display: none; }
.wp-block-details > summary::after { content: "+"; flex-shrink: 0; font: 400 1.75rem/1 var(--wp--preset--font-family--text); color: var(--wp--custom--color--link); transition: transform 150ms var(--sgh-ease); }
.wp-block-details[open] > summary::after { transform: rotate(45deg); }
.wp-block-details > :not(summary) { max-width: 46em; }
.wp-block-details > p:last-child { margin-bottom: 1.25rem; }

/* ---------------------------------------------------------------------------
   5. Reports: cards in grids, the lead story, pagination
   --------------------------------------------------------------------------- */
.sgh-news-grid { margin-top: 0; }
.sgh-news-grid .wp-block-post-template { gap: 0; border-top: var(--sgh-hair); }
.sgh-news-grid .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: calc(2 * var(--wp--preset--spacing--50)); row-gap: 0; }
/* Equal columns; the hairlines sit in the middle of the gaps and run on under them. */
.sgh-news-grid .wp-block-post { margin-top: 0; min-width: 0; padding: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--60); }
.sgh-news-grid .wp-block-post::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; border-bottom: var(--sgh-hair); pointer-events: none; }
.sgh-news-grid .wp-block-post:not(:nth-child(3n + 1))::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(-1 * var(--wp--preset--spacing--50)); border-left: var(--sgh-hair); pointer-events: none; }
.sgh-news-grid .wp-block-post:not(:nth-child(3n + 1))::after { left: calc(-2 * var(--wp--preset--spacing--50)); }
.sgh-news-grid .wp-block-post-featured-image { margin: 0; }
.sgh-news-grid .wp-block-post-featured-image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: var(--sgh-focus, 50% 50%); }
.sgh-news-copy { padding-top: var(--wp--preset--spacing--40); }
.sgh-news-copy > * { margin-top: 0; }
.sgh-news-copy .wp-block-post-date, .sgh-report-meta { margin: 0; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-news-copy .wp-block-post-title { margin-block: .375rem .5rem; font-size: var(--wp--preset--font-size--headline-m); line-height: 1.12; }
.sgh-news-copy .wp-block-post-title a { color: inherit; text-decoration: none; }
.sgh-news-copy .wp-block-post-excerpt { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: var(--sgh-ink-2); }
.sgh-news-copy .wp-block-post-excerpt__excerpt { display: -webkit-box; margin: 0; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; min-height: 3em; }
.sgh-news-copy .wp-block-post-excerpt__more-text { display: none; }
.wp-block-query-pagination { gap: .5rem; margin-top: var(--wp--preset--spacing--60); font-size: var(--wp--preset--font-size--small); }
.wp-block-query-pagination a, .wp-block-query-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: var(--sgh-h-control); min-height: var(--sgh-h-control); padding: 0 .5rem; text-decoration: none; }
.wp-block-query-pagination .page-numbers.current { color: var(--wp--custom--color--link); font-weight: 700; box-shadow: inset 0 -3px 0 var(--wp--custom--color--link); }

/* Report meta line: team as label, date in numbers. */
.sgh-report-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .6rem; }
.sgh-report-team { font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--custom--color--link); }
.sgh-report-meta time { font-variant-numeric: tabular-nums; }

/* One target per card (see inc/interaction.php): the title link covers the card. */
.sgh-news-grid .wp-block-post, .sgh-lead-story .wp-block-post { position: relative; }
.sgh-news-grid .wp-block-post-title a::after, .sgh-lead-story .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.wp-block-post-featured-image img, .sgh-article-image img { background: var(--wp--preset--color--tint); }
.sgh-news-grid .wp-block-post-featured-image img, .sgh-lead-story .wp-block-post-featured-image img { transition: filter var(--sgh-dur-1) var(--sgh-ease); }
@media (hover: hover) {
  .sgh-news-grid .wp-block-post:hover .wp-block-post-title a, .sgh-lead-story .wp-block-post:hover .wp-block-post-title a { color: var(--wp--custom--color--link); text-decoration: underline; text-decoration-thickness: 2px; }
}
.sgh-news-grid .wp-block-post:active .wp-block-post-featured-image img, .sgh-lead-story .wp-block-post:active .wp-block-post-featured-image img { filter: brightness(.94); }
.sgh-news-grid .wp-block-post-title a:focus-visible, .sgh-lead-story .wp-block-post-title a:focus-visible { outline: none; }
.sgh-news-grid .wp-block-post:has(.wp-block-post-title a:focus-visible), .sgh-lead-story .wp-block-post:has(.wp-block-post-title a:focus-visible) { outline: 2px solid var(--sgh-focus); outline-offset: 4px; }

/* ---------------------------------------------------------------------------
   5b. News archive with filters (inc/report-archive.php, assets/report-archive.js)
   --------------------------------------------------------------------------- */
.sgh-report-summary { margin: 0 0 var(--wp--preset--spacing--60); }
.sgh-archive { display: grid; grid-template-columns: 16.5rem minmax(0, 1fr); column-gap: 3rem; align-items: start; }
/* No scrollbar of its own: a column taller than the window moves with the page (assets/report-archive.js sets top). */
.sgh-filter-panel { position: sticky; top: 1.5rem; }
.sgh-filter-toggle { display: none; }
.sgh-facets > * { margin: 0; }
.sgh-facet-search { margin-bottom: var(--wp--preset--spacing--50) !important; padding-top: .9rem; border-top: var(--sgh-rule); }
.sgh-facet-search label { display: block; margin-bottom: .5rem; }
.sgh-facet-search input { width: 100%; min-height: var(--sgh-h-control); padding: .5rem .75rem; border: 1px solid var(--sgh-line-strong); border-radius: 0; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font: inherit; font-size: var(--wp--preset--font-size--small); }
.sgh-facet { margin: 0 0 var(--wp--preset--spacing--50); padding: 0; border: 0; border-top: var(--sgh-rule); min-width: 0; }
.sgh-facet legend { float: left; width: 100%; margin: 0; padding: .9rem 0 .25rem; }
.sgh-facet legend + * { clear: both; }
.sgh-facet-group { clear: both; margin: .75rem 0 0; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-option { display: grid; grid-template-columns: 1.375rem minmax(0, 1fr) 4ch; align-items: center; gap: .5rem; min-height: var(--sgh-h-control); border-bottom: var(--sgh-hair); cursor: pointer; font-size: var(--wp--preset--font-size--small); transition: background-color var(--sgh-dur-1) var(--sgh-ease); }
.sgh-option input { width: 1.125rem; height: 1.125rem; margin: 0; accent-color: var(--sgh-accent); }
.sgh-option:has(input:checked) { box-shadow: inset 3px 0 0 var(--wp--custom--color--link); padding-left: .5rem; font-weight: 600; }
.sgh-option:has(input:focus-visible) { outline: 2px solid var(--sgh-focus); outline-offset: -2px; }
@media (hover: hover) { .sgh-option:hover { background: var(--wp--preset--color--tint); } }
.sgh-option .sgh-n { justify-self: end; font-size: 1rem; }
.sgh-option.is-zero, .sgh-option.is-zero .sgh-n { color: var(--wp--preset--color--muted); }
.sgh-facets-submit { margin-top: 1rem; }
/* Seasons as a compact board of small cells: the whole filter fits beside the list. */
.sgh-facet-options.is-seasons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: .5rem; padding: 1px; }
.sgh-facet-options.is-seasons .sgh-option { position: relative; grid-template-columns: minmax(0, 1fr); gap: 0; align-content: center; justify-items: start; min-height: 3.25rem; padding: .375rem .5rem; border: 0; outline: 1px solid var(--wp--preset--color--line); }
.sgh-facet-options.is-seasons .sgh-option input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.sgh-facet-options.is-seasons .sgh-option-name { font-weight: 600; font-variant-numeric: tabular-nums; }
.sgh-facet-options.is-seasons .sgh-option .sgh-n { justify-self: start; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-facet-options.is-seasons .sgh-option:has(input:checked) { padding-left: .5rem; box-shadow: none; background: var(--sgh-accent-surface); color: var(--sgh-on-brand); outline-color: var(--sgh-accent-surface); z-index: 1; }
.sgh-facet-options.is-seasons .sgh-option:has(input:checked) .sgh-n { color: inherit; }
.sgh-facet-options.is-seasons .sgh-option:has(input:focus-visible) { outline: 2px solid var(--sgh-focus); outline-offset: 2px; z-index: 2; }
/* Reports per season as a fine bar at the foot of each cell; it follows the other filters. */
.sgh-season-bar { position: absolute; left: .5rem; bottom: .3rem; width: calc((100% - 1rem) * var(--n, 0)); height: 2px; background: var(--wp--custom--color--link); opacity: .55; transition: width var(--sgh-dur-2) var(--sgh-ease); }
.sgh-facet-options.is-seasons .sgh-option:has(input:checked) .sgh-season-bar { background: var(--sgh-on-brand); opacity: .8; }
@media (min-width: 1200px) { .sgh-facet:not([data-facet="saison"]) .sgh-option { min-height: 2.375rem; } }
.sgh-results > .sgh-bar { margin-bottom: 0; }
.sgh-chips { display: flex; flex-wrap: wrap; gap: .5rem; padding-block: .75rem; }
.sgh-chips[hidden] { display: none; }
.sgh-chip { position: relative; min-height: 2rem; padding: 0 .75rem; border: 1px solid var(--sgh-line-strong); border-radius: 0; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font: inherit; font-size: var(--wp--preset--font-size--meta); cursor: pointer; }
.sgh-chip::after { content: ""; position: absolute; inset: -.375rem 0; }
.sgh-chip:hover { border-color: var(--wp--custom--color--link); color: var(--wp--custom--color--link); }
.sgh-chip.is-reset { border-color: transparent; background: none; color: var(--wp--custom--color--link); text-decoration: underline; text-underline-offset: .2em; }
.sgh-empty { margin: var(--wp--preset--spacing--50) 0; }
.sgh-season { margin: 0; }
.sgh-results > .sgh-season:first-of-type .sgh-season-head { margin-top: var(--wp--preset--spacing--40); }
.sgh-season-head { display: flex; justify-content: space-between; align-items: center; min-height: var(--sgh-h-bar); margin: var(--wp--preset--spacing--60) 0 0; border-bottom: var(--sgh-rule); font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; }
.sgh-season-head .sgh-n { font-size: 1rem; letter-spacing: 0; }
.sgh-rows { margin: 0; padding: 0; list-style: none; }
.sgh-row { border-bottom: var(--sgh-hair); }
/* "Weitere Berichte": the script loads more rows before this comes into view; the button stays as a fallback. */
.sgh-more { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: var(--wp--preset--spacing--50) 0 0; }
.sgh-more[hidden] { display: none; }
.sgh-more-note { color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--meta); }
.sgh-row-link { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); column-gap: 1.25rem; padding: 1rem .75rem; margin-inline: -.75rem; color: inherit; text-decoration: none; transition: background-color var(--sgh-dur-1) var(--sgh-ease); }
.sgh-row-media { display: block; }
.sgh-row-img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: var(--sgh-focus, 50% 50%); background: var(--wp--preset--color--tint); }
/* A report without a photo: club blue with contour lines and the crest, like the team photo placeholder. The same picture
   in the archive rows and in the news grids (functions.php). Lines: assets/report-contours.svg, made by
   work/entwuerfe-2026-10/platzhalter/berichtsbild.py. */
.sgh-row-img.is-empty { position: relative; background: var(--sgh-brand-surface) url("assets/report-contours.svg") center / cover no-repeat; }
.sgh-row-img.is-empty::after { content: ""; position: absolute; inset: 0; background: url("assets/sg-handwerk-wappen.svg") center 46% / auto 44% no-repeat;
  filter: drop-shadow(0 4px 10px rgb(0 0 20 / .35)); }
.sgh-row-body { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.sgh-row-title { font: 700 var(--wp--preset--font-size--headline-s)/1.2 var(--wp--preset--font-family--heading); }
.sgh-row-excerpt { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: var(--sgh-ink-2); }
.sgh-row-excerpt mark { padding: 0; background: var(--wp--preset--color--tint); color: var(--wp--preset--color--ink); font-weight: 600; box-shadow: inset 0 -2px 0 var(--wp--custom--color--link); }
@media (hover: hover) {
  .sgh-row-link:hover { background: var(--wp--preset--color--tint); box-shadow: inset 3px 0 0 var(--wp--custom--color--link); }
  .sgh-row-link:hover .sgh-row-title { color: var(--wp--custom--color--link); }
}
.sgh-row-link:focus-visible { outline: 2px solid var(--sgh-focus); outline-offset: 0; box-shadow: inset 3px 0 0 var(--wp--custom--color--link); }
@media (max-width: 1199px) {
  .sgh-archive { display: block; }
  .sgh-filter-panel { position: static; max-height: none; overflow: visible; margin-inline: 0; padding-inline: 0; margin-bottom: var(--wp--preset--spacing--50); border-top: var(--sgh-rule); border-bottom: var(--sgh-hair); }
  .sgh-filter-toggle { display: flex; align-items: center; gap: .5rem; min-height: var(--sgh-h-bar); cursor: pointer; list-style: none; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; }
  .sgh-filter-toggle::-webkit-details-marker { display: none; }
  .sgh-filter-toggle::after { content: "+"; margin-left: auto; font: 400 1.5rem/1 var(--wp--preset--font-family--text); color: var(--wp--custom--color--link); }
  .sgh-filter-panel[open] .sgh-filter-toggle::after { content: "–"; }
  .sgh-filter-active { min-width: 1.5rem; padding: .125rem .375rem; background: var(--wp--preset--color--brand); color: var(--sgh-on-brand); text-align: center; letter-spacing: 0; }
  .sgh-facets { padding-bottom: var(--wp--preset--spacing--40); }
  .sgh-facet-search { border-top: var(--sgh-hair); }
  .sgh-facet-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1rem; }
  .sgh-facet-options.is-seasons { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* One bar instead of two: the count moves into the filter bar, the results bar stays for screen readers. */
  .sgh-filter-total { margin-left: auto; font: 400 var(--wp--preset--font-size--meta)/1 var(--wp--preset--font-family--text); letter-spacing: 0; text-transform: none; color: var(--wp--preset--color--muted); }
  .sgh-filter-toggle::after { margin-left: .75rem; }
  .sgh-results > .sgh-bar { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .sgh-results > .sgh-season:first-of-type .sgh-season-head { margin-top: 0; }
  .sgh-filter-apply { position: sticky; bottom: 0; z-index: 2; margin: 0; padding-block: .75rem; background: var(--wp--preset--color--paper); border-top: var(--sgh-hair); }
  .sgh-filter-apply[hidden] { display: none; }
  .sgh-filter-apply .wp-element-button { width: 100%; }
}
@media (min-width: 1200px) { .sgh-filter-total, .sgh-filter-apply { display: none; } }
@media (max-width: 599px) {
  .sgh-row-link { grid-template-columns: 5.5rem minmax(0, 1fr); column-gap: 1rem; }
  .sgh-row-excerpt { display: none; }
  .sgh-row-excerpt:has(mark) { display: -webkit-box; -webkit-line-clamp: 3; font-size: var(--wp--preset--font-size--meta); }
  .sgh-facet-options.is-seasons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sgh-chips { flex-wrap: nowrap; overflow-x: auto; }
  .sgh-chip { flex: 0 0 auto; }
}

/* Result in report rows and cards (sgh_report_score_html in inc/report-archive.php, the same markup in
   assets/report-archive.js): the score from SG Handwerk's side on a small plate in the colours of the band's
   stamp (blue for a win, tinted for a draw, grey for a defeat), the outcome as a word beside it. */
.sgh-score { display: inline-flex; align-items: baseline; gap: .375rem; white-space: nowrap; }
.sgh-score-num { padding: .0625rem .375rem; font: 700 var(--wp--preset--font-size--meta)/1.25 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; letter-spacing: .02em; background: var(--sgh-accent-surface); color: var(--sgh-on-brand); }
.sgh-score.is-draw .sgh-score-num { background: var(--wp--preset--color--tint); color: var(--wp--preset--color--ink); box-shadow: inset 0 0 0 1px var(--wp--preset--color--line); }
.sgh-score.is-loss .sgh-score-num { background: var(--wp--preset--color--line); color: var(--wp--preset--color--ink); box-shadow: inset 0 0 0 1px var(--wp--preset--color--line); }
@media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) .sgh-score.is-loss .sgh-score-num { background: var(--wp--preset--color--surface); } }
:root[data-scheme="dark"] .sgh-score.is-loss .sgh-score-num { background: var(--wp--preset--color--surface); }
.sgh-score-word { color: var(--wp--preset--color--muted); }

/* ---------------------------------------------------------------------------
   6. Single report: head, picture and text share one 66rem column; the match
   data stands beside the text on wide screens (inc/report-facts.php).
   --------------------------------------------------------------------------- */
.sgh-article { width: min(66rem, 100% - 2 * var(--sgh-gutter)); margin-left: max(var(--sgh-gutter), (100% - 1240px) / 2); margin-right: auto; }
.sgh-article-head { padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--60); }
.sgh-article-head > * { margin-block: 0; }
/* Path above the title (inc/reports.php): Aktuelles › team › season in the style of a label, the team in link colour.
   Each link's tap area is enlarged invisibly to 45px; on narrow phones the line may wrap between the parts. */
.sgh-path ol { display: flex; flex-wrap: wrap; align-items: baseline; gap: 1rem .55rem; margin: 0; padding: 0; list-style: none; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-path li { display: inline-flex; align-items: baseline; gap: .55rem; }
.sgh-path-sep { font-weight: 600; letter-spacing: 0; }
.sgh-path a { display: inline-block; padding-block: 15px; margin-block: -15px; color: var(--wp--preset--color--muted); text-decoration: none; }
.sgh-path .sgh-path-team { color: var(--wp--custom--color--link); }
.sgh-path a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .25em; }
.sgh-article-head .wp-block-post-title { max-width: 18ch; margin-block: .75rem 1rem; }
.sgh-article-head .sgh-path + .wp-block-post-title { margin-top: .9rem; }
.sgh-article-head .wp-block-post-date { font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-article-dateline { align-items: center; gap: .25rem 1.25rem; }
.sgh-article-dateline > * { margin: 0; }
.sgh-share[hidden] { display: none; }
.sgh-share-button { display: inline-flex; align-items: center; gap: .4rem; min-height: var(--sgh-h-control); margin-block: calc((var(--sgh-h-control) - 1.5rem) / -2); padding: 0; border: 0; background: none; color: var(--wp--custom--color--link); font: 600 var(--wp--preset--font-size--meta)/1.5 var(--wp--preset--font-family--text); cursor: pointer; }
.sgh-share-button:hover span { text-decoration: underline; text-underline-offset: .2em; }
.sgh-article-image { margin: 0 0 var(--wp--preset--spacing--60); }
/* At most as tall as the screen: tall pictures are cropped around their detail (inc/image-focus.php). */
.sgh-article-image img { display: block; width: 100%; height: auto; max-height: 100vh; max-height: 100svh; object-fit: cover; object-position: var(--sgh-focus, 50% 50%); }
.sgh-article-body .wp-block-post-content { font-size: var(--wp--preset--font-size--reading); line-height: 1.65; overflow-wrap: anywhere; }
.sgh-article-body .wp-block-post-content > *, .sgh-report-text > * { max-width: var(--sgh-measure); }
.sgh-article-body .wp-block-post-content > .sgh-report-grid { max-width: none; }
.sgh-article-body .wp-block-post-content p { margin-block: 0 1em; }
.sgh-article-body .wp-block-post-content img { height: auto; }
.sgh-article-body .wp-block-post-content :is(iframe, figure) { max-width: 100%; }
.sgh-article-body h2 { margin-top: 2em; font-size: var(--wp--preset--font-size--headline-m); }
.sgh-article-body h3 { margin-top: 1.75em; font-size: var(--wp--preset--font-size--headline-s); }
.sgh-article-body pre { white-space: pre-wrap; font: inherit; }
.sgh-report-grid { display: grid; grid-template-columns: minmax(0, var(--sgh-measure)) 20rem; column-gap: 4rem; align-items: start; }
.sgh-report-text > :last-child { margin-bottom: 0; }
.sgh-facts { position: sticky; top: 1.5rem; padding: 1rem 0 .5rem; border-top: 4px solid var(--wp--preset--color--brand); border-bottom: var(--sgh-hair); font-size: var(--wp--preset--font-size--small); line-height: 1.5; }
.sgh-facts .sgh-fact:last-child { border-bottom: 0; }
.sgh-article-body .sgh-facts > h2.sgh-label { margin: 0 0 .5rem; font-size: var(--wp--preset--font-size--label); }
.sgh-facts dl { margin: 0; }
.sgh-fact { padding-block: .75rem; border-bottom: var(--sgh-hair); }
.sgh-fact dt { margin-bottom: .25rem; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-fact dd { margin: 0; overflow-wrap: break-word; }
.sgh-goals { margin: 0; padding: 0; list-style: none; }
.sgh-goals li + li { margin-top: .25rem; }
.sgh-goals b { display: inline-block; min-width: 3.25ch; font: 700 1.0625rem/1.3 var(--wp--preset--font-family--heading); color: var(--wp--custom--color--link); font-variant-numeric: tabular-nums; }
.sgh-goals.has-sides li { position: relative; padding-left: .875rem; }
.sgh-goals.has-sides li::before { content: ""; position: absolute; left: 0; top: .45em; width: .375rem; height: .375rem; background: currentColor; }
.sgh-goals li.is-us::before { background: var(--wp--custom--color--link); }
.sgh-goals li.is-them { color: var(--wp--preset--color--muted); }
.sgh-goals li.is-them b { color: var(--wp--preset--color--muted); }
.sgh-goals li.is-them::before { background: var(--sgh-line-strong); }
/* Goals with known sides: home scorer | score | away scorer, the score column as the axis (same width in every row). */
.sgh-goals.is-axis li { display: grid; grid-template-columns: minmax(0, 1fr) 4.5ch minmax(0, 1fr); column-gap: .75rem; align-items: baseline; }
.sgh-goals.is-axis li + li { margin-top: .1875rem; }
.sgh-goals.is-axis b { min-width: 0; text-align: center; }
.sgh-goal-home { text-align: right; }
.sgh-goals.is-axis li.is-us { color: var(--wp--preset--color--ink); }
.sgh-figure { font: 700 1.75rem/1.1 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; }
/* Match sheet: Heim | Gast, cards per side, referee team, spectators (inc/match-sheet.php).
   Cards in a deep yellow and a signal red with a darker edge, so the yellow card stays visible on paper. */
:root { --sgh-card-yellow: #F2C014; --sgh-card-yellow-edge: #A07800; --sgh-card-red: #D42A1F; --sgh-card-red-edge: #8A160F; }
@media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) { --sgh-card-yellow: #EDBB1E; --sgh-card-yellow-edge: #8C6A00; --sgh-card-red: #E2483D; --sgh-card-red-edge: #9E2219; } }
:root[data-scheme="dark"] { --sgh-card-yellow: #EDBB1E; --sgh-card-yellow-edge: #8C6A00; --sgh-card-red: #E2483D; --sgh-card-red-edge: #9E2219; }
.sgh-sheet dl { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 1.5rem; }
.sgh-sheet .sgh-fact { grid-column: 1 / -1; }
.sgh-sheet-teams { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1rem; border-bottom: var(--sgh-hair); }
.sgh-sheet-team { display: flex; flex-direction: column; gap: .125rem; min-width: 0; margin: 0; padding: .25rem 0 .625rem; }
.sgh-sheet-team.is-us { box-shadow: inset 0 -3px 0 var(--sgh-accent); }
.sgh-sheet-teams.is-open .sgh-sheet-team { padding-bottom: .375rem; }
.sgh-sheet-side, .sgh-cards-word { font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-sheet-name { display: flex; align-items: baseline; gap: .4375rem; font: 700 1.125rem/1.2 var(--wp--preset--font-family--heading); color: var(--sgh-ink-2); overflow-wrap: anywhere; }
.sgh-sheet-name::before, .sgh-cards-team::before { content: ""; flex: none; width: .375rem; height: .375rem; background: var(--sgh-line-strong); transform: translateY(-.2em); }
.sgh-sheet-team.is-us .sgh-sheet-name, .sgh-cards-side.is-us .sgh-cards-team { color: var(--wp--custom--color--link); }
.sgh-sheet-team.is-us .sgh-sheet-name::before, .sgh-cards-side.is-us .sgh-cards-team::before { background: var(--wp--custom--color--link); }
/* Cards drawn upright; yellow-red as a red card laid over the yellow one. */
.sgh-card-icon { position: relative; flex: none; display: inline-block; width: .625rem; height: .875rem; border-radius: 1.5px; background: var(--sgh-card-yellow); box-shadow: inset 0 0 0 1px var(--sgh-card-yellow-edge); }
.sgh-card-icon.is-rot { background: var(--sgh-card-red); box-shadow: inset 0 0 0 1px var(--sgh-card-red-edge); }
.sgh-card-icon.is-gelbrot { margin-right: .3125rem; }
.sgh-card-icon.is-gelbrot::after { content: ""; position: absolute; left: .3125rem; top: .125rem; width: 100%; height: 100%; border-radius: 1.5px;
  background: var(--sgh-card-red); box-shadow: inset 0 0 0 1px var(--sgh-card-red-edge), -1.5px 0 0 var(--wp--preset--color--paper); }
/* Cards in the two columns of the Heim | Gast head above (same grid), so team names are not repeated;
   a dotted rule in the gap separates the sides. Screen readers get the side and team from the list label. */
.sgh-cards { position: relative; display: grid; grid-template-columns: 1fr 1fr; column-gap: 1rem; margin-top: .375rem; }
.sgh-cards::before { content: ""; position: absolute; top: .125rem; bottom: .125rem; left: 50%; border-left: 1px dotted var(--sgh-line-strong); }
.sgh-cards-side { min-width: 0; }
.sgh-cards-who { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.sgh-cards ul { display: flex; flex-wrap: wrap; gap: .25rem .75rem; margin: 0; padding: 0; list-style: none; }
.sgh-cards-open ul { display: flex; flex-wrap: wrap; gap: .25rem .875rem; margin: 0; padding: 0; list-style: none; }
.sgh-card { display: inline-flex; align-items: flex-start; gap: .375rem; }
.sgh-card-icons { display: flex; gap: 2px; padding-top: .3em; }
.sgh-card.has-many .sgh-card-icons { gap: 0; }
.sgh-card.has-many .sgh-card-icon + .sgh-card-icon { margin-left: -.25rem; }
.sgh-card-text { min-width: 0; }
.sgh-card-name { color: var(--wp--preset--color--ink); }
.sgh-cards-side.is-them .sgh-card-name, .sgh-card-anon { color: var(--sgh-ink-2); }
.sgh-card-meta { font-size: var(--wp--preset--font-size--meta); line-height: 1.35; color: var(--wp--preset--color--muted); }
.sgh-card-kind { font: 700 var(--wp--preset--font-size--label)/1 var(--wp--preset--font-family--heading); letter-spacing: .08em; text-transform: uppercase; color: var(--sgh-ink-2); }
.sgh-cards-none { margin: 0; color: var(--wp--preset--color--muted); }
.sgh-cards-open { margin-top: .75rem; padding-top: .625rem; border-top: 1px dashed var(--wp--preset--color--line); }
.sgh-cards-note { margin: 0 0 .375rem; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
/* Referee team and spectators: small pixel signs in the muted colour. */
/* Referee crew picture (sgh_sheet_icon('gespann')): black kit in light, lime kit with a light outline in dark. */
:root { --sgh-ref-shirt: #14151F; --sgh-ref-trim: #FFFFFF; --sgh-ref-bar: #14151F; --sgh-ref-bar-edge: #FFFFFF; --sgh-ref-skin: #BB7C52; --sgh-ref-skin-shade: #A96C45; --sgh-ref-shorts: #14151F; --sgh-ref-boots: #14151F; --sgh-ref-whistle: #14151F; --sgh-ref-hair: #3A2A20; --sgh-ref-line: #14151F; --sgh-ref-line-2: transparent; }
:root[data-scheme="dark"] { --sgh-ref-shirt: #DCF52B; --sgh-ref-trim: #14151F; --sgh-ref-bar: #14151F; --sgh-ref-bar-edge: #F4FFAA; --sgh-ref-skin: #BB7C52; --sgh-ref-skin-shade: #A96C45; --sgh-ref-shorts: #14151F; --sgh-ref-boots: #14151F; --sgh-ref-whistle: #14151F; --sgh-ref-hair: #3A2A20; --sgh-ref-line: #E8EAF4; --sgh-ref-line-2: #E8EAF4; }
@media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) { --sgh-ref-shirt: #DCF52B; --sgh-ref-trim: #14151F; --sgh-ref-bar: #14151F; --sgh-ref-bar-edge: #F4FFAA; --sgh-ref-skin: #BB7C52; --sgh-ref-skin-shade: #A96C45; --sgh-ref-shorts: #14151F; --sgh-ref-boots: #14151F; --sgh-ref-whistle: #14151F; --sgh-ref-hair: #3A2A20; --sgh-ref-line: #E8EAF4; --sgh-ref-line-2: #E8EAF4; } }
.sgh-ref { display: grid; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.sgh-ref.is-gespann { grid-template-columns: minmax(0, max-content) auto; justify-content: start; column-gap: 1.5rem; align-items: start; }
.sgh-ref.is-gespann li { display: block; grid-column: 1; }
.sgh-ref.is-gespann .sgh-ref-gespann { grid-column: 2; grid-row: 1 / span 2; color: var(--wp--preset--color--muted); }
.sgh-ref.is-gespann svg { display: block; }
.sgh-ref-person { display: block; }
/* Narrow screens: the picture goes below the names, so long names keep one line each. */
@media (max-width: 599px) { .sgh-ref.is-gespann { grid-template-columns: minmax(0, 1fr); } .sgh-ref.is-gespann .sgh-ref-gespann { grid-column: 1; grid-row: auto; margin-top: .5rem; } }
.sgh-ref-lbl { display: block; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-ref li { display: grid; grid-template-columns: 2rem minmax(0, 1fr); align-items: start; }
.sgh-px-icon { display: block; flex: none; image-rendering: pixelated; }
.sgh-ref-main { color: var(--wp--preset--color--ink); font-weight: 600; }
.sgh-ref-assist { color: var(--sgh-ink-2); }
.sgh-ref-club { color: var(--wp--preset--color--muted); font-weight: 400; }
.sgh-article-more { margin-top: var(--wp--preset--spacing--80); }
.sgh-related > .sgh-bar { margin-bottom: 0; }
.sgh-article-comments:not(:has(.wp-block-comments > *)) { display: none; }
.sgh-article-navigation { display: grid; grid-template-columns: 1fr 1fr; margin-top: var(--wp--preset--spacing--70); border-top: var(--sgh-rule); border-bottom: var(--sgh-hair); }
.sgh-article-navigation > * { position: relative; margin: 0; padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--50) var(--wp--preset--spacing--50) 0; }
.sgh-article-navigation > :last-child { padding-left: var(--wp--preset--spacing--50); border-left: var(--sgh-hair); text-align: right; }
.sgh-article-navigation > :empty { display: none; }
.sgh-article-navigation:has(> :empty) { grid-template-columns: minmax(0, 1fr); }
.sgh-article-navigation > :empty + :last-child { padding-left: 0; border-left: 0; text-align: left; }
.sgh-article-navigation a { display: block; color: inherit; font: 700 var(--wp--preset--font-size--headline-s)/1.2 var(--wp--preset--font-family--heading); text-decoration: none; }
.sgh-article-navigation a::after { content: ""; position: absolute; inset: 0; }
.sgh-article-navigation .post-navigation-link__label { display: block; margin-bottom: .5rem; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
@media (hover: hover) { .sgh-article-navigation > *:hover { background: var(--wp--preset--color--tint); } .sgh-article-navigation > *:hover a { color: var(--wp--custom--color--link); } }

/* ---------------------------------------------------------------------------
   7. Text pages, documents, legal texts, preserved content
   --------------------------------------------------------------------------- */
.sgh-page-content .wp-block-post-content { font-size: var(--wp--preset--font-size--body); }
.sgh-page-content.sgh-reading .wp-block-post-content > * { max-width: var(--sgh-measure); }
.sgh-page-content h2 { margin-top: 1.75em; font-size: var(--wp--preset--font-size--headline-m); }
/* Two-column pages group each subheading with its text (inc/presentation.php); the group carries the heading's distance. */
.sgh-page-content .sgh-col-section { margin-block-start: calc(1.75 * var(--wp--preset--font-size--headline-m)); }
.sgh-page-content .sgh-col-section:first-child { margin-block-start: 0; }
.sgh-page-content .sgh-col-section > h2:first-child { margin-top: 0; }
.sgh-page-content h3 { margin-top: 1.5em; font-size: var(--wp--preset--font-size--headline-s); }
.sgh-page-content table code { font-size: .8em; overflow-wrap: anywhere; }
/* Documents: one row per file, title and description left, download right. */
.sgh-document { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 2rem; align-items: center; padding-block: var(--wp--preset--spacing--50); border-bottom: var(--sgh-hair); }
.sgh-page-content .wp-block-post-content > .sgh-document:first-child { border-top: var(--sgh-rule); }
.sgh-document > * { margin: 0; grid-column: 1; }
.sgh-document > h2 { margin: 0 0 .25rem; font-size: var(--wp--preset--font-size--headline-s); }
.sgh-document > p { color: var(--sgh-ink-2); font-size: var(--wp--preset--font-size--small); }
.sgh-document > .wp-block-buttons { grid-column: 2; grid-row: 1 / span 2; }
.wp-block-button:has(.sgh-file-meta) { display: flex; flex-direction: column; align-items: flex-end; gap: .375rem; }
.sgh-file-meta { font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); font-variant-numeric: tabular-nums; }
/* A status line, no box: quiet text with a thin rule above. */
.sgh-content-status { max-width: var(--sgh-measure); margin-block: 0 var(--wp--preset--spacing--50); padding-top: .75rem; border-top: var(--sgh-hair); font-size: var(--wp--preset--font-size--meta); line-height: 1.55; color: var(--wp--preset--color--muted); }
.sgh-transcript { margin-block: var(--wp--preset--spacing--60); padding-top: var(--wp--preset--spacing--40); border-top: var(--sgh-rule); }
.sgh-transcript > * { max-width: var(--sgh-measure); }
.sgh-large-link { font: 700 var(--wp--preset--font-size--headline-s)/1.3 var(--wp--preset--font-family--heading); }
.sgh-large-link a { text-decoration: none; border-bottom: 1px solid var(--sgh-line-strong); padding-bottom: .25rem; }
.sgh-large-link a:hover { border-color: currentColor; }
.sgh-preserved-content .wp-block-table { overflow-x: auto; }
.sgh-preserved-content .wp-block-table table { border-collapse: collapse; width: 100%; }
.sgh-preserved-content .wp-block-table th, .sgh-preserved-content .wp-block-table td { padding: .75rem; text-align: left; vertical-align: top; border-color: var(--wp--preset--color--line); }
.sgh-preserved-content .wp-block-image img { height: auto; max-width: 100%; }
.sgh-preserved-content .wp-block-video video { display: block; width: 100%; height: auto; }
/* Partner logos as equal tiles on one light surface, whatever the file's own margins. */
.sgh-tournament-partners.wp-block-gallery.has-nested-images { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(10rem, 30%), 1fr)); gap: 1px; padding: 1px; }
.sgh-tournament-partners.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) { display: flex; align-items: center; justify-content: center; width: auto; margin: 0; aspect-ratio: 3 / 2; padding: clamp(.5rem, 2vw, 1rem); background: var(--sgh-logo-surface); outline: 1px solid var(--wp--preset--color--line); }
.sgh-tournament-partners.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) > a { display: contents; }
.sgh-tournament-partners.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) img { width: 100%; height: 100%; max-width: none; object-fit: contain; }
/* Handwerker Cup (content of the page /turniere/ and of the report 2025): placements as lists per age class, the
   posters as small pictures that open the original, partners as a line of names, winners as a short table. */
.sgh-reading:has(.sgh-cup-results) { width: min(1240px, 100% - 2 * var(--sgh-gutter)); }
.sgh-page-content.sgh-reading .wp-block-post-content > .sgh-preserved-content:has(.sgh-cup-results) { max-width: none; }
.sgh-preserved-content:has(.sgh-cup-results) > :not(.sgh-cup-results, .sgh-cup-posters) { max-width: var(--sgh-measure); }
.sgh-cup-meta { color: var(--sgh-ink-2); }
.sgh-cup-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(13rem, 100%), 1fr)); gap: var(--wp--preset--spacing--50); max-width: 62rem; margin-block: var(--wp--preset--spacing--50); }
.sgh-cup-class { min-width: 0; margin: 0; padding-top: .625rem; border-top: var(--sgh-rule); }
.sgh-cup-class > * { margin: 0; }
.sgh-cup-class h4 { font-size: var(--wp--preset--font-size--headline-s); }
.sgh-cup-class .sgh-cup-time { margin-top: .125rem; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-cup-class ol { margin-top: .625rem; padding-left: 1.75rem; font-size: var(--wp--preset--font-size--small); line-height: 1.35; }
.sgh-cup-class li { padding-block: .375rem; border-bottom: var(--sgh-hair); }
.sgh-cup-class li::marker { color: var(--wp--preset--color--muted); font-variant-numeric: tabular-nums; }
.sgh-cup-class li:first-child { font-weight: 700; }
.sgh-cup-class li:first-child::marker { color: var(--wp--custom--color--link); }
.sgh-cup-posters.wp-block-gallery.has-nested-images { display: grid; grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr)); gap: 1rem .75rem; max-width: 62rem; margin-block: var(--wp--preset--spacing--50); }
.sgh-cup-winner-photos.wp-block-gallery.has-nested-images { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 1rem .75rem; margin-block: var(--wp--preset--spacing--50); }
:is(.sgh-cup-posters, .sgh-cup-winner-photos).wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) { display: flex; flex-direction: column; width: auto; margin: 0; }
:is(.sgh-cup-posters, .sgh-cup-winner-photos).wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh)::before { content: none; }
:is(.sgh-cup-posters, .sgh-cup-winner-photos).wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) img { width: 100%; height: auto; flex: none; object-fit: contain; }
.sgh-cup-posters.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) img { border: var(--sgh-hair); background: var(--sgh-logo-surface); }
.sgh-cup-posters.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) a { display: block; }
.sgh-cup-posters.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) a:hover img { filter: brightness(.94); }
:is(.sgh-cup-posters, .sgh-cup-winner-photos).wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) figcaption {
  position: static; margin: .375rem 0 0; padding: 0; max-height: none; overflow: visible; background: none; text-align: left; text-shadow: none; color: var(--sgh-ink-2); font-size: var(--wp--preset--font-size--label); line-height: 1.35; }
.sgh-cup-winner-photos.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) figcaption { font-size: var(--wp--preset--font-size--meta); }
.sgh-cup-partners { font-size: var(--wp--preset--font-size--small); line-height: 1.6; }
.sgh-cup-partners strong { margin-right: .25rem; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-article-body .wp-block-post-content > .sgh-cup-winners { max-width: 34rem; }
.sgh-cup-winners table { width: 100%; border-collapse: collapse; font-size: var(--wp--preset--font-size--small); line-height: 1.4; }
.sgh-cup-winners :is(th, td) { padding: .625rem 1rem .625rem 0; border: 0; border-bottom: var(--sgh-hair); text-align: left; vertical-align: top; }
.sgh-cup-winners th { border-bottom: var(--sgh-rule); font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-cup-winners :is(th, td):first-child { width: 9rem; }
.sgh-cup-winners td:last-child { font-weight: 700; }
.sgh-added-navigation { padding: 1rem 1.25rem; background: var(--wp--preset--color--tint); }
.sgh-added-navigation > summary { font-weight: 600; cursor: pointer; }
.sgh-added-navigation a { overflow-wrap: anywhere; }
.sgh-preserved-legal-text { overflow-wrap: break-word; }
.sgh-preserved-legal-text h2, .sgh-preserved-legal-text h3 { scroll-margin-top: 2rem; }
.sgh-preserved-legal-text .wp-block-table { overflow-x: auto; }
.sgh-preserved-legal-text table { width: 100%; border-collapse: collapse; }
.sgh-preserved-legal-text th, .sgh-preserved-legal-text td { padding: .5rem; text-align: left; vertical-align: top; }
.sgh-legal-draft-note, .sgh-cookie-preview, .sgh-preview-pending, .sgh-form-preview-note { padding: 1rem 1.25rem; background: var(--wp--preset--color--tint); font-size: var(--wp--preset--font-size--meta); }
.sgh-prototype-note { margin: 0; padding: .5rem var(--sgh-gutter); text-align: center; background: var(--wp--preset--color--tint); color: var(--sgh-ink-2); font: 400 .75rem/1.5 var(--wp--preset--font-family--text); }
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background: var(--wp--preset--color--tint); }

/* ---------------------------------------------------------------------------
   8. Team pages
   --------------------------------------------------------------------------- */
.sgh-team-head { padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--60); }
.sgh-team-head > * { margin-block: 0; }
.sgh-team-head h1, .sgh-team-head .wp-block-post-title { margin-block: 0 var(--wp--preset--spacing--40); }
.sgh-team-head .sgh-lead { margin-top: 0; }
.sgh-team-stats { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1.25rem; margin: var(--wp--preset--spacing--40) 0 0; padding-top: .75rem; border-top: var(--sgh-hair); font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-team-stats .sgh-count { font-size: 1rem; }
.sgh-team-stats a { font-weight: 600; }
.sgh-team-photo { margin: 0; }
.sgh-team-photo img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; object-position: 50% 75%; }
@media (max-width: 599px) { .sgh-team-photo img { aspect-ratio: 3 / 2; } }
/* Placeholder without a team photo (inc/teams.php): same frame as a photo, with the note "Foto folgt". */
.sgh-team-photo.is-placeholder { position: relative; overflow: hidden; }
.sgh-team-ph-note { position: absolute; left: 50%; translate: -50% 0; padding: .375rem .75rem; white-space: nowrap; font: 700 var(--wp--preset--font-size--label)/1.2 var(--wp--preset--font-family--heading); letter-spacing: .14em; text-transform: uppercase; }
.sgh-team-photo.is-crest { display: grid; place-items: center; aspect-ratio: 2 / 1; background: var(--sgh-brand-surface); }
.sgh-team-photo.is-crest img { position: absolute; aspect-ratio: auto; }
.sgh-team-photo .sgh-team-ph-lines { inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sgh-team-photo .sgh-team-ph-crest { top: 50%; left: 50%; width: auto; height: 46%; translate: -50% -58%; filter: drop-shadow(0 10px 24px rgb(0 0 20 / .35)); }
.is-crest .sgh-team-ph-note { bottom: 11%; color: var(--sgh-on-brand); border: 1px solid var(--sgh-on-brand-line); }
@media (max-width: 1023px) { .sgh-team-photo.is-placeholder { margin-bottom: var(--wp--preset--spacing--50); } }
.sgh-team-photo figcaption { margin-top: .5rem; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-team-info { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--70); padding-block: var(--wp--preset--spacing--70); }
.sgh-team-info > * { margin: 0; min-width: 0; }
.sgh-team-info > * > * { margin-block: 0 var(--wp--preset--spacing--40); }
.sgh-team-info h2 { font-size: var(--wp--preset--font-size--headline-m); }
.sgh-team-info .sgh-content-status { margin-top: 0; }
/* "Spielplan und Tabelle": a bar with links instead of a tinted box. */
.sgh-fixtures { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--40); margin-bottom: var(--wp--preset--spacing--70); padding-block: var(--wp--preset--spacing--50); border-top: var(--sgh-rule); border-bottom: var(--sgh-hair); }
.sgh-fixtures > * { margin: 0; }
.sgh-fixtures h2 { margin: 0 0 .25rem; font-size: var(--wp--preset--font-size--headline-m); }
.sgh-fixtures p { margin: 0; color: var(--sgh-ink-2); }
/* Status notes placed directly in the page content keep to the grid. */
.sgh-team-page .wp-block-post-content > .sgh-content-status, .sgh-team-page > .sgh-content-status { width: min(1240px, 100% - 2 * var(--sgh-gutter)); max-width: none; margin-inline: auto; }

/* ---------------------------------------------------------------------------
   9. Sponsors page and tournament partners
   --------------------------------------------------------------------------- */
.sgh-sponsors-page > .wp-block-post-title { margin-top: 0; }
.sgh-sponsors-page .wp-block-post-content > p, .sgh-sponsors-page .wp-block-post-content > h2 { max-width: var(--sgh-measure); }
.sgh-sponsors-page .wp-block-post-content > h2 { margin-top: var(--wp--preset--spacing--80); }
/* Each card draws its own hairline; the outlines meet in the 1px gap, and a short last row leaves no empty grey cells. */
.sgh-sponsor-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; padding: 1px; margin-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70); }
.sgh-sponsor-grid > * { margin: 0; min-width: 0; }
.sgh-sponsor-card { position: relative; padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40); outline: var(--sgh-hair); background: var(--sgh-logo-surface); color: var(--sgh-logo-ink); text-align: center; }
.sgh-sponsor-card .wp-block-image { height: 120px; margin: 0; display: flex; align-items: center; justify-content: center; }
.sgh-sponsor-card .wp-block-image a { display: block; max-width: 100%; }
.sgh-sponsor-card .wp-block-image img { display: block; width: auto; max-width: min(181px, 100%); max-height: 120px; height: auto; object-fit: contain; }
.sgh-sponsor-card p { margin: var(--wp--preset--spacing--40) 0 0; font-size: var(--wp--preset--font-size--meta); line-height: 1.4; color: inherit; }
.sgh-sponsor-card .sgh-sponsor-for { margin-top: .25rem; font-size: var(--wp--preset--font-size--label); color: var(--wp--preset--color--muted); }
@media (hover: hover) { .sgh-sponsor-card:has(a):hover { box-shadow: inset 0 -3px 0 var(--wp--preset--color--brand); } }
@media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) .sgh-sponsor-card { background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); } :root:not([data-scheme="light"]) .sgh-sponsor-card .wp-block-image { padding: .75rem; background: var(--sgh-logo-surface); } }
:root[data-scheme="dark"] .sgh-sponsor-card { background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); }
:root[data-scheme="dark"] .sgh-sponsor-card .wp-block-image { padding: .75rem; background: var(--sgh-logo-surface); }
.sgh-sponsor-contact { max-width: var(--sgh-measure); margin-block: var(--wp--preset--spacing--60); padding-top: var(--wp--preset--spacing--40); border-top: var(--sgh-rule); }
.sgh-sponsor-contact h2 { margin-top: 0; font-size: var(--wp--preset--font-size--headline-m); }
.sgh-sponsor-contact p:last-child { margin-bottom: 0; }
.sgh-sponsor-contact a[href^="tel:"] { white-space: nowrap; }

/* ---------------------------------------------------------------------------
   10. Contact page and form
   --------------------------------------------------------------------------- */
.sgh-contact-head { padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--50); }
.sgh-contact-head h1 { margin-block: 0 var(--wp--preset--spacing--40); }
.sgh-contact-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: var(--wp--preset--spacing--80); padding-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--90); }
.sgh-contact-grid > * { margin: 0; min-width: 0; }
.sgh-contact-grid h2 { margin-top: 0; font-size: var(--wp--preset--font-size--headline-m); line-height: 1.15; }
.sgh-contact-details { padding-top: var(--wp--preset--spacing--40); border-top: var(--sgh-rule); }
.sgh-contact-details h3 { margin-top: var(--wp--preset--spacing--60); font-size: var(--wp--preset--font-size--label); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-contact-details a { overflow-wrap: anywhere; }
/* A photo of the clubhouse under the address, so visitors know what to look for. */
.sgh-contact-photo { margin: var(--wp--preset--spacing--50) 0 0; }
.sgh-contact-photo img { display: block; width: 100%; height: auto; }
.sgh-contact-message { padding-top: var(--wp--preset--spacing--40); border-top: var(--sgh-rule); }
.sgh-contact-form label { display: block; font-size: .9375rem; font-weight: 600; line-height: 1.5; }
.sgh-contact-form input:not([type="submit"]), .sgh-contact-form textarea, .sgh-contact-form select {
  display: block; width: 100%; min-height: 3rem; margin-top: .5rem; padding: .75rem; border: 1px solid var(--sgh-line-strong); border-radius: 0;
  background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font: inherit; font-weight: 400;
}
/* Touch screens: at least 16px in the fields, otherwise iOS Safari zooms the page in when a field is tapped. */
@media (pointer: coarse) { .sgh-contact-form :is(input:not([type="submit"]), textarea, select) { font-size: 1rem; } }
.sgh-contact-form :is(input:not([type="submit"]), textarea, select):focus-visible { outline: 2px solid var(--sgh-focus); outline-offset: 2px; border-color: var(--wp--custom--color--link); }
.sgh-contact-form textarea { min-height: 150px; height: 170px; resize: vertical; }
.sgh-contact-form input[type="submit"] { min-height: var(--sgh-h-control); border: 0; border-radius: 0; padding: .8125rem 1.25rem; background: var(--wp--preset--color--brand); color: var(--sgh-on-brand); font: inherit; font-weight: 600; cursor: pointer; white-space: normal; }
.sgh-contact-form input[type="submit"]:hover { background: var(--sgh-brand-press); }
.sgh-contact-form .wpcf7-not-valid { border-color: var(--sgh-danger); }
.sgh-contact-form .wpcf7-not-valid-tip { margin-top: .375rem; color: var(--sgh-danger); font-size: var(--wp--preset--font-size--meta); }
.sgh-contact-message .wpcf7-response-output { margin: 1rem 0; padding: .875rem; font-size: .9375rem; }
/* Response after sending in the theme's colours instead of the plugin's blue, green, orange and red. */
.sgh-contact-message .wpcf7 form .wpcf7-response-output { border: 2px solid var(--sgh-line-strong); }
.sgh-contact-message .wpcf7 form.sent .wpcf7-response-output { border-color: var(--sgh-success); }
.sgh-contact-message .wpcf7 form:is(.invalid, .unaccepted, .payment-required, .failed, .aborted, .spam) .wpcf7-response-output { border-color: var(--sgh-danger); }
/* Reveal native validation links when reached with the keyboard. */
.sgh-contact-message .wpcf7 .screen-reader-response:focus-within { position: static; overflow: visible; clip: auto; clip-path: none; height: auto; width: auto; margin: 0 0 1rem; padding: 1rem; border: 1px solid var(--sgh-line-strong); background: var(--wp--preset--color--surface); }

/* ---------------------------------------------------------------------------
   11. Search and not-found page
   --------------------------------------------------------------------------- */
.wp-block-search__label { font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.wp-block-search__input { min-height: 3rem; padding: .75rem; border: 1px solid var(--sgh-line-strong); border-radius: 0; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font: inherit; }
.wp-block-search__button { min-height: 3rem; margin-left: .5rem; border: 0; border-radius: 0; background: var(--wp--preset--color--brand); color: var(--sgh-on-brand); font: inherit; font-weight: 600; }
.sgh-not-found > * { max-width: var(--sgh-measure); }
.sgh-not-found-search { margin-block: var(--wp--preset--spacing--60); }
.sgh-not-found-links { margin: 0; padding: 0; list-style: none; border-top: var(--sgh-rule); }
.sgh-not-found-links li { border-bottom: var(--sgh-hair); }
.sgh-not-found-links a { display: flex; align-items: center; min-height: 3.25rem; text-decoration: none; font-weight: 600; }
.sgh-not-found-links a::after { content: "→"; margin-left: auto; }

/* ---------------------------------------------------------------------------
   12. Page changes cross-fade; nothing else moves.
   --------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: .2s; }
  /* Leafing through reports (inc/interaction.php): next from the right, previous from the left. */
  html:active-view-transition-type(forward)::view-transition-old(root) { animation: .22s var(--sgh-ease) both sgh-leave-left; }
  html:active-view-transition-type(forward)::view-transition-new(root) { animation: .22s var(--sgh-ease) both sgh-enter-right; }
  html:active-view-transition-type(backward)::view-transition-old(root) { animation: .22s var(--sgh-ease) both sgh-leave-right; }
  html:active-view-transition-type(backward)::view-transition-new(root) { animation: .22s var(--sgh-ease) both sgh-enter-left; }
  /* Folding sections open and close smoothly where the browser can size to their content. */
  :root { interpolate-size: allow-keywords; }
  details::details-content { transition: height var(--sgh-dur-2) var(--sgh-ease), content-visibility var(--sgh-dur-2) allow-discrete; height: 0; overflow: clip; }
  details[open]::details-content { height: auto; }
}
@keyframes sgh-leave-left { to { opacity: 0; transform: translateX(-1.5rem); } }
@keyframes sgh-enter-right { from { opacity: 0; transform: translateX(1.5rem); } }
@keyframes sgh-leave-right { to { opacity: 0; transform: translateX(1.5rem); } }
@keyframes sgh-enter-left { from { opacity: 0; transform: translateX(-1.5rem); } }

/* Reading progress on long pages: a fine line at the top edge that fills while scrolling. */
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    body.single-post::before, body:has(.sgh-outline)::before {
      content: ""; position: fixed; inset: 0 0 auto; z-index: 60; height: 3px; background: var(--wp--custom--color--link);
      transform-origin: 0 50%; transform: scaleX(0); animation: sgh-progress linear both; animation-timeline: scroll(root);
    }
  }
}
@keyframes sgh-progress { to { transform: scaleX(1); } }

/* Outline beside the text from 1200px (assets/outline.js keeps it open and marks the section). */
@media (min-width: 1200px) {
  .sgh-reading:has(.sgh-outline) { width: min(1240px, 100% - 2 * var(--sgh-gutter)); }
  .sgh-reading:has(.sgh-outline) .wp-block-post-content { display: grid; grid-template-columns: minmax(0, var(--sgh-measure)) minmax(0, 1fr); column-gap: 4rem; align-items: start; }
  .sgh-reading:has(.sgh-outline) .wp-block-post-content > * { grid-column: 1; }
  .sgh-reading:has(.sgh-outline) .wp-block-post-content > .sgh-outline { grid-column: 2; grid-row: 1 / span 999; position: sticky; top: 1.5rem; max-height: calc(100dvh - 3rem); overflow: auto; margin: 0; padding-top: .5rem; border-top: var(--sgh-rule); font-size: var(--wp--preset--font-size--small); line-height: 1.4; }
  .sgh-outline > summary { font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; pointer-events: none; list-style: none; }
  .sgh-outline > summary::-webkit-details-marker { display: none; }
  .sgh-outline > summary::after, .sgh-outline > summary::before { display: none; }
  .sgh-outline p { margin: 0; }
  .sgh-outline a { display: block; padding: .25rem 0 .25rem .75rem; border-left: 2px solid transparent; color: var(--sgh-ink-2); text-decoration: none; }
  .sgh-outline a:hover { color: var(--wp--custom--color--link); }
  .sgh-outline a[aria-current] { border-left-color: var(--wp--custom--color--link); color: var(--wp--custom--color--link); font-weight: 600; }
  .sgh-outline .sgh-outline-group { margin-top: .75rem; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ---------------------------------------------------------------------------
   13. Narrow screens
   --------------------------------------------------------------------------- */
@media (max-width: 1199px) {
  .sgh-report-grid { display: block; }
  .sgh-facts { position: static; max-width: var(--sgh-measure); margin-top: var(--wp--preset--spacing--60); }
}
@media (max-width: 1023px) {
  .sgh-news-grid .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sgh-news-grid .wp-block-post:nth-child(n)::before { content: none; }
  .sgh-news-grid .wp-block-post:nth-child(n)::after { left: 0; }
  .sgh-news-grid .wp-block-post:nth-child(2n)::before { content: ""; }
  .sgh-news-grid .wp-block-post:nth-child(2n)::after { left: calc(-2 * var(--wp--preset--spacing--50)); }
  .sgh-contact-grid { gap: var(--wp--preset--spacing--60); }
  .sgh-sponsor-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
  .sgh-news-grid .wp-block-post-template.is-layout-grid { grid-template-columns: minmax(0, 1fr); }
  /* Phone: reports as compact rows, small picture left, title and team right. */
  .sgh-news-grid .wp-block-post:nth-child(n) { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); column-gap: 1rem; align-items: start; padding: var(--wp--preset--spacing--40) 0; border-left: 0; }
  .sgh-news-grid .wp-block-post:nth-child(2n)::before { content: none; }
  .sgh-news-grid .wp-block-post:nth-child(2n)::after { left: 0; }
  .sgh-news-grid .sgh-news-copy { padding-top: 0; }
  .sgh-news-grid .sgh-news-copy .wp-block-post-title { margin-block: .25rem 0; font-size: var(--wp--preset--font-size--headline-s); line-height: 1.2; }
  .sgh-news-grid .sgh-news-copy .wp-block-post-excerpt { display: none; }
  .sgh-article-navigation { grid-template-columns: minmax(0, 1fr); }
  .sgh-article-navigation > :last-child { padding-left: 0; border-left: 0; border-top: var(--sgh-hair); text-align: left; }
  .sgh-team-info { grid-template-columns: minmax(0, 1fr); gap: var(--wp--preset--spacing--60); }
  .is-style-sgh-steckbrief th, .sgh-team-info th { width: 7rem; }
  .sgh-contact-grid { grid-template-columns: minmax(0, 1fr); }
  .sgh-document { grid-template-columns: minmax(0, 1fr); row-gap: .75rem; }
  .sgh-document > .wp-block-buttons { grid-column: 1; grid-row: auto; }
  .wp-block-button:has(.sgh-file-meta) { align-items: flex-start; }
  .sgh-sponsor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sgh-sponsor-card { padding-inline: .75rem; }
  .sgh-sponsor-card .wp-block-image { height: 96px; }
  .wp-block-search__inside-wrapper { flex-wrap: wrap; gap: .5rem; }
  .wp-block-search__button { margin-left: 0; }
}

/* Search: the number of results as a quiet line between the search field and the grid. */
.sgh-news-grid .sgh-search-total { margin: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--40); font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }

/* ---------------------------------------------------------------------------
   Match result above a report (inc/match-result.php, assets/match-result.js)
   --------------------------------------------------------------------------- */
:root { --sgh-px-skin: #E7B48C; --sgh-px-hair: #3A2A22; --sgh-px-hair-2: #B57B22; --sgh-px-ink: #14151F; --sgh-px-shirt: var(--wp--preset--color--brand); --sgh-px-shorts: #14151F; --sgh-px-boots: #14151F; --sgh-px-tear: #6FA8FF; --sgh-px-rival: #8C8F9C; --sgh-px-keeper: #D26A08; --sgh-px-rival-keeper: #1E7F4E; --sgh-px-kit-shorts: #FFFFFF; --sgh-px-kit-shorts-line: #14151F; --sgh-confetti-2: #6670FF; --sgh-confetti-3: #B9BEFF; --sgh-px-board: #EEEFF8; --sgh-px-board-2: #DCDFF7; --sgh-px-lamp: #E8C35A; }
:root[data-scheme="dark"] { --sgh-px-hair-2: #D9A649; --sgh-px-shirt: #4A52FF; --sgh-px-shorts: #ECEDF3; --sgh-px-boots: #ECEDF3; --sgh-px-rival: #8C90A6; --sgh-px-keeper: #F0A43A; --sgh-px-rival-keeper: #3FBF7F; --sgh-px-kit-shorts: #ECEDF3; --sgh-px-kit-shorts-line: transparent; --sgh-confetti-3: #FFFFFF; --sgh-px-board: #161829; --sgh-px-board-2: #1C1F40; --sgh-px-lamp: #FFE08A; }
@media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) { --sgh-px-hair-2: #D9A649; --sgh-px-shirt: #4A52FF; --sgh-px-shorts: #ECEDF3; --sgh-px-boots: #ECEDF3; --sgh-px-rival: #8C90A6; --sgh-px-keeper: #F0A43A; --sgh-px-rival-keeper: #3FBF7F; --sgh-px-kit-shorts: #ECEDF3; --sgh-px-kit-shorts-line: transparent; --sgh-confetti-3: #FFFFFF; --sgh-px-board: #161829; --sgh-px-board-2: #1C1F40; --sgh-px-lamp: #FFE08A; } }
.sgh-result { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: end; gap: 1.25rem; margin-top: var(--wp--preset--spacing--50) !important; padding: 1rem 1.25rem; border-top: var(--sgh-rule); border-bottom: var(--sgh-hair); }
.sgh-result-figure { display: block; width: 60px; height: 80px; image-rendering: pixelated; }
@media (max-width: 599px) { .sgh-result-figure { width: 48px; height: 64px; } }
.sgh-result.is-win .sgh-result-figure { animation: sgh-hop .5s steps(2, jump-none) 4; }
.sgh-result.is-loss .sgh-result-figure { animation: sgh-slump 1.2s steps(2, jump-none) 1 both; }
@keyframes sgh-hop { 50% { transform: translateY(-8px); } }
@keyframes sgh-slump { to { transform: translateY(2px); } }
.sgh-result-main > * { margin: 0; }
.sgh-result-outcome { display: flex; align-items: center; gap: .75rem; margin-bottom: .5rem !important; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; }
/* The outcome as a stamp with pixel corners: blue for a win, tinted for a draw, grey for a defeat. */
.sgh-result-word { --c: 4px; position: relative; display: inline-block; padding: .35em .6em .3em; font-size: var(--wp--preset--font-size--headline-s); letter-spacing: .08em; line-height: 1;
  background: var(--sgh-accent-surface); color: var(--sgh-on-brand);
  clip-path: polygon(0 var(--c), var(--c) var(--c), var(--c) 0, calc(100% - var(--c)) 0, calc(100% - var(--c)) var(--c), 100% var(--c), 100% calc(100% - var(--c)), calc(100% - var(--c)) calc(100% - var(--c)), calc(100% - var(--c)) 100%, var(--c) 100%, var(--c) calc(100% - var(--c)), 0 calc(100% - var(--c))); }
.sgh-result.is-draw .sgh-result-word { background: var(--wp--preset--color--tint); color: var(--wp--preset--color--ink); }
.sgh-result.is-loss .sgh-result-word { background: var(--wp--preset--color--line); color: var(--wp--preset--color--ink); }
@media (prefers-color-scheme: dark) { :root:not([data-scheme="light"]) .sgh-result.is-loss .sgh-result-word { background: var(--wp--preset--color--surface); } }
:root[data-scheme="dark"] .sgh-result.is-loss .sgh-result-word { background: var(--wp--preset--color--surface); }
/* While the scene plays the outcome stays open; after the final goal it is stamped in (a win bounces, a defeat drops). */
.sgh-result.is-playing .sgh-result-word { visibility: hidden; }
.sgh-result.is-decided .sgh-result-word { animation: sgh-stamp .5s cubic-bezier(.2, .9, .3, 1.25) both; }
.sgh-result.is-decided.is-loss .sgh-result-word { animation: sgh-drop .45s cubic-bezier(.3, 1.5, .6, 1) both; }
.sgh-result.is-decided.is-win .sgh-result-outcome { animation: sgh-flash .9s steps(3, jump-none) .35s both; }
@keyframes sgh-stamp { from { opacity: 0; transform: scale(2.2) rotate(-5deg); } 60% { opacity: 1; } }
@keyframes sgh-drop { from { opacity: 0; transform: translateY(-.75em); } }
@keyframes sgh-flash { 33% { filter: brightness(1.35); } }
.sgh-result-venue { font-weight: 600; letter-spacing: .06em; color: var(--wp--preset--color--muted); }
/* Home | score | away always in one row, so each number stays next to its team; a long name wraps within its column. */
.sgh-result-board { display: grid; grid-template-columns: minmax(0, max-content) max-content minmax(0, max-content); justify-content: start; align-items: center; gap: 0 1rem; font-family: var(--wp--preset--font-family--heading); }
.sgh-result-team { font-size: var(--wp--preset--font-size--headline-s); font-weight: 600; line-height: 1.15; color: var(--sgh-ink-2); text-wrap: balance; }
.sgh-result-team:first-child { text-align: right; }
.sgh-result-team.is-us { font-weight: 700; color: var(--wp--preset--color--ink); }
.sgh-result-score { font-size: var(--wp--preset--font-size--headline-xl); font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
/* Cards on the scoreboard, as on television: the yellow count, each yellow-red and red. */
.sgh-band-cards { display: inline-flex; align-items: center; gap: 3px; margin-left: .5rem; vertical-align: .1em; }
.sgh-band-card { display: inline-grid; place-items: center; width: .8125rem; height: 1.125rem; border-radius: 2px; background: var(--sgh-card-yellow); box-shadow: inset 0 0 0 1px var(--sgh-card-yellow-edge); }
.sgh-band-card.is-rot { background: var(--sgh-card-red); box-shadow: inset 0 0 0 1px var(--sgh-card-red-edge); }
.sgh-band-card.is-gelbrot { background: linear-gradient(135deg, var(--sgh-card-yellow) 50%, var(--sgh-card-red) 50%); box-shadow: inset 0 0 0 1px var(--sgh-card-red-edge); }
.sgh-band-card b { font: 700 .75rem/1 var(--wp--preset--font-family--heading); color: var(--sgh-logo-ink); font-variant-numeric: tabular-nums; }
.sgh-band-card:has(b) { width: auto; min-width: .8125rem; padding-inline: 3px; }
.sgh-result-colon { padding-inline: .08em; }
/* The scene (assets/match-result.js) replaces the figure once the script runs; its space is
   reserved from the start, so nothing moves. 160 × 48 cells: ×2 on narrow bands, ×3 on wide ones. */
.sgh-result-stage { position: relative; display: flex; align-items: flex-end; }
@media (scripting: enabled) {
  .sgh-result[data-sgh-scene] { container-type: inline-size; }
  .sgh-result[data-sgh-scene] .sgh-result-stage { width: 320px; aspect-ratio: 10 / 3; }
  @container (min-width: 820px) { .sgh-result[data-sgh-scene] .sgh-result-stage { width: 480px; } }
  /* Narrow (phones): the scene above the scoreboard. */
  @container (max-width: 559px) {
    .sgh-result[data-sgh-scene] > * { grid-column: 1 / -1; }
    .sgh-result[data-sgh-scene] .sgh-result-stage { width: min(100%, 320px); }
  }
}
.sgh-result.has-scene .sgh-result-figure { display: none; }
.sgh-result-scene { display: block; image-rendering: pixelated; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.sgh-result-replay { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 2rem; height: 2rem; margin: 0; padding: 0; border: 0; border-radius: 2px; background: none; color: var(--wp--preset--color--muted); cursor: pointer; }
.sgh-result-replay::before { content: ""; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: var(--sgh-replay-icon) center / 16px 16px no-repeat; mask: var(--sgh-replay-icon) center / 16px 16px no-repeat; }
.sgh-result-replay:hover { color: var(--wp--preset--color--ink); }
.sgh-result-replay.is-pause::before { -webkit-mask-image: var(--sgh-pause-icon); mask-image: var(--sgh-pause-icon); }
.sgh-result-replay.is-go::before { -webkit-mask-image: var(--sgh-play-icon); mask-image: var(--sgh-play-icon); }
/* Until the scene is set up (has-scene) the outcome, the score and the goals stay hidden, so the result is not given away before
   the scene starts at 0:0. Without the script or with reduced motion they show at once; should the script fail, after 3 s. */
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
  .sgh-result[data-sgh-scene]:not(.has-scene) :is(.sgh-result-word, .sgh-result-score, .sgh-tl-dots, .sgh-tl-goal b) { visibility: hidden; animation: sgh-unveil 0s 3s both; }
}
@keyframes sgh-unveil { to { visibility: visible; } }
/* Goals over time (sgh_match_timeline_html): ours above the axis, theirs below, half time marked. */
.sgh-result-timeline { grid-column: 1 / -1; position: relative; height: 3.5rem; margin-top: .25rem; }
.sgh-tl-axis { position: absolute; inset-inline: 0; top: 50%; border-top: 1px solid var(--sgh-line-strong); }
.sgh-tl-half { position: absolute; left: var(--at); top: calc(50% - 2px); height: 5px; border-left: 1px solid var(--sgh-line-strong); }
.sgh-tl-goal { --dx: -50%; --ddx: -50%; position: absolute; left: var(--at); top: 0; bottom: 0; }
/* Narrow bands have no side padding: marks at either end align with the end of the axis there. */
@media (max-width: 599px) { .sgh-tl-goal.is-start { --dx: 0%; } .sgh-tl-goal.is-end { --dx: -100%; } .sgh-tl-goal.dots-start { --ddx: 0%; } .sgh-tl-goal.dots-end { --ddx: -100%; } }
.sgh-tl-dots { position: absolute; display: flex; gap: 2px; transform: translateX(var(--ddx)); }
.sgh-tl-dots i { width: 8px; height: 8px; }
.sgh-tl-goal.is-us .sgh-tl-dots { bottom: calc(50% + 3px); }
.sgh-tl-goal.is-them .sgh-tl-dots { top: calc(50% + 3px); }
.sgh-tl-goal.is-us i { background: var(--wp--custom--color--link); }
.sgh-tl-goal.is-them i { background: var(--wp--preset--color--muted); }
/* Replay: the goals appear one after another, as the score plays out. */
.sgh-result.is-replaying :is(.sgh-tl-dots i, .sgh-tl-goal b) { opacity: 0; transform: scale(.4); transition: opacity .2s, transform .25s cubic-bezier(.3, 1.6, .5, 1); }
.sgh-result.is-replaying :is(.sgh-tl-dots i.is-on, .sgh-tl-goal.is-on b) { opacity: 1; transform: none; }
.sgh-result.is-replaying .sgh-tl-goal b { transform: translateX(var(--dx)) scale(.4); }
.sgh-result.is-replaying .sgh-tl-goal.is-on b { transform: translateX(var(--dx)); }
.sgh-tl-goal b { position: absolute; transform: translateX(var(--dx)); font: 600 .75rem/1 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--wp--preset--color--muted); }
.sgh-tl-goal.is-us b { bottom: calc(50% + 15px); color: var(--wp--custom--color--link); }
.sgh-tl-goal.is-them b { top: calc(50% + 15px); }
@media (max-width: 599px) { .sgh-tl-goal.is-close b { display: none; } }
/* The figure in other places (inc/pixel.php): error page, empty filter, running search, sent form. */
.sgh-pixel { display: block; image-rendering: pixelated; }
.sgh-not-found-figure { margin-bottom: var(--wp--preset--spacing--40); }
.sgh-not-found-figure .sgh-pixel { width: 220px; height: 90px; }
@media (max-width: 599px) { .sgh-not-found-figure .sgh-pixel { width: 176px; height: 72px; } }
.sgh-empty { display: flex; align-items: center; gap: 1rem; }
.sgh-empty[hidden] { display: none; }
.sgh-empty .sgh-pixel { flex: none; width: 36px; height: 48px; }
.sgh-searching { display: inline-block; vertical-align: middle; margin-right: .5rem; }
.sgh-searching[hidden] { display: none; }
.sgh-searching .sgh-pixel { width: 34px; height: 32px; }
.sgh-form-sent-figure { display: none; margin-top: 1rem; }
.wpcf7-form.sent .sgh-form-sent-figure { display: block; }
.sgh-form-sent-figure .sgh-pixel { width: 48px; height: 64px; }
@media (prefers-reduced-motion: no-preference) {
  .sgh-pixel-ball { animation: sgh-ball-out 1.1s var(--sgh-ease) .4s both; }
  .is-dribble .sgh-pixel-frame { animation: sgh-dribble .36s step-end infinite; }
  .is-dribble .sgh-pixel-frame + .sgh-pixel-frame { animation-delay: -.18s; }
  .wpcf7-form.sent .sgh-form-sent-figure .sgh-pixel { animation: sgh-hop .5s steps(2, jump-none) 4; }
}
@media (prefers-reduced-motion: reduce) { .is-dribble .sgh-pixel-frame + .sgh-pixel-frame { display: none; } }
@keyframes sgh-ball-out { from { transform: translateX(-18px); } }
@keyframes sgh-dribble { 0% { opacity: 1; } 50% { opacity: 0; } }
:root { --sgh-replay-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' shape-rendering='crispEdges'%3E%3Cpath d='M2 0h3v1H2zM1 1h1v1H1zM5 1h1v1H5zM0 2h1v4H0zM4 2h4v1H4zM5 3h2v1H5zM6 4h1v1H6zM1 6h1v1H1zM5 6h1v1H5zM2 7h3v1H2zM6 5h1v1H6z'/%3E%3C/svg%3E"); --sgh-pause-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' shape-rendering='crispEdges'%3E%3Cpath d='M1 1h2v6H1zM5 1h2v6H5z'/%3E%3C/svg%3E"); --sgh-play-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' shape-rendering='crispEdges'%3E%3Cpath d='M2 0h1v8H2zM3 1h1v6H3zM4 2h1v4H4zM5 3h1v2H5z'/%3E%3C/svg%3E"); }
@media (max-width: 599px) {
  .sgh-result { gap: .875rem; padding-inline: 0; }
  .sgh-result-board { gap: 0 .625rem; }
  .sgh-result-team { font-size: var(--wp--preset--font-size--body); }
}
@media (prefers-reduced-motion: reduce) { .sgh-result-figure { animation: none !important; } }

/* Search form and results (inc/site-search.php). */
.sgh-search-form .sgh-label { display: block; margin-bottom: .5rem; }
.sgh-search-row { display: flex; gap: .75rem; }
.sgh-search-row input { flex: 1; min-width: 0; min-height: 3rem; padding: .5rem .875rem; border: 1px solid var(--sgh-line-strong); border-radius: 0; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font: inherit; font-size: var(--wp--preset--font-size--body); }
.sgh-search-row input:focus-visible { outline: 2px solid var(--sgh-focus); outline-offset: 2px; border-color: var(--wp--custom--color--link); }
.sgh-search-form.is-page { max-width: var(--sgh-measure); margin-bottom: var(--wp--preset--spacing--50); }
.sgh-search-summary, .sgh-search-hint { margin: 0 0 var(--wp--preset--spacing--50); color: var(--sgh-ink-2); }
.sgh-search-group { margin-bottom: var(--wp--preset--spacing--60); }
.sgh-search-group > .sgh-bar { margin-bottom: 0; }
.sgh-row-link.is-page { grid-template-columns: minmax(0, 1fr); }
.sgh-search-more { margin-top: var(--wp--preset--spacing--40); font-weight: 600; }

/* Poster archives as a grid (inc/presentation.php): three posters per row, two on phones. */
.sgh-reading:has(.sgh-poster-grid) { width: min(1240px, 100% - 2 * var(--sgh-gutter)); }
.sgh-page-content.sgh-reading .wp-block-post-content > .sgh-preserved-content:has(.sgh-poster-grid) { max-width: none; }
.sgh-preserved-content:has(.sgh-poster-grid) > :not(.sgh-poster-grid) { max-width: var(--sgh-measure); }
.sgh-poster-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 1.5rem; margin-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--70); }
.sgh-poster { display: flex; flex-direction: column; gap: .5rem; min-width: 0; margin: 0; }
.sgh-poster > * { margin: 0; }
.sgh-poster .wp-block-image img { display: block; width: 100%; height: auto; border: var(--sgh-hair); background: var(--wp--preset--color--tint); }
.sgh-poster .wp-block-image a { display: block; }
.sgh-poster .wp-block-details { font-size: var(--wp--preset--font-size--meta); line-height: 1.5; }
.sgh-poster .wp-block-details > summary { font-size: var(--wp--preset--font-size--meta); }
@media (max-width: 1023px) { .sgh-poster-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; } }
/* Club history (page Vereinsgeschichte, template verein-breit): text in the reading measure, pictures
   wider. Sections: chronicle by decade with a photo beside it, honours as a gallery that enlarges on
   click, match programmes as covers that open the PDF. */
.sgh-history > :where(p, ul, ol, h2, h3, .wp-block-table) { max-width: var(--sgh-measure); }
.sgh-history-nav { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: var(--wp--preset--spacing--50) 0 0; padding: .75rem 0; border-block: var(--sgh-hair); list-style: none; font: 600 var(--wp--preset--font-size--small)/1.3 var(--wp--preset--font-family--heading); }
.sgh-history-nav a { text-decoration: none; }
.sgh-history-nav a:hover, .sgh-history-nav a:focus-visible { text-decoration: underline; }
.sgh-history-hero { margin-block: var(--wp--preset--spacing--60) 0; }
.sgh-history-hero img { display: block; width: 100%; height: auto; aspect-ratio: 37 / 10; object-fit: cover; }
.sgh-history-section { margin-top: var(--wp--preset--spacing--80); scroll-margin-top: 1.5rem; }
.sgh-history-section > h2:first-child { display: flex; align-items: center; min-height: var(--sgh-h-bar); max-width: none; margin: 0 0 var(--wp--preset--spacing--50); padding-block: .5rem; border-top: var(--sgh-rule); border-bottom: var(--sgh-hair);
  font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--custom--color--link); }
.sgh-history-section > p { max-width: var(--sgh-measure); }
/* A decade: its events, and a photo of the time beside them. */
.sgh-decade { display: grid; grid-template-columns: minmax(0, var(--sgh-measure)) minmax(0, 1fr); gap: 0 clamp(1.5rem, 4vw, 3.5rem); align-items: start; padding-block: var(--wp--preset--spacing--50); border-bottom: var(--sgh-hair); }
.sgh-decade:last-child { border-bottom: 0; }
.sgh-decade > h3 { grid-column: 1 / -1; margin: 0 0 1rem; font-size: var(--wp--preset--font-size--headline-s); }
.sgh-decade > :not(h3):not(.wp-block-image) { grid-column: 1; }
.sgh-decade > .wp-block-image { grid-column: 2; grid-row: 2 / span 9; margin: 0; }
.sgh-decade > .wp-block-image img { display: block; width: 100%; height: auto; border: var(--sgh-hair); }
.is-style-sgh-chronik { margin: 0; padding: 0; list-style: none; }
.is-style-sgh-chronik > li { position: relative; display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: .75rem; padding: 0 0 .875rem 1.125rem; }
.is-style-sgh-chronik > li::before { content: ""; position: absolute; left: 0; top: .5em; width: .375rem; height: .375rem; background: var(--wp--custom--color--link); }
.is-style-sgh-chronik > li::after { content: ""; position: absolute; left: calc(.1875rem - .5px); top: 1.25em; bottom: .125rem; width: 1px; background: var(--wp--preset--color--line); }
.is-style-sgh-chronik > li:last-child::after { content: none; }
.is-style-sgh-chronik > li > strong:first-child { font: 700 var(--wp--preset--font-size--body)/1.5 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; color: var(--wp--preset--color--ink); }
/* Honours and match programmes: galleries in the full width. */
.sgh-honours.wp-block-gallery.has-nested-images, .sgh-programmes.wp-block-gallery.has-nested-images { display: grid; gap: 1.5rem 1.25rem; margin-block: var(--wp--preset--spacing--50) 0; }
.sgh-honours.wp-block-gallery.has-nested-images { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sgh-programmes.wp-block-gallery.has-nested-images { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sgh-honours.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh), .sgh-programmes.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) { display: flex; flex-direction: column; width: auto; margin: 0; }
.sgh-honours.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) img, .sgh-programmes.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) img { width: 100%; height: auto; flex: none; object-fit: contain; border: var(--sgh-hair); background: var(--wp--preset--color--tint); }
.sgh-honours.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) figcaption, .sgh-programmes.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) figcaption {
  position: static; margin: .5rem 0 0; padding: 0; max-height: none; overflow: visible; background: none; text-align: left; text-shadow: none; color: var(--sgh-ink-2); font-size: var(--wp--preset--font-size--meta); line-height: 1.4; }
.sgh-honours.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh)::before, .sgh-programmes.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh)::before { content: none; }
.sgh-programmes.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) a { display: block; }
.sgh-programmes.wp-block-gallery.has-nested-images figure.wp-block-image:not(#sgh) a:hover img { filter: brightness(.94); }
.sgh-history-note { font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
@media (max-width: 1023px) {
  .sgh-decade { grid-template-columns: minmax(0, 1fr); }
  .sgh-decade > .wp-block-image { grid-column: 1; grid-row: auto; margin-top: 1rem; max-width: var(--sgh-measure); }
  .sgh-honours.wp-block-gallery.has-nested-images { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sgh-programmes.wp-block-gallery.has-nested-images { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
  .sgh-history-hero img { aspect-ratio: 2 / 1; }
  .is-style-sgh-chronik > li { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .sgh-honours.wp-block-gallery.has-nested-images { grid-template-columns: minmax(0, 1fr); }
  .sgh-programmes.wp-block-gallery.has-nested-images { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem .875rem; }
}

/* Team profile (inc/teams.php): key figures, training, coaching team and contact in one grid,
   beside the team photo on wide screens. */
.sgh-team-profile { display: grid; gap: var(--wp--preset--spacing--50); margin-block: 0 var(--wp--preset--spacing--60); }
.sgh-team-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); gap: 2px; margin: 0; }
.sgh-team-facts > div { padding: .875rem 1rem 1rem; background: var(--wp--preset--color--tint); border-top: var(--sgh-brandline); }
.sgh-team-facts dt { font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-team-facts dd { margin: .375rem 0 0; font: 700 var(--wp--preset--font-size--headline-s)/1.15 var(--wp--preset--font-family--heading); color: var(--wp--preset--color--heading, var(--wp--preset--color--ink)); }
.sgh-team-fact-note { display: block; margin-top: .25rem; font: 400 var(--wp--preset--font-size--meta)/1.4 var(--wp--preset--font-family--text); color: var(--wp--preset--color--muted); }
.sgh-team-part > .sgh-label { margin: 0 0 .25rem; padding-top: .625rem; border-top: var(--sgh-rule); }
.sgh-team-sessions, .sgh-team-staff, .sgh-team-links { margin: 0; padding: 0; list-style: none; }
.sgh-team-sessions li { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1rem; padding-block: .625rem; border-bottom: var(--sgh-hair); }
.sgh-team-day { font-weight: 600; }
.sgh-team-time { font-variant-numeric: tabular-nums; }
.sgh-team-staff { display: grid; grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); gap: .875rem 1.25rem; padding-top: .625rem; }
.sgh-team-staff li { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); column-gap: .75rem; align-items: center; }
.sgh-team-initials { grid-row: span 2; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; background: var(--wp--preset--color--brand); color: var(--sgh-on-brand); font: 700 .9375rem/1 var(--wp--preset--font-family--heading); letter-spacing: .04em; }
.sgh-team-name { font-weight: 600; line-height: 1.3; }
.sgh-team-role { font-size: var(--wp--preset--font-size--meta); line-height: 1.3; color: var(--wp--preset--color--muted); }
.sgh-team-staff li:not(:has(.sgh-team-role)) .sgh-team-initials { grid-row: auto; }
.sgh-team-empty { margin: .625rem 0 0; color: var(--sgh-ink-2); }
.sgh-team-cta { margin: .875rem 0 .75rem; }
.sgh-team-button { display: inline-flex; align-items: center; min-height: var(--sgh-h-control); padding: .8125rem 1.25rem; background: var(--wp--preset--color--brand); color: var(--sgh-on-brand); font-size: var(--wp--preset--font-size--small); font-weight: 600; line-height: 1.25; text-decoration: none; transition: background-color var(--sgh-dur-1) var(--sgh-ease); }
.sgh-team-button:hover, .sgh-team-button:focus-visible { background: var(--sgh-brand-press); color: var(--sgh-on-brand); }
.sgh-team-links li { padding-block: .25rem; }
.sgh-team-checked { margin: 0; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-team-reports, .sgh-fubade, .sgh-team-sponsors { margin-block: var(--wp--preset--spacing--60); }
.sgh-team-reports > .sgh-bar, .sgh-fubade > .sgh-bar { margin-bottom: 0; }
.sgh-team-sponsors .sgh-sponsor-grid { margin-block: var(--wp--preset--spacing--50) 0; }
.sgh-team-archive { margin-block: var(--wp--preset--spacing--60); }

/* fussball.de on request (inc/fussballde.php). */
.sgh-fubade-consent { max-width: var(--sgh-measure); padding-block: 1rem; color: var(--sgh-ink-2); }
.sgh-fubade-consent p { margin: 0 0 .75rem; }
.sgh-fubade-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; }
.sgh-fubade-actions[hidden], .sgh-fubade-forget[hidden], .sgh-fubade-consent[hidden] { display: none; }
.sgh-fubade-remember { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--wp--preset--font-size--meta); }
.sgh-fubade-remember input { accent-color: var(--sgh-accent); }
.sgh-fubade-status:empty { display: none; }
.sgh-fubade-status { margin: .75rem 0 0; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-fubade-slots { display: grid; gap: 1.5rem; }
.sgh-fubade-slot:has(iframe) { padding: .5rem; background: #FFFFFF; border: var(--sgh-hair); }
.sgh-fubade-slot iframe { display: block; width: 100%; border: 0; }
.sgh-link-button { padding: 0; border: 0; background: none; color: var(--wp--custom--color--link); font: inherit; font-size: var(--wp--preset--font-size--meta); text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }

/* Team pages: the content sits in the grid; photo and profile side by side from 1024px. */
.sgh-team-content .sgh-shell { width: auto; margin-inline: 0; }
.sgh-team-content > .sgh-lead { max-width: var(--sgh-measure); }
/* Free text and report excerpts on team pages keep the reading measure, like every other page. */
.sgh-team-content > p, .sgh-team-content .sgh-section > p, .sgh-team-content .sgh-row-excerpt { max-width: var(--sgh-measure); }
@media (min-width: 1024px) {
  .sgh-team-content { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; align-items: start; }
  .sgh-team-content > * { grid-column: 1 / -1; min-width: 0; }
  .sgh-team-content:has(> .sgh-shell .sgh-team-photo) > .sgh-shell:has(.sgh-team-photo) { grid-column: 1 / span 7; }
  .sgh-team-content:has(> .sgh-shell .sgh-team-photo) > .sgh-team-profile { grid-column: 8 / span 5; margin-top: 0; }
}
/* Older sections on team pages (sponsors, archive, team shop) get the same thin bar as the rest. */
.sgh-team-content > .sgh-section > .wp-block-heading:first-child { display: flex; align-items: center; min-height: var(--sgh-h-bar); margin: 0 0 var(--wp--preset--spacing--50); padding-block: .5rem; border-top: var(--sgh-rule); border-bottom: var(--sgh-hair); font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--custom--color--link); }
.sgh-team-content > .sgh-section { margin-block: var(--wp--preset--spacing--60); padding-block: 0; }

/* Football overview table (inc/teams.php); rows become small blocks on phones. */
.sgh-team-table { margin: 0 0 var(--wp--preset--spacing--60); }
.sgh-team-table table { width: 100%; border-collapse: collapse; font-size: var(--wp--preset--font-size--small); }
.sgh-team-table :is(th, td) { padding: .875rem 1rem .875rem 0; border: 0; border-bottom: var(--sgh-hair); text-align: left; vertical-align: top; }
.sgh-team-table thead th { padding-block: .5rem; border-top: var(--sgh-rule); font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-team-table tbody th a { font: 700 var(--wp--preset--font-size--headline-s)/1.2 var(--wp--preset--font-family--heading); text-decoration: none; color: var(--wp--preset--color--ink); }
.sgh-team-table tbody th a:hover { color: var(--wp--custom--color--link); }
/* Closer rows where the overview stands as a table (from 700px); on phones the rows are set close already. */
@media (min-width: 700px) { .sgh-team-table :is(th, td) { padding-block: .5625rem; } }
.sgh-team-table-group { display: block; margin-top: .25rem; font-size: var(--wp--preset--font-size--meta); font-weight: 400; color: var(--wp--preset--color--muted); }
.sgh-team-table figcaption { margin-top: .5rem; text-align: left; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
.sgh-team-table.is-former tbody th a { color: var(--sgh-ink-2); }
.sgh-team-table-label { margin-top: var(--wp--preset--spacing--60); }
@media (max-width: 699px) {
  .sgh-team-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .sgh-team-table tr { display: block; padding-block: .75rem; border-bottom: var(--sgh-hair); }
  .sgh-team-table :is(th, td) { display: block; padding: .2rem 0; border: 0; }
  .sgh-team-table tbody th { padding-bottom: .5rem; }
  .sgh-team-table td { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); column-gap: .75rem; }
  .sgh-team-table td::before { content: attr(data-label); color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--meta); }
}
/* Labels stay labels on wide pages, whatever size other headings there have. */
.sgh-page-content :is(h2, h3).sgh-label, .sgh-page-content .sgh-bar :is(h2, h3) { margin-top: 0; font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; }
.sgh-football-more { margin-top: var(--wp--preset--spacing--60); }
.sgh-football-more > .sgh-label { margin-bottom: 0; padding-block: .75rem; border-top: var(--sgh-rule); }

/* Department pages with large, calm type (Gymnastik) and the print button. */
.sgh-gym { font-size: var(--wp--preset--font-size--reading); line-height: 1.6; }
.sgh-gym .sgh-gym-facts { margin-block: var(--wp--preset--spacing--50); font-size: var(--wp--preset--font-size--reading); }
.sgh-gym .sgh-gym-facts a[href^="tel:"] { font: 700 var(--wp--preset--font-size--headline-m)/1.1 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sgh-print { margin-block: var(--wp--preset--spacing--50); }
.sgh-print-button { display: inline-flex; align-items: center; gap: .5rem; min-height: var(--sgh-h-control); padding: .5rem 1rem; border: 1px solid var(--sgh-line-strong); background: var(--wp--preset--color--surface); color: var(--wp--preset--color--ink); font: 600 var(--wp--preset--font-size--small)/1 var(--wp--preset--font-family--text); cursor: pointer; }
.sgh-print-button:hover { border-color: var(--wp--custom--color--link); color: var(--wp--custom--color--link); }

/* Printing: content only, black on white, link targets written out where they help. */
@media print {
  .sgh-header, .sgh-football-bar, .sgh-footer, .sgh-sponsors-strip, .sgh-flow, .sgh-flow-pause, .sgh-share, .sgh-print, .sgh-fubade-consent, .sgh-fubade-actions,
  .sgh-search-panel, .sgh-site-search, .sgh-article-navigation, .sgh-article-more, .sgh-back, .sgh-prototype-note, .sgh-result-replay { display: none !important; }
  /* The result band prints the figure and the final score (match-result.js sets it before printing), not a moment of the scene. */
  .sgh-result-scene { display: none !important; }
  .sgh-result.has-scene .sgh-result-figure { display: block; }
  .sgh-result[data-sgh-scene] .sgh-result-stage { width: auto !important; aspect-ratio: auto !important; }
  html, body { background: #fff !important; color: #000 !important; }
  body { font-size: 12pt; }
  a { color: #000 !important; text-decoration: none !important; }
  .sgh-reading, .sgh-article, .sgh-shell { width: auto !important; margin: 0 !important; }
  .sgh-gym { font-size: 16pt; }
  .sgh-gym .sgh-gym-facts a[href^="tel:"] { font-size: 28pt; }
  .sgh-gym::after { content: "SG Handwerk Magdeburg e. V. · Umfassungsweg 17 · 39124 Magdeburg · sg-handwerk.de/gymnastik"; display: block; margin-top: 1.5cm; padding-top: .3cm; border-top: 1pt solid #000; font-size: 11pt; }
  img { max-width: 100% !important; }
  body.single-post::before, body:has(.sgh-outline)::before { display: none !important; }
}

/* Plain tables on pages (timelines, archive tables): hairlines instead of boxes, like the rest. */
.sgh-page-content .wp-block-table:not([class*="is-style-"]):not(.sgh-team-table) table { width: 100%; border-collapse: collapse; font-size: var(--wp--preset--font-size--small); }
.sgh-page-content .wp-block-table:not([class*="is-style-"]):not(.sgh-team-table) :is(th, td) { padding: .625rem 1rem .625rem 0; border: 0; border-bottom: var(--sgh-hair); text-align: left; vertical-align: top; }
.sgh-page-content .wp-block-table:not([class*="is-style-"]):not(.sgh-team-table) thead { border: 0; }
.sgh-page-content .wp-block-table:not([class*="is-style-"]):not(.sgh-team-table) thead th { padding-block: .5rem; border-top: var(--sgh-rule); font: 700 var(--wp--preset--font-size--label)/1.3 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-page-content .wp-block-table:not([class*="is-style-"]):not(.sgh-team-table) tbody td:first-child { font: 700 var(--wp--preset--font-size--body)/1.4 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Long technical names (cookies, storage keys) in fixed columns wrap instead of running into the next column. */
.sgh-page-content .wp-block-table:not([class*="is-style-"]):not(.sgh-team-table) :is(table.has-fixed-layout tbody td:first-child, tbody td:first-child:has(code)) { white-space: normal; overflow-wrap: anywhere; }

/* Age class finder (inc/age-finder.php). */
.sgh-age-finder { max-width: var(--sgh-measure); margin-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); padding: 1.25rem 0; border-top: 4px solid var(--wp--preset--color--brand); border-bottom: var(--sgh-hair); }
.sgh-age-finder .sgh-label { display: block; margin-bottom: .5rem; }
.sgh-age-finder select { flex: 1; min-height: 3rem; padding: .5rem 2.25rem .5rem .875rem; border: 1px solid var(--sgh-line-strong); border-radius: 0; background: var(--wp--preset--color--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%235E6170' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right .875rem center; color: var(--wp--preset--color--ink); font: inherit; font-size: var(--wp--preset--font-size--body); appearance: none; }
.sgh-age-finder select:focus-visible { outline: 2px solid var(--sgh-focus); outline-offset: 2px; }
.sgh-age-finder-answer { margin: 1rem 0 0; font-size: var(--wp--preset--font-size--reading); line-height: 1.5; }
.sgh-age-finder-answer:empty { display: none; }
.sgh-age-finder-answer a { display: inline-block; margin-top: .25rem; font-weight: 600; }

/* Dates (inc/events.php): the next three on the home page, the facts above an announcement. */
.sgh-event-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 2rem; margin: 0; padding: 0; list-style: none; }
.sgh-event { display: grid; grid-template-columns: 4.25rem minmax(0, 1fr); gap: 1rem; padding-block: 1rem; border-bottom: var(--sgh-hair); }
.sgh-event-date { display: flex; flex-direction: column; font-family: var(--wp--preset--font-family--heading); }
.sgh-event-day { font: 700 2.5rem/1 var(--wp--preset--font-family--heading); font-variant-numeric: tabular-nums; color: var(--wp--custom--color--link); }
.sgh-event-month { margin-top: .25rem; font: 700 var(--wp--preset--font-size--label)/1.2 var(--wp--preset--font-family--heading); letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.sgh-event-title { font: 700 var(--wp--preset--font-size--headline-s)/1.2 var(--wp--preset--font-family--heading); color: var(--wp--preset--color--ink); text-decoration: none; }
.sgh-event-title:hover { color: var(--wp--custom--color--link); }
.sgh-event-where { display: block; margin-top: .35rem; font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--muted); }
@media (max-width: 1023px) { .sgh-event-list { grid-template-columns: minmax(0, 1fr); } }
.sgh-event-facts { margin: 1rem 0 0; font-size: var(--wp--preset--font-size--small); }
.sgh-event-facts .sgh-label { margin-right: .5rem; }

/* ---------------------------------------------------------------------------
   Short text pages in two columns from 1100px (page field "Text in zwei Spalten", body class sgh-two-columns):
   the lead runs across both, a column may only break between sections (.sgh-col-section: a subheading with its text,
   grouped in inc/presentation.php), so no heading is left alone and no section is torn apart, also in Safari.
   Long pages (statutes, privacy notice, history) stay in one column.
   --------------------------------------------------------------------------- */
@media (min-width: 1100px) {
  .sgh-two-columns .sgh-reading.sgh-page-content { width: min(1240px, 100% - 2 * var(--sgh-gutter)); }
  .sgh-two-columns .sgh-reading.sgh-page-content > .wp-block-post-content { columns: 2; column-gap: clamp(3rem, 6vw, 5.5rem); }
  .sgh-two-columns .sgh-reading.sgh-page-content > .wp-block-post-content > * { max-width: none; break-inside: avoid; }
  .sgh-two-columns .sgh-reading.sgh-page-content > .wp-block-post-content > :is(.sgh-lead, p.sgh-added-context):first-child { column-span: all; max-width: 34em; margin-bottom: var(--wp--preset--spacing--50); }
  .sgh-two-columns .sgh-reading.sgh-page-content > .wp-block-post-content > .sgh-col-section > * { max-width: none; }
  .sgh-two-columns .sgh-reading.sgh-page-content > .wp-block-post-content > .sgh-col-section:first-of-type { margin-block-start: 0; }
}