/* ==========================================================================
   APOTHEKE VERSAND - CONTACT PAGE STYLES (350px Banner Edition)
   ========================================================================== */

/* Hero Banner Section - Exactly 350px Height */
.ap-contact-hero {
  height: 350px;
  background: linear-gradient(180deg, rgba(11, 25, 44, 0.9) 0%, rgba(30, 62, 98, 0.95) 100%), url('../images/hero_bg_1.png');
  background-size: cover;
  background-position: center;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}

/* Breadcrumb Styling */
.ap-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 6px 16px;
  border-radius: var(--ap-radius-pill);
  font-size: 0.85rem;
  font-weight: 600;
  color: #93C5FD;
  margin-bottom: 16px;
}
.ap-breadcrumb a {
  color: #FFFFFF;
}
.ap-breadcrumb a:hover {
  color: #38BDF8;
}

/* Contact Info Cards */
.ap-contact-info-card {
  background: #FFFFFF;
  border-radius: var(--ap-radius-md);
  border: 1px solid var(--ap-border);
  padding: 24px;
  box-shadow: var(--ap-shadow-sm);
  display: flex;
  align-items: flex-start;
  gap: 16px;
  height: 100%;
  transition: var(--ap-transition);
}
.ap-contact-info-card:hover {
  border-color: var(--ap-blue-accent);
  box-shadow: var(--ap-shadow-md);
  transform: translateY(-2px);
}

/* Contact Form Card */
.ap-contact-form-card {
  background: #FFFFFF;
  border-radius: var(--ap-radius-lg);
  border: 1px solid var(--ap-border);
  padding: 40px;
  box-shadow: var(--ap-shadow-md);
}

@media (max-width: 768px) {
  .ap-contact-hero {
    height: 300px;
  }
  .ap-contact-form-card {
    padding: 24px;
  }
}