/* Responsive typography: shared across both themes. */
body{font-size:17px;line-height:1.6;text-size-adjust:100%;-webkit-text-size-adjust:100%}
.header nav{font-size:15px;line-height:1.4}
.theme-switch button{font-size:13px;line-height:1.4}
.eyebrow{font-size:12px;line-height:1.6;letter-spacing:.13em}
.hero h1{font-size:clamp(44px,6.8vw,102px);line-height:1.08;letter-spacing:-.045em}
.hero-content>p{font-size:clamp(17px,1.35vw,20px);line-height:1.75}
.hero-content>.hero-slogan{font-size:clamp(20px,1.8vw,26px);line-height:1.45}
.button,.text-link{font-size:16px;line-height:1.5}
.hero-product-line a{font-size:22px;line-height:1.3}
.hero-product-line span{font-size:12px;letter-spacing:.1em;line-height:1.5}
.hero-bottom,.hero-bottom button{font-size:13px;line-height:1.5}
h2,.product-copy h2,.composition-chooser h2{font-size:clamp(36px,4vw,60px);line-height:1.15;letter-spacing:-.035em}
.composition-gallery h2,#devinote h2,.composition-contact h2{font-size:clamp(38px,4.8vw,72px);line-height:1.15;letter-spacing:-.035em}
.section-top>p,.product-copy>p,.about-copy>p,.inquiry-intro>p{font-size:18px;line-height:1.8}
.composition-gallery .product-index h3{font-size:clamp(28px,2.6vw,36px);line-height:1.2;letter-spacing:-.025em}
.product-index p,.composition-gallery .product-index p{font-size:16px;line-height:1.65}
.product-meta,.gallery-kicker,.service-number{font-size:12px;line-height:1.6;letter-spacing:.1em}
.product-points,#devinote .product-points{font-size:16px;line-height:1.65}
.zoom-hint,figcaption,.sub-link{font-size:14px;line-height:1.6}
.note-flow,#devinote .note-flow{font-size:15px;line-height:1.6}
.document-caption{font-size:12px;line-height:1.6;letter-spacing:.07em}
.channel-grid>span,#devitermine .channel-grid>span{font-size:16px;line-height:1.5}
.channel-grid b,#devitermine .channel-grid b{font-size:13px;line-height:1.4}
.choice-list>a,.composition-chooser .choice-list strong{font-size:16px;line-height:1.6}
.service-card h3,.composition-bento .service-card h3{font-size:28px;line-height:1.25;letter-spacing:-.025em}
.composition-bento .service-card:first-child h3{font-size:clamp(30px,3vw,38px);line-height:1.2}
.service-card p,.steps p,.composition-timeline .steps p{font-size:17px;line-height:1.75}
.service-card>a{font-size:15px;line-height:1.6}
.about-facts span{font-size:15px;line-height:1.6}
.core>span:last-child,.orbit-label,.editorial-year>span{font-size:11px;line-height:1.6;letter-spacing:.1em}
.steps h3,.composition-timeline .steps h3{font-size:25px;line-height:1.3}
.contact-direct a,.composition-contact .contact-direct>a{font-size:17px;line-height:1.6}
.contact-direct p,.composition-contact .contact-direct>p{font-size:14px;line-height:1.7}
.interest-field,.form-grid label{font-size:16px;line-height:1.6}
.interest-field select,.form-grid input,.form-grid textarea{font-size:17px;line-height:1.5}
.consent,.form-note,#form-status{font-size:14px;line-height:1.75}
.footer-main p,.footer-main>div{font-size:16px;line-height:1.6}
.footer-bottom{font-size:14px;line-height:1.7}
.preview-header h2{font-size:20px;line-height:1.3}
dialog p{font-size:14px;line-height:1.6}
.chat-float{font-size:16px;line-height:1.6}
.chat-float span,.appointment-float{font-size:12px;line-height:1.5;letter-spacing:.07em}
.chat-float-two{font-size:15px}
.appointment-float strong{font-size:16px;line-height:1.4}
@media(min-width:851px) and (max-width:1100px){
 .header nav{font-size:13px}
 .theme-switch button{font-size:12px}
}
@media(max-width:850px){
 .header nav{font-size:17px}
 .hero h1{font-size:clamp(40px,7.5vw,64px)}
 .section-top>p,.product-copy>p,.about-copy>p,.inquiry-intro>p{font-size:17px}
 .note-flow,#devinote .note-flow{flex-wrap:wrap}
 .product-meta{flex-wrap:wrap}
}
@media(max-width:600px){
 body{font-size:16px}
 .hero h1{font-size:clamp(36px,10vw,58px);line-height:1.12;letter-spacing:-.045em}
 .eyebrow{font-size:11px;letter-spacing:.09em}
 .hero-content>p{font-size:17px;line-height:1.7}
 .hero-content>.hero-slogan{font-size:20px}
 h2,.product-copy h2,.composition-gallery h2,#devinote h2,.composition-contact h2,.composition-chooser h2{font-size:clamp(32px,8.4vw,44px);line-height:1.18}
 .hero-product-line a{font-size:19px}
 .hero-product-line span{font-size:11px;letter-spacing:.035em}
 .hero-bottom,.hero-bottom button{font-size:12px;letter-spacing:0}
 .composition-gallery .product-index h3{font-size:28px}
 .product-index p,.composition-gallery .product-index p{font-size:16px}
 .product-meta,.gallery-kicker,.service-number{font-size:12px;letter-spacing:.06em}
 .document-caption{font-size:11px;letter-spacing:.02em;flex-wrap:wrap}
 #devitermine .channel-grid>span{font-size:14px;overflow-wrap:anywhere}
 #devitermine .channel-grid b{font-size:12px}
 .service-card h3,.composition-bento .service-card h3{font-size:26px}
 .composition-bento .service-card:first-child h3{font-size:30px}
 .composition-timeline .steps h3{font-size:24px}
 .interest-field select,.form-grid input,.form-grid textarea{font-size:16px}
 .contact-direct a,.composition-contact .contact-direct>a{font-size:16px;overflow-wrap:anywhere}
 .footer-main>div{font-size:15px}
 .chat-float-one,.chat-float-two{font-size:13px}
 .chat-float span{font-size:11px}
 .appointment-float strong{font-size:14px}
 .appointment-float{font-size:11px}
}

