/* Kohana. build-07 r10 (2026-11-03, local, not published) — loaded after build07g.css.
   1. Hero: light → the official logo → IBJ AWARD.
      - The light is the one of the 薄紗 (usuginu) prototype of 2026-10-31 (work/design-story-compare-20261031,
        fv-usuginu.css .veil::after: a soft gradient from the top that fades in once the veil is lifted), without the veil.
        Here it is a little wider and comes down from the top of the hero. It sits behind the logo, so the gold never washes out.
      - Then the mizuhiki is drawn (its own reveal, from 1.0s instead of 0.35s) and the script Kohana. rises softly (1.5s).
      - IBJ AWARD a little later (3.0s). Each plays once; only opacity / transform are animated.
   2. The doors (fv-tobira.css, unchanged) moved from the hero to ご成婚エピソード: closed until the section comes near,
      then they open once (letters-doors.js). Never blocks taps or scrolling; removed when open.
      No JavaScript or 「視差効果を減らす」: no doors, the letters are shown as they are. */

/* 1. hero */
/* the ivory starts a shade warmer at the top, so the light coming in reads as light (the static glow of r9 is left to the light) */
#top-fv{background:
  radial-gradient(circle at 4% calc(var(--hh) + var(--st)*.3),rgba(239,217,207,.4),rgba(239,217,207,0) 34%),
  radial-gradient(circle at 98% calc(var(--hh) + var(--st)*.12),rgba(234,220,196,.5),rgba(234,220,196,0) 36%),
  linear-gradient(180deg,#efe3d1 0,#f4eadc calc(var(--hh) + var(--st)*.6),var(--washi) calc(var(--hh) + var(--st) + 40px))}
@media(min-width:64em){#top-fv{background:
  radial-gradient(circle at 44% 12%,rgba(239,217,207,.36),rgba(239,217,207,0) 26%),
  radial-gradient(circle at 99% 88%,rgba(234,220,196,.5),rgba(234,220,196,0) 30%),
  linear-gradient(90deg,var(--washi) 30%,rgba(251,246,236,0) 55%),
  linear-gradient(180deg,#efe3d1,#f5ecdf 60%,var(--washi))}}
.fv-light{position:absolute;left:0;right:0;top:var(--hh);height:calc(var(--st) + 48px);z-index:0;pointer-events:none;overflow:hidden}
.fv-light::before{content:"";position:absolute;inset:-12% -15% 0;
 background:radial-gradient(ellipse 58% 80% at 50% 0,rgba(255,253,246,.96),rgba(255,251,240,.6) 42%,rgba(255,251,240,0) 76%);
 opacity:0;transform:translateY(-14%);animation:fvl-in 2.2s cubic-bezier(.25,.1,.25,1) .15s both}
/* the valance of 薄紗: a faint light edge at the top */
.fv-light::after{content:"";position:absolute;inset:0 0 auto 0;height:16%;background:linear-gradient(180deg,rgba(255,253,248,.55),rgba(255,253,248,0));
 opacity:0;animation:fvl-valance 1.2s ease .5s forwards}
/* a few very soft rays */
.fv-light i{position:absolute;inset:0 -10%;display:block;
 background:repeating-linear-gradient(98deg,rgba(255,252,242,0) 0 6%,rgba(255,252,242,.55) 8.5%,rgba(255,252,242,0) 11.5%);
 -webkit-mask:linear-gradient(180deg,#000,rgba(0,0,0,.35) 45%,transparent 80%);mask:linear-gradient(180deg,#000,rgba(0,0,0,.35) 45%,transparent 80%);
 opacity:0;transform:translateY(-8%);animation:fvl-rays 2.6s cubic-bezier(.25,.1,.25,1) .35s both}
@keyframes fvl-in{to{opacity:1;transform:none}}
@keyframes fvl-valance{to{opacity:1}}
@keyframes fvl-rays{to{opacity:.8;transform:none}}
@media(min-width:64em){.fv-light{left:34%;top:0;height:100%;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 28%);mask-image:linear-gradient(to right,transparent 0,#000 28%)}.fv-light::before{background:radial-gradient(ellipse 52% 70% at 50% 0,rgba(255,253,246,.96),rgba(255,251,240,.6) 42%,rgba(255,251,240,0) 76%)}.fv-light::after{height:12%}}
#top-fv .miz{animation-delay:1s}
.fv-script{animation:fvs-in 1.6s cubic-bezier(.25,.1,.25,1) 1.5s both}
@keyframes fvs-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
#top-fv>.iaw-adopted{animation-delay:3s}
@media(prefers-reduced-motion:reduce){
 .fv-light::before,.fv-light::after{animation:none;opacity:1;transform:none}.fv-light i{animation:none;opacity:.8;transform:none}
 .fv-script{animation:none}}

/* 2. doors over ご成婚エピソード */
#letters>.doors{display:none;top:0;bottom:auto;height:min(100%,100svh);left:max(0px,calc((100% - 1120px)/2));right:max(0px,calc((100% - 1120px)/2));z-index:2}
.js #letters>.doors{display:block}
#letters>.doors .glow,#letters>.doors .dl,#letters>.doors .dr{animation:none}
#letters.ld-open>.doors .glow{animation:tob-glow 2.8s ease both}
#letters.ld-open>.doors .dl{animation:tob-open-l 2.4s cubic-bezier(.62,.02,.28,1) .15s both}
#letters.ld-open>.doors .dr{animation:tob-open-r 2.4s cubic-bezier(.62,.02,.28,1) .15s both}
.js #letters.ld-done>.doors{display:none}
@media(prefers-reduced-motion:reduce){.js #letters>.doors{display:none}}
@media(forced-colors:active){.js #letters>.doors{display:none}}
