/* Eigenes Grundgerüst für den PoC-Nachbau helaspice.com. Kein Code des Originals;
   Farben, Maße und Schriftgrößen wurden aus dessen CSS abgelesen (siehe tokens.css, seiten/*.css). */

/* ---------- Schriften (lokal, IBM Plex, SIL OFL 1.1) ---------- */
@font-face{font-family:"IBM Plex Sans";src:url(../fonts/ibm-plex-sans/IBMPlexSans-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(../fonts/ibm-plex-sans/IBMPlexSans-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(../fonts/ibm-plex-sans/IBMPlexSans-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(../fonts/ibm-plex-sans/IBMPlexSans-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Condensed";src:url(../fonts/ibm-plex-sans-condensed/IBMPlexSansCondensed-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Condensed";src:url(../fonts/ibm-plex-sans-condensed/IBMPlexSansCondensed-SemiBold.woff2) format("woff2");font-weight:600 700;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans Arabic";src:url(../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-SemiBold.woff2) format("woff2");font-weight:600 700;font-style:normal;font-display:swap}

:root{
  --f-head:"IBM Plex Sans Condensed","Arial Narrow",Arial,sans-serif;
  --f-text:"IBM Plex Sans",Arial,sans-serif;
  --rot:#DA020F;--dunkel:#191919;--hell:#F2F2F2;--linie:#D8D8D8;
}
:lang(ar){--f-head:"IBM Plex Sans Arabic","IBM Plex Sans Condensed",Tahoma,sans-serif;--f-text:"IBM Plex Sans Arabic","IBM Plex Sans",Tahoma,sans-serif}
:lang(zh){--f-head:"IBM Plex Sans Condensed","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;--f-text:"IBM Plex Sans","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif}
/* Arabische Schrift verbindet Buchstaben: keine Sperrung, keine Großschreibung */
:lang(ar) *{letter-spacing:0 !important;text-transform:none !important}

/* ---------- Grundlagen ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;font-family:var(--f-text);font-size:16px;line-height:1.4;letter-spacing:.25px;color:#000;background:#fff;overflow-x:hidden}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
a:hover{color:var(--rot)}
a:focus-visible,summary:focus-visible,button:focus-visible{outline:2px solid var(--rot);outline-offset:2px}
h1,h2,h3,h4,h5,h6,p,figure{margin:0}
h1,h2,h3,h4,h5,h6,p,li,a{overflow-wrap:anywhere}
.c,.in,.w{min-width:0;max-width:100%}
summary{cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
.sprung{position:absolute;inset-inline-start:-999px;top:0}
.sprung:focus{inset-inline-start:8px;z-index:200;background:#fff;padding:6px 10px}
[data-fehlt]{cursor:help}

/* ---------- Vorschau-Band ---------- */
.poc-band{background:#FFD400;color:#000;text-align:center;font:700 15px/1.3 var(--f-text);padding:8px 12px;letter-spacing:.5px;border-bottom:2px solid #000;position:relative;z-index:100}

/* ---------- Kopf ---------- */
.kopf{position:sticky;top:0;z-index:90;background:#fff;box-shadow:0 1px 0 #0000001a}
.kopf-in{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:72px;padding:0 64px}
.logo img{width:86px;display:block}
.hmenu{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:32px}
.hmenu>li>a{display:flex;align-items:center;gap:8px;font:600 18px/27px var(--f-text);padding:22px 0}
.hmenu>li.hat>a::after{content:"";width:7px;height:7px;border-inline-end:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-3px) rotate(45deg)}
.hmenu>li:hover>a,.hmenu>li:focus-within>a{color:var(--rot)}
.drop{display:none;position:absolute;inset-inline:0;top:100%;background:#fff;padding:32px 64px 40px;box-shadow:0 12px 24px #00000014;border-top:1px solid var(--linie)}
.hmenu>li:hover>.drop,.hmenu>li:focus-within>.drop{display:block}
.kacheln{list-style:none;margin:0 auto;padding:0;display:flex;justify-content:center;gap:48px;max-width:1440px}
.kacheln a{display:flex;align-items:center;gap:16px}
.kacheln img{width:120px;height:92px;object-fit:contain}
.kt{display:block;font:600 18px/27px var(--f-text)}
.ku{display:block;font:400 16px/24px var(--f-text);color:#000}
.laender{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px 32px;max-width:1440px}
.laender a{display:flex;align-items:center;gap:10px;font:400 16px/24px var(--f-text)}
.laender img{width:28px;height:20px;object-fit:cover}
.mnav{display:none}
.mnav>summary{display:flex;align-items:center;gap:10px;font:600 16px/1 var(--f-text);padding:10px 0}
.burger,.burger::before,.burger::after{display:block;width:22px;height:2px;background:#000;position:relative}
.burger::before,.burger::after{content:"";position:absolute}
.burger::before{top:-7px}.burger::after{top:7px}
.mpanel{position:absolute;inset-inline:0;top:100%;background:#fff;box-shadow:0 12px 24px #0000001f;padding:8px 20px 24px;max-height:calc(100vh - 110px);overflow:auto}
.mpanel ul{list-style:none;margin:0;padding:0}
.mpanel a,.mpanel summary{display:block;padding:12px 0;border-bottom:1px solid #eee;font:600 16px/1.3 var(--f-text)}
.mpanel details ul{padding-inline-start:16px}
.mpanel details ul a{font-weight:400}
.mpanel details>summary::after{content:"+";float:inline-end;color:var(--rot)}
.mpanel details[open]>summary::after{content:"–"}
@media(max-width:1024px){
  .kopf-in{padding:0 20px;min-height:64px}
  .hnav{display:none}
  .mnav{display:block}
}

/* ---------- Container (Nachbildung des Elementor-Rasters) ---------- */
:where(.c){display:flex;flex-direction:column;gap:16px;width:100%;min-width:0;position:relative;--cww:100%;--cwg:0;--cwa:initial}
:where(.c.box){display:flex;flex-direction:column}
:where(.c.box)>.in{display:flex;flex-direction:column;gap:16px;width:100%;max-width:1440px;margin-inline:auto;flex-grow:1;--cww:100%;--cwg:0;--cwa:initial}
:where(.c.grid:not(.box)),:where(.c.grid.box)>.in{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
:where(.c,.in)>:where(.w){width:var(--cww);flex-grow:var(--cwg);align-self:var(--cwa);max-width:100%}
:where(a.c){color:inherit}
.hatbg,.ov{isolation:isolate}
.hatbg{overflow:hidden}
.hatbg>img.bg{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;z-index:-2}
.ov::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
@media(max-width:767px){
  :where(.c),:where(.c.box)>.in{flex-wrap:wrap}
  :where(.c.grid:not(.box)),:where(.c.grid.box)>.in{grid-template-columns:minmax(0,1fr)}
}
@media(min-width:1025px){.hd{display:none !important}}
@media(min-width:768px) and (max-width:1024px){.ht{display:none !important}}
@media(max-width:767px){.hm{display:none !important}
  main .ec98f8a9{width:100%}
  main h1{font-size:clamp(36px,11vw,48px);line-height:1.1}
}

/* ---------- Bausteine ---------- */
:where(.w-heading){color:var(--col-primary)}
:where(.w-heading) a{color:inherit}
:where(.w-text-editor){color:var(--col-text)}
.w-text-editor p,.w-text-editor ul,.w-text-editor ol{margin:0 0 .9rem}
.w-text-editor>:last-child{margin-bottom:0}
.w-text-editor ul,.w-text-editor ol{padding-inline-start:1.3em}
.w-text-editor a{text-decoration:underline}
.w-text-editor h1,.w-text-editor h2,.w-text-editor h3,.w-text-editor h4{font-family:var(--f-head);margin:1.4em 0 .5em;line-height:1.2}
.w-text-editor table{border-collapse:collapse;width:100%}
.w-text-editor td,.w-text-editor th{border:1px solid var(--linie);padding:6px 8px;text-align:start;vertical-align:top}
:where(figure.w){text-align:center}
:where(figure.w) img{vertical-align:middle}
:where(.btn){display:inline-flex;align-items:center;justify-content:center;gap:12px;font-family:var(--f-text);font-size:18px;font-weight:500;line-height:27px;color:#000;background:var(--col-accent);border:1px solid var(--rot);padding:10px 24px;text-align:center;transition:opacity .2s}
.w a.btn:hover,a.btn:hover{opacity:.85}
:where(ul.w-icon-list){list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
:where(ul.w-icon-list.inline){flex-direction:row;flex-wrap:wrap;gap:8px 24px}
:where(hr.w-divider){border:0;border-top:1px solid var(--linie);margin:0;width:100%}
.pfeil{display:inline-block;font-size:24px;line-height:1;color:var(--rot)}
[dir=rtl] .pfeil{transform:scaleX(-1)}
.w-social-icons{display:flex;flex-wrap:wrap;gap:8px}
.soc{font-size:13px;line-height:1;border:1px solid var(--linie);padding:6px 10px;color:#000}
.w-nested-accordion details{border-bottom:1px solid var(--linie)}
.w-nested-accordion summary{display:flex;justify-content:space-between;gap:16px;padding:14px 0;font:600 18px/1.4 var(--f-text)}
.w-nested-accordion summary::after{content:"+";color:var(--rot);font-size:22px;line-height:1}
.w-nested-accordion details[open]>summary::after{content:"–"}
.w-nested-accordion .acc{display:flex;flex-direction:column;gap:4px;padding:0 0 16px}
.karussell{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;overscroll-behavior-x:contain}
.karussell>.slide{flex:0 0 min(300px,80%);scroll-snap-align:start;display:flex;flex-direction:column;gap:12px}
.platzhalter{border:2px dashed #999;background:#f4f4f4;padding:32px;text-align:center;color:#444;width:100%}

/* Weltkarte: statisch, drei Regionen als Links; Hervorhebung nur per CSS */
.weltkarte{display:flex;flex-direction:column;gap:48px;width:100%}
.weltkarte .kartenkopf{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.weltkarte .karte{direction:ltr;display:flex;align-items:center;justify-content:center;gap:3%;flex:1}
.region{position:relative;display:block;text-align:center}
.region img{display:block;width:100%;height:auto}
.region .pink{position:absolute;top:0;left:0;opacity:0;transition:opacity .25s}
.region:hover .pink,.region:focus-visible .pink{opacity:1}
.region span{display:block;margin-top:10px;font:600 16px/1.3 var(--f-head);text-transform:uppercase;letter-spacing:1.6px}
.r-americas{width:36%}.r-emea{width:21%}.r-apac{width:37%}
@media(min-width:1025px){.weltkarte{flex-direction:row;align-items:center}.weltkarte .kartenkopf{flex:0 0 36%}}
.regionen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;width:100%}
.regionskarte{display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--hell);border-top:3px solid var(--rot)}
@media(max-width:767px){.regionen{grid-template-columns:minmax(0,1fr)}}

/* Formular: nur Darstellung, nicht angeschlossen */
.formular{display:flex;flex-wrap:wrap;gap:16px;width:100%}
.feld{display:flex;flex-direction:column;gap:6px;flex:1 1 100%;min-width:0}
.feld.halb{flex:1 1 calc(50% - 8px)}
.feld label{font:600 14px/1.3 var(--f-text)}
.formular input,.formular textarea,.formular select{font:inherit;font-size:16px;padding:10px 12px;border:1px solid #00000026;background:#f7f7f7;width:100%;color:#000}
.formular .chk{display:flex;gap:8px;align-items:flex-start;font-weight:400}
.formular .chk input{width:auto}
.formular .btn{background:var(--rot);color:#fff;border-color:var(--rot);cursor:not-allowed;opacity:.7}
.poc-hinweis{flex:1 1 100%;background:#FFF4CC;border-inline-start:4px solid #FFD400;padding:10px 12px;font-size:14px;color:#000}
@media(max-width:767px){.feld.halb{flex-basis:100%}}

/* Platzhalterseite für verlinkte, nicht nachgebaute Seiten */
.platzseite{padding:112px 64px}
.platzseite .in{gap:24px}
.platzseite .pfad{color:#555;word-break:break-all}
@media(max-width:1024px){.platzseite{padding:64px 20px}}

/* ---------- Sprachwahl (wie im Original unten rechts) ---------- */
.sprachen{position:fixed;inset-inline-end:16px;bottom:16px;z-index:95;background:#fff;border:1px solid #ccc;box-shadow:0 2px 10px #0003;font:500 14px/1.3 var(--f-text);min-width:150px}
.sprachen summary{display:flex;align-items:center;gap:8px;padding:8px 12px}
.sprachen ul{list-style:none;margin:0;padding:4px 0;border-top:1px solid #eee}
.sprachen li a{display:flex;align-items:center;gap:8px;padding:6px 12px}
.sprachen img{width:18px;height:12px;object-fit:cover}

/* ---------- Aufbau: Rechtshinweise (AGB-Übersetzung, vorläufige Datenschutzerklärung) und Impressum ---------- */
.rechtshinweis{padding:24px 64px 0}
.rechtshinweis p{background:#FFF4CC;border-inline-start:4px solid #FFD400;padding:12px 16px;font:500 15px/1.5 var(--f-text);color:#000}
.impressum{padding:80px 64px 112px}
.impressum .in{max-width:900px;gap:8px}
.impressum h1{font-family:var(--f-head);font-weight:600;margin:0 0 16px}
.impressum h2{font:600 20px/1.3 var(--f-head);margin:24px 0 4px}
.impressum p{font:400 17px/1.6 var(--f-text)}
.impressum .imp-hinweis{background:#FFF4CC;border-inline-start:4px solid #FFD400;padding:12px 16px;font-size:15px;margin-bottom:16px}
.impressum .fehlt{background:#FFD400;color:#000;padding:0 6px;font-weight:700}
@media(max-width:1024px){.rechtshinweis{padding:16px 20px 0}.impressum{padding:48px 20px 64px}}
/* Impressum v2: Abschnittsüberschriften wie Original (Disclaimer h2, Unterpunkte h3) */
.impressum h3{font:600 17px/1.4 var(--f-text);margin:16px 0 2px}
.impressum a{color:var(--rot);text-decoration:underline}
/* Rechtstexte 02.10.2026 (ARBEITSPAKET-RECHTSTEXTE): Listen der Datenschutzerklärung, Datenschutzhinweis im Formular */
.impressum ul{margin:0 0 4px;padding-inline-start:1.3em;font:400 17px/1.6 var(--f-text)}
.impressum li{margin:0 0 2px}
.formular .ds-hinweis{margin:0;font:400 14px/1.5 var(--f-text)}
.formular .ds-hinweis a{color:var(--rot);text-decoration:underline}