/* Scoped homepage hero. Genuine product imagery, with colour supplied by CSS. */
html body .home-hero-showcase{position:relative;isolation:isolate;background:radial-gradient(ellipse at 0 15%,#0e719a99,transparent 62%),radial-gradient(ellipse at 95% 95%,#15969f30,transparent 58%),linear-gradient(120deg,#074775,#04243f);color:#fff;overflow:hidden}
html body .home-hero-showcase .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:54px;min-height:0;padding:48px 0 34px;align-items:center}
html body .home-hero-showcase .hero-introduction{min-width:0}
html body .home-hero-showcase .eyebrow{color:#d0ef9c;font-size:.78rem;letter-spacing:.12em;margin-bottom:18px}
html body .home-hero-showcase .home-brand-heading{font-size:clamp(3.7rem,6.8vw,5.9rem)!important;line-height:1.03;margin:0 0 22px}
html body .home-hero-showcase .home-seo-title{font-size:clamp(1.5rem,2.15vw,1.9rem);line-height:1.3;margin-top:16px;max-width:440px}
html body .home-hero-showcase .home-brand-claim{font-size:1rem;line-height:1.7;max-width:500px;color:#e1eff7;margin-bottom:22px}
html body .home-hero-showcase .hero-configurator{padding:20px;margin-top:22px;background:linear-gradient(125deg,#062d4970,#18637c35);border:1px solid #9bd3e24a;border-radius:22px;box-shadow:none;max-width:none}
html body .home-hero-showcase .hero-config-title{font-size:.97rem;margin-bottom:15px}
html body .home-hero-showcase .hero-configurator .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
html body .home-hero-showcase .hero-configurator .button{border-radius:16px!important;padding:18px 16px;gap:14px;min-height:0;overflow:hidden;transform:none;box-shadow:0 6px 16px #001d2c25!important;--action-fill:linear-gradient(135deg,#0876a1,#075278);--action-text:#fff;--action-line:#6fc4e396;background:var(--action-fill)!important;color:var(--action-text)!important;border-color:var(--action-line)!important;transition:background .2s,box-shadow .2s,border-color .2s}
html body .home-hero-showcase .hero-configurator .hero-config-tile{min-height:132px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between}
html body .home-hero-showcase .hero-configurator .hero-config-tile[data-action-tone="green"]{--action-fill:linear-gradient(135deg,#caec9a,#aede73);--action-text:#123e4c;--action-line:#d3efa9}
html body .home-hero-showcase .hero-configurator .hero-config-hardware{grid-column:1/-1;--action-fill:linear-gradient(115deg,#114c69,#103e59);--action-line:#72b0c6;display:flex;align-items:center;justify-content:flex-start;padding:14px 16px;min-height:68px}
html body .home-hero-showcase .hero-configurator .button::after{display:none}
html body .home-hero-showcase .hero-configurator .hero-config-icon{width:38px;height:38px;min-width:38px;flex-basis:38px;border-radius:11px!important;border:1px solid #a4ddec9c!important;background:#073b5b55!important;color:#fff!important;box-shadow:none}
html body .home-hero-showcase .hero-configurator .hero-config-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
html body .home-hero-showcase .hero-configurator .hero-config-tile[data-action-tone="green"] .hero-config-icon{color:#174750!important;background:#e2f5bd66!important;border-color:#53825d5c!important}
html body .home-hero-showcase .hero-configurator .hero-config-copy strong{font-size:.93rem;font-weight:800;color:inherit}
html body .home-hero-showcase .hero-configurator .hero-config-copy small{font-size:.77rem;color:#d6ecf8;margin-top:4px}
html body .home-hero-showcase .hero-configurator .hero-config-tile[data-action-tone="green"] small{color:#28545a}
html body .home-hero-showcase .hero-configurator .button:hover{border-color:#e4f6fb!important;box-shadow:0 7px 20px #0013235c!important;filter:brightness(1.07)}
html body .home-hero-showcase .hero-consultation{display:inline-flex!important;margin-top:15px;min-height:44px;font-size:.84rem;color:#e7f5fb!important}
html body .home-hero-showcase .hero-showcase{min-width:0;border:1px solid #8dd0df70;border-radius:26px;overflow:hidden;background:linear-gradient(140deg,#0e4e6b,#082c47);box-shadow:0 22px 45px #001a3545}
html body .home-hero-showcase .hero-art{display:block;padding:0;border-radius:0;position:relative;transform:none!important;transition:none;color:#fff;overflow:hidden}
html body .home-hero-showcase .product-stage{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;min-height:310px;padding:60px 34px 22px;border:0;border-radius:0;box-shadow:none;animation:none!important;background:radial-gradient(ellipse at 64% 28%,#e4f3dd,transparent 65%),linear-gradient(130deg,#94c9dc,#c6e6eb 56%,#a4d3dd);overflow:hidden}
html body .home-hero-showcase .product-stage::before{content:'';position:absolute;width:370px;height:370px;left:50%;top:50%;transform:translate(-50%,-48%);border:1px solid #367e923b;border-radius:50%;box-shadow:0 0 0 30px #669cac12,0 0 0 62px #438ca611;z-index:-1;pointer-events:none}
html body .home-hero-showcase .product-stage img{display:block;position:relative;width:100%;height:236px;object-fit:contain;mix-blend-mode:multiply;filter:none;animation:none!important;margin:0}
html body .home-hero-showcase .product-stage.photo img{object-fit:cover;mix-blend-mode:normal;border-radius:16px}
html body .home-hero-showcase .hero-stage-kicker{position:absolute;top:20px;left:22px;font-size:.69rem;font-weight:750;letter-spacing:.07em;text-transform:uppercase;color:#17495b}
html body .home-hero-showcase .vertical-label{position:absolute;top:19px;right:20px;bottom:auto;left:auto;transform:none;writing-mode:horizontal-tb;max-width:63%;background:#073e5f;color:#d5f2a6;border:1px solid #96c4b5;border-radius:9px;padding:7px 12px;font-size:.67rem;line-height:1.4;text-align:center;box-shadow:none}
html body .home-hero-showcase .floating-note{position:static;display:block;width:100%;max-width:none;border:0;border-radius:0;background:linear-gradient(130deg,#0a496b,#07334f);color:#fff;padding:21px 24px 16px;animation:none;box-shadow:none;font-weight:400;min-height:145px}
html body .home-hero-showcase .floating-note strong{display:block;font-size:1.24rem;line-height:1.3;letter-spacing:-.015em;color:#fff;font-weight:800;margin-bottom:8px}
html body .home-hero-showcase .floating-note #heroSub{color:#dbecf7;font-size:.84rem;line-height:1.55}
html body .home-hero-showcase .floating-note .hero-category-action{display:flex;align-items:center;gap:14px;justify-content:space-between;min-height:38px;margin-top:12px;padding:0;color:#d4efa5;font-size:.8rem;font-weight:750;text-decoration:none;border-radius:0}
html body .home-hero-showcase .hero-category-action>span{color:inherit;font-size:1.1rem;font-weight:700}
html body .home-hero-showcase .hero-art:hover .hero-category-action{color:#fff;text-decoration:underline;text-underline-offset:4px}
html body .home-hero-showcase .hero-showcase-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #9ecdda33;padding:14px 20px;background:#07314e}
html body .home-hero-showcase .slider-controls{display:flex;align-items:center;justify-content:flex-start;gap:9px;flex-wrap:nowrap;min-width:0;color:#e4f4fb}
html body .home-hero-showcase .slider-controls button{display:grid;place-items:center;padding:0;height:38px;width:38px;min-height:38px;min-width:38px;border-radius:50%!important;border:1px solid #86bacf;background:#164964;color:#fff;font-size:1rem;box-shadow:none;transform:none}
html body .home-hero-showcase .slider-controls button:hover{background:#d0ee9c;color:#07334f}
html body .home-hero-showcase #slideCount{font-size:.74rem;white-space:nowrap;min-width:45px;text-align:center}
html body .home-hero-showcase .progress{display:none}
html body .home-hero-showcase .hero-showcase-hint{font-size:.67rem;color:#bddbe9;margin:0;line-height:1.4;max-width:130px;text-align:right}
html body .home-hero-showcase .hero-shop-picker{display:grid;grid-template-columns:1fr;gap:9px;border-top:1px solid #9ecdda33;padding:17px 22px 19px;background:linear-gradient(120deg,#123e58,#0c314b)}
html body .home-hero-showcase .hero-shop-picker label{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:.76rem;font-weight:750;color:#fff}
html body .home-hero-showcase .hero-shop-picker label span{color:#d2e8f4;font-size:.65rem;font-weight:400}
html body .home-hero-showcase .hero-shop-picker select{display:block;width:100%;min-width:0;min-height:42px;padding:9px 12px;font:650 .79rem/1.4 'DM Sans',system-ui,sans-serif;border:1px solid #8cc1d2;background:#d6ecf1;color:#073b54;border-radius:10px;box-shadow:none}
html body .home-hero-showcase .hero-all-categories{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;color:#d5efa8;font-size:.73rem;font-weight:650;text-decoration:none}
html body .home-hero-showcase .hero-all-categories:hover{color:#fff;text-decoration:underline}
html body .home-hero-showcase .hero-bottom{padding:18px 0 22px;display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid #b0d6eb30}
html body .home-hero-showcase .hero-bottom p{display:block!important;margin:0;color:#bed9e9;font-size:.72rem}
html body .home-hero-showcase .hero-bottom>a{color:#d1e8f5;font-size:.73rem;min-height:36px;display:flex;align-items:center;gap:14px}
html body .home-hero-showcase :is(a,button,select):focus-visible{outline:3px solid #e0f4b4;outline-offset:4px}
@media(max-width:1100px){html body .home-hero-showcase .hero-grid{gap:32px;align-items:start}html body .home-hero-showcase .home-brand-heading{font-size:4.2rem!important}html body .home-hero-showcase .hero-configurator{padding:16px}html body .home-hero-showcase .hero-configurator .button{padding:16px 13px}html body .home-hero-showcase .hero-stage-kicker{font-size:.6rem;top:19px;left:17px}html body .home-hero-showcase .vertical-label{max-width:57%;font-size:.62rem;right:17px}html body .home-hero-showcase .hero-showcase-hint{display:none}html body .home-hero-showcase .hero-showcase-footer{justify-content:center}}
@media(max-width:800px){html body .home-hero-showcase .hero-grid{grid-template-columns:1fr;gap:26px;padding:32px 0 28px}html body .home-hero-showcase .hero-introduction{max-width:600px}html body .home-hero-showcase .hero-showcase{width:100%;max-width:600px;justify-self:center}html body .home-hero-showcase .hero-stage-kicker{font-size:.69rem;left:22px}html body .home-hero-showcase .vertical-label{font-size:.67rem;right:20px;max-width:61%}html body .home-hero-showcase .hero-showcase-footer{justify-content:space-between}html body .home-hero-showcase .hero-showcase-hint{display:block}html body .home-hero-showcase .hero-bottom{flex-wrap:wrap}}
@media(max-width:480px){html body .home-hero-showcase .wrap{width:calc(100% - 36px)}html body .home-hero-showcase .hero-grid{padding-top:28px;gap:25px}html body .home-hero-showcase .eyebrow{font-size:.64rem;margin-bottom:14px}html body .home-hero-showcase .home-brand-heading{font-size:3.8rem!important}html body .home-hero-showcase .home-seo-title{font-size:1.45rem;margin-top:15px}html body .home-hero-showcase .home-brand-claim{font-size:.93rem;line-height:1.7}html body .home-hero-showcase .hero-configurator{padding:15px;border-radius:18px}html body .home-hero-showcase .hero-config-title{font-size:.84rem;gap:8px}html body .home-hero-showcase .hero-configurator .actions{gap:10px}html body .home-hero-showcase .hero-configurator .hero-config-tile{min-height:133px;padding:16px 12px;gap:12px}html body .home-hero-showcase .hero-configurator .hero-config-copy strong{font-size:.76rem}html body .home-hero-showcase .hero-configurator .hero-config-copy small{font-size:.65rem;line-height:1.45}html body .home-hero-showcase .hero-configurator .hero-config-hardware{padding:13px 12px;gap:12px}html body .home-hero-showcase .hero-showcase{border-radius:20px}html body .home-hero-showcase .product-stage{min-height:277px;padding:72px 24px 16px}html body .home-hero-showcase .product-stage img{height:203px}html body .home-hero-showcase .hero-stage-kicker{top:17px;left:18px;font-size:.58rem}html body .home-hero-showcase .vertical-label{top:40px;left:18px;right:auto;max-width:calc(100% - 36px);font-size:.61rem;padding:6px 9px}html body .home-hero-showcase .floating-note{padding:20px;min-height:150px}html body .home-hero-showcase .floating-note strong{font-size:1.17rem}html body .home-hero-showcase .floating-note #heroSub{font-size:.8rem}html body .home-hero-showcase .hero-showcase-footer{padding:13px 18px;gap:10px}html body .home-hero-showcase .slider-controls{gap:7px}html body .home-hero-showcase .hero-showcase-hint{display:none}html body .home-hero-showcase .hero-showcase-footer{justify-content:center}html body .home-hero-showcase .hero-shop-picker{padding:16px 18px}html body .home-hero-showcase .hero-bottom{gap:8px}html body .home-hero-showcase .hero-bottom p{font-size:.66rem}html body .home-hero-showcase .hero-bottom>a{font-size:.69rem}html body .home-hero-showcase .hero-consultation{font-size:.77rem}}
@media(max-width:360px){html body .home-hero-showcase .home-brand-heading{font-size:3.3rem!important}html body .home-hero-showcase .home-seo-title{font-size:1.3rem}html body .home-hero-showcase .hero-configurator .hero-config-copy strong{font-size:.69rem}html body .home-hero-showcase .hero-configurator .hero-config-copy small{font-size:.63rem}html body .home-hero-showcase .hero-configurator .hero-config-tile{padding:14px 10px}html body .home-hero-showcase .hero-configurator .hero-config-hardware .hero-config-copy strong{font-size:.76rem}}
@media(prefers-reduced-motion:reduce){html body .home-hero-showcase *{animation:none!important;transition:none!important}}
/* Override inherited first-action colours only inside the homepage configurator. */
html body main .home-hero-showcase.hero .hero-configurator .actions>a.button.hero-config-tile{background:linear-gradient(135deg,#0876a1,#075278)!important;color:#fff!important;border-color:#6fc4e3!important}
html body main .home-hero-showcase.hero .hero-configurator .actions>a.button.hero-config-tile[data-action-tone="green"]{background:linear-gradient(135deg,#caec9a,#aede73)!important;color:#123e4c!important;border-color:#d3efa9!important}
html body main .home-hero-showcase.hero .hero-configurator .actions>a.button.hero-config-hardware{background:linear-gradient(115deg,#114c69,#103e59)!important;color:#fff!important;border-color:#72b0c6!important}
html body main .home-hero-showcase.hero .hero-configurator .actions>a.button:hover{transform:none!important}
html body .home-hero-showcase .slider-controls button{width:44px;height:44px;min-width:44px;min-height:44px}
html body .home-hero-showcase .hero-shop-picker select{min-height:44px}
@media(max-width:480px){html body .home-hero-showcase .hero-configurator .hero-config-copy strong{font-size:.875rem}html body .home-hero-showcase .hero-configurator .hero-config-copy small{font-size:.75rem}}
html body .home-hero-showcase~* #hardware-kategorien,html body #hardware-kategorien{scroll-margin-top:150px}
@media(max-width:360px){html body .home-hero-showcase .hero-configurator .actions{grid-template-columns:1fr}html body .home-hero-showcase .hero-configurator .hero-config-tile{flex-direction:row;align-items:center;justify-content:flex-start;min-height:78px;padding:14px;gap:14px}html body .home-hero-showcase .hero-configurator .hero-config-copy strong{font-size:.875rem;white-space:normal}html body .home-hero-showcase .hero-configurator .hero-config-copy small{font-size:.75rem;white-space:normal}}
