/* ============================================================
   EFFECTS — decorative animations only
   (これらは Figma化のとき削除/簡略化してOK)
   ============================================================ */

/* ─── Marquee animations ─────────────────────────── */
@keyframes scroll-left  { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes scroll-right { 0%   { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* ─── Hero mesh blobs ────────────────────────────── */
.s-hero__bg-mesh .mesh-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
}
.s-hero__bg-mesh .mesh-blob:nth-child(1) {
  width: 650px; height: 550px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.10), transparent 70%);
  top: -12%; left: -8%;
  animation: mblob1 20s ease-in-out infinite alternate;
}
.s-hero__bg-mesh .mesh-blob:nth-child(2) {
  width: 520px; height: 480px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.07), transparent 70%);
  top: -10%; right: -6%;
  animation: mblob2 26s ease-in-out infinite alternate;
}
.s-hero__bg-mesh .mesh-blob:nth-child(3) {
  width: 580px; height: 500px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.08), transparent 70%);
  bottom: 8%; right: 10%;
  animation: mblob3 22s ease-in-out infinite alternate;
}
.s-hero__bg-mesh .mesh-blob:nth-child(4) {
  width: 420px; height: 400px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.06), transparent 70%);
  bottom: 2%; left: 8%;
  animation: mblob4 28s ease-in-out infinite alternate;
}
.s-hero__bg-mesh .mesh-blob:nth-child(5) {
  width: 360px; height: 340px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.05), transparent 70%);
  top: 40%; left: 38%;
  animation: mblob5 18s ease-in-out infinite alternate;
}
@keyframes mblob1 { 0%{transform:translate(0,0) scale(1);} 40%{transform:translate(90px,70px) scale(1.12);} 100%{transform:translate(40px,130px) scale(0.95);} }
@keyframes mblob2 { 0%{transform:translate(0,0) scale(1);} 35%{transform:translate(-80px,90px) scale(1.09);} 100%{transform:translate(-50px,-70px) scale(1.15);} }
@keyframes mblob3 { 0%{transform:translate(0,0) scale(1);} 45%{transform:translate(-90px,-60px) scale(1.1);} 100%{transform:translate(70px,80px) scale(0.9);} }
@keyframes mblob4 { 0%{transform:translate(0,0) scale(1);} 50%{transform:translate(100px,-50px) scale(1.08);} 100%{transform:translate(30px,-110px) scale(1.14);} }
@keyframes mblob5 { 0%{transform:translate(0,0) scale(1);} 40%{transform:translate(-60px,80px) scale(1.2);} 100%{transform:translate(80px,-60px) scale(0.85);} }

/* ─── Solution aurora overlay ────────────────────── */
.sol-aurora { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.sol-orb2 {
  display: none;
}
.sol-scan {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 40% 30% at 0% 0%,   rgba(255,255,255,0.06), transparent),
    radial-gradient(ellipse 40% 30% at 100% 100%, rgba(255,255,255,0.04), transparent);
  animation: corner-pulse 8s ease-in-out infinite alternate;
}
@keyframes corner-pulse { 0%{opacity:.5;} 100%{opacity:1;} }


/* ─── Typewriter caret ────────────────────────────── */
h2.tw-typing { caret-color: transparent; }

/* ─── Hero title reveal (left → right mask) ──────── */
@keyframes hero-title-reveal {
  from { clip-path: polygon(0 -30%, 0 -30%, 0 130%, 0 130%); }
  to   { clip-path: polygon(0 -30%, 100% -30%, 100% 130%, 0 130%); }
}
.s-hero__sub {
  animation: hero-title-reveal 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.3s both;
}

/* ─── Hero sub copy blur fade-in ─────────────────── */
@keyframes hero-sub-fadein {
  from { opacity: 0; filter: blur(8px); }
  to   { opacity: 1; filter: blur(0px); }
}
.s-hero__title {
  animation: hero-sub-fadein 1.1s cubic-bezier(0.22, 1, 0.36, 1) 1.5s both;
}