:root,
[data-bs-theme=light] {
  --ar-primary: #999999;
  --ar-primary-rgb: 153, 153, 153;
  --bs-primary: #999999;
  --bs-primary-rgb: 153, 153, 153;
  --ar-secondary: #edf1f5;
  --ar-secondary-rgb: 237, 241, 245;
  --bs-secondary: #edf1f5;
  --bs-secondary-rgb: 237, 241, 245;
  --ar-warning: #edcb50;
  --ar-warning-rgb: 237, 203, 80;
  --bs-warning: #edcb50;
  --bs-warning-rgb: 237, 203, 80;
  --ar-info: #3f7fca;
  --ar-info-rgb: 63, 127, 202;
  --bs-info: #3f7fca;
  --bs-info-rgb: 63, 127, 202;
  --ar-success: #3fca90;
  --ar-success-rgb: 63, 202, 144;
  --bs-success: #3fca90;
  --bs-success-rgb: 63, 202, 144;
  --ar-danger: #ed5050;
  --ar-danger-rgb: 237, 80, 80;
  --bs-danger: #ed5050;
  --bs-danger-rgb: 237, 80, 80;
  --ar-light: #ffffff;
  --ar-light-rgb: 255, 255, 255;
  --bs-light: #ffffff;
  --bs-light-rgb: 255, 255, 255;
  --ar-dark: #21252b;
  --ar-dark-rgb: 33, 37, 43;
  --bs-dark: #21252b;
  --bs-dark-rgb: 33, 37, 43;
  --ar-link-color: #999999;
  --ar-link-hover-color: #808080;
  --bs-link-color: #999999;
  --bs-link-color-rgb: 153, 153, 153;
  --bs-link-hover-color: #808080;
  --ar-body-font-family: ABeeZee, Arial, sans-serif;
  --ar-heading-font-family: GraublauSans, Arial, sans-serif;
  --ar-root-font-size: 1rem;
  --ar-body-font-size: 1rem;
  --ar-border-width: 1px;
  --ar-border-radius: 1rem;
  --ar-border-radius-sm: calc(var(--ar-border-radius) * 0.75);
  --ar-border-radius-lg: calc(var(--ar-border-radius) * 1.25);
  --ar-border-radius-xl: calc(var(--ar-border-radius) * 1.5);
  --ar-border-radius-xxl: calc(var(--ar-border-radius) * 2.25);
}
[data-bs-theme=light] {
  --ar-body-bg: #ffffff;
  --bs-body-bg: #ffffff;
  --ar-body-bg-rgb: 255, 255, 255;
  --bs-body-bg-rgb: 255, 255, 255;
  --ar-body-color: #666e70;
  --bs-body-color: #666e70;
  --ar-body-color-rgb: 102, 110, 112;
  --bs-body-color-rgb: 102, 110, 112;
  --ar-secondary-color: #858c97;
  --bs-secondary-color: #858c97;
  --ar-heading-color: #21252b;
  --bs-heading-color: #21252b;
  --ar-border-color: #e3e9ef;
  --bs-border-color: #e3e9ef;
}
[data-bs-theme=light] .card {
  --ar-card-bg: #ffffff;
}
.btn-primary {
  --booost-btn-color: #121519;
  --booost-btn-hover-color: #121519;
  --ar-btn-bg: #999999;
  --ar-btn-border-color: #999999;
  --ar-btn-hover-bg: #808080;
  --ar-btn-hover-border-color: #808080;
  --ar-btn-active-bg: #808080;
  --ar-btn-active-border-color: #808080;
  --ar-btn-disabled-bg: #999999;
  --ar-btn-disabled-border-color: #999999;
}
.btn-outline-primary {
  --ar-btn-color: #999999;
  --ar-btn-border-color: #999999;
  --ar-btn-hover-bg: #999999;
  --ar-btn-hover-border-color: #999999;
  --ar-btn-active-bg: #999999;
  --ar-btn-active-border-color: #999999;
  --ar-btn-disabled-color: #999999;
  --ar-btn-disabled-border-color: #999999;
}
.btn-secondary {
  --booost-btn-color: #121519;
  --booost-btn-hover-color: #121519;
  --ar-btn-bg: #edf1f5;
  --ar-btn-border-color: #edf1f5;
  --ar-btn-hover-bg: #d4d8dc;
  --ar-btn-hover-border-color: #d4d8dc;
  --ar-btn-active-bg: #d4d8dc;
  --ar-btn-active-border-color: #d4d8dc;
  --ar-btn-disabled-bg: #edf1f5;
  --ar-btn-disabled-border-color: #edf1f5;
}
.btn-outline-secondary {
  --ar-btn-color: #edf1f5;
  --ar-btn-border-color: #edf1f5;
  --ar-btn-hover-bg: #edf1f5;
  --ar-btn-hover-border-color: #edf1f5;
  --ar-btn-active-bg: #edf1f5;
  --ar-btn-active-border-color: #edf1f5;
  --ar-btn-disabled-color: #edf1f5;
  --ar-btn-disabled-border-color: #edf1f5;
}
.btn-warning {
  --booost-btn-color: #121519;
  --booost-btn-hover-color: #121519;
  --ar-btn-bg: #edcb50;
  --ar-btn-border-color: #edcb50;
  --ar-btn-hover-bg: #d4b237;
  --ar-btn-hover-border-color: #d4b237;
  --ar-btn-active-bg: #d4b237;
  --ar-btn-active-border-color: #d4b237;
  --ar-btn-disabled-bg: #edcb50;
  --ar-btn-disabled-border-color: #edcb50;
}
.btn-outline-warning {
  --ar-btn-color: #edcb50;
  --ar-btn-border-color: #edcb50;
  --ar-btn-hover-bg: #edcb50;
  --ar-btn-hover-border-color: #edcb50;
  --ar-btn-active-bg: #edcb50;
  --ar-btn-active-border-color: #edcb50;
  --ar-btn-disabled-color: #edcb50;
  --ar-btn-disabled-border-color: #edcb50;
}
.btn-info {
  --booost-btn-color: #fff;
  --booost-btn-hover-color: #fff;
  --ar-btn-bg: #3f7fca;
  --ar-btn-border-color: #3f7fca;
  --ar-btn-hover-bg: #2666b1;
  --ar-btn-hover-border-color: #2666b1;
  --ar-btn-active-bg: #2666b1;
  --ar-btn-active-border-color: #2666b1;
  --ar-btn-disabled-bg: #3f7fca;
  --ar-btn-disabled-border-color: #3f7fca;
}
.btn-outline-info {
  --ar-btn-color: #3f7fca;
  --ar-btn-border-color: #3f7fca;
  --ar-btn-hover-bg: #3f7fca;
  --ar-btn-hover-border-color: #3f7fca;
  --ar-btn-active-bg: #3f7fca;
  --ar-btn-active-border-color: #3f7fca;
  --ar-btn-disabled-color: #3f7fca;
  --ar-btn-disabled-border-color: #3f7fca;
}
.btn-success {
  --booost-btn-color: #121519;
  --booost-btn-hover-color: #121519;
  --ar-btn-bg: #3fca90;
  --ar-btn-border-color: #3fca90;
  --ar-btn-hover-bg: #26b177;
  --ar-btn-hover-border-color: #26b177;
  --ar-btn-active-bg: #26b177;
  --ar-btn-active-border-color: #26b177;
  --ar-btn-disabled-bg: #3fca90;
  --ar-btn-disabled-border-color: #3fca90;
}
.btn-outline-success {
  --ar-btn-color: #3fca90;
  --ar-btn-border-color: #3fca90;
  --ar-btn-hover-bg: #3fca90;
  --ar-btn-hover-border-color: #3fca90;
  --ar-btn-active-bg: #3fca90;
  --ar-btn-active-border-color: #3fca90;
  --ar-btn-disabled-color: #3fca90;
  --ar-btn-disabled-border-color: #3fca90;
}
.btn-danger {
  --booost-btn-color: #fff;
  --booost-btn-hover-color: #fff;
  --ar-btn-bg: #ed5050;
  --ar-btn-border-color: #ed5050;
  --ar-btn-hover-bg: #d43737;
  --ar-btn-hover-border-color: #d43737;
  --ar-btn-active-bg: #d43737;
  --ar-btn-active-border-color: #d43737;
  --ar-btn-disabled-bg: #ed5050;
  --ar-btn-disabled-border-color: #ed5050;
}
.btn-outline-danger {
  --ar-btn-color: #ed5050;
  --ar-btn-border-color: #ed5050;
  --ar-btn-hover-bg: #ed5050;
  --ar-btn-hover-border-color: #ed5050;
  --ar-btn-active-bg: #ed5050;
  --ar-btn-active-border-color: #ed5050;
  --ar-btn-disabled-color: #ed5050;
  --ar-btn-disabled-border-color: #ed5050;
}
.btn-light {
  --booost-btn-color: #121519;
  --booost-btn-hover-color: #121519;
  --ar-btn-bg: #ffffff;
  --ar-btn-border-color: #ffffff;
  --ar-btn-hover-bg: #e6e6e6;
  --ar-btn-hover-border-color: #e6e6e6;
  --ar-btn-active-bg: #e6e6e6;
  --ar-btn-active-border-color: #e6e6e6;
  --ar-btn-disabled-bg: #ffffff;
  --ar-btn-disabled-border-color: #ffffff;
}
.btn-outline-light {
  --ar-btn-color: #ffffff;
  --ar-btn-border-color: #ffffff;
  --ar-btn-hover-bg: #ffffff;
  --ar-btn-hover-border-color: #ffffff;
  --ar-btn-active-bg: #ffffff;
  --ar-btn-active-border-color: #ffffff;
  --ar-btn-disabled-color: #ffffff;
  --ar-btn-disabled-border-color: #ffffff;
}
.btn-dark {
  --booost-btn-color: #fff;
  --booost-btn-hover-color: #fff;
  --ar-btn-bg: #21252b;
  --ar-btn-border-color: #21252b;
  --ar-btn-hover-bg: #080c12;
  --ar-btn-hover-border-color: #080c12;
  --ar-btn-active-bg: #080c12;
  --ar-btn-active-border-color: #080c12;
  --ar-btn-disabled-bg: #21252b;
  --ar-btn-disabled-border-color: #21252b;
}
.btn-outline-dark {
  --ar-btn-color: #21252b;
  --ar-btn-border-color: #21252b;
  --ar-btn-hover-bg: #21252b;
  --ar-btn-hover-border-color: #21252b;
  --ar-btn-active-bg: #21252b;
  --ar-btn-active-border-color: #21252b;
  --ar-btn-disabled-color: #21252b;
  --ar-btn-disabled-border-color: #21252b;
}
.accordion-button:not(.collapsed)::after {
  --ar-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='%23999999'%3e%3cpath%20d='M.5%206.3c.6-.6%201.6-.6%202.3%200l9.3%209.3%209.3-9.3c.6-.6%201.6-.6%202.3%200%20.6.6.6%201.6%200%202.3L13.3%2018.8c-.6.6-1.6.6-2.3%200L.8%208.5c-.9-.8-.9-1.6-.3-2.2z'/%3e%3c/svg%3e");
}
/* gartenwelt-melk (Gartenwelt Melk) - site CSS, draft from Phase A (2026-10-18).
   Phase C: booost.theme_custom_css, byte-identical (push_css.py --check).
   Live values: analysis/live-colors.md. @@custom.css loads before the theme:
   selectors carry body/html for specificity (brief-52). Light-only values are
   scoped so dark mode keeps working. */

