/* Rittergut Falkenhagen – schlankes Stylesheet (ersetzt Astra + Elementor) */

@font-face{font-family:"Barlow Semi Condensed";font-weight:600;font-display:swap;src:url(../fonts/barlow-sc-600-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Semi Condensed";font-weight:600;font-display:swap;src:url(../fonts/barlow-sc-600-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Roboto";font-weight:400;font-display:swap;src:url(../fonts/roboto-400-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Roboto";font-weight:400;font-display:swap;src:url(../fonts/roboto-400-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --orange:#ff9200;
  --grey-dark:#5c5c5c;
  --grey-bg:#f4f4f4;
  --text:#7a7a7a;
  --ink:#000;
  --blue:#045cb4;
  --head:"Barlow Semi Condensed",sans-serif;
  --body:"Roboto",sans-serif;
  --wrap:1140px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;font:400 16px/1.65 var(--body);color:var(--text);background:#fff;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--head);font-weight:600;margin:0;line-height:1.1;color:var(--ink)}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:10px;top:10px;background:#fff;padding:8px 12px;z-index:100}

/* Überzeile mit Strich ("FÜR KUNSTINTERESSIERTE") */
.eyebrow{display:flex;align-items:center;gap:12px;font:600 14px/1 var(--head);letter-spacing:2px;text-transform:uppercase;color:var(--ink);margin-bottom:14px}
.eyebrow::before{content:"";width:40px;height:1px;background:var(--orange)}
.eyebrow.right{justify-content:flex-end}
.h-big{font-size:48px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}

.btn{display:inline-block;background:var(--orange);color:#fff;font:600 22px/1 var(--head);padding:30px 50px;box-shadow:0 5px 10px rgba(0,0,0,.2);transition:background .2s}
.btn:hover{background:#e68300}

/* Schräge Übergänge (ersetzt Elementor Shape Divider) */
.shape{position:absolute;left:0;width:100%;height:128px;pointer-events:none;line-height:0}
.shape svg{width:100%;height:100%;display:block}
.shape-bottom{bottom:-1px}
.shape-top{top:-1px}

/* ---------- Startseite: Hero ---------- */
.hero{position:relative;min-height:730px;background:url(../img/falkenhagen.jpg) center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#fff}
.hero-title{display:flex;align-items:center;gap:14px;font:600 50px/1 var(--head);color:#fff;text-transform:uppercase;margin-top:-60px;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.hero-title span{border:2px solid #fff;padding:8px 6px 8px 16px;letter-spacing:9px}
.hero .shape{height:128px;z-index:1}
.hero .shape path{fill:#fff}
.tiles{position:absolute;right:calc(50% - 530px);bottom:-110px;display:flex;gap:0;z-index:2}
.tile{width:257px;height:153px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;color:#fff;font:600 16px/1 var(--head);transition:filter .2s}
.tile:hover{filter:brightness(1.08)}
.tile svg{width:34px;height:34px;fill:#fff}
.tile.orange{background:rgba(255,146,0,.8)}
.tile.grey{background:var(--grey-dark);margin-left:2px}

/* ---------- Kunst im Park ---------- */
.art{padding:230px 0 120px}
.art .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.art-map{position:relative}
.art-map .btn{position:absolute;left:50%;bottom:-40px;transform:translateX(-50%);white-space:nowrap}
.art-text{position:relative;max-width:380px}
.art-text::before{content:"";position:absolute;right:-80px;top:-40px;width:230px;height:230px;border-radius:50%;background:#f4f4f4;z-index:-1}
.dot{position:absolute;opacity:.12;pointer-events:none;z-index:-1}

/* ---------- Pflanzen ---------- */
.plants{padding:40px 0 190px}
.plants .wrap{display:grid;grid-template-columns:5fr 7fr;gap:40px;align-items:start}
.plants-text{padding-top:30px;max-width:360px}
.plants-img{position:relative;height:560px}
.plants-img a{position:absolute;display:block;border:1px solid #333;background:#fff}
.plants-img .tree{left:0;top:0;width:360px;padding:10px 10px 0}
.plants-img .plan{left:195px;top:330px;width:330px;padding:6px}

/* ---------- FAQ ---------- */
.faq{position:relative;background:var(--grey-bg);padding:210px 0 130px}
.faq .shape path{fill:#fff}
.faq .wrap{display:grid;grid-template-columns:5fr 7fr;gap:60px;align-items:center}
.faq-head{position:relative}
.faq-head .ghost{position:absolute;left:40px;top:150px;font:600 76.8px/1 var(--head);color:#ebebeb;z-index:0}
.faq-head h2{position:relative;z-index:1}
.faq details{background:#fff;margin-bottom:10px}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 22px;font:400 16px/1.4 var(--body);color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-4px;flex:none;transition:transform .2s}
.faq details[open] summary{color:var(--orange);border-bottom:1px solid #eee}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:4px;color:var(--ink)}
.faq details p{padding:18px 22px 22px;margin:0;font-size:15px}

/* ---------- Unterseiten ---------- */
.page-hero{position:relative;height:472px;background:center/cover no-repeat;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(200deg,rgba(0,161,219,.44) 0%,#fff 59%)}
.page-hero .shape{height:211px}
.page-hero .shape path{fill:#fff}
.page-hero .inner{position:absolute;left:0;right:0;bottom:30px;text-align:center;z-index:2}
.back{display:inline-block;width:500px;max-width:calc(100% - 40px);border:1px solid #54595f;border-radius:60px;background:#fff;color:#54595f;font-size:13px;line-height:30px}
.back:hover{background:#54595f;color:#fff}
.page-hero h1{font-size:100px;margin-top:20px}
.content{padding:20px 0 120px}
.content h2{font-size:64px;text-align:center;color:#1e293b;margin:80px 0 40px}
.content .lead{max-width:none}

/* Zeitleiste */
.timeline{position:relative}
.tl-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:10px 0 20px;scrollbar-width:none}
.tl-track::-webkit-scrollbar{display:none}
.tl-item{flex:0 0 calc((100% - 40px)/3);scroll-snap-align:start;position:relative}
.tl-date{display:block;font-size:20px;color:var(--blue);margin-bottom:12px}
.tl-dot{position:relative;height:48px;margin-bottom:30px}
.tl-dot::before{content:"";position:absolute;left:0;right:-20px;top:23px;height:2px;background:#efefef}
.tl-dot::after{content:"";position:absolute;left:10px;top:0;width:48px;height:48px;border-radius:50%;background:#efefef}
.tl-box{position:relative;background:#fff;color:#3c3c3c;padding:20px;box-shadow:0 0 15px rgba(0,0,0,.08);font-size:16px}
.tl-box::before{content:"";position:absolute;left:24px;top:-10px;border:10px solid transparent;border-top:0;border-bottom-color:#fff}
.tl-box p{margin:0}
.tl-nav{position:absolute;top:82px;width:30px;height:30px;border-radius:50%;border:0;background:#fff;box-shadow:0 0 8px rgba(0,0,0,.15);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2}
.tl-nav::before{content:"";width:7px;height:7px;border-left:1.5px solid #555;border-bottom:1.5px solid #555}
.tl-prev{left:-40px}.tl-prev::before{transform:rotate(45deg);margin-left:3px}
.tl-next{right:-40px}.tl-next::before{transform:rotate(-135deg);margin-right:3px}

/* Wegweiser: Kunstwerke */
.map-full{margin:40px auto 60px}
.works{list-style:none;margin:0;padding:0}
.work{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center;min-height:320px;padding:0}
.work-text{text-align:right;padding-right:10px}
.work-text .eyebrow{justify-content:flex-end;font-size:12px}
.work-text h3{font-size:36px;text-transform:uppercase;margin-bottom:20px}
.work-text p{color:var(--text);font-size:14px;margin:0}
.work img{max-height:300px;width:auto}
.end-shape{position:relative;height:128px;background:var(--grey-bg)}

/* Pflanzen: Collage */
.collage{position:relative;height:400px;margin-top:60px}
.collage img{position:absolute;border:4px solid #fff;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.collage .c1{left:0;top:30px;width:40%}
.collage .c2{left:18%;top:175px;width:27%}
.collage .c3{left:46%;top:0;width:48%}

/* Nach-oben-Button */
.to-top{position:fixed;right:20px;bottom:20px;width:26px;height:26px;border-radius:2px;background:var(--orange);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .3s;z-index:50}
.to-top.show{opacity:1;visibility:visible}
.to-top::before{content:"";width:7px;height:7px;border-left:2px solid #fff;border-top:2px solid #fff;transform:rotate(45deg);margin-top:3px}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .tiles{right:20px}
  .tl-item{flex-basis:calc((100% - 20px)/2)}
  .tl-prev{left:0}.tl-next{right:0}
}
@media (max-width:767px){
  .hero{min-height:560px}
  .hero-title{font-size:30px;gap:8px;flex-wrap:wrap;justify-content:center}
  .hero-title span{letter-spacing:4px}
  .tiles{left:16px;right:16px;bottom:-90px}
  .tile{width:50%;height:120px}
  .art{padding:160px 0 40px}
  .art .wrap,.plants .wrap,.faq .wrap,.work{grid-template-columns:1fr}
  .art-text{max-width:none}
  .art-text::before,.dot{display:none}
  .art-map{margin-bottom:60px}
  .h-big{font-size:36px}
  .plants{padding-bottom:120px}
  .plants-text{max-width:none}
  .plants-img{height:auto;display:grid;gap:20px}
  .plants-img a{position:static;width:auto!important}
  .faq{padding-top:150px}
  .faq-head .ghost{display:none}
  .page-hero{height:360px}
  .page-hero h1{font-size:52px}
  .content h2{font-size:42px}
  .tl-item{flex-basis:85%}
  .tl-nav{display:none}
  .work{min-height:0;padding:30px 0;gap:10px}
  .work-text{text-align:center;padding:0}
  .work-text .eyebrow{justify-content:center}
  .work img{margin:0 auto;max-height:240px}
  .collage{height:auto;display:grid;gap:12px}
  .collage img{position:static;width:100%!important}
  .wrap{padding:0 16px}
}

/* Footer: Verweis auf die Budde Stiftung (Impressum/Datenschutz dort) */
.site-footer{background:var(--grey-bg);border-top:1px solid #e6e6e6;padding:28px 0;font-size:14px;color:var(--text)}
.site-footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px 30px;flex-wrap:wrap}
.site-footer p{margin:0}
.site-footer nav{display:flex;gap:24px;margin-right:40px}
.site-footer a{color:var(--ink)}
.site-footer a:hover{color:var(--orange)}
