/* FULL CLASSIC — Coming Soon | stylesheet */

:root{
  --ink:#14110e;
  --ink-soft:#1c1815;
  --cream:#f0eadd;
  --cream-dim:#c9c0ad;
  --vermilion:#b5432f;
  --line:rgba(240,234,221,0.16);
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--ink);
  color:var(--cream);
  font-family:"Noto Serif JP",serif;
  font-weight:300;
  min-height:100vh;
  min-height:100dvh;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
/* subtle vertical grain / vignette */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(120% 80% at 50% 18%, rgba(181,67,47,0.10), transparent 60%),
    radial-gradient(100% 100% at 50% 120%, rgba(0,0,0,0.55), transparent 55%);
}
.stage{
  position:relative;z-index:1;
  min-height:100vh;min-height:100dvh;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:48px 24px;
  text-align:center;
}

/* hairline frame */
.frame{
  position:fixed;inset:18px;z-index:1;pointer-events:none;
  border:1px solid var(--line);
}
@media(max-width:560px){ .frame{inset:12px} }

.mark{
  width:96px;height:96px;
  object-fit:contain;
  opacity:0;
  filter:drop-shadow(0 4px 24px rgba(0,0,0,0.4));
  animation:rise 1.5s cubic-bezier(.2,.7,.2,1) 0.2s forwards;
}
@media(max-width:560px){ .mark{width:74px;height:74px} }

.wordmark{
  font-family:"Cormorant",serif;
  font-weight:400;
  letter-spacing:0.42em;
  font-size:clamp(1.55rem,5.5vw,2.7rem);
  margin:30px 0 0 1.42em; /* offset half of letter-spacing to keep optical center */
  padding-left:0;
  text-indent:0.42em;
  opacity:0;
  animation:rise 1.5s cubic-bezier(.2,.7,.2,1) 0.45s forwards;
}
/* simpler centered wordmark using fl.. keep robust */
.wordmark{margin-left:0;text-indent:0;padding-left:0.42em}

.rule{
  width:0;height:1px;background:var(--vermilion);
  margin:30px auto 0;
  animation:expand 1.4s cubic-bezier(.2,.7,.2,1) 0.9s forwards;
}

.tagline-ja{
  font-family:"Noto Serif JP",serif;
  font-weight:400;
  font-size:clamp(1.05rem,3.4vw,1.5rem);
  letter-spacing:0.22em;
  margin-top:30px;
  opacity:0;
  animation:rise 1.5s cubic-bezier(.2,.7,.2,1) 1.05s forwards;
}
.tagline-en{
  font-family:"Cormorant",serif;
  font-style:italic;
  font-weight:400;
  font-size:clamp(0.82rem,2.4vw,1.02rem);
  letter-spacing:0.16em;
  color:var(--cream-dim);
  margin-top:16px;
  opacity:0;
  animation:rise 1.5s cubic-bezier(.2,.7,.2,1) 1.2s forwards;
}

.status{
  margin-top:54px;
  display:flex;align-items:center;gap:14px;
  opacity:0;
  animation:rise 1.5s cubic-bezier(.2,.7,.2,1) 1.45s forwards;
}
.status .dot{
  width:5px;height:5px;border-radius:50%;
  background:var(--vermilion);
  box-shadow:0 0 0 0 rgba(181,67,47,0.6);
  animation:pulse 2.6s ease-out infinite;
}
.status .label{
  font-family:"Cormorant",serif;
  letter-spacing:0.5em;
  text-transform:uppercase;
  font-size:0.72rem;
  color:var(--cream-dim);
  text-indent:0.5em;
}

.footer{
  position:fixed;left:0;right:0;bottom:0;z-index:1;
  padding:26px 24px;
  display:flex;justify-content:center;
  opacity:0;
  animation:fadein 1.6s ease 1.8s forwards;
}
.footer span{
  font-family:"Cormorant",serif;
  letter-spacing:0.28em;
  font-size:0.66rem;
  color:rgba(201,192,173,0.55);
  text-indent:0.28em;
}
@media(max-width:560px){ .footer{padding:20px} .status{margin-top:42px} }

@keyframes rise{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes expand{ to{width:44px} }
@keyframes fadein{ to{opacity:1} }
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(181,67,47,0.55)}
  70%{box-shadow:0 0 0 9px rgba(181,67,47,0)}
  100%{box-shadow:0 0 0 0 rgba(181,67,47,0)}
}
@media(prefers-reduced-motion:reduce){
  .mark,.wordmark,.rule,.tagline-ja,.tagline-en,.status,.footer{
    animation:none;opacity:1;transform:none;width:auto
  }
  .rule{width:44px}
  .status .dot{animation:none}
}
