/* ── RESET & ROOT ── */
    body { margin: 0; line-height: normal; }

    :root {
      --color-blueviolet: #bc47ff;
      --color-darkslateblue: #333461;
      --color-darkslategray-100: #313131;
      --color-darkslategray-200: #2f2f2f;
      --color-dimgray-100: #616161;
      --color-dimgray-200: rgba(74, 85, 108, 0.6);
      --color-ghostwhite: #f8f6ff;
      --color-gray-100: #fdfdfd;
      --color-gray-200: #041434;
      --color-gray-300: rgba(0, 0, 0, 0.1);
      --color-gray-400: rgba(255, 255, 255, 0.4);
      --color-mediumblue: #294cff;
      --color-royalblue: #4f73ff;
      --Gray-800: #4a556c;
      --White: #fff;

      --gap-0: 0px; --gap-8: 8px; --gap-14: 14px; --gap-16: 16px;
      --gap-18: 18px; --gap-20: 20px; --gap-24: 24px; --gap-26: 26px;
      --gap-30: 30px; --gap-32: 32px; --gap-40: 40px; --gap-64: 64px;
      --gap-72: 72px; --gap-11_95: 11.95px; --gap-15_6: 15.6px; --gap-31_86: 31.86px;

      --padding-0: 0px; --padding-1: 1px; --padding-11: 11px; --padding-14: 14px;
      --padding-20: 0px; --padding-23: 23px; --padding-24: 24px; --padding-28: 28px;
      --padding-30: 30px; --padding-31: 31px; --padding-32: 32px; --padding-36: 36px;
      --padding-40: 40px; --padding-48: 48px; --padding-80: 80px; --padding-11_95: 11.95px;

      --br-6: 6px; --br-12: 12px; --br-24: 24px; --br-26: 26px;

      --font-handlee: 'Handlee', cursive;
      --font-kumbh-sans: 'Kumbh Sans', sans-serif;
      --font-patrick-hand: 'Patrick Hand', cursive;
      --font-young-serif: 'Young Serif', serif;

      --fs-13_6: 13.6px; --fs-14_8: 14.8px; --fs-16: 16px; --fs-18: 18px;
      --fs-18_1: 18.1px; --fs-22: 22px; --fs-24: 24px; --fs-29: 29px;
      --fs-32: 32px; --fs-36_6: 36.6px; --fs-48: 48px; --fs-54: 54px;

      --border-1: 1px solid var(--color-gray-300);
      --shadow-drop: 0px 1px 6px var(--color-gray-300);
      --shadow-drop-1: 0px 2px 45px rgba(69, 179, 227, 0.35);
      --shadow-drop-2: 0px 1px 7.8px var(--color-gray-300);

      --gradient-1: linear-gradient(180deg, var(--White), #b9e9e9);
      --gradient-2: var(--White) padding-box, linear-gradient(90deg, #f99d9d, #e440d9 26.44%, #d384c5 63.46%, #a6a4db) border-box;
      --gradient-3: linear-gradient(180deg, var(--White), #ffddee);

      --lh-24: 24px; --lh-26: 26px; --lh-30: 30px; --lh-35: 35px; --lh-40: 40px;
      --lh-23_4: 23.4px; --lh-23_6: 23.6px;
    }

    /* ── PAGE SWITCHER ── */
    @keyframes pageIn {
      from { opacity: 0; transform: translateY(18px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes pageOut {
      from { opacity: 1; transform: translateY(0); }
      to   { opacity: 0; transform: translateY(-12px); }
    }
    .page { display: none; }
    .page.active {
      display: flex;
      animation: pageIn 0.38s cubic-bezier(0.22, 0.61, 0.36, 1) both;
    }
    .page.leaving {
      display: flex;
      animation: pageOut 0.22s ease forwards;
      pointer-events: none;
      position: absolute;
      top: 0; left: 0; width: 100%;
    }
    @media (prefers-reduced-motion: reduce) {
      .page.active { animation: none; }
      .page.leaving { animation: none; }
    }


    /* ══════════════════════════════════════════
       SHARED NAV STYLES (used across all pages)
    ══════════════════════════════════════════ */
    .nav-bar {
      width: 100%;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      padding: var(--padding-40) var(--padding-80) 0;
      box-sizing: border-box;
      position: sticky;
      top: 0;
      z-index: 99;
      gap: var(--gap-20);
    }
    .nav-logo { display: block; width: 86px; height: 86px; flex-shrink: 0; }
    .nav-links-wrapper {
      display: flex;
      flex-direction: column;
      padding: 31px 0 0;
      box-sizing: border-box;
    }
    .nav-links {
      display: flex;
      gap: 29.54px;
      align-items: center;
      font-size: var(--fs-14_8);
      color: var(--Gray-800);
      font-family: var(--font-kumbh-sans);
      margin: 0;
    }
    .nav-links a {
      letter-spacing: -0.02em;
      line-height: 23.6px;
      text-decoration: none;
      color: inherit;
      cursor: pointer;
    }
    .nav-links a:hover { color: var(--color-mediumblue); }
    .nav-links a.active { font-weight: 600; color: var(--color-mediumblue); }

    .logo-group {
      display: flex;
      align-items: center;
      gap: 32px;
      flex-shrink: 0;
    }
    .globe-btn {
      background: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/b/ba/Flag_of_Germany.svg/3840px-Flag_of_Germany.svg.png");
      display: flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      cursor: pointer;
      color:#ffffff00;
      flex-shrink: 0;
      align-self: center;
      transition: background 0.18s, border-color 0.18s, color 0.18s;
    }

    .globe-btn-DE {
      background: center;
      background-repeat: no-repeat;
      background-size: cover;
      background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Flag_of_the_United_Kingdom_%281-2%29.svg/1280px-Flag_of_the_United_Kingdom_%281-2%29.svg.png");
      display: flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      cursor: pointer;
      color:#ffffff00;
      flex-shrink: 0;
      align-self: center;
      transition: background 0.18s, border-color 0.18s, color 0.18s;
    }

    .globe-btn svg { width: 20px; height: 20px; }


    .hamburger {
      display: none;
      flex-direction: column;
      gap: 5px;
      background: none;
      border: none;
      cursor: pointer;
      padding: 8px;
      margin-top: 18px;
      z-index: 200;
    }
    .hamburger span {
      display: block; width: 24px; height: 2px;
      background: var(--Gray-800); border-radius: 2px;
    }

    /* Mobile Nav Overlay */
    .mobile-nav {
      display: flex;
      position: fixed;
      inset: 0;
      background: rgba(255,255,255,0.97);
      z-index: 999;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: var(--gap-32);
      font-family: var(--font-kumbh-sans);
      font-size: var(--fs-24);
      /* Hidden state */
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(-12px);
      transition: opacity 0.28s ease, transform 0.28s ease, visibility 0s linear 0.28s;
    }
    .mobile-nav.open {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0);
      transition: opacity 0.28s ease, transform 0.28s ease, visibility 0s linear 0s;
    }
    .mobile-nav a {
      text-decoration: none;
      color: var(--color-gray-200);
      letter-spacing: -0.02em;
      cursor: pointer;
    }
    .mobile-nav a:hover { color: var(--color-mediumblue); }
    .mobile-nav-close {
      position: absolute; top: 24px; right: 24px;
      background: none; border: none; font-size: 28px;
      cursor: pointer; color: var(--Gray-800);
    }

    /* ── SHARED INNER ELEMENTS ── */
    .hero-banner {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      position: relative;
      padding-bottom: 30px;
    }
    .hero-banner::after {
      content: '';
      position: absolute;
      bottom: -1px;
      left: 0;
      width: 100%;
      height: 80px;
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0,40 C360,80 1080,0 1440,40 L1440,80 L0,80 Z'/%3E%3C/svg%3E") no-repeat center bottom;
      background-size: 100% 100%;
      pointer-events: none;
    }
    .hero-content {
      width: 100%;
      max-width: 960px;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 40px var(--padding-80) 60px;
      box-sizing: border-box;
      gap: var(--gap-24);
    }
    .hero-welcome {
      font-family: var(--font-kumbh-sans);
      font-size: var(--fs-18);
      font-weight: 300;
      color: var(--color-dimgray-200);
      letter-spacing: -0.02em;
      line-height: var(--lh-24);
      margin: 0;
    }
    .hero-title {
      margin: 0;
      font-family: var(--font-young-serif);
      font-size: var(--fs-54);
      font-weight: 400;
      letter-spacing: -0.01em;
      line-height: 120%;
      color: var(--color-darkslategray-100);
    }
    .hero-subtitle {
      font-family: var(--font-kumbh-sans);
      font-size: var(--fs-18);
      color: var(--Gray-800);
      line-height: 160%;
      margin: 0;
    }
    .intro-section {
      width: 100%;
      max-width: 1280px;
      padding: 0 var(--padding-80);
      box-sizing: border-box;
      margin-top: 8px;
    }
    .intro-box {
      border: var(--border-1);
      border-radius: var(--br-12);
      box-shadow: var(--shadow-drop);
      background: var(--White);
      padding: var(--padding-32) var(--padding-40);
      box-sizing: border-box;
      font-family: var(--font-kumbh-sans);
      font-size: var(--fs-13_6);
      color: var(--Gray-800);
      line-height: 22px;
      letter-spacing: -0.01em;
    }
    .intro-box p { margin: 0 0 10px; }
    .intro-box p:last-child { margin: 0; }
    .intro-box .highlight { font-weight: 600; color: var(--color-gray-200); }
    .intro-box .custom-note { font-style: italic; margin-top: 14px; color: var(--color-dimgray-200); font-size: 13px; }

    .section-header {
      width: 100%;
      max-width: 1280px;
      padding: 0 var(--padding-80);
      box-sizing: border-box;
      margin-top: 52px;
    }
    .section-title {
      margin: 0;
      font-family: var(--font-young-serif);
      font-size: 38px;
      font-weight: 400;
      color: var(--color-darkslategray-100);
      letter-spacing: -0.01em;
    }
    .testimonials-grid {
      width: 100%;
      max-width: 1280px;
      padding: 0 var(--padding-80);
      box-sizing: border-box;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: var(--gap-24);
      margin-top: var(--gap-24);
    }
    .testimonial-card {
      background-size: 100% 100%;
      background-image: url('https://spaetz.codeberg.page/almut-www/Frame-1321315224-6.webp');
      padding: var(--padding-32) var(--padding-32);
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .testimonial-label {
      font-family: var(--font-handlee);
      font-size: var(--fs-22);
      font-weight: 600;
      color: var(--color-gray-200);
      letter-spacing: -0.01em;
    }
    .testimonial-text {
      font-family: var(--font-kumbh-sans);
      font-size: var(--fs-13_6);
      color: var(--Gray-800);
      line-height: 22px;
      letter-spacing: -0.01em;
      margin: 0;
    }
    .footer-social {
      justify-content: center;
      padding: 1em 0px;
      display: flex;
      align-items: center;
      gap: var(--gap-40);
      font-family: var(--font-handlee);
      font-size: var(--fs-18_1);
      color: var(--color-dimgray-100);
    }
    .social-item { display: flex; align-items: center; gap: 8px; }
    .social-icon { width: 20px; height: 20px; object-fit: contain; }
    .footer-social a { text-decoration: none; color: var(--color-dimgray-100);}

    /* ══════════════════════════════════════════
       PAGE: HOME (index)
    ══════════════════════════════════════════ */
    #page-home {
      background-color: var(--color-gray-100);
      width: 100%;
      max-width: 100vw;
      flex-direction: column;
      gap: 52.8px;
      align-items: center;
      box-sizing: border-box;
      overflow-x: hidden;
    }
    .unsplashtmxiwznctzu-parent {
      display: flex;
      align-self: stretch;
      width: 100%;
      height: auto;
      gap: var(--gap-0);
      align-items: flex-start;
      max-width: 100%;
      position: relative;
      isolation: isolate;
    }
    .frame-parent {
      flex: 1;
      background: url('https://spaetz.codeberg.page/almut-www/Frame-1321315223-5-scaled.webp') center top / cover no-repeat;
      position: relative;
      display: flex;
      overflow: visible;
      height: auto;
      align-items: center;
      max-width: 100%;
      flex-direction: column;
      padding: var(--padding-40) var(--padding-80) 80px;
      box-sizing: border-box;
      gap: var(--gap-40);
      flex-shrink: 0;
    }
    .frame-parent::after {
      content: '';
      position: absolute;
      bottom: -1px;
      left: 0;
      width: 100%;
      height: 80px;
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0,40 C360,80 1080,0 1440,40 L1440,80 L0,80 Z'/%3E%3C/svg%3E") no-repeat center bottom;
      background-size: 100% 100%;
      pointer-events: none;
    }
    .frame-group {
      display: flex;
      overflow: visible;
      height: auto;
      align-items: flex-start;
      width: 100%;
      max-width: 1200px;
      gap: var(--gap-20);
      justify-content: space-between;
      top: 0;
      z-index: 99;
      position: sticky;
      flex-shrink: 0;
    }
    .frame-child { position: relative; z-index: 2; display: block; width: 86px; height: 86px; flex-shrink: 0; }
    .frame-wrapper {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: var(--padding-31) 0 0;
      box-sizing: border-box;
    }
    .coaching-parent {
      display: flex;
      align-self: stretch;
      width: 100%;
      flex: 1;
      gap: 29.54px;
      align-items: center;
      flex-shrink: 0;
      margin: 0;
      font-size: var(--fs-14_8);
      color: var(--Gray-800);
      font-family: var(--font-kumbh-sans);
    }
    .coaching {
      letter-spacing: -0.02em;
      line-height: var(--lh-23_6);
      text-decoration: none;
      color: inherit;
      cursor: pointer;
      padding-right: 16px;
    }
    .frame-container {
      display: flex;
      align-self: stretch;
      width: 100%;
      max-width: 1200px;
      margin: 0 auto;
      height: auto;
      gap: var(--gap-72);
      flex-wrap: wrap;
      align-items: flex-start;
      justify-content: center;
      flex-shrink: 0;
    }
    .frame-section {
      flex: 1;
      gap: var(--gap-0);
      padding: 13px 0 0;
      box-sizing: border-box;
      min-width: 395px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      max-width: 100%;
      font-size: var(--fs-18);
      color: var(--color-dimgray-200);
      font-family: var(--font-kumbh-sans);
    }
    .frame-div { display: flex; flex-direction: column; align-items: flex-start; max-width: 100%; align-self: stretch; width: 100%; gap: var(--gap-32); }
    .frame-parent2 { display: flex; flex-direction: column; align-items: flex-start; max-width: 100%; align-self: stretch; width: 100%; gap: var(--gap-26); }
    .given-the-enormous { font-weight: 300; letter-spacing: -0.02em; line-height: var(--lh-24); max-width: 100%; position: relative; z-index: 2; }
    .experience-music-with-container {
      font-family: var(--font-young-serif);
      font-size: var(--fs-48);
      letter-spacing: -0.01em;
      line-height: 120%;
      margin: 0;
      font-weight: 400;
      z-index: 2;
      color: var(--color-darkslategray-100);
    }
    .joy { color: var(--color-mediumblue); }
    .freedom { color: var(--color-blueviolet); }
    .my-name-is { line-height: 160%; color: var(--Gray-800); display: block; width: 75%; max-width: 545px; position: relative; z-index: 2; }
    .button {
      display: flex; width: 246px; height: 52px; flex-direction: column;
      gap: var(--gap-14); align-items: center; justify-content: center;
      border-radius: var(--br-6); padding: var(--padding-14); box-sizing: border-box;
      box-shadow: 1px 1px 6px #00000040; cursor: pointer; border: 0; overflow: hidden;
      background-color: #4a51f5; z-index: 1;
    }
    .read-more-about { font-size: var(--fs-24); line-height: var(--lh-24); font-family: var(--font-patrick-hand); color: var(--White); }
    .frame-item {
      height: 496px; flex: 1; position: relative; box-shadow: var(--shadow-drop-1);
      border-radius: var(--br-26); max-width: 100%; overflow: hidden;
      object-fit: cover; object-position: center; min-width: 391px; display: block;
      border: 10px solid var(--color-gray-400); z-index: 2; width: 100%;
    }
    .page-9-inner {
      align-self: stretch; justify-content: center; padding: var(--padding-0) var(--padding-20);
      width: 100%; text-align: center; font-size: 53.8px; color: var(--color-darkslateblue);
      font-family: var(--font-kumbh-sans); display: flex; align-items: center; max-width: 100%;
    }
    .frame-parent3 { display: flex; align-items: center; max-width: 1200px; flex: 1; flex-direction: column; gap: 47.6px; }
    .are-you-interested-in-working-wrapper { align-self: stretch; display: flex; align-items: center; justify-content: center; width: 100%; }
    .are-you-interested { margin: 0; width: 100%; max-width: 1056px; position: relative; font-size: inherit; font-weight: 400; font-family: inherit; text-align: center; }
    .group-section {
      display: flex; align-items: stretch; gap: 31.9px; width: 100%; z-index: 1;
      text-align: left; font-size: var(--fs-36_6); color: var(--color-gray-200);
      font-family: var(--font-handlee); align-self: stretch; justify-content: center; max-width: 100%;
    }
    .frame-parent4 {
      align-self: stretch; justify-content: center; max-width: 100%; flex: 1;
      box-shadow: var(--shadow-drop-2); border-radius: var(--br-24);
      border: 2px solid #cda1ff4a; box-sizing: border-box;
      padding: var(--padding-30) var(--padding-31); gap: var(--gap-31_86);
      background-color: var(--White); display: flex; flex-direction: column; align-items: flex-start;
    }
    .coaching-group { display: flex; flex-direction: column; align-items: flex-start; gap: var(--gap-15_6); }
    .i-help-musicians { width: 100%; max-width: 341.7px; position: relative; font-size: var(--fs-13_6); letter-spacing: -0.02em; line-height: var(--lh-23_4); font-family: var(--font-kumbh-sans); color: var(--Gray-800); display: inline-block; }
    .button2 {
      display: flex; width: auto; flex-direction: column; gap: var(--gap-11_95);
      align-items: center; justify-content: center; border-radius: var(--br-6);
      padding: 12px 20px 12px 20px; box-sizing: border-box; box-shadow: 1px 1px 6px #00000040;
      cursor: pointer; border: 0; overflow: hidden; background-color: var(--color-dimgray-100);
    }
    .cta-action-button { font-size: 21.9px; line-height: 23.9px; font-family: var(--font-patrick-hand); color: var(--White); }
    .frame-parent5 {
      align-self: stretch; flex: 1; box-shadow: var(--shadow-drop-2); border-radius: var(--br-24);
      border: 2px solid #ffe7dc; align-items: flex-start; padding: var(--padding-30) var(--padding-31);
      gap: var(--gap-31_86); max-width: 100%; background-color: var(--White);
      display: flex; flex-direction: column; justify-content: center; box-sizing: border-box;
    }
    .button3 {
      display: flex; flex-direction: column; justify-content: center; box-sizing: border-box;
      width: 206px; gap: var(--gap-11_95); align-items: center; border-radius: var(--br-6);
      padding: var(--padding-11_95) var(--padding-11); cursor: pointer; border: 0;
      overflow: hidden; background-color: var(--color-dimgray-100);
    }
    .frame-parent6 {
      background-color: var(--White); display: flex; flex: 1; align-self: stretch;
      flex-direction: column; gap: var(--gap-31_86); align-items: flex-start; justify-content: center;
      border-radius: var(--br-24); padding: var(--padding-30) var(--padding-31);
      box-sizing: border-box; border: 2px solid #4ac5332e; box-shadow: var(--shadow-drop-2); max-width: 100%;
    }
    .sound-therapy { letter-spacing: -0.01em; line-height: 120%; margin: 0; position: relative; font-size: inherit; font-weight: 400; font-family: inherit; }
    .page-9-child {
      display: flex; width: 100%; max-width: 985px; align-items: flex-start; justify-content: center;
      padding: 0 var(--padding-20); box-sizing: border-box; align-self: center;
      font-size: var(--fs-18_1); color: var(--color-gray-200); font-family: var(--font-handlee);
    }
    .frame-parent7 { width: 100%; flex-direction: column; gap: 37px; margin: 0 auto; display: flex; justify-content: flex-start; }
    .frame-parent8 { align-self: stretch; width: 100%; gap: var(--gap-0); position: relative; isolation: isolate; font-size: 42px; color: var(--color-gray-200); font-family: var(--font-handlee); display: flex; }
    .frame-inner { box-shadow: 0px 3px 15px #00000042; border-radius: 999px; position: relative; margin: 0; top: 0; left: -120px; object-fit: cover; flex-shrink: 0; display: block; width: 550px; height: 960px; }
    .frame-wrapper2 { flex: 1; gap: var(--gap-0); justify-content: flex-end; flex-shrink: 0; display: flex; align-items: flex-start; max-width: 100%; }
    .about-me-parent { display: flex; align-items: flex-start; max-width: 558px; align-self: stretch; width: 100%; flex-direction: column; gap: var(--gap-15_6); }
    .about-me { letter-spacing: -0.01em; line-height: 120%; margin: 0; position: relative; font-size: inherit; font-weight: 400; font-family: inherit; }
    .almut-is-a { width: 100%; max-width: 558px; position: relative; font-size: var(--fs-16); letter-spacing: -0.35px; line-height: var(--lh-24); font-family: var(--font-kumbh-sans); color: var(--Gray-800); white-space: pre-wrap; display: inline-block; }
    .instagram-parent { display: flex; align-items: flex-start; gap: 5.7px; opacity: 0.57; z-index: 1; }
    .instagram { position: relative; overflow: hidden; display: block; width: 20.7px; height: 20.7px; }
    .icon { position: absolute; top: 8.21%; right: 8.21%; bottom: 8.21%; left: 8.21%; max-width: 100%; overflow: hidden; max-height: 100%; display: block; width: 17.3px; height: 17.3px; }
    .almutspaethig { letter-spacing: -0.01em; line-height: 120%; display: block; position: relative; }
    .youtube-parent { display: flex; align-items: flex-start; gap: 5.6px; opacity: 0.57; z-index: 1; }
    .youtube-icon { position: relative; display: block; width: 20.7px; height: 20.7px; }
    .almutspaethyt { letter-spacing: -0.01em; line-height: 120%; display: block; position: relative; }


    /* ══════════════════════════════════════════
       PAGE: COACHING
    ══════════════════════════════════════════ */
    #page-coaching {
      background-color: var(--color-gray-100);
      width: 100%;
      max-width: 100vw;
      flex-direction: column;
      align-items: center;
      box-sizing: border-box;
      overflow-x: hidden;
    }
    .faq-section {
      width: 100%;
      max-width: 1280px;
      padding: 0 var(--padding-80);
      box-sizing: border-box;
      margin-top: var(--gap-24);
    }
    .faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-24); }
    .faq-card-full { grid-column: 1 / -1; }
    .faq-card {
      border-radius: var(--br-12);
      background: var(--White) padding-box, linear-gradient(90deg, #f9c5a0, #e4a040 26.44%, #d3a484 63.46%, #c4b4a4) border-box;
      border: 2px solid transparent;
      box-shadow: var(--shadow-drop-2);
      padding: var(--padding-24) var(--padding-28);
      box-sizing: border-box;
      display: flex; flex-direction: column; gap: 8px;
    }
    .faq-card:nth-child(even) {
      background: var(--White) padding-box, linear-gradient(90deg, #c5d4f9, #40b5e4 26.44%, #84c3d3 63.46%, #a4c4b4) border-box;
    }
    .faq-question { font-family: var(--font-handlee); font-size: var(--fs-22); color: var(--color-gray-200); line-height: 1.3; margin: 0; }
    .faq-answer { font-family: var(--font-kumbh-sans); font-size: var(--fs-13_6); color: var(--Gray-800); line-height: 21px; letter-spacing: -0.01em; margin: 0; }


    /* ══════════════════════════════════════════
       PAGE: WORKSHOPS
    ══════════════════════════════════════════ */
    #page-workshops {
      background-color: var(--color-gray-100);
      width: 100%;
      max-width: 100vw;
      flex-direction: column;
      align-items: center;
      box-sizing: border-box;
      overflow-x: hidden;
    }
    .workshops-section {
      width: 100%;
      max-width: 1280px;
      padding: 0 var(--padding-80);
      box-sizing: border-box;
      margin-top: var(--gap-24);
    }
    .workshops-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap-24); }
    .workshop-card {
      border-radius: var(--br-12);
      background: var(--White) padding-box, linear-gradient(90deg, #f9c5a0, #e4a040 26.44%, #d3a484 63.46%, #c4b4a4) border-box;
      border: 2px solid transparent;
      box-shadow: var(--shadow-drop-2);
      padding: var(--padding-24) var(--padding-28);
      box-sizing: border-box;
      display: flex; flex-direction: column; gap: 8px;
      transition: transform 0.18s ease, box-shadow 0.18s ease;
    }
    .workshop-card:hover { transform: translateY(-3px); box-shadow: 0px 4px 20px rgba(0,0,0,0.12); }
    .workshop-card:nth-child(even) {
      background: var(--White) padding-box, linear-gradient(90deg, #c5d4f9, #40b5e4 26.44%, #84c3d3 63.46%, #a4c4b4) border-box;
    }
    .workshop-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
    .workshop-title { font-family: var(--font-handlee); font-size: var(--fs-22); color: var(--color-gray-200); line-height: 1.3; margin: 0; }
    .workshop-date { font-family: var(--font-kumbh-sans); font-size: 12px; color: var(--color-dimgray-200); letter-spacing: -0.01em; margin: 0; }
    .workshop-desc { font-family: var(--font-kumbh-sans); font-size: var(--fs-13_6); color: var(--Gray-800); line-height: 21px; letter-spacing: -0.01em; margin: 0; }
    .external-link-icon { flex-shrink: 0; width: 20px; height: 20px; color: var(--Gray-800); opacity: 0.6; cursor: pointer; transition: opacity 0.15s; }
    .external-link-icon:hover { opacity: 1; }


    /* ══════════════════════════════════════════
       PAGE: SOUND HEALING
    ══════════════════════════════════════════ */
    #page-sound-healing {
      background-color: var(--color-gray-100);
      width: 100%;
      max-width: 100vw;
      flex-direction: column;
      align-items: center;
      box-sizing: border-box;
      overflow-x: hidden;
    }
    .empty-state {
      width: 100%;
      max-width: 1280px;
      padding: 16px var(--padding-80) 0;
      box-sizing: border-box;
      font-family: var(--font-kumbh-sans);
      font-size: var(--fs-18);
      color: var(--Gray-800);
      letter-spacing: -0.01em;
    }


    /* ══════════════════════════════════════════
       PAGE: CONTACT
    ══════════════════════════════════════════ */
    #page-contact {
      background-color: var(--color-gray-100);
      width: 100%;
      max-width: 100vw;
      flex-direction: column;
      align-items: center;
      box-sizing: border-box;
      overflow-x: hidden;
    }
    .contact-hero {
      width: 100%;
      min-height: 80vh;
      background: url('https://spaetz.codeberg.page/almut-www/Frame-1321315223-5-scaled.webp') center center / cover no-repeat;
      background-color: #e8e6e2;
      display: flex;
      flex-direction: column;
      align-items: center;
      position: relative;
    }
    .contact-hero::after {
      content: '';
      position: absolute;
      bottom: -1px;
      left: 0;
      width: 100%;
      height: 80px;
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' d='M0,40 C360,80 1080,0 1440,40 L1440,80 L0,80 Z'/%3E%3C/svg%3E") no-repeat center bottom;
      background-size: 100% 100%;
      pointer-events: none;
    }
    .contact-hero .hero-content { justify-content: center; flex: 1; }
    .email-btn {
      display: inline-block;
      margin-top: 8px;
      padding: 40px 162px;
      color: #fff;
      border-radius: 10px;
      background-image: url('https://spaetz.codeberg.page/almut-www/Frame-1321315222-2.webp');
      background-size: cover;
    }

    /* ══════════════════════════════════════════
       PAGE: IMPRESSUM
    ══════════════════════════════════════════ */
    #page-impressum {
      background-color: var(--color-gray-100);
      width: 100%;
      max-width: 100vw;
      flex-direction: column;
      align-items: center;
      box-sizing: border-box;
      overflow-x: hidden;
    }
    .impressum-content {
      width: 100%;
      max-width: 860px;
      padding: 20px var(--padding-80) 0;
      box-sizing: border-box;
      text-align: center;
    }
    .content h2 { font-family: var(--font-young-serif); font-size: var(--fs-48); font-weight: 400; color: var(--color-darkslategray-100); letter-spacing: -0.01em; line-height: 120%; margin: 0 0 40px; }
    .imprint-label { font-family: var(--font-kumbh-sans); font-size: var(--fs-14_8); font-weight: 600; color: var(--color-darkslategray-100); letter-spacing: 0.04em; text-transform: uppercase; margin: 0 0 6px; }
    .imprint-sub { font-family: var(--font-kumbh-sans); font-size: var(--fs-16); color: var(--Gray-800); line-height: 26px; letter-spacing: -0.01em; margin: 0 0 32px; }
    .content h3 { font-family: var(--font-kumbh-sans); font-size: var(--fs-16); font-weight: 600; color: var(--color-darkslategray-100); letter-spacing: -0.01em; margin: 0 0 12px; }
    .content { font-family: var(--font-kumbh-sans); font-size: var(--fs-16); color: var(--Gray-800); line-height: 28px; letter-spacing: -0.01em; margin: 0 0 20px; }
    .section-block { margin-bottom: 36px; }
    .address-block { font-family: var(--font-kumbh-sans); font-size: var(--fs-16); color: var(--Gray-800); line-height: 28px; letter-spacing: -0.01em; margin: 40px 0 32px; }
    .legal-notice { font-family: var(--font-kumbh-sans); font-size: var(--fs-16); color: var(--color-dimgray-200); letter-spacing: -0.01em; margin: 0; }
    .legal-notice a { color: var(--color-dimgray-200); }
    .fs-16 { font-size: var(--fs-16); }


    /* ══════════════════════════════════════════
       RESPONSIVE
    ══════════════════════════════════════════ */
    @media screen and (max-width: 1350px) {
      .are-you-interested-in-working-wrapper { padding-left: 20px; padding-right: 20px; box-sizing: border-box; }
      .group-section { flex-wrap: wrap; }
    }
    @media screen and (max-width: 900px) {
      .nav-links-wrapper { display: none; }
      .hamburger { display: flex; }
      .nav-bar { padding: var(--padding-24) var(--padding-24) 0; }
      .hero-content { padding: 24px var(--padding-24) 96px; }
      .hero-title { font-size: var(--fs-32); }
      .intro-section, .section-header, .faq-section, .workshops-section, .empty-state { padding: 0 var(--padding-24); }
      .testimonials-grid, .faq-grid, .workshops-grid { grid-template-columns: 1fr; padding: 0 var(--padding-24); }
      .faq-card-full { grid-column: 1; }
      .footer-social { flex-wrap: wrap; justify-content: center; }
      .impressum-content { padding: 20px var(--padding-24) 0; }
      .content h2 { font-size: var(--fs-32); }
    }
    @media screen and (max-width: 800px) {
      .frame-parent { gap: var(--gap-32); padding: 26px var(--padding-40) 33px; box-sizing: border-box; }
      .coaching-parent { display: none; }
      .frame-container { gap: 36px; }
      .frame-section { min-width: 100%; }
      .frame-div { gap: var(--gap-16); }
      .experience-music-with-container { font-size: 43px; line-height: 52px; }
      .frame-item { min-width: 100%; }
      .frame-parent3 { gap: var(--gap-24); }
      .are-you-interested { font-size: 43px; line-height: 52px; }
      .group-section { gap: var(--gap-16); }
      .sound-therapy { font-size: var(--fs-29); line-height: var(--lh-35); }
      .about-me { font-size: 34px; line-height: var(--lh-40); }
    }
    /* Image visibility: desktop shows .frame-item-desktop, mobile shows .frame-item-mobile */
    .frame-item-mobile { display: none; }
    .frame-item-desktop { display: block; }

    @media screen and (max-width: 600px) {
      .frame-item-desktop { display: none; }
      .frame-item-mobile {
        display: block;
        min-width: 0;
        width: 100%;
        height: 300px;
        border-radius: var(--br-12);
        border-width: 6px;
      }
      .hamburger { display: flex; }
      .frame-wrapper { display: none; }
      .frame-parent { padding: 20px 20px 28px; gap: var(--gap-24); }
      .frame-group { padding: 0; }
      .frame-child { width: 60px; height: 60px; }
      .frame-container { flex-direction: column; gap: 24px; }
      .frame-section { min-width: 0; padding-top: 0; }
      .experience-music-with-container { padding-right: 4px; font-size: 45px; line-height: 50px; }
      .given-the-enormous, .my-name-is { width: 100%; font-size: 15px; }
      .button { width: 100%; height: 52px; }
      .read-more-about { font-size: 20px; }
      .frame-item { min-width: 100%; width: 95%; height: 300px; border-radius: var(--br-12); border-width: 6px; }
      .are-you-interested { font-size: 30px; line-height: 38px; text-align: center; width: 100%; max-width: 100%; }
      .are-you-interested-in-working-wrapper { text-align: center; justify-content: center; width: 100%; }
      .frame-parent3 { width: 100%; align-items: center; }
      .page-9-inner { width: 100%; box-sizing: border-box; }
      .group-section { flex-direction: column; gap: 20px; }
      .frame-parent4, .frame-parent5, .frame-parent6 { align-self: anchor-center; width: 90%; padding: 24px 20px; }
      .sound-therapy { font-size: 26px; line-height: 32px; }
      .i-help-musicians { max-width: 100%; font-size: 14px; }
      .button2, .button3 { width: 100%; padding: 12px; }
      .cta-action-button { font-size: 18px; }
      .page-9-child { padding: 0 20px; }
      .frame-parent8 { flex-direction: column; font-size: 32px; overflow: visible; }
      .frame-inner { box-shadow: 0px 3px 15px #00000042; display: block; width: 100%; height: auto; left: 0; margin-bottom: 20px; border-radius: 28px; }
      .frame-wrapper2 { flex: none; width: 100%; }
      .about-me-parent { max-width: 100%; }
      .almut-is-a { max-width: 100%; font-size: 15px; }
      .about-me { font-size: 28px; line-height: 36px; }
    }
    @media screen and (max-width: 450px) {
      .hero-title { font-size: 28px; }
      .section-title { font-size: 28px; }
      .content h2 { font-size: 28px; }
    }
    @media screen and (max-width: 400px) {
      .experience-music-with-container { font-size: 28px; line-height: 32px; }
    }