/* ============================================================
   BDL Onlinejahresbericht 2026 — Site Theme v2
   Bootstrap Package 16 Override
   fiveandfriends GmbH © 2026
   ============================================================ */

:root {
  --bdl-blue:       #1C4F9B;
  --bdl-blue-dark:  #133770;
  --bdl-blue-light: #4A80C8;
  --bdl-blue-pale:  #e5edf8;
  --bdl-gray:       #444444;
  --bdl-gray-mid:   #888888;
  --bdl-gray-light: #f5f5f5;
  --bdl-white:      #ffffff;

  --bs-primary:          #1C4F9B;
  --bs-primary-rgb:      28, 79, 155;
  --bs-btn-bg:           #1C4F9B;
  --bs-btn-border-color: #1C4F9B;
  --bs-btn-hover-bg:     #133770;
  --bs-link-color:       #1C4F9B;
  --bs-link-hover-color: #133770;
}

/* ========================
   ANNOUNCEMENT BAR
   ======================== */
body::before {
  content: "Leasing-Report 2026";
  display: block;
  background: var(--bdl-blue);
  color: var(--bdl-white);
  font-family: 'Roboto', sans-serif;
  font-size: 12px;
  font-weight: 400;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  padding: 7px 0;
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 10000;
}

body {
  padding-top: 36px;
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.65;
  color: var(--bdl-gray);
}

/* ========================
   NAVIGATION
   ======================== */
.bp-page-header.navbar-mainnavigation {
  background-color: var(--bdl-white) !important;
  border-bottom: 1px solid #e8e8e8;
  box-shadow: 0 1px 6px rgba(0,0,0,0.06);
  padding-top: 0;
  padding-bottom: 0;
}

.navbar-mainnavigation .nav-link,
.navbar-mainnavigation .nav-link-main {
  color: var(--bdl-gray) !important;
  font-family: 'Open Sans', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  padding: 24px 14px !important;
  transition: color 0.2s;
  text-decoration: none;
}

.navbar-mainnavigation .nav-link:hover,
.navbar-mainnavigation .nav-link-main:hover {
  color: var(--bdl-blue) !important;
}

.navbar-mainnavigation .dropdown-menu {
  border-top: 3px solid var(--bdl-blue);
  border-radius: 0;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.navbar-mainnavigation .nav-item:last-child .nav-link-main {
  background: var(--bdl-blue);
  color: var(--bdl-white) !important;
  border-radius: 4px;
  margin: 14px 0 14px 10px;
  padding: 9px 14px !important;
  font-size: 13px;
}

.navbar-mainnavigation .nav-item:last-child .nav-link-main:hover {
  background: var(--bdl-blue-dark);
}

.container-mainnavigation {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.navbar-brand { order: 2; margin-right: 0; margin-left: 1rem; }
.navbar-collapse { order: 1; flex-grow: 0 !important; }
.navbar-brand img { max-height: 48px; width: auto; }
.navbar-toggler { border-color: var(--bdl-blue); order: 3; }
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%231C4F9B' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ========================
   HERO / ERSTE SEKTION
   ======================== */
.section-default:first-of-type {
  background: linear-gradient(135deg, #eef3fb 0%, #f7f9fd 60%, #fff 100%);
  border-bottom: 1px solid var(--bdl-blue-pale);
  padding-bottom: 0;
}

.frame-type-header.frame-space-before-none { padding: 60px 0 20px; }

.frame-type-header h1 {
  font-size: clamp(26px, 4vw, 42px);
  font-weight: 400;
  color: var(--bdl-blue);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1.3;
  max-width: 800px;
}

/* ========================
   BUTTONS
   ======================== */
.btn-primary {
  background-color: var(--bdl-blue) !important;
  border-color: var(--bdl-blue) !important;
  color: #fff !important;
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 22px;
  border-radius: 3px;
  text-decoration: none;
}
.btn-primary:hover {
  background-color: var(--bdl-blue-dark) !important;
  border-color: var(--bdl-blue-dark) !important;
}
.btn-outline-secondary {
  border-color: var(--bdl-blue) !important;
  color: var(--bdl-blue) !important;
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 22px;
  border-radius: 3px;
  text-decoration: none;
}
.btn-outline-secondary:hover {
  background-color: var(--bdl-blue) !important;
  color: #fff !important;
}

/* ========================
   TYPOGRAFIE
   ======================== */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Roboto', sans-serif;
  color: var(--bdl-blue);
}
h2 { font-size: 24px; font-weight: 400; line-height: 1.5; }
h3 { font-size: 16px; font-weight: 600; font-family: 'Open Sans', sans-serif; color: var(--bdl-gray); }
a { color: var(--bdl-blue); }
a:hover { color: var(--bdl-blue-dark); }

/* ========================
   KPI-KARTEN
   ======================== */
.bdl-stat-card {
  background: var(--bdl-white);
  border-radius: 4px;
  padding: 2rem 1.5rem;
  text-align: center;
  box-shadow: 0 2px 16px rgba(28,79,155,0.08);
  border-top: 3px solid var(--bdl-blue-light);
  transition: transform 0.3s, box-shadow 0.3s;
  height: 100%;
}
.bdl-stat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(28,79,155,0.15);
}
.bdl-stat-number {
  font-family: 'Roboto', sans-serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: var(--bdl-blue);
  display: inline;
  line-height: 1;
}
.bdl-stat-suffix {
  font-family: 'Roboto', sans-serif;
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--bdl-blue-light);
}
.bdl-stat-label {
  display: block;
  font-size: 0.75rem;
  color: var(--bdl-gray-mid);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 0.7rem;
  font-family: 'Open Sans', sans-serif;
}

