/* WELLE 3 - Performance, UX, Mobile, Inhalte */

/* ===== #074 Skip-to-Content Link (Accessibility) ===== */
.w3-skip{
  position:absolute;left:-9999px;top:0;
  padding:10px 18px;background:#00f5ff;color:#070710;
  font-family:'Inter',sans-serif;font-weight:700;
  border-radius:0 0 12px 0;z-index:100000;
  text-decoration:none
}
.w3-skip:focus{left:0;outline:none}

/* ===== #082 iOS Safe-Area ===== */
@supports (padding: env(safe-area-inset-top)){
  .ak-nav{
    padding-top:env(safe-area-inset-top);
    padding-left:max(20px, env(safe-area-inset-left));
    padding-right:max(20px, env(safe-area-inset-right))
  }
  .azn-bub-btn{
    bottom:max(24px, env(safe-area-inset-bottom));
    right:max(24px, env(safe-area-inset-right))
  }
  .cb-banner{
    bottom:max(24px, env(safe-area-inset-bottom))
  }
}

/* ===== #086 Native Share Button ===== */
.w3-share{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 16px;border-radius:999px;
  background:rgba(0,245,255,.08);
  border:1px solid rgba(0,245,255,.25);
  color:#00f5ff;font-family:-apple-system,'Inter',sans-serif;
  font-size:13px;font-weight:600;cursor:pointer;
  transition:all .2s
}
.w3-share:hover{
  background:rgba(0,245,255,.15);
  border-color:rgba(0,245,255,.45);
  transform:translateY(-1px)
}

/* ===== #122 Motivations-Quote ===== */
.w3-quote{
  margin:32px 0;padding:24px 28px;
  background:linear-gradient(135deg,rgba(212,165,116,.06),rgba(0,245,255,.04));
  border:1px solid rgba(212,165,116,.2);
  border-radius:18px;
  position:relative;overflow:hidden
}
.w3-quote::before{
  content:"\201C";position:absolute;top:-30px;left:8px;
  font-family:Georgia,serif;font-size:160px;
  color:rgba(212,165,116,.15);line-height:1
}
.w3-quote-text{
  position:relative;
  font-family:-apple-system,'SF Pro Display','Inter',sans-serif;
  font-style:italic;font-weight:500;font-size:18px;
  color:rgba(245,245,247,.92);line-height:1.5;
  margin:0 0 10px;padding-left:18px
}
.w3-quote-author{
  font-family:'JetBrains Mono',monospace;font-size:11px;
  color:rgba(245,245,247,.5);
  text-transform:uppercase;letter-spacing:.18em;
  padding-left:18px
}

/* ===== #182 Geld-zurueck-Garantie Banner ===== */
.w3-money-back{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 18px;border-radius:999px;
  background:linear-gradient(135deg,rgba(170,255,0,.1),rgba(0,245,255,.08));
  border:1px solid rgba(170,255,0,.3);
  color:#aaff00;font-family:-apple-system,'Inter',sans-serif;
  font-size:13px;font-weight:600
}
.w3-money-back .ico{
  width:22px;height:22px;border-radius:50%;
  background:#aaff00;color:#070710;
  display:grid;place-items:center;
  font-size:14px;font-weight:900
}

/* ===== #183 Trust-Badges ===== */
.w3-trust{
  display:flex;gap:16px;flex-wrap:wrap;justify-content:center;
  padding:24px;margin:32px 0;
  background:rgba(20,20,32,.5);
  border:1px solid rgba(255,255,255,.06);
  border-radius:18px
}
.w3-trust-badge{
  display:flex;align-items:center;gap:10px;
  padding:10px 16px;border-radius:12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06)
}
.w3-trust-i{font-size:22px;line-height:1;flex-shrink:0}
.w3-trust-t{
  font-family:-apple-system,'Inter',sans-serif;
  font-size:12px;font-weight:700;color:#fff
}
.w3-trust-s{
  font-family:'JetBrains Mono',monospace;
  font-size:9px;color:rgba(245,245,247,.5);
  text-transform:uppercase;letter-spacing:.15em
}

/* ===== #061 Keyboard-Hint ===== */
.w3-kbd-hint{
  position:fixed;bottom:88px;right:24px;
  display:none;flex-direction:column;gap:6px;
  padding:14px 18px;border-radius:14px;
  background:rgba(15,15,26,.95);backdrop-filter:blur(20px);
  border:1px solid rgba(0,245,255,.25);
  color:#fff;font-family:-apple-system,'Inter',sans-serif;
  font-size:12px;z-index:99993;max-width:280px;
  animation:w3SlideIn .3s
}
@keyframes w3SlideIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.w3-kbd-hint.on{display:flex}
.w3-kbd-hint .row{display:flex;align-items:center;gap:10px;justify-content:space-between}
.w3-kbd-hint kbd{
  padding:3px 8px;border-radius:6px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
  font-family:'JetBrains Mono',monospace;
  font-size:11px;font-weight:600
}

/* ===== Undo-Toast (#067) ===== */
.w3-undo{
  position:fixed;bottom:90px;left:50%;transform:translateX(-50%);
  display:none;align-items:center;gap:14px;
  padding:12px 18px;border-radius:999px;
  background:rgba(15,15,26,.95);backdrop-filter:blur(20px);
  border:1px solid rgba(0,245,255,.3);
  color:#fff;font-family:-apple-system,'Inter',sans-serif;
  font-size:13px;z-index:99992;
  animation:w3SlideIn .3s
}
.w3-undo.on{display:flex}
.w3-undo button{
  background:linear-gradient(135deg,#00f5ff,#8b5cf6);
  color:#070710;border:none;padding:6px 14px;
  border-radius:999px;font-family:'Inter',sans-serif;
  font-size:12px;font-weight:700;cursor:pointer
}

/* ===== #037 Lazy Loading vorbereiten ===== */
img:not([loading]){loading:lazy}
img[data-src]{opacity:.3;transition:opacity .35s}
img[data-src].loaded{opacity:1}

/* ===== #150 Font Loading ===== */
@font-face{
  font-family:'SF Pro Display';
  font-display:swap;
  src:local('SF Pro Display'),local('-apple-system')
}

/* ===== #097 Reduced Motion komplett ===== */
@media (prefers-reduced-motion: reduce){
  .pd-hero-slide,
  .azn-bub-btn,
  .pd-banner::before,
  .pd-banner::after,
  .pd-beruf-img,
  .pp-hero-bg{
    animation:none !important
  }
}

/* ===== Bubble-Constraint (#068) ===== */
.azn-bub-btn{
  /* Mindestabstand zu Top: 90px (unter Header) */
  /* Wird per JS gesetzt aber CSS-Fallback */
}