.digital-roadmap{position:relative;isolation:isolate;display:grid;align-content:center;min-height:min(75svh, 42rem);padding:clamp(4.8rem,11vw,6rem) max(1rem,5vw);overflow:hidden;background:#eeeae2;color:#15120e}.digital-roadmap__aura{position:absolute;z-index:-1;top:38%;left:50%;width:min(78vw,70rem);aspect-ratio:1;border:1px solid rgba(139,99,35,.16);border-radius:50%;background:radial-gradient(circle,rgba(209,173,104,.19),transparent 62%);transform:translate(-50%,-50%)}.digital-roadmap__aura:before,.digital-roadmap__aura:after{content:"";position:absolute;inset:13%;border:1px solid rgba(139,99,35,.13);border-radius:50%}.digital-roadmap__aura:after{inset:29%;border-color:rgba(139,99,35,.2)}.digital-roadmap__header{width:min(100%,80rem);margin:0 auto clamp(2.9rem,7vw,4rem);text-align:center}.digital-roadmap__header .eyebrow{color:#8c662a}.digital-roadmap__header h2{margin:.8rem auto 1.4rem;font-size:clamp(1.95rem,3.52vw,3.25rem);letter-spacing:-.07em;line-height:1.15}.digital-roadmap__header h2 span{color:#9a7132}.digital-roadmap__header>p:last-child{max-width:51rem;margin:auto;color:#6b655b;font-size:clamp(.95rem,1.3vw,1.15rem);line-height:1.75}.digital-roadmap__map{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"web center social" "search center content" "campaign center care";gap:1rem;width:min(100%,88rem);margin:auto}.digital-roadmap__map:before,.digital-roadmap__map:after{content:"";position:absolute;z-index:-1;top:50%;left:50%;background:rgba(139,99,35,.22);transform:translate(-50%,-50%)}.digital-roadmap__map:before{width:72%;height:1px}.digital-roadmap__map:after{width:1px;height:80%}.digital-roadmap__node{display:grid;align-content:end;min-height:10rem;padding:1.2rem;border:1px solid rgba(25,20,13,.15);border-radius:1rem;background:rgba(250,248,243,.82);box-shadow:0 1rem 3rem rgba(69,50,22,.06);transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .35s,box-shadow .35s}.digital-roadmap__node:hover{z-index:3;border-color:rgba(154,113,50,.55);box-shadow:0 1.5rem 4rem rgba(69,50,22,.13);transform:translateY(-.35rem)}.digital-roadmap__node small{color:#98702f;font-size:.58rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.digital-roadmap__node strong{margin:.45rem 0;font-size:clamp(1.29rem,1.21vw,1.55rem);letter-spacing:-.04em}.digital-roadmap__node span{color:#716a60;font-size:.75rem;line-height:1.5}.digital-roadmap__node--web{grid-area:web}.digital-roadmap__node--social{grid-area:social}.digital-roadmap__node--search{grid-area:search}.digital-roadmap__node--content{grid-area:content}.digital-roadmap__node--campaign{grid-area:campaign}.digital-roadmap__node--care{grid-area:care}.digital-roadmap__center{grid-area:center;position:relative;display:grid;place-items:center;align-content:center;min-height:24.8rem;padding:2rem;overflow:hidden;border:1px solid rgba(229,198,124,.5);border-radius:50% 50% 46% 54%/49% 45% 55% 51%;background:#15120e;color:#fff;text-align:center;box-shadow:0 2rem 6rem rgba(40,28,10,.24),inset 0 0 0 1rem rgba(255,255,255,.025)}.digital-roadmap__center i{position:absolute;inset:10%;border:1px solid rgba(229,198,124,.25);border-radius:50%;animation:digital-roadmap-orbit 18s linear infinite}.digital-roadmap__center i:after{content:"";position:absolute;top:-.3rem;left:50%;width:.6rem;aspect-ratio:1;border-radius:50%;background:#e5c67c;box-shadow:0 0 1rem #e5c67c}.digital-roadmap__center small{color:#d7ba76;font-size:.58rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.digital-roadmap__center strong{margin:1rem 0;font-size:clamp(1.71rem,2.31vw,2.55rem);letter-spacing:-.065em;line-height:.86}.digital-roadmap__center span{color:#aaa198;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}.digital-roadmap__statement{display:grid;grid-template-columns:.35fr 1fr auto;gap:2rem;align-items:center;width:min(100%,88rem);margin:clamp(2.45rem,6vw,3.8rem) auto 0;padding-top:2rem;border-top:1px solid rgba(25,20,13,.18)}.digital-roadmap__statement>span{color:#936c30;font-size:.62rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}.digital-roadmap__statement p{max-width:48rem;margin:0;color:#655e54;line-height:1.7}.digital-roadmap__statement a{display:flex;gap:2rem;align-items:center;padding:.9rem 1rem;border-radius:999px;background:#15120e;color:#f3d895;font-size:.72rem;font-weight:800;white-space:nowrap}.digital-roadmap__statement b{font-size:1rem}@keyframes digital-roadmap-orbit{to{transform:rotate(360deg)}}@media(max-width:850px){.digital-roadmap{min-height:auto}.digital-roadmap__map{grid-template-columns:1fr 1fr;grid-template-areas:"center center" "web social" "search content" "campaign care"}.digital-roadmap__center{justify-self:center;width:min(82vw,28rem);min-height:auto;aspect-ratio:1}.digital-roadmap__map:before,.digital-roadmap__map:after{display:none}.digital-roadmap__statement{grid-template-columns:1fr}.digital-roadmap__statement a{justify-self:start}}@media(max-width:560px){.digital-roadmap{padding-inline:.7rem}.digital-roadmap__header h2{font-size:clamp(1.87rem,7.15vw,2.47rem)}.digital-roadmap__map{grid-template-columns:1fr;grid-template-areas:"center" "web" "social" "search" "content" "campaign" "care"}.digital-roadmap__center{width:min(88vw,24rem)}.digital-roadmap__node{min-height:8.5rem}.digital-roadmap__statement a{width:100%;justify-content:space-between;white-space:normal}}@media(prefers-reduced-motion:reduce){.digital-roadmap__center i{animation:none}.digital-roadmap__node{transition:none}}
/* Mehrere ruhige Umlaufbahnen betonen das Unternehmen im Zentrum. */
.digital-roadmap__center>i:nth-of-type(1){inset:8%;animation-duration:20s}
.digital-roadmap__center>i:nth-of-type(2){inset:18%;border-color:rgba(229,198,124,.2);animation-duration:15s;animation-direction:reverse}
.digital-roadmap__center>i:nth-of-type(3){inset:29%;border-color:rgba(229,198,124,.16);animation-duration:11s}
.digital-roadmap__center>i:nth-of-type(4){inset:39%;border-color:rgba(229,198,124,.12);animation-duration:8s;animation-direction:reverse}
.digital-roadmap__center>i:nth-of-type(2):after{left:auto;right:-.28rem;top:48%;width:.5rem}
.digital-roadmap__center>i:nth-of-type(3):after{top:auto;bottom:-.25rem;left:34%;width:.48rem}
.digital-roadmap__center>i:nth-of-type(4):after{top:25%;left:-.2rem;width:.4rem}
