/* Ravida: warm offwhite, charcoal and restrained gold. */
:root {
  --color-brand-900: #171717;
  --color-brand-850: #171717;
  --color-brand-800: #292723;
  --color-brand-600: #987221;
  --color-mint: #d7b96e;
  --color-accent-hover: #c4a052;
  --color-accent: #d7b96e;
  --color-surface: #faf8f4;
  --ravida-gold: #b89345;
}
html, body, .bg-surface { background-color: #faf8f4; }
.bg-surface-dim { background-color: #f0ece5; }
.text-brand-900, .text-brand-800, .text-brand-700 { color: #171717; }
.text-brand-600 { color: #987221; }
.text-mint { color: #d7b96e; }
.text-accent { color: #d7b96e; }
.text-accent\/70 { color: #a78335; }
.text-accent\/60 { color: #a78335; }
.bg-accent { background-color: #d7b96e; }
.bg-accent\/10 { background-color: #b8934512; }
.bg-accent\/15 { background-color: #b8934524; }
.hover\:bg-accent-hover:hover { background-color: #c4a052; }
.border-accent\/20, .border-accent\/30 { border-color: #b893454d; }
.bg-brand-900, .bg-brand-850, .bg-brand-800, .bg-brand-700 { background-color: #171717; }
.bg-mint { background-color: #d7b96e; }
.bg-brand-900\/5 { background-color: #1717170d; }
.bg-brand-900\/7, .bg-brand-900\/10 { background-color: #17171712; }
.bg-brand-900\/15 { background-color: #17171726; }
.bg-mint\/80 { background-color: #d7b96ecc; }
.text-brand-900\/60 { color: #17171799; }
.text-brand-900\/70 { color: #171717b3; }
.border-brand-900\/20, .border-brand-900\/15 { border-color: #b8934540; }
.border-mint\/20 { border-color: #d7b96e33; }
.border-mint\/30 { border-color: #d7b96e4d; }
.hover\:bg-brand-800:hover, .hover\:bg-brand-900:hover { background-color: #302a20; }
.hover\:text-brand-900:hover, .hover\:text-brand-700:hover { color: #987221; }
.hover\:bg-brand-900\/5:hover { background-color: #b8934512; }
.fill-amber-400 { fill: #b89345; }
.text-amber-400 { color: #b89345; }
.text-emerald-600, .text-emerald-700, .text-green-600, .text-green-700 { color: #89661d; }
.bg-emerald-50, .bg-green-50 { background-color: #f5efdf; }
em { --em-color: #987221; }
.bg-brand-900 em, .bg-brand-850 em { --em-color: #d7b96e; }
input[type="range"], input[type="checkbox"] { accent-color: #b89345; }
input:focus, select:focus, textarea:focus { border-color: #b89345 !important; }
a:focus-visible, button:focus-visible { outline: 2px solid #b89345; outline-offset: 4px; }

/* Frame the actual supplied mark within its transparent canvas. */
.font-logo {
  position: relative;
  display: inline-block !important;
  width: 6rem;
  height: 1.75rem;
  flex-shrink: 0;
  overflow: hidden;
  background: url('/ravida-logo.png') center / 8.15rem 8.15rem no-repeat;
}
.font-logo > * { visibility: hidden !important; }
footer .font-logo { filter: invert(1); }

/* Floating liquid-glass navigation across all pages. */
header.fixed {
  top: 18px;
  left: 50%;
  right: auto;
  width: calc(100% - 48px);
  max-width: 1220px;
  transform: translateX(-50%);
  background: linear-gradient(125deg, #ffffffcc, #faf8f4b8) !important;
  border: 1px solid #ffffffcc;
  border-bottom-color: #c7b68a66;
  border-radius: 18px;
  box-shadow: 0 10px 36px #1717170c, inset 0 1px 0 #ffffff, inset 0 -1px 0 #ffffff88;
  backdrop-filter: blur(24px) saturate(150%);
  -webkit-backdrop-filter: blur(24px) saturate(150%);
}
header.fixed > div:first-child { height: 68px; padding-inline: 28px; }
header nav { gap: 28px; }
header nav a { font-size: 11px; letter-spacing: .1em; }
header a[data-journey-label="header"] {
  padding: 13px 18px;
  font-size: 10px;
  letter-spacing: .08em;
  border: 1px solid #b8934540;
  border-radius: 8px;
}
header a[href="/akademie"], header a[href="/ueber-uns"],
footer a[href="/akademie"] { display: none !important; }

/* New photographic intro; the pale sky leaves room for the headline. */
main > section:first-child:has(.journey-sequence) {
  background-image: linear-gradient(90deg, #faf8f4f2 0%, #faf8f4b8 30%, #faf8f400 64%), url('/hero/ravida-architecture.png');
  background-size: cover;
  background-position: center;
}
main > section:first-child:has(.journey-sequence) > div {
  min-height: min(880px, 100svh);
  padding-top: 180px;
  padding-bottom: 130px;
  justify-content: center;
}
main > section:first-child:has(.journey-sequence) > div > div:first-child {
  width: 56%;
  max-width: 650px;
  margin: 0;
  text-align: left;
  flex: none;
}
main > section:first-child:has(.journey-sequence) h1 {
  font-size: clamp(3.1rem, 5.1vw, 4.8rem);
  line-height: 1.04;
  letter-spacing: -.045em;
}
main > section:first-child:has(.journey-sequence) h1 + p {
  max-width: 420px;
  margin-left: 0;
  color: #54514a;
}
main > section:first-child:has(.journey-sequence) h1 ~ div:last-child {
  justify-content: flex-start;
  margin-top: 32px;
  gap: 14px;
}
main > section:first-child:has(.journey-sequence) a[data-journey-label="hero"] {
  border: 1px solid #b8934566;
  box-shadow: 0 6px 20px #17171715;
}
.journey-sequence, .mobile-ascent { display: none !important; }
#steuer-ebook img { filter: none; }

/* Recolour inherited vectors while preserving original team photos. */
svg [stop-color="#0E221B"] { stop-color: #171717; }
svg [stop-color="#55B98A"] { stop-color: #b89345; }
svg [stop-color="#7BD3A6"] { stop-color: #d7b96e; }
svg [stop-color="#2F6B55"] { stop-color: #987221; }
svg [fill="#0E221B"], svg [fill="#0e221b"], svg [fill="#1A2E22"] { fill: #171717; }
svg [fill="#7BD3A6"], svg [fill="#7bd3a6"] { fill: #d7b96e; }
svg [stroke="#7BD3A6"], svg [stroke="#7bd3a6"] { stroke: #d7b96e; }

@media (max-width: 1023px) {
  header.fixed { width: calc(100% - 32px); top: 14px; }
  header.fixed > div:first-child { height: 62px; padding-inline: 20px; }
  header.fixed > div:not(:first-child) { background: #faf8f4ed; border-radius: 0 0 18px 18px; }
  main > section:first-child:has(.journey-sequence) > div { min-height: 780px; padding-top: 150px; padding-bottom: 100px; }
  main > section:first-child:has(.journey-sequence) > div > div:first-child { width: 64%; }
  main > section:first-child:has(.journey-sequence) h1 { font-size: clamp(3rem, 6.1vw, 4.2rem); }
}
@media (max-width: 639px) {
  header.fixed { top: 12px; width: calc(100% - 24px); border-radius: 15px; }
  header.fixed > div:first-child { height: 58px; padding-inline: 18px; }
  header .font-logo { width: 5.6rem; height: 1.65rem; background-size: 7.6rem 7.6rem; }
  main > section:first-child:has(.journey-sequence) {
    background-image: linear-gradient(180deg, #faf8f4f5 0%, #faf8f4ed 48%, #faf8f430 100%), url('/hero/ravida-architecture.png');
    background-position: 66% center;
  }
  main > section:first-child:has(.journey-sequence) > div {
    min-height: 760px;
    min-height: max(710px, 93svh);
    padding: 140px 26px 190px;
    justify-content: flex-start;
  }
  main > section:first-child:has(.journey-sequence) > div > div:first-child { width: 100%; }
  main > section:first-child:has(.journey-sequence) h1 { font-size: clamp(2.75rem, 11.5vw, 3.8rem); }
  main > section:first-child:has(.journey-sequence) h1 + p { max-width: 320px; margin-top: 24px; font-size: 16px; line-height: 1.6; }
  main > section:first-child:has(.journey-sequence) h1 ~ div:last-child { margin-top: 28px; padding-top: 0; }
  main > section:first-child:has(.journey-sequence) a[data-journey-label="hero"] { padding: 17px 12px; font-size: 10px; }
}

/* Neutral city image, with no green tint in the closing section. */
main > section:last-child > img { filter: grayscale(1); opacity: .22; }
main > section:last-child > div[aria-hidden="true"] { background: linear-gradient(180deg, #17171785, #171717b3 50%, #171717ed); }
.bg-brand-900\/60 { background-color: #17171799; }
.ravida-contact { margin-top: 22px; font-style: normal; font-size: 14px; line-height: 1.85; color: #faf8f4c4; }
.ravida-contact strong { color: #faf8f4; font-weight: 500; }
.ravida-contact a { color: #d7b96e; }
.ravida-contact a:hover { text-decoration: underline; }

/* Selected readable testimonials with a direct route to the real Google profile. */
#kundenstimmen { background: #faf8f4; }
#kundenstimmen .animate-marquee { width: auto; display: block; animation: none; padding: 0 40px; max-width: 1280px; margin: auto; }
#kundenstimmen .animate-marquee + .animate-marquee,
#kundenstimmen .animate-marquee-reverse { display: none; }
#kundenstimmen .animate-marquee > ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding: 0; }
#kundenstimmen .animate-marquee > ul + ul,
#kundenstimmen .animate-marquee li:nth-child(n+4) { display: none; }
#kundenstimmen figure { width: 100%; height: auto; min-height: 310px; padding: 28px; border-radius: 4px; border-color: #d7cbb5; background: #fff; box-shadow: 0 6px 24px #17171704; }
#kundenstimmen blockquote { font-size: 16px; line-height: 1.7; min-height: 0; }
#kundenstimmen button { font-size: 13px; margin-top: 16px; }
#kundenstimmen figcaption { margin-top: 24px; padding-top: 20px; }
#kundenstimmen figcaption > span:nth-child(2) { font-size: 14px; }
#kundenstimmen > .relative > .pointer-events-none { display: none; }
#kundenstimmen [aria-label="Google-Bewertungen horizontal durchblättern"] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; max-width: 1280px; margin-inline: auto; padding-inline: 40px; }
#kundenstimmen [aria-label="Google-Bewertungen horizontal durchblättern"] > figure:nth-child(n+4) { display: none; }
.ravida-google-link { display: inline-flex; margin-top: 22px; color: #171717; font-size: 14px; font-weight: 600; border-bottom: 1px solid #b89345; padding-bottom: 5px; }
.ravida-google-link:hover { color: #987221; }
.ravida-review-source { color: #777166; font: 12px/1.5 var(--font-sans), sans-serif; }
@media (max-width: 767px) {
  #kundenstimmen .animate-marquee { padding: 0 24px; }
  #kundenstimmen .animate-marquee > ul, #kundenstimmen [aria-label="Google-Bewertungen horizontal durchblättern"] { grid-template-columns: 1fr; gap: 16px; }
  #kundenstimmen [aria-label="Google-Bewertungen horizontal durchblättern"] { padding-inline: 24px; }
  #kundenstimmen figure { padding: 24px; min-height: 0; }
}
