/* Don Joaco Coffee Shop / Kontakt */
.dj-visit-page { background: var(--dj-white); }
.dj-visit-hero { min-height: 78vh; position: relative; display: flex; align-items: flex-end; overflow: hidden; background: var(--dj-black); color: var(--dj-white); }
.dj-visit-hero__media { position: absolute; inset: 0; background: url('https://cafedonjoaco.com/wp-content/uploads/2025/03/Cafe-Don-Joaco-1050-Speciality-Coffee-Wien-1-scaled.webp') center/cover no-repeat; }
.dj-visit-hero__overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.50) 50%, rgba(0,0,0,.18) 100%); }
.dj-visit-hero__content { position: relative; z-index: 2; padding-block: 105px 68px; }
.dj-visit-hero h1 { margin: 0; max-width: 1100px; font-size: clamp(54px, 8vw, 120px); line-height: .9; letter-spacing: -.055em; font-weight: 800; }
.dj-visit-hero__lead { max-width: 680px; margin: 30px 0 0; font-size: clamp(18px, 2vw, 25px); line-height: 1.5; }

.dj-visit-details { padding: 105px 0; background: var(--dj-cream); }
.dj-visit-details h2, .dj-visit-split h2, .dj-visit-menu h2, .dj-visit-origin h2, .dj-visit-cta h2 { margin: 0; font-size: clamp(42px, 6vw, 86px); line-height: .96; letter-spacing: -.05em; }
.dj-visit-facts { border-top: 1px solid rgba(0,0,0,.22); }
.dj-visit-facts > div { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 22px 0; border-bottom: 1px solid rgba(0,0,0,.22); }
.dj-visit-facts span { color: var(--dj-green); text-transform: uppercase; letter-spacing: .12em; font-size: 11px; font-weight: 800; }
.dj-visit-facts strong { font-size: 18px; line-height: 1.45; }
.dj-visit-facts a { text-decoration: none; }

.dj-visit-split { display: grid; grid-template-columns: 1.05fr .95fr; min-height: 700px; }
.dj-visit-split__image { min-height: 620px; background: url('https://cafedonjoaco.com/wp-content/uploads/2025/06/directcoffee-eu-OG-Colombia-Coffee-Vienna.jpg') center/cover no-repeat; }
.dj-visit-split__content { padding: 80px clamp(36px, 6vw, 100px); display: flex; flex-direction: column; justify-content: center; background: var(--dj-green-deep); color: var(--dj-white); }
.dj-visit-split__content .dj-section-label { color: #b9c7b9; }
.dj-visit-split__content > p:not(.dj-section-label) { max-width: 650px; font-size: 21px; line-height: 1.6; }
.dj-visit-split__content .dj-text-link { color: #fff; }

.dj-visit-menu { padding: 105px 0; }
.dj-visit-menu__grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 50px; border-top: 1px solid var(--dj-line); border-left: 1px solid var(--dj-line); }
.dj-visit-menu__grid > div { min-height: 190px; padding: 26px; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid var(--dj-line); border-bottom: 1px solid var(--dj-line); }
.dj-visit-menu__grid span { color: var(--dj-green); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; }
.dj-visit-menu__grid strong { font-size: clamp(22px, 2.5vw, 34px); line-height: 1.1; }

.dj-visit-origin { padding: 105px 0; background: var(--dj-coffee-deep); color: var(--dj-white); }
.dj-visit-origin .dj-section-label { color: #d5c3b5; }
.dj-visit-origin .dj-big-copy { color: var(--dj-white); }

.dj-visit-cta { padding: 90px 0; background: var(--dj-black); color: var(--dj-white); }
.dj-visit-cta .dj-section-label { color: #b9c7b9; }
.dj-visit-cta__inner { display: grid; grid-template-columns: 1.15fr .85fr; gap: 40px; align-items: end; }
.dj-visit-cta .dj-actions { justify-content: flex-end; }

@media (max-width: 980px) {
  .dj-visit-split, .dj-visit-cta__inner { grid-template-columns: 1fr; }
  .dj-visit-menu__grid { grid-template-columns: 1fr 1fr; }
  .dj-visit-cta .dj-actions { justify-content: flex-start; }
}

@media (max-width: 620px) {
  .dj-visit-hero { min-height: 74vh; }
  .dj-visit-hero__content { padding-block: 86px 42px; }
  .dj-visit-hero h1 { font-size: clamp(46px, 15vw, 74px); }
  .dj-visit-details, .dj-visit-menu, .dj-visit-origin, .dj-visit-cta { padding: 70px 0; }
  .dj-visit-split__image { min-height: 460px; }
  .dj-visit-split__content { padding: 62px 28px; }
  .dj-visit-facts > div { grid-template-columns: 1fr; gap: 7px; }
  .dj-visit-menu__grid { grid-template-columns: 1fr; }
  .dj-visit-menu__grid > div { min-height: 130px; }
}
