/* Denktrainer – static build of the Claude Design file.
   Colours are written in the design's source palette and swapped to the
   "Salbei" palette at build time, exactly as the studio preview does. */

@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url('/assets/fonts/instrument-sans-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url('/assets/fonts/instrument-sans-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/instrument-serif-normal-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/instrument-serif-normal-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/instrument-serif-italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/instrument-serif-italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:7.5rem;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:#f1f3f2;-webkit-font-smoothing:antialiased}
a{color:#576b62}
a:hover{color:#5e8b7a}
[hidden]{display:none !important}
img[width][height]{height:auto}
@keyframes dt-spin{to{transform:rotate(360deg)}}
:focus-visible{outline:2px solid #f1f3f2 !important;outline-offset:0 !important;box-shadow:0 0 0 5px #576b62 !important}
main:focus{outline:none}

.skip-link{position:absolute;left:1rem;top:-4rem;z-index:1000;background:#ffffff;color:#576b62;padding:.75rem 1.25rem;border-radius:6.25rem;font-family:'Instrument Sans',system-ui,sans-serif;font-weight:500;text-decoration:none;box-shadow:0 .75rem 2rem rgba(63, 79, 72, .18)}
.skip-link:focus{top:1rem}

/* ---------- Navigation (fixed, like the studio's applyNav) ---------- */
.dt-nav-host{min-height:70px}
.js .dt-nav{position:fixed;top:1.25rem;left:0;right:0;margin:0 auto;width:min(73.75rem,calc(100% - 2.5rem));z-index:400;isolation:isolate}
.dt-nav.is-compact{padding:.25rem .25rem .25rem .5rem !important}
.dt-nav.is-compact .dt-nav__logo{height:2.625rem !important}
.dt-nav__link{position:relative}
.dt-nav__desk .dt-nav__link[aria-current="page"]::after{content:"";position:absolute;left:50%;bottom:.1875rem;width:.3125rem;height:.3125rem;margin-left:-.15625rem;border-radius:50%;background:#bfd2c8}
.dt-nav__desk .dt-dd .dt-nav__link[aria-current="page"]::after{margin-left:-.59rem}
.dt-mobile .dt-nav__link[aria-current="page"]{background:#e7ebec}
.dt-nav__burger .dt-nav__icon--x{display:none}
.dt-nav.is-open .dt-nav__burger .dt-nav__icon--menu{display:none}
.dt-nav.is-open .dt-nav__burger .dt-nav__icon--x{display:block}
.dt-nav.is-open{border-radius:1.75rem !important}
@media (max-width:59.99rem){.dt-nav__desk{display:none !important}}
@media (min-width:60rem){.dt-nav__burger,.dt-mobile{display:none !important}}
.js .dt-mobile{display:none !important}
.js .dt-nav.is-open .dt-mobile{display:flex !important}
html:not(.js) .dt-nav__burger{display:none !important}

/* Dropdown: CSS fallback without JS, class-controlled with JS */
.dt-dd__panel{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px)}
html:not(.js) .dt-dd:hover .dt-dd__panel,
html:not(.js) .dt-dd:focus-within .dt-dd__panel,
.dt-dd.is-open .dt-dd__panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.dt-dd [data-dd-toggle] > span{transition:transform 240ms cubic-bezier(.22,1,.36,1)}
.dt-dd.is-open [data-dd-toggle] > span{transform:rotate(180deg)}

/* ---------- Buttons ---------- */
.dt-btn__badge{transition:transform 240ms cubic-bezier(.22,1,.36,1)}
.dt-btn:hover .dt-btn__badge,.dt-btn:focus-visible .dt-btn__badge{transform:rotate(45deg)}
.dt-btn:active{transform:translateY(0) scale(.98) !important}

/* ---------- KI badge ---------- */
.ki-badge__more{max-width:0;opacity:0}
.ki-badge:focus .ki-badge__more,.ki-badge.is-pinned .ki-badge__more{max-width:9rem;opacity:1}
@media (hover:hover){.ki-badge:hover .ki-badge__more{max-width:9rem;opacity:1}}

/* ---------- Contact form ---------- */
#fehler:target{display:flex !important}
[data-submit][aria-disabled="true"]{opacity:.72;cursor:progress}
[data-submit] .dt-btn__badge,[data-submit] > span:last-child{transition:transform 240ms cubic-bezier(.22,1,.36,1)}
@media (hover:hover){[data-submit]:hover > span:last-child{transform:rotate(45deg)}}

/* ---------- Layout safety for one-column layouts ---------- */
@media (max-width:43.74rem){[data-sticky]{position:static !important}}

/* Hide intro elements until GSAP has taken over (removed by JS, or after 2.5s at the latest) */
.anim-pending [data-hero] > *,.anim-pending .dt-nav,.anim-pending [data-reveal]{opacity:0}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
@media print{
  .dt-nav,.skip-link{position:static !important}
  .dt-nav-host{min-height:0}
}

/* generated from style-hover / style-focus / style-active */
@media (hover:hover){.h-7db5d3:hover{color:#576b62 !important}}
@media (hover:hover){.h-e40b56:hover{background:#e7ebec !important;color:#576b62 !important}}
@media (hover:hover){.h-ce3f47:hover{background:#699886 !important}}
@media (hover:hover){.h-95b51a:hover{background:#e7ebec !important}}
@media (hover:hover){.h-5e52c8:hover{background:#699886 !important;transform:translateY(-1px) !important}}
@media (hover:hover){.h-c81ba3:hover{background:#bfd2c8 !important;transform:translateY(-1px) !important}}
@media (hover:hover){.h-7aaeca:hover{background:#eef1f0 !important;transform:translateY(-1px) !important}}
@media (hover:hover){.h-7ec04c:hover{transform:translateY(-4px) !important;box-shadow:0 1.75rem 3rem rgba(87, 107, 98, .10) !important}}
@media (hover:hover){.h-e7281e:hover{transform:scale(1.04) !important}}
@media (hover:hover){.h-6a633a:hover{background:rgba(255,255,255,.2) !important}}
@media (hover:hover){.h-4c8188:hover{color:#d2dfd8 !important}}
.a-48ab92:active{background:#bfd2c8 !important}
@media (hover:hover){.h-f4e56a:hover{transform:translateY(-2px) !important;border-color:#bfd2c8 !important;box-shadow:0 1.25rem 2.5rem rgba(87, 107, 98, .08) !important}}
.f-70118c:focus{border-color:#576b62 !important;box-shadow:0 0 0 3px rgba(105, 152, 134, .8) !important}