/* ========================
   CONTENT FRAMES
   ======================== */
.frame-space-before-small  { padding-top: 2rem; }
.frame-space-before-medium { padding-top: 3.5rem; }
.frame-space-before-large  { padding-top: 5rem; }
.frame-space-after-small   { padding-bottom: 2rem; }
.frame-space-after-medium  { padding-bottom: 3.5rem; }
.frame-space-after-large   { padding-bottom: 5rem; }
.frame-inner { max-width: 820px; }

/* ========================
   BREADCRUMB
   ======================== */
.breadcrumb-section {
  border-bottom: 1px solid var(--bdl-blue-pale);
  background: var(--bdl-white);
}
.breadcrumb { font-size: 13px; margin-bottom: 0; padding: 8px 0; }

/* ========================
   FOOTER
   ======================== */
.bp-page-footer {
  background: var(--bdl-blue-dark);
  color: rgba(255,255,255,0.8);
  margin-top: 3rem;
}
.footer-section-meta { background: #0e2a58; }
.footer-navigation-link,
.footer-meta a,
.footer-language a { color: rgba(255,255,255,0.6) !important; }
.footer-navigation-link:hover,
.footer-meta a:hover { color: rgba(255,255,255,0.9) !important; text-decoration: none; }
.footer-copyright p { font-size: 12px; color: rgba(255,255,255,0.4); }
.scroll-top { background: var(--bdl-blue); border-radius: 50%; }

/* ========================
   RESPONSIVE NAVIGATION
   ======================== */
@media (max-width: 991px) {
  body::before { font-size: 11px; padding: 6px; }
  body { padding-top: 34px; }
  .navbar-brand { order: 1; }
  .navbar-collapse { order: 2; width: 100%; }
  .navbar-toggler { order: 3; }
  .navbar-mainnavigation .nav-link,
  .navbar-mainnavigation .nav-link-main {
    padding: 12px 16px !important;
    color: var(--bdl-blue) !important;
  }
  .frame-type-header.frame-space-before-none { padding: 30px 0 10px; }
}

/* ============================================================
   BRANCHENSTIMMEN — Statement-Karten v2
   Name als Heading oben, Foto links mit Caption,
   Quote rechts, Social-Bar am Ende
   ============================================================ */

.bdl-statement-card {
  background: var(--bdl-white);
  border-radius: 6px;
  padding: 2rem 2rem 1.5rem;
  margin-bottom: 2.5rem;
  box-shadow: 0 2px 20px rgba(28,79,155,0.07);
  transition: box-shadow 0.25s, transform 0.25s;
}

.bdl-statement-card:hover {
  box-shadow: 0 6px 30px rgba(28,79,155,0.13);
  transform: translateY(-2px);
}

/* Name als Heading + Trennlinie */
.bdl-statement-header {
  margin-bottom: 1.5rem;
}

.bdl-person-name {
  font-family: 'Roboto', sans-serif;
  font-size: 1.1rem;
  font-weight: 400;
  color: var(--bdl-blue);
  margin-bottom: 0.6rem;
  letter-spacing: 0.01em;
}

.bdl-statement-divider {
  border: none;
  border-top: 1px solid var(--bdl-blue-pale);
  margin: 0;
}

/* Foto-Spalte links */
.bdl-photo-wrap {
  padding-right: 0.5rem;
}

.bdl-statement-photo {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: top center;
  border-radius: 4px;
  display: block;
}

.bdl-photo-caption {
  margin-top: 0.65rem;
  font-size: 0.78rem;
  line-height: 1.4;
  color: var(--bdl-gray-mid);
}

.bdl-photo-caption strong {
  display: block;
  font-weight: 600;
  color: var(--bdl-gray);
  font-size: 0.82rem;
}

.bdl-photo-caption span {
  display: block;
  font-size: 0.75rem;
}

/* Quote rechts */
.bdl-statement-quote {
  border: none;
  padding: 0;
  margin: 0 0 1.25rem 0;
}

.bdl-statement-quote p {
  font-size: 0.95rem;
  line-height: 1.75;
  color: var(--bdl-gray);
  margin-bottom: 0;
  font-style: italic;
  position: relative;
  padding-left: 1.6rem;
}

.bdl-statement-quote p::before {
  content: '\201C';
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 2.6rem;
  color: var(--bdl-blue-light);
  font-style: normal;
  line-height: 0;
  position: absolute;
  left: 0;
  top: 0.6rem;
  opacity: 0.55;
}

/* Social-Bar */
.bdl-social-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.25rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--bdl-blue-pale);
}

.bdl-social-bar::before {
  content: 'Teilen:';
  font-size: 0.72rem;
  color: var(--bdl-gray-mid);
  font-family: 'Open Sans', sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-right: 0.25rem;
}

.bdl-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--bdl-blue-pale);
  color: var(--bdl-blue) !important;
  transition: background 0.2s, color 0.2s;
  text-decoration: none !important;
  flex-shrink: 0;
}

.bdl-social-link:hover {
  background: var(--bdl-blue);
  color: var(--bdl-white) !important;
}

/* Mobile */
@media (max-width: 575px) {
  .bdl-statement-card { padding: 1.25rem 1rem 1rem; }
  .bdl-statement-quote p { font-size: 0.88rem; }
}

/* ========================
   YP-KARTEN (Nachwuchs)
   ======================== */
.bdl-yp-card {
  background: var(--bdl-gray-light);
  border-top: 3px solid var(--bdl-blue-light);
  border-radius: 6px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  height: 100%;
}
.bdl-yp-photo {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: top center;
  border-radius: 50%;
  margin-bottom: 1rem;
  max-width: 120px;
}