/* ---- 2026-09-15 hero image layer, language modal (flags), dark header, top-gap fix, hero UI ---- */

.eh-signal-visual .eh-signal-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.eh-code-card,.eh-code-card-1,.eh-code-card-2{display:none!important}

/* Light theme: readable mobile signal tabs on the white panel */
html[data-theme=light] .eh-signal-tab{color:#061727!important;border-top-color:rgba(6,23,39,.22)!important}
html[data-theme=light] .eh-signal-tab.is-active{color:#061727!important}
html[data-theme=light] .eh-signal-tab:hover{color:#1168e8!important}

/* ---- Header flush to the very top (neutralize theme scaffold offsets) ---- */
body.eh-branded>.options_layout_wrapper{margin-top:-23px!important}
body.eh-branded .eh-header{margin-top:-22px!important}

/* ---- Header always dark, even in light theme ---- */
html[data-theme=light] .eh-header{background:#101716!important;color:#f1f4ed!important;border-bottom-color:#33433b!important}
html[data-theme=light] .eh-nav{color:#f1f4ed!important}
html[data-theme=light] .eh-nav details>summary{color:#f1f4ed!important}
html[data-theme=light] .eh-nav details>summary:hover,html[data-theme=light] .eh-nav details[open]>summary{color:#dcf48b!important}
html[data-theme=light] .eh-branded .eh-controls button,html[data-theme=light] .eh-branded .eh-search>summary,html[data-theme=light] .eh-branded .eh-search button{color:#f1f4ed!important;border-radius:999px}
html[data-theme=light] .eh-branded .eh-controls button:hover,html[data-theme=light] .eh-branded .eh-search>summary:hover{background:#293a33!important;color:#dcf48b!important}
html[data-theme=light] .eh-branded .eh-controls .eh-menu-button{color:#f1f4ed!important}
html[data-theme=light] .eh-branded .eh-controls .eh-menu-button:hover{background:#293a33!important;color:#dcf48b!important}
html[data-theme=light] .eh-header-inner{border-bottom-color:#33433b!important}
html[data-theme=light] .eh-menu-panel{background:#17211f!important;color:#f1f4ed!important;border-color:#33433b!important}
html[data-theme=light] .eh-menu-panel a{color:#cfe4d4!important}
html[data-theme=light] .eh-menu-panel a:hover{background:#293a33!important;color:#dcf48b!important}

/* ---- Hamburger <-> X toggle ---- */
.eh-menu-button .eh-menu-ico{display:block}
.eh-menu-button .eh-menu-x{display:none}
body.eh-mobile-menu-open .eh-menu-button{background:#293a33!important;color:#dcf48b!important}
body.eh-mobile-menu-open .eh-menu-button .eh-menu-ico{display:none}
body.eh-mobile-menu-open .eh-menu-button .eh-menu-x{display:grid}

/* ---- Language trigger (flag) and modal ---- */
.eh-language-switcher{min-width:auto}
.eh-lang-engine{display:none!important}

.eh-lang-trigger{display:inline-flex;align-items:center;gap:9px;min-height:42px;border:1px solid #33433b;border-radius:999px;background:#202d29;padding:0 15px;color:#f1f4ed;font:700 13px Arial,Helvetica,sans-serif;cursor:pointer}
.eh-lang-trigger svg{width:15px;height:15px;flex:none}
.eh-lang-trigger .eh-flag,.eh-lang-list .eh-flag{width:24px!important;height:16px!important;flex:none;border-radius:3px;box-shadow:0 0 0 1px rgba(127,127,127,.28)}
.eh-lang-trigger:hover{background:#293a33;color:#dcf48b;border-color:#506759}
.eh-lang-trigger .eh-lang-label{font-size:13px}

.eh-lang-modal{position:fixed;inset:0;z-index:20000;display:grid;place-items:center;padding:20px}
.eh-lang-modal[hidden]{display:none!important}
.eh-lang-backdrop{position:absolute;inset:0;background:rgba(7,18,31,.55);backdrop-filter:blur(3px)}
.eh-lang-box{position:relative;width:min(460px,100%);background:#fff;color:#061727;border:1px solid #dfe6ec;border-radius:22px;box-shadow:0 30px 80px rgba(7,18,31,.4);overflow:hidden}
html[data-theme=dark] .eh-lang-box{background:#17211f;color:#f1f4ed;border-color:#33433b}
.eh-lang-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid #edf1f4;font-size:16px;font-weight:800}
html[data-theme=dark] .eh-lang-head{border-color:#33433b}
.eh-lang-close{display:grid;place-items:center;border:1.5px solid currentColor;background:transparent;color:inherit;width:38px;height:38px;border-radius:50%;font-size:0;cursor:pointer;padding:9px;transition:background .15s ease}
.eh-lang-close svg{width:100%;height:100%}
.eh-lang-close:hover{background:rgba(6,23,39,.08)}
html[data-theme=dark] .eh-lang-close:hover{background:rgba(241,244,237,.12)}
.eh-lang-list{list-style:none!important;margin:0;padding:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;max-height:calc(100dvh - 180px);overflow:auto}
.eh-lang-list li{margin:0;list-style:none}
.eh-lang-list button{width:100%;display:flex;align-items:center;gap:10px;padding:11px 10px;border:0;border-radius:10px;background:transparent;color:inherit;font:600 14px Arial,Helvetica,sans-serif;cursor:pointer;text-align:left;transition:background .15s ease}
.eh-lang-list button:hover{background:#eef4ff;color:#1168e8}
html[data-theme=dark] .eh-lang-list button:hover{background:#293a33;color:#dcf48b}
.eh-lang-list button.is-active{background:#1168e8;color:#fff;font-weight:800}
html[data-theme=dark] .eh-lang-list button.is-active{background:#dcf48b;color:#101716}
@media(max-width:380px){.eh-lang-list{grid-template-columns:1fr}}

/* Mobile language trigger inside the drawer (last item) */
.eh-lang-trigger-mobile{padding:14px 22px!important;border-bottom:0!important}
.eh-lang-trigger-mobile .eh-lang-trigger{width:100%;min-height:0;border:0;border-radius:0;background:transparent;padding:0;color:inherit;font-size:17px}
.eh-lang-trigger-mobile .eh-lang-trigger:hover{background:transparent;color:#dcf48b}
.eh-lang-trigger-mobile .eh-lang-trigger svg{margin-left:auto}
.eh-lang-trigger-mobile .eh-lang-trigger .eh-flag{margin-left:0}

/* ---- Dark drawer in light theme (robust, higher specificity) ---- */
@media(max-width:760px){
 html[data-theme=light] body.eh-branded .eh-mobile-nav,html[data-theme=light] body.eh-branded .eh-mobile-nav:not([hidden]){background:#101716!important;color:#f1f4ed!important;border-color:#33433b!important;border-left-color:#33433b!important;box-shadow:-24px 0 70px rgba(0,0,0,.5)!important}
 html[data-theme=light] body.eh-branded .eh-mobile-nav a,html[data-theme=light] body.eh-branded .eh-mobile-nav summary{color:#f1f4ed!important}
 html[data-theme=light] body.eh-branded .eh-mobile-accordion a,html[data-theme=light] body.eh-branded .eh-mobile-all{color:#9fd3e8!important}
 html[data-theme=light] body.eh-branded .eh-mobile-accordion a .eh-link-arrow,html[data-theme=light] body.eh-branded .eh-mobile-all .eh-link-arrow{color:#9fd3e8!important}
 html[data-theme=light] body.eh-branded .eh-mobile-accordion{border-bottom-color:#33433b!important}
 html[data-theme=light] body.eh-branded .eh-lang-trigger-mobile{border-bottom-color:#33433b!important}
 html[data-theme=light] body.eh-branded .eh-lang-trigger{background:transparent!important;border-color:#33433b!important;color:#f1f4ed!important}
}

/* ---- Hero: kicker, gradient big-brand title, description ---- */
.eh-hero-kicker{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:18px;font:800 11.5px/1.4 Arial,Helvetica,sans-serif;letter-spacing:3px;text-transform:uppercase;color:rgba(255,255,255,.88)}
.eh-hero-kicker:before,.eh-hero-kicker:after{content:"";width:20px;height:2px;border-radius:2px;background:rgba(255,255,255,.55)}
.eh-branded .eh-signal-copy h1{font-size:clamp(42px,4.8vw,68px)!important;line-height:1.02;font-weight:800;letter-spacing:-0.02em;background:linear-gradient(180deg,#ffffff 15%,#bfe6ff 85%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 8px 22px rgba(5,25,45,.45))}
.eh-branded .eh-signal-copy p{color:rgba(255,255,255,.94)!important}

/* ---- Hero tab icons: equal circular chips, theme-aware, bigger ---- */
.eh-signal-tab-icon,.eh-signal-card-icon{display:grid!important;place-items:center!important;width:46px!important;height:46px!important;border-radius:50%;background:rgba(18,104,232,.14)!important;color:#1268f3!important}
html[data-theme=dark] .eh-signal-tab-icon,html[data-theme=dark] .eh-signal-card-icon{background:rgba(169,223,184,.14)!important;color:#a9dfb8!important}
.eh-signal-tab-icon .eh-signal-svg,.eh-signal-card-icon .eh-signal-svg{width:62%!important;height:62%!important}
@media(max-width:760px){
 .eh-signal-tab-icon,.eh-signal-card-icon{width:40px!important;height:40px!important}
}

/* ---- Hero description: 3 lines exactly on mobile, bigger text ---- */
@media(max-width:760px){
 .eh-branded .eh-signal-copy p,.eh-signal-copy p{font-size:17px!important;line-height:1.55!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:3!important;overflow:hidden!important}
}
@media(max-width:380px){
 .eh-branded .eh-signal-copy p,.eh-signal-copy p{font-size:16px!important}
}

/* ---- Drawer MUST stay dark even on light theme when open (theme style.css
       fights us with html[data-theme=light] body.eh-branded .eh-mobile-nav:not([hidden])
       -> background:#fff!important). Duplicated-class specificity always wins. ---- */
html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav:not([hidden]),html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav{background:#101716!important;color:#f1f4ed!important;border-color:#33433b!important}
html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav a,html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav summary,html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav .eh-mobile-accordion,html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav .eh-mobile-all{color:#f1f4ed!important}
html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav a:hover,html[data-theme=light] body.eh-branded .eh-mobile-nav.eh-mobile-nav summary:hover{color:#dcf48b!important}

/* ---- Hamburger / X / controls must stay light on the dark header (light theme) ---- */
html[data-theme=light] body.eh-branded .eh-controls .eh-controls button,html[data-theme=light] body.eh-branded .eh-controls .eh-controls button.eh-menu-button,html[data-theme=light] body.eh-branded .eh-controls .eh-menu-button,html[data-theme=light] body.eh-branded .eh-controls .eh-menu-button.eh-menu-button,html[data-theme=light] body.eh-branded .eh-search>summary{color:#f1f4ed!important}
html[data-theme=light] body.eh-branded .eh-controls .eh-controls button:hover,html[data-theme=light] body.eh-branded .eh-controls .eh-menu-button:hover,html[data-theme=light] body.eh-branded .eh-search>summary:hover{background:#293a33!important;color:#dcf48b!important}
html[data-theme=light] body.eh-branded .eh-menu-button .eh-menu-ico,html[data-theme=light] body.eh-branded .eh-menu-button .eh-menu-x{color:#f1f4ed!important}
html[data-theme=light] body.eh-branded .eh-header .eh-header{border-bottom-color:#33433b!important}

/* ---- Hero arrows: smaller, lighter weight ---- */
.eh-signal-links a{font-weight:400!important}
.eh-signal-links a .eh-link-arrow{width:14px!important;height:14px!important;flex:0 0 14px!important;opacity:.75}
.eh-signal-links a .eh-link-arrow path{stroke-width:1.5}

/* ---- Hero tab lists: never overflow their boxes, wrap for any language ---- */
.eh-signal-panel,.eh-signal-column,.eh-signal-links{min-width:0}
.eh-signal-links a{overflow-wrap:anywhere;word-break:break-word}
@media(max-width:480px){
 .eh-signal-links{grid-template-columns:1fr!important;margin-left:0!important}
}