.hero{align-items:center;justify-content:center;text-align:center}.hero-copy{width:min(700px,78vw);margin:60px auto 0;padding:30px 38px;background:rgba(7,11,18,.34);opacity:0;transform:translate3d(0,20px,0);transition:opacity 1.3s .45s ease,transform 1.3s .45s ease;z-index:8}.mandala-ready .hero-copy{opacity:1;transform:translate3d(0,var(--copy-shift),0)}.hero-copy .eyebrow{letter-spacing:.34em}.hero h1{margin:10px 0 12px;line-height:1.3;letter-spacing:.02em}.hero h1 span{font-family:Georgia,"Times New Roman",serif;font-size:clamp(52px,7.3vw,104px);letter-spacing:-.035em;text-shadow:0 8px 40px #000}.hero h1 em{font-family:var(--serif);font-size:clamp(18px,2vw,28px);font-style:normal;letter-spacing:.15em;margin-top:10px}.hero-lead{margin-inline:auto;letter-spacing:.14em}.hero-actions{justify-content:center}.hero-crt,.hero-scanlines,.hero-flash{position:absolute;inset:0;pointer-events:none}.hero-crt{z-index:6;background:linear-gradient(rgba(18,16,16,0) 50%,rgba(0,0,0,.22) 50%),linear-gradient(90deg,rgba(255,0,0,.035),rgba(0,255,0,.012),rgba(0,0,255,.035));background-size:100% 2px,3px 100%;box-shadow:inset 0 0 150px rgba(0,0,0,.72)}.hero-scanlines{z-index:5;opacity:.22;background:linear-gradient(to bottom,transparent 50%,rgba(0,0,0,.3) 50%);background-size:100% 7px;animation:hero-scan 9s linear infinite}.hero-flash{z-index:19;background:#fff;opacity:0}.mandala-ready .hero-flash{animation:hero-flash 1.4s ease-out both}.digital-mandala{position:absolute;z-index:3;left:50%;top:50%;width:min(620px,74vw);aspect-ratio:1;transform:translate(-50%,-50%) scale(.55) rotate(-80deg);opacity:0;pointer-events:none;transition:opacity 1.8s ease,transform 1.8s cubic-bezier(.18,.8,.22,1)}.mandala-ready .digital-mandala{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}.mandala-ring,.mandala-core{position:absolute;inset:0;margin:auto;border-radius:50%}.mandala-ring-1{width:100%;height:100%;border:1px dashed rgba(180,240,244,.18);animation:mandala-cw 62s linear infinite}.mandala-ring-1:before,.mandala-ring-1:after{content:"";position:absolute;left:50%;width:8px;height:8px;border-radius:50%;background:#28d9e4;box-shadow:0 0 18px #2cdbe5;transform:translate(-50%,-50%)}.mandala-ring-1:before{top:0}.mandala-ring-1:after{top:100%}.mandala-ring-2{width:71%;height:71%;border:1px solid rgba(55,217,229,.2);border-inline:2px solid rgba(55,217,229,.55);animation:mandala-ccw 43s linear infinite}.mandala-ring-3{width:45%;height:45%;border:1px dotted rgba(218,48,108,.35);animation:mandala-cw 31s linear infinite}.mandala-core{width:23%;height:23%;background:radial-gradient(circle,rgba(220,255,255,.14),transparent 70%);animation:mandala-pulse 4s ease-in-out infinite}.hero-vertical{position:absolute;z-index:7;top:50%;writing-mode:vertical-rl;margin:0;font-family:var(--serif);font-size:clamp(13px,1.3vw,18px);letter-spacing:.7em;color:rgba(230,241,242,.72);white-space:nowrap;opacity:0;transition:opacity 1.2s 1s ease}.mandala-ready .hero-vertical{opacity:1}.hero-vertical-left{left:8%;padding-left:18px;border-left:1px solid rgba(227,240,242,.18);transform:translateY(-50%)}.hero-vertical-right{right:8%;padding-right:18px;border-right:1px solid rgba(227,240,242,.18);transform:translateY(-50%)}@keyframes mandala-cw{to{transform:rotate(360deg)}}@keyframes mandala-ccw{to{transform:rotate(-360deg)}}@keyframes mandala-pulse{50%{transform:scale(1.22);opacity:.85}}@keyframes hero-scan{to{background-position:0 100%}}@keyframes hero-flash{0%{opacity:.35}12%{opacity:.08}100%{opacity:0}}@media(max-width:700px){.hero-copy{width:calc(100% - 32px);padding:22px 18px;margin-top:110px}.hero h1 span{font-size:clamp(38px,13vw,60px)}.hero h1 em{font-size:clamp(15px,5vw,21px)}.hero-copy .eyebrow{font-size:7px}.hero-actions{flex-direction:row}.digital-mandala{width:90vw}.hero-vertical{font-size:11px;letter-spacing:.55em}.hero-vertical-left{left:3%;padding-left:8px}.hero-vertical-right{right:3%;padding-right:8px}.hero-lead{font-size:10px}}@media(prefers-reduced-motion:reduce){.hero-copy,.digital-mandala,.hero-vertical{opacity:1;transition:none}.hero-copy{transform:none}.mandala-ring,.mandala-core,.hero-scanlines,.hero-flash{animation:none!important}}
.hero .hero-copy{background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}.hero .hero-copy:after{display:none}

/* ===== 円の中に定期的に落ちる水滴と波紋 ===== */
.mandala-drop{position:absolute;left:50%;top:-8%;width:6px;height:14px;margin-left:-3px;border-radius:50% 50% 50% 50%/62% 62% 38% 38%;background:linear-gradient(#e8fdff,#3fe0ea);box-shadow:0 0 12px #3fe0ea,0 0 26px rgba(63,224,234,.6);opacity:0;animation:mandala-drop 6.5s cubic-bezier(.55,0,.9,.5) infinite 1.6s}
.mandala-wave{position:absolute;inset:0;margin:auto;width:100%;height:100%;border-radius:50%;border:1.5px solid rgba(123,229,233,.85);box-shadow:0 0 14px rgba(63,224,234,.55),inset 0 0 14px rgba(63,224,234,.35);opacity:0;transform:scale(.02);animation:mandala-wave 6.5s cubic-bezier(.15,.6,.3,1) infinite 1.6s}
.mandala-wave--2{border-color:rgba(123,229,233,.55);animation-delay:2s}
.mandala-wave--3{border-color:rgba(255,95,210,.45);box-shadow:0 0 12px rgba(255,95,210,.4);animation-delay:2.4s}
.mandala-core{animation:mandala-pulse 4s ease-in-out infinite,mandala-splash 6.5s ease-out infinite 1.6s}
@keyframes mandala-drop{0%{top:-8%;opacity:0;transform:scaleY(1)}6%{opacity:1}19%{top:calc(50% - 14px);opacity:1;transform:scaleY(1.25)}21%{top:calc(50% - 6px);opacity:0;transform:scaleY(.4)}100%{top:calc(50% - 6px);opacity:0}}
@keyframes mandala-wave{0%,20%{opacity:0;transform:scale(.02)}21%{opacity:1;transform:scale(.04)}75%{opacity:0;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
@keyframes mandala-splash{0%,19%{filter:none}22%{filter:brightness(3.2)}40%,100%{filter:none}}
@media(prefers-reduced-motion:reduce){.mandala-drop,.mandala-wave{display:none}}
.digital-mandala .mandala-drop{width:8px;height:18px;margin-left:-4px}
.digital-mandala .mandala-wave{border-width:2px;border-color:rgba(160,248,255,.95);box-shadow:0 0 22px rgba(63,224,234,.8),inset 0 0 22px rgba(63,224,234,.45)}
.digital-mandala .mandala-wave--2{border-color:rgba(160,248,255,.7)}
.digital-mandala .mandala-wave--3{border-color:rgba(255,120,220,.7);box-shadow:0 0 18px rgba(255,95,210,.6)}

/* ボタンは円の外（下）に配置 */
.hero>.hero-actions--below{position:absolute;left:50%;top:calc(50% + min(310px,37vw) + 26px);transform:translateX(-50%);z-index:9;margin:0;display:flex;justify-content:center;align-items:center;gap:28px;flex-direction:row;white-space:nowrap;
  opacity:0;transition:opacity 1.2s .9s ease}
.mandala-ready .hero>.hero-actions--below,.mandala-ready>.hero-actions--below,.hero.mandala-ready>.hero-actions--below{opacity:1}
@media(max-width:700px){.hero>.hero-actions--below{top:calc(50% + 45vw + 22px);gap:16px}}
@media(prefers-reduced-motion:reduce){.hero>.hero-actions--below{opacity:1;transition:none}}
/* 画面の高さが低いときは円を小さくして、ボタンまで1画面に収める */
@media(min-width:701px){
  .digital-mandala{width:min(620px,74vw,calc(100svh - 370px))}
  .hero>.hero-actions--below{top:calc(50% + min(310px,37vw,calc(50svh - 185px)) + 22px)}
}
/* 女性の顔が見えるよう、画像の位置を少し上へ */
.hero-parallax{inset:-19% 0 -1% 0}
@media(max-width:700px){.hero-parallax img{object-position:center 22%}.hero-parallax{inset:-14% 0 -2% 0}}
