/* HoKuTech: Seitenrahmen und OXOMI-Bedienelemente im Bort-&-Herkert-Design. */
.hoku-intro{margin:22px 0;background:#fff;border-top:5px solid var(--cyan);padding:30px 38px;box-shadow:var(--shadow)}
.hoku-intro .breadcrumbs{margin-bottom:23px}
.hoku-intro .eyebrow{color:var(--cyan-dark)}
.hoku-intro h1{font-family:var(--font-display);font-size:clamp(1.8rem,3.3vw,2.75rem);line-height:1.15;letter-spacing:-.035em;margin:0 0 18px}
.hoku-intro h1 span{color:var(--cyan);display:block}
.hoku-intro-bottom{display:flex;align-items:center;justify-content:space-between;gap:32px}
.hoku-intro-bottom p{max-width:760px;color:var(--muted);line-height:1.7;margin:0}
.hoku-intro-bottom .button{flex-shrink:0;font-size:.8rem}
.hoku-microsite{background:#fff;border-top:5px solid var(--cyan);padding:28px;box-shadow:var(--shadow);min-width:0}
.hoku-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin:0 0 20px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.hoku-section-head h2,.hoku-contact h2{font-family:var(--font-display);font-size:1.4rem;margin:0;line-height:1.35}
.hoku-section-head p{font-size:.82rem;color:var(--muted);margin:0}
.hokutech-page #output-container{width:100%;max-width:1100px;margin:0 auto;min-width:0}
.hokutech-page #output,.hokutech-page #output-info-tile{font-family:var(--font-body);min-width:0}
.hokutech-page #output-info-tile{padding:15px 18px;background:#f2f3f4;margin-bottom:20px;border-left:4px solid var(--cyan)}
.hokutech-page #output-info-tile:empty{display:none}
.hokutech-page .sci-font,.hokutech-page .sci-overlay,.hokutech-page .sci-sidebar-overlay{font-family:var(--font-body)}
.hokutech-page .oxomi-watchlist-info-tile-icon .sci-pill{background:var(--cyan)!important;color:#fff}
.hokutech-page .sci-bg-blue{background-color:var(--cyan)!important}
.hokutech-page .sci-text-blue{color:var(--cyan-dark)!important}
.hokutech-page .oxomi-watchlist-product-card-gtin-cust{display:none!important}
.hokutech-page #oxomi-watchlist-request-products-button{margin-top:20px}
.hoku-status{text-align:center;padding:40px 20px;color:var(--muted);line-height:1.6}
.hoku-status[hidden]{display:none}
.hoku-status a{text-decoration:underline;color:var(--cyan-dark)}
.hoku-loader{display:inline-block;width:28px;height:28px;border:3px solid var(--line);border-top-color:var(--cyan);border-radius:50%;animation:hoku-spin .9s linear infinite}
@keyframes hoku-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.hoku-loader{animation:none}}
.hoku-contact{display:flex;justify-content:space-between;align-items:center;gap:28px;background:#f2f3f4;padding:30px 38px;margin:22px 0}
.hoku-contact .eyebrow{color:var(--cyan-dark)}
.hoku-contact p:not(.eyebrow){color:var(--muted);line-height:1.6;margin:12px 0 0}
.hoku-contact>.button{flex-shrink:0}
@media(max-width:900px){.hoku-intro-bottom{display:block}.hoku-intro-bottom .button{margin-top:20px}.hoku-section-head{display:block}.hoku-section-head p{margin-top:10px}}
@media(max-width:760px){.hoku-intro{margin:14px 0;padding:23px 20px}.hoku-microsite{padding:20px 10px}.hoku-section-head{padding:0 10px 16px}.hoku-contact{display:block;padding:25px 20px}.hoku-contact>.button{margin-top:20px}.hokutech-page #output-info-tile{padding:12px}.hoku-section-head h2,.hoku-contact h2{font-size:1.2rem}}
.hokutech-page #output a{color:var(--cyan-dark)!important}
/* OXOMI-Gitter innerhalb des Seitenrahmens halten, ohne Inhalte abzuschneiden. */
.hokutech-page #output .sci-row,.hokutech-page #output .sci-grid-1{margin-inline:0!important;max-width:100%}

/* Direkte Einbindung ohne zusätzliche Karte. */
.hokutech-page .hoku-microsite{background:transparent;border:0;box-shadow:none;padding:0;margin:24px 0 0;min-width:0}
.hokutech-page #output-container{max-width:none;width:100%;margin:0;min-width:0}
@media(max-width:760px){.hokutech-page .hoku-microsite{padding:0;margin-top:14px}}

/* HoKu-Produktwelt an die Hausschriften, Farben und Buttons angleichen. */
.hokutech-page #output .sci-font,
.hokutech-page .sci-overlay .sci-font,
.hokutech-page .sci-sidebar-overlay .sci-font{font-family:var(--font-body)!important}
.hokutech-page #output .sci-text-larger{font-size:1rem!important;line-height:1.65!important}
.hokutech-page #output .sci-story-paragraph{line-height:1.65}
.hokutech-page #output .sci-text-muted{color:var(--muted)!important}
.hokutech-page #output .sci-story-text-ci{color:var(--ink)!important}
.hokutech-page #output .sci-story-heading{font-family:var(--font-display)!important;font-weight:800!important;letter-spacing:-.035em;line-height:1.25;margin-bottom:16px}
.hokutech-page #output .sci-story-heading.sci-text-size-h1{font-size:1.85rem!important;line-height:1.25!important;font-weight:800!important}
.hokutech-page #output .sci-story-heading.sci-text-size-h3{font-size:1.2rem!important;line-height:1.35!important;font-weight:800!important}
.hokutech-page #output [data-story-element-name="Navbar"]{border-bottom:1px solid var(--line);padding-bottom:12px!important;margin-bottom:20px}
.hokutech-page #output [data-story-element-name="Navbar"] .sci-story-paragraph{font-family:var(--font-display)!important;font-size:.9rem!important;font-weight:700!important;color:var(--ink)!important}
.hokutech-page #output [data-story-element-name="Navbar"] a:hover .sci-story-paragraph{color:var(--cyan-dark)!important}
.hokutech-page #output .sci-story-button-ci,
.hokutech-page #output .sci-story-button-ci-outline{font-family:var(--font-display)!important;font-size:.85rem!important;font-weight:700!important;line-height:1.4!important;min-height:44px;padding:.72rem 1.35rem!important;border:1px solid var(--cyan)!important;border-radius:0!important;background:var(--cyan)!important;color:#fff!important;text-decoration:none!important;transition:background .2s,box-shadow .2s}
.hokutech-page #output .sci-story-button-ci:hover,
.hokutech-page #output .sci-story-button-ci-outline:hover{background:var(--cyan-dark)!important;border-color:var(--cyan-dark)!important;color:#fff!important;box-shadow:0 5px 14px rgba(0,0,0,.12)}
.hokutech-page #output .sci-slider-dot{color:var(--cyan-dark)!important}
.hokutech-page #output-info-tile .sci-font{font-family:var(--font-display)!important;font-size:.9rem!important;font-weight:700!important;color:var(--ink)!important}
.hokutech-page #output-info-tile{padding:14px 20px;border-left:4px solid var(--cyan)}
/* Ausschließlich den benannten Verbandsabschluss ausblenden. */
.hokutech-page #output [data-story-element-name="Footer"]{display:none!important}
@media(max-width:760px){
 .hokutech-page #output .sci-story-heading.sci-text-size-h1{font-size:1.5rem!important}
 .hokutech-page #output .sci-story-heading.sci-text-size-h3{font-size:1.1rem!important}
 .hokutech-page #output [data-story-element-name="Navbar"] .sci-story-paragraph{font-size:.85rem!important}
 .hokutech-page #output-info-tile{padding:12px 16px}
}

.hokutech-page #output .sci-story-heading .sci-story-paragraph{line-height:1.25!important}

/* Weißraum der eigentlichen Microsite: oben ca. 1 cm ergänzen. */
.hokutech-page #output .sci-story{padding-top:38px!important}
/* Den bisherigen Abschlussabstand (152 px) durch Halbieren seiner
   Text-/Absatzabstände und beider vorhandenen Leersegmente auf 76 px kürzen. */
.hokutech-page #output [data-story-element-name="Service"]{margin-bottom:12px!important}
.hokutech-page #output [data-story-element-name="Service"] .sci-text:has(+ .sci-story-segment[style*="height: 2rem"]){margin-bottom:12px!important}
.hokutech-page #output [data-story-element-name="Service"] > .sci-story-segment:last-child > .sci-story-segment:last-child > .sci-story-segment:last-child[style*="height: 2rem"]{height:16px!important;line-height:16px!important}
.hokutech-page #output [data-story-element-name="Service"] + .sci-story-segment[style*="height: 3rem"]{height:24px!important;line-height:24px!important;margin-bottom:12px!important}