/* medeed-anerkennung-einreise-2026-09-29-r4 */
@font-face {
  font-family: 'Anerkennung Caveat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/Caveat-500.ttf') format('truetype')
}

.ae-page {
  --ae-blue: #087fce;
  --ae-button: #2f70b7;
  --ae-deep: #08295f;
  --ae-ink: #10264d;
  --ae-text: #4c5e78;
  --ae-line: #d6e3ef;
  --ae-soft: #edf7fd;
  --ae-white: #fff;
  color: var(--ae-text);
  font-family: Arial, sans-serif;
  text-align: left
}

.ae-page,
.ae-page *,
.ae-page *::before,
.ae-page *::after {
  box-sizing: border-box
}

.ae-page :is(article, section, div, figure, img, a, button) {
  border-radius: 0 !important
}

.ae-page h1,
.ae-page h2,
.ae-page h3 {
  color: var(--ae-ink);
  font-family: Arial, sans-serif;
  text-transform: none;
  letter-spacing: -.02em;
  overflow-wrap: break-word;
  word-break: normal
}

.ae-page p,
.ae-page li {
  font-size: 15px;
  line-height: 1.62;
  overflow-wrap: break-word
}

.ae-shell {
  width: min(1320px, calc(100% - 48px));
  margin-inline: auto
}

.ae-section {
  padding: 64px 0
}

.ae-section--blue-soft {
  background: #edf7fd
}

.ae-eyebrow {
  display: block;
  margin-bottom: 9px;
  color: var(--ae-blue);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase
}

.ae-heading {
  min-width: 0;
  max-width: 940px;
  margin-bottom: 28px
}

.ae-heading h2 {
  margin: 0 0 9px;
  font-size: clamp(24px, 2.2vw, 32px);
  line-height: 1.15
}

.ae-heading>p:last-child {
  margin-bottom: 0
}

.ae-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px
}

.ae-page .th-btn.medeed-uniform-btn.medeed-button-blue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 11px 21px;
  background: var(--ae-button) !important;
  border: 1px solid var(--ae-button) !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 400 !important;
  line-height: 1.2;
  text-transform: none;
  box-shadow: none
}

.ae-page .th-btn.medeed-uniform-btn.medeed-button-blue::before,
.ae-page .th-btn.medeed-uniform-btn.medeed-button-blue::after {
  display: none !important
}

.ae-page .th-btn.medeed-uniform-btn.medeed-button-blue:hover,
.ae-page .th-btn.medeed-uniform-btn.medeed-button-blue:focus-visible {
  background: #fff !important;
  color: var(--ae-button) !important
}

.ae-page .th-btn.ae-button-outline {
  background: #fff !important;
  color: var(--ae-button) !important
}

.ae-page .th-btn.ae-button-outline:hover,
.ae-page .th-btn.ae-button-outline:focus-visible {
  background: var(--ae-button) !important;
  color: #fff !important
}

.ae-page .ae-actions .th-btn.medeed-uniform-btn.medeed-button-blue {
  width: auto !important;
  max-width: none !important;
  white-space: normal;
  text-align: center
}

.ae-page a:focus-visible {
  outline: 3px solid #f1a51b;
  outline-offset: 3px
}

.ae-hero {
  position: relative;
  min-height: 642px;
  background: #eef5f8;
  overflow: hidden
}

.ae-hero__photo {
  position: absolute;
  inset: 0
}

.ae-hero__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top
}

.ae-hero__photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #eef5f8 0%, rgba(238, 245, 248, .99) 34%, rgba(238, 245, 248, .93) 45%, rgba(238, 245, 248, .52) 57%, rgba(238, 245, 248, 0) 72%)
}

.ae-hero__slogan {
  position: absolute;
  z-index: 2;
  top: 30px;
  right: 34px;
  width: 170px;
  margin: 0;
  color: #164a72;
  font-family: 'Anerkennung Caveat', cursive !important;
  font-size: 31px !important;
  font-weight: 500;
  line-height: 1.02 !important;
  text-align: center;
  transform: rotate(-7deg);
  text-shadow: 0 1px 0 rgba(255, 255, 255, .7)
}

.ae-hero__inner {
  position: relative;
  z-index: 2;
  min-height: 642px;
  display: flex;
  align-items: center
}

.ae-hero__copy {
  width: 54%;
  min-width: 0;
  padding: 46px 30px 126px 0
}

.ae-hero__copy h1 {
  max-width: 690px;
  margin: 0 0 11px;
  font-size: clamp(30px, 3.35vw, 48px);
  line-height: 1.04
}

.ae-hero__copy h2 {
  max-width: 650px;
  margin: 0 0 15px;
  font-size: clamp(19px, 1.7vw, 25px);
  line-height: 1.2
}

.ae-hero__copy p {
  max-width: 680px;
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.55
}

.ae-hero-ribbon {
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(248, 253, 255, .74);
  box-shadow: 0 -12px 34px rgba(7, 45, 91, .07);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px)
}

.ae-trust__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr))
}

.ae-trust__grid>div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 90px;
  padding: 16px 24px
}

.ae-trust__grid i {
  flex: 0 0 36px;
  color: var(--ae-blue);
  font-size: 30px;
  text-align: center
}

.ae-trust__grid span {
  display: flex;
  flex-direction: column;
  color: var(--ae-text);
  font-size: 13px;
  line-height: 1.34
}

.ae-trust__grid strong {
  color: var(--ae-ink);
  font-size: 15px
}

.ae-profession-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch
}

.ae-profession-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: #fff;
  border: 1px solid var(--ae-line);
  box-shadow: 0 12px 34px rgba(8, 41, 95, .07)
}

.ae-profession-card>img {
  display: block;
  width: 100%;
  height: 230px;
  object-fit: cover;
  object-position: center
}

.ae-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 22px
}

.ae-card-body h3 {
  order: 1;
  margin: 3px 0 10px;
  font-size: 22px
}

.ae-card-body .ae-region {
  order: 2;
  margin-bottom: 10px;
  color: var(--ae-blue);
  font-size: 12px;
  font-weight: 700
}

.ae-card-body p {
  order: 3;
  flex: 1;
  margin-bottom: 14px
}

.ae-page .ae-card-body .th-btn.medeed-uniform-btn.medeed-button-blue {
  order: 4;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: auto
}

.ae-organize-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px
}

.ae-organize-grid article {
  display: flex;
  gap: 18px;
  min-height: 190px;
  padding: 25px;
  background: #fff;
  border: 1px solid var(--ae-line);
  box-shadow: 0 9px 25px rgba(8, 41, 95, .05)
}

.ae-organize-grid i {
  flex: 0 0 46px;
  color: var(--ae-blue);
  font-size: 35px;
  text-align: center
}

.ae-organize-grid h3 {
  margin: 0 0 7px;
  font-size: 20px
}

.ae-organize-grid p {
  margin: 0
}

.ae-responsibility-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch
}

.ae-responsibility-card {
  padding: 27px;
  background: #fff;
  border: 1px solid var(--ae-line);
  box-shadow: 0 11px 30px rgba(8, 41, 95, .06)
}

.ae-responsibility-card--medeed {
  background: #eef8fe
}

.ae-responsibility-title {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 18px
}

.ae-responsibility-title i {
  color: var(--ae-blue);
  font-size: 31px
}

.ae-responsibility-title h3 {
  margin: 0;
  font-size: 22px
}

.ae-brand-icon {
  display: block;
  flex: 0 0 38px;
  width: 38px;
  height: 48px;
  overflow: hidden
}

.ae-brand-icon img {
  display: block;
  width: auto !important;
  max-width: none !important;
  height: 48px !important;
  transform: translateX(-1px)
}

.ae-responsibility-card ul {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none
}

.ae-responsibility-card li {
  position: relative;
  margin: 0;
  padding: 13px 15px 13px 44px;
  background: #fff;
  border: 1px solid var(--ae-line)
}

