/* ==========================================================================
Apart Hausverwaltung Immobilien GmbH
Abgleich der YOOtheme-Umsetzung mit der programmierten Vorlage
(website_V3/live/css/style.css), Referenz bei 1440 px Viewport.
Wichtig: YOOtheme gibt den erst nach dem Body aus, die
Builder-Styles stehen also weiter unten im Dokument. Deshalb sind alle
Regeln mit "body" praefixiert (hoehere Spezifitaet) und Abstaende, die
gegen die uk-margin-Utilities laufen, mit !important gesetzt.
Papier #FBFAF7 - Tinte #221F1B - Grau #6B655D - Linie #E7E1D8
Orange #DD750E - Orange hell #E17A2E - Nacht #211D18
Nacht-Tinte #F4EFE8 - Nacht-Grau #B5AB9D
========================================================================== */
:root {
--apart-paper: #FBFAF7;
--apart-ink: #221F1B;
--apart-muted: #6B655D;
--apart-line: #E7E1D8;
--apart-orange: #DD750E;
--apart-orange-bright: #E17A2E;
--apart-night: #211D18;
--apart-night-ink: #F4EFE8;
--apart-night-muted: #B5AB9D;
--apart-gutter: clamp(1.25rem, 4vw, 2.5rem);
--apart-section-y: clamp(4.5rem, 10vw, 8.5rem);
}
/* --------------------------------------------------------------------------
1. Grundmass: YOOtheme setzt html auf 17px, die Vorlage rechnet mit 16px.
-------------------------------------------------------------------------- */
html { font-size: 16px; line-height: 1.65; }
body {
font-family: "Instrument Sans", "Segoe UI", sans-serif;
font-size: 1.0625rem;
line-height: 1.65;
color: var(--apart-ink);
background: var(--apart-paper);
}
/* --------------------------------------------------------------------------
2. Raster: Vorlage 72rem Aussenmass. .uk-container rechnet content-box,
deshalb Innenabstand von der Maximalbreite abziehen.
-------------------------------------------------------------------------- */
body .uk-container,
body .uk-container-large,
body .uk-container-xlarge {
max-width: calc(72rem - 2 * var(--apart-gutter));
padding-left: var(--apart-gutter);
padding-right: var(--apart-gutter);
}
body .uk-container-expand { max-width: none; }
body #leistungen,
body #ueber-uns { padding-top: var(--apart-section-y); padding-bottom: var(--apart-section-y); }
body #partner { padding-top: 0; padding-bottom: var(--apart-section-y); }
body #kontakt { padding-top: var(--apart-section-y); padding-bottom: var(--apart-section-y); }
/* --------------------------------------------------------------------------
3. Typografie-Bausteine
-------------------------------------------------------------------------- */
body .apart-eyebrow {
font-family: Archivo, sans-serif;
font-size: 0.8125rem;
font-weight: 640;
line-height: 1.65;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--apart-orange) !important;
margin-top: 0 !important;
margin-bottom: 1rem !important;
}
body .uk-light .apart-eyebrow { color: #fff !important; opacity: 0.92; }
/* Vorlage: 7,5-10rem ab Seitenoberkante. Der Header liegt hier im Fluss
(80 px hoch) und muss deshalb abgezogen werden. */
body .apart-pagehead { padding-top: calc(clamp(7.5rem, 14vw, 10rem) - 80px); }
body h2.uk-heading-medium,
body .apart-pagehead h1 {
font-family: Archivo, sans-serif;
font-weight: 800;
font-variation-settings: "wdth" 112;
font-size: clamp(2.1rem, 4.5vw, 3.4rem);
line-height: 1.04;
letter-spacing: -0.02em;
text-wrap: balance;
margin-top: 0 !important;
margin-bottom: 1.25rem !important;
}
body #leistungen .uk-text-muted.uk-width-xlarge,
body .apart-intro {
max-width: 38rem;
width: auto !important;
color: var(--apart-muted);
font-size: 1.125rem;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
body #leistungen .uk-text-muted.uk-width-xlarge p { font-size: 1.125rem; margin: 0; }
body .apart-roofline { height: 2.2rem; color: var(--apart-orange); }
/* --------------------------------------------------------------------------
4. Buttons - Vorlage: gemischte Schreibweise, 2px Rahmen, kein Radius
-------------------------------------------------------------------------- */
body .uk-button {
font-family: Archivo, sans-serif;
font-size: 0.9375rem;
font-weight: 640;
letter-spacing: 0.04em;
text-transform: none;
line-height: 1.65;
padding: 0.9rem 1.75rem;
border: 2px solid transparent;
border-radius: 0;
min-height: 0;
}
body .uk-button-primary {
background: var(--apart-orange);
border-color: var(--apart-orange);
color: #fff;
}
body .uk-button-primary:hover,
body .uk-button-primary:focus { background: #C4670C; border-color: #C4670C; color: #fff; }
body .uk-light .uk-button-default {
background: transparent;
color: #fff;
border-color: rgba(255, 255, 255, 0.55);
}
body .uk-light .uk-button-default:hover {
border-color: #fff;
background: rgba(255, 255, 255, 0.08);
color: #fff;
}
/* --------------------------------------------------------------------------
5. Header
-------------------------------------------------------------------------- */
body .tm-header .uk-navbar-container > .uk-container {
max-width: calc(72rem - 2 * var(--apart-gutter));
padding-left: var(--apart-gutter);
padding-right: var(--apart-gutter);
}
/* Kopfhoehe 80 statt 68 px: die Wortmarke ist auf Kundenwunsch groesser,
bei 68 px klebte sie oben und unten am Rand. */
body .tm-header .uk-navbar-nav > li:not(.apart-nav-cta) > a,
body .tm-header .uk-navbar-item { min-height: 80px; }
/* Kein min-height auf dem Logo: bei "align-items: baseline" haengt die
Gruppe sonst an der Oberkante und die Wortmarke stoesst oben an. Ohne
min-height umschliesst die Box nur ihren Inhalt und die Navbar zentriert sie. */
body .tm-header .uk-logo {
display: flex;
align-items: baseline;
align-self: center; /* sonst streckt .uk-navbar-left die Box auf volle Hoehe */
gap: 0.75rem;
padding: 0;
min-height: 0;
}
/* Logo bewusst groesser als in der Vorlage (dort 2.1rem) - Kundenwunsch.
3.4rem = 54 px, passt in die 80 px hohe Navbar, der Kopf wird also nicht
hoeher. Der Markenblock wird 30 px breiter; zusammen mit der gemischt
gesetzten Beizeile bleiben bei 1382 px Fensterbreite noch 124 px Luecke zum
ersten Menuepunkt - ueber den ~110 px, ab denen Markenblock und Menue
optisch verschmelzen. Weiter hoch geht nur mit kuerzerer Beizeile. */
body .tm-header .uk-logo img { height: 3.4rem; width: auto; max-width: none; }
/* Beizeile gemischt statt in Versalien - Kundenwunsch. Ohne Versalien traegt
die Zeile bei 0.65rem nicht mehr, darum groesser und fast ohne Sperrung. */
body .apart-brand-sub {
font-family: Archivo, sans-serif;
font-size: 0.9rem;
font-weight: 600;
line-height: 1.65;
letter-spacing: 0.01em;
text-transform: none;
color: var(--apart-muted);
transform: translateY(-0.25rem);
white-space: nowrap;
}
/* Ueber dem Hero zieht YOOtheme das Inverse-Logo und blendet dabei alle
anderen Kinder von .uk-logo aus - die Beizeile war dort unsichtbar. */
body .tm-header .uk-logo > .apart-brand-sub { display: block !important; }
body .uk-light .apart-brand-sub {
color: rgba(255, 255, 255, 0.85);
text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}
/* Der Kopf-Container ist auf 72rem festgenagelt, die Breite von Markenblock und
Menue aendert sich also mit dem Fenster nicht. Mit dem fuenften Menuepunkt
("Verwaltung") blieben zwischen Beizeile und "Leistungen" nur noch 43 px -
weniger als zwischen zwei Menuepunkten, dadurch verschmolz beides optisch.
Engere Punktabstaende + schmalere Beizeile schieben die Luecke auf ~110 px. */
body .tm-header .uk-navbar-nav { gap: clamp(1.25rem, 2.2vw, 1.55rem); align-items: center; }
body .tm-header .uk-navbar-nav > li.apart-nav-cta { margin-left: 0.85rem; }
body .tm-header .uk-navbar-nav > li > a {
font-family: Archivo, sans-serif;
font-size: 0.9rem;
font-weight: 600;
letter-spacing: 0.05em;
text-transform: none;
padding: 0;
color: var(--apart-ink);
}
/* Weiss nur, solange der Header ueber dem Hero-Foto steht */
body .tm-header .uk-navbar-container.uk-light .uk-navbar-nav > li > a { color: #fff; }
body .tm-header .uk-navbar-nav > li:not(.apart-nav-cta) > a:hover { color: var(--apart-orange); }
/* Kontakt ist in der Vorlage ein oranger Button, kein oranger Text */
body .tm-header .uk-navbar-nav > li.apart-nav-cta > a,
body .uk-navbar-sticky .uk-navbar-nav > li.apart-nav-cta > a {
background: var(--apart-orange);
color: #fff !important;
padding: 0.55rem 1.25rem;
min-height: 0;
line-height: 1.17;
}
body .tm-header .uk-navbar-nav > li.apart-nav-cta > a:hover { background: #C4670C; }
body .uk-navbar-container.uk-navbar-sticky { background: rgba(251, 250, 247, 0.92) !important; }
body .uk-navbar-sticky .uk-navbar-nav > li > a { color: var(--apart-ink) !important; }
body .uk-navbar-sticky .apart-brand-sub { color: var(--apart-muted) !important; }
/* --------------------------------------------------------------------------
6. Hero
-------------------------------------------------------------------------- */
body .apart-hero > .uk-section {
padding-top: 7rem;
padding-bottom: 6rem;
min-height: 100svh;
}
/* Der Builder skaliert die ganze Sektion um 1.15 - in der Vorlage wird nur
das Hintergrundbild groesser gerechnet. Ohne diese Zeile sind Hero-Text
und Hero-Hoehe 15 % zu gross. */
body .apart-hero .uk-background-norepeat {
transform: none !important;
background-position: 50% 6%;
}
/* Nur das oberste Raster der Sektion, nicht die verschachtelte Button-Reihe */
body .apart-hero .uk-container > .uk-grid { margin-left: 0 !important; }
body .apart-hero .uk-container > .uk-grid > * { padding-left: 0; margin-top: 0 !important; }
body .apart-hero .uk-container > .uk-grid > :first-child:not(:last-child) { display: none; }
body .apart-hero .uk-container > .uk-grid > :last-child {
width: 100% !important;
max-width: 40rem;
margin-left: auto;
}
body .apart-hero h1 {
font-family: Archivo, sans-serif;
font-weight: 850;
font-variation-settings: "wdth" 115;
/* Obergrenze auf Kundenwunsch von 6rem auf 5rem: bei 96 px brach
"Ihre Immobilie" in zwei Zeilen um, bei 80 px steht es zusammen. */
font-size: clamp(2.75rem, 8vw, 5rem) !important;
line-height: 1 !important;
letter-spacing: -0.025em !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
body .apart-hero .apart-roofline {
height: clamp(1.6rem, 3vw, 2.4rem);
}
body .apart-hero .apart-roofline,
body .apart-hero h1 + div { margin-top: 1.4rem !important; margin-bottom: 0 !important; }
body .apart-hero .uk-text-lead {
margin-top: 1.75rem !important;
margin-bottom: 0 !important;
max-width: 36rem;
width: auto !important;
font-size: clamp(1.05rem, 1.6vw, 1.25rem);
line-height: 1.65;
font-weight: 400;
}
body .apart-hero .uk-text-lead + div { margin-top: 2.25rem !important; }
body .apart-hero .uk-grid-small { margin-left: -1rem !important; }
body .apart-hero .uk-grid-small > * { padding-left: 1rem; }
/* Mobil: die Vorlage bleibt linksbuendig, der Builder zentriert unter 960 px */
@media (max-width: 959px) {
body .apart-hero .uk-text-center,
body #ueber-uns .uk-text-center,
body #kontakt .uk-text-center { text-align: left !important; }
body .apart-hero .uk-flex-center { justify-content: flex-start !important; }
body .apart-hero .uk-container > .uk-grid > :last-child { margin-left: 0; }
}
/* --------------------------------------------------------------------------
7. Leistungen
-------------------------------------------------------------------------- */
body #leistungen .uk-margin-large-bottom { margin-bottom: clamp(2rem, 5vw, 3.5rem) !important; }
body .apart-showcase { margin: 0; }
body .apart-showcase-labels { padding: 2.4rem clamp(1rem, 3vw, 1.75rem) 1rem; }
body .apart-showcase .showcase-label { font-size: 0.82rem; letter-spacing: 0.16em; }
body .apart-leistungen,
body .apart-partner { margin-top: 0 !important; }
/* Kartenraster: Abstand der Vorlage */
body .apart-leistungen > .uk-grid,
body .apart-partner > .uk-grid { margin-left: clamp(-3rem, -3.5vw, -1.5rem) !important; }
body .apart-leistungen > .uk-grid > *,
body .apart-partner > .uk-grid > * { padding-left: clamp(1.5rem, 3.5vw, 3rem); }
body .apart-leistungen > .uk-grid > .uk-grid-margin,
body .apart-partner > .uk-grid > .uk-grid-margin { margin-top: clamp(1.5rem, 3.5vw, 3rem) !important; }
body .apart-leistungen .uk-card { border-radius: 0; }
body .apart-leistungen .uk-card-body { padding: clamp(1.5rem, 3vw, 2.25rem); }
body .apart-leistungen .uk-card-media-top img { border-radius: 0; }
body .apart-leistungen .el-title {
font-family: Archivo, sans-serif;
font-size: 1.5rem;
font-weight: 800;
font-variation-settings: "wdth" 110;
line-height: 1.65;
letter-spacing: -0.01em;
margin-top: 0 !important;
margin-bottom: 0.75rem !important;
padding-bottom: 0.85rem;
}
body .apart-leistungen .el-content { margin-top: 0 !important; }
body .apart-leistungen .el-content p { color: var(--apart-muted); margin: 0; }
body .apart-leistungen .el-content p a { color: var(--apart-orange); font-weight: 600; }
/* Checkliste: feine Trennlinien mit Dachlinien-Haken statt Haekchen-Icon */
body .apart-checklist {
margin-top: 1.1rem !important;
margin-bottom: 0 !important;
border-top: 1px solid var(--apart-line);
list-style: none;
padding-left: 0;
}
body .apart-checklist > li {
position: relative;
padding: 0.55rem 0 0.55rem 1.4rem;
border-bottom: 1px solid var(--apart-line);
font-size: 0.975rem;
line-height: 1.65;
color: var(--apart-ink);
}
body .apart-checklist > li:nth-child(n+2) { margin-top: 0 !important; }
body .apart-checklist > li::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 0.75rem;
height: 0.75rem;
transform: translateY(-50%) skewX(-24deg);
border-left: 2.5px solid var(--apart-orange);
border-top: 2.5px solid var(--apart-orange);
border-right: 0;
border-bottom: 0;
background: none;
box-sizing: border-box;
}
/* --------------------------------------------------------------------------
8. Statement / Zahlen
-------------------------------------------------------------------------- */
body .apart-statement > .uk-section {
padding-top: clamp(5.5rem, 12vw, 10rem);
padding-bottom: clamp(5.5rem, 12vw, 10rem);
}
/* Der Textblock steht in der Vorlage mittig und nur so breit wie der Satz */
body .apart-statement > .uk-section > .uk-container {
width: max-content;
max-width: min(100%, 62rem);
margin-left: auto;
margin-right: auto;
}
body .apart-statement .apart-roofline {
height: 2rem;
margin-top: 0 !important;
margin-bottom: 2rem !important;
}
body .apart-statement .uk-heading-small {
font-size: clamp(1.9rem, 4.4vw, 3.5rem);
line-height: 1.12;
letter-spacing: -0.02em;
margin: 0 !important;
max-width: 60rem;
}
body .apart-stats { margin-top: clamp(3rem, 7vw, 5rem) !important; margin-bottom: 0 !important; }
body .apart-stats > .uk-grid {
display: grid;
grid-template-columns: repeat(3, auto);
justify-content: start;
gap: clamp(2rem, 7vw, 6rem);
margin-left: 0 !important;
}
body .apart-stats > .uk-grid > * {
padding-left: 0;
margin-top: 0 !important;
width: auto !important;
}
body .apart-stats .el-item { display: flex; flex-direction: column; }
body .apart-stats .el-meta {
font-size: 0.78rem;
line-height: 1.65;
letter-spacing: 0.18em;
margin: 0 0 0.35rem !important;
order: -1;
}
body .apart-stats .el-title {
font-size: clamp(2.6rem, 5.5vw, 4.2rem);
line-height: 1;
letter-spacing: normal;
margin: 0 !important;
}
@media (max-width: 640px) {
body .apart-stats > .uk-grid { grid-template-columns: 1fr; gap: 1.75rem; }
}
/* --------------------------------------------------------------------------
9. Ueber uns
-------------------------------------------------------------------------- */
body #ueber-uns > .uk-container > .uk-grid { margin-left: -5rem !important; align-items: center; }
body #ueber-uns > .uk-container > .uk-grid > * { padding-left: 5rem; }
@media (min-width: 960px) {
body #ueber-uns > .uk-container > .uk-grid > :first-child { width: 56.46% !important; }
body #ueber-uns > .uk-container > .uk-grid > :nth-child(2) { width: 43.54% !important; }
}
body #ueber-uns .uk-panel p { color: var(--apart-muted); max-width: 34rem; }
body #ueber-uns .uk-panel strong { color: var(--apart-ink); }
body #ueber-uns .el-image.uk-border-rounded { border-radius: 0; aspect-ratio: 4 / 5; object-fit: cover; }
body #ueber-uns > .uk-container > .uk-grid > :nth-child(2) .uk-text-meta {
margin-top: 0.75rem !important;
font-size: 0.9rem;
line-height: 1.65;
color: var(--apart-muted) !important;
}
/* VDIV-Zeile als weisse Box mit Rahmen (wie .ueber-badge der Vorlage) */
body #ueber-uns > .uk-container .uk-list {
margin-top: 1.75rem !important;
margin-bottom: 0 !important;
box-sizing: border-box;
max-width: 34rem !important;
padding: 1rem 1.25rem;
border: 1px solid var(--apart-line);
background: #fff;
list-style: none;
font-size: 0.95rem;
}
body #ueber-uns > .uk-container .uk-list .el-content { color: var(--apart-ink); }
body #ueber-uns > .uk-container .uk-list .el-content strong { font-weight: 400; }
/* Verbandslogo statt des Haus-Icons in der Mitglieds-Box */
body #ueber-uns > .uk-container .uk-list .el-image {
display: block;
width: 4.2rem;
height: 2.3rem;
background: url('/wp-content/uploads/2026/08/apart-vdiv.png') no-repeat 50% 50% / contain;
}
/* Verbandslogo in der Netzwerk-Kachel */
body .apart-partner .apart-vdiv-logo {
display: block;
width: auto;
height: 3.2rem;
margin-bottom: 1.25rem;
}
body #ueber-uns > .uk-container .uk-list .el-image svg { display: none; }
/* Umriss Sachsen-Anhalt in der Partner-Kachel - Gegenstueck zum Verbandslogo
nebenan. Kommt als Inline-SVG aus js/apart.js. Rein dekorativ, der orange
Punkt markiert Magdeburg. Etwas hoeher als das VDIV-Logo (4.6 statt 3.2rem),
weil die Form hochkant steht und sonst deutlich leichter wirkt. */
body .apart-partner .apart-region-map {
display: block;
height: 4.6rem;
width: auto;
margin-bottom: 1.25rem;
overflow: visible;
}
body .apart-region-flaeche {
fill: #EFE7DB;
stroke: #C9BFB0;
stroke-width: 1.2;
stroke-linejoin: round;
}
body .apart-region-ort {
fill: var(--apart-orange);
stroke: #fff;
stroke-width: 1.6;
}
/* --------------------------------------------------------------------------
10. Partner
-------------------------------------------------------------------------- */
body .apart-partner .uk-card { padding: clamp(1.75rem, 3.5vw, 2.5rem); border-radius: 0; }
body .apart-partner .el-meta {
font-size: 0.78rem;
line-height: 1.65;
letter-spacing: 0.16em;
margin: 0 0 0.6rem !important;
}
body .apart-partner .el-title {
font-size: 1.6rem;
line-height: 1.65;
margin: 0 0 0.6rem !important;
}
body .apart-partner .el-content { margin-top: 0 !important; }
body .apart-partner .el-content p { margin: 0; }
body .apart-partner .uk-card > .uk-margin-top:last-child { margin-top: 1.1rem !important; }
body .apart-partner .el-link { padding: 0; min-height: 0; border: 0; font-size: 0.95rem; }
/* --------------------------------------------------------------------------
11. Kontakt - in der Vorlage weisse Sektion, Formular ohne Karte
-------------------------------------------------------------------------- */
body #kontakt.uk-section-muted { background: #fff; border-top: 1px solid var(--apart-line); }
body #kontakt > .uk-container > .uk-grid { margin-left: -5rem !important; }
body #kontakt > .uk-container > .uk-grid > * { padding-left: 5rem; }
@media (min-width: 960px) {
body #kontakt > .uk-container > .uk-grid > :first-child { width: 43.54% !important; }
body #kontakt > .uk-container > .uk-grid > :nth-child(2) { width: 56.46% !important; }
}
body #kontakt .uk-card {
background: none;
border: 0;
box-shadow: none;
padding: 0;
border-radius: 0;
}
body #kontakt .apart-kontakt { margin-top: 1.5rem !important; }
body #kontakt .uk-list-large > li:nth-child(n+2) { margin-top: 0.6rem !important; }
body #kontakt > .uk-container > .uk-grid > :first-child > .uk-text-meta {
margin-top: 1.5rem !important;
font-size: 0.95rem;
line-height: 1.65;
color: var(--apart-muted) !important;
}
body .wpcf7 input[type=submit] {
font-size: 0.9375rem;
font-weight: 640;
letter-spacing: 0.04em;
text-transform: none;
padding: 0.9rem 1.75rem;
border: 2px solid var(--apart-orange);
line-height: normal;
}
/* CF7 setzt hinter jedes Label ein
und packt alles in - beides
erzeugt Abstaende, die die Vorlage nicht hat. */
body .wpcf7 .apart-form-field br { display: none; }
body .wpcf7 .wpcf7-form-control-wrap { display: block; }
body .wpcf7 form > p { margin: 0; }
body .wpcf7 .apart-form-consent { margin-bottom: 1.25rem !important; }
body .wpcf7 .wpcf7-response-output { margin: 1rem 0 0; }
body .wpcf7 input[type=text],
body .wpcf7 input[type=email],
body .wpcf7 input[type=tel],
body .wpcf7 textarea { padding: 0.8rem 0.9rem; border-radius: 0; }
/* --------------------------------------------------------------------------
12. Footer
-------------------------------------------------------------------------- */
/* Skyline laeuft in der Vorlage ueber die volle Breite, direkt am Footer-Anfang */
body .apart-footer { padding-top: 0; }
body .apart-footer .uk-container-expand { padding: 0; }
body .apart-skyline {
width: min(100vw, 1440px);
max-width: none;
margin-left: 50%;
transform: translateX(-50%);
padding-top: clamp(2.5rem, 5vw, 4rem);
border-bottom: 1px solid rgba(244, 239, 232, 0.1);
}
body .apart-footer .uk-container-expand + .uk-grid-margin-large {
padding-top: clamp(3rem, 6vw, 4.5rem);
padding-bottom: clamp(2.5rem, 5vw, 4rem);
margin-top: 0 !important;
}
/* Vier gleich breite Spalten ab 1200px, dazwischen (960-1199px) zwei mal zwei;
3rem Abstand, damit die Mailadresse in eine Zeile passt */
body .apart-footer > .uk-container > .uk-grid-margin-large { margin-left: -3rem !important; }
body .apart-footer > .uk-container > .uk-grid-margin-large > * { padding-left: 3rem; }
@media (min-width: 960px) and (max-width: 1199px) {
body .apart-footer > .uk-container > .uk-grid-margin-large > :nth-child(n) { width: 50% !important; }
}
@media (min-width: 1200px) {
body .apart-footer > .uk-container > .uk-grid-margin-large > :nth-child(n) { width: 25% !important; }
}
/* Kontakt- und Rechtliches-Links: eine Zeile, kein Umbruch in der Mailadresse */
body .apart-footer .uk-list .el-item { font-size: 0.95rem; }
body .apart-footer .uk-list .el-item a,
body .apart-footer .uk-list .el-item span.uk-link { white-space: nowrap; overflow-wrap: normal; }
body .apart-footer .uk-margin-small-bottom > .el-image { height: 2.6rem; width: auto; }
body .apart-footer-claim p { font-size: 0.95rem; line-height: 1.7; }
body .apart-footer-head {
font-size: 0.72rem;
line-height: 1.65;
letter-spacing: 0.2em;
margin-bottom: 0.9rem !important;
}
body .apart-footer .uk-panel p,
body .apart-footer .el-content { line-height: 1.9; }
/* Buerozeiten (Footer und Kontakt-Section): Tag in fester Spalte, Zeiten
buendig untereinander - das Raster baut initHours() in js/apart.js */
body .apart-hours-title { display: block; margin-bottom: 0.3rem; }
body .apart-hours {
display: grid;
grid-template-columns: max-content 1fr;
column-gap: 0.85rem;
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
body .apart-hours-day { color: #6B655D; }
body .apart-footer .apart-hours-day { color: #B5AB9D; }
/* Copyright-Zeile: Vorlage 0.85rem, KI-Hinweis kleiner und gedaempft */
body footer .uk-section-small .uk-text-small { font-size: 0.85rem; }
body footer .uk-section-small .uk-text-small p:nth-child(2) { font-size: 0.75rem; opacity: 0.55; }
body footer .uk-section-small .uk-text-small p:last-child { font-size: 0.8125rem; opacity: 0.5; }
/* --------------------------------------------------------------------------
13. Scroll-to-Top
-------------------------------------------------------------------------- */
body .apart-totop { border-radius: 0; }