/*
 * Rossberg & Raudies — Frontend styles
 * Ported from the original React app. Custom colors / fonts come from theme.json
 * (CSS variables --wp--preset--color--* and --wp--preset--font-family--*) so the
 * Site-Editor "Styles" panel can override them globally.
 */

:root {
  --c-paper:      var(--wp--preset--color--paper, #F4F2EE);
  --c-ivory:      var(--wp--preset--color--ivory, #FAF8F4);
  --c-ink:        var(--wp--preset--color--ink, #11151E);
  --c-ink-soft:   var(--wp--preset--color--ink-soft, #2A2F3C);
  --c-steel:      var(--wp--preset--color--steel, #5A6172);
  --c-muted:      var(--wp--preset--color--muted, #8C8A85);
  --c-bronze:     var(--wp--preset--color--bronze, #A78554);
  --c-bronze-dk:  var(--wp--preset--color--bronze-dk, #8E6F45);
  --c-bronze-tint:rgba(167,133,84,.92);
  --c-line:       rgba(17,21,30,.12);
  --c-line-on-dark: rgba(255,255,255,.22);
  --ff:           var(--wp--preset--font-family--inter, 'Inter', system-ui, -apple-system, sans-serif);
  --ff-tight:     var(--wp--preset--font-family--inter-tight, 'Inter Tight', 'Inter', system-ui, sans-serif);
  --container:    1440px;
  --gutter:       clamp(20px, 4vw, 56px);
  --ease:         cubic-bezier(.2,0,.2,1);
}



  
  * { box-sizing: border-box; }
  html, body { margin: 0; background: var(--c-paper); color: var(--c-ink-soft); font-family: var(--ff); font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
  a { color: inherit; text-decoration: none; }
  img { display: block; max-width: 100%; }
  h1, h2, h3, h4 { font-family: var(--ff-tight); color: var(--c-ink); font-weight: 600; margin: 0; letter-spacing: -0.02em; }
  h1 { font-size: clamp(2.6rem, 6vw, 5.2rem); line-height: 1.02; }
  h2 { font-size: clamp(2rem, 3.4vw, 3.2rem); line-height: 1.05; }
  h3 { font-size: 1.4rem; line-height: 1.2; }
  p { margin: 0 0 1rem; max-width: 64ch; }
  .container { max-width: var(--container); margin: 0 auto; padding-inline: var(--gutter); }
  .micro { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; }

  /* ---------------- Header ---------------- */
  header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; transition: background 300ms var(--ease), border-color 300ms var(--ease); border-bottom: 1px solid transparent; }
  header.is-scrolled { background: rgba(244, 242, 238, .94); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom-color: var(--c-line); }
  .hdr { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 18px 0; gap: 24px; }
  .hdr__logo { justify-self: start; display: inline-flex; align-items: center; }
  .hdr__logo { position: relative; display: inline-flex; align-items: center; }
  .hdr__logo img { height: 38px; width: auto; display: block; }
  .hdr__logo .logo-light { display: block; }
  .hdr__logo .logo-dark  { display: none; }
  .hero-mode header:not(.is-scrolled) .hdr__logo .logo-light { display: none; }
  .hero-mode header:not(.is-scrolled) .hdr__logo .logo-dark  { display: block; }
    .hero-mode header:not(.is-scrolled) .nav a { color: #fff; }
  .hero-mode header:not(.is-scrolled) .lang { color: #fff; }
  .hero-mode header:not(.is-scrolled) .lang .dot { background: #fff; }
  .hero-mode header:not(.is-scrolled) .hdr__cta { color: #fff; border-color: rgba(255,255,255,.4); }
  .hero-mode header:not(.is-scrolled) .hdr__cta:hover { background: #fff; color: var(--c-ink); border-color: #fff; }
  .nav { display: flex; gap: clamp(20px, 4vw, 56px); justify-self: center; }
  .nav a { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: var(--c-ink); padding: 8px 0; position: relative; transition: color 220ms var(--ease); }
  .nav a::after { content: ''; position: absolute; left: 50%; right: 50%; bottom: 4px; height: 1px; background: var(--c-bronze); transition: all 240ms var(--ease); }
  .nav a:hover::after, .nav a.is-active::after { left: 0; right: 0; }
  .hdr__right { justify-self: end; display: flex; align-items: center; gap: 18px; }
  .lang { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; cursor: pointer; }
  .lang .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c-bronze); }
  .hdr__cta { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; border: 1px solid var(--c-ink); color: var(--c-ink); transition: all 220ms var(--ease); }
  .hdr__cta:hover { background: var(--c-ink); color: #fff; }
  @media (max-width: 980px) { .nav { display: none; } .hdr { grid-template-columns: auto 1fr; } .hdr__right { gap: 12px; } }

  /* ---------------- Hero ---------------- */
  .hero { position: relative; min-height: 100vh; height: 760px; max-height: 92vh; color: #fff; overflow: hidden; }
  .hero__bg { position: absolute; inset: 0; background: linear-gradient(180deg, #14171F 0%, #1F2A3A 40%, #3A4D5E 75%, #5A6F7E 100%); }
  .hero__bg::before { content: ''; position: absolute; inset: 0; background:
    radial-gradient(ellipse at 25% 70%, rgba(167,133,84,.18), transparent 60%),
    radial-gradient(ellipse at 80% 30%, rgba(86,94,115,.4), transparent 55%);
  }
  /* photographic facade illusion: vertical louvers + warm tone */
  .hero__bg::after { content: ''; position: absolute; inset: 0;
    background:
      linear-gradient(180deg, rgba(0,0,0,.35) 0%, transparent 40%, rgba(0,0,0,.55) 100%),
      repeating-linear-gradient(90deg, rgba(0,0,0,.10) 0 2px, transparent 2px 14px);
  }
  .hero__inner { position: relative; z-index: 2; padding-top: clamp(140px, 18vh, 220px); padding-bottom: 60px; height: 100%; display: flex; flex-direction: column; }
  .hero__top { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 6vw, 100px); flex: 1; align-items: stretch; }
  @media (max-width: 900px) { .hero__top { grid-template-columns: 1fr; } }
  .hero__left { display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 30px; max-width: 560px; }
  .hero__eyebrow { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 26px; color: rgba(255,255,255,.85); }
  .hero__eyebrow .ln { width: 36px; height: 1px; background: var(--c-bronze); }
  .hero__left h1 { color: #fff; font-weight: 600; letter-spacing: -0.025em; }
  .hero__left h1 span { color: var(--c-bronze); }
  .hero__lead { font-size: 17px; line-height: 1.6; color: rgba(255,255,255,.82); max-width: 48ch; margin: 26px 0 36px; }
  .hero__ctas { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
  .btn { display: inline-flex; align-items: center; gap: 14px; padding: 16px 26px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; transition: all 220ms var(--ease); cursor: pointer; border: 1px solid transparent; }
  .btn .arr { font-size: 14px; transition: transform 220ms var(--ease); display: inline-block; }
  .btn:hover .arr { transform: translateX(5px); }
  .btn--bronze { background: var(--c-bronze); color: #fff; }
  .btn--bronze:hover { background: var(--c-bronze-dk); }
  .btn--ghost-light { background: transparent; border-color: rgba(255,255,255,.4); color: #fff; }
  .btn--ghost-light:hover { background: #fff; color: var(--c-ink); border-color: #fff; }
  .btn--ink { background: var(--c-ink); color: #fff; }
  .btn--ink:hover { background: var(--c-bronze-dk); }
  .btn--ghost { background: transparent; border-color: var(--c-ink); color: var(--c-ink); }
  .btn--ghost:hover { background: var(--c-ink); color: #fff; }

  /* Right panel — the big translucent feature card */
  .hero__panel { position: relative; align-self: stretch; background: var(--c-bronze-tint); overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 36px 36px 36px; min-height: 380px; }
  .hero__panel-bignum { position: absolute; right: -40px; bottom: -100px; font-family: var(--ff-tight); font-size: clamp(280px, 32vw, 460px); font-weight: 700; line-height: .8; color: rgba(255,255,255,.10); letter-spacing: -0.05em; pointer-events: none; user-select: none; }
  .hero__panel-top { position: relative; z-index: 1; }
  .hero__panel-dots { display: flex; gap: 8px; margin-bottom: 22px; }
  .hero__panel-dots button { background: rgba(255,255,255,.35); border: 0; width: 28px; height: 3px; cursor: pointer; padding: 0; transition: background 220ms var(--ease); }
  .hero__panel-dots button.is-active { background: #fff; }
  .hero__panel h2 { color: #fff; font-size: clamp(2.4rem, 4.5vw, 4rem); font-weight: 600; letter-spacing: -0.025em; line-height: 1; }
  .hero__panel h2 sup { font-size: .5em; vertical-align: super; font-weight: 500; margin-left: 2px; }
  .hero__panel .tag { color: rgba(255,255,255,.92); font-size: 13px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; max-width: 24ch; line-height: 1.5; position: relative; z-index: 1; }
  .hero__panel .meta { color: rgba(255,255,255,.7); font-size: 13px; line-height: 1.5; margin-top: 12px; position: relative; z-index: 1; max-width: 30ch; }
  .hero__panel-thumb { display: block; width: 100%; max-width: 320px; height: 200px; object-fit: cover; margin-top: 22px; box-shadow: 0 14px 32px rgba(0,0,0,.35); border: 3px solid rgba(255,255,255,.92); position: relative; z-index: 2; }
  @media (max-width: 900px) { .hero__panel-thumb { max-width: 100%; height: 170px; } }
  /* hide nav arrow when thumb is present — handled inline */
  .hero__panel-arrow { display: none; position: absolute; right: 28px; top: 28px; color: #fff; z-index: 2; cursor: pointer; opacity: .8; transition: opacity 220ms var(--ease); }
  .hero__panel-arrow:hover { opacity: 1; }

  .hero__strip { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding-top: 36px; margin-top: 30px; border-top: 1px solid var(--c-line-on-dark); color: rgba(255,255,255,.7); font-size: 12.5px; letter-spacing: .18em; text-transform: uppercase; font-weight: 500; }
  .hero__strip a { color: rgba(255,255,255,.85); border-bottom: 1px solid var(--c-bronze); padding-bottom: 2px; }
  .hero__strip .left { display: flex; gap: 36px; }
  @media (max-width: 720px) { .hero__strip { flex-direction: column; align-items: flex-start; gap: 14px; } .hero__strip .left { gap: 20px; flex-wrap: wrap; } }

  /* ---------------- Section base ---------------- */
  section.s { padding: clamp(80px, 11vw, 160px) 0; position: relative; }
  .s--dark { background: var(--c-ink); color: rgba(255,255,255,.84); }
  .s--dark h2, .s--dark h3 { color: #fff; }
  .marker { display: flex; align-items: baseline; gap: 14px; margin-bottom: 18px; }
  .marker .n { color: var(--c-bronze-dk); font-size: 11px; letter-spacing: .22em; font-weight: 700; }
  .marker .l { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--c-steel); font-weight: 600; }
  .s--dark .marker .l { color: rgba(255,255,255,.6); }
  .s--dark .marker .n { color: var(--c-bronze); }
  .section__head { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(24px, 5vw, 80px); align-items: end; margin-bottom: clamp(40px, 6vw, 80px); }
  @media (max-width: 900px) { .section__head { grid-template-columns: 1fr; gap: 14px; } }
  .section__head .lead { font-size: 17px; line-height: 1.6; color: var(--c-ink-soft); max-width: 56ch; margin: 0; }
  .s--dark .section__head .lead { color: rgba(255,255,255,.7); }

  /* ---------------- Intro statement ---------------- */
  .intro { padding: clamp(70px, 10vw, 140px) 0; }
  .intro__grid { display: grid; grid-template-columns: 1fr 1.6fr; gap: clamp(28px, 6vw, 100px); }
  @media (max-width: 900px) { .intro__grid { grid-template-columns: 1fr; gap: 24px; } }
  .intro__big { font-family: var(--ff-tight); font-size: clamp(1.6rem, 2.6vw, 2.4rem); font-weight: 500; line-height: 1.25; color: var(--c-ink); letter-spacing: -0.015em; max-width: 24ch; }
  .intro__big span { color: var(--c-bronze-dk); }
  .intro__body p { color: var(--c-ink-soft); font-size: 16.5px; line-height: 1.7; max-width: 60ch; }
  .intro__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 40px; padding-top: 36px; border-top: 1px solid var(--c-line); max-width: 720px; }
  @media (max-width: 720px) { .intro__stats { grid-template-columns: 1fr 1fr; gap: 18px; } }
  .stat .n { font-family: var(--ff-tight); font-size: clamp(2.2rem, 4vw, 3.2rem); font-weight: 600; line-height: 1; color: var(--c-ink); letter-spacing: -0.02em; }
  .stat .n sup { font-size: .45em; color: var(--c-bronze-dk); font-weight: 500; margin-left: 2px; vertical-align: super; }
  .stat .l { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--c-steel); font-weight: 600; margin-top: 10px; }

  /* ---------------- Ankauf big slabs ---------------- */
  .ankauf { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 1.5vw, 22px); }
  @media (max-width: 760px) { .ankauf { grid-template-columns: 1fr; } }
  .slab { position: relative; min-height: 460px; padding: 32px 32px 36px; overflow: hidden; color: #fff; cursor: pointer; transition: transform 320ms var(--ease); display: flex; flex-direction: column; justify-content: space-between; }
  .slab:hover { transform: translateY(-3px); }
  .slab__bg { position: absolute; inset: 0; z-index: 0; }
  .slab__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(155deg, rgba(0,0,0,.10), rgba(0,0,0,.55)); }
  .slab--1 .slab__bg { background:
    linear-gradient(135deg, rgba(167,133,84,.78), rgba(142,111,69,.85)),
    repeating-linear-gradient(90deg, rgba(0,0,0,.08) 0 2px, transparent 2px 12px),
    #8E6F45;
  }
  .slab--2 .slab__bg { background:
    linear-gradient(135deg, rgba(31,42,58,.78), rgba(17,21,30,.85)),
    repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 26px),
    #1F2A3A;
  }
  .slab--3 .slab__bg { background:
    linear-gradient(135deg, rgba(90,97,114,.78), rgba(58,77,94,.85)),
    repeating-linear-gradient(90deg, rgba(0,0,0,.10) 0 3px, transparent 3px 18px),
    #4A5568;
  }
  .slab--4 .slab__bg { background:
    linear-gradient(135deg, rgba(75,52,30,.85), rgba(40,28,18,.92)),
    repeating-linear-gradient(45deg, rgba(255,255,255,.03) 0 2px, transparent 2px 16px),
    #2A1F14;
  }
  .slab__num { position: absolute; right: -40px; bottom: -100px; font-family: var(--ff-tight); font-size: clamp(260px, 30vw, 420px); font-weight: 700; line-height: .8; color: rgba(255,255,255,.10); letter-spacing: -0.05em; pointer-events: none; user-select: none; z-index: 1; }
  .slab__head { position: relative; z-index: 2; }
  .slab__cat { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: rgba(255,255,255,.7); }
  .slab__title { color: #fff; font-size: clamp(2rem, 3vw, 2.6rem); font-weight: 600; letter-spacing: -0.025em; line-height: 1; margin-top: 18px; }
  .slab__title sup { font-size: .5em; vertical-align: super; font-weight: 500; margin-left: 2px; }
  .slab__body { position: relative; z-index: 2; display: grid; gap: 6px; margin-top: 24px; max-width: 50%; }
  @media (max-width: 1100px) { .slab__body { max-width: 70%; } }
  .slab__body li { display: grid; grid-template-columns: 110px 1fr; gap: 14px; font-size: 13.5px; line-height: 1.5; padding: 7px 0; border-bottom: 1px solid rgba(255,255,255,.14); color: rgba(255,255,255,.95); list-style: none; }
  .slab__body dt { font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.6); font-weight: 600; padding-top: 2px; }
  .slab__body dd { margin: 0; }
  .slab__foot { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.18); }
  .slab__tag { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.7); font-weight: 600; }
  .slab__arr { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #fff; font-weight: 600; }
  .slab__arr .arr { transition: transform 220ms var(--ease); }
  .slab:hover .slab__arr .arr { transform: translateX(5px); }

  /* ---------------- Founders ---------------- */
  .founders { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(18px, 3vw, 40px); }
  @media (max-width: 760px) { .founders { grid-template-columns: 1fr; } }
  .founder { display: grid; grid-template-rows: auto auto; }
  .founder__photo { aspect-ratio: 4/5; background: var(--c-ink-soft); overflow: hidden; position: relative; }
  .founder__photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.15) contrast(1.04); transition: transform 600ms var(--ease), filter 400ms var(--ease); }
  .founder:hover .founder__photo img { transform: scale(1.03); filter: grayscale(0) contrast(1.04); }
  .founder__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(17,21,30,.55)); }
  .founder__caption { position: absolute; left: 26px; bottom: 22px; right: 26px; z-index: 2; color: #fff; }
  .founder__caption .name { font-family: var(--ff-tight); font-size: clamp(1.6rem, 2.4vw, 2.2rem); font-weight: 600; letter-spacing: -0.02em; line-height: 1; }
  .founder__caption .role { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: rgba(255,255,255,.75); margin-top: 8px; }
  .founder__meta { display: grid; grid-template-columns: 1fr auto; gap: 16px; padding: 20px 4px 0; align-items: end; }
  .founder__bio { color: var(--c-ink-soft); font-size: 15px; line-height: 1.6; max-width: 38ch; margin: 0; }
  .s--dark .founder__bio { color: rgba(255,255,255,.7); }
  .founder__contact { display: grid; gap: 4px; font-size: 12px; letter-spacing: .04em; text-align: right; }
  .founder__contact a { border-bottom: 1px solid var(--c-bronze); padding-bottom: 1px; }
  .s--dark .founder__contact a { color: rgba(255,255,255,.9); }

  /* ---------------- Team (smaller) ---------------- */
  .team__divider { margin: clamp(60px, 8vw, 100px) 0 clamp(28px, 3vw, 44px); display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; }
  .team__divider .ln { height: 1px; background: rgba(17,21,30,.18); }
  .team__divider h3 { font-family: var(--ff-tight); font-weight: 500; letter-spacing: -0.01em; font-size: clamp(1.2rem, 1.6vw, 1.5rem); margin: 0; }
  .team__divider .micro { font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--c-ink-soft); font-weight: 600; }
  .team { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(18px, 2vw, 28px); }
  @media (max-width: 1100px) { .team { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 780px)  { .team { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 460px)  { .team { grid-template-columns: 1fr; } }
  .team__card { display: grid; grid-template-rows: auto auto; }
  .team__photo { aspect-ratio: 3/4; background: var(--c-ink-soft); overflow: hidden; position: relative; }
  .team__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; filter: grayscale(.2) contrast(1.04); transition: transform 600ms var(--ease), filter 400ms var(--ease); }
  .team__card:hover .team__photo img { transform: scale(1.03); filter: grayscale(0) contrast(1.04); }
  .team__body { padding: 18px 2px 0; }
  .team__name { font-family: var(--ff-tight); font-size: 1.25rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.1; color: var(--c-ink); }
  .team__title { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: var(--c-bronze); margin-top: 8px; }
  .team__bio { color: var(--c-ink-soft); font-size: 14px; line-height: 1.55; margin: 12px 0 14px; }
  .team__contact { display: grid; gap: 4px; font-size: 12px; letter-spacing: .02em; padding-top: 12px; border-top: 1px solid rgba(17,21,30,.1); }
  .team__contact a { color: var(--c-ink); border-bottom: 1px solid var(--c-bronze); padding-bottom: 1px; justify-self: start; }
  .team__contact .tel { color: var(--c-ink-soft); }

  /* ---------------- References ---------------- */
  .ref-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 2vw, 28px); }
  @media (max-width: 1100px) { .ref-grid { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 760px) { .ref-grid { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 480px) { .ref-grid { grid-template-columns: 1fr; } }
  .ref { display: flex; flex-direction: column; gap: 14px; cursor: pointer; text-decoration: none; }
  .ref__img { aspect-ratio: 4/3; position: relative; overflow: hidden; background: #11151e; }
  .ref__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity 520ms var(--ease), transform 900ms var(--ease); will-change: opacity, transform; }
  .ref__img-a { opacity: 1; z-index: 1; }
  .ref__img-b { opacity: 0; z-index: 2; transform: scale(1.04); }
  .ref__img-fallback { position: absolute; inset: 0; }
  .ref:hover .ref__img-a { opacity: 0; transform: scale(1.03); }
  .ref:hover .ref__img-b { opacity: 1; transform: scale(1); }
  .ref::after { content: ''; }
  .ref h4 { font-family: var(--ff-tight); font-size: 1.05rem; font-weight: 600; letter-spacing: -0.005em; color: var(--c-ink); margin: 0; line-height: 1.3; transition: color 200ms var(--ease); }
  .ref:hover h4 { color: var(--c-bronze); }
  .s--dark .ref h4 { color: #fff; }
  .s--dark .ref:hover h4 { color: var(--c-bronze); }

  /* ---------------- Quote band ---------------- */
  .qband { background: var(--c-bronze); color: #fff; padding: clamp(60px, 8vw, 110px) 0; }
  .qband__row { display: grid; grid-template-columns: 1.3fr 1fr; gap: 60px; align-items: end; }
  @media (max-width: 760px) { .qband__row { grid-template-columns: 1fr; } }
  .qband blockquote { font-family: var(--ff-tight); font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.2; font-weight: 500; letter-spacing: -0.015em; color: #fff; margin: 0; max-width: 22ch; }
  .qband__attr { font-size: 12px; letter-spacing: .22em; text-transform: uppercase; opacity: .85; font-weight: 600; }
  .qband__attr span { display: block; font-family: var(--ff-tight); font-size: 17px; letter-spacing: -0.005em; text-transform: none; font-weight: 600; margin-bottom: 6px; opacity: 1; }

  /* ---------------- Contact ---------------- */
  .contact { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(28px, 5vw, 80px); }
  @media (max-width: 900px) { .contact { grid-template-columns: 1fr; } }
  .form { display: grid; gap: 26px; }
  .field { display: flex; flex-direction: column; gap: 8px; }
  .field label { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.6); font-weight: 600; }
  .field input, .field textarea { background: transparent; border: 0; border-bottom: 1px solid rgba(255,255,255,.3); padding: 10px 0 12px; font-family: var(--ff); font-size: 15.5px; color: #fff; outline: none; }
  .field input:focus, .field textarea:focus { border-bottom-color: var(--c-bronze); border-bottom-width: 2px; padding-bottom: 11px; }
  .field input::placeholder, .field textarea::placeholder { color: rgba(255,255,255,.4); }
  .field--row { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
  @media (max-width: 560px) { .field--row { grid-template-columns: 1fr; } }
  .form__foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
  .form__note { font-size: 12px; color: rgba(255,255,255,.55); letter-spacing: .04em; }
  .contact-side { padding-left: clamp(0px, 4vw, 50px); border-left: 1px solid rgba(255,255,255,.14); display: grid; gap: 36px; align-content: start; }
  @media (max-width: 900px) { .contact-side { border-left: 0; padding-left: 0; border-top: 1px solid rgba(255,255,255,.14); padding-top: 40px; } }
  .contact-side__row h4 { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.55); font-weight: 600; margin: 0 0 12px; font-family: var(--ff); }
  .contact-side__row p, .contact-side__row a { font-family: var(--ff-tight); font-size: 19px; color: #fff; margin: 0; font-weight: 500; line-height: 1.4; letter-spacing: -0.01em; }
  .contact-side__row a { border-bottom: 1px solid var(--c-bronze); padding-bottom: 1px; display: inline-block; }
  .contact-side__row a:hover { border-bottom-color: #fff; }

  /* ---------------- Footer ---------------- */
  footer { background: #0A0D14; color: rgba(255,255,255,.6); padding: 80px 0 32px; font-size: 13px; }
  .ftr { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 48px; padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,.1); }
  @media (max-width: 760px) { .ftr { grid-template-columns: 1fr 1fr; gap: 32px; } }
  .ftr__logo img { height: 34px; opacity: .95; }
  .ftr__col h5 { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.45); font-weight: 600; margin: 0 0 18px; }
  .ftr__col a { color: rgba(255,255,255,.85); display: block; padding: 5px 0; font-weight: 400; }
  .ftr__col a:hover { color: var(--c-bronze); }
  .ftr__bottom { display: flex; justify-content: space-between; padding-top: 28px; font-size: 12px; flex-wrap: wrap; gap: 12px; color: rgba(255,255,255,.5); letter-spacing: .04em; }
  .ftr__bottom a { color: inherit; }

  @media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }


/* WordPress alignfull/wide tweaks so sections fill viewport */
.wp-block-group.is-style-rr-section,
.wp-block-group.is-style-rr-section-dark,
.wp-block-group.is-style-rr-section-ivory {
  padding-block: clamp(80px, 11vw, 140px);
}
.wp-block-group.is-style-rr-section-dark { background: var(--c-ink); color: #fff; }
.wp-block-group.is-style-rr-section-dark :where(h1,h2,h3,h4) { color: #fff; }
.wp-block-group.is-style-rr-section-ivory { background: var(--c-ivory); }

/* Ensure default WP wrapper width aligns with theme.json container */
.wp-site-blocks > * { max-width: 100%; }

/* Fix WP nav block to look like our header nav */
header .wp-block-navigation { display: flex; gap: clamp(20px, 4vw, 56px); }
header .wp-block-navigation a { font-size: 12px !important; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; }

/* Hero slide rotation (WP version replaces the original React state) */
.hero__panel { position: relative; }
.hero__panel-top { margin-bottom: 16px; }
.hero__slide { display: none; flex-direction: column; flex: 1; justify-content: flex-end; position: relative; }
.hero__slide.is-active { display: flex; }
.hero__slide .hero__panel-bignum { position: absolute; right: -40px; bottom: -100px; font-family: var(--ff-tight); font-size: clamp(280px, 32vw, 460px); font-weight: 700; line-height: .8; color: rgba(255,255,255,.10); letter-spacing: -0.05em; pointer-events: none; user-select: none; z-index: 0; }
.hero__panel .hero__panel-h2 { color: #fff; font-size: clamp(2.4rem, 4.5vw, 4rem); font-weight: 600; letter-spacing: -0.025em; line-height: 1; margin: 0 0 18px; position: relative; z-index: 1; font-family: var(--ff-tight); }
.hero__panel .hero__panel-h2 sup { font-size: .5em; vertical-align: super; font-weight: 500; margin-left: 2px; }

/* ============================================================
 * Gutenberg compatibility layer
 * Original CSS targeted plain <img>, <article>, <a> etc.
 * WP wraps these in <figure class="wp-block-image"> and
 * <div class="wp-block-group">, so we extend the selectors here.
 * ============================================================ */

/* Reset Gutenberg's default block-level margins inside our sections so the
   ported layout still works. */
.rr-references .wp-block-group,
.rr-founders .wp-block-group,
.rr-hero .wp-block-group,
.rr-ankauf .wp-block-group,
.rr-intro .wp-block-group,
.rr-contact .wp-block-group { margin: 0; }

/* ---------------- References ---------------- */
.rr-references .ref-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: clamp(24px, 2.4vw, 36px); }
.rr-references .ref { display: block; position: relative; cursor: pointer; text-decoration: none; color: inherit; }
.rr-references .ref__img { position: relative; aspect-ratio: 4/3; overflow: hidden; background: #ddd; margin: 0; }
.rr-references .ref__img .wp-block-image,
.rr-references .ref__img-a,
.rr-references .ref__img-b { position: absolute !important; inset: 0; margin: 0 !important; width: 100%; height: 100%; }
.rr-references .ref__img figure { margin: 0 !important; }
.rr-references .ref__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity 420ms var(--ease), transform 600ms var(--ease); }
.rr-references .ref__img-b img { opacity: 0; }
.rr-references .ref:hover .ref__img-a img { opacity: 0; }
.rr-references .ref:hover .ref__img-b img { opacity: 1; transform: scale(1.03); }
.rr-references .ref__title { margin: 16px 0 0; font-family: var(--ff-tight); font-size: 15px; font-weight: 500; letter-spacing: -0.005em; color: var(--c-ink); }

/* ---------------- Founders / Team ---------------- */
.rr-founders .team { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: clamp(28px, 3vw, 48px); }
.rr-founders .team__card { display: flex; flex-direction: column; }
.rr-founders .team__photo { margin: 0; aspect-ratio: 4/5; overflow: hidden; background: var(--c-paper); }
.rr-founders .team__photo img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(15%); transition: filter 360ms var(--ease); }
.rr-founders .team__card:hover .team__photo img { filter: grayscale(0); }
.rr-founders .team__body { padding-top: 18px; }
.rr-founders .team__name { font-family: var(--ff-tight); font-size: 1.25rem; font-weight: 600; letter-spacing: -0.01em; margin: 0 0 4px; color: var(--c-ink); }
.rr-founders .team__title { font-size: 13px; letter-spacing: .04em; color: var(--c-muted); margin: 0 0 12px; }
.rr-founders .team__bio { font-size: 14.5px; line-height: 1.5; color: var(--c-ink-soft); max-width: 36ch; margin: 0 0 14px; }
.rr-founders .team__email { font-size: 13px; margin: 0 0 4px; }
.rr-founders .team__email a { border-bottom: 1px solid var(--c-bronze); padding-bottom: 1px; }
.rr-founders .team__tel { font-size: 13px; color: var(--c-muted); margin: 0; }

/* ---------------- Hero panel ---------------- */
.rr-hero .hero__panel-thumb { margin: 22px 0 0; }
.rr-hero .hero__panel-thumb figure,
.rr-hero .hero__panel-thumb { width: 100%; max-width: 320px; }
.rr-hero .hero__panel-thumb img { display: block; width: 100%; height: 200px; object-fit: cover; box-shadow: 0 14px 32px rgba(0,0,0,.35); border: 3px solid rgba(255,255,255,.92); }
.rr-hero .hero__h1 { font-family: var(--ff-tight); }
.rr-hero .hero__h1 em { font-style: italic; font-weight: 400; color: var(--c-bronze); }

/* Ensure section anchors don't get hidden under fixed header */
section[id] { scroll-margin-top: 80px; }

/* Ankauf slabs adjustments for new structure */
.rr-ankauf .ankauf { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: clamp(20px, 2vw, 28px); }
.rr-ankauf .slab { position: relative; padding: 32px 28px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.1); overflow: hidden; }
.rr-ankauf .slab__num { position: absolute; right: -10px; bottom: -50px; font-family: var(--ff-tight); font-size: 220px; font-weight: 700; line-height: .8; color: rgba(255,255,255,.05); pointer-events: none; }
.rr-ankauf .slab__cat { font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--c-bronze); margin: 0 0 8px; font-weight: 600; }
.rr-ankauf .slab__title { color: #fff; font-size: 1.8rem; margin: 0 0 24px; }
.rr-ankauf .slab__title sup { font-size: .45em; vertical-align: super; font-weight: 500; margin-left: 2px; color: var(--c-bronze); }
.rr-ankauf .slab__body { list-style: none; padding: 0; margin: 0 0 24px; }
.rr-ankauf .slab__body li { font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.78); padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.rr-ankauf .slab__body li strong { color: rgba(255,255,255,.5); font-weight: 600; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; display: block; margin-bottom: 4px; }
.rr-ankauf .slab__tag { font-size: 12px; letter-spacing: .04em; color: rgba(255,255,255,.65); margin: 0; max-width: 22ch; }
.rr-ankauf .slab__arr { margin: 0; }
.rr-ankauf .slab__arr a { color: var(--c-bronze); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; }

/* Intro stats */
.rr-intro .intro__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; padding-top: 32px; margin-top: 32px; border-top: 1px solid var(--c-line); }
.rr-intro .intro__stats .stat { margin: 0; }
.rr-intro .intro__stats .n { font-family: var(--ff-tight); font-size: 2.4rem; font-weight: 600; color: var(--c-ink); margin: 0; line-height: 1; letter-spacing: -0.02em; }
.rr-intro .intro__stats .n sup { font-size: .4em; vertical-align: super; color: var(--c-bronze); font-weight: 500; margin-left: 2px; }
.rr-intro .intro__stats .l { font-size: 12px; letter-spacing: .04em; color: var(--c-muted); margin: 8px 0 0; }

/* Quote band */
.rr-quoteband .qband__quote { border: 0; padding: 0; margin: 0; }
.rr-quoteband .qband__quote p { font-family: var(--ff-tight); font-size: clamp(1.4rem, 2.4vw, 2.2rem); font-weight: 500; letter-spacing: -0.01em; line-height: 1.25; color: #fff; max-width: 60ch; }
.rr-quoteband .qband__quote cite { display: block; margin-top: 18px; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: rgba(255,255,255,.85); font-style: normal; }

/* Contact column tweaks for Gutenberg columns block */
.rr-contact .contact { gap: clamp(28px, 4vw, 64px); margin-top: clamp(32px, 4vw, 48px); }
.rr-contact .contact-side__row h4 { color: rgba(255,255,255,.55); font-size: 11px; letter-spacing: .22em; text-transform: uppercase; margin: 0 0 8px; font-weight: 600; }
.rr-contact .contact-side__row p,
.rr-contact .contact-side__row a { color: #fff; font-family: var(--ff-tight); font-size: 18px; font-weight: 500; }
.rr-contact .contact-side__row a { border-bottom: 1px solid var(--c-bronze); }

/* Section head */
.section__head { margin: clamp(32px, 4vw, 56px) 0 clamp(40px, 5vw, 72px); }
.section__head h2 { max-width: 18ch; }
.section__head .lead { max-width: 62ch; font-size: clamp(1.05rem, 1.4vw, 1.2rem); color: var(--c-muted); margin-top: 16px; }
.s--dark .section__head .lead { color: rgba(255,255,255,.7); }

/* Marker */
.marker { display: inline-flex; gap: 14px; align-items: center; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; font-weight: 600; color: var(--c-bronze); margin-bottom: 12px; }
.marker .l { color: var(--c-muted); }
.s--dark .marker .l { color: rgba(255,255,255,.6); }

/* ============================================================
 * Section flush stacking — kill all default Gutenberg
 * layout gaps between top-level sections AND between
 * <main> and <footer>. Each section already has its own
 * background colour + padding, so they must touch edge to edge.
 * ============================================================ */

html, body { margin: 0; padding: 0; }

.wp-site-blocks {
  margin: 0 !important;
  padding: 0 !important;
  --wp--style--root--padding-top: 0;
  --wp--style--root--padding-bottom: 0;
  --wp--style--root--padding-left: 0;
  --wp--style--root--padding-right: 0;
  --wp--style--block-gap: 0;
}

/* WP injects margin-block-start on the second+ children of every
   flow/constrained layout. We strip that ONLY at the root level so
   sections meet, but inner block-gaps (inside a section) keep working. */
.wp-site-blocks > * + *,
.wp-site-blocks > main.wp-block-group > * + * {
  margin-block-start: 0 !important;
}

.wp-site-blocks > main.wp-block-group {
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
}

/* Sections themselves must not have their own outer margin */
.wp-site-blocks main > .wp-block-group {
  margin-block: 0 !important;
}

/* ============================================================
 * Header — works on Gutenberg's <wp-block-navigation> markup,
 * not just the original .nav class. Header is fixed and
 * transparent over the hero; becomes paper-coloured when scrolled.
 * ============================================================ */

header.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  margin: 0 !important; padding: 0 !important;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background 300ms var(--ease), border-color 300ms var(--ease);
}
header.site-header.is-scrolled {
  background: rgba(244, 242, 238, .94);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom-color: var(--c-line);
}

/* Force the header to have the full-width grid layout regardless of WP wrapper.
   `!important` is unfortunately required because Gutenberg injects per-block
   `.wp-container-XYZ { display: flex }` inline styles that otherwise win. */
header.site-header > .wp-block-group { max-width: 100% !important; padding-inline: var(--gutter) !important; margin: 0 !important; }
header.site-header .hdr {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  padding: 18px 0 !important;
  gap: 24px !important;
  max-width: var(--container);
  margin: 0 auto !important;
}

/* Site-logo block inside header */
header.site-header .wp-block-site-logo { justify-self: start; margin: 0 !important; }
header.site-header .wp-block-site-logo a,
header.site-header .wp-block-site-logo img { display: block; }
header.site-header .wp-block-site-logo img { height: 38px; width: auto; max-width: none; }

/* Navigation block inside header — replace the old .nav selectors.
   The nav container itself is flex with default wrap; force nowrap so the
   5 menu items stay on a single line. */
header.site-header .wp-block-navigation { justify-self: center; margin: 0 !important; }
header.site-header .wp-block-navigation,
header.site-header .wp-block-navigation > ul,
header.site-header .wp-block-navigation .wp-block-navigation__container {
  flex-wrap: nowrap !important;
  gap: clamp(20px, 4vw, 56px) !important;
}
header.site-header .wp-block-navigation a,
header.site-header .wp-block-navigation .wp-block-navigation-item__content {
  font-size: 12px !important;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--c-ink);
  transition: color 220ms var(--ease);
}
header.site-header .wp-block-buttons { justify-self: end; margin: 0 !important; }
header.site-header .wp-block-button__link {
  background: transparent !important;
  color: var(--c-ink) !important;
  border: 1px solid var(--c-ink) !important;
  border-radius: 0 !important;
  padding: 10px 18px !important;
  font-size: 11px !important;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-weight: 600;
  transition: all 220ms var(--ease);
}
header.site-header .wp-block-button__link:hover {
  background: var(--c-ink) !important;
  color: #fff !important;
}

/* While the hero is visible (body.hero-mode) and the header has NOT
   yet scrolled, invert the text/logo to white so it stays readable
   against the dark hero gradient. */
.hero-mode header.site-header:not(.is-scrolled) .wp-block-navigation a,
.hero-mode header.site-header:not(.is-scrolled) .wp-block-navigation .wp-block-navigation-item__content {
  color: #fff !important;
}
.hero-mode header.site-header:not(.is-scrolled) .wp-block-button__link {
  color: #fff !important;
  border-color: rgba(255,255,255,.4) !important;
}
.hero-mode header.site-header:not(.is-scrolled) .wp-block-button__link:hover {
  background: #fff !important;
  color: var(--c-ink) !important;
  border-color: #fff !important;
}
.hero-mode header.site-header:not(.is-scrolled) .wp-block-site-logo img {
  /* Logo darkened to fit dark backdrop. Tweak / remove if the customer
     uploads a logo already designed for dark backgrounds. */
  filter: brightness(0) invert(1);
}

@media (max-width: 980px) {
  header.site-header .wp-block-navigation { display: none; }
  header.site-header .hdr { grid-template-columns: auto 1fr; }
}

/* ============================================================
 * Footer — site-footer wraps the footer template-part.
 * The site-logo block replaces the original .ftr__logo img.
 * ============================================================ */
footer.site-footer { margin: 0 !important; }
footer.site-footer .wp-block-site-logo img { height: 34px; opacity: .95; width: auto; }
footer.site-footer .ftr__col h5 { color: rgba(255,255,255,.45); }
footer.site-footer .ftr__col p { margin: 0; }
footer.site-footer .ftr__col a { color: rgba(255,255,255,.85); display: inline-block; padding: 4px 0; }
footer.site-footer .ftr__col a:hover { color: var(--c-bronze); }
footer.site-footer .ftr__bottom { font-size: 12px; color: rgba(255,255,255,.5); letter-spacing: .04em; padding-top: 28px; }
footer.site-footer .ftr__bottom p { margin: 0; }

/* ============================================================
 * Visual-bug fixes (round 2) — overrides for the ported original
 * CSS that fought with the new Gutenberg markup.
 * ============================================================ */

/* The original .slab__body li used a 110px+1fr grid for <dt>/<dd>.
   Our new markup uses <li><strong>label</strong> value</li>, which
   gets squashed in that 2-col grid. Force vertical stacking. */
.rr-ankauf .slab__body { display: block !important; max-width: 100% !important; }
.rr-ankauf .slab__body li {
  display: block !important;
  grid-template-columns: none !important;
  padding: 10px 0 !important;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 0 !important;
}
.rr-ankauf .slab__body li:first-child { border-top: 0 !important; }
.rr-ankauf .slab__body li strong {
  display: block !important;
  font-size: 10.5px !important;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55) !important;
  font-weight: 600;
  margin-bottom: 4px;
}

/* section__head: original used a side-by-side 2-col grid that puts the
   h2 BELOW the lead visually (align-items: end on different heights).
   Stack them simply: heading first, lead under it. */
.rr-references .section__head,
.rr-ankauf .section__head,
.rr-founders .section__head,
.rr-contact .section__head,
.rr-intro .section__head {
  display: block !important;
  grid-template-columns: none !important;
  align-items: initial !important;
  gap: 0 !important;
  margin: clamp(28px, 4vw, 56px) 0 clamp(40px, 5vw, 72px) !important;
  max-width: 100% !important;
}
.rr-references .section__head > h2,
.rr-ankauf .section__head > h2,
.rr-founders .section__head > h2,
.rr-contact .section__head > h2,
.rr-intro .section__head > h2 {
  max-width: 22ch !important;
  margin: 0 0 18px !important;
}
.rr-references .section__head .lead,
.rr-ankauf .section__head .lead,
.rr-founders .section__head .lead,
.rr-contact .section__head .lead,
.rr-intro .section__head .lead {
  max-width: 68ch !important;
  margin: 0 !important;
  color: var(--c-muted);
}
.s--dark .section__head .lead,
.rr-ankauf .section__head .lead,
.rr-contact .section__head .lead { color: rgba(255,255,255,.72) !important; }

/* Hero buttons — original used .btn / .btn--bronze / .btn--ghost-light on
   <a>. Now they're inside wp:button which renders <a class="wp-block-button__link">.
   Style THAT element. */
.rr-hero .wp-block-buttons { gap: 14px; margin-top: 28px; }
.rr-hero .wp-block-button .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 24px !important;
  font-size: 12px !important;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-weight: 600;
  border: 1px solid var(--c-bronze) !important;
  border-radius: 0 !important;
  background: var(--c-bronze) !important;
  color: #fff !important;
  transition: all 220ms var(--ease);
}
.rr-hero .wp-block-button .wp-block-button__link:hover {
  background: var(--c-bronze-dk) !important;
  border-color: var(--c-bronze-dk) !important;
}
.rr-hero .btn--ghost-light .wp-block-button__link,
.rr-hero .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  border-color: rgba(255,255,255,.4) !important;
  color: #fff !important;
}
.rr-hero .btn--ghost-light .wp-block-button__link:hover,
.rr-hero .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: rgba(255,255,255,.08) !important;
  border-color: #fff !important;
}

/* Hero h1 styling override — keep the "Norddeutschland" in bronze italic */
.rr-hero .hero__h1 em { font-style: italic; font-weight: 500; color: var(--c-bronze); }

/* Quote band — make sure padding and background look like the original */
.rr-quoteband { color: #fff; }
.rr-quoteband .container { max-width: var(--container); margin: 0 auto; padding-inline: var(--gutter); }
.rr-quoteband .qband__row {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: clamp(28px, 4vw, 80px);
  align-items: center;
}
.rr-quoteband .qband__quote-text {
  font-family: var(--ff-tight);
  font-size: clamp(1.4rem, 2.4vw, 2.2rem);
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.25;
  color: #fff;
  margin: 0;
  max-width: 28ch;
}
.rr-quoteband .qband__attr {
  font-size: 12px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 600;
  color: rgba(255,255,255,.85);
  margin: 0;
}
.rr-quoteband .qband__attr-eyebrow {
  display: block;
  color: rgba(255,255,255,.5);
  margin-bottom: 6px;
  font-weight: 500;
}
@media (max-width: 800px) {
  .rr-quoteband .qband__row { grid-template-columns: 1fr; }
}


/* ============================================================
 * Round-3 fixes — for the "alles kaputt" symptom set:
 *   - Hero showing on light bg (hero__bg not filling)
 *   - Logo broken (WP 6.5+ site-logo block ignores get_custom_logo
 *     filter when no custom_logo theme_mod is set)
 *   - Sections constrained to theme.json contentSize 760px,
 *     causing text to wrap word-by-word
 * ============================================================ */

/* Re-assert .hero box so .hero__bg can fill it. WP may have stripped
   positioning via reset rules elsewhere. */
section.rr-hero {
  position: relative !important;
  min-height: 100vh !important;
  height: auto !important;
  overflow: hidden;
  color: #fff;
  isolation: isolate;
}
section.rr-hero .hero__bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0;
  background: linear-gradient(180deg, #14171F 0%, #1F2A3A 40%, #3A4D5E 75%, #5A6F7E 100%);
  pointer-events: none;
}
section.rr-hero .hero__bg::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 25% 70%, rgba(167,133,84,.18), transparent 60%),
    radial-gradient(ellipse at 80% 30%, rgba(86,94,115,.4), transparent 55%);
}
section.rr-hero > .container,
section.rr-hero .hero__inner {
  position: relative;
  z-index: 2;
  padding-top: 120px;
  padding-bottom: 60px;
}
section.rr-hero .hero__top {
  display: grid !important;
  grid-template-columns: 1.1fr 1fr !important;
  gap: clamp(40px, 6vw, 100px) !important;
  align-items: center;
}
@media (max-width: 980px) {
  section.rr-hero .hero__top { grid-template-columns: 1fr !important; }
}
section.rr-hero .hero__h1 {
  font-size: clamp(2.6rem, 6vw, 5.2rem) !important;
  line-height: 1.02 !important;
  font-weight: 600 !important;
  color: #fff !important;
  margin: 0 0 24px !important;
  max-width: 14ch;
}
section.rr-hero .hero__lead {
  color: rgba(255,255,255,.85) !important;
  font-size: clamp(1rem, 1.2vw, 1.15rem);
  line-height: 1.55;
  max-width: 42ch;
  margin: 0 0 32px;
}
section.rr-hero .hero__eyebrow { color: var(--c-bronze) !important; margin-bottom: 20px; }

/* Logo image block in header — replaces wp:site-logo (which WP 6.5+
   would not render with a get_custom_logo fallback). */
header.site-header .hdr__logo { margin: 0 !important; justify-self: start; }
header.site-header .hdr__logo img,
header.site-header .hdr__logo a { display: block; }
header.site-header .hdr__logo img { height: 38px !important; width: auto !important; max-width: none !important; object-fit: contain; }
.hero-mode header.site-header:not(.is-scrolled) .hdr__logo img { filter: brightness(0) invert(1); }

footer.site-footer .ftr__logo { margin: 0 0 20px !important; }
footer.site-footer .ftr__logo img { height: 34px !important; width: auto !important; max-width: none !important; opacity: .95; }

/* Intro columns — make sure both halves are wide and stop word-wrapping */
section.rr-intro .intro__grid {
  gap: clamp(40px, 5vw, 80px);
}
section.rr-intro .intro__big {
  max-width: 100% !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

/* Container max-width override — bullet-proof against WP layout injections. */
.container { max-width: var(--container) !important; margin-left: auto !important; margin-right: auto !important; padding-inline: var(--gutter) !important; }