@import url('/service-shell.css');
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#F7F7F4;color:#0E0E12;font:16px/1.6 'IBM Plex Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
main{position:relative;z-index:1}
a{color:#11639C}
a:focus-visible,summary:focus-visible{outline:2px solid #11639C;outline-offset:4px}
h1,h2,h3{font-family:'Archivo',system-ui,sans-serif;font-weight:800;letter-spacing:-.01em;line-height:1.05}
.process-wrap{width:min(100% - 2 * clamp(20px,5vw,48px),1184px);margin-inline:auto}
.service-footer{background:rgba(247,247,244,.74);backdrop-filter:blur(12px)}

.orbital-hero{position:relative;isolation:isolate;min-height:calc(100svh - 74px);overflow:hidden;background:#050912;color:#fff}
.orbital-frame{position:absolute;inset:0;z-index:0;overflow:hidden}
.orbital-host{position:absolute;inset:0 0 0 25%;background:#050912 url('/assets/digitalisierung-orbit-desktop.webp') center/cover no-repeat}
.orbital-host>div{position:relative;width:100%;height:100%;overflow:hidden}
.orbital-host canvas{position:absolute;inset:0;width:100%;height:100%}
.orbital-hero:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#050912 0%,rgba(5,9,18,.98) 21%,rgba(5,9,18,.85) 39%,rgba(5,9,18,.22) 64%,transparent 100%)}
.orbital-hero-inner{position:relative;z-index:2;display:flex;align-items:center;min-height:calc(100svh - 74px);width:min(100% - 2 * clamp(20px,5vw,48px),1280px);margin:auto;padding:clamp(55px,8vh,110px) 0}
.orbital-copy{width:min(50%,610px)}
.orbital-copy h1{max-width:12ch;margin:0;font-size:clamp(36px,5vw,66px)}
.orbital-copy>p{max-width:47ch;margin:32px 0 36px;color:#D5E0EA;font-size:clamp(16px,1.9vw,19px);line-height:1.6}
.process-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:13px 27px;border-radius:100px;text-decoration:none;font:600 16px/1.2 'Archivo',sans-serif;transition:transform .25s ease,box-shadow .25s ease}
.process-button:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(0,207,255,.25)}

.moment-section,.journey-section,.faq-section,.process-next{position:relative;background:transparent}
.moment-section{padding:clamp(90px,12vw,170px) 0}
.section-intro{max-width:850px;margin-bottom:clamp(52px,7vw,100px)}
.section-intro h2{max-width:18ch;margin:0;font-size:clamp(32px,4.6vw,56px)}
.section-intro p{max-width:60ch;margin:25px 0 0;color:#34434A;font-size:clamp(17px,1.5vw,20px)}
.moment-list{display:grid;gap:clamp(28px,4vw,52px)}
.moment-card{display:grid;grid-template-columns:1.04fr .96fr;min-height:360px;overflow:hidden;border:1px solid rgba(14,14,18,.13);border-radius:26px;background:rgba(255,255,255,.88);box-shadow:0 25px 70px -57px rgba(14,14,18,.42);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.moment-card:hover{transform:translateY(-4px);border-color:rgba(14,14,18,.32);box-shadow:0 35px 70px -50px rgba(14,14,18,.34)}
.moment-card:nth-child(even) .moment-visual{order:2}
.moment-card:nth-child(even) .moment-copy{order:1}
.moment-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(30px,5vw,70px)}
.moment-number{display:block;margin-bottom:35px;color:#626A70;font:700 13px 'IBM Plex Mono',monospace}
.moment-copy h3{max-width:16ch;margin:0 0 23px;font-size:clamp(30px,3.2vw,46px)}
.moment-copy p{max-width:45ch;margin:0;color:#34434A;font-size:clamp(17px,1.4vw,19px)}
.moment-visual{position:relative;display:flex;align-items:center;justify-content:center;gap:0;min-height:360px;padding:35px;overflow:hidden;background:linear-gradient(145deg,#E9EBEB,#DDE3E5)}
.moment-visual:before{content:'';position:absolute;inset:24px;border:1px solid rgba(14,14,18,.08);border-radius:18px}
.visual-document{position:relative;width:42%;max-width:210px;padding:25px 22px 30px;border:1px solid #BFC7CB;border-radius:12px;background:#fff;box-shadow:0 18px 40px -30px rgba(14,14,18,.4);transform:rotate(-4deg);transition:transform .35s ease}
.visual-document-second{transform:rotate(4deg)}
.moment-card:hover .visual-document{transform:rotate(-2deg) translateY(-5px)}
.moment-card:hover .visual-document-second{transform:rotate(2deg) translateY(-5px)}
.visual-document span,.visual-approval span{display:block;margin-bottom:30px;color:#555D63;font:700 13px 'IBM Plex Sans',sans-serif}
.visual-document i{display:block;height:8px;margin-top:13px;border-radius:4px;background:#DCE1E3}
.visual-document i:nth-child(3){width:70%}.visual-document i:nth-child(4){width:86%}
.visual-bridge{z-index:1;width:13%;height:2px;background:#1474B8;box-shadow:0 0 0 4px rgba(20,116,184,.08)}
.visual-approval{position:relative;width:min(100%,340px);padding:35px;border:1px solid #C2CACE;border-radius:16px;background:#fff;box-shadow:0 22px 48px -35px rgba(14,14,18,.35)}
.visual-approval span{margin:0 0 22px}
.visual-approval-line{width:100%;height:1px;margin-bottom:27px;background:#D5DADD}
.visual-approval strong{font:700 clamp(23px,2vw,30px) 'Archivo',sans-serif}
.visual-approval-dots{display:flex;gap:9px;margin-top:38px}
.visual-approval-dots i{width:13px;height:13px;border-radius:50%;background:#B7C2C7}
.visual-approval-dots i:first-child{background:#0E0E12}
.visual-approval-dots i:last-child{border:1px solid #A9B4B9;background:#fff}
.visual-status{position:relative;width:min(100%,360px);padding:18px;border:1px solid #C2CACE;border-radius:16px;background:#fff;box-shadow:0 22px 48px -35px rgba(14,14,18,.35)}
.visual-status>div{display:flex;align-items:center;gap:16px;min-height:66px;padding:10px 15px;border-bottom:1px solid #E4E7E9}
.visual-status>div:last-child{border-bottom:0}
.visual-status span{color:#767E83;font:700 12px 'IBM Plex Mono',monospace}
.visual-status strong{flex:1;font:700 16px 'IBM Plex Sans',sans-serif}
.visual-status i{width:13px;height:13px;border:1px solid #A8B3B8;border-radius:50%}
.visual-status>div:first-child i{border-color:#0E0E12;background:#0E0E12}
.visual-status .visual-status-open{margin:0 -8px;padding-inline:23px;border-radius:9px;background:#ECEFF0}
.visual-status-open i{border:2px solid #1474B8}

.journey-section{padding:clamp(100px,12vw,170px) 0}
.journey-layout{display:grid;grid-template-columns:minmax(240px,.78fr) minmax(0,1.22fr);gap:clamp(45px,7vw,120px)}
.journey-heading{position:sticky;top:130px;align-self:start}
.journey-heading h2{max-width:10ch;margin:0;font-size:clamp(32px,4.6vw,56px)}
.journey-heading p{max-width:36ch;margin:25px 0 38px;color:#4C5960;font-size:18px}
.journey-progress{width:3px;height:150px;border-radius:2px;background:#D5DADD}
.journey-progress span{display:block;width:100%;height:var(--journey-progress,0%);border-radius:2px;background:#343A40;transition:height .15s linear}
.journey-steps{display:grid;gap:26px}
.process-section{position:relative;min-height:350px;padding:clamp(30px,4vw,55px);overflow:hidden;border:1px solid rgba(14,14,18,.12);border-radius:24px;background:rgba(255,255,255,.88);box-shadow:0 18px 55px -48px rgba(14,14,18,.45)}
.process-section-number{display:block;margin-bottom:55px;color:#626A70;font:700 13px 'IBM Plex Mono',monospace;letter-spacing:.12em}
.process-section h3{max-width:17ch;margin:0 0 22px;font-size:clamp(29px,3vw,42px)}
.process-section p{max-width:57ch;margin:0 0 16px;color:#34434A;font-size:17px;line-height:1.65}
.process-section p:last-child{margin-bottom:0}

.faq-section{padding:clamp(85px,10vw,130px) 0}
.faq-layout{display:grid;grid-template-columns:minmax(230px,.75fr) minmax(0,1.25fr);gap:50px}
.faq-layout h2{max-width:12ch;margin:0;font-size:clamp(32px,4.6vw,56px)}
.faq-list{display:grid;gap:14px}
.process-question{padding:0 27px;border:1px solid rgba(14,14,18,.14);border-radius:16px;background:rgba(255,255,255,.86);transition:border-color .25s ease,box-shadow .25s ease}
.process-question.nv-glanz{border-radius:16px}
.process-question:has(summary:focus-visible){outline:2px solid #11639C;outline-offset:4px}
.process-question:hover,.process-question[open]{border-color:rgba(14,14,18,.38);box-shadow:0 12px 30px -24px rgba(14,14,18,.5)}
.process-question summary{position:relative;padding:25px 42px 25px 0;cursor:pointer;list-style:none;font:700 20px/1.35 'Archivo',sans-serif}
.process-question summary::-webkit-details-marker{display:none}
.process-question summary:after{content:'+';position:absolute;right:0;top:22px;color:#343A40;font:400 28px/1 'IBM Plex Sans',sans-serif}
.process-question[open] summary:after{content:'−'}
.process-question p{max-width:68ch;margin:0;padding:0 0 27px;color:#34434A;font-size:17px}

.process-next{padding:clamp(56px,8vw,104px) 0}
.process-next-inner{position:relative;overflow:hidden;border-radius:32px;background:linear-gradient(120deg,#0E0E12,#122A44);padding:clamp(40px,6vw,84px) clamp(24px,5vw,56px);text-align:center;color:#fff}
.process-next-glow{position:absolute;top:-45%;left:50%;width:72%;height:130%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(0,207,255,.28),transparent 65%);pointer-events:none}
.process-next-copy{position:relative;z-index:1;max-width:620px;margin:auto}
.process-next h2{margin:0;font-size:clamp(32px,4.6vw,56px)}
.process-next p{margin:18px 0 34px;color:rgba(255,255,255,.82);font-size:clamp(16px,1.9vw,19px)}
.process-next a{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:16px 34px;border-radius:999px;text-decoration:none;font:600 16px 'Archivo',sans-serif}

.has-scroll-effects [data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.has-scroll-effects [data-reveal].is-visible{opacity:1;transform:none}
@media(max-width:900px){
  .orbital-host{left:15%}.orbital-hero:after{background:linear-gradient(90deg,#050912 0%,rgba(5,9,18,.93) 34%,rgba(5,9,18,.35) 75%,transparent)}
  .orbital-copy{width:min(60%,570px)}
  .moment-card{min-height:320px}.moment-visual{min-height:320px}.moment-number{margin-bottom:25px}
  .journey-layout{grid-template-columns:1fr}.journey-heading{position:static}.journey-heading h2{max-width:16ch}.journey-progress{display:none}
}
@media(max-width:720px){
  body{font-family:'Chakra Petch',system-ui,sans-serif}
  h1,h2,h3{font-family:'Chakra Petch',system-ui,sans-serif;letter-spacing:-.02em;line-height:1.08}
  .process-button,.process-next a{font-family:'Chakra Petch',system-ui,sans-serif}
}
@media(max-width:650px){
  .orbital-hero,.orbital-hero-inner{min-height:calc(100svh - 74px)}
  
  .orbital-hero-inner{align-items:center;padding:clamp(52px,9vh,80px) 0}
  .orbital-copy{text-shadow:0 2px 18px rgba(5,9,18,.85)}
  .orbital-copy{width:100%;max-width:520px}
  .orbital-copy h1{max-width:12ch;font-size:clamp(32px,8vw,48px);line-height:1.04}
  .orbital-copy>p{max-width:39ch;margin:24px 0 27px;font-size:17px}
  .orbital-host{inset:0 -20%;background-image:url('/assets/digitalisierung-orbit-mobile.webp')}
  .orbital-hero:after{background:linear-gradient(180deg,rgba(5,9,18,.55) 0%,rgba(5,9,18,.62) 50%,rgba(5,9,18,.4) 100%)}
  .moment-section{padding:85px 0}.section-intro{margin-bottom:45px}.section-intro h2{font-size:39px}
  .moment-list{gap:24px}.moment-card{display:flex;flex-direction:column;min-height:0;border-radius:22px}
  .moment-card:nth-child(even) .moment-visual,.moment-card:nth-child(even) .moment-copy{order:initial}
  .moment-visual{min-height:0;aspect-ratio:1.5;padding:25px}
  .moment-copy{padding:29px 27px 36px}.moment-number{margin-bottom:22px}.moment-copy h3{font-size:32px}
  .journey-section{padding:90px 0}.journey-heading h2{font-size:39px}.journey-heading p{font-size:17px}
  .process-section{min-height:0;padding:32px 27px}.process-section-number{margin-bottom:35px}.process-section h3{font-size:30px}
  .faq-section{padding:85px 0}.faq-layout{grid-template-columns:1fr;gap:35px}.faq-layout h2{font-size:39px}.process-question summary{font-size:18px}
  .process-next-inner{border-radius:24px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .moment-card,.visual-document,.process-button,.has-scroll-effects [data-reveal]{animation:none!important;transition:none!important}
  .has-scroll-effects [data-reveal]{opacity:1;transform:none}
}