/* house font Graublau Sans: the legacy theme's only face (GraublauSans-Bold.otf, the
   live file, licence with the customer), uploaded unchanged to /media/fonts;
   theme_heading_font_url "custom" loads nothing else. ../ = site root (the sheet is
   <site>/++webresource++.../@@custom.css). Like live, the Bold file is the whole family:
   the weight range keeps the browser from adding a synthetic bold on top. */
@font-face { font-family: "GraublauSans"; font-weight: 100 900; font-style: normal; font-display: swap;
  src: url("../media/fonts/GraublauSans-Bold.otf") format("opentype"); }

/* headings: Graublau Sans (weight 400 like live, rendered by the Bold file),
   uppercase, 2px letter-spacing; h1 42px, h2 30px, card h3 26px */
body h1, body .h1, body h2, body .h2, body h3, body .h3,
body h4, body .h4, body h5, body .h5, body h6, body .h6 {
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2px;
}
body h1, body .h1 { font-size: 42px; line-height: 1.2; }
body h2, body .h2 { font-size: 30px; }
body .rh-card-title { font-size: 26px; line-height: 1.2; }

/* navigation: live Graublau Sans 16px uppercase, no letter-spacing; active item grey (#999) */
body .navbar-nav .nav-link {
  font-family: var(--ar-heading-font-family, GraublauSans), Arial, sans-serif;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: normal;
  text-transform: uppercase;
}
html:not([data-bs-theme="dark"]) body .navbar-nav .nav-link { color: #21252b; }
body .navbar-nav .nav-link.active,
html:not([data-bs-theme="dark"]) body .navbar-nav .nav-link.active { color: #999999; }

/* hero before header: white logo, two buttons (dark #2d323a / #c9d1d6, lime #86ba41) */
body .rh-hero-logo { width: 300px; height: auto; }
@media (max-width: 767.98px) { body .rh-hero-logo { width: 240px; } }
body .btn.rh-btn-dark {
  font-weight: 400;
  background-color: #2d323a; border-color: #24282e; color: #c9d1d6;
  border-radius: 3px; font-size: 18px; padding: 18px 22px; line-height: 1.2;
}
body .btn.rh-btn-lime {
  font-weight: 400;
  background-color: #86ba41; border-color: #79b037; color: #fff;
  border-radius: 3px; font-size: 18px; padding: 18px 22px; line-height: 1.2;
}

/* mission box: #21252b at .9, radius 20px, 57 % wide (100 % on phones) */
body .rh-mission {
  background-color: #21252b;
  opacity: .9;
  border-radius: 20px;
  width: min(592px, calc(100vw - 40px));
  padding: 30px 30px 60px;
  text-align: center;
  color: rgba(250, 250, 250, .7);
}
body .rh-mission .rh-mission-title { font-size: 24px; line-height: 1.4; color: rgba(250, 250, 250, .85); margin-bottom: 20px; }
body .rh-mission .rh-mission-title-lg { font-size: 42px; line-height: 1.2; color: #fff; }
body .rh-mission p.rh-mission-sub { font-size: 18px; color: #fff; }
body .rh-mission p.rh-mission-lead { font-size: 18px; color: #fff; }
body .rh-mission .rh-mission-sign { font-size: 20px; color: rgba(250, 250, 250, .7); }

/* CTA band: #21252b, text white, mail link #999 */
body .rh-cta a:not(.btn) { color: #999999; }

/* cards (live portfolio_classic_1): 3px corners, grey description */
body .rh-cards img, body .rh-img { border-radius: 3px; }
body .rh-cards .card-text, body .rh-cards .text-body-secondary { color: #999999 !important; }

/* photo bands ~3:1 (live 460px at 1440) - booost has no 3:1 ratio (findings C) */
body .rh-band .jarallax > .position-relative { padding: 0 !important; }
body .rh-band-3x1 .ratio { --ar-aspect-ratio: 32%; } /* Around reads --ar-, not --bs- (fixed 2026-10-29) */

/* slider band: #21252b, dots #999; live 60px above, 55px below */
body .mosaic-grid-row.rh-slider { padding-top: 60px !important; padding-bottom: 55px !important; }
body .rh-slider .swiper-pagination-bullet { background-color: #999999; }

/* links: live #999, not underlined (allowed difference: underline for a11y) */

/* content width: live 1040px (container 1072 incl. 2x16px padding) */
@media (min-width: 1200px) {
  body .container, body .container-lg, body .container-xl, body .container-xxl { max-width: 1072px; }
  body .mosaic-grid-row.container { max-width: 1064px; }
}

/* page titles (h1 rows): live 58px above, 60px below */
body .mosaic-grid-row.rh-title { padding-top: 48px !important; padding-bottom: 49px !important; }

/* reference cards: black titles, 40px to the next row */
html:not([data-bs-theme="dark"]) body .rh-cards h3 { color: #21252b; }
body .rh-cards-start h3 { margin-bottom: 2px; } /* + the empty meta row of the listing (-8 +16) = live 13px gap */
body .rh-cards.rh-cards-ref h3 { margin-bottom: 40px; }
html:not([data-bs-theme="dark"]) body .rh-cards.rh-cards-ref h3 { color: #000; }

/* cards: centred like live (Schaugarten/Pakete left: .rh-cards-start),
   4:3 images, no lift shadow */
body .rh-cards .mosaic-tile-content, body .rh-cards h3, body .rh-cards p, body .rh-cards .card-text { text-align: center; }
body .rh-cards.rh-cards-start .mosaic-tile-content, body .rh-cards.rh-cards-start h3,
body .rh-cards.rh-cards-start p, body .rh-cards.rh-cards-start .card-text { text-align: start; }
body .rh-cards img { aspect-ratio: 4 / 3; object-fit: cover; box-shadow: none; }
body .rh-cards .card { box-shadow: none; background: transparent; }

/* mission box centred in its row */
body .rh-mission { margin-left: auto; margin-right: auto; }

/* footer on #21252b in both modes (footer_dark_mode off so the colophon stays white):
   headings/text white, links #999, "Inhalte" as a bullet list */
body #footer .card, body #footer .card h2, body #footer .card .h6, body #footer .card p { color: #fff; }
body #footer .card a, body #footer .card a.nav-link, body #footer .card p a { color: #999999 !important; }
body #footer .card h2, body #footer .card .h6 { font-size: 16px; line-height: 28.8px; margin-bottom: 15px; }
body #footer .portlet-collection-inhalte ul { display: block; list-style: disc; padding-left: 18px; color: #999999; }
body #footer .portlet-collection-inhalte li { display: list-item; }
body #footer .portlet-collection-inhalte .nav-link { padding: 0 !important; margin: 0 !important; }

/* colophon: white band, text #000, links #21252b (light mode only) */
html:not([data-bs-theme="dark"]) body #ui-colophon { background-color: #fff; color: #666e70; }
html:not([data-bs-theme="dark"]) body #ui-colophon a { color: #21252b; }


/* hero before header: live content starts lower (legacy pi-padding-top-130 / -170) */
@media (min-width: 992px) {
  body .rh-hero-content { padding-top: 285px; }
  body .rh-hero-content.rh-hero-sg { padding-top: 317px; }
  body .rh-mission.rh-mission-wide { width: 776px; }
}

/* section headings: live gap below h2 ~50px */
body .rh-h2 h2 { margin-bottom: 0; }

/* colophon 16px like live */
body #ui-colophon { font-size: 16px; }

/* colophon Facebook button: live round, 60px, #eef1f1 / #3b3e3f, glyph 24px */
html:not([data-bs-theme="dark"]) body #ui-colophon .btn-facebook { background-color: #eef1f1; color: #3b3e3f; border-color: #eef1f1; }
body #ui-colophon .btn-facebook { width: 60px; height: 60px; border-radius: 50%; font-size: 24px; }
body #ui-colophon .btn-facebook i { font-size: 24px; line-height: 1; }

/* document pages (references, Schaugarten info): title centred like live */
body.layout-booostcontent-document #content h1 { text-align: center; } /* body class since 1.2.x (was main.layout-document) */

/* Schaugarten slider: 4:3 crops like live */
body .rh-slider img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; height: auto; border-radius: 3px !important; }

/* Schaugarten / Pakete cards (image-top view with full text): borderless, body flush */
body .rh-cards-start .card { border: 0; }
body .rh-cards-start .card-body { padding: 18px 0 30px !important; margin-top: 0 !important; font-size: 16px; }
body .rh-cards-start .card-body :is(p, li, div) { font-size: 16px; }
body .rh-cards-start .card img { border-radius: 3px; }

/* multi-column text tiles: no extra block padding under the columns (live 60px to the next band) */
body .text-blocks > .row { padding-bottom: 0 !important; }

/* slider images: 3px corners (the view rounds its wrappers) */
body .rh-slider [class*="rounded"], body .rh-slider .swiper-slide img { border-radius: 3px !important; }
body .mosaic-grid-row.rh-slider { padding-left: 38px !important; padding-right: 38px !important; }

/* CTA band: 64px above the text like live; 60px to the next heading */
body .mosaic-grid-row.rh-cta { padding-top: 53px !important; }
body .mosaic-grid-row.rh-cta + .mosaic-grid-row { padding-top: 60px !important; }

/* card grid rows: live ~54px between a description and the next image */
body .rh-cards:not(.rh-cards-start) .row > .col { margin-bottom: 40px; }

/* phones: hero content lower like live (logo ~375px from the top) */
@media (max-width: 991.98px) {
  body .rh-hero-content { padding-top: 256px; }
  body .rh-hero-content.rh-hero-sg { padding-top: 300px; }
}
/* Schaugarten mission row: live 160px above/below the box (580px band at 1440; bottom 133 + the text wrapper mb-4;
   2026-10-29: the old 42/232 was measured with the AOS offset still applied) */
body .rh-mission-lg { padding-top: 157px !important; padding-bottom: 133px !important; }
body .rh-mission.rh-mission-wide { padding-bottom: 79px; }

/* body copy line-height 1.6 (live 16/25.6) */
body { line-height: 1.6; }
/* mission wash: live white at .8 */
body .rh-mission-row .opacity-75 { opacity: .8 !important; }
/* colophon year line: live "© 2026 »" grey (#666e70), the name dark; a space after the © */
body #ui-colophon .year { margin-left: .25em; }
html:not([data-bs-theme="dark"]) body #ui-colophon a:has(> .year) > span:not(.company) { color: #666e70; }
/* bold text in copy: live #21252b (the heading colour), light mode only */
html:not([data-bs-theme="dark"]) body #content :is(strong, b) { color: #21252b; }
/* Schaugarten / Pakete cards: the listing's card mb-5 made each card row 40px taller than live */
body .rh-cards-start .card.mb-5 { margin-bottom: .5rem !important; }

body.template-folder_contents,
body[class*="controlpanel"],
body.template-sharing,
body.template-historyview {
  --ar-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ar-heading-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#edit-zone { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }