/* Mobility in Harmony 2026 – Startseite */
.mih-header { background:#fff; box-shadow:0 8px 30px rgba(18,63,80,.07); position:relative; z-index:20; }
.mih-usp { align-items:center; background:#317c9f; color:#fff; display:flex; font-size:.76rem; font-weight:600; justify-content:space-between; letter-spacing:.01em; padding:.62rem max(1.5rem,calc((100vw - 1440px)/2)); }
.mih-usp i { margin-right:.45rem; }
.mih-header__main { align-items:center; display:grid; gap:clamp(1.3rem,3vw,3rem); grid-template-columns:auto minmax(280px,1fr) auto; margin:0 auto; max-width:1440px; padding:1.2rem 1.5rem; }
.mih-brand { align-items:center; color:#123f50 !important; display:flex; gap:.8rem; text-decoration:none !important; white-space:nowrap; }
.mih-brand__asset { display:block; height:58px; overflow:hidden; position:relative; width:340px; }
.mih-brand__asset img { height:auto; left:-29px; max-width:none !important; position:absolute; top:-16px; width:385px; }
.mih-header__search .search-wrapper { border:1px solid #dfe6e7; border-radius:999px; overflow:hidden; }
.mih-header__search .form-control { background:#f4f7f7; border:0; min-height:46px; }
.mih-header__search .btn { background:#f4f7f7; border:0; color:#123f50; }
.mih-header__actions { align-items:center; display:flex; gap:.35rem; }
.mih-header__actions a { align-items:center; color:#123f50; display:flex; flex-direction:column; font-size:.68rem; font-weight:600; gap:.18rem; min-width:58px; text-decoration:none; }
.mih-header__actions i { font-size:1.15rem; }
.mih-header__nav-row { border-top:1px solid #e3e9ea; }

.mih-topic-nav { align-items:center; display:flex; gap:clamp(1.35rem,3vw,3.4rem); justify-content:center; padding:.82rem 1.5rem; }
.mih-topic-nav.collapse { display:flex !important; }
.mih-topic-nav a { color:#26343b; font-size:.9rem; font-weight:600; letter-spacing:.035em; text-decoration:none; text-transform:uppercase; }
.mih-topic-nav a:hover { color:#317c9f; }
.mih-topic-nav__sale { color:#c56f37 !important; }
.mih-menu-toggle { background:none; border:0; display:none !important; margin:.65rem 1rem; padding:.4rem; }
.mih-menu-toggle span { background:#123f50; display:block; height:2px; margin:4px 0; width:24px; }

#content-wrapper { max-width:none !important; padding:0 !important; }
#content { padding:0 !important; }
.mih-home { background:#fbfaf7; overflow:hidden; }
#content-wrapper:has(.mih-home) > div > .container { display:none !important; }
.mih-home ~ .opc-Container { display:none !important; }
.mih-home section { margin:0 auto; max-width:1440px; }
.mih-kicker { color:#317c9f; display:block; font-size:.73rem; font-weight:700; letter-spacing:.16em; margin-bottom:1rem; text-transform:uppercase; }
.mih-home h1 { font-size:clamp(2.7rem,5.2vw,5.4rem); font-weight:500; letter-spacing:-.055em; line-height:.98; margin:0 0 1.6rem; }
.mih-home h2 { font-size:clamp(2rem,3.6vw,3.7rem); letter-spacing:-.045em; line-height:1.05; margin:0; }

.mih-hero { background:#eaf3f4; display:grid; grid-template-columns:minmax(0,46%) minmax(0,54%); min-height:650px; max-width:none !important; position:relative; }
.mih-hero__content { align-self:center; margin-left:max(1.5rem,calc((100vw - 1440px)/2)); max-width:650px; padding:5rem clamp(2rem,5vw,6rem) 6rem 1.5rem; position:relative; z-index:2; }
.mih-hero__content p { color:#4d626a; font-size:clamp(1rem,1.25vw,1.22rem); max-width:600px; }
.mih-hero__visual { background:linear-gradient(90deg,rgba(234,243,244,.55),rgba(234,243,244,0) 26%),url('/templates/MobilityHarmony/images/mobility-in-harmony-mensch-hund-pferd-wohlbefinden-hero.webp') center/cover no-repeat; min-height:650px; }
.mih-hero__actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2.2rem; }
.mih-button { border:1px solid #317c9f; border-radius:999px; display:inline-flex; font-size:.9rem; font-weight:650; justify-content:center; padding:.9rem 1.5rem; text-decoration:none !important; }
.mih-button--primary { background:#317c9f; color:#fff !important; }
.mih-button--primary:hover { background:#1f647d; border-color:#1f647d; }
.mih-button--secondary { background:rgba(255,255,255,.72); color:#123f50 !important; }
.mih-hero__note { background:#fff; bottom:0; color:#53686f; font-size:.82rem; left:46%; padding:1rem 2rem; position:absolute; }

.mih-intro { padding:clamp(5rem,10vw,9rem) 1.5rem; text-align:center; }
.mih-intro h2 { margin:0 auto; max-width:950px; }
.mih-intro p { color:#63747a; font-size:1.05rem; margin:1.8rem auto 0; max-width:760px; }

.mih-worlds, .mih-solutions, .mih-products { padding:0 1.5rem clamp(5rem,9vw,8rem); }
.mih-section-heading { align-items:end; display:flex; justify-content:space-between; margin-bottom:2.5rem; }
.mih-section-heading > p { color:#66747a; margin:0; max-width:390px; }
.mih-world-grid { display:grid; gap:1.25rem; grid-template-columns:1.18fr 1fr 1fr; }
.mih-world { background:#fff; border:1px solid #dfe6e7; border-radius:22px; color:#26343b !important; display:flex; flex-direction:column; min-height:380px; overflow:hidden; padding:2rem; position:relative; text-decoration:none !important; transition:.25s ease; }
.mih-world:after { background:radial-gradient(circle,#9fcdd5 0,rgba(159,205,213,0) 68%); border-radius:50%; content:""; height:260px; opacity:.55; position:absolute; right:-70px; top:-60px; width:260px; }
.mih-world--human { background:#123f50; color:#fff !important; }
.mih-world--dog:after { background:radial-gradient(circle,#f0cba9 0,rgba(240,203,169,0) 68%); }
.mih-world--horse:after { background:radial-gradient(circle,#c8dbd2 0,rgba(200,219,210,0) 68%); }
.mih-world:hover { box-shadow:0 20px 55px rgba(18,63,80,.12); transform:translateY(-5px); }
.mih-world__number { font-size:.75rem; opacity:.62; }
.mih-world__label { font-size:.78rem; font-weight:700; letter-spacing:.15em; margin-top:auto; text-transform:uppercase; }
.mih-world strong { font-size:clamp(1.55rem,2.2vw,2.35rem); font-weight:500; line-height:1.08; margin:.7rem 0 1.5rem; max-width:340px; }
.mih-world__link { font-size:.85rem; font-weight:650; }

.mih-solutions { background:#f1ece4; max-width:none !important; padding-left:max(1.5rem,calc((100vw - 1440px)/2)); padding-right:max(1.5rem,calc((100vw - 1440px)/2)); padding-top:clamp(4rem,7vw,6rem); }
.mih-solution-grid { display:grid; gap:1px; grid-template-columns:repeat(4,1fr); }
.mih-solution-grid a { background:rgba(255,255,255,.7); color:#26343b; display:flex; flex-direction:column; min-height:220px; padding:1.8rem; text-decoration:none; }
.mih-solution-grid a:hover { background:#fff; }
.mih-solution__icon { color:#317c9f; font-size:1.7rem; margin-bottom:auto; }
.mih-solution-grid strong { color:#123f50; font-size:1.15rem; margin-bottom:.5rem; }
.mih-solution-grid small { color:#66747a; }

.mih-products { padding-top:clamp(5rem,8vw,7rem); }
.mih-products .product-slider-wrapper { margin:0; }
.mih-products .product-wrapper { background:#fff; border:0; }

.mih-promise { background:#123f50; border-radius:24px; color:#fff; margin-bottom:6rem !important; padding:clamp(3rem,7vw,6rem); text-align:center; }
.mih-promise h2 { color:#fff; margin:0 auto; max-width:900px; }
.mih-promise p { color:rgba(255,255,255,.72); margin:1.5rem auto 2rem; max-width:720px; }

@media (max-width:991.98px) {
  .mih-usp span:nth-child(2), .mih-usp span:nth-child(3) { display:none; }
  .mih-usp { justify-content:center; }
  .mih-header__main { gap:1rem; grid-template-columns:1fr auto; }
  .mih-brand__asset { height:49px; width:265px; }
  .mih-brand__asset img { left:-23px; top:-12px; width:305px; }
  .mih-header__search { grid-column:1 / -1; grid-row:2; }
  .mih-header__actions { grid-column:2; grid-row:1; }
  .mih-menu-toggle { display:block !important; }
  .mih-topic-nav { align-items:flex-start; flex-direction:column; gap:0; padding:0 1rem 1rem; }
  .mih-topic-nav.collapse:not(.show) { display:none !important; }
  .mih-topic-nav a { border-bottom:1px solid #edf1f1; padding:.75rem .25rem; width:100%; }
  .mih-hero { grid-template-columns:1fr; }
  .mih-hero__content { margin:0; padding:4.5rem 1.5rem 3rem; }
  .mih-hero__visual { min-height:430px; order:2; }
  .mih-hero__note { display:none; }
  .mih-world-grid { grid-template-columns:1fr; }
  .mih-world { min-height:300px; }
  .mih-solution-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width:575.98px) {
  .mih-topic-nav { padding:.7rem 1rem; }
  .mih-topic-nav a { font-size:.77rem; }
  .mih-hero { min-height:0; }
  .mih-hero__visual { min-height:310px; }
  .mih-section-heading { align-items:start; flex-direction:column; gap:1rem; }
  .mih-solution-grid { grid-template-columns:1fr; }
  .mih-promise { border-radius:0; margin-bottom:0 !important; }
}
/* Kategorie- und Herstellerkopf: bereit für Hero-Bild und Beschreibung aus JTL-Wawi. */
.mih-category-intro {
    margin: .35rem 0 2rem;
    padding: clamp(1.5rem, 3vw, 3rem);
    border: 1px solid #dce6e8;
    border-radius: 1.25rem;
    background: #f1f6f6;
    overflow: hidden;
}

.mih-category-intro--image {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    padding: 0;
}

.mih-category-intro__copy {
    align-self: center;
    min-width: 0;
}

.mih-category-intro--image .mih-category-intro__copy {
    padding: clamp(1.5rem, 3vw, 3rem);
}

.mih-category-intro h1 {
    margin: .35rem 0 .8rem;
    color: #15303a;
    font-size: clamp(2rem, 4vw, 3.4rem);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -.035em;
}

.mih-eyebrow {
    color: #147895;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .16em;
}

.mih-category-intro__description,
.mih-category-intro__description p {
    margin: 0;
    color: #405d65;
    font-size: 1rem;
    line-height: 1.65;
}

.mih-category-intro__media,
.mih-category-intro__image {
    width: 100%;
    height: 100%;
    min-height: 21rem;
}

.mih-category-intro__image {
    object-fit: cover;
}

@media (max-width: 767.98px) {
    .mih-category-intro {
        margin: .2rem 0 1.4rem;
        border-radius: 1rem;
    }

    .mih-category-intro--image {
        grid-template-columns: minmax(0, 1fr);
    }

    .mih-category-intro--image .mih-category-intro__copy {
        padding: 1.5rem;
    }

    .mih-category-intro__media,
    .mih-category-intro__image {
        min-height: 0;
        height: 14rem;
    }
}