/* Praxoria Startseite – v542: Buchstabenweise SVG-Handschrift.
   Inhalt bleibt unverändert. Die sichtbare Bewegung entsteht nicht mehr wortweise,
   sondern aus überlappenden Letter-Strokes mit einer leisen Stiftspur. */

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText{
  --hand-ink: color-mix(in oklab, var(--text) 87%, var(--accent2));
  --hand-ink-soft: color-mix(in oklab, var(--text) 74%, var(--accent2));
  --hand-glow: color-mix(in oklab, var(--accent3) 16%, transparent);
  --hand-paper: color-mix(in oklab, var(--paper) 84%, white);
  min-height:calc(2 * 1.48em) !important;
  line-height:1.48 !important;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandInk{
  display:block !important;
  max-width:100%;
  line-height:1.52;
  word-spacing:.075em;
  transform:translateY(.02em);
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandWord{
  position:relative;
  display:inline-block;
  vertical-align:-.34em;
  margin-right:.28em;
  margin-bottom:.08em;
  white-space:nowrap;
  opacity:1;
  transform:none;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandWordSvg{
  display:block;
  overflow:visible;
  filter:drop-shadow(0 3px 8px rgba(72, 94, 115, .055));
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandLayer{
  transform-box:fill-box;
  transform-origin:left center;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandLetterPath{
  fill:none;
  stroke:var(--hand-ink);
  stroke-width:1.44;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:100;
  stroke-dashoffset:100;
  opacity:0;
  vector-effect:non-scaling-stroke;
  filter:blur(.035px);
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandLetterShadow{
  stroke:var(--hand-glow);
  stroke-width:4.1;
  opacity:0;
  filter:blur(3px);
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandConnectorPath:not(.answerHandLetterShadow){
  stroke:var(--hand-ink-soft);
  stroke-width:1.10;
  opacity:0;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandWord::after{
  content:"";
  position:absolute;
  left:.04em;
  top:1.03em;
  width:.30em;
  height:.105em;
  border-radius:999px;
  background:linear-gradient(90deg,
    color-mix(in oklab, var(--hand-ink) 24%, transparent),
    color-mix(in oklab, var(--hand-ink) 72%, transparent),
    transparent);
  box-shadow:0 0 10px color-mix(in oklab, var(--accent3) 22%, transparent);
  opacity:0;
  transform:translateX(0) translateY(.01em) rotate(-12deg);
  transform-origin:left center;
  pointer-events:none;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandInk.isActive .answerHandLetterPath{
  animation:praxoriaV542LetterDraw var(--letter-dur, 210ms) cubic-bezier(.23,.74,.17,1) calc(var(--word-delay,0ms) + var(--letter-delay,0ms)) forwards !important;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandInk.isActive .answerHandLetterShadow{
  animation:praxoriaV542LetterGlow var(--letter-dur, 210ms) cubic-bezier(.22,.76,.18,1) calc(var(--word-delay,0ms) + var(--letter-delay,0ms)) forwards !important;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandInk.isActive .answerHandWord::after{
  animation:praxoriaV542PenMove var(--word-dur, 620ms) cubic-bezier(.19,.71,.22,1) var(--word-delay,0ms) forwards;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText.isComplete .answerHandLetterPath{
  animation:none !important;
  stroke-dashoffset:0 !important;
  opacity:.965 !important;
  filter:none !important;
}

html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText.isComplete .answerHandLetterShadow,
html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText.isComplete .answerHandWord::after{
  animation:none !important;
  opacity:0 !important;
}

@keyframes praxoriaV542LetterDraw{
  0%{
    stroke-dashoffset:100;
    opacity:0;
    stroke-width:1.24;
    filter:blur(.22px);
  }
  14%{ opacity:.86; }
  52%{
    stroke-dashoffset:30;
    opacity:.98;
    stroke-width:1.58;
    filter:blur(.08px);
  }
  86%{
    stroke-dashoffset:3.5;
    opacity:.98;
    stroke-width:1.46;
  }
  100%{
    stroke-dashoffset:0;
    opacity:.965;
    stroke-width:1.42;
    filter:none;
  }
}

@keyframes praxoriaV542LetterGlow{
  0%{ stroke-dashoffset:100; opacity:0; }
  18%{ opacity:.16; }
  62%{ stroke-dashoffset:22; opacity:.10; }
  100%{ stroke-dashoffset:0; opacity:0; }
}

@keyframes praxoriaV542PenMove{
  0%{ opacity:0; transform:translateX(0) translateY(.04em) rotate(-16deg) scaleX(.72); }
  8%{ opacity:.64; }
  34%{ transform:translateX(calc(var(--word-travel) * .34)) translateY(-.035em) rotate(-10deg) scaleX(1); }
  68%{ opacity:.55; transform:translateX(calc(var(--word-travel) * .70)) translateY(.025em) rotate(-15deg) scaleX(.92); }
  88%{ opacity:.34; }
  100%{ opacity:0; transform:translateX(var(--word-travel)) translateY(-.02em) rotate(-13deg) scaleX(.52); }
}

@media (prefers-reduced-motion: reduce){
  html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandInk.isActive .answerHandLetterPath,
  html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandInk.isActive .answerHandLetterShadow,
  html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandInk.isActive .answerHandWord::after{
    animation:none !important;
  }
  html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandLetterPath{
    stroke-dashoffset:0 !important;
    opacity:.965 !important;
  }
  html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandLetterShadow,
  html body.home.homeRefinedV542 #studioPanel2 .studioTileQuote .answerWriteText .answerHandWord::after{
    display:none !important;
  }
}