/* Section 03: readable bullet copy at desktop and mobile sizes. */
#ueber .about-points{padding-left:1.25em;margin:25px 0 28px;font-size:18px;line-height:1.8;color:var(--muted)}#ueber .about-points li+li{margin-top:18px}#ueber .about-points li::marker{color:var(--blue)}@media(max-width:850px){#ueber .about-points{font-size:17px}}

/* Section 02 only: services and supporting photo. */
#leistungen .services-intro{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(28px,5vw,80px);margin-bottom:48px}
#leistungen .services-lead{font-size:clamp(18px,1.6vw,23px);line-height:1.65;color:var(--muted);margin-top:26px;max-width:580px}
#leistungen .services-photo{margin:0;overflow:hidden;border-radius:24px}
#leistungen .services-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
#leistungen .services-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
#leistungen .services-detail{min-width:0;padding:clamp(24px,2.5vw,38px);border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,rgba(1,193,247,.08),transparent 70%),var(--surface)}
#leistungen .services-index{font-size:14px;font-weight:600;letter-spacing:.1em;color:var(--blue);display:block;margin-bottom:24px}
#leistungen .services-detail h3{font-size:clamp(24px,2vw,29px);font-weight:500;line-height:1.25;letter-spacing:-.025em;overflow-wrap:break-word;margin:0 0 20px}
#leistungen .services-detail p{font-size:17px;line-height:1.75;color:var(--muted);margin:0 0 26px}
#leistungen .services-detail ul{padding-left:1.1em;margin:0;font-size:16px;line-height:1.7;color:var(--muted)}
#leistungen .services-detail li+li{margin-top:20px}
#leistungen .services-detail li::marker{color:var(--blue)}
#leistungen .services-detail strong{font-weight:600;color:var(--ink)}
@media(min-width:1600px){#leistungen .services-detail h3{font-size:29px}}
@media(max-width:1100px){#leistungen .services-detail-grid{grid-template-columns:1fr}#leistungen .services-detail{display:grid;grid-template-columns:1fr 1.4fr;column-gap:36px}#leistungen .services-index,#leistungen .services-detail h3,#leistungen .services-detail p{grid-column:1}#leistungen .services-detail ul{grid-column:2;grid-row:1/4}#leistungen .services-detail p{margin-bottom:0}}
@media(max-width:650px){#leistungen .services-intro{grid-template-columns:1fr;gap:28px;margin-bottom:28px}#leistungen .services-detail{display:block;padding:26px 22px}#leistungen .services-index{margin-bottom:18px}#leistungen .services-detail h3{font-size:26px}#leistungen .services-detail p{margin-bottom:24px}#leistungen .services-detail-grid{gap:20px}#leistungen .services-photo{border-radius:18px}}

/* Section 02: flowing lines, light and tactile motion. */
#leistungen .services-scene .gradient-lines{opacity:.4}
#leistungen .services-scene .orb-indigo{background:radial-gradient(circle,rgba(1,193,247,.22),transparent 65%)}
#leistungen .services-scene .gradient-ring{opacity:.3}
#leistungen .services-detail{position:relative;transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
#leistungen .services-detail:before{content:"";position:absolute;top:0;left:12%;right:12%;height:2px;background:linear-gradient(90deg,transparent,#01C1F7,#007AC1,transparent);opacity:.65;transform-origin:left;animation:services-line-glow 7s ease-in-out infinite}
#leistungen .services-detail:nth-child(2):before{animation-delay:-2s}
#leistungen .services-detail:nth-child(3):before{animation-delay:-4s}
#leistungen .services-index{transition:transform .35s ease}
#leistungen .services-photo img{transition:transform .8s ease}
#leistungen .services-photo{box-shadow:0 22px 70px rgba(1,193,247,.12)}
@media(hover:hover) and (pointer:fine){#leistungen .services-detail:hover{transform:translateY(-6px);border-color:rgba(1,193,247,.6);box-shadow:0 18px 50px rgba(1,193,247,.12)}#leistungen .services-detail:hover .services-index{transform:translateX(5px)}#leistungen .services-photo:hover img{transform:scale(1.035)}}
html[data-theme=light] #leistungen .services-scene .gradient-lines{opacity:.24}
@keyframes services-line-glow{0%,100%{opacity:.35;transform:scaleX(.75)}50%{opacity:.95;transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){#leistungen .services-detail:before{animation:none}#leistungen .services-detail,#leistungen .services-index,#leistungen .services-photo img{transition:none}}

/* New customer section: static responsive grid, no carousel. */
#vertrauen .customer-heading{text-align:center;margin-bottom:48px}
#vertrauen .eyebrow{justify-content:center}
#vertrauen h2{font-size:clamp(34px,4vw,58px);line-height:1.2}
#vertrauen h2 em{color:var(--blue)}
#vertrauen .customer-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
#vertrauen .customer-tile{min-width:0;min-height:170px;padding:28px;display:flex;align-items:center;justify-content:center;border-radius:18px;background:#FFFFFF;border:1px solid var(--line)}
#vertrauen .customer-tile>img{display:block;max-width:100%;width:auto;height:auto;max-height:104px;object-fit:contain}
#vertrauen .customer-tile-navy{background:#042240;border-color:rgba(148,163,184,.35)}
#vertrauen .customer-georgi{display:flex;align-items:center;justify-content:center;gap:18px;width:100%;color:#042240}
#vertrauen .customer-georgi img{width:70px;height:110px;object-fit:contain}
#vertrauen .customer-georgi span{font-size:16px;line-height:1.5}
#vertrauen .customer-georgi strong{display:block;font-size:25px;font-weight:500}
#vertrauen .customer-name>span{font-size:25px;line-height:1.3;text-align:center;color:#042240;font-family:Georgia,serif}
#vertrauen .customer-name strong{display:block;font-size:30px;font-weight:500;letter-spacing:.05em}
@media(max-width:750px){#vertrauen .customer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#vertrauen .customer-tile{min-height:150px;padding:22px}#vertrauen .customer-heading{margin-bottom:32px}#vertrauen .customer-georgi{flex-direction:column;gap:8px;text-align:center}#vertrauen .customer-georgi img{height:70px;width:50px}#vertrauen .customer-georgi span{font-size:14px}#vertrauen .customer-georgi strong{font-size:22px}}
@media(max-width:380px){#vertrauen .customer-grid{grid-template-columns:1fr}#vertrauen .customer-tile{min-height:140px}}

/* Section 01: brighter KI product overview, scoped to this section. */
#produkte.ai-products-section{background:radial-gradient(ellipse at 50% 25%,rgba(1,193,247,.18),transparent 70%),var(--charcoal)}
#produkte .ai-products-heading{max-width:1000px;margin:0 auto 48px;text-align:center}
#produkte .ai-products-heading .eyebrow{justify-content:center}
#produkte .ai-products-heading h2{font-size:clamp(34px,4vw,58px);line-height:1.2;letter-spacing:-.035em}
#produkte .ai-products-heading h2 em{color:#01C1F7}
#produkte .ai-products-heading>p{font-size:18px;line-height:1.75;color:var(--muted);max-width:740px;margin:26px auto 0}
#produkte .ai-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
#produkte .ai-product-card{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;min-width:0;padding:0;overflow:hidden;border-radius:24px;border:1px solid rgba(1,193,247,.4);background:linear-gradient(155deg,rgba(1,193,247,.14),rgba(229,246,254,.04) 65%);box-shadow:0 12px 45px rgba(1,193,247,.08);transition:transform .4s ease,box-shadow .4s ease,border-color .4s ease}
#produkte .ai-product-picture{position:relative;padding:20px 20px 0;background:linear-gradient(130deg,rgba(1,193,247,.3),rgba(16,185,129,.1));overflow:hidden}
#produkte .ai-product-picture:after{content:"";position:absolute;inset:-100% -70%;pointer-events:none;background:linear-gradient(110deg,transparent 44%,rgba(255,255,255,.22) 50%,transparent 56%);animation:ai-product-sheen 13s ease-in-out infinite}
#produkte .ai-product-card:nth-child(2) .ai-product-picture:after{animation-delay:-4s}
#produkte .ai-product-card:nth-child(3) .ai-product-picture:after{animation-delay:-8s}
#produkte .ai-product-picture img{display:block;width:100%;height:auto;aspect-ratio:1.5;object-fit:cover;object-position:top;border-radius:12px 12px 0 0;box-shadow:0 0 28px rgba(1,193,247,.18);transition:transform .6s ease}
#produkte .ai-product-body{padding:28px;flex:1}
#produkte .ai-product-kicker{font-size:12px;line-height:1.6;letter-spacing:.07em;color:#01C1F7}
#produkte .ai-product-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0 20px}
#produkte .ai-product-title h3{font-size:34px;line-height:1.2;font-weight:500;letter-spacing:-.035em}
#produkte .ai-product-title>span{font-size:28px;line-height:1;color:#01C1F7;transition:transform .35s ease}
#produkte .ai-product-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
#produkte .ai-product-tags span{font-size:12px;line-height:1.5;padding:6px 10px;border-radius:30px;color:#E5F6FE;background:rgba(1,193,247,.12);border:1px solid rgba(1,193,247,.25)}
#produkte .ai-product-body p{font-size:16px;line-height:1.75;max-width:none;margin:0;color:var(--muted)}
#produkte .ai-product-body strong{display:block;color:var(--ink);font-weight:600;margin-bottom:12px}
#produkte .gradient-lines{opacity:.45}
#produkte .gradient-ring{opacity:.45}
html[data-theme=light] #produkte.ai-products-section{background:radial-gradient(ellipse at 50% 20%,rgba(1,193,247,.14),transparent 70%),#E5F6FE}
html[data-theme=light] #produkte .ai-product-card{background:linear-gradient(145deg,rgba(1,193,247,.07),transparent 60%),#FFFFFF}
html[data-theme=light] #produkte .ai-product-tags span{color:#042240;background:rgba(1,193,247,.09)}
html[data-theme=light] #produkte .ai-product-kicker{color:#007AC1}
@media(hover:hover) and (pointer:fine){#produkte .ai-product-card:hover{transform:translateY(-8px);border-color:#01C1F7;box-shadow:0 20px 55px rgba(1,193,247,.2)}#produkte .ai-product-card:hover .ai-product-picture img{transform:translateY(-4px)}#produkte .ai-product-card:hover .ai-product-title>span{transform:translate(3px,-3px)}}
@keyframes ai-product-sheen{0%,65%{transform:translateX(-60%)}90%,100%{transform:translateX(60%)}}
@media(min-width:701px) and (max-width:1100px){#produkte .ai-product-grid{grid-template-columns:1fr}#produkte .ai-product-card{display:grid;grid-template-columns:.8fr 1.2fr}#produkte .ai-product-picture{padding:22px;display:flex;align-items:center}#produkte .ai-product-picture img{border-radius:12px}}
@media(max-width:700px){#produkte .ai-product-grid{grid-template-columns:1fr;gap:24px}#produkte .ai-products-heading{margin-bottom:32px}#produkte .ai-products-heading>p{font-size:17px}#produkte .ai-product-title h3{font-size:32px}#produkte .ai-product-body{padding:25px}#produkte .ai-product-picture{padding:18px 18px 0}}
@media(prefers-reduced-motion:reduce){#produkte .ai-product-picture:after{animation:none;display:none}#produkte .ai-product-card,#produkte .ai-product-picture img,#produkte .ai-product-title>span{transition:none}}

/* Emphasize the three product category titles only. */
#produkte .ai-product-kicker{display:inline-block;max-width:100%;font-size:clamp(14px,1.15vw,16px);font-weight:700;line-height:1.5;letter-spacing:.045em;color:#01C1F7;background:rgba(1,193,247,.12);border-left:3px solid #01C1F7;padding:9px 12px;border-radius:0 8px 8px 0}
html[data-theme=light] #produkte .ai-product-kicker{color:#042240;background:rgba(1,193,247,.16)}

/* Preserve the full supplied screenshots inside the product thumbnails. */
#produkte.ai-products-section .ai-product-picture img{object-fit:contain;object-position:center;background:rgba(229,246,254,.05)}

/* Read more links beneath the three product summaries. */
#produkte .ai-product-body{display:flex;flex-direction:column}
#produkte .ai-product-kicker{align-self:flex-start}
#produkte .product-read-more{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:auto;padding-top:26px;font-size:16px;font-weight:600;line-height:1.5;color:#01C1F7;text-decoration:underline;text-underline-offset:5px}
#produkte .product-read-more>span{font-size:23px;text-decoration:none}
html[data-theme=light] #produkte .product-read-more{color:#007AC1}

/* More transparent hero overlay in both themes, including mobile. */
.hero .hero-shade{background:linear-gradient(90deg,rgba(4,34,64,.7),rgba(4,34,64,.5) 48%,rgba(4,34,64,.2)),linear-gradient(0deg,#042240,transparent 32%)}
html[data-theme=light] .hero .hero-shade{background:linear-gradient(90deg,rgba(229,246,254,.8),rgba(229,246,254,.65) 48%,rgba(229,246,254,.3)),linear-gradient(0deg,#E5F6FE,transparent 32%)}

#produkte .ai-products-heading h2 .product-heading-description{display:block;font-size:clamp(22px,2.25vw,30px);line-height:1.5;letter-spacing:-.015em;max-width:950px;margin:22px auto 0}