.ae-responsibility-card li::before {
  content: '✓';
  position: absolute;
  left: 17px;
  top: 13px;
  color: var(--ae-blue);
  font-weight: 900
}

.ae-note {
  display: flex;
  gap: 15px;
  margin-top: 20px;
  padding: 20px 22px;
  background: #e7f5fd;
  border: 1px solid #bcdcf0
}

.ae-note i {
  flex: 0 0 24px;
  color: var(--ae-blue);
  font-size: 22px
}

.ae-note p:last-child {
  margin-bottom: 0
}

.ae-start-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px
}

.ae-start-grid article {
  position: relative;
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  column-gap: 22px;
  align-items: start;
  padding: 23px 28px;
  background: #fff;
  border: 1px solid var(--ae-line)
}

.ae-start-grid span {
  display: flex;
  grid-row: 1/3;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  margin: 0;
  background: #e5f3fc;
  color: var(--ae-blue);
  font-size: 28px;
  font-weight: 800;
  line-height: 1
}

.ae-start-grid h3 {
  margin: 0 0 9px;
  font-size: 19px;
  line-height: 1.25
}

.ae-start-grid p {
  margin: 0
}

.ae-portal {
  position: relative;
  padding: 68px 0;
  background: url('/images/Anerkennung-Einreise/hero.jpg') center/cover no-repeat;
  color: #eef8ff;
  overflow: hidden
}

.ae-portal::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(8, 41, 95, .78);
  pointer-events: none
}

.ae-portal__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(460px, 1.1fr);
  gap: 52px;
  align-items: center
}

.ae-portal__copy {
  min-width: 0
}

.ae-portal .ae-eyebrow {
  color: #72c3f5
}

.ae-portal h2 {
  margin: 0 0 15px;
  color: #fff;
  font-size: clamp(25px, 2.35vw, 33px);
  line-height: 1.1
}

.ae-portal p {
  color: #e7f2ff
}

.ae-portal__media {
  margin: 0;

  overflow: hidden;
  transform: none;
   display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.ae-portal__media img {
   display: block;
    margin-left: auto;
    margin-right: 0;
  width: 80%;
  height: auto;
}

.ae-after-arrival {
  background: #edf8fd
}

.ae-after-arrival .ae-heading {
  max-width: 1080px;
  margin-bottom: 24px
}

.ae-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-top: 26px
}

.ae-metrics article {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 15px;
  align-items: center;
  padding: 22px 26px;
  background: transparent
}

.ae-metrics i {
  color: var(--ae-blue);
  font-size: 34px
}

.ae-metrics strong {
  color: var(--ae-ink);
  font-size: 46px;
  line-height: 1
}

.ae-metrics span {
  display: flex;
  flex-direction: column;
  font-size: 12px;
  line-height: 1.42
}

.ae-metrics b {
  margin-bottom: 3px;
  color: var(--ae-ink);
  font-size: 15px
}

.ae-note--compact {
  align-items: flex-start;
  background: rgba(255, 255, 255, .68)
}

.ae-final {
  padding: 64px 0;
  background-image: linear-gradient(90deg, rgba(241, 248, 252, .99) 0%, rgba(241, 248, 252, .96) 42%, rgba(241, 248, 252, .72) 62%, rgba(241, 248, 252, .14) 100%), url('/images/hero/unsereleistungen.png');
  background-position: center;
  background-size: cover
}

.ae-final__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 36px;
  align-items: center
}

.ae-final h2 {
  margin: 0 0 11px;
  font-size: clamp(25px, 2.4vw, 34px)
}

.ae-final .ae-eyebrow {
  color: #164a72
}

.ae-final__grid>div>p {
  max-width: 900px
}

.ae-slogan {
  margin: 0;
  color: #164a72;
  font-family: 'Anerkennung Caveat', cursive !important;
  font-size: 31px !important;
  font-weight: 500;
  line-height: 1.03 !important;
  transform: rotate(-4deg)
}

@media(max-width:1199.98px) {
  .ae-hero {
    min-height: 680px
  }

  .ae-hero__inner {
    min-height: 680px
  }

  .ae-hero__copy {
    width: 57%
  }

  .ae-profession-card>img {
    height: 210px
  }
}

@media(max-width:991.98px) {
  .ae-hero {
    display: flex;
    min-height: 0;
    flex-direction: column
  }

  .ae-hero__photo {
    position: relative;
    order: 2;
    height: 430px
  }

  .ae-hero__photo::after {
    background: linear-gradient(180deg, rgba(238, 245, 248, .12), rgba(238, 245, 248, 0) 70%)
  }

  .ae-hero__inner {
    order: 1;
    min-height: 0;
    background: #eef5f8
  }

  .ae-hero__copy {
    width: 100%;
    padding: 46px 0
  }

  .ae-hero-ribbon {
    position: relative;
    order: 3;
    margin-top: -90px
  }

  .ae-trust__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr))
  }

  .ae-trust__grid>div {
    min-height: 90px;
    padding: 14px 12px
  }

  .ae-profession-grid,
  .ae-start-grid,
  .ae-metrics {
    grid-template-columns: 1fr
  }

  .ae-profession-card>img {
    height: 300px
  }

  .ae-organize-grid,
  .ae-responsibility-grid,
  .ae-portal__grid,
  .ae-final__grid {
    grid-template-columns: 1fr
  }

  .ae-portal__grid {
    gap: 32px
  }

  .ae-portal__media {
    width: min(760px, 100%);
    margin-inline: auto
  }

  .ae-metrics {
    gap: 12px
  }

  .ae-metrics article {
    padding: 20px;
    background: rgba(255, 255, 255, .64)
  }

  .ae-final {
    background-position: 68% center
  }

  .ae-slogan {
    justify-self: start
  }
}

@media(max-width:767.98px) {
  .ae-shell {
    width: min(100% - 32px, 1320px)
  }

  .ae-section {
    padding: 50px 0
  }

  .ae-page p,
  .ae-page li {
    font-size: 14px
  }

  .ae-hero__copy {
    padding: 38px 0
  }

  .ae-hero__copy h1 {
    font-size: clamp(28px, 8.8vw, 39px)
  }

  .ae-hero__copy h2 {
    font-size: 19px
  }

  .ae-hero__photo {
    height: 330px
  }

  .ae-hero__slogan {
    top: 22px;
    right: 14px;
    width: 145px;
    font-size: 27px !important
  }

  .ae-hero-ribbon {
    margin-top: -94px
  }

  .ae-trust__grid {
    grid-template-columns: 1fr
  }

  .ae-trust__grid>div {
    justify-content: flex-start;
    min-height: auto;
    padding: 10px 16px
  }

  .ae-trust__grid i {
    font-size: 25px
  }

  .ae-profession-card>img {
    height: 225px
  }

  .ae-card-body,
  .ae-organize-grid article,
  .ae-responsibility-card {
    padding: 21px
  }

  .ae-organize-grid {
    grid-template-columns: 1fr
  }

  .ae-organize-grid article {
    min-height: 0
  }

  .ae-start-grid article {
    grid-template-columns: 50px minmax(0, 1fr);
    column-gap: 14px;
    padding: 18px
  }

  .ae-start-grid span {
    width: 46px;
    height: 46px;
    font-size: 21px
  }

  .ae-portal {
    padding: 52px 0
  }

  .ae-portal__media {
    transform: none
  }

  .ae-actions {
    display: grid;
    grid-template-columns: 1fr
  }

  .ae-page .th-btn.medeed-uniform-btn.medeed-button-blue {
    width: 100%
  }

  .ae-final {
    background-image: linear-gradient(rgba(241, 248, 252, .92), rgba(241, 248, 252, .92)), url('/images/hero/unsereleistungen.png');
    background-position: center
  }

  .ae-final__grid {
    gap: 23px
  }

  .ae-slogan {
    font-size: 27px !important
  }
}