/*
Theme Name: Hope Ranch V12.22 Bilder entfernt
Theme URI: http://www.hope-ranch.de/
Author: Hope Ranch
Description: Kompatibles Theme fuer aeltere WordPress-Installationen.
Version: 12.22
*/


:root{
  --ink:#1b1a16;--paper:#f4efe5;--paper2:#ebe1cf;--white:#fff;
  --sage:#33453a;--sage2:#25352d;--rust:#9c582f;--gold:#c9a361;
  --line:rgba(27,26,22,.16);--shadow:0 22px 70px rgba(25,21,14,.15);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;line-height:1.65;overflow-x:hidden}body.menu-open{overflow:hidden}
img{display:block;max-width:100%}a{color:inherit}button{font:inherit}.serif,h1,h2,h3{font-family:Georgia,"Times New Roman",serif}.wrap{width:min(1180px,88vw);margin:auto}.eyebrow{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.22em;color:var(--rust)}.eyebrow.light{color:#e2c18b}.muted{opacity:.72}.section{padding:clamp(76px,10vw,136px) 0}.section-tight{padding:68px 0}.display{font-size:clamp(3rem,7vw,6.2rem);line-height:.94;letter-spacing:-.045em;margin:12px 0 26px}.lead{font-size:clamp(1.05rem,1.6vw,1.3rem);max-width:760px}.rule{height:1px;background:var(--line)}

/* Navigation */
.nav{position:fixed;inset:0 0 auto;z-index:50;color:#fff;transition:.35s ease}.nav.scrolled{background:rgba(21,20,17,.92);backdrop-filter:blur(14px);box-shadow:0 8px 28px rgba(0,0,0,.14)}.nav-inner{height:84px;width:min(1260px,92vw);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{text-decoration:none;display:flex;align-items:center;gap:13px;font-weight:900;letter-spacing:.16em}.brand-mark{width:38px;height:38px;border:1px solid rgba(255,255,255,.6);border-radius:50%;display:grid;place-items:center;font-family:Georgia,serif;font-size:20px}.brand small{display:block;font-size:.57rem;font-weight:600;letter-spacing:.24em;opacity:.75;margin-top:2px}.nav-links{display:flex;gap:26px;align-items:center}.nav-links a{text-decoration:none;font-size:.83rem;font-weight:700;letter-spacing:.05em;opacity:.94}.nav-links a:hover{opacity:.65}.nav-cta{padding:11px 16px;border:1px solid rgba(255,255,255,.55);border-radius:99px}
/* Hero */
.hero{min-height:100svh;position:relative;color:white;display:flex;align-items:flex-end;background:#111;overflow:hidden}.hero-bg{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(0,0,0,.69) 0%,rgba(0,0,0,.31) 45%,rgba(0,0,0,.05) 78%),linear-gradient(0deg,rgba(0,0,0,.44),transparent 45%),url('images/img-01.jpg');background-size:cover;background-position:center;transform:scale(1.035);animation:heroZoom 13s ease-out both}@keyframes heroZoom{to{transform:scale(1)}}.hero-content{position:relative;z-index:2;width:min(1260px,88vw);margin:auto;padding:150px 0 9vh}.hero h1{font-size:clamp(4.5rem,12vw,10.5rem);line-height:.78;letter-spacing:-.065em;margin:13px 0 30px;max-width:900px}.hero-sub{font-size:clamp(1.05rem,2vw,1.45rem);max-width:690px;margin:0 0 30px;color:#f6f0e4}.actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;padding:14px 20px;border-radius:99px;font-size:.79rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border:1px solid transparent;transition:.25s}.btn-primary{background:var(--paper);color:var(--ink)}.btn-primary:hover{transform:translateY(-2px);background:white}.btn-ghost{color:white;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.04)}.btn-dark{background:var(--ink);color:white}.hero-note{position:absolute;z-index:2;right:5vw;bottom:5vh;writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:.22em;font-size:.62rem;opacity:.72}.scroll-line{display:inline-block;width:1px;height:44px;background:#fff8;margin-top:12px}

/* Intro */
.intro-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(48px,8vw,110px);align-items:center}.intro-copy p{max-width:620px}.image-stack{position:relative;padding:0 0 70px 60px}.image-stack .main{width:100%;height:640px;object-fit:cover;border-radius:2px;box-shadow:var(--shadow)}.image-stack .small{position:absolute;left:0;bottom:0;width:46%;height:260px;object-fit:cover;border:10px solid var(--paper);box-shadow:0 20px 50px rgba(0,0,0,.14)}.stamp{position:absolute;right:-28px;top:50px;width:130px;height:130px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(39,53,45,.9);color:white;display:grid;place-items:center;text-align:center;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;transform:rotate(9deg);box-shadow:var(--shadow)}

/* ticker */
.ticker{overflow:hidden;background:var(--ink);color:#efe7d8;border-block:1px solid #ffffff17}.ticker-track{display:flex;width:max-content;animation:ticker 28s linear infinite;padding:16px 0;font-family:Georgia,serif;font-style:italic;font-size:1.05rem}.ticker-track span{padding:0 28px}.ticker-track b{color:var(--gold);font-weight:400}@keyframes ticker{to{transform:translateX(-50%)}}

/* Services */
.services-head{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:52px}.services-head p{max-width:480px;margin:0}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service{min-height:460px;padding:34px;position:relative;overflow:hidden;color:white;display:flex;flex-direction:column;justify-content:flex-end;background:#333;box-shadow:var(--shadow)}.service:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.84),rgba(0,0,0,.05) 70%);z-index:1}.service>*{position:relative;z-index:2}.service:nth-child(1){background:url('images/img-02.jpg') center/cover}.service:nth-child(2){background:url('images/img-03.jpg') center/cover}.service:nth-child(3){background-color:#111;background-image:url('images/zucht-hengst.jpg');background-repeat:no-repeat;background-position:center 28%;background-size:cover}.service-no{font-size:.7rem;letter-spacing:.17em;text-transform:uppercase;opacity:.7}.service h3{font-size:2.25rem;margin:7px 0}.service p{margin:0;max-width:380px;color:#f3ede3}.service .arrow{margin-top:18px;font-size:1.35rem}

/* Holding */
.holding{background:var(--sage);color:white}.holding-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:75px;align-items:start}.feature-list{margin-top:38px;border-top:1px solid #ffffff29}.feature{display:grid;grid-template-columns:60px 1fr;gap:24px;padding:25px 0;border-bottom:1px solid #ffffff29}.feature .num{font-family:Georgia,serif;font-size:1.55rem;color:var(--gold)}.feature h3{font-size:1.25rem;margin:0 0 4px}.feature p{margin:0;color:#e4e8e3;max-width:650px}.holding-visual{position:sticky;top:116px}.holding-visual img{height:670px;width:100%;object-fit:cover}.caption{display:flex;justify-content:space-between;gap:15px;margin-top:12px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#d1d7d0}

/* manifesto */
.manifesto{background:var(--paper2)}.manifesto-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;align-items:center}.manifesto figure{margin:0;position:relative}.manifesto img{width:100%;height:660px;object-fit:cover}.manifesto blockquote{font-family:Georgia,serif;font-size:clamp(2.15rem,4.4vw,4.7rem);line-height:1.04;margin:0 0 28px;letter-spacing:-.035em}.manifesto p{max-width:650px}

/* Western */
.western{background:#191712;color:#fff;position:relative;overflow:hidden}.western:after{content:"WESTERN";position:absolute;right:-.04em;top:.15em;font-family:Georgia,serif;font-size:clamp(7rem,20vw,19rem);line-height:1;color:#ffffff05;pointer-events:none}.western-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.12fr .88fr;gap:70px;align-items:center}.western-collage{display:grid;grid-template-columns:1fr 1fr;gap:12px}.western-collage img{width:100%;height:280px;object-fit:cover}.western-collage img:first-child{grid-column:span 2;height:400px}.western-copy h2{font-size:clamp(3rem,6vw,6rem);line-height:.95}.chips{display:flex;gap:9px;flex-wrap:wrap;margin:30px 0}.chip{border:1px solid #ffffff39;padding:9px 12px;border-radius:99px;font-size:.71rem;text-transform:uppercase;letter-spacing:.08em}

/* Story */
.story-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:8vw;align-items:start}.story-sticky{position:sticky;top:120px}.timeline{border-left:1px solid var(--line);padding-left:34px}.event{position:relative;padding:0 0 56px}.event:before{content:"";position:absolute;width:11px;height:11px;background:var(--rust);border-radius:50%;left:-40px;top:9px;box-shadow:0 0 0 7px var(--paper)}.event .year{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--rust);font-weight:900}.event h3{font-size:1.65rem;margin:5px 0 8px}.event p{margin:0;max-width:650px}.story-photo{margin-top:22px;width:100%;height:330px;object-fit:cover}

/* gallery */
.gallery{background:#0f0f0d;color:white}.gallery-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:40px}.gallery-head p{max-width:480px;margin:0;color:#c9c9c2}.masonry{columns:3 290px;column-gap:12px}.masonry button{display:block;width:100%;border:0;padding:0;margin:0 0 12px;background:none;cursor:zoom-in;overflow:hidden}.masonry img{width:100%;transition:.45s}.masonry button:hover img{transform:scale(1.025);filter:brightness(.82)}

/* Contact */
.contact{background:var(--rust);color:white}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.contact h2{font-size:clamp(3.3rem,7vw,7rem);line-height:.91;letter-spacing:-.045em}.contact-card{background:rgba(255,255,255,.1);border:1px solid #ffffff2f;padding:36px}.contact-row{padding:18px 0;border-bottom:1px solid #ffffff2f}.contact-row:last-child{border:0}.contact-label{display:block;font-size:.65rem;text-transform:uppercase;letter-spacing:.15em;opacity:.72;margin-bottom:4px}.contact-value{font-family:Georgia,serif;font-size:1.25rem;text-decoration:none}.contact-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}

/* Footer */
.footer{background:#13120f;color:#d9d2c6;padding:50px 0}.footer-grid{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end}.footer-brand{font-family:Georgia,serif;font-size:2rem;color:white}.footer p{font-size:.83rem;max-width:650px}.footer-links{display:flex;gap:20px;font-size:.78rem}.footer-links a{text-decoration:none}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.93);display:grid;place-items:center;padding:4vw;opacity:0;pointer-events:none;transition:.25s}.lightbox.open{opacity:1;pointer-events:auto}.lightbox img{max-width:92vw;max-height:88vh;object-fit:contain}.lightbox-close{position:absolute;top:25px;right:28px;color:white;border:1px solid #ffffff55;background:#0008;width:46px;height:46px;border-radius:50%;font-size:1.4rem;cursor:pointer}

/* reveal */
.js .js .delay1{transition-delay:.1s}.delay2{transition-delay:.2s}

@media(max-width:920px){
  .nav-links{display:none}.intro-grid,.holding-grid,.manifesto-grid,.western-grid,.story-grid,.contact-grid{grid-template-columns:1fr}.hero-note{display:none}.image-stack{padding-left:30px}.image-stack .main{height:530px}.holding-visual{position:static}.holding-visual img{height:500px}.story-sticky{position:static}.services-head,.gallery-head{display:block}.services-head p,.gallery-head p{margin-top:18px}.service-grid{grid-template-columns:1fr}.service{min-height:430px}.western-collage img:first-child{height:330px}.western-collage img{height:230px}.manifesto img{height:520px}.footer-grid{grid-template-columns:1fr}.footer-links{flex-wrap:wrap}
}
@media(max-width:600px){
  .wrap{width:min(90vw,1180px)}.nav-inner{height:72px}.brand-mark{width:34px;height:34px}.hero-content{padding-bottom:10vh}.hero h1{font-size:clamp(4rem,21vw,7rem)}.display{font-size:clamp(2.8rem,14vw,4.3rem)}.section{padding:84px 0}.image-stack{padding:0 0 55px 22px}.image-stack .main{height:430px}.image-stack .small{height:190px;width:52%;border-width:7px}.stamp{display:none}.holding-visual img{height:420px}.manifesto img{height:460px}.western-collage{gap:7px}.western-collage img:first-child{height:280px}.western-collage img{height:190px}.timeline{padding-left:28px}.event:before{left:-34px}.story-photo{height:240px}.contact-card{padding:26px}.footer-links{gap:12px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-bg,.ticker-track{animation:none}}




.legal{background:#f4f0e8;color:#24221d;padding:90px 0;border-top:1px solid rgba(36,34,29,.12)}
.legal + .legal{padding-top:10px}
.legal .legal-inner{max-width:900px}
.legal h2{font-family:Georgia,serif;font-size:clamp(2.4rem,7vw,4.5rem);line-height:1;margin:0 0 26px}
.legal h3{font-family:Georgia,serif;font-size:1.35rem;margin:34px 0 10px}
.legal p,.legal li{font-size:.96rem;line-height:1.7}
.legal ul{padding-left:1.2rem}
.legal a{text-decoration:underline;text-underline-offset:3px}
.legal .legal-note{font-size:.82rem;opacity:.72;margin-top:32px}






/* ===== V5 mobile corrections ===== */
html, body {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden !important;
}

*, *:before, *:after {
  box-sizing: border-box;
}

img, video, iframe, svg {
  max-width: 100%;
  height: auto;
}

/* No mobile menu on purpose */
.legacy-mobile-menu,
.legacy-mobile-panel,
.legacy-menu-button,
.legacy-menu-toggle {
  display: none !important;
}

/* The moving banner must remain wider than the screen, but be clipped by its own wrapper */
.ticker {
  width: 100%;
  max-width: 100%;
  overflow: hidden !important;
}

.ticker-track {
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
}

.ticker-track span {
  display: inline-block !important;
  white-space: nowrap !important;
}

/* Avoid any accidental horizontal page overflow without breaking the ticker */
.nav,
.hero,
.section,
footer {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

@media (max-width: 900px) {
  .nav-links {
    display: none !important;
  }

  .nav-inner {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .brand {
    max-width: calc(100vw - 44px) !important;
  }

  .hero-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .hero-content h1,
  .hero-sub,
  .actions {
    max-width: 100% !important;
  }

  .wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }
}


/* V6: decorative card arrows removed because they are not interactive */
.card-arrow,
.service-arrow,
.arrow,
[class*="card-arrow"],
[class*="service-arrow"] {
  display: none !important;
}


/* ===== V7 readability improvements ===== */
/* Stronger dark overlay on image cards so white text stays readable */
.service-card::before,
.card::before,
.image-card::before {
  background: rgba(0,0,0,.42) !important;
}

/* Text on dark/photo backgrounds */
.service-card,
.service-card h2,
.service-card h3,
.service-card p,
.service-card .eyebrow,
.card,
.card h2,
.card h3,
.card p,
.image-card,
.image-card h2,
.image-card h3,
.image-card p {
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.72);
}

/* Small gold labels stay warm but brighter */
.service-card .eyebrow,
.card .eyebrow,
.image-card .eyebrow {
  color: #f0c982 !important;
  text-shadow: 0 2px 7px rgba(0,0,0,.75);
}

/* Hero copy gets a little more contrast as well */
.hero-sub,
.hero .eyebrow {
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.8);
}


/* ===== V8: simple menu and separate legal pages ===== */

.simple-menu-button,.simple-mobile-menu{display:none}
@media(max-width:900px){
  .simple-menu-button{
    display:block;position:absolute;right:18px;top:18px;z-index:20001;
    width:58px;height:58px;line-height:54px;text-align:center;
    background:#171610;color:#fff!important;text-decoration:none!important;
    font-size:34px;font-family:Arial,sans-serif
  }
  .simple-mobile-menu{
    display:none;position:absolute;top:82px;left:0;right:0;z-index:20000;
    background:#171610;border-top:1px solid rgba(255,255,255,.15)
  }
  .simple-mobile-menu a{
    display:block;padding:16px 24px;color:#fff!important;text-decoration:none!important;
    border-bottom:1px solid rgba(255,255,255,.1);font:18px/1.25 Arial,sans-serif
  }
}

.legal-page{background:#f4efe3;min-height:100vh;padding:100px 24px;color:#171610}
.legal-wrap{max-width:860px;margin:0 auto}
.legal-back{display:inline-block;margin-bottom:44px;color:#8b4f32;text-decoration:none;font-weight:700}
.legal-page h1{font-family:Georgia,serif;font-size:clamp(48px,8vw,78px);margin:0 0 40px}
.legal-page h2{font-family:Georgia,serif;font-size:28px;margin:40px 0 12px}
.legal-page p{font-size:17px;line-height:1.75;margin:0 0 18px}
.legal-date{margin-top:48px;font-style:italic}


/* ===== V9 complete homepage fixes ===== */
.nav { position: relative; }
/* ===== V10: Zuchtbild gezielt korrigiert ===== */
.service:nth-child(3){
  background-color:#111 !important;
  background-image:url('images/zucht-hengst.jpg') !important;
  background-repeat:no-repeat !important;
  background-position:center 24% !important;
  background-size:cover !important;
}
@media(max-width:600px){
  .service:nth-child(3){
    background-position:center 18% !important;
  }
}


/* ===== V11 final: Zucht with both stallions ===== */
.service-zucht{
  grid-column:1 / -1 !important;
  min-height:0 !important;
  background:#0d0d0b !important;
  background-image:none !important;
  padding:42px !important;
  display:block !important;
}
.service-zucht:before{display:none !important}
.service-zucht .service-no,.service-zucht h3,.service-zucht>p{position:relative;z-index:2}
.service-zucht>p{max-width:760px !important;margin-bottom:30px !important}
.zucht-horses{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:26px;width:100%}
.zucht-horse{margin:0;background:#050505;border:1px solid rgba(255,255,255,.12);overflow:hidden}
.zucht-horse img{display:block;width:100%;height:520px;object-fit:contain;background:#000}
.zucht-horse figcaption{padding:18px 14px 20px;text-align:center;color:#fff;font-family:Georgia,serif;font-size:1.45rem}
@media(max-width:600px){
  .service-zucht{padding:28px 20px !important}
  .zucht-horses{grid-template-columns:1fr 1fr;gap:10px}
  .zucht-horse img{height:300px;object-fit:contain}
  .zucht-horse figcaption{font-size:1rem;padding:13px 6px 15px}
}
\n\n/* ===== V12 FINAL: Zucht schwarz + saubere Hengstbilder ===== */
.service.service-zucht,
.service:nth-child(3).service-zucht{
  background:#000 !important;
  background-color:#000 !important;
  background-image:none !important;
  color:#fff !important;
  box-shadow:none !important;
}
.service.service-zucht:before,
.service:nth-child(3).service-zucht:before{display:none !important;content:none !important}
.service-zucht .zucht-horses{position:relative;z-index:3}
.service-zucht .zucht-horse{background:#000 !important;border:1px solid rgba(255,255,255,.12);}
.service-zucht .zucht-horse img{
  display:block !important;
  width:100% !important;
  height:520px !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  background:#000 !important;
}
@media(max-width:600px){
  .service.service-zucht{padding:30px 18px !important}
  .service-zucht .zucht-horses{grid-template-columns:1fr 1fr !important;gap:10px !important}
  .service-zucht .zucht-horse img{height:310px !important;object-fit:contain !important;object-position:center bottom !important}
  .service-zucht .zucht-horse figcaption{font-size:1rem !important;padding:13px 5px 15px !important;white-space:normal !important}
}


/* ===== V12.1 gezielte Korrekturen – Basis bleibt V12 ===== */

/* Zucht: ausschließlich schwarzer Hintergrund */
.service.service-zucht,
.service:nth-child(3).service-zucht {
  background: #000 !important;
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: none !important;
}
.service.service-zucht:before,
.service:nth-child(3).service-zucht:before {
  display: none !important;
  content: none !important;
}

/* Beide Hengste vollständig und gleichmäßig innerhalb der Bildfläche */
.service-zucht .zucht-horses {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  width: 100% !important;
}
.service-zucht .zucht-horse {
  margin: 0 !important;
  background: #000 !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  overflow: hidden !important;
}
.service-zucht .zucht-horse img {
  display: block !important;
  width: 100% !important;
  height: 500px !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  background: #000 !important;
}
.service-zucht .zucht-horse figcaption {
  color: #fff !important;
  background: #000 !important;
}

/* Hero- und Kontaktbuttons auf kleinen Displays vollständig im Bildschirm */
@media (max-width: 600px) {
  .hero-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .hero .actions,
  .contact-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 12px !important;
  }

  .hero .actions .btn,
  .contact-actions .btn {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    white-space: normal !important;
    text-align: center !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .service.service-zucht {
    padding: 28px 16px !important;
  }

  .service-zucht .zucht-horses {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .service-zucht .zucht-horse img {
    height: 315px !important;
    object-fit: contain !important;
  }

  .service-zucht .zucht-horse figcaption {
    font-size: 1rem !important;
    line-height: 1.25 !important;
    padding: 13px 5px 15px !important;
  }
}

/* Zusätzlicher Schutz: die Seite selbst darf nie horizontal verrutschen */
html, body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}


/* ===== V12.2: bessere Lesbarkeit im Kopfbereich ===== */
@media (max-width: 900px) {
  .nav,
  header .nav,
  .site-header,
  header {
    background-color: #263d32 !important;
  }

  .brand,
  .brand *,
  .logo,
  .logo *,
  .nav .brand,
  .nav .brand * {
    color: #f5efe2 !important;
    border-color: #f5efe2 !important;
    opacity: 1 !important;
  }

  .simple-menu-button,
  .menu-button,
  .menu-toggle-label {
    background-color: #171610 !important;
    color: #fff !important;
  }
}


/* ===== V12.3: funktionsfähiges mobiles Hamburger-Menü ===== */
.hr-menu-button,
.hr-mobile-menu {
  display: none;
}

@media (max-width: 900px) {
  .nav {
    position: relative !important;
  }

  .hr-menu-button {
    display: block !important;
    position: absolute !important;
    top: 18px !important;
    right: 18px !important;
    width: 58px !important;
    height: 58px !important;
    padding: 17px 15px !important;
    background: #171610 !important;
    z-index: 30002 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
  }

  .hr-menu-button span {
    display: block !important;
    width: 28px !important;
    height: 3px !important;
    margin: 0 0 7px 0 !important;
    background: #fff !important;
  }

  .hr-mobile-menu {
    display: none;
    position: absolute !important;
    top: 94px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background: #171610 !important;
    z-index: 30001 !important;
    border-top: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 12px 24px rgba(0,0,0,.3) !important;
  }

  .hr-mobile-menu a {
    display: block !important;
    width: 100% !important;
    padding: 16px 22px !important;
    box-sizing: border-box !important;
    color: #fff !important;
    background: #171610 !important;
    text-decoration: none !important;
    font-family: Arial, sans-serif !important;
    font-size: 18px !important;
    line-height: 1.25 !important;
    border-bottom: 1px solid rgba(255,255,255,.09) !important;
  }

  .nav-links {
    display: none !important;
  }
}


/* ===== V12.4: tatsächlicher Hamburger-Menü-Fix ===== */
/* Der frühere horizontale Scroll-Fix hat das Dropdown innerhalb der Navigation abgeschnitten. */
@media (max-width: 900px) {
  .nav {
    overflow: visible !important;
  }

  .nav-inner {
    overflow: visible !important;
  }

  .hr-mobile-menu {
    overflow: visible !important;
  }
}

/* Seitliches Scrollen bleibt trotzdem auf der gesamten Seite gesperrt. */
html, body {
  overflow-x: hidden !important;
}


/* ===== V12.6: automatische Anlagen-Galerie ===== */
.holding-visual {
  overflow: hidden !important;
}

.hr-anlage-slider {
  position: relative !important;
  width: 100% !important;
  height: 620px !important;
  overflow: hidden !important;
  background: #2d473b !important;
}

.hr-anlage-slide {
  position: absolute !important;
  top: 0 !important;
  left: 100%;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 0;
}

.hr-anlage-slide.is-active {
  left: 0;
  opacity: 1;
  z-index: 2;
}

@media (max-width: 700px) {
  .hr-anlage-slider {
    height: 520px !important;
  }
  .hr-anlage-slide {
    object-fit: cover !important;
  }
}


/* ===== V12.7: Anlagenbilder vollständig sichtbar ===== */
.hr-anlage-slider {
  height: 560px !important;
  background: #171610 !important;
  padding: 18px !important;
  box-sizing: border-box !important;
}

.hr-anlage-slide {
  top: 18px !important;
  width: calc(100% - 36px) !important;
  height: calc(100% - 36px) !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #171610 !important;
}

.hr-anlage-slide.is-active {
  left: 18px !important;
}

/* JS fährt die Slides weiterhin von rechts nach links;
   neue Start-/Endpositionen berücksichtigen den Innenabstand. */
@media (max-width: 700px) {
  .hr-anlage-slider {
    height: 460px !important;
    padding: 12px !important;
  }

  .hr-anlage-slide {
    top: 12px !important;
    width: calc(100% - 24px) !important;
    height: calc(100% - 24px) !important;
    object-fit: contain !important;
  }

  .hr-anlage-slide.is-active {
    left: 12px !important;
  }
}


/* ===== V12.8: Slider bereinigt – kein schwarzer Rahmen ===== */
.hr-anlage-slider {
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  aspect-ratio: 4 / 3 !important;
}

.hr-anlage-slide {
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.hr-anlage-slide.is-active {
  left: 0 !important;
}

@media (max-width: 700px) {
  .hr-anlage-slider {
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  .hr-anlage-slide {
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: transparent !important;
  }

  .hr-anlage-slide.is-active {
    left: 0 !important;
  }
}


/* ===== V12.9: defekte Bildreferenz entfernt ===== */
.hr-anlage-slider,
.hr-anlage-slider img {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

.hr-anlage-slider img {
  display: block !important;
}

/* V12.10 – Westernreiten Bildanimation */
.hr-western-slider{position:relative!important;width:100%!important;aspect-ratio:4/5!important;overflow:hidden!important;background:#11100c!important}
.hr-western-slide{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;display:block!important;opacity:0!important;transform:scale(1.035)!important;transition:opacity 1.1s ease,transform 5s ease!important;border:0!important;outline:0!important;box-shadow:none!important}
.hr-western-slide.is-active{opacity:1!important;transform:scale(1)!important;z-index:2!important}
.hr-western-progress{position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:3px!important;background:rgba(255,255,255,.12)!important;z-index:4!important}
.hr-western-progress span{display:block!important;width:100%!important;height:100%!important;background:rgba(224,193,137,.75)!important;transform-origin:left center!important;animation:hrWesternBar 4.5s linear infinite!important}
@keyframes hrWesternBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:700px){.hr-western-slider{aspect-ratio:4/5!important}}
@media(prefers-reduced-motion:reduce){.hr-western-slide{transition:opacity .25s linear!important;transform:none!important}.hr-western-progress span{animation:none!important}}


/* ===== V12.11: Westernreiten – immer nur EIN vollständiges Bild ===== */
.hr-western-slider {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 3 / 2 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

.hr-western-slide {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity 1s ease !important;
}

.hr-western-slide.is-active {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  z-index: 2 !important;
}

@media (max-width: 700px) {
  .hr-western-slider {
    width: 100% !important;
    aspect-ratio: 3 / 2 !important;
    padding: 0 !important;
  }

  .hr-western-slide,
  .hr-western-slide.is-active {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    transform: none !important;
  }
}

/* V12.13 – Story & komfortablere Navigation */
html{scroll-behavior:smooth}
.nav{position:sticky!important;top:0!important;z-index:9990!important}
.admin-bar .nav{top:32px!important}
.hr-back-top{position:fixed!important;right:22px!important;bottom:22px!important;width:48px!important;height:48px!important;display:flex!important;align-items:center!important;justify-content:center!important;border-radius:50%!important;background:#263d32!important;color:#f5efe2!important;text-decoration:none!important;font-size:25px!important;z-index:9995!important;box-shadow:0 8px 25px rgba(0,0,0,.18)!important;opacity:0!important;visibility:hidden!important;transform:translateY(12px)!important;transition:.25s ease!important}
.hr-back-top.is-visible{opacity:1!important;visibility:visible!important;transform:translateY(0)!important}
.hero-sub strong{font-family:Georgia,serif!important;font-size:1.12em!important;font-weight:600!important}
@media(max-width:782px){.admin-bar .nav{top:46px!important}}
@media(max-width:700px){.hr-back-top{right:14px!important;bottom:16px!important;width:44px!important;height:44px!important}}

/* V12.14 – Story-Bereich bereinigt */
#geschichte p { margin-bottom: 28px !important; }


/* ==========================================================
   V12.15 – Besucherfreundliche Verfeinerung
   Basis: V12.14. Slider, Hengste, Menü, Rechtliches und
   bestehende Bildauswahl bleiben unverändert.
   ========================================================== */

/* Einheitlicher, kompakter Rhythmus ohne große Leerflächen */
.section{padding:clamp(72px,8vw,108px) 0}
.section-tight{padding:clamp(66px,7vw,94px) 0}

/* Neue Hauptthemen werden erkennbar, ohne harte Trenner oder bunte Blöcke */
.chapter{position:relative}
.chapter-ranch{background:var(--paper)}
.chapter-services{background:#eee4d3}
.chapter-heute{background:var(--paper2)}
.chapter-story{background:#f7f1e7}

/* Die kleine Kapitelzeile wird zum klaren Orientierungspunkt */
.chapter .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
  line-height:1.25;
}
.chapter .eyebrow:before{
  content:"◆";
  font-size:.56rem;
  color:var(--gold);
  transform:translateY(-1px);
}
.chapter .eyebrow.light:before{color:#e2c18b}

/* Intro: Text/Bild etwas hochwertiger zusammenführen */
.intro-copy .btn{margin-top:10px}
.image-stack .main,
.image-stack .small{transition:transform .45s ease, box-shadow .45s ease}

/* Angebotsbereich: schneller erfassbar und interaktiv, nur Desktop bewegt sich */
.service{
  transition:transform .28s ease, box-shadow .28s ease;
}
.service-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  max-width:100%;
  margin-top:18px;
  padding-bottom:3px;
  color:#fff;
  text-decoration:none;
  font-size:.72rem;
  line-height:1.3;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.5);
}
.service-link span{transition:transform .2s ease}
.service-link:hover span{transform:translateX(4px)}
.service-zucht .zucht-contact-link{margin-top:20px}

@media (hover:hover) and (min-width:901px){
  .service:hover{
    transform:translateY(-6px);
    box-shadow:0 30px 80px rgba(25,21,14,.23);
  }
  .image-stack:hover .main{transform:translateY(-3px)}
}

/* Haltung: Nummer, Überschrift und Text eindeutig miteinander verbunden */
.feature{
  grid-template-columns:52px minmax(0,1fr);
  gap:18px;
  align-items:start;
}
.feature .num,
.feature h3,
.feature p{text-align:left}

/* Hope Ranch heute: Betreiberin sofort erkennbar */
.operator-badge{
  display:inline-flex;
  margin:0 0 20px;
  padding:8px 12px;
  border:1px solid rgba(27,26,22,.18);
  background:rgba(255,255,255,.42);
  color:var(--rust);
  font-size:.68rem;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
}

/* Geschichte: drei Kapitel visuell eindeutiger, vorhandene Timeline bleibt */
.event .year{
  display:flex;
  align-items:center;
  gap:9px;
}
.event .year span{
  display:inline-grid;
  place-items:center;
  width:28px;
  height:28px;
  flex:0 0 28px;
  border:1px solid rgba(156,88,47,.35);
  border-radius:50%;
  font-family:Georgia,serif;
  font-size:.72rem;
  letter-spacing:0;
}
.event h3{line-height:1.12}

/* Kontakt: deutlicher Abschluss der Seite */
.contact-grid{align-items:center}
.contact .lead{max-width:650px}
.contact-actions{margin-top:24px}
.contact-card{
  box-shadow:0 20px 55px rgba(57,24,8,.18);
}
.contact-card,
.contact-card *{color:#fff}

/* Mobile: klare Themenwechsel, aber weiterhin kompakt */
@media(max-width:700px){
  .section{padding:68px 0}
  .section-tight{padding:64px 0}
  .chapter .eyebrow{margin-bottom:4px}
  .services-head{margin-bottom:30px}
  .service{min-height:390px}
  .service-link{font-size:.68rem}
  .feature{
    grid-template-columns:42px minmax(0,1fr)!important;
    gap:14px!important;
  }
  .feature .num{font-size:1.35rem}
  .operator-badge{
    margin-bottom:16px;
    font-size:.63rem;
  }
  .story-grid{gap:42px}
  .event{padding-bottom:44px}
  .timeline{padding-left:25px}
  .event:before{left:-31px}
  .contact h2{
    font-size:clamp(2.75rem,13vw,4.3rem);
    overflow-wrap:anywhere;
  }
  .contact-grid{gap:42px}
}

/* Keine Bewegungs-Effekte für Nutzer mit reduzierter Animation */
@media(prefers-reduced-motion:reduce){
  .service,.image-stack .main,.image-stack .small,.service-link span{transition:none!important}
}


/* ==========================================================
   V12.16 – nur: Pferdepension, Diana-Foto, mobiler Telefonbutton
   Basis V12.15; alle übrigen Einstellungen bleiben bestehen.
   ========================================================== */

.pension-facts{
  display:grid;
  gap:9px;
  margin:18px 0 2px;
}
.pension-facts > div{
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  gap:10px;
  padding-top:9px;
  border-top:1px solid rgba(255,255,255,.22);
}
.pension-facts strong{
  color:#e3bd7e;
  font-size:.67rem;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.pension-facts span{
  color:#fff;
  font-size:.82rem;
  line-height:1.4;
}

.operator-photo{
  margin:0 0 22px;
  max-width:560px;
}
.operator-photo img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/3;
  object-fit:contain;
  background:#e9dfcf;
}
.operator-photo figcaption{
  margin-top:8px;
  font-size:.68rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  opacity:.72;
}

.mobile-call-button{
  display:none;
}

@media(max-width:700px){
  body{padding-bottom:74px}
  .pension-facts > div{
    grid-template-columns:64px minmax(0,1fr);
  }
  .operator-photo{
    margin-bottom:18px;
  }
  .mobile-call-button{
    position:fixed;
    z-index:9998;
    left:16px;
    right:16px;
    bottom:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:52px;
    padding:12px 18px;
    border:1px solid rgba(255,255,255,.2);
    border-radius:999px;
    background:#26372d;
    color:#fff;
    box-shadow:0 10px 28px rgba(0,0,0,.28);
    text-decoration:none;
    font-size:.78rem;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
  }
  .mobile-call-button span{
    font-size:1rem;
  }
}


/* V12.18 – mobiler Telefonbutton kompakt, passend zum Nach-oben-Button */
@media(max-width:700px){
  body{padding-bottom:0!important}

  .mobile-call-button{
    left:18px!important;
    right:auto!important;
    bottom:18px!important;
    width:58px!important;
    height:58px!important;
    min-height:58px!important;
    max-width:58px!important;
    padding:0!important;
    border-radius:50%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    overflow:hidden!important;
    font-size:0!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }

  .mobile-call-button span{
    display:block!important;
    font-size:1.45rem!important;
    line-height:1!important;
    margin:0!important;
  }
}


/* ==========================================================
   V12.19 – Lesbarkeit der Angebotskarten
   Nur Kontrast/Textlesbarkeit; Aufbau und Bilder unverändert.
   ========================================================== */

/* Gleichmäßiger dunkler Verlauf über den Angebotsfotos:
   Bild bleibt sichtbar, Text bekommt verlässlichen Kontrast. */
.service:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(
      to bottom,
      rgba(10,8,5,.18) 0%,
      rgba(10,8,5,.30) 38%,
      rgba(10,8,5,.64) 72%,
      rgba(10,8,5,.82) 100%
    );
}

/* Bestehende Inhalte sicher über dem Kontrast-Layer halten */
.service > *{
  position:relative;
  z-index:1;
}

/* Fließtext etwas klarer, ohne Schriftart/Größe zu verändern */
.service p,
.service .pension-facts span{
  color:#fff!important;
  text-shadow:0 1px 3px rgba(0,0,0,.58);
  font-weight:500;
}

/* Kleine Bezeichnungen auf dem Foto deutlicher */
.service .service-no{
  color:#fff4df!important;
  text-shadow:0 1px 3px rgba(0,0,0,.55);
}
.service .pension-facts strong{
  color:#f1c982!important;
  text-shadow:0 1px 3px rgba(0,0,0,.55);
}

/* Große Überschriften bleiben weiß, bekommen nur leichte Absicherung */
.service h3{
  color:#fff!important;
  text-shadow:0 2px 7px rgba(0,0,0,.42);
}

/* Zucht ist bereits eine schwarze Sonderkarte; dort keinen Foto-Layer erzeugen */
.service.service-zucht:after{
  display:none!important;
}


/* V12.21 – Weidenfoto: Pferde im sichtbaren Ausschnitt priorisieren.
   Das Vordergrundfoto von Diana Müller bleibt unverändert. */
.image-stack .main{
  object-position:center 78%!important;
}

@media(max-width:700px){
  .image-stack .main{
    object-position:center 82%!important;
  }
}