/* Dinagentic GmbH - dinagentic-website */
body{margin:0;background:#FFFFFF;color:#000000;font-family:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:500}
a{color:#1E6FB8}a:hover{color:#33258E}
.dg-wrap{max-width:1304px;margin:0 auto;padding-left:clamp(1.25rem,0.6rem + 2.6vw,3rem);padding-right:clamp(1.25rem,0.6rem + 2.6vw,3rem);box-sizing:border-box}
.dg-btn{display:inline-flex;align-items:center;justify-content:center;gap:1.25rem;min-height:48px;padding:0 26px;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:16px;text-decoration:none;border:2px solid #33258E;box-sizing:border-box}
.dg-btn--solid{background:#33258E;color:#FFFFFF}.dg-btn--solid:hover{background:#281D72;border-color:#281D72;color:#FFFFFF}
.dg-btn--ghost{background:transparent;color:#FFFFFF;border-color:rgba(255,255,255,.55)}.dg-btn--ghost:hover{border-color:#FFFFFF;color:#FFFFFF}
.dg-nav a{color:#FFFFFF;text-decoration:none}.dg-nav a:hover{color:#65B7F4}
.dg-foot a{color:#FFFFFF;text-decoration:none}.dg-foot a:hover{color:#65B7F4}
.dg-tiles{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.dg-tile{background:#FFFFFF;color:#000000;border:1px solid rgba(0,0,0,.12);padding:clamp(.8rem,.55rem + .7vw,1.05rem);display:flex;flex-direction:column;gap:.55rem}
.dg-tile svg{width:32px;height:32px;flex:none}
.dg-tile h2{margin:0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(1.0625rem,.95rem + .45vw,1.25rem);line-height:1.25}
.dg-tile p{margin:0;font-size:1.0625rem;line-height:1.5}
@media (max-width:1200px){.dg-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.dg-tiles{grid-template-columns:1fr}}
.contact__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.62fr);gap:clamp(2rem,1rem + 4vw,4.5rem);align-items:start}
.contact__claim{margin:clamp(1rem,.5rem + 1.5vw,2rem) 0 0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(1.5rem,1.24rem + .78vw,1.875rem);line-height:1.33}
.contact__rule{display:block;width:310px;max-width:60%;height:7px;background:#C18BF0;margin-top:clamp(1.25rem,.7rem + 1.6vw,2.25rem)}
.contact__aside{position:sticky;top:40px}
.contact__aside img{display:block;width:100%;height:auto;max-height:640px;object-fit:cover}
.contact__direct{margin:clamp(1.5rem,1rem + 1.5vw,2.25rem) 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:1rem 2.25rem}
.contact__direct li{display:flex;align-items:center;gap:.9rem}
.contact__icon{flex:0 0 auto;width:24px;height:24px;color:#33258E}
.contact__direct a{color:#1E6FB8;text-decoration:none}.contact__direct a:hover{text-decoration:underline}
.contact__hinweis{margin:.9rem 0 0;max-width:62ch;font-size:.85em;color:#5B5A6B}
.contact-form{margin-top:clamp(2rem,1rem + 3vw,3.5rem);display:flex;flex-direction:column;gap:1.5rem}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.field{margin:0;display:flex;flex-direction:column;gap:.5rem}
.contact-form input[type="text"],.contact-form input[type="email"],.contact-form textarea{width:100%;box-sizing:border-box;min-height:55px;padding:.85rem 1.1rem;background:#E8E8E8;border:2px solid transparent;border-radius:0;font-family:"Barlow",system-ui,sans-serif;font-weight:500;font-size:1em;color:#000000;transition:border-color .18s ease}
.contact-form textarea{min-height:150px;resize:vertical}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:#33258E}
.contact-form [aria-invalid="true"]{border-color:#c0392b}
.field__error{color:#c0392b;font-size:.9em;min-height:1.2em}
.hp{position:absolute !important;left:-9999px;opacity:0}
.form-note,.form-privacy{margin:0;font-weight:400}
.form-privacy{font-size:.82em;line-height:1.5;max-width:70ch}
.contact__submit{align-self:flex-start;gap:1.25rem;min-height:53px;cursor:pointer}
.contact__submit:disabled{opacity:.6;cursor:default}
.btn__arrow{flex:none;width:22px;height:22px;background:currentColor;-webkit-mask:var(--arrow) center/contain no-repeat;mask:var(--arrow) center/contain no-repeat;transition:transform .2s ease;--arrow:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="none" stroke="black" stroke-width="2"><path d="M20.6 11H2M11.6 2 20.6 11l-9 9"/></svg>')}
.dg-btn:hover .btn__arrow{transform:translateX(4px)}
.form-status{margin:0;font-weight:500;min-height:1.5em}
.form-status.is-ok{color:#33258E}.form-status.is-error{color:#c0392b}
@media (max-width:900px){.contact__grid{grid-template-columns:1fr}.contact__aside{display:none}}
@media (max-width:600px){.field-row{grid-template-columns:1fr}.contact__direct{flex-direction:column;gap:1rem}}

/* ---------- Sprachauswahl (wie kapa.app) ---------- */
.lang-switch{margin:0;display:flex;align-items:center;gap:.55rem;color:#FFFFFF;font-size:15px}
.lang-switch>span[aria-current]{color:#65B7F4}
.lang-switch a{color:#FFFFFF;text-decoration:none}.lang-switch a:hover{color:#65B7F4}

/* ---------- Footer (wie kapa.app) ---------- */
.site-footer{background:#0B0A14;color:#FFFFFF}
.site-footer__rule{display:block;width:100%;height:12px;background:#C18BF0}
.site-footer__grid{padding-top:clamp(2.5rem,1.2rem + 4vw,5rem);padding-bottom:clamp(2.5rem,1.2rem + 4vw,5rem);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(2rem,1rem + 3vw,4rem);align-items:start}
.site-footer__logo{display:inline-flex;flex-direction:column;text-decoration:none;line-height:1}
.site-footer__logo img{display:block;height:36px;width:auto}
.site-footer__logo span{font-size:13px;color:#65B7F4;margin-top:6px}
.site-footer__company{margin:1.5rem 0 0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(1.5rem,1.24rem + .78vw,1.875rem);line-height:1.33}
.site-footer__address{margin-top:1rem;font-style:normal;font-weight:300}
.site-footer__address a{color:#65B7F4;text-decoration:none}.site-footer__address a:hover{text-decoration:underline}
.site-footer__nav{display:flex;gap:clamp(1.5rem,3vw,3.5rem);justify-self:end}
.site-footer__nav ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.75rem}
.site-footer__nav a{color:#FFFFFF;font-weight:300;text-decoration:none}.site-footer__nav a:hover{color:#65B7F4}
.site-footer__bottom{padding-top:1.75rem;padding-bottom:1.75rem;border-top:1px solid rgba(255,255,255,.12);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;font-weight:300;font-size:.9em}
.site-footer__bottom p{margin:0}
.site-footer__bottom a{color:#FFFFFF;text-decoration:none}.site-footer__bottom a:hover{color:#65B7F4}
@media (max-width:768px){.site-footer__grid{grid-template-columns:1fr}.site-footer__nav{justify-self:start}}

/* ---------- Rechtsseiten ---------- */
.legal{padding-top:clamp(3.5rem,1.8rem + 6vw,7rem);padding-bottom:clamp(3.5rem,1.8rem + 6vw,7rem)}
.legal__inner{max-width:48rem}
.legal h1{margin:0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(2rem,1.30rem + 2.10vw,3.125rem);line-height:1.2;color:#33258E}
.legal h2{margin:clamp(2rem,1rem + 3vw,3.25rem) 0 0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(1.5rem,1.24rem + .78vw,1.875rem);line-height:1.33}
.legal p,.legal ul,.legal address{margin:1rem 0 0;font-style:normal}
.legal ul{padding:0;list-style:none;display:flex;flex-direction:column;gap:.5rem}
.legal li{position:relative;padding-left:1.4rem}
.legal li::before{content:"·";position:absolute;left:.35rem}
.rule{display:block;width:310px;max-width:60%;height:7px;background:#C18BF0;margin:clamp(1.25rem,.7rem + 1.6vw,2.25rem) 0 clamp(1.5rem,1rem + 2vw,2.5rem)}
.legal__updated{margin-top:3rem !important;font-size:.9em}
.legal__lang-note{padding:.9rem 1.15rem;border-left:3px solid #65B7F4;background:#F2F7FC;font-weight:300;font-size:.93em}
.legal__lang-note a{color:#33258E}

/* ---------- 404 ---------- */
.notfound{padding-top:clamp(3.5rem,1.8rem + 6vw,8.5rem);padding-bottom:clamp(3.5rem,1.8rem + 6vw,8.5rem);text-align:center}
.notfound h1{margin:0 auto;max-width:22ch;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(2rem,1.30rem + 2.10vw,3.125rem);line-height:1.2;color:#33258E}
.notfound p{margin:1.5rem auto 0;max-width:46ch}
.notfound__cta{max-width:none !important;display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:clamp(2rem,1rem + 3vw,3.5rem) !important}
.dg-btn--outline{background:transparent;color:#33258E}.dg-btn--outline:hover{background:#33258E;color:#FFFFFF}

/* ---------- Claim im Stil "Du ... / Wir ..." (Vorbild: CSS-Kampagne) ----------
   Erster Satz gross und leicht, zweiter Satz als Pille mit Pfeil-Kreis.
   Die Pille ist ein echter Link (zum Nutzen-Abschnitt), weil sie wie ein
   Button aussieht. Bewusst rund - die einzige Ausnahme von den eckigen Kanten. */
.claim{margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(1rem,.6rem + 1.2vw,1.75rem)}
.claim__lead{font-family:"Montserrat",system-ui,sans-serif;font-weight:400;font-size:clamp(2rem,1.2rem + 2.5vw,3.5rem);line-height:1.12;letter-spacing:-.015em;color:#FFFFFF}
.claim__pill{display:inline-flex;align-items:center;gap:.75em;max-width:100%;box-sizing:border-box;padding:.45em 1.1em .45em .45em;border-radius:2em;background:linear-gradient(90deg,#33258E 0%,#1E6FB8 55%,#65B7F4 100%);color:#FFFFFF;text-decoration:none;font-family:"Montserrat",system-ui,sans-serif;font-weight:400;font-size:clamp(1.125rem,.85rem + .9vw,1.75rem);line-height:1.25;transition:filter .2s ease}
.claim__pill:hover{color:#FFFFFF;filter:brightness(1.12)}
.claim__arrow{flex:none;width:1.9em;height:1.9em;border-radius:50%;background:#FFFFFF;display:grid;place-items:center}
.claim__arrow svg{width:55%;height:55%}
.claim__pill:hover .claim__arrow svg{transform:translateX(2px)}

/* ---------- Schnellkontakt-Leiste rechts (wie kapa.app) ----------
   Fixiert unter der Kopfzeile. Bis 1500 px kleinere Kacheln und schmalerer
   Inhalt, damit die Leiste nichts überdeckt; unter 900 px als Balken unten. */
.quickbar{position:fixed;top:82px;right:0;z-index:95;display:flex;flex-direction:column}
.quickbar__tile{position:relative;width:132px;height:131px;display:grid;place-items:center;text-align:center;text-decoration:none;color:#FFFFFF;font-family:"Barlow",system-ui,sans-serif;font-weight:500;font-size:1.125rem;line-height:1.14;transition:filter .2s ease}
.quickbar__tile:hover{color:#FFFFFF;filter:brightness(1.12)}
.quickbar__tile--demo{background:#65B7F4;color:#0B0A14}.quickbar__tile--demo:hover{color:#0B0A14}
.quickbar__tile--phone{background:#33258E}
.quickbar__tile--mail{background:#C18BF0}
.quickbar__tile img{width:42px;height:auto}
.quickbar__tile--mail img{width:52px}
.quickbar__tip{position:absolute;right:calc(100% + .5rem);top:50%;transform:translateY(-50%);white-space:nowrap;background:#0B0A14;color:#FFFFFF;font-size:1rem;line-height:1;padding:.6rem .9rem;opacity:0;visibility:hidden;transition:opacity .15s ease,visibility .15s;pointer-events:none}
.quickbar__tile--phone:hover .quickbar__tip,.quickbar__tile--phone:focus-visible .quickbar__tip{opacity:1;visibility:visible}
@media (max-width:1500px){
  .quickbar__tile{width:96px;height:96px;font-size:.95rem}
  .quickbar__tile img{width:32px}
  .quickbar__tile--mail img{width:40px}
}
@media (max-width:1500px) and (min-width:901px){
  .dg-wrap{max-width:min(1304px,calc(100vw - 224px))}
}
@media (max-width:900px){
  .quickbar{top:auto;bottom:0;left:0;right:0;flex-direction:row}
  .quickbar__tip{right:auto;left:50%;top:auto;bottom:calc(100% + .5rem);transform:translateX(-50%)}
  .quickbar__tile{flex:1;width:auto;height:64px;font-size:.9rem}
  body{padding-bottom:64px}
}

/* ---------- Über uns mit Porträts (wie kapa.app) ---------- */
.about__title{margin:0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(2rem,1.30rem + 2.10vw,3.125rem);line-height:1.2;color:#33258E}
.about__intro{margin-top:clamp(2rem,1rem + 3vw,3.5rem);display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,.7rem + 2.6vw,3rem);align-items:start}
.about__claim{margin:0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(1.5rem,1.24rem + .78vw,1.875rem);line-height:1.33}
.about__intro .rule{margin-bottom:0}
.about__text{margin:0}
.team{margin-top:clamp(2.5rem,1.2rem + 4vw,5rem);display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(2rem,1rem + 4vw,4.5rem)}
.member{display:flex;flex-direction:column;gap:1.5rem}
.member__head{display:flex;gap:clamp(1.25rem,.6rem + 2vw,2.5rem);align-items:flex-start}
.member__img{flex:none;width:clamp(140px,16vw,246px);height:auto;aspect-ratio:246/325;object-fit:cover;object-position:center top}
.member__ident{display:flex;flex-direction:column;gap:.35rem;align-items:flex-start}
.member__name{margin:0;font-family:"Montserrat",system-ui,sans-serif;font-weight:600;font-size:clamp(1.5rem,1.24rem + .78vw,1.875rem);line-height:1.33}
.member__role{margin:0;font-family:"Montserrat",system-ui,sans-serif;font-weight:400;font-size:clamp(1.5rem,1.24rem + .78vw,1.875rem);line-height:1.33}
.member__ident .dg-btn{margin-top:1rem;min-height:46px;padding:0 1.25rem;gap:.9rem}
.member__facts{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:1rem}
.member__facts li{position:relative;padding-left:1.4rem}
.member__facts li::before{content:"·";position:absolute;left:.25rem}
.member__edu{margin:0;color:#1E6FB8}
@media (max-width:1200px){.team{grid-template-columns:1fr}}
@media (max-width:768px){.about__intro{grid-template-columns:1fr}.about__intro br{display:none}}
@media (max-width:520px){.member__head{flex-direction:column}}

/* ---------- Hintergrundvideo im Titelbereich (wie kapa.app) ----------
   Stapelung: Video (0) -> Abdunkelung (1) -> Inhalt (2). Bei reduzierter
   Bewegung bleibt das Standbild (poster). */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:0}
.hero__shade{position:absolute;inset:0;z-index:1;background:radial-gradient(110% 80% at 75% 40%,rgba(51,37,142,.45) 0%,rgba(29,21,80,.3) 50%,rgba(0,0,0,0) 78%),linear-gradient(180deg,rgba(11,10,20,.62) 0%,rgba(11,10,20,.68) 45%,rgba(11,10,20,.8) 100%)}
.hero__inner{position:relative;z-index:2}
@media (prefers-reduced-motion:reduce){.hero__video{display:none}.hero{background:#0B0A14 url("../img/hero-poster.jpg") center/cover}}