
:root{--ink:#211c19;--paper:#fbf8f1;--cream:#f2eadc;--rust:#bd3d20;--rust2:#d64b2b;--gold:#d6a83d;--sage:#68765a;--muted:#6d655d;--line:#e5d9c8;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65}a{color:inherit}img{max-width:100%;display:block}button,input{font:inherit}.wrap{width:min(1240px,calc(100% - 44px));margin:auto}.topline{height:5px;background:var(--rust)}header{background:rgba(251,248,241,.97);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.head{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{text-decoration:none;display:block;line-height:1}.brand-name{font:700 clamp(25px,3vw,38px)/.95 var(--serif);letter-spacing:-1.4px}.brand-name span{color:var(--rust)}.brand-tag{font-size:10px;letter-spacing:2px;font-weight:700;margin-top:7px}.nav{display:flex;align-items:center;gap:clamp(12px,2vw,27px);flex-wrap:wrap}.nav a{text-decoration:none;font-size:13px;font-weight:700;padding:8px 0;border-bottom:2px solid transparent}.nav a:hover,.nav a.active{color:var(--rust);border-color:var(--rust)}.search-link{font-size:22px!important}.hero{isolation:isolate;min-height:430px;display:grid;align-items:center;background:#4a3829 url('images/raum-70er-original.webp') center 52%/cover no-repeat;position:relative;color:white}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,14,10,.78) 0%,rgba(20,14,10,.58) 37%,rgba(20,14,10,.05) 78%)}.hero-inner{position:relative;z-index:1;padding:62px 0;max-width:610px}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:800}.hero h1{font:700 clamp(42px,6vw,76px)/.94 var(--serif);letter-spacing:-2px;margin:13px 0 20px}.hero p{font-size:17px;max-width:480px;line-height:1.5;margin:0 0 24px}.actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;border-radius:5px;background:var(--rust);color:white;padding:12px 20px;font-size:13px;font-weight:800;border:1px solid var(--rust)}.btn.light{background:var(--paper);color:var(--ink);border-color:var(--paper)}.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}.section{padding:36px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:18px}.section-head h2{font:700 clamp(27px,3.4vw,40px)/1.04 var(--serif);letter-spacing:-.8px;margin:7px 0 0;max-width:700px}.section-head p{max-width:440px;color:var(--muted);font-size:14px;margin:0}.decades{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.decade{min-height:210px;position:relative;overflow:hidden;border-radius:7px;color:white;text-decoration:none;background:#55412f}.decade img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}.decade:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,13,9,.72),rgba(20,13,9,.08))}.decade:hover img{transform:scale(1.04)}.decade-copy{position:absolute;z-index:1;left:20px;bottom:18px;max-width:280px}.decade-copy small{font:italic 22px var(--serif)}.decade-copy h3{font:700 clamp(28px,3vw,39px)/.98 var(--serif);margin:0 0 10px}.decade-copy p{margin:0 0 12px;font-size:14px}.underlink{font-size:12px;font-weight:800;border-bottom:2px solid var(--gold);padding-bottom:3px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{background:white;border:1px solid #eee5d8;border-radius:5px;overflow:hidden;box-shadow:0 4px 18px rgba(65,43,22,.04)}.card img{width:100%;height:155px;object-fit:cover}.card-body{padding:15px 16px 17px}.card .tag{font-size:9px;font-weight:900;letter-spacing:1.2px;text-transform:uppercase}.card h3{font:700 21px/1.1 var(--serif);margin:8px 0}.card p{font-size:13px;color:var(--muted);line-height:1.55;margin:0 0 12px}.read{color:var(--rust);font-size:12px;font-weight:800;text-decoration:none;border-bottom:1px solid #d9a18f;padding-bottom:2px}.promise{background:#f4ecdf;border-block:1px solid var(--line);padding:24px 0;margin-top:16px}.promise-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.promise-item{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:700}.promise-icon{color:var(--rust);font-size:28px}.page-hero{background:var(--cream);border-bottom:1px solid var(--line);padding:42px 0}.page-hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:36px;align-items:center}.page-hero h1{font:700 clamp(38px,5vw,62px)/.98 var(--serif);letter-spacing:-1.5px;margin:10px 0 16px}.page-hero p{font-size:17px;color:#51463c;max-width:650px}.page-hero img{width:100%;height:310px;object-fit:cover;border-radius:6px}.article-layout{display:grid;grid-template-columns:minmax(0,780px) minmax(220px,300px);gap:52px;align-items:start}.article{font-size:16px;line-height:1.8}.article h2{font:700 32px/1.12 var(--serif);margin:34px 0 12px}.article h3{font:700 23px/1.2 var(--serif);margin:26px 0 9px}.article p{margin:0 0 18px}.article ul{padding-left:22px}.article li{margin:8px 0}.sidebar{position:sticky;top:105px;background:#f3eadc;padding:22px;border-radius:5px}.sidebar h3{font:700 25px var(--serif);margin:0 0 12px}.sidebar a{display:block;padding:9px 0;text-decoration:none;border-bottom:1px solid #ddcfba;font-size:13px}.note{border-left:4px solid var(--rust);padding:15px 18px;background:#f5eee3;margin:24px 0}.feature-image{width:100%;max-height:420px;object-fit:cover;border-radius:5px;margin:24px 0}.tip-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:22px 0}.tip{background:white;border:1px solid var(--line);padding:18px;border-radius:4px}.tip h3{margin-top:0}.wall-swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:18px 0}.swatch{height:95px;border-radius:3px;display:flex;align-items:end;padding:8px;color:#241c15;font-size:11px;font-weight:800}.swatch:nth-child(1){background:#c65a32}.swatch:nth-child(2){background:#d9b64f}.swatch:nth-child(3){background:#718164}.swatch:nth-child(4){background:#e2b9a1}.swatch:nth-child(5){background:#b6a0b4}.newsletter{background:#2b2822;color:white;padding:32px;border-radius:6px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:34px 0}.newsletter h2{font:700 29px var(--serif);margin:0 0 5px}.newsletter p{margin:0;color:#e0d8cc;font-size:13px}.footer{background:#211d19;color:#f8f2e7;padding:38px 0 20px;margin-top:35px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:32px}.footer .brand-tag{color:#cfc3b1}.footer p{font-size:13px;color:#d2c8b8;max-width:390px}.footer h3{font:700 20px var(--serif);margin:0 0 10px}.footer a{display:block;color:#e9dfd0;text-decoration:none;font-size:13px;margin:7px 0}.footer a:hover{color:#e9a18b}.copyright{border-top:1px solid #51473c;margin-top:25px;padding-top:15px;color:#bfb3a3;font-size:11px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.breadcrumb{font-size:12px;color:var(--muted);margin:20px 0}.breadcrumb a{color:var(--rust);text-decoration:none}.searchbox{padding:14px;background:white;border:1px solid var(--line);border-radius:5px;margin:22px 0}.searchbox input{width:100%;padding:11px;border:1px solid #d8cbbb;border-radius:3px}.search-results a{display:block;padding:10px 0;border-bottom:1px solid var(--line)}@media(max-width:900px){.head{align-items:flex-start;padding:16px 0;flex-direction:column;gap:12px}.nav{gap:15px}.page-hero-grid{grid-template-columns:1fr}.page-hero img{height:270px}.cards{grid-template-columns:repeat(2,1fr)}.article-layout{grid-template-columns:1fr}.sidebar{position:static}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}@media(max-width:620px){.wrap{width:min(100% - 28px,1240px)}.nav{gap:8px 14px}.nav a{font-size:12px}.hero{min-height:490px;background-position:56% center}.hero:before{background:linear-gradient(90deg,rgba(20,14,10,.78),rgba(20,14,10,.24))}.hero-inner{padding:45px 0}.hero h1{font-size:48px}.hero p{font-size:15px}.decades{grid-template-columns:1fr}.decade{min-height:190px}.section-head{display:block}.section-head p{margin-top:12px}.cards{grid-template-columns:1fr 1fr;gap:10px}.card img{height:120px}.card-body{padding:12px}.card h3{font-size:18px}.card p{font-size:12px}.promise-grid{grid-template-columns:1fr 1fr}.page-hero{padding:30px 0}.page-hero h1{font-size:42px}.article{font-size:15px}.article h2{font-size:28px}.tip-grid{grid-template-columns:1fr}.wall-swatches{grid-template-columns:repeat(3,1fr)}.newsletter{display:block;padding:22px}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}.copyright{display:block}}

/* Editorial image treatment: distinct explanatory images, crisp display and quiet captions. */
.editorial-figure{margin:26px 0 30px}.editorial-figure .feature-image{margin:0;max-height:480px;object-fit:cover;object-position:center}.editorial-figure figcaption{font-size:12px;line-height:1.55;color:var(--muted);padding:9px 2px 0;border-bottom:1px solid var(--line);padding-bottom:12px}.page-hero img{object-position:center;image-rendering:auto}.article img{height:auto}.article .feature-image{background:#f1e8da}


/* Mehr visuelle Inspiration: redaktionelle Bildstrecken statt einzelner zufälliger Bildmotive. */
.photo-gallery{margin:42px 0 18px;padding-top:22px;border-top:1px solid var(--line)}
.photo-gallery h2{margin-top:0!important}
.gallery-intro{color:var(--muted);max-width:680px}
.photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:20px 0 28px}
.photo-card{margin:0;background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;box-shadow:0 8px 24px rgba(65,43,22,.07)}
.photo-card img{width:100%;height:245px;object-fit:cover;display:block}
.photo-card figcaption{padding:13px 15px 16px;display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:1.5;color:var(--muted)}
.photo-card figcaption strong{font:700 20px/1.15 var(--serif);color:var(--ink)}
.page-hero img{object-position:center center}
@media(max-width:620px){.photo-grid{grid-template-columns:1fr;gap:14px}.photo-card img{height:230px}.photo-card figcaption strong{font-size:19px}}

/* Vier Jahrzehnte auf der Startseite */
.decades{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.decades{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.decades{grid-template-columns:1fr}}

/* Editorial enhancements: more visual discovery and four decade panels */
.decades-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.cards-six{grid-template-columns:repeat(3,minmax(0,1fr))}
.editorial-figure{margin:22px 0 28px;background:#f2eadc;border:1px solid var(--line);padding:10px;border-radius:6px}
.editorial-figure img{width:100%;max-height:420px;object-fit:cover;border-radius:3px}
.editorial-figure figcaption,.image-grid figcaption{font-size:12px;color:var(--muted);padding:8px 4px 2px;line-height:1.5}
@media(max-width:900px){.decades-four{grid-template-columns:repeat(2,minmax(0,1fr))}.cards-six{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.decades-four,.cards-six{grid-template-columns:1fr}.decade{min-height:230px}.section-head{display:block}.section-head p{margin-top:12px}}

/* Originale, themenspezifische Illustrationen und Inspirationsstrecken */
.photo-card img[src$=".svg"]{object-fit:cover;background:#eee4d4;padding:0}
.photo-gallery{scroll-margin-top:100px}
.photo-card{transition:transform .2s ease,box-shadow .2s ease}
.photo-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(65,43,22,.12)}
.photo-card figcaption span{display:block}

/* Authentische, fotografische Jahrzehnte-Bildwelten: Bildmotive bleiben lokal gespeichert. */
.card img,.photo-card img,.decade img{background:#eee5d8}


/* Korrekturpaket: ruhigeres Raster, passende Bildformate und bessere Bedienbarkeit */
:root { --content-max: 1180px; }
.wrap { width: min(var(--content-max), calc(100% - 48px)); }
.section { padding-block: clamp(34px, 4vw, 64px); }
.section-head { align-items: end; gap: 28px; margin-bottom: 22px; }
.cards { align-items: stretch; }
.card { min-width: 0; overflow: hidden; }
.card > img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; }
.card-body { padding: 18px 18px 20px; }
.card h3 { line-height: 1.25; }
.card .read { display: inline-flex; margin-top: 12px; font-weight: 700; text-decoration: none; border-bottom: 1px solid currentColor; }
.card .read:hover { opacity: .78; }
.photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; align-items: stretch; }
.photo-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #fffdf8; }
.photo-card img { width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: cover; object-position: center; }
.photo-card figcaption { padding: 13px 15px 17px; }
.photo-card figcaption strong { display: block; font-family: var(--serif); font-size: 19px; line-height: 1.25; margin-bottom: 6px; }
.photo-card figcaption span { display: block; color: var(--muted); font-size: 14px; line-height: 1.5; }
.decades { gap: 16px; }
.decade { min-width: 0; overflow: hidden; }
.decade img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.hero { background-position: center 55%; }
.hero-inner { max-width: 620px; }
.footer { margin-top: 24px; }
@media (max-width: 900px) {
  .photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards.cards-six { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .head { align-items: flex-start; padding-block: 16px; }
}
@media (max-width: 600px) {
  .wrap { width: min(100% - 28px, var(--content-max)); }
  .photo-grid, .cards.cards-six, .decades.decades-four { grid-template-columns: 1fr; }
  .photo-card img { aspect-ratio: 5 / 3; }
  .hero { min-height: 400px; }
  .hero-inner { padding-block: 42px; }
}

/* Klickflächen für Bildbereiche */
.card-image-link, .photo-image-link { display:block; color:inherit; text-decoration:none; }
.card-image-link img, .photo-image-link img { transition: filter .18s ease, transform .18s ease; }
.card-image-link:hover img, .photo-image-link:hover img { filter: saturate(1.08); }
.card-image-link:focus-visible, .photo-image-link:focus-visible { outline:3px solid var(--rust); outline-offset:3px; }


/* Gesamtversion – einheitliche Breite, klare Karten und responsives Raster */
.wrap { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.photo-gallery { width:100%; margin:38px 0 0; padding:34px 0 24px; background:#f7f2e9; border-top:1px solid var(--line); }
.photo-gallery > .wrap { width:min(1180px,calc(100% - 48px)); margin-inline:auto; }
.photo-gallery h2 { max-width:760px; margin:0 0 10px !important; }
.photo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin:24px 0 16px; align-items:stretch; }
.photo-card { min-width:0; display:flex; flex-direction:column; margin:0; border:1px solid var(--line); border-radius:7px; overflow:hidden; background:#fffdf8; box-shadow:0 4px 14px rgba(65,43,22,.045); }
.photo-image-link { display:block; overflow:hidden; line-height:0; }
.photo-card img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; }
.photo-card figcaption { display:block; padding:15px 16px 18px; }
.photo-card figcaption strong { display:block; font:700 20px/1.2 var(--serif); color:var(--ink); margin-bottom:7px; }
.photo-card figcaption span { display:block; font-size:13px; line-height:1.55; color:var(--muted); }
.card-image-link { display:block; overflow:hidden; line-height:0; }
.card-image-link img { display:block; width:100%; aspect-ratio:4/3; height:auto; object-fit:cover; }
.card { min-width:0; display:flex; flex-direction:column; }
.card-body { flex:1; display:flex; flex-direction:column; align-items:flex-start; }
.card-body .read { margin-top:auto; padding-top:12px; }
.bedroom-feature { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:28px; align-items:center; margin:34px 0; padding:22px; background:#f6efe4; border:1px solid var(--line); border-radius:8px; scroll-margin-top:110px; }
.bedroom-media img { width:100%; aspect-ratio:4/3; height:auto; object-fit:cover; display:block; border-radius:5px; }
.bedroom-copy h2 { margin-top:0; }
.bedroom-copy p { line-height:1.7; }
@media(max-width:900px) { .photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; } }
@media(max-width:620px) { .wrap,.photo-gallery > .wrap { width:min(100% - 28px,1180px); } .photo-grid { grid-template-columns:1fr; gap:14px; } .photo-card img { aspect-ratio:5/3; } .bedroom-feature { grid-template-columns:1fr; padding:14px; gap:18px; } }
