/* Marmaras: a single, quiet entrance; the stone remains the focus. */
.hero-vein {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none; fill: none; stroke: #65ddd4;
  stroke-linecap: round; stroke-linejoin: round;
}
.hero-vein .vein-thread, .hero-vein .vein-spark {
  vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1;
}
.hero-vein .vein-thread { stroke-width: 1px; opacity: 0; }
.hero-vein .vein-spark { stroke: #c7fff8; stroke-width: 1.7px; opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  .vein-thread { animation: marmaras-network 3.6s var(--vein-delay,0s) ease-out both; }
  .vein-spark { animation: marmaras-spark 3s var(--vein-delay,0s) ease-in-out both; }
  .hero-copy > * { animation: marmaras-arrive .8s cubic-bezier(.2,.65,.3,1) both; }
  .hero-copy > :nth-child(1) { animation-delay: .08s; }
  .hero-copy > :nth-child(2) { animation-delay: .2s; }
  .hero-copy > :nth-child(3) { animation-delay: .34s; }
  .hero-copy > :nth-child(4) { animation-delay: .48s; }
  .hero-index { animation: marmaras-arrive .8s .6s both; }
  .motion-pending { opacity: 0; transform: translateY(18px); }
  .motion-visible { animation: marmaras-arrive .7s cubic-bezier(.2,.65,.3,1) both; }
  .motion-pending:focus-within { opacity: 1; transform: none; }
}
@keyframes marmaras-network {
  0% { stroke-dashoffset: 1; opacity: 0; }
  15% { opacity: .65; }
  70% { stroke-dashoffset: 0; opacity: .75; }
  100% { stroke-dashoffset: 0; opacity: .16; }
}
@keyframes marmaras-spark {
  0% { stroke-dasharray: .04 .96; stroke-dashoffset: 1; opacity: 0; }
  18%, 72% { opacity: .9; }
  100% { stroke-dasharray: .04 .96; stroke-dashoffset: 0; opacity: 0; }
}
@keyframes marmaras-arrive {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-vein { display: none; }
  .motion-pending, .motion-visible { opacity: 1; transform: none; animation: none; }
  html { scroll-behavior: auto; }
}