@font-face{font-family:"Sawarabi Mincho";src:url(fonts/sawarabi.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"BIZ UDPMincho";src:url(fonts/biz.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"BIZ UDPMincho";src:url(fonts/biz-bold.woff2) format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"Cormorant SC";src:url(fonts/cormorant-sc.woff2) format("woff2");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(fonts/ebg.woff2) format("woff2");font-style:normal;font-weight:400 600;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(fonts/ebg-italic.woff2) format("woff2");font-style:italic;font-weight:400 600;font-display:swap}
@font-face{font-family:"Cinzel";src:url(fonts/cinzel.woff2) format("woff2");font-style:normal;font-weight:400 700;font-display:swap}
@font-face{font-family:"Great Vibes";src:url(fonts/vibes.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}

.petals{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:40}
.petals i{position:absolute;top:-40px;display:block;width:18px;height:22px;background-size:contain;background-repeat:no-repeat;
  animation:fall linear infinite;opacity:.85}
.petals i:nth-child(1){left:8%;animation-duration:14s;animation-delay:0s;background-image:url(petals/p0.png);width:16px;height:20px}
.petals i:nth-child(2){left:22%;animation-duration:18s;animation-delay:2s;background-image:url(petals/p1.png);width:22px;height:26px}
.petals i:nth-child(3){left:38%;animation-duration:12s;animation-delay:4s;background-image:url(petals/p2.png)}
.petals i:nth-child(4){left:55%;animation-duration:16s;animation-delay:1s;background-image:url(petals/p3.png);width:20px;height:24px}
.petals i:nth-child(5){left:68%;animation-duration:20s;animation-delay:3s;background-image:url(petals/p0.png)}
.petals i:nth-child(6){left:82%;animation-duration:13s;animation-delay:5s;background-image:url(petals/p1.png);width:14px;height:18px}
.petals i:nth-child(7){left:15%;animation-duration:17s;animation-delay:7s;background-image:url(petals/p2.png)}
.petals i:nth-child(8){left:90%;animation-duration:15s;animation-delay:2.5s;background-image:url(petals/p3.png)}
@keyframes fall{0%{transform:translateY(-10vh) rotate(0deg);opacity:0}
10%{opacity:.9}100%{transform:translateY(110vh) rotate(360deg);opacity:.2}}
@media (prefers-reduced-motion:reduce){.petals{display:none}}

*{box-sizing:border-box}html,body{margin:0}
html{background:#0c1020}
body{font:18px/1.55 "EB Garamond","Sawarabi Mincho",Georgia,serif;color:#f3ebe0;min-height:100vh;
  background:#0c1020 url(scene/kimono-brocade.jpg) center/cover fixed}
a{color:#e0c078;text-decoration:none}
.veil{min-height:100vh;background:radial-gradient(ellipse at 50% 20%,rgba(12,16,32,.35),rgba(12,16,32,.82) 70%);
  padding:28px 16px 48px}
.panel{max-width:980px;margin:0 auto;background:rgba(248,241,228,.94);
  background-image:url(scene/sakura-petals.jpg);background-blend-mode:soft-light;background-size:cover;
  color:#1e1a14;border:10px solid transparent;border-image:linear-gradient(135deg,#c9a45a,#7a2e28,#1a2744,#c9a45a) 1;
  box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 4px rgba(201,164,90,.35);position:relative;overflow:hidden}
.panel::before{content:"";position:absolute;inset:0;border:1px solid rgba(201,164,90,.35);margin:8px;pointer-events:none;z-index:3}
.crest{text-align:center;padding:36px 24px 8px;position:relative;z-index:2}
.crest .mark{display:inline-block;width:56px;height:56px;background:#9c1f1a;color:#fff;font:700 16px/56px "BIZ UDPMincho",serif;
  letter-spacing:.05em;transform:rotate(-8deg);box-shadow:3px 4px 0 rgba(80,20,15,.35);margin-bottom:16px}
.eyebrow{font:600 11px/1 "Cormorant SC",serif;letter-spacing:.36em;text-transform:uppercase;color:#7a2e28;margin:0 0 12px}
h1{margin:0;font:600 40px/1.15 "Cormorant SC",serif;letter-spacing:.12em;text-transform:uppercase;color:#1a1520}
.artist{margin:12px 0 0;font:400 32px/1.2 "Great Vibes",cursive;color:#5c2030}
.lead{margin:16px auto 0;max-width:460px;font-style:italic;color:#5c4a3a}
.brocade-band{height:72px;margin:28px 0 0;background:url(scene/kimono-brocade.jpg) center/cover;
  box-shadow:inset 0 0 30px rgba(0,0,0,.45);border-top:2px solid #c9a45a;border-bottom:2px solid #c9a45a}
.works{padding:36px 28px 48px;position:relative;z-index:2}
.section-title{text-align:center;font:600 12px/1 "Cormorant SC",serif;letter-spacing:.3em;text-transform:uppercase;
  color:#5c4a32;margin:0 0 26px}
.scrolls{display:flex;flex-wrap:wrap;justify-content:center;gap:26px 18px}
.scroll{margin:0;width:150px;text-align:center}
.kake{display:flex;flex-direction:column;align-items:center;filter:drop-shadow(0 12px 18px rgba(40,20,10,.25));transition:transform .25s}
.kake:hover{transform:translateY(-3px)}
.rod{display:block;width:158px;height:9px;background:linear-gradient(180deg,#8a6a3e,#3d2a16);border-radius:2px}
.silk{display:block;width:140px;padding:9px 7px;background:linear-gradient(180deg,#fffaf0,#f0e4cc);
  border-left:5px solid #1a2744;border-right:5px solid #1a2744}
.silk img{display:block;width:100%;height:160px;object-fit:cover}
figcaption{margin-top:10px;font:600 10px/1.3 "Cormorant SC",serif;letter-spacing:.14em;text-transform:uppercase;color:#5c4a32}
.bio{text-align:center;font-style:italic;color:#6b5a44;margin:32px 24px 0}
.tools{display:block;width:min(420px,80%);margin:28px auto 8px;border-radius:4px;opacity:.92;
  box-shadow:0 8px 24px rgba(40,20,10,.2)}
footer{text-align:center;padding:22px 12px 8px;font:600 10px/1 "Cormorant SC",serif;letter-spacing:.28em;
  text-transform:uppercase;color:rgba(243,230,200,.55)}
@media(max-width:700px){h1{font-size:28px}.artist{font-size:26px}.scroll{width:42vw}.silk{width:38vw}.silk img{height:42vw}.rod{width:44vw}
.veil{padding:12px 8px 32px}.panel{border-width:6px}}
