:root{
      --bg:#fff8fc;
      --bg2:#fff3f8;
      --paper:#ffffff;
      --ink:#2e2540;
      --muted:#776d87;
      --pink:#ff6fa8;
      --pink-dark:#e64b8a;
      --peach:#ffd7c9;
      --yellow:#ffe58a;
      --mint:#ccf3e7;
      --sky:#d8ecff;
      --lav:#e9ddff;
      --line:rgba(46,37,64,.10);
      --shadow:0 18px 45px rgba(137,73,126,.15);
      --shadow-soft:0 10px 30px rgba(137,73,126,.10);
      --radius-xl:34px;
      --radius-lg:24px;
      --radius-md:18px;
      --max:1180px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      background:
        radial-gradient(circle at top left, #ffe8f2 0, transparent 28%),
        radial-gradient(circle at top right, #e7f7ff 0, transparent 24%),
        linear-gradient(180deg, var(--bg) 0%, #fffdfd 100%);
      overflow-x:hidden;
      line-height:1.6;
    }
    a{color:inherit}
    img{display:block;max-width:100%}
    .container{width:min(var(--max), calc(100% - 36px)); margin:auto}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:#fff;
      border:1px solid rgba(255,111,168,.16);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
      color:var(--pink-dark);box-shadow:var(--shadow-soft);
    }

    header{
      position:sticky;top:0;z-index:100;background:rgba(255,248,252,.82);backdrop-filter:blur(16px);
      border-bottom:1px solid rgba(47,36,64,.06);
    }
    .nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .brand{display:flex;align-items:center;gap:12px;text-decoration:none}
    .brand-mark{
      width:48px;height:48px;border-radius:16px;display:grid;place-items:center;
      background:linear-gradient(145deg, var(--pink), #ff95bf);color:#fff;font-size:24px;
      box-shadow:0 10px 28px rgba(255,111,168,.28);
    }
    .brand strong{display:block;font:700 24px/1 Georgia,serif}
    .brand small{display:block;color:var(--muted);font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-top:3px}
    nav{display:flex;align-items:center;gap:24px}
    nav a{text-decoration:none;font-size:14px;font-weight:700}
    nav a:hover{color:var(--pink-dark)}
    nav .cta{padding:11px 16px;border-radius:999px;background:linear-gradient(145deg, var(--pink), var(--pink-dark));color:#fff;box-shadow:0 10px 24px rgba(255,111,168,.24)}
    .menu{display:none;border:0;background:none;font-size:28px;color:var(--ink)}

    .hero{
      position:relative;overflow:hidden;padding:66px 0 90px;
    }
    .hero::before{
      content:"";position:absolute;left:-80px;top:70px;width:220px;height:220px;background:var(--yellow);opacity:.35;
      border-radius:54% 46% 44% 56% / 43% 35% 65% 57%;filter:blur(10px);
    }
    .hero::after{
      content:"";position:absolute;right:-60px;top:120px;width:240px;height:240px;background:#ffd7ee;opacity:.55;
      border-radius:42% 58% 69% 31% / 37% 52% 48% 63%;filter:blur(10px);
    }
    .hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center}
    .hero h1{font:700 clamp(54px, 8vw, 90px)/.92 Georgia, serif;letter-spacing:-.045em;margin:20px 0 24px}
    .hero h1 em{display:block;color:var(--pink-dark);font-style:normal}
    .hero .lead{font:400 22px/1.5 Georgia, serif;max-width:620px;margin:0 0 12px}
    .hero .sub{max-width:610px;color:var(--muted);font-size:16px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0 22px}
    .btn{min-height:52px;display:inline-flex;align-items:center;justify-content:center;padding:0 22px;border-radius:999px;text-decoration:none;font-weight:800;transition:.18s ease}
    .btn:hover{transform:translateY(-2px)}
    .btn-primary{background:linear-gradient(145deg, var(--pink), var(--pink-dark));color:#fff;box-shadow:0 12px 28px rgba(255,111,168,.26)}
    .btn-secondary{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft)}
    .trust{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:12px;font-weight:700}
    .hero-image-card{
      position:relative;border-radius:38px;overflow:hidden;background:#fff;border:10px solid rgba(255,255,255,.78);
      box-shadow:var(--shadow);min-height:610px;
    }
    .hero-image-card img{width:100%;height:610px;object-fit:cover}
    .bubble{
      position:absolute;z-index:3;background:#fff;box-shadow:var(--shadow-soft);border-radius:18px;padding:14px 16px;display:flex;gap:10px;align-items:center;
    }
    .bubble.one{left:-20px;bottom:30px}
    .bubble.two{right:-16px;top:26px}
    .bubble span{font-size:24px}
    .bubble b{display:block;font:700 16px/1.1 Georgia,serif}
    .bubble small{display:block;color:var(--muted);font-size:11px}

    .section{padding:88px 0}
    .section-title{font:700 clamp(38px, 4.8vw, 58px)/1.08 Georgia, serif;letter-spacing:-.03em;margin:14px 0 18px}
    .section-head{max-width:760px;margin-bottom:34px}
    .section-head p{margin:0;color:var(--muted);font-size:17px}
    .about-wrap{display:grid;grid-template-columns:.82fr 1.18fr;gap:40px;align-items:center}
    .feature-photo{
      background:#fff;border:1px solid rgba(47,36,64,.06);border-radius:28px;padding:14px;box-shadow:var(--shadow-soft);
    }
    .feature-photo img{width:100%;border-radius:22px;object-fit:cover}
    .about-copy{font-size:18px;color:#4a4258;line-height:1.75}
    .about-copy p:first-child{margin-top:0}
    .facts{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:22px}
    .fact{display:flex;gap:12px;align-items:flex-start;padding:14px 15px;border-radius:18px;background:#fff;border:1px solid rgba(47,36,64,.06);box-shadow:var(--shadow-soft)}
    .fact span{font-size:22px}

    .services{background:linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,.35)),linear-gradient(135deg, #fff1f7 0%, #fdf6ff 40%, #f3fbff 100%)}
    .service-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:18px}
    .service{background:#fff;border:1px solid rgba(47,36,64,.06);border-radius:28px;padding:26px 22px;box-shadow:var(--shadow-soft);transition:.2s ease}
    .service:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(137,73,126,.12)}
    .icon{width:56px;height:56px;display:grid;place-items:center;border-radius:18px;font-size:28px}
    .service:nth-child(1) .icon{background:var(--mint)}
    .service:nth-child(2) .icon{background:#ffe3f0}
    .service:nth-child(3) .icon{background:#fff0c0}
    .service:nth-child(4) .icon{background:#deefff}
    .service h3{margin:18px 0 8px;font:700 22px/1.15 Georgia, serif}
    .service p{margin:0;color:var(--muted);font-size:14px}
    .parent-note{margin-top:24px;display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid rgba(255,111,168,.12);border-radius:20px;padding:20px 22px;box-shadow:var(--shadow-soft)}
    .parent-note .big{font-size:28px}
    .parent-note p{margin:4px 0 0;color:var(--muted)}

    .photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
    .photo-card{background:#fff;border-radius:30px;overflow:hidden;border:1px solid rgba(47,36,64,.06);box-shadow:var(--shadow-soft)}
    .photo-card img{width:100%;height:300px;object-fit:cover}
    .photo-copy{padding:24px}
    .mini{display:inline-block;padding:6px 10px;border-radius:999px;background:#fff2f8;color:var(--pink-dark);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
    .photo-card h3{margin:12px 0 8px;font:700 30px/1.1 Georgia, serif}
    .photo-card p{margin:0;color:var(--muted)}

    .dream{background:linear-gradient(145deg, #ff7cb0 0%, #ff8ab7 35%, #a784ff 100%);color:#fff;position:relative;overflow:hidden}
    .dream::before{content:"";position:absolute;right:-80px;bottom:-70px;width:260px;height:260px;border-radius:54% 46% 49% 51% / 38% 59% 41% 62%;background:rgba(255,255,255,.12)}
    .dream-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center;position:relative;z-index:1}
    .dream-photo{background:rgba(255,255,255,.15);padding:14px;border-radius:30px;backdrop-filter:blur(2px);box-shadow:var(--shadow-soft)}
    .dream-photo img{width:100%;border-radius:22px;height:460px;object-fit:cover}
    .dream p{color:rgba(255,255,255,.90);font-size:18px;line-height:1.75;margin:0}
    .dream-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
    .dream-list span{display:block;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);font-size:14px;font-weight:700}

    .journal-grid{display:grid;grid-template-columns:1fr .92fr;gap:34px;align-items:center;background:linear-gradient(145deg, #fff, #fff6fb);border:1px solid rgba(47,36,64,.06);border-radius:34px;padding:32px;box-shadow:var(--shadow-soft)}
    .journal-grid p{color:var(--muted)}
    .post-preview{background:#fff;border-radius:24px;padding:22px;box-shadow:var(--shadow-soft);border:1px solid rgba(47,36,64,.06)}
    .post-preview img{width:100%;height:260px;object-fit:cover;border-radius:18px;margin-bottom:16px}
    .post-preview small{color:var(--pink-dark);font-size:11px;font-weight:800;letter-spacing:.12em}
    .post-preview h3{margin:12px 0 10px;font:700 28px/1.15 Georgia, serif}
    .post-preview p{margin:0 0 10px}
    .post-preview .more{color:var(--pink-dark);font-size:13px;font-weight:800}

    .family-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:start}
    .wide-card,.side-card{background:#fff;border:1px solid rgba(47,36,64,.06);border-radius:30px;overflow:hidden;box-shadow:var(--shadow-soft)}
    .wide-card img{width:100%;height:420px;object-fit:cover}
    .side-card .inside{padding:22px}
    .side-card .nova-placeholder{padding:24px;background:linear-gradient(145deg,#fff2f8,#eef9ff);min-height:220px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--muted);font-weight:700}

    .contact{padding-top:34px}
    .contact-card{background:linear-gradient(145deg, #ff78ad 0%, #ff6fa8 45%, #d360b6 100%);color:#fff;border-radius:34px;padding:50px;display:grid;grid-template-columns:1.12fr .88fr;gap:40px;align-items:center;box-shadow:var(--shadow)}
    .contact-card p{color:rgba(255,255,255,.88);margin:0;font-size:17px}
    .contact-side{text-align:right}
    .btn-light{background:#fff;color:var(--pink-dark);box-shadow:0 12px 30px rgba(0,0,0,.12)}
    .contact-side small{display:block;margin-top:12px;color:rgba(255,255,255,.76)}

    footer{padding:28px 0 40px}
    .footer{display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center;border-top:1px solid rgba(47,36,64,.08);padding-top:24px}
    .footer p{margin:0;color:var(--muted);font-size:13px}
    .footer .right{text-align:right}

    @media (max-width:950px){
      .menu{display:block}
      nav{display:none;position:absolute;top:78px;left:18px;right:18px;padding:18px;border-radius:20px;background:#fff;box-shadow:var(--shadow);border:1px solid rgba(47,36,64,.08);flex-direction:column;align-items:stretch}
      nav.open{display:flex}
      .hero-grid,.about-wrap,.dream-grid,.journal-grid,.family-grid,.contact-card{grid-template-columns:1fr}
      .service-grid,.photo-grid{grid-template-columns:1fr 1fr}
      .facts{grid-template-columns:1fr 1fr}
      .contact-side{text-align:left}
      .footer{grid-template-columns:1fr}
      .footer .right{text-align:left}
      .hero-image-card img{height:520px}
      .bubble.one{left:14px}
      .bubble.two{right:14px}
    }
    @media (max-width:640px){
      .container{width:min(100% - 24px, var(--max))}
      .hero{padding-top:52px}
      .hero h1{font-size:50px}
      .hero .lead{font-size:19px}
      .service-grid,.photo-grid,.dream-list,.facts{grid-template-columns:1fr}
      .journal-grid,.contact-card{padding:24px}
      .hero-image-card img{height:420px}
      .bubble{position:relative;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:12px 0 0}
      .trust{display:grid;gap:6px}
      .section{padding:68px 0}
      .photo-card img,.wide-card img,.dream-photo img,.post-preview img{height:auto}
    }
  
    /* ===== Dynamic premium motion layer ===== */
    html{scroll-padding-top:92px}
    body.motion-ready .reveal,
    body.motion-ready .reveal-left,
    body.motion-ready .reveal-right,
    body.motion-ready .reveal-scale{
      opacity:0;
      will-change:transform,opacity;
      transition:
        opacity .85s cubic-bezier(.22,.61,.36,1),
        transform .85s cubic-bezier(.22,.61,.36,1);
    }
    body.motion-ready .reveal{transform:translateY(34px)}
    body.motion-ready .reveal-left{transform:translateX(-42px)}
    body.motion-ready .reveal-right{transform:translateX(42px)}
    body.motion-ready .reveal-scale{transform:scale(.965) translateY(18px)}
    body.motion-ready .is-visible{
      opacity:1!important;
      transform:none!important;
    }
    .delay-1{transition-delay:.08s!important}
    .delay-2{transition-delay:.16s!important}
    .delay-3{transition-delay:.24s!important}
    .delay-4{transition-delay:.32s!important}

    header{
      transition:min-height .25s ease, box-shadow .25s ease, background .25s ease;
    }
    header.scrolled{
      background:rgba(255,248,252,.94);
      box-shadow:0 8px 30px rgba(108,70,105,.08);
    }
    header.scrolled .nav{min-height:68px}

    .hero-copy{position:relative;z-index:2}
    .hero-image-card{
      transform:translateZ(0);
      animation:heroFloat 7s ease-in-out infinite;
    }
    @keyframes heroFloat{
      0%,100%{transform:translateY(0) rotate(-.3deg)}
      50%{transform:translateY(-10px) rotate(.35deg)}
    }
    .bubble.one{animation:bobOne 5.5s ease-in-out infinite}
    .bubble.two{animation:bobTwo 6.3s ease-in-out infinite}
    @keyframes bobOne{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
    @keyframes bobTwo{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(7px) rotate(1deg)}}

    .spark{
      position:absolute;
      z-index:1;
      pointer-events:none;
      opacity:.5;
      filter:drop-shadow(0 8px 18px rgba(255,111,168,.16));
      animation:sparkFloat 8s ease-in-out infinite;
    }
    .spark.s1{left:4%;top:18%;font-size:28px;color:#ff8fbb}
    .spark.s2{left:48%;top:10%;font-size:21px;color:#f3b447;animation-delay:-2s}
    .spark.s3{right:3%;bottom:18%;font-size:28px;color:#8f80f5;animation-delay:-4s}
    @keyframes sparkFloat{
      0%,100%{transform:translate3d(0,0,0) rotate(0deg)}
      50%{transform:translate3d(0,-16px,0) rotate(12deg)}
    }

    .scroll-cue{
      margin-top:28px;
      display:inline-flex;
      align-items:center;
      gap:9px;
      color:var(--muted);
      font-size:12px;
      font-weight:800;
      letter-spacing:.04em;
    }
    .scroll-cue i{
      width:20px;height:31px;border:1.5px solid rgba(46,37,64,.22);
      border-radius:999px;display:block;position:relative;
    }
    .scroll-cue i:after{
      content:"";position:absolute;left:50%;top:6px;width:4px;height:4px;
      margin-left:-2px;border-radius:50%;background:var(--pink);
      animation:wheel 1.8s ease-in-out infinite;
    }
    @keyframes wheel{
      0%{opacity:0;transform:translateY(0)}
      30%{opacity:1}
      100%{opacity:0;transform:translateY(12px)}
    }

    .motion-strip{
      overflow:hidden;
      border-top:1px solid rgba(46,37,64,.06);
      border-bottom:1px solid rgba(46,37,64,.06);
      background:rgba(255,255,255,.72);
      backdrop-filter:blur(10px);
    }
    .motion-track{
      width:max-content;
      display:flex;
      align-items:center;
      gap:28px;
      padding:14px 0;
      animation:marquee 30s linear infinite;
    }
    .motion-track span{
      white-space:nowrap;
      color:#665d77;
      font-size:12px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .motion-track b{color:var(--pink)}
    @keyframes marquee{to{transform:translateX(-50%)}}

    .service,.photo-card,.fact,.post-preview,.wide-card,.side-card,.future-card{
      transform:translateZ(0);
      transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
    }
    .service:hover,.photo-card:hover,.fact:hover,.post-preview:hover,.wide-card:hover,.side-card:hover,.future-card:hover{
      transform:translateY(-6px);
      box-shadow:0 20px 46px rgba(137,73,126,.14);
      border-color:rgba(255,111,168,.20);
    }
    .photo-card img,.feature-photo img,.dream-photo img,.wide-card img,.post-preview img{
      transition:transform .75s cubic-bezier(.22,.61,.36,1);
    }
    .photo-card:hover img,.feature-photo:hover img,.dream-photo:hover img,.wide-card:hover img,.post-preview:hover img{
      transform:scale(1.025);
    }
    .feature-photo,.dream-photo,.wide-card,.post-preview,.photo-card{
      overflow:hidden;
    }

    .paw-divider{
      display:flex;align-items:center;justify-content:center;gap:15px;
      padding:7px 0;color:#c799b4;font-size:17px;
    }
    .paw-divider:before,.paw-divider:after{
      content:"";height:1px;width:min(180px,25vw);
      background:linear-gradient(90deg,transparent,rgba(230,75,138,.18));
    }
    .paw-divider:after{background:linear-gradient(90deg,rgba(230,75,138,.18),transparent)}

    .future{
      position:relative;
      background:
        radial-gradient(circle at 12% 12%,rgba(255,229,138,.28),transparent 22%),
        radial-gradient(circle at 86% 22%,rgba(216,236,255,.52),transparent 24%),
        linear-gradient(145deg,#fffafe,#fff);
    }
    .future-grid{
      display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
    }
    .future-card{
      position:relative;
      overflow:hidden;
      background:#fff;
      border:1px solid rgba(46,37,64,.07);
      border-radius:28px;
      padding:27px 24px;
      box-shadow:var(--shadow-soft);
    }
    .future-card:after{
      content:"";
      position:absolute;right:-34px;top:-34px;width:110px;height:110px;
      border-radius:50%;
      background:var(--tone,#ffe7f1);
      opacity:.55;
      transition:transform .35s ease;
    }
    .future-card:hover:after{transform:scale(1.15)}
    .future-icon{
      width:56px;height:56px;border-radius:18px;display:grid;place-items:center;
      font-size:27px;background:var(--tone,#ffe7f1);position:relative;z-index:2;
    }
    .future-card h3{font:700 23px/1.15 Georgia,serif;margin:18px 0 8px;position:relative;z-index:2}
    .future-card p{margin:0;color:var(--muted);font-size:14px;position:relative;z-index:2}
    .future-card:nth-child(1){--tone:#ffe1ee}
    .future-card:nth-child(2){--tone:#e3f6ff}
    .future-card:nth-child(3){--tone:#fff0bc}

    .location-chip{
      display:inline-flex;align-items:center;gap:7px;
      margin-top:12px;padding:8px 12px;border-radius:999px;
      background:rgba(216,236,255,.58);
      border:1px solid rgba(87,143,184,.12);
      color:#5b6474;font-size:12px;font-weight:800;
    }

    .parallax-img{will-change:transform}
    @media (prefers-reduced-motion: reduce){
      *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
      body.motion-ready .reveal,
      body.motion-ready .reveal-left,
      body.motion-ready .reveal-right,
      body.motion-ready .reveal-scale{opacity:1;transform:none}
    }
    @media(max-width:950px){
      .future-grid{grid-template-columns:1fr}
      .hero-image-card{animation:none}
      .motion-track{animation-duration:40s}
    }

  
    .hero .lead strong{color:var(--pink-dark)}
    .hero .sub strong{color:#4d405d}
    #angebot .service-grid{margin-top:8px}
    #ablauf .future-grid{margin-top:12px}
    #kontakt .section-title{max-width:680px}


    /* ===== Contact form ===== */
    .contact-form-section{
      background:
        radial-gradient(circle at 12% 10%, rgba(255,229,138,.24), transparent 25%),
        radial-gradient(circle at 90% 16%, rgba(216,236,255,.5), transparent 28%),
        linear-gradient(180deg,#fffafe 0%,#fff 100%);
    }
    .form-shell{
      display:grid;
      grid-template-columns:.78fr 1.22fr;
      gap:34px;
      align-items:start;
    }
    .form-intro{
      position:sticky;
      top:104px;
      background:linear-gradient(145deg,#fff,#fff6fb);
      border:1px solid rgba(46,37,64,.07);
      border-radius:30px;
      padding:30px;
      box-shadow:var(--shadow-soft);
    }
    .form-intro h3{
      margin:15px 0 10px;
      font:700 30px/1.12 Georgia,serif;
    }
    .form-intro p{margin:0;color:var(--muted)}
    .form-intro ul{
      margin:20px 0 0;
      padding:0;
      list-style:none;
      display:grid;
      gap:10px;
    }
    .form-intro li{
      display:flex;
      gap:10px;
      align-items:flex-start;
      font-size:14px;
      color:#544a63;
    }
    .form-card{
      background:#fff;
      border:1px solid rgba(46,37,64,.07);
      border-radius:30px;
      padding:30px;
      box-shadow:var(--shadow);
    }
    .form-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:16px;
    }
    .field{display:grid;gap:7px}
    .field.full{grid-column:1/-1}
    .field label{
      font-size:13px;
      font-weight:800;
      color:#4b4159;
    }
    .field input,
    .field textarea,
    .field select{
      width:100%;
      border:1px solid rgba(46,37,64,.12);
      border-radius:15px;
      background:#fffafd;
      color:var(--ink);
      padding:13px 14px;
      font:inherit;
      outline:none;
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }
    .field textarea{min-height:150px;resize:vertical}
    .field input:focus,
    .field textarea:focus,
    .field select:focus{
      border-color:rgba(230,75,138,.55);
      box-shadow:0 0 0 4px rgba(255,111,168,.10);
      background:#fff;
    }
    .form-subtitle{
      grid-column:1/-1;
      margin:10px 0 -2px;
      padding-top:12px;
      border-top:1px solid rgba(46,37,64,.07);
      font:700 20px/1.2 Georgia,serif;
    }
    .upload-box{
      border:1.5px dashed rgba(230,75,138,.30);
      background:linear-gradient(145deg,#fff8fc,#f7fbff);
      border-radius:20px;
      padding:20px;
    }
    .upload-box input[type=file]{
      padding:0;
      border:0;
      background:transparent;
      box-shadow:none;
    }
    .upload-hint{
      margin:8px 0 0;
      color:var(--muted);
      font-size:12px;
    }
    .file-list{
      display:grid;
      gap:8px;
      margin-top:12px;
    }
    .file-pill{
      display:flex;
      align-items:center;
      gap:8px;
      padding:9px 11px;
      border-radius:12px;
      background:#fff;
      border:1px solid rgba(46,37,64,.07);
      font-size:12px;
      font-weight:700;
      color:#5d536c;
    }
    .checkline{
      grid-column:1/-1;
      display:flex;
      align-items:flex-start;
      gap:10px;
      margin-top:4px;
      color:var(--muted);
      font-size:12px;
    }
    .checkline input{margin-top:3px}
    .submit-row{
      grid-column:1/-1;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      margin-top:4px;
    }
    .submit-note{
      color:var(--muted);
      font-size:12px;
      max-width:390px;
    }
    .form-status{
      grid-column:1/-1;
      display:none;
      margin-top:8px;
      padding:12px 14px;
      border-radius:14px;
      background:#fff5db;
      border:1px solid rgba(211,170,100,.25);
      color:#695725;
      font-size:13px;
      font-weight:700;
    }
    .form-status.show{display:block}

    @media(max-width:950px){
      .form-shell{grid-template-columns:1fr}
      .form-intro{position:relative;top:auto}
    }
    @media(max-width:640px){
      .form-grid{grid-template-columns:1fr}
      .field.full,.form-subtitle,.checkline,.submit-row,.form-status{grid-column:1}
      .form-card,.form-intro{padding:22px}
      .submit-row{align-items:stretch;flex-direction:column}
    }


    /* ===== Repeating scroll animation system ===== */
    .reveal,
    .reveal-left,
    .reveal-right,
    .reveal-scale,
    .reveal-rotate{
      opacity:0;
      will-change:transform,opacity;
      transition:
        opacity .72s cubic-bezier(.22,.61,.36,1),
        transform .72s cubic-bezier(.22,.61,.36,1);
    }

    .reveal{transform:translateY(34px)}
    .reveal-left{transform:translateX(-42px)}
    .reveal-right{transform:translateX(42px)}
    .reveal-scale{transform:translateY(22px) scale(.965)}
    .reveal-rotate{transform:translateY(28px) rotate(-1.2deg) scale(.98)}

    .is-visible{
      opacity:1!important;
      transform:none!important;
    }

    .stagger > *{
      opacity:0;
      transform:translateY(28px);
      transition:
        opacity .68s cubic-bezier(.22,.61,.36,1),
        transform .68s cubic-bezier(.22,.61,.36,1);
    }
    .stagger.is-visible > *{opacity:1;transform:none}
    .stagger.is-visible > *:nth-child(1){transition-delay:.04s}
    .stagger.is-visible > *:nth-child(2){transition-delay:.10s}
    .stagger.is-visible > *:nth-child(3){transition-delay:.16s}
    .stagger.is-visible > *:nth-child(4){transition-delay:.22s}
    .stagger.is-visible > *:nth-child(5){transition-delay:.28s}
    .stagger.is-visible > *:nth-child(6){transition-delay:.34s}

    /* softer section motion accents */
    section{
      position:relative;
      isolation:isolate;
    }
    section::after{
      content:"";
      position:absolute;
      width:150px;height:150px;
      border-radius:50%;
      background:radial-gradient(circle, rgba(255,111,168,.10), rgba(255,111,168,0) 70%);
      right:4%;
      top:10%;
      pointer-events:none;
      z-index:-1;
      animation:sectionGlow 8s ease-in-out infinite;
    }
    @keyframes sectionGlow{
      0%,100%{transform:translateY(0) scale(1)}
      50%{transform:translateY(-12px) scale(1.07)}
    }

    .section-title{
      transition:letter-spacing .45s ease, transform .45s ease;
    }
    .is-visible .section-title,
    .section-head.is-visible .section-title{
      letter-spacing:-.032em;
    }

    /* top progress bar */
    .scroll-progress{
      position:fixed;
      top:0;left:0;
      height:3px;
      width:0%;
      z-index:9999;
      background:linear-gradient(90deg,var(--pink),#9f7cff);
      box-shadow:0 2px 10px rgba(255,111,168,.25);
      pointer-events:none;
    }

    /* active nav state */
    nav a.active{
      color:var(--pink-dark);
      position:relative;
    }
    nav a.active::after{
      content:"";
      position:absolute;
      left:12%;right:12%;bottom:-7px;
      height:2px;border-radius:99px;
      background:var(--pink);
    }
    nav .cta.active::after{display:none}
    nav .cta.active{
      color:#fff;
      box-shadow:0 12px 28px rgba(255,111,168,.34);
    }

    /* back-to-top */
    .back-to-top{
      position:fixed;
      right:24px;
      bottom:24px;
      z-index:999;
      width:48px;
      height:48px;
      border:0;
      border-radius:50%;
      background:linear-gradient(145deg,var(--pink),var(--pink-dark));
      color:#fff;
      font-size:22px;
      font-weight:800;
      display:grid;
      place-items:center;
      cursor:pointer;
      box-shadow:0 14px 30px rgba(230,75,138,.28);
      opacity:0;
      visibility:hidden;
      transform:translateY(16px) scale(.9);
      transition:opacity .25s ease,transform .25s ease,visibility .25s ease,box-shadow .25s ease;
    }
    .back-to-top.show{
      opacity:1;
      visibility:visible;
      transform:none;
    }
    .back-to-top:hover{
      transform:translateY(-3px);
      box-shadow:0 18px 34px rgba(230,75,138,.35);
    }

    /* make cards feel more alive but still professional */
    .service:hover .icon,
    .future-card:hover .future-icon{
      transform:rotate(-4deg) scale(1.06);
    }
    .icon,.future-icon{
      transition:transform .28s ease;
    }

    .photo-card,.wide-card,.feature-photo,.dream-photo,.post-preview{
      position:relative;
    }
    .photo-card::after,.wide-card::after,.feature-photo::after,.dream-photo::after,.post-preview::after{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.22),transparent 70%);
      transform:translateX(-120%);
      transition:transform .9s ease;
      pointer-events:none;
    }
    .photo-card:hover::after,.wide-card:hover::after,.feature-photo:hover::after,.dream-photo:hover::after,.post-preview:hover::after{
      transform:translateX(120%);
    }

    @media(max-width:640px){
      .back-to-top{right:16px;bottom:16px;width:44px;height:44px}
      section::after{width:110px;height:110px}
    }

    @media(prefers-reduced-motion:reduce){
      .reveal,.reveal-left,.reveal-right,.reveal-scale,.reveal-rotate,
      .stagger > *{
        opacity:1!important;
        transform:none!important;
        transition:none!important;
      }
      section::after{animation:none}
      .scroll-progress{display:none}
    }


    /* ===== v6: guaranteed repeating animations + clearer back-to-top ===== */
    .back-to-top{
      right:22px!important;
      bottom:22px!important;
      width:54px!important;
      height:54px!important;
      z-index:10000!important;
      font-size:26px!important;
      border:2px solid rgba(255,255,255,.9)!important;
    }
    .back-to-top.show{
      opacity:1!important;
      visibility:visible!important;
      transform:none!important;
    }
/* When elements leave viewport they reset fully, ready to animate again */
    .reveal:not(.is-visible),
    .reveal-left:not(.is-visible),
    .reveal-right:not(.is-visible),
    .reveal-scale:not(.is-visible),
    .reveal-rotate:not(.is-visible){
      pointer-events:auto;
    }

    @media(max-width:640px){
      .back-to-top{
        right:14px!important;
        bottom:14px!important;
        width:48px!important;
        height:48px!important;
      }
    }


    /* ===== v7: hero interaction, glowing top arrow, custom upload button ===== */

    /* back-to-top glow / shimmer */
    .back-to-top{
      overflow:hidden;
      transition:
        opacity .25s ease,
        transform .25s ease,
        visibility .25s ease,
        box-shadow .25s ease,
        filter .25s ease!important;
    }
    .back-to-top::before{
      content:"";
      position:absolute;
      top:-25%;
      left:-75%;
      width:45%;
      height:150%;
      background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.75),
        transparent
      );
      transform:skewX(-20deg);
      transition:left .55s ease;
      pointer-events:none;
    }
    .back-to-top:hover{
      transform:translateY(-4px) scale(1.05)!important;
      box-shadow:
        0 0 0 7px rgba(255,111,168,.10),
        0 16px 38px rgba(230,75,138,.42)!important;
      filter:saturate(1.08) brightness(1.04);
    }
    .back-to-top:hover::before{
      left:135%;
    }

    /* richer hero movement */
    .hero-image-card{
      perspective:1000px;
      transform-style:preserve-3d;
      transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease;
    }
    .hero-image-card:hover{
      box-shadow:
        0 28px 65px rgba(137,73,126,.20),
        0 0 0 1px rgba(255,111,168,.08);
    }
    .hero-image-card img{
      transition:
        transform .55s cubic-bezier(.22,.61,.36,1),
        filter .45s ease;
      transform-origin:center center;
    }
    .hero-image-card:hover img{
      filter:saturate(1.04) contrast(1.015);
    }
    .hero-image-card .bubble{
      transition:
        transform .35s cubic-bezier(.22,.61,.36,1),
        box-shadow .35s ease;
    }
    .hero-image-card:hover .bubble.one{
      transform:translate3d(4px,-5px,18px) rotate(-1deg);
      box-shadow:0 16px 34px rgba(137,73,126,.16);
    }
    .hero-image-card:hover .bubble.two{
      transform:translate3d(-3px,4px,22px) rotate(1deg);
      box-shadow:0 16px 34px rgba(137,73,126,.16);
    }

    /* custom upload field */
    .upload-box{
      overflow:hidden;
    }
    .upload-control{
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      gap:12px;
      margin-top:5px;
    }
    .upload-control input[type=file]{
      position:absolute!important;
      width:1px!important;
      height:1px!important;
      padding:0!important;
      margin:-1px!important;
      overflow:hidden!important;
      clip:rect(0,0,0,0)!important;
      white-space:nowrap!important;
      border:0!important;
      opacity:0!important;
      pointer-events:none;
    }
    .upload-button{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      min-height:42px;
      padding:0 16px;
      border-radius:13px;
      background:linear-gradient(145deg,#ff79ae,#eb4f8e);
      color:#fff;
      font-size:13px;
      font-weight:800;
      cursor:pointer;
      box-shadow:0 8px 20px rgba(230,75,138,.20);
      transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
      user-select:none;
    }
    .upload-button:hover{
      transform:translateY(-2px);
      box-shadow:0 12px 25px rgba(230,75,138,.28);
      filter:brightness(1.03);
    }
    .upload-filename{
      color:var(--muted);
      font-size:13px;
      font-weight:600;
      min-width:180px;
    }

    @media(max-width:760px){
      .hero-image-card{
        transform:none!important;
      }
    }

    @media(prefers-reduced-motion:reduce){
      .hero-image-card,
      .hero-image-card img,
      .hero-image-card .bubble,
      .back-to-top{
        transition:none!important;
        transform:none!important;
      }
      .back-to-top::before{display:none}
    }


    /* ===== v8 footer ===== */
    .footer.footer-simple{
      display:block;
      padding-top:28px;
    }
    .footer-left{
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      gap:14px;
    }
    .footer-meta{
      display:grid;
      gap:5px;
      padding-left:60px;
    }
    .footer-copyright{
      margin:0!important;
      color:var(--ink)!important;
      font-size:13px!important;
      font-weight:800;
    }
    .footer-description{
      margin:0!important;
      color:var(--muted)!important;
      font-size:13px!important;
      line-height:1.55;
    }
    @media(max-width:640px){
      .footer-meta{padding-left:0}
    }


    /* ===== v9: premium shimmer for "Anfrage senden" ===== */
    #tierForm button[type="submit"]{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      border:0;
      cursor:pointer;
      transition:
        transform .22s cubic-bezier(.22,.61,.36,1),
        box-shadow .22s ease,
        filter .22s ease;
    }

    #tierForm button[type="submit"]::before{
      content:"";
      position:absolute;
      z-index:1;
      top:-30%;
      left:-65%;
      width:38%;
      height:165%;
      pointer-events:none;
      background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.82),
        transparent
      );
      transform:skewX(-22deg);
      transition:left .58s cubic-bezier(.22,.61,.36,1);
    }

    #tierForm button[type="submit"]:hover{
      transform:translateY(-3px) scale(1.015);
      box-shadow:
        0 0 0 6px rgba(255,111,168,.09),
        0 15px 32px rgba(230,75,138,.32);
      filter:brightness(1.035) saturate(1.05);
    }

    #tierForm button[type="submit"]:hover::before{
      left:135%;
    }

    #tierForm button[type="submit"]:active{
      transform:translateY(-1px) scale(.995);
    }

    #tierForm button[type="submit"]:focus-visible{
      outline:3px solid rgba(159,124,255,.38);
      outline-offset:4px;
    }

    @media(prefers-reduced-motion:reduce){
      #tierForm button[type="submit"]{
        transition:none;
      }
      #tierForm button[type="submit"]::before{
        display:none;
      }
    }


    /* ===== v10 reliability fix: content is always visible without working JS ===== */
    .reveal,
    .reveal-left,
    .reveal-right,
    .reveal-scale,
    .reveal-rotate,
    .stagger > *{
      opacity:1;
      transform:none;
    }

    body.motion-ready .reveal,
    body.motion-ready .reveal-left,
    body.motion-ready .reveal-right,
    body.motion-ready .reveal-scale,
    body.motion-ready .reveal-rotate{
      opacity:0;
    }

    body.motion-ready .reveal{transform:translateY(34px)}
    body.motion-ready .reveal-left{transform:translateX(-42px)}
    body.motion-ready .reveal-right{transform:translateX(42px)}
    body.motion-ready .reveal-scale{transform:translateY(22px) scale(.965)}
    body.motion-ready .reveal-rotate{transform:translateY(28px) rotate(-1.2deg) scale(.98)}

    body.motion-ready .reveal.is-visible,
    body.motion-ready .reveal-left.is-visible,
    body.motion-ready .reveal-right.is-visible,
    body.motion-ready .reveal-scale.is-visible,
    body.motion-ready .reveal-rotate.is-visible{
      opacity:1!important;
      transform:none!important;
    }

    body.motion-ready .stagger > *{
      opacity:0;
      transform:translateY(28px);
    }

    body.motion-ready .stagger.is-visible > *{
      opacity:1;
      transform:none;
    }

    /* Hero must never render blank on first paint */
    .hero-copy,
    .hero-image-card{
      min-width:0;
    }

    @media(prefers-reduced-motion:reduce){
      body.motion-ready .reveal,
      body.motion-ready .reveal-left,
      body.motion-ready .reveal-right,
      body.motion-ready .reveal-scale,
      body.motion-ready .reveal-rotate,
      body.motion-ready .stagger > *{
        opacity:1!important;
        transform:none!important;
      }
    }


    /* ===== v11: animal-love feature ===== */
    .animal-love-feature{
      display:grid;
      grid-template-columns:1.05fr .72fr;
      align-items:stretch;
      gap:22px;
      margin:10px 0 26px;
      padding:22px;
      border-radius:30px;
      background:
        radial-gradient(circle at 13% 16%, rgba(255,229,138,.22), transparent 27%),
        linear-gradient(145deg,#fff8fc,#fff);
      border:1px solid rgba(46,37,64,.07);
      box-shadow:var(--shadow-soft);
      overflow:hidden;
    }
    .animal-love-copy{
      align-self:center;
      padding:18px 16px 18px 20px;
    }
    .animal-love-copy h3{
      margin:13px 0 10px;
      font:700 34px/1.08 Georgia,serif;
      letter-spacing:-.02em;
    }
    .animal-love-copy p{
      margin:0;
      color:var(--muted);
      font-size:16px;
      line-height:1.72;
    }
    .animal-love-photo{
      min-height:430px;
      border-radius:24px;
      overflow:hidden;
      background:#e8c099;
      box-shadow:0 14px 32px rgba(98,67,56,.14);
    }
    .animal-love-photo img{
      width:100%;
      height:100%;
      min-height:430px;
      object-fit:cover;
      object-position:center;
      transition:transform .7s cubic-bezier(.22,.61,.36,1), filter .4s ease;
    }
    .animal-love-photo:hover img{
      transform:scale(1.025);
      filter:saturate(1.03);
    }
    @media(max-width:850px){
      .animal-love-feature{grid-template-columns:1fr}
      .animal-love-photo{min-height:0}
      .animal-love-photo img{height:auto;min-height:0}
    }


    /* ===== v12 footer placement ===== */
    .footer.footer-simple.footer-v12{
      display:grid;
      grid-template-columns:1fr auto;
      align-items:end;
      gap:30px;
      padding-top:28px;
    }

    .footer-v12 .footer-left{
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      gap:14px;
    }

    .footer-v12 .footer-description{
      margin:0!important;
      padding-left:60px;
      color:var(--muted)!important;
      font-size:13px!important;
      line-height:1.55;
    }

    .footer-v12 .footer-copyright-right{
      margin:0!important;
      color:var(--muted)!important;
      font-size:12px!important;
      font-weight:400!important;
      text-align:right;
      white-space:nowrap;
      opacity:.78;
    }

    /* ===== v12 shimmer CTA: "Anfrage senden" ===== */
    .shimmer-cta{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      transition:
        transform .22s cubic-bezier(.22,.61,.36,1),
        box-shadow .22s ease,
        filter .22s ease!important;
    }

    .shimmer-cta::before{
      content:"";
      position:absolute;
      z-index:1;
      top:-30%;
      left:-65%;
      width:38%;
      height:165%;
      pointer-events:none;
      background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.82),
        transparent
      );
      transform:skewX(-22deg);
      transition:left .58s cubic-bezier(.22,.61,.36,1);
    }

    .shimmer-cta:hover{
      transform:translateY(-3px) scale(1.015);
      box-shadow:
        0 0 0 6px rgba(255,111,168,.09),
        0 15px 32px rgba(230,75,138,.30)!important;
      filter:brightness(1.035) saturate(1.05);
    }

    .shimmer-cta:hover::before{
      left:135%;
    }

    .shimmer-cta:active{
      transform:translateY(-1px) scale(.995);
    }

    @media(max-width:640px){
      .footer.footer-simple.footer-v12{
        grid-template-columns:1fr;
        align-items:start;
      }

      .footer-v12 .footer-description{
        padding-left:0;
      }

      .footer-v12 .footer-copyright-right{
        text-align:left;
      }
    }

    @media(prefers-reduced-motion:reduce){
      .shimmer-cta{
        transition:none!important;
      }
      .shimmer-cta::before{
        display:none;
      }
    }


    /* ===== v13 fixes only ===== */

    /* Kontakt button top-right: keep text white on hover */
    nav .cta,
    nav .cta:hover,
    nav .cta:focus,
    nav .cta:visited,
    nav .cta.active{
      color:#fff!important;
    }

    /* Upload button text must stay white */
    .upload-button,
    .upload-button:hover,
    .upload-button:focus,
    .upload-button:visited{
      color:#fff!important;
      text-decoration:none!important;
    }

    /* Make shimmer-cta also work nicely on nav/button-like labels */
    .shimmer-cta{
      position:relative;
      overflow:hidden;
      isolation:isolate;
      display:inline-flex;
      align-items:center;
      justify-content:center;
    }

    .shimmer-cta::before{
      content:"";
      position:absolute;
      z-index:1;
      top:-30%;
      left:-65%;
      width:38%;
      height:165%;
      pointer-events:none;
      background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.82),
        transparent
      );
      transform:skewX(-22deg);
      transition:left .58s cubic-bezier(.22,.61,.36,1);
    }

    .shimmer-cta:hover{
      transform:translateY(-3px) scale(1.015);
      filter:brightness(1.035) saturate(1.05);
    }

    .shimmer-cta:hover::before{
      left:135%;
    }

    /* Slightly stronger shadow specifically for the top nav pink CTA */
    nav .cta.shimmer-cta:hover{
      box-shadow:
        0 0 0 6px rgba(255,111,168,.09),
        0 15px 32px rgba(230,75,138,.30)!important;
    }

    /* Same premium hover polish for upload label */
    .upload-button.shimmer-cta:hover{
      box-shadow:
        0 0 0 6px rgba(255,111,168,.09),
        0 15px 32px rgba(230,75,138,.30)!important;
    }

    @media(prefers-reduced-motion:reduce){
      .shimmer-cta{
        transition:none!important;
        transform:none!important;
      }
      .shimmer-cta::before{
        display:none;
      }
    }


    /* ===== v14: Meine kreative Tierwelt ===== */
    .creative-world{
      background:
        radial-gradient(circle at 12% 15%, rgba(255,229,138,.25), transparent 24%),
        radial-gradient(circle at 88% 20%, rgba(233,221,255,.42), transparent 26%),
        linear-gradient(145deg,#fff9fc,#fff);
    }

    .creative-grid{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:18px;
    }

    .creative-card{
      position:relative;
      min-height:310px;
      border:1px solid rgba(46,37,64,.07);
      border-radius:26px;
      background:#fff;
      padding:22px;
      box-shadow:var(--shadow-soft);
      text-align:left;
      color:var(--ink);
      cursor:default;
      overflow:hidden;
      transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
    }

    .creative-card::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        linear-gradient(145deg,rgba(255,111,168,.06),transparent 45%),
        radial-gradient(circle at 80% 18%,rgba(216,236,255,.45),transparent 25%);
      pointer-events:none;
    }

    .creative-card:hover{
      transform:translateY(-5px) rotate(-.2deg);
      box-shadow:0 20px 44px rgba(137,73,126,.13);
      border-color:rgba(255,111,168,.18);
    }

    .creative-card:nth-child(2):hover{transform:translateY(-5px) rotate(.25deg)}
    .creative-card:nth-child(3):hover{transform:translateY(-5px) rotate(-.15deg)}
    .creative-card:nth-child(4):hover{transform:translateY(-5px) rotate(.2deg)}

    .creative-number{
      position:absolute;
      right:18px;
      top:14px;
      font:700 38px/1 Georgia,serif;
      color:rgba(230,75,138,.10);
    }

    .creative-icon{
      position:relative;
      z-index:1;
      display:grid;
      place-items:center;
      width:58px;
      height:58px;
      border-radius:18px;
      background:linear-gradient(145deg,#fff0f6,#fff8df);
      font-size:29px;
      margin-bottom:88px;
    }

    .creative-card strong{
      position:relative;
      z-index:1;
      display:block;
      font:700 20px/1.25 Georgia,serif;
      margin-bottom:7px;
    }

    .creative-card small{
      position:relative;
      z-index:1;
      display:block;
      color:var(--muted);
      font-size:12px;
      font-weight:700;
    }

    .creative-note{
      margin:18px 0 0;
      color:var(--muted);
      font-size:13px;
      text-align:center;
    }

    /* Ready for scanned drawings later */
    .creative-card.has-art{
      padding:0;
      cursor:zoom-in;
      background:#fff;
    }

    .creative-card.has-art img{
      width:100%;
      height:100%;
      min-height:310px;
      object-fit:cover;
      transition:transform .55s cubic-bezier(.22,.61,.36,1);
    }

    .creative-card.has-art:hover img{
      transform:scale(1.025);
    }

    .art-lightbox{
      position:fixed;
      inset:0;
      z-index:20000;
      background:rgba(31,24,39,.82);
      display:none;
      align-items:center;
      justify-content:center;
      padding:28px;
      backdrop-filter:blur(8px);
    }

    .art-lightbox.open{display:flex}

    .art-lightbox-dialog{
      position:relative;
      width:min(1180px,96vw);
      display:grid;
      grid-template-columns:auto minmax(0,1fr) auto;
      align-items:center;
      gap:18px;
    }

    .art-lightbox-figure{
      margin:0;
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:14px;
    }

    .art-lightbox img{
      max-width:min(980px,82vw);
      max-height:80vh;
      object-fit:contain;
      border-radius:18px;
      box-shadow:0 24px 70px rgba(0,0,0,.35);
      background:#fff;
    }

    .art-lightbox-caption{
      min-width:min(980px,82vw);
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      padding:14px 18px;
      border-radius:16px;
      background:rgba(255,255,255,.98);
      color:var(--ink);
      box-shadow:0 12px 30px rgba(0,0,0,.14);
      font-family:var(--font-ui);
    }

    .art-lightbox-caption strong{
      font-family:var(--font-display);
      font-size:1.18rem;
      line-height:1.2;
    }

    .art-lightbox-caption span{
      font-size:.94rem;
      color:var(--muted);
      white-space:nowrap;
    }

    .art-lightbox-close,
    .art-lightbox-nav{
      border:0;
      border-radius:999px;
      background:#fff;
      color:var(--ink);
      cursor:pointer;
      box-shadow:0 12px 30px rgba(0,0,0,.18);
      transition:transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease;
    }

    .art-lightbox-close:hover,
    .art-lightbox-nav:hover{
      transform:translateY(-2px);
      box-shadow:0 18px 38px rgba(0,0,0,.22);
      background:#fff6fb;
      color:var(--accent-strong);
    }

    .art-lightbox-close{
      position:absolute;
      top:-10px;
      right:-6px;
      width:48px;
      height:48px;
      font-size:24px;
      z-index:2;
    }

    .art-lightbox-nav{
      width:54px;
      height:54px;
      font-size:34px;
      font-weight:700;
      line-height:1;
      display:flex;
      align-items:center;
      justify-content:center;
      align-self:center;
    }

    @media(max-width:950px){
      .creative-grid{grid-template-columns:1fr 1fr}
    }

    @media(max-width:600px){
      .creative-grid{grid-template-columns:1fr}
      .creative-card{min-height:245px}
      .creative-icon{margin-bottom:55px}
    }


    /* ===== v16 hero headline refinement ===== */
    .hero h1{
      font-size:clamp(62px, 6.7vw, 78px)!important;
      line-height:.95!important;
      letter-spacing:-.04em!important;
      max-width:620px;
    }

    .hero h1 em{
      display:inline!important;
    }

    @media(max-width:900px){
      .hero h1{
        font-size:clamp(52px, 10vw, 68px)!important;
        max-width:none;
      }
    }

    @media(max-width:640px){
      .hero h1{
        font-size:clamp(42px, 11vw, 56px)!important;
        line-height:.98!important;
      }
    }


    /* ===== v18: hero title — guaranteed 3 lines ===== */
    .hero h1.hero-title{
      font-size:clamp(48px, 4vw, 54px)!important;
      line-height:.98!important;
      letter-spacing:-.045em!important;
      max-width:none!important;
      width:max-content;
      margin:20px 0 24px;
    }

    .hero-title-line{
      display:block;
      white-space:nowrap;
    }

    .hero-title-line em{
      display:inline!important;
      color:var(--pink-dark);
      font-style:normal;
    }

    @media(max-width:950px){
      .hero h1.hero-title{
        font-size:clamp(46px, 6.8vw, 54px)!important;
        width:auto;
      }
    }

    @media(max-width:640px){
      .hero h1.hero-title{
        font-size:clamp(38px, 10.2vw, 50px)!important;
        line-height:1!important;
        width:auto;
      }

      .hero-title-line{
        white-space:normal;
      }
    }


    /* ===== v19: echte Zeichnungen in Meine kreative Tierwelt ===== */
    .creative-card.has-art{
      display:flex;
      flex-direction:column;
      padding:10px 10px 0;
      min-height:0;
      cursor:zoom-in;
      background:#fff;
      text-align:left;
    }

    .creative-card.has-art img{
      width:100%;
      height:315px;
      min-height:0;
      object-fit:contain;
      object-position:center;
      border-radius:18px;
      background:#fff;
      transition:transform .55s cubic-bezier(.22,.61,.36,1), filter .3s ease;
    }

    .creative-card.has-art:hover img{
      transform:scale(1.018);
      filter:saturate(1.02);
    }

    .creative-art-caption{
      display:block;
      padding:14px 9px 16px;
      position:relative;
      z-index:2;
    }

    .creative-art-caption strong{
      display:block;
      margin:0;
      font:700 17px/1.25 Georgia,serif;
      color:var(--ink);
    }

    @media(max-width:950px){
      .creative-card.has-art img{height:360px}
    }

    @media(max-width:600px){
      .creative-card.has-art img{height:auto;max-height:520px}
    }


    /* ===== v21: klikbare kunst + speelse agenda ===== */
    .creative-card.has-art{
      cursor:zoom-in!important;
    }

    .creative-card.has-art:focus-visible{
      outline:3px solid rgba(159,124,255,.38);
      outline-offset:4px;
    }

    .art-lightbox{
      cursor:zoom-out;
    }

    .art-lightbox-dialog,
    .art-lightbox img,
    .art-lightbox-caption,
    .art-lightbox-nav,
    .art-lightbox-close{
      cursor:default;
    }

    @media(max-width:900px){
      .art-lightbox-dialog{
        width:min(100%,96vw);
        grid-template-columns:1fr;
        gap:12px;
      }

      .art-lightbox-figure{
        order:2;
      }

      .art-lightbox-prev{
        order:1;
        justify-self:start;
      }

      .art-lightbox-next{
        order:3;
        justify-self:end;
        margin-top:-66px;
      }

      .art-lightbox-close{
        top:-6px;
        right:0;
      }

      .art-lightbox img{
        max-width:88vw;
        max-height:72vh;
      }

      .art-lightbox-caption{
        min-width:0;
        width:min(88vw,100%);
        flex-direction:column;
        align-items:flex-start;
      }
    }

    .availability-box{
      border:1px solid rgba(255,111,168,.14);
      border-radius:22px;
      padding:20px;
      background:
        radial-gradient(circle at 90% 10%, rgba(216,236,255,.55), transparent 28%),
        linear-gradient(145deg,#fff9fc,#fff);
    }

    .availability-head{
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:18px;
      margin-bottom:16px;
    }

    .availability-head strong{
      display:block;
      margin-top:5px;
      font:700 18px/1.25 Georgia,serif;
      color:var(--ink);
    }

    .availability-kicker{
      display:block;
      color:var(--pink-dark);
      font-size:11px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
    }

    .availability-badge{
      flex:0 0 auto;
      padding:7px 10px;
      border-radius:999px;
      background:#fff0f6;
      color:var(--pink-dark);
      border:1px solid rgba(230,75,138,.12);
      font-size:11px;
      font-weight:800;
    }

    .week-preview{
      display:grid;
      grid-template-columns:repeat(7,1fr);
      gap:8px;
      margin-bottom:18px;
    }

    .week-day{
      min-height:66px;
      padding:9px 7px;
      border-radius:14px;
      background:#fff;
      border:1px solid rgba(46,37,64,.07);
      text-align:center;
      box-shadow:0 6px 15px rgba(137,73,126,.05);
    }

    .week-day span{
      display:block;
      color:var(--muted);
      font-size:11px;
      font-weight:800;
      text-transform:uppercase;
    }

    .week-day strong{
      display:block;
      margin-top:7px;
      font-size:12px;
      color:var(--ink);
    }

    .week-day.saturday{
      background:#fff8e7;
    }

    .week-day.off{
      opacity:.55;
      background:#f7f5f8;
    }

    .availability-picker{
      display:grid;
      grid-template-columns:.8fr 1.2fr;
      gap:16px;
      align-items:start;
    }

    .time-slots{
      display:flex;
      flex-wrap:wrap;
      gap:8px;
      min-height:49px;
      align-items:center;
      padding:3px 0;
    }

    .time-slot{
      min-height:40px;
      padding:0 13px;
      border-radius:999px;
      border:1px solid rgba(230,75,138,.16);
      background:#fff;
      color:var(--ink);
      font-size:13px;
      font-weight:800;
      cursor:pointer;
      transition:transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
    }

    .time-slot:hover{
      transform:translateY(-2px);
      box-shadow:0 8px 20px rgba(230,75,138,.13);
    }

    .time-slot.selected{
      background:linear-gradient(145deg,var(--pink),var(--pink-dark));
      color:#fff;
      border-color:transparent;
      box-shadow:0 8px 20px rgba(230,75,138,.22);
    }

    .slot-placeholder{
      color:var(--muted);
      font-size:12px;
    }

    .availability-note{
      margin:14px 0 0;
      padding:11px 13px;
      border-radius:14px;
      background:#fff7df;
      color:#665626;
      border:1px solid rgba(211,170,100,.20);
      font-size:12px;
      font-weight:700;
    }

    @media(max-width:760px){
      .week-preview{
        grid-template-columns:repeat(4,1fr);
      }

      .availability-picker{
        grid-template-columns:1fr;
      }
    }

    @media(max-width:480px){
      .week-preview{
        grid-template-columns:repeat(2,1fr);
      }

      .availability-head{
        flex-direction:column;
      }
    }


    /* ===== v22: minimale rechtliche Hinweise ===== */
    .legal-links{
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      gap:8px;
      padding-left:60px;
      margin-top:-4px;
      color:var(--muted);
      font-size:12px;
    }

    .legal-links a{
      color:inherit;
      text-decoration:none;
      transition:color .18s ease;
    }

    .legal-links a:hover{
      color:var(--pink-dark);
    }

    .privacy-form-note{
      grid-column:1/-1;
      display:flex;
      gap:9px;
      align-items:flex-start;
      padding:11px 13px;
      border-radius:14px;
      background:#faf8fb;
      border:1px solid rgba(46,37,64,.07);
      color:var(--muted);
      font-size:12px;
    }

    .privacy-form-note p{
      margin:0;
    }

    .privacy-form-note a{
      color:var(--pink-dark);
      font-weight:700;
    }

    @media(max-width:640px){
      .legal-links{padding-left:0}
    }


    /* ===== v23: echt werkend formulier ===== */
    .hp-field{
      position:absolute!important;
      left:-10000px!important;
      width:1px!important;
      height:1px!important;
      overflow:hidden!important;
    }

    .form-status{
      display:none;
    }
    .form-status.show{
      display:block;
    }
    .form-status.success{
      background:#eefaf2;
      border-color:rgba(61,148,91,.22);
      color:#2e6a43;
    }
    .form-status.error{
      background:#fff0f2;
      border-color:rgba(207,69,91,.22);
      color:#8d3342;
    }

    #tierForm button[type="submit"][disabled]{
      opacity:.65;
      cursor:wait;
      transform:none!important;
    }

/* v24 CSP-safe classes */
.idea-chip{background:rgba(255,229,138,.34)}
.tone-pink{--tone:#ffe1ee}
.tone-blue{--tone:#e3f6ff}
.tone-yellow{--tone:#fff0bc}
.eyebrow-inverse{
  background:rgba(255,255,255,.17);
  border-color:rgba(255,255,255,.18);
  color:#fff;
}


/* ===== v27: gallery arrows always clearly visible ===== */
.art-lightbox-dialog{
  position:relative;
}

.art-lightbox-nav{
  position:absolute;
  top:50%;
  z-index:5;
  transform:translateY(-50%);
  width:58px;
  height:58px;
  background:rgba(255,255,255,.98);
  color:#2e2540;
  border:1px solid rgba(46,37,64,.08);
  box-shadow:0 14px 36px rgba(0,0,0,.26);
  cursor:pointer;
}

.art-lightbox-nav:hover{
  transform:translateY(-50%) scale(1.06);
}

.art-lightbox-prev{
  left:14px;
}

.art-lightbox-next{
  right:14px;
}

.art-lightbox-close{
  z-index:6;
}

@media(max-width:900px){
  .art-lightbox-dialog{
    display:block;
  }

  .art-lightbox-prev{
    left:8px;
  }

  .art-lightbox-next{
    right:8px;
    margin-top:0;
  }

  .art-lightbox-nav{
    width:48px;
    height:48px;
    font-size:30px;
  }

  .art-lightbox img{
    max-width:90vw;
  }
}