/* ================================================= */
/* SYSTEM: ESSENTIALS (CLEAN VERSION)                */
/* ================================================= */

/* 1. THE CONCRETE SCROLLBAR (Schmal & Dunkel) */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #E3E1DE; 
}
::-webkit-scrollbar-thumb {
  background-color: #111; 
  border-radius: 3px; 
  border: 1px solid #E3E1DE; 
}
* {
  scrollbar-width: thin;
  scrollbar-color: #111 #E3E1DE;
}

/* 2. EDITORIAL SELECTION (Markierter Text: Schwarz/Creme) */
::selection {
  background: #111; 
  color: #F5F3ED; 
  text-shadow: none;
}
::-moz-selection {
  background: #111;
  color: #F5F3ED;
}

/* 3. MAGAZINE TYPOGRAPHY (Verhindert Text-Lücken) */
p, h1, h2, h3 {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

/* 4. BUG FIX: SCROLLING (iOS SAFE VERSION) */
html {
  /* WICHTIG: Safari braucht hier 'visible', sonst bleibt die Seite weiß */
  overflow-x: visible !important; 
  width: 100% !important;
}

body {
  /* Hier verstecken wir das seitliche Wackeln */
  overflow-x: hidden !important;
  overflow-y: auto !important;
  
  /* Das Zauberwort für weiches iPhone-Scrollen */
  -webkit-overflow-scrolling: touch; 
  min-height: 100vh !important;
}

/* Fix für Squarespace Container */
#siteWrapper, .sqs-layout {
  overflow: visible !important;
  height: auto !important;
}
/* 5. BARRIEREFREIHEIT: Sichtbarer Tastatur-Fokus */
a:focus-visible, button:focus-visible, [onclick]:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid #111 !important;
  outline-offset: 3px;
  border-radius: 2px;
}

/* 6. NAVIGATION: Platz auf schmaleren Desktops */
@media (min-width: 901px) and (max-width: 1250px) {
  .nav-group { gap: 14px !important; }
  .nav-item { font-size: 10px !important; }
  .mag-header { padding-left: 25px !important; padding-right: 25px !important; }
}