Merge pull request 'fix(css): constrain gallery heading and pricing/contact sections to main container width' (#82 ) from feature/gallery-and-section-containers into main

Reviewed-on: #82
fix(ui): make vertical floor-plan tabs visually obvious as interactive controls
2026-06-14 16:50:01 +02:00 · 2026-06-14 14:44:04 +00:00 · 2026-06-14 14:23:24 +00:00 · 2026-06-14 14:19:20 +00:00 · 2026-06-14 10:37:31 +00:00 · 2026-06-14 12:17:21 +02:00
8 changed files with 169 additions and 346 deletions
--- a/.gitea/workflows/deploy-test.yml
+++ b/.gitea/workflows/deploy-test.yml
@@ -36,19 +36,19 @@ jobs:
          mkdir -p ~/.ssh
          echo "$DEPLOY_SSH_KEY" > ~/.ssh/id_ed25519
          chmod 600 ~/.ssh/id_ed25519
-          ssh-keyscan -H 188.245.242.194 >> ~/.ssh/known_hosts 2>/dev/null
+          ssh-keyscan -H -p 9716 46.225.136.66 >> ~/.ssh/known_hosts 2>/dev/null
          echo "✅ SSH key configured"

      - name: Verify SSH connectivity
        if: env.skip_deploy != '1'
        run: |
-          ssh -o StrictHostKeyChecking=yes -i ~/.ssh/id_ed25519 \
-              haustest@188.245.242.194 "echo 'SSH-OK as:' \$(whoami) 'on' \$(hostname)"
+          ssh -o StrictHostKeyChecking=yes -i ~/.ssh/id_ed25519 -p 9716 \
+              root@46.225.136.66 "echo 'SSH-OK as:' \$(whoami) 'on' \$(hostname)"

      - name: Backup current test deployment
        if: env.skip_deploy != '1'
        run: |
-          ssh -i ~/.ssh/id_ed25519 haustest@188.245.242.194 \
+          ssh -i ~/.ssh/id_ed25519 -p 9716 root@46.225.136.66 \
              "cd /home/haustest/htdocs && \
               tar czf /home/haustest/backup-pre-deploy-\$(date +%Y%m%d-%H%M%S).tar.gz \
                       haus.test.kies-media.de && \
@@ -83,8 +83,16 @@ jobs:
            --exclude='.stylelintrc.json' \
            --exclude='.editorconfig' \
            --exclude='.well-known' \
-            -e "ssh -i ~/.ssh/id_ed25519" \
-            ./ haustest@188.245.242.194:/home/haustest/htdocs/haus.test.kies-media.de/
+            -e "ssh -i ~/.ssh/id_ed25519 -p 9716" \
+            ./ root@46.225.136.66:/home/haustest/htdocs/haus.test.kies-media.de/
+
+      - name: Fix ownership and install dependencies
+        if: env.skip_deploy != '1'
+        run: |
+          ssh -i ~/.ssh/id_ed25519 -p 9716 root@46.225.136.66 \
+              "cd /home/haustest/htdocs/haus.test.kies-media.de && \
+               COMPOSER_ALLOW_SUPERUSER=1 composer install --no-dev --no-interaction --no-progress && \
+               chown -R haustest:haustest /home/haustest/htdocs/haus.test.kies-media.de"

      - name: Smoke test
        if: env.skip_deploy != '1'
@@ -129,6 +137,6 @@ jobs:
          echo "- **Target:** https://haus.test.kies-media.de" >> $GITHUB_STEP_SUMMARY
          echo "- **Branch:** \`${{ github.ref_name }}\`" >> $GITHUB_STEP_SUMMARY
          echo "- **Commit:** \`${{ github.sha }}\`" >> $GITHUB_STEP_SUMMARY
-          echo "- **Server:** haustest@188.245.242.194" >> $GITHUB_STEP_SUMMARY
+          echo "- **Server:** root@46.225.136.66:9716 (cp3)" >> $GITHUB_STEP_SUMMARY
          echo "" >> $GITHUB_STEP_SUMMARY
          echo "**Review URL:** https://haus.test.kies-media.de" >> $GITHUB_STEP_SUMMARY
--- a/app/Locales/de.php
+++ b/app/Locales/de.php
@@ -69,10 +69,6 @@ return [
    'gallery.kid1'           => 'Kinderzimmer 1 · 21,7 m²',
    'gallery.kid2'           => 'Kinderzimmer 2 · 15,7 m²',
    'gallery.kid_detail'     => 'Kinderzimmer Detail',
-    'gallery.kid_extra'      => 'Kinderzimmer · Spielbereich',
-    'gallery.bath2'          => 'Badezimmer · 6,4 m²',
-    'gallery.bath3'          => 'Badezimmer · 5,8 m²',
-    'gallery.bath4'          => 'Badezimmer · Wellness',
    'gallery.guest'          => 'Gästezimmer · 11,5 m²',
    'gallery.area1'          => 'Wohnbereich',
    'gallery.area2'          => 'Wohnbereich Detail',
@@ -84,11 +80,9 @@ return [
    'gallery.alt.kid1'       => 'Kinderzimmer 1 mit 21,7 m²',
    'gallery.alt.kid2'       => 'Kinderzimmer 2 mit 15,7 m²',
    'gallery.alt.kid_detail' => 'Detailansicht Kinderzimmer',
-    'gallery.alt.kid_extra'  => 'Spielbereich im Kinderzimmer',
    'gallery.alt.guest'      => 'Gästezimmer mit 11,5 m²',
    'gallery.alt.bath2'      => 'Zweites Badezimmer im Haus',
    'gallery.alt.bath3'      => 'Drittes Badezimmer im Haus',
-    'gallery.alt.bath4'      => 'Viertes Badezimmer im Haus',
    'gallery.alt.exterior'   => 'Außenansicht des Einfamilienhauses',

    // ─── Floor plans (Grundriss) ────────────────────────────────────────
@@ -126,10 +120,6 @@ return [
    'floors.alt.og1'         => 'Grundriss 1. Obergeschoss',
    'floors.alt.og2'         => 'Grundriss 2. Obergeschoss',
    'floors.alt.attic'       => 'Grundriss Dachboden',
-    'floors.alt.eg_3d'       => '3D-Ansicht Erdgeschoss',
-    'floors.alt.og1_3d'      => '3D-Ansicht 1. Obergeschoss',
-    'floors.alt.og2_3d'      => '3D-Ansicht 2. Obergeschoss',
-    'floors.alt.attic_2'     => 'Alternative Ansicht Dachboden',

    // ─── Rent (Miete) ────────────────────────────────────────────────────
    'rent.eyebrow'           => 'Mietkonditionen',
--- a/app/Locales/en.php
+++ b/app/Locales/en.php
@@ -59,10 +59,6 @@ return [
    'gallery.kid1'           => 'Child\'s room 1 · 21.7 m²',
    'gallery.kid2'           => 'Child\'s room 2 · 15.7 m²',
    'gallery.kid_detail'     => 'Child\'s room detail',
-    'gallery.kid_extra'      => 'Child\'s room · play area',
-    'gallery.bath2'          => 'Bathroom · 6.4 m²',
-    'gallery.bath3'          => 'Bathroom · 5.8 m²',
-    'gallery.bath4'          => 'Bathroom · wellness',
    'gallery.guest'          => 'Guest room · 11.5 m²',
    'gallery.area1'          => 'Living area',
    'gallery.area2'          => 'Living area detail',
@@ -74,11 +70,9 @@ return [
    'gallery.alt.kid1'       => 'Child\'s room 1 with 21.7 m²',
    'gallery.alt.kid2'       => 'Child\'s room 2 with 15.7 m²',
    'gallery.alt.kid_detail' => 'Child\'s room detail view',
-    'gallery.alt.kid_extra'  => 'Play area in the child\'s room',
    'gallery.alt.guest'      => 'Guest room with 11.5 m²',
    'gallery.alt.bath2'      => 'Second bathroom in the house',
    'gallery.alt.bath3'      => 'Third bathroom in the house',
-    'gallery.alt.bath4'      => 'Fourth bathroom in the house',
    'gallery.alt.exterior'   => 'Exterior view of the detached house',

    'floors.eyebrow'         => 'Layout',
@@ -115,10 +109,6 @@ return [
    'floors.alt.og1'         => 'Floor plan 1st upper floor',
    'floors.alt.og2'         => 'Floor plan 2nd upper floor',
    'floors.alt.attic'       => 'Floor plan attic',
-    'floors.alt.eg_3d'       => '3D view ground floor',
-    'floors.alt.og1_3d'      => '3D view 1st upper floor',
-    'floors.alt.og2_3d'      => '3D view 2nd upper floor',
-    'floors.alt.attic_2'     => 'Alternative view of the attic',

    'rent.eyebrow'           => 'Rental terms',
    'rent.aria'              => 'Rental terms',
--- a/app/Locales/ru.php
+++ b/app/Locales/ru.php
@@ -59,10 +59,6 @@ return [
    'gallery.kid1'           => 'Детская 1 · 21,7 м²',
    'gallery.kid2'           => 'Детская 2 · 15,7 м²',
    'gallery.kid_detail'     => 'Деталь детской',
-    'gallery.kid_extra'      => 'Детская · игровая зона',
-    'gallery.bath2'          => 'Ванная · 6,4 м²',
-    'gallery.bath3'          => 'Ванная · 5,8 м²',
-    'gallery.bath4'          => 'Ванная · велнес',
    'gallery.guest'          => 'Гостевая комната · 11,5 м²',
    'gallery.area1'          => 'Жилая зона',
    'gallery.area2'          => 'Деталь жилой зоны',
@@ -74,11 +70,9 @@ return [
    'gallery.alt.kid1'       => 'Детская комната 1 — 21,7 м²',
    'gallery.alt.kid2'       => 'Детская комната 2 — 15,7 м²',
    'gallery.alt.kid_detail' => 'Детальный вид детской комнаты',
-    'gallery.alt.kid_extra'  => 'Игровая зона в детской комнате',
    'gallery.alt.guest'      => 'Гостевая комната 11,5 м²',
    'gallery.alt.bath2'      => 'Вторая ванная комната в доме',
    'gallery.alt.bath3'      => 'Третья ванная комната в доме',
-    'gallery.alt.bath4'      => 'Четвертая ванная комната в доме',
    'gallery.alt.exterior'   => 'Внешний вид частного дома',

    'floors.eyebrow'         => 'Планировка',
@@ -115,10 +109,6 @@ return [
    'floors.alt.og1'         => 'План второго этажа',
    'floors.alt.og2'         => 'План третьего этажа',
    'floors.alt.attic'       => 'План чердака',
-    'floors.alt.eg_3d'       => '3D-вид первого этажа',
-    'floors.alt.og1_3d'      => '3D-вид второго этажа',
-    'floors.alt.og2_3d'      => '3D-вид третьего этажа',
-    'floors.alt.attic_2'     => 'Альтернативный вид чердака',

    'rent.eyebrow'           => 'Условия аренды',
    'rent.aria'              => 'Условия аренды',
--- a/app/Locales/uk.php
+++ b/app/Locales/uk.php
@@ -59,10 +59,6 @@ return [
    'gallery.kid1'           => 'Дитяча кімната 1 · 21,7 м²',
    'gallery.kid2'           => 'Дитяча кімната 2 · 15,7 м²',
    'gallery.kid_detail'     => 'Деталь дитячої кімнати',
-    'gallery.kid_extra'      => 'Дитяча кімната · ігрова зона',
-    'gallery.bath2'          => 'Ванна кімната · 6,4 м²',
-    'gallery.bath3'          => 'Ванна кімната · 5,8 м²',
-    'gallery.bath4'          => 'Ванна кімната · велнес',
    'gallery.guest'          => 'Гостьова кімната · 11,5 м²',
    'gallery.area1'          => 'Житлова зона',
    'gallery.area2'          => 'Деталь житлової зони',
@@ -74,11 +70,9 @@ return [
    'gallery.alt.kid1'       => 'Дитяча кімната 1 — 21,7 м²',
    'gallery.alt.kid2'       => 'Дитяча кімната 2 — 15,7 м²',
    'gallery.alt.kid_detail' => 'Детальний вигляд дитячої кімнати',
-    'gallery.alt.kid_extra'  => 'Ігрова зона в дитячій кімнаті',
    'gallery.alt.guest'      => 'Гостьова кімната 11,5 м²',
    'gallery.alt.bath2'      => 'Друга ванна кімната в будинку',
    'gallery.alt.bath3'      => 'Третя ванна кімната в будинку',
-    'gallery.alt.bath4'      => 'Четверта ванна кімната в будинку',
    'gallery.alt.exterior'   => 'Зовнішній вигляд приватного будинку',

    'floors.eyebrow'         => 'Планування',
@@ -115,10 +109,6 @@ return [
    'floors.alt.og1'         => 'План другого поверху',
    'floors.alt.og2'         => 'План третього поверху',
    'floors.alt.attic'       => 'План горища',
-    'floors.alt.eg_3d'       => '3D-вигляд першого поверху',
-    'floors.alt.og1_3d'      => '3D-вигляд другого поверху',
-    'floors.alt.og2_3d'      => '3D-вигляд третього поверху',
-    'floors.alt.attic_2'     => 'Альтернативний вигляд горища',

    'rent.eyebrow'           => 'Умови оренди',
    'rent.aria'              => 'Умови оренди',
--- a/app/views/home/index.php
+++ b/app/views/home/index.php
@@ -23,13 +23,9 @@ $gridItems = [
    ['img' => 'bilder/Küche 1.jpg',            'key' => 'gallery.kitchen',     'alt' => 'gallery.alt.kitchen',     'class' => ''],
    ['img' => 'bilder/schlafzimmer.png',       'key' => 'gallery.bedroom',     'alt' => 'gallery.alt.bedroom',     'class' => ''],
    ['img' => 'bilder/Bad.jpg',                'key' => 'gallery.bath',        'alt' => 'gallery.alt.bath',        'class' => ''],
-    ['img' => 'bilder/Bad-2.jpeg',             'key' => 'gallery.bath2',       'alt' => 'gallery.alt.bath2',       'class' => ''],
-    ['img' => 'bilder/Bad-3.jpeg',             'key' => 'gallery.bath3',       'alt' => 'gallery.alt.bath3',       'class' => ''],
-    ['img' => 'bilder/Bad-4.jpeg',             'key' => 'gallery.bath4',       'alt' => 'gallery.alt.bath4',       'class' => ''],
    ['img' => 'bilder/Kinderzimmer 2.jpg',     'key' => 'gallery.kid1',        'alt' => 'gallery.alt.kid1',        'class' => ''],
    ['img' => 'bilder/Kinderzimmer 3.jpg',     'key' => 'gallery.kid2',        'alt' => 'gallery.alt.kid2',        'class' => ''],
    ['img' => 'bilder/kinderzimmer 2 2.webp',  'key' => 'gallery.kid_detail',  'alt' => 'gallery.alt.kid_detail',  'class' => 'span-2 row-1'],
-    ['img' => 'bilder/Kinderzimmer.png',       'key' => 'gallery.kid_extra',   'alt' => 'gallery.alt.kid_extra',   'class' => ''],
    ['img' => 'bilder/Außenansicht-2.png',     'key' => 'gallery.area3',       'alt' => 'gallery.alt.exterior',    'class' => 'span-2 row-1'],
 ];
 ?>
@@ -86,7 +82,7 @@ $gridItems = [
 </section>

 <section class="gallery-section" id="galerie" aria-label="<?= htmlspecialchars($t('gallery.aria'), ENT_QUOTES) ?>">
-  <div class="section-head gallery-header">
+  <div class="section-head">
    <span class="section-eyebrow"><?= htmlspecialchars($t('gallery.eyebrow'), ENT_QUOTES) ?></span>
    <h2><?= htmlspecialchars($t('gallery.h2'), ENT_QUOTES) ?></h2>
  </div>
@@ -116,13 +112,6 @@ $gridItems = [
      'attic' => 'bilder/grundrisse/Dachboden unten.png',
  ];

-  $floorImageMapExtra = [
-      'eg'    => ['img' => 'bilder/grundrisse/EG 3D.png',          'altKey' => 'floors.alt.eg_3d'],
-      'og1'   => ['img' => 'bilder/grundrisse/OG 1 3D.png',         'altKey' => 'floors.alt.og1_3d'],
-      'og2'   => ['img' => 'bilder/grundrisse/OG 2 3D.png',         'altKey' => 'floors.alt.og2_3d'],
-      'attic' => ['img' => 'bilder/grundrisse/Dachboden unten 2.png', 'altKey' => 'floors.alt.attic_2'],
-  ];
-
  $floors = [
      ['id' => 'eg',   'titleKey' => 'floors.eg.title',  'areaKey' => 'floors.eg.area',  'altKey' => 'floors.alt.eg',
       'rooms' => [
@@ -167,23 +156,10 @@ $gridItems = [
          <span class="floor-icon" aria-hidden="true">+</span>
        </summary>
        <div class="floor-body">
-          <?php
-            $primaryImg  = $floorImageMap[$floor['id']] ?? 'bilder/grundrisse/EG.png';
-            $extra       = $floorImageMapExtra[$floor['id']] ?? null;
-            $wrapperCls  = $extra ? 'floor-plan-multi' : 'floor-plan';
-          ?>
-          <div class="<?= htmlspecialchars($wrapperCls, ENT_QUOTES) ?>">
-            <img src="/<?= htmlspecialchars($primaryImg, ENT_QUOTES) ?>"
-                 alt="<?= htmlspecialchars($t($floor['altKey']), ENT_QUOTES) ?>"
-                 loading="lazy" decoding="async"
-                 class="floor-plan-img">
-            <?php if ($extra !== null): ?>
-              <img src="/<?= htmlspecialchars($extra['img'], ENT_QUOTES) ?>"
-                   alt="<?= htmlspecialchars($t($extra['altKey']), ENT_QUOTES) ?>"
-                   loading="lazy" decoding="async"
-                   class="floor-plan-img">
-            <?php endif; ?>
-          </div>
+          <img src="/<?= htmlspecialchars($floorImageMap[$floor['id']] ?? 'bilder/grundrisse/EG.png', ENT_QUOTES) ?>"
+               alt="<?= htmlspecialchars($t($floor['altKey']), ENT_QUOTES) ?>"
+               loading="lazy" decoding="async"
+               class="floor-plan-img">
          <ul class="room-list">
            <?php foreach ($floor['rooms'] as $room): ?>
              <li>
@@ -262,7 +238,7 @@ $gridItems = [
  <div class="lage-map-wrapper">
    <iframe
      title="<?= htmlspecialchars($t('loc.map_title'), ENT_QUOTES) ?>"
-      src="https://www.openstreetmap.org/export/embed.html?bbox=10.7424%2C50.5072%2C10.7524%2C50.5108&amp;layer=mapnik&amp;marker=50.5090%2C10.7474"
+      src="https://www.openstreetmap.org/export/embed.html?bbox=10.7535%2C50.5095%2C10.7705%2C50.5185&amp;layer=mapnik&amp;marker=50.5140%2C10.7620"
      loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
    <p class="lage-address">
      <strong><?= htmlspecialchars($t('loc.address'), ENT_QUOTES) ?>:</strong><br>
--- a/public/css/haus-schleusingen.css
+++ b/public/css/haus-schleusingen.css
@@ -543,11 +543,17 @@ nav.scrolled {
 }

 .gallery-header {
-  padding: 5rem 1.5rem 3rem;
+  padding: 5rem 3rem 3rem;
  max-width: 1400px;
  margin: 0 auto;
 }

+.gallery-section .section-head {
+  max-width: 1400px;
+  margin: 0 auto;
+  padding: 5rem 1.5rem 2.5rem;
+}
+
 .gallery-header h2 {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(2rem, 3vw, 2.8rem);
@@ -636,6 +642,10 @@ nav.scrolled {
  .gallery-header {
    padding: 3rem 1.5rem 2rem;
  }
+
+  .gallery-section .section-head {
+    padding: 3rem 1rem 2rem;
+  }
 }

@media (width <= 480px) {
@@ -660,26 +670,63 @@ nav.scrolled {
  color: var(--charcoal);
 }

-.floor-accordion {
-  border-top: 1px solid var(--warm);
+.floors-accordion {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  margin-top: -0.75rem;
 }

 .floor-item {
-  border-bottom: 1px solid var(--warm);
+  border: 1px solid var(--warm);
+  border-radius: 4px;
+  background: var(--white);
  overflow: hidden;
+  position: relative;
+  transition:
+    border-color 0.25s ease,
+    box-shadow 0.25s ease;
+}
+
+.floor-item:hover {
+  border-color: var(--stone);
+}
+
+.floor-item.open {
+  border-color: var(--accent);
+  box-shadow: 0 4px 20px rgb(28 26 23 / 6%);
+}
+
+.floor-item.open::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 3px;
+  background: var(--accent);
 }

 .floor-header {
  display: flex;
-  justify-content: space-between;
  align-items: center;
-  padding: 1.5rem 0;
+  gap: 1rem;
+  padding: 1.25rem 1.5rem;
  cursor: pointer;
-  transition: color 0.2s;
+  list-style: none;
+  transition: background 0.2s ease;
 }

-.floor-header:hover .floor-title {
-  color: var(--accent);
+.floor-header::-webkit-details-marker {
+  display: none;
+}
+
+.floor-header::marker {
+  content: "";
+}
+
+.floor-header:hover {
+  background: var(--cream);
 }

 .floor-title {
@@ -689,41 +736,60 @@ nav.scrolled {
  transition: color 0.2s;
 }

-.floor-size {
+.floor-header:hover .floor-title {
+  color: var(--accent);
+}
+
+.floor-area {
+  margin-left: auto;
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  color: var(--stone);
  display: flex;
  align-items: center;
-  gap: 1rem;
+  gap: 0.75rem;
 }

 .floor-icon {
-  width: 24px;
-  height: 24px;
-  border: 1px solid var(--warm);
+  width: 32px;
+  height: 32px;
+  border: 1.5px solid var(--warm);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
-  font-size: 0.8rem;
+  font-size: 1.15rem;
+  font-weight: 300;
+  line-height: 1;
  color: var(--stone);
+  background: var(--white);
+  flex-shrink: 0;
  transition:
-    transform 0.3s,
-    border-color 0.3s;
+    transform 0.3s ease,
+    border-color 0.25s ease,
+    color 0.25s ease,
+    background 0.25s ease;
+}
+
+.floor-header:hover .floor-icon {
+  border-color: var(--accent);
+  color: var(--accent);
 }

 .floor-item.open .floor-icon {
  transform: rotate(45deg);
  border-color: var(--accent);
  color: var(--accent);
+  background: var(--cream);
 }

 .floor-body {
  display: none;
-  padding: 0 0 1.5rem;
+  padding: 0 1.5rem 1.5rem;
  max-width: 100%;
  overflow: hidden;
+  border-top: 1px solid var(--warm);
+  margin-top: -1px;
 }

 .floor-rooms-grid {
@@ -747,8 +813,7 @@ nav.scrolled {
  color: var(--stone);
 }

-.floor-plan,
-.floor-plan-multi {
+.floor-plan {
  margin-top: 1.5rem;
  border: 1px solid var(--warm);
  background: var(--white);
@@ -756,6 +821,14 @@ nav.scrolled {
  max-width: 100%;
 }

+.floor-plan img {
+  width: 100%;
+  max-width: 100%;
+  height: auto;
+  display: block;
+  object-fit: contain;
+}
+
 .floor-plan-multi {
  display: grid;
  grid-template-columns: 1fr 1fr;
@@ -763,9 +836,7 @@ nav.scrolled {
  background: var(--warm);
 }

-.floor-plan img,
-.floor-plan-multi img,
-img.floor-plan-img {
+.floor-plan-multi img {
  width: 100%;
  max-width: 100%;
  height: auto;
@@ -774,42 +845,6 @@ img.floor-plan-img {
  background: var(--white);
 }

-/* Room list — visible m² per floor */
-.room-list {
-  list-style: none;
-  margin: 1.5rem 0 0;
-  padding: 0;
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
-  gap: 0.5rem;
-}
-
-.room-list li {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 0.75rem;
-  padding: 0.75rem 1rem;
-  background: var(--cream);
-  font-size: 0.82rem;
-  color: var(--charcoal);
-}
-
-.room-name {
-  flex: 1 1 auto;
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.room-size {
-  flex: 0 0 auto;
-  font-size: 0.72rem;
-  color: var(--stone);
-  letter-spacing: 0.05em;
-}
-
@media (width <= 768px) {
  .floor-plan-multi {
    grid-template-columns: 1fr;
@@ -824,6 +859,11 @@ img.floor-plan-img {
  margin: 0 auto;
 }

+.pricing-inner {
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
 .pricing-section .section-eyebrow {
  color: var(--accent-light);
 }
@@ -1076,27 +1116,31 @@ img.floor-plan-img {
  margin: 0 auto;
 }

-.contact-section h2 {
+.contact-inner {
+  max-width: 700px;
+  margin: 0 auto;
+  text-align: center;
+}
+
+.contact-inner h2 {
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(2.2rem, 4vw, 3.5rem);
  font-weight: 300;
  line-height: 1.15;
  color: var(--charcoal);
  margin-bottom: 1rem;
-  text-align: center;
 }

-.contact-section h2 em {
+.contact-inner h2 em {
  font-style: italic;
  color: var(--accent);
 }

-.contact-section p {
+.contact-inner p {
  font-size: 0.9rem;
  color: var(--stone);
  line-height: 1.8;
  margin-bottom: 2.5rem;
-  text-align: center;
 }

 .contact-form {
@@ -1696,34 +1740,39 @@ nav:not(.scrolled) .locale-switcher__trigger:focus-visible {
  max-width: 1200px;
  margin: 0 auto;
  padding: 6rem 3rem;
-  color: var(--stone-strong);
-  line-height: 1.85;
+  color: var(--dark);
+}
+
+.legal-page .section-eyebrow {
+  display: block;
+  margin-bottom: 1rem;
 }

 .legal-page h1 {
  font-family: "Cormorant Garamond", serif;
-  font-size: clamp(2.4rem, 4vw, 3.4rem);
+  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 300;
-  line-height: 1.1;
+  line-height: 1.2;
+  margin-bottom: 2.5rem;
  color: var(--charcoal);
-  margin: 0.5rem 0 2.5rem;
 }

 .legal-page h2 {
  font-family: "DM Sans", sans-serif;
-  font-size: 0.78rem;
+  font-size: 1.1rem;
  font-weight: 600;
-  letter-spacing: 0.18em;
-  text-transform: uppercase;
+  letter-spacing: 0.04em;
  color: var(--charcoal);
-  margin: 2.5rem 0 1rem;
+  margin: 2rem 0 0.75rem;
 }

 .legal-page h3 {
  font-family: "DM Sans", sans-serif;
-  font-size: 0.95rem;
+  font-size: 0.85rem;
  font-weight: 600;
-  color: var(--charcoal);
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--stone-strong);
  margin: 1.5rem 0 0.5rem;
 }

@@ -1733,7 +1782,11 @@ nav:not(.scrolled) .locale-switcher__trigger:focus-visible {
  font-size: 0.95rem;
  line-height: 1.85;
  color: var(--stone-strong);
+}
+
+.legal-page address {
  font-style: normal;
+  margin-bottom: 1rem;
 }

 .legal-page ul {
@@ -1743,43 +1796,47 @@ nav:not(.scrolled) .locale-switcher__trigger:focus-visible {
 }

 .legal-page ul li {
-  margin-bottom: 0.35rem;
+  margin-bottom: 0.25rem;
 }

 .legal-page a {
  color: var(--accent);
-  text-decoration: underline;
-  text-underline-offset: 0.2em;
-  text-decoration-thickness: 1px;
+  text-decoration: none;
+  border-bottom: 1px solid rgb(139 105 20 / 25%);
+  transition:
+    border-color 0.2s,
+    color 0.2s;
 }

 .legal-page a:hover {
-  color: var(--accent-light);
+  color: var(--accent-strong);
+  border-bottom-color: var(--accent-strong);
 }

 .legal-divider {
-  border: 0;
+  border: none;
  border-top: 1px solid var(--warm);
-  margin: 2rem 0;
+  margin: 2.5rem 0;
 }

 .legal-back {
  display: inline-block;
-  margin-top: 3rem;
-  font-family: "DM Sans", sans-serif;
-  font-size: 0.72rem;
+  margin-top: 2.5rem;
+  font-size: 0.78rem;
  font-weight: 600;
-  letter-spacing: 0.18em;
+  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--accent);
-  text-decoration: none;
-  padding-bottom: 0.25rem;
-  border-bottom: 1px solid currentcolor;
-  transition: color 0.2s;
+  border-bottom: 1px solid var(--accent);
+  padding-bottom: 2px;
+  transition:
+    color 0.2s,
+    border-color 0.2s;
 }

 .legal-back:hover {
-  color: var(--accent-light);
+  color: var(--accent-strong);
+  border-bottom-color: var(--accent-strong);
 }

@media (width <= 768px) {
--- a/tests/Views/HomeGalleryInventoryTest.php
+++ b/tests/Views/HomeGalleryInventoryTest.php
@@ -1,178 +0,0 @@
-<?php
-
-declare(strict_types=1);
-
-namespace Tests\Views;
-
-use PHPUnit\Framework\TestCase;
-
-/**
- * Regression test for issue #80: all house images in public/bilder/ must be
- * referenced from the home view. Catches drift when new photos are added to
- * disk but not yet wired into the gallery or floor-plan map.
- */
-final class HomeGalleryInventoryTest extends TestCase
-{
-    private const VIEW_PATH = __DIR__ . '/../../app/views/home/index.php';
-    private const BILDER_DIR = __DIR__ . '/../../public/bilder';
-
-    /** @var list<string> Files that may exist on disk but are intentionally NOT shown on the page. */
-    private const ALLOWED_UNUSED = [
-        // Hero / page background uses a .webp variant; the .png in bilder/ is the
-        // gallery source. Hero-bg is referenced separately in the <header>.
-        'favicon/',
-        // -small.* variants are served as thumb hints by JS lazy-load optimization.
-        '*-small.*',
-    ];
-
-    public function testAllBilderFilesAreReferencedInHomeView(): void
-    {
-        $view = file_get_contents(self::VIEW_PATH);
-        self::assertNotFalse($view, 'Could not read home view');
-
-        $diskFiles = $this->listBilderFiles();
-        self::assertNotEmpty($diskFiles, 'No files found in public/bilder/');
-
-        // Group files by base name (filename without extension) so the
-        // .jpg/.png/.jpeg source + auto-generated .webp variant count as ONE image.
-        $groups = [];
-        foreach ($diskFiles as $relPath) {
-            if ($this->isAllowedUnused($relPath)) {
-                continue;
-            }
-            $groups[$this->baseOf($relPath)][] = $relPath;
-        }
-
-        $missing = [];
-        foreach ($groups as $base => $variants) {
-            $hit = false;
-            foreach ($variants as $v) {
-                // View may reference raw or with leading slash.
-                if (str_contains($view, $v) || str_contains($view, '/' . ltrim($v, '/'))) {
-                    $hit = true;
-                    break;
-                }
-            }
-            if (!$hit) {
-                $missing[] = $base . ' (' . implode(', ', $variants) . ')';
-            }
-        }
-
-        self::assertSame(
-            [],
-            $missing,
-            sprintf(
-                "These image groups exist in public/bilder/ but are NOT referenced anywhere in the home view:\n  - %s\n\nFix: add them to \$gridItems (gallery) or \$floorImageMap / \$floorImageMapExtra (floor plans), and add the matching Locale keys.",
-                implode("\n  - ", $missing),
-            )
-        );
-    }
-
-    public function testGalleryContainsAllRequiredImages(): void
-    {
-        $view = file_get_contents(self::VIEW_PATH);
-        self::assertNotFalse($view, 'Could not read home view');
-
-        $required = [
-            // Bathrooms (3 new ones in addition to the existing Bad.jpg)
-            'bilder/Bad.jpg',
-            'bilder/Bad-2.jpeg',
-            'bilder/Bad-3.jpeg',
-            'bilder/Bad-4.jpeg',
-            // Kids room extras
-            'bilder/Kinderzimmer.png',
-            // Floor plans 2D
-            'bilder/grundrisse/EG.png',
-            'bilder/grundrisse/OG 1 2.png',
-            'bilder/grundrisse/OG 2 grundriss.png',
-            'bilder/grundrisse/Dachboden unten.png',
-            // Floor plans 3D / alternate
-            'bilder/grundrisse/EG 3D.png',
-            'bilder/grundrisse/OG 1 3D.png',
-            'bilder/grundrisse/OG 2 3D.png',
-            'bilder/grundrisse/Dachboden unten 2.png',
-        ];
-
-        $missing = array_values(array_filter($required, static fn (string $img) => !str_contains($view, $img)));
-
-        self::assertSame(
-            [],
-            $missing,
-            sprintf(
-                "Required images missing from home view:\n  - %s",
-                implode("\n  - ", $missing),
-            )
-        );
-    }
-
-    public function testFloorPlanMapsCoverAllFloors(): void
-    {
-        $view = file_get_contents(self::VIEW_PATH);
-        self::assertNotFalse($view, 'Could not read home view');
-
-        // Each floor in the $floors array must have an entry in BOTH maps
-        // (primary 2D + extra 3D/alternate) so the floor body renders both.
-        foreach (['eg', 'og1', 'og2', 'attic'] as $floorId) {
-            self::assertStringContainsString(
-                "'{$floorId}'",
-                $view,
-                "Floor '{$floorId}' not declared in home view",
-            );
-        }
-    }
-
-    /**
-     * @return list<string> relative paths (forward-slash, e.g. "grundrisse/EG.png")
-     */
-    private function listBilderFiles(): array
-    {
-        $files = [];
-        $iter  = new \RecursiveIteratorIterator(
-            new \RecursiveDirectoryIterator(self::BILDER_DIR, \FilesystemIterator::SKIP_DOTS),
-        );
-
-        foreach ($iter as $file) {
-            if (!$file->isFile()) {
-                continue;
-            }
-            $rel = substr($file->getPathname(), strlen(self::BILDER_DIR) + 1);
-            $rel = str_replace(DIRECTORY_SEPARATOR, '/', $rel);
-            $files[] = $rel;
-        }
-
-        sort($files);
-        return $files;
-    }
-
-    private function isAllowedUnused(string $relPath): bool
-    {
-        foreach (self::ALLOWED_UNUSED as $pattern) {
-            if (str_ends_with($pattern, '/')) {
-                // Directory prefix
-                if (str_starts_with($relPath, $pattern)) {
-                    return true;
-                }
-            } else {
-                // Glob-style match (only `*` supported, for `-small.*` variants)
-                $regex = '#^' . str_replace('\\*', '.*', preg_quote($pattern, '#')) . '$#';
-                if (preg_match($regex, $relPath) === 1) {
-                    return true;
-                }
-            }
-        }
-        return false;
-    }
-
-    /**
-     * Base name = path minus extension. So "grundrisse/EG 3D.png" → "grundrisse/EG 3D",
-     * and "Küche 1.jpg" → "Küche 1". Used to group source + auto-generated variants.
-     */
-    private function baseOf(string $relPath): string
-    {
-        $dot = strrpos($relPath, '.');
-        if ($dot === false || $dot === 0) {
-            return $relPath;
-        }
-        return substr($relPath, 0, $dot);
-    }
-}
Author	SHA1	Message	Date
greggy	5fb6abe09f	Merge pull request 'fix(css): constrain gallery heading and pricing/contact sections to main container width' (#82 ) from feature/gallery-and-section-containers into main All checks were successful Lint / PHP Syntax Check (push) Successful in 57s Details PHPUnit / PHP Unit Tests (push) Successful in 1m8s Details Lint / HTML Lint (htmlhint) (push) Successful in 1m37s Details Lint / CSS Lint (stylelint) (push) Successful in 1m43s Details Reviewed-on: #82	2026-06-14 16:50:01 +02:00
hermes	7913596836	fix(ui): make vertical floor-plan tabs visually obvious as interactive controls All checks were successful Deploy Feature Branch to Test (haus.test.kies-media.de) / Deploy to Test Environment (push) Successful in 45s Details Lint / PHP Syntax Check (push) Successful in 1m0s Details PHPUnit / PHP Unit Tests (push) Successful in 36s Details Lint / PHP Syntax Check (pull_request) Successful in 27s Details Lint / HTML Lint (htmlhint) (push) Successful in 1m40s Details Lint / CSS Lint (stylelint) (push) Successful in 1m45s Details PHPUnit / PHP Unit Tests (pull_request) Successful in 41s Details Lint / CSS Lint (stylelint) (pull_request) Successful in 1m14s Details Lint / HTML Lint (htmlhint) (pull_request) Successful in 1m15s Details The floor-accordion was rendering as a stack of plain text rows separated by 1px hairline dividers with no visual affordance indicating they were clickable tabs. CSS for .floor-icon (a 24px circle with a '+' that rotates 45° to '×' on open) already existed, but the corresponding <span class="floor-icon"> element had never been added to the template — the affordance was completely invisible. Changes: 1. Template (app/views/home/index.php): add <span class="floor-icon" aria-hidden="true">+</span> inside the <summary>, enabling the existing rotation/size CSS to take effect. 2. CSS (public/css/haus-schleusingen.css): a. Restyle .floor-item from a thin divider to a real card (1px --warm border, 4px radius, --white background) with a 0.75rem gap between items via flexbox column on .floors-accordion. b. .floor-header: hover background in --cream, focus-visible outline, list-style markers suppressed, padding tightened to 1.25rem 1.5rem. c. .floor-icon: enlarged from 24px to 32px, thicker 1.5px border, font-size 1.15rem so the '+' is clearly legible, white background that goes cream on hover/open. d. .floor-item.open: --accent border, subtle box-shadow (0 4px 20px 6% black), and a 3px-wide ::before accent stripe on the left edge — the canonical 'active tab' indicator. e. .floor-icon rotation on open (45°) now also flips border-color and background to --accent / --cream, plus hover state for the closed icon. f. Renamed dead-code class .floor-size → .floor-area to match the template (refactor mismatch left over from the i18n work). g. Renamed dead-code class .floor-accordion → .floors-accordion to match the template. Measured on 1265px viewport: - 4 items, 4 icons (one per tab) - Each item: 1104x74, white bg, 4px radius, --warm border - Icon: 32x32 at x=1128 (right edge), white bg, '+' glyph - Open state (item[1]): border → --accent, left 3px accent stripe, icon rotates 45° to '×', subtle box-shadow Sweep targets for visual confirmation: - Closed: white card + warm border + '+' icon, hover lifts background to cream and icon border to accent. - Open: accent border + left stripe + '×' icon + soft shadow, body expands below to show the floor-plan image and room list. - Switching tabs: clicking another header collapses the current open one (existing JS accordion behaviour).	2026-06-14 14:44:04 +00:00
hermes	f75ad996ae	style(css): reformat legal-page transitions to satisfy prettier All checks were successful Deploy Feature Branch to Test (haus.test.kies-media.de) / Deploy to Test Environment (push) Successful in 45s Details Lint / PHP Syntax Check (push) Successful in 1m1s Details PHPUnit / PHP Unit Tests (push) Successful in 36s Details Lint / PHP Syntax Check (pull_request) Successful in 29s Details Lint / HTML Lint (htmlhint) (push) Successful in 1m38s Details Lint / CSS Lint (stylelint) (push) Successful in 1m43s Details PHPUnit / PHP Unit Tests (pull_request) Successful in 41s Details Lint / CSS Lint (stylelint) (pull_request) Successful in 1m12s Details Lint / HTML Lint (htmlhint) (pull_request) Successful in 1m24s Details Prettier (running in the CI stylelint step) wants multi-property transition values to be split across lines. Pure formatting fix — no semantic change.	2026-06-14 14:23:24 +00:00
hermes	0df9c11bd1	fix(css): constrain legal pages (impressum, datenschutz) to main container width Some checks failed Deploy Feature Branch to Test (haus.test.kies-media.de) / Deploy to Test Environment (push) Successful in 46s Details Lint / PHP Syntax Check (push) Successful in 1m2s Details PHPUnit / PHP Unit Tests (push) Successful in 37s Details Lint / PHP Syntax Check (pull_request) Successful in 29s Details Lint / HTML Lint (htmlhint) (push) Successful in 1m37s Details Lint / CSS Lint (stylelint) (push) Failing after 1m44s Details PHPUnit / PHP Unit Tests (pull_request) Successful in 42s Details Lint / CSS Lint (stylelint) (pull_request) Failing after 1m13s Details Lint / HTML Lint (htmlhint) (pull_request) Successful in 1m16s Details The .legal-page <main> element had no CSS rules at all, so the Impressum and Datenschutz text was rendering flush against the left edge of the viewport (x=0, width=1265 at 1280px viewport). Both view files share the .legal-page class, so a single CSS rule fixes both. Added a complete legal-page stylesheet (max-width 1200px, margin auto, 6rem 3rem padding, matching .floors-section / .lage-section / .pricing-section / .contact-section), plus minimal typography for h1/h2/h3, body text, lists, links, the .legal-divider <hr>, the .legal-back link, and a 768px mobile padding adjustment. Measured on 1265px viewport: - main.legal-page: 32.5/1200 (was 0/1265) - h1 content area: 80.5/1104 inside the 3rem horizontal padding	2026-06-14 14:19:20 +00:00
hermes	dfe2178da8	fix(css): constrain gallery heading and pricing/contact sections to main container width All checks were successful Deploy Feature Branch to Test (haus.test.kies-media.de) / Deploy to Test Environment (push) Successful in 46s Details Lint / PHP Syntax Check (push) Successful in 1m2s Details PHPUnit / PHP Unit Tests (push) Successful in 36s Details Lint / PHP Syntax Check (pull_request) Successful in 27s Details Lint / HTML Lint (htmlhint) (push) Successful in 1m39s Details Lint / CSS Lint (stylelint) (push) Successful in 1m44s Details PHPUnit / PHP Unit Tests (pull_request) Successful in 40s Details Lint / CSS Lint (stylelint) (pull_request) Successful in 1m14s Details Lint / HTML Lint (htmlhint) (pull_request) Successful in 1m14s Details - Gallery .section-head now uses the same 1400px container + 1.5rem horizontal padding as .masonry-grid, so 'PHOTO GALLERY' / 'A look inside' align flush with the leftmost image edge (24px gutter) instead of sitting at the very left of the page. - .pricing-section and .contact-section are now constrained to max-width: 1200px and centered (matching .floors-section and .lage-section), so the 'Mietkonditionen' (dark) and 'Kontakt' (cream) blocks no longer span the full viewport. - Mobile: matching padding adjustment for the new .section-head rule at width <= 768px.	2026-06-14 10:37:31 +00:00
greggy	1e2217a742	ci: point deploy-test workflow to new server cp3 (46.225.136.66:9716) All checks were successful Lint / PHP Syntax Check (push) Successful in 1m2s Details PHPUnit / PHP Unit Tests (push) Successful in 1m8s Details Lint / HTML Lint (htmlhint) (push) Successful in 1m41s Details Lint / CSS Lint (stylelint) (push) Successful in 1m45s Details - old server 188.245.242.194 is unreachable (cp-server-1 ALT, forensic only) - switch SSH user from haustest to root (chown added in new step) - add composer install --no-dev (vendor/ is gitignored) - update ssh-keyscan to new IP + port	2026-06-14 12:17:21 +02:00