{"id":8,"date":"2026-07-19T16:42:16","date_gmt":"2026-07-19T14:42:16","guid":{"rendered":"http:\/\/mawan-haven.de\/?page_id=8"},"modified":"2026-07-19T17:37:30","modified_gmt":"2026-07-19T15:37:30","slug":"8-2","status":"publish","type":"page","link":"https:\/\/mawan-haven.de\/","title":{"rendered":"Coming soon"},"content":{"rendered":"\n<!doctype html>\n<html lang=\"de\">\n<head>\n  <meta charset=\"utf-8\" \/>\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" \/>\n  <title>Mawan Haven \u2014 Coming Soon<\/title>\n  <meta name=\"description\" content=\"Mawan Haven entsteht. Sound Healing, Yoga und weiche R\u00e4ume f\u00fcr M\u00fctter und Frauen.\" \/>\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Josefin+Slab:wght@300;400;500;600&#038;display=swap\" rel=\"stylesheet\">\n  <style>\n    :root {\n      --mist: #EEF4F3;\n      --seafoam: #DDE9E5;\n      --ocean: #6F98A8;\n      --deep: #243D40;\n      --sage: #A9BCAE;\n      --clay: #C58D7E;\n      --gold: #CBB27C;\n      --mail-text: #DDE9E3;\n      --font: \"Josefin Slab\", Georgia, serif;\n    }\n\n    * { box-sizing: border-box; }\n\n    html,\n    body {\n      width: 100%;\n      height: 100%;\n      margin: 0;\n      overflow: hidden;\n    }\n\n    body {\n      font-family: var(--font);\n      color: var(--deep);\n      background: var(--mist);\n    }\n\n    .background {\n      position: fixed;\n      inset: -18px;\n      z-index: -4;\n      background-image: url(\"http:\/\/mawan-haven.de\/wp-content\/uploads\/2026\/07\/Klangschale30.jpg\");\n      background-size: cover;\n      background-position: center;\n      filter: blur(6px) saturate(0.78) brightness(1.08);\n      transform: scale(1.04);\n    }\n\n    .wash {\n      position: fixed;\n      inset: 0;\n      z-index: -3;\n      background:\n        radial-gradient(circle at 28% 45%, rgba(238,244,243,0.98) 0%, rgba(238,244,243,0.86) 35%, rgba(238,244,243,0.36) 60%, transparent 76%),\n        radial-gradient(circle at 72% 18%, rgba(221,233,229,0.76) 0%, rgba(221,233,229,0.34) 34%, transparent 62%),\n        radial-gradient(circle at 74% 82%, rgba(111,152,168,0.28) 0%, transparent 48%);\n    }\n\n    .orb {\n      position: fixed;\n      z-index: -2;\n      border-radius: 50%;\n      pointer-events: none;\n    }\n\n    .orb.one { width: 46vmin; aspect-ratio: 1; left: -18vmin; top: 10vmin; background: rgba(221,233,229,0.62); }\n    .orb.two { width: 25vmin; aspect-ratio: 1; right: 8vmin; top: 7vmin; background: rgba(238,244,243,0.56); }\n    .orb.three { width: 34vmin; aspect-ratio: 1; right: -12vmin; bottom: -12vmin; background: rgba(169,188,174,0.34); }\n\n    .page {\n      position: relative;\n      width: 100vw;\n      height: 100vh;\n      height: 100dvh;\n      display: grid;\n      place-items: center;\n      overflow: hidden;\n    }\n\n    .shell {\n      position: relative;\n      width: min(84vmin, 760px);\n      height: min(84vmin, 760px);\n      display: grid;\n      place-items: center;\n      border-radius: 48% 52% 45% 55% \/ 55% 43% 57% 45%;\n      background: rgba(238,244,243,0.80);\n      backdrop-filter: blur(10px);\n      box-shadow: 0 28px 90px rgba(36,61,64,0.18);\n    }\n\n    .shell::before,\n    .shell::after {\n      content: \"\";\n      position: absolute;\n      pointer-events: none;\n      border-radius: 48% 52% 45% 55% \/ 55% 43% 57% 45%;\n    }\n\n    .shell::before {\n      width: 91%;\n      aspect-ratio: 1;\n      border: 1px solid rgba(203,178,124,0.62);\n      transform: rotate(-7deg);\n    }\n\n    .shell::after {\n      width: 36%;\n      aspect-ratio: 1;\n      right: 4%;\n      bottom: 5%;\n      background: rgba(221,233,229,0.58);\n      z-index: -1;\n    }\n\n    .curve-label {\n      position: absolute;\n      inset: -0.2%;\n      width: 100.4%;\n      height: 100.4%;\n      overflow: visible;\n      pointer-events: none;\n      transform: rotate(-6deg);\n    }\n\n    .curve-label text {\n      fill: var(--ocean);\n      font-family: var(--font);\n      font-size: 18px;\n      font-weight: 600;\n      letter-spacing: 0.12em;\n    }\n\n    .mobile-arc-label { display: none; }\n\n    .content {\n      position: relative;\n      z-index: 2;\n      width: min(560px, 72%);\n      text-align: center;\n    }\n\n    h1 {\n      margin: 0;\n      color: var(--deep);\n      font-size: clamp(34px, 10.2vmin, 112px);\n      font-weight: 300;\n      line-height: 0.82;\n      letter-spacing: -0.055em;\n    }\n\n    .sound-lines {\n      width: min(280px, 50vmin);\n      height: clamp(24px, 5vmin, 48px);\n      margin: clamp(10px, 2vmin, 24px) auto clamp(6px, 1.4vmin, 14px);\n      display: block;\n      overflow: visible;\n    }\n\n    .sound-lines path { fill: none; stroke-linecap: round; stroke-width: 2.2; }\n    .sound-lines .gold { stroke: rgba(203,178,124,0.88); }\n    .sound-lines .ocean { stroke: rgba(111,152,168,0.72); }\n    .sound-lines .sage { stroke: rgba(169,188,174,0.72); }\n\n    .claim {\n      margin: 0;\n      color: var(--deep);\n      font-size: clamp(16px, 3.1vmin, 34px);\n      font-weight: 300;\n      line-height: 1.05;\n    }\n\n    .text {\n      max-width: 560px;\n      margin: clamp(8px, 1.8vmin, 20px) auto 0;\n      color: var(--deep);\n      font-size: clamp(10px, 1.78vmin, 18px);\n      font-weight: 400;\n      line-height: 1.34;\n    }\n\n    .contact {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: 270px;\n      height: 68px;\n      margin-top: clamp(18px, 3.6vmin, 42px);\n      padding: 0;\n      border-radius: 63% 37% 60% 40% \/ 45% 61% 39% 55%;\n      color: var(--mail-text);\n      background: var(--clay);\n      font-size: clamp(15px, 1.9vmin, 19px);\n      font-weight: 600;\n      line-height: 1;\n      text-align: center;\n      text-decoration: none;\n      white-space: nowrap;\n      overflow: hidden;\n      box-shadow: 0 14px 34px rgba(197,141,126,0.24);\n      transform: translateX(18px) rotate(-4deg);\n    }\n\n    .contact > span {\n      display: inline-block;\n      max-width: 94%;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      transform: rotate(4deg);\n    }\n\n    .imprint {\n      position: fixed;\n      right: 18px;\n      bottom: 10px;\n      z-index: 5;\n      font-size: 12px;\n      font-weight: 500;\n    }\n\n    .imprint a { color: rgba(36,61,64,0.48); text-decoration: none; }\n    .imprint a:hover, .imprint a:focus-visible { color: var(--deep); }\n\n    \/* Ein Mechanismus f\u00fcr mobil hochkant UND querformat:\n       Kreis immer 132vmin gro\u00df. In Hochkant schneidet er links\/rechts ab,\n       in Querformat oben\/unten. Nur der Inhalt skaliert responsiv. *\/\n    @media (max-width: 950px) {\n      .page {\n        display: block;\n      }\n\n      .shell {\n        position: fixed;\n        left: 50%;\n        top: 50%;\n        width: 132vmin;\n        height: 132vmin;\n        max-width: none;\n        max-height: none;\n        transform: translate(-50%, -50%);\n      }\n\n      .curve-label { display: none; }\n\n      .content {\n        position: fixed;\n        left: 50%;\n        top: 50%;\n        transform: translate(-50%, -50%);\n        width: min(74vw, 330px);\n        max-height: 86vh;\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n        text-align: center;\n      }\n\n      .mobile-arc-label {\n        display: block;\n        width: 100%;\n        margin: 0 auto clamp(8px, 2.4vmin, 14px);\n        color: var(--ocean);\n        font-size: clamp(10px, 3.2vmin, 14px);\n        font-weight: 600;\n        line-height: 1.18;\n        letter-spacing: 0.075em;\n        text-align: center;\n      }\n\n      h1 { font-size: clamp(44px, 15.5vmin, 82px); }\n\n      .sound-lines {\n        width: min(58vw, 245px);\n        height: clamp(24px, 7vmin, 42px);\n        margin: clamp(8px, 2.6vmin, 16px) auto clamp(6px, 1.8vmin, 10px);\n      }\n\n      .claim { font-size: clamp(18px, 5.8vmin, 30px); }\n\n      .text {\n        max-width: 31ch;\n        font-size: clamp(12px, 3.5vmin, 17px);\n        line-height: 1.28;\n        margin-top: clamp(8px, 2.2vmin, 14px);\n      }\n\n      .contact {\n        width: min(82vw, 270px);\n        height: 62px;\n        margin-top: clamp(18px, 5vmin, 34px);\n        font-size: clamp(13px, 3.6vmin, 17px);\n        transform: translateX(10px) rotate(-4deg);\n      }\n    }\n\n    \/* Nur f\u00fcr sehr flache Querformat-Viewports: gleicher Kreis-Anschnitt, Inhalt kleiner. *\/\n    @media (max-width: 950px) and (max-height: 520px) and (min-aspect-ratio: 4 \/ 3) {\n      .shell {\n        width: 132vmin;\n        height: 132vmin;\n      }\n\n      .content {\n        width: min(48vw, 310px);\n      }\n\n      .mobile-arc-label {\n        margin-bottom: clamp(2px, 1vmin, 6px);\n        font-size: clamp(8px, 2.4vmin, 11px);\n        line-height: 1.05;\n      }\n\n      h1 {\n        font-size: clamp(30px, 12vmin, 58px);\n        line-height: 0.78;\n      }\n\n      .sound-lines {\n        width: min(170px, 28vw);\n        height: clamp(14px, 4.6vmin, 24px);\n        margin: clamp(3px, 1.2vmin, 7px) auto;\n      }\n\n      .claim {\n        font-size: clamp(13px, 4.1vmin, 21px);\n        line-height: 1.02;\n      }\n\n      .text {\n        max-width: 34ch;\n        margin-top: clamp(3px, 1.2vmin, 7px);\n        font-size: clamp(8.5px, 2.6vmin, 13px);\n        line-height: 1.12;\n      }\n\n      .contact {\n        width: min(42vw, 240px);\n        height: clamp(36px, 9vmin, 54px);\n        margin-top: clamp(6px, 2vmin, 12px);\n        font-size: clamp(10px, 2.7vmin, 14px);\n      }\n\n      .imprint {\n        right: 8px;\n        bottom: 5px;\n        left: auto;\n        font-size: 9px;\n      }\n    }\n    \/* Mobile Hochkant: Kreis seitlich angeschnitten, Inhalt vollst\u00e4ndig sichtbar *\/\n    @media (max-width: 520px) and (orientation: portrait) {\n      .page {\n        display: block;\n        overflow: hidden;\n      }\n\n      .shell {\n        position: fixed;\n        left: 50%;\n        top: 50%;\n        width: 132vw;\n        height: 132vw;\n        transform: translate(-50%, -50%);\n      }\n\n      .content {\n        position: fixed;\n        left: 50%;\n        top: 50%;\n        transform: translate(-50%, -50%);\n        width: min(76vw, 330px);\n        max-height: 88dvh;\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        justify-content: center;\n      }\n\n      .mobile-arc-label {\n        margin-bottom: clamp(5px, 1.8vw, 10px);\n        font-size: clamp(9px, 2.8vw, 13px);\n        line-height: 1.08;\n      }\n\n      h1 {\n        font-size: clamp(42px, 15vw, 74px);\n        line-height: 0.78;\n      }\n\n      .sound-lines {\n        width: min(54vw, 220px);\n        height: clamp(22px, 6.2vw, 36px);\n        margin: clamp(6px, 2vw, 12px) auto clamp(4px, 1.4vw, 8px);\n      }\n\n      .claim {\n        font-size: clamp(18px, 5.5vw, 28px);\n        line-height: 1.02;\n      }\n\n      .text {\n        max-width: 30ch;\n        margin-top: clamp(6px, 2vw, 10px);\n        font-size: clamp(12px, 3.45vw, 15px);\n        line-height: 1.2;\n      }\n\n      .contact {\n        width: min(78vw, 260px);\n        height: clamp(50px, 14vw, 58px);\n        margin-top: clamp(12px, 4vw, 20px);\n        font-size: clamp(12px, 3.4vw, 15px);\n      }\n    }\n\n    \/* Sehr kurze Hochkant-Screens: Inhalt enger setzen, Kreis weiter angeschnitten lassen *\/\n    @media (max-width: 520px) and (max-height: 720px) and (orientation: portrait) {\n      .shell {\n        width: 142vw;\n        height: 142vw;\n      }\n\n      .content {\n        width: min(74vw, 310px);\n        max-height: 90dvh;\n      }\n\n      .mobile-arc-label {\n        margin-bottom: 4px;\n        font-size: clamp(8px, 2.5vw, 11px);\n      }\n\n      h1 {\n        font-size: clamp(36px, 13.5vw, 62px);\n      }\n\n      .sound-lines {\n        width: min(48vw, 190px);\n        height: clamp(18px, 5.2vw, 28px);\n        margin: 4px auto;\n      }\n\n      .claim {\n        font-size: clamp(16px, 4.8vw, 23px);\n      }\n\n      .text {\n        max-width: 29ch;\n        margin-top: 5px;\n        font-size: clamp(10.5px, 3.05vw, 13px);\n        line-height: 1.14;\n      }\n\n      .contact {\n        width: min(74vw, 240px);\n        height: clamp(42px, 12vw, 52px);\n        margin-top: 10px;\n        font-size: clamp(11px, 3vw, 13px);\n      }\n    }\n    \/* Final: Mailadresse sichtbar in #DDE9E3 *\/\n    .contact,\n    .contact:link,\n    .contact:visited,\n    .contact:hover,\n    .contact:focus-visible,\n    .contact > span {\n      color: #DDE9E3 !important;\n      opacity: 1 !important;\n      visibility: visible !important;\n    }\n\n    .contact > span {\n      display: inline-block !important;\n      max-width: 96% !important;\n      overflow: hidden !important;\n      text-overflow: ellipsis !important;\n      white-space: nowrap !important;\n    }\n    \/* Final fix: Mailtext sicher sichtbar \u00fcber dem Button *\/\n    .contact {\n      position: relative !important;\n      overflow: visible !important;\n      color: #DDE9E3 !important;\n    }\n\n    .contact > span {\n      color: #DDE9E3 !important;\n      opacity: 1 !important;\n      visibility: visible !important;\n      position: relative !important;\n      z-index: 3 !important;\n      max-width: 92% !important;\n      font-weight: 600 !important;\n      text-shadow: 0 1px 1px rgba(36,61,64,0.12) !important;\n    }\n  <\/style>\n<\/head>\n<body>\n  <div class=\"background\" aria-hidden=\"true\"><\/div>\n  <div class=\"wash\" aria-hidden=\"true\"><\/div>\n  <div class=\"orb one\" aria-hidden=\"true\"><\/div>\n  <div class=\"orb two\" aria-hidden=\"true\"><\/div>\n  <div class=\"orb three\" aria-hidden=\"true\"><\/div>\n\n  <main class=\"page\">\n    <section class=\"shell\" aria-label=\"Mawan Haven entsteht\">\n      <svg class=\"curve-label\" viewBox=\"0 0 500 500\" aria-hidden=\"true\">\n        <defs>\n          <path id=\"top-curve\" d=\"M 42 252 A 208 208 0 0 1 458 252\" \/>\n        <\/defs>\n        <text text-anchor=\"middle\">\n          <textPath href=\"#top-curve\" startOffset=\"50%\">SOUND HEALING \u00b7 YOGA \u00b7 SAFE SPACES<\/textPath>\n        <\/text>\n      <\/svg>\n\n      <div class=\"content\">\n        <p class=\"mobile-arc-label\">SOUND HEALING \u00b7 YOGA<br>SAFE SPACES<\/p>\n        <h1>Mawan<br>Haven<\/h1>\n\n        <svg class=\"sound-lines\" viewBox=\"0 0 420 78\" role=\"img\" aria-label=\"geschwungene Klanglinien\">\n          <path class=\"gold\" d=\"M42 42 C 92 12, 142 12, 192 42 S 292 72, 378 32\" \/>\n          <path class=\"ocean\" d=\"M72 52 C 122 30, 168 30, 214 52 S 294 72, 348 46\" \/>\n          <path class=\"sage\" d=\"M108 32 C 146 54, 184 54, 222 32 S 292 10, 326 34\" \/>\n        <\/svg>\n\n        <p class=\"claim\">Ein weicher Ort zum Ankommen.<\/p>\n        <p class=\"text\">\n          Hier entsteht ein ruhiger Raum f\u00fcr Klang, Atem und R\u00fcckverbindung \u2014 f\u00fcr M\u00fctter, Frauen und alle, die einen sicheren Moment zum Durchatmen suchen.\n        <\/p>\n        <a class=\"contact\" href=\"mailto:moin@mawan-haven.de\" aria-label=\"E-Mail an moin@mawan-haven.de\" title=\"moin@mawan-haven.de\"><span style=\"color:#DDE9E3 !important; opacity:1 !important; visibility:visible !important; position:relative; z-index:3; display:block; font-weight:600; text-shadow:0 1px 1px rgba(36,61,64,0.12);\">moin@mawan-haven.de<\/span><\/a>\n      <\/div>\n    <\/section>\n\n    <footer class=\"imprint\">\n      <a href=\"https:\/\/it-onkel.com\/impressum\" rel=\"noopener\">Impressum<\/a>\n    <\/footer>\n  <\/main>\n<\/body>\n<\/html>\n\n\n\n\n\n","protected":false},"excerpt":{"rendered":"<p>Mawan Haven \u2014 Coming Soon SOUND HEALING \u00b7 YOGA \u00b7 SAFE SPACES SOUND HEALING \u00b7 YOGASAFE SPACES MawanHaven Ein weicher Ort zum Ankommen. Hier entsteht ein ruhiger Raum f\u00fcr Klang, Atem und R\u00fcckverbindung \u2014 f\u00fcr M\u00fctter, Frauen und alle, die einen sicheren Moment zum Durchatmen suchen. moin@mawan-haven.de Impressum<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"neve_meta_sidebar":"default","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"on","neve_meta_disable_footer":"on","neve_meta_disable_title":"on","footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mawan-haven.de\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mawan-haven.de\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mawan-haven.de\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mawan-haven.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mawan-haven.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":4,"href":"https:\/\/mawan-haven.de\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":15,"href":"https:\/\/mawan-haven.de\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/15"}],"wp:attachment":[{"href":"https:\/\/mawan-haven.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